diff --git a/packages/base/card-api.gts b/packages/base/card-api.gts
index 9295153dc1..9ada4e7726 100644
--- a/packages/base/card-api.gts
+++ b/packages/base/card-api.gts
@@ -1297,17 +1297,22 @@ class LinksToMany<FieldT extends CardDefConstructor>
           cachedInstance[isSavedInstance] = true;
           return cachedInstance;
         }
-        let resourceId = new URL(value.links.self, relativeTo).href;
+        let resourceId = new URL(
+          value.links.self,
+          !Array.isArray(doc.data) && 'id' in doc.data && doc.data.id
+            ? doc.data.id
+            : relativeTo,
+        ).href;
+        if (loadedValues && Array.isArray(loadedValues)) {
+          let loadedValue = loadedValues.find(
+            (v) => isCardOrField(v) && 'id' in v && v.id === resourceId,
+          );
+          if (loadedValue) {
+            return loadedValue;
+          }
+        }
         let resource = resourceFrom(doc, resourceId);
         if (!resource) {
-          if (loadedValues && Array.isArray(loadedValues)) {
-            let loadedValue = loadedValues.find(
-              (v) => isCardOrField(v) && 'id' in v && v.id === resourceId,
-            );
-            if (loadedValue) {
-              return loadedValue;
-            }
-          }
           return {
             type: 'not-loaded',
             reference: value.links.self,
diff --git a/packages/base/cards-grid.gts b/packages/base/cards-grid.gts
index 10038734b0..c3ba4e64b8 100644
--- a/packages/base/cards-grid.gts
+++ b/packages/base/cards-grid.gts
@@ -306,7 +306,7 @@ class Isolated extends Component<typeof CardsGrid> {
     </style>
   </template>
 
-  filters: { displayName: string; icon: IconComponent; query: any }[] =
+  filters: { displayName: string; icon: IconComponent | string; query: any }[] =
     new TrackedArray([
       {
         displayName: 'All Cards',
@@ -424,7 +424,11 @@ class Isolated extends Component<typeof CardsGrid> {
     }
     let cardTypeSummaries = (await response.json()).data as {
       id: string;
-      attributes: { displayName: string; total: number };
+      attributes: {
+        displayName: string;
+        total: number;
+        iconHTML: string | null;
+      };
     }[];
     let excludedCardTypeIds = [
       `${baseRealm.url}card-api/CardDef`,
@@ -441,7 +445,7 @@ class Isolated extends Component<typeof CardsGrid> {
       const lastIndex = summary.id.lastIndexOf('/');
       this.filters.push({
         displayName: summary.attributes.displayName,
-        icon: Captions,
+        icon: summary.attributes.iconHTML ?? Captions,
         query: {
           filter: {
             type: {
diff --git a/packages/boxel-ui/addon/src/components/filter-list/index.gts b/packages/boxel-ui/addon/src/components/filter-list/index.gts
index 961a08047e..0345c44ced 100644
--- a/packages/boxel-ui/addon/src/components/filter-list/index.gts
+++ b/packages/boxel-ui/addon/src/components/filter-list/index.gts
@@ -10,11 +10,13 @@ export interface FilterListIconSignature {
 
 export type FilterListIcon = ComponentLike<FilterListIconSignature>;
 
+import { htmlSafe } from '@ember/template';
+
 import { cn, eq } from '../../helpers.ts';
 
 export type Filter = {
   displayName: string;
-  icon: FilterListIcon;
+  icon: FilterListIcon | string;
 };
 
 interface Signature {
@@ -39,9 +41,16 @@ export default class FilterList extends Component<Signature> {
           class={{cn 'filter-list__button' selected=(eq @activeFilter filter)}}
           {{on 'click' (fn this.onChanged filter)}}
           data-test-boxel-filter-list-button={{filter.displayName}}
-        ><filter.icon
-            class='filter-list__icon'
-          />{{filter.displayName}}</button>
+        >
+          {{#if (isIconString filter.icon)}}
+            {{htmlSafe
+              (addClassToSVG filter.icon 'filter-list__icon')
+            }}{{filter.displayName}}
+          {{else}}
+            <filter.icon
+              class='filter-list__icon'
+            />{{filter.displayName}}{{/if}}</button>
+
       {{/each}}
     </div>
     <style scoped>
@@ -58,6 +67,9 @@ export default class FilterList extends Component<Signature> {
         font: 500 var(--boxel-font-sm);
         padding: var(--boxel-sp-xxs);
         margin-bottom: var(--boxel-sp-4xs);
+
+        display: flex;
+        gap: var(--boxel-sp-4xs);
       }
       .filter-list__button.selected {
         color: var(--boxel-light);
@@ -68,7 +80,7 @@ export default class FilterList extends Component<Signature> {
         background: var(--boxel-300);
         border-radius: 6px;
       }
-      .filter-list__icon {
+      :global(.filter-list__icon) {
         width: var(--boxel-icon-xs);
         height: var(--boxel-icon-xs);
         vertical-align: top;
@@ -76,3 +88,13 @@ export default class FilterList extends Component<Signature> {
     </style>
   </template>
 }
+
+function addClassToSVG(svgString: string, className: string) {
+  return svgString
+    .replace(/<svg\b([^>]*)\sclass="([^"]*)"/, `<svg$1 class="$2 ${className}"`)
+    .replace(/<svg\b([^>]*)>/, `<svg$1 class="${className}">`);
+}
+
+function isIconString(icon: FilterListIcon | string): icon is string {
+  return typeof icon === 'string';
+}
diff --git a/packages/experiments-realm/CatalogEntry/tag.json b/packages/experiments-realm/CatalogEntry/tag.json
new file mode 100644
index 0000000000..db4d9831a1
--- /dev/null
+++ b/packages/experiments-realm/CatalogEntry/tag.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Tag",
+      "description": "Catalog entry for Tag",
+      "ref": {
+        "name": "Tag",
+        "module": "../tag"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/CatalogEntry/team-member.json b/packages/experiments-realm/CatalogEntry/team-member.json
new file mode 100644
index 0000000000..0f04ce5802
--- /dev/null
+++ b/packages/experiments-realm/CatalogEntry/team-member.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Team Member",
+      "description": "Catalog entry for Team Member",
+      "ref": {
+        "name": "TeamMember",
+        "module": "../sprint-task"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/CatalogEntry/team.json b/packages/experiments-realm/CatalogEntry/team.json
new file mode 100644
index 0000000000..d259682406
--- /dev/null
+++ b/packages/experiments-realm/CatalogEntry/team.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Team",
+      "description": "Catalog entry for Team",
+      "ref": {
+        "name": "Team",
+        "module": "../sprint-task"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json b/packages/experiments-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json
index d157f084e8..d30fa2fefc 100644
--- a/packages/experiments-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json
+++ b/packages/experiments-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json
@@ -8,7 +8,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "Project"
       }
     }
diff --git a/packages/experiments-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json b/packages/experiments-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json
index 5db9830baf..4e1e461909 100644
--- a/packages/experiments-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json
+++ b/packages/experiments-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json
@@ -8,7 +8,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "Project"
       }
     }
diff --git a/packages/experiments-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json b/packages/experiments-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json
index 98ca79b863..27030b89d9 100644
--- a/packages/experiments-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json
+++ b/packages/experiments-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json
@@ -2,15 +2,7 @@
   "data": {
     "type": "card",
     "attributes": {
-      "tabs": [],
-      "headerIcon": {
-        "altText": null,
-        "size": "actual",
-        "height": null,
-        "width": null,
-        "base64": null
-      },
-      "moduleId": null,
+      "title": "Engineering Team Sprint",
       "description": null,
       "thumbnailURL": null
     },
diff --git a/packages/experiments-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json b/packages/experiments-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json
index ef2612133e..831a182826 100644
--- a/packages/experiments-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json
+++ b/packages/experiments-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json
@@ -3,10 +3,10 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
         "index": 1,
         "label": "Next Sprint",
-        "color": "#64B5F6"
+        "color": "#64B5F6",
+        "completed": false
       },
       "dateRange": {
         "start": "2024-12-08",
@@ -16,8 +16,8 @@
         "index": 1,
         "label": "Medium"
       },
-      "name": "Pill Picker Example",
-      "details": "Use multi-select but for pills",
+      "name": "Create Pill Picker Example",
+      "details": "Implementation of a multi-select component using pills UI pattern, intended for use in the multi-filter feature. Users can select multiple pills simultaneously.\n\n**Note:** *This ticket is no longer relevant*",
       "description": null,
       "thumbnailURL": null
     },
@@ -39,28 +39,18 @@
       },
       "assignee": {
         "links": {
-          "self": null
+          "self": "../TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a"
         }
       },
       "tags.0": {
-        "links": {
-          "self": "../Tag/ad921cba-ffc7-4fdb-af34-ab8b93eae228"
-        }
-      },
-      "tags.1": {
         "links": {
           "self": "../Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5"
         }
-      },
-      "tags.2": {
-        "links": {
-          "self": "../Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98"
-        }
       }
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json b/packages/experiments-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json
index a807236011..f2779bcf6f 100644
--- a/packages/experiments-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json
+++ b/packages/experiments-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json
@@ -3,14 +3,14 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
-        "index": 2,
-        "label": "Current Sprint",
-        "color": "#00BCD4"
+        "index": 4,
+        "label": "In Review",
+        "color": "#9575CD",
+        "completed": false
       },
       "dateRange": {
-        "start": "2024-10-09",
-        "end": "2024-10-11"
+        "start": "2024-10-10",
+        "end": "2025-01-09"
       },
       "priority": {
         "index": null,
@@ -44,7 +44,7 @@
       },
       "assignee": {
         "links": {
-          "self": "../TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a"
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
         }
       },
       "tags.0": {
@@ -60,7 +60,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json b/packages/experiments-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json
index 6f18fdfbf4..4dc6c0fc9e 100644
--- a/packages/experiments-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json
+++ b/packages/experiments-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json
@@ -3,26 +3,21 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
         "index": 2,
         "label": "Current Sprint",
-        "color": "#00BCD4"
+        "color": "#00BCD4",
+        "completed": false
       },
       "dateRange": {
-        "start": "2024-11-18",
-        "end": "2024-11-19"
+        "start": "2024-12-19",
+        "end": "2025-01-09"
       },
       "priority": {
-        "index": null,
-        "label": null,
-        "color": null,
-        "colorScheme": {
-          "foregroundColor": null,
-          "backgroundColor": null
-        }
+        "index": 2,
+        "label": "Medium"
       },
-      "name": "Embedded Template for Status and Priority",
-      "details": null,
+      "name": "Implement Status and Priority Template Component with Dynamic Rendering",
+      "details": "Technical implementation of a reusable template component for displaying status and priority indicators across the application. Requirements include:\n- Create base template structure\n- Implement dynamic color rendering based on status\n- Add priority level visualization\n- Ensure accessibility compliance\n- Add unit tests for component",
       "description": null,
       "thumbnailURL": null
     },
@@ -55,7 +50,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json b/packages/experiments-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json
index 3150d7ebd1..976286cce0 100644
--- a/packages/experiments-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json
+++ b/packages/experiments-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json
@@ -3,10 +3,10 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
-        "index": 2,
-        "label": "Current Sprint",
-        "color": "#00BCD4"
+        "index": 5,
+        "label": "Staged",
+        "color": "#26A69A",
+        "completed": false
       },
       "dateRange": {
         "start": "2024-11-06",
@@ -16,8 +16,8 @@
         "index": 1,
         "label": "Medium"
       },
-      "name": "Port the already done work for CRM from fork into boxel ui design system",
-      "details": "https://github.com/tintinthong/boxel/pull/1 CRM for reference. This is the PR that is constantly merged in",
+      "name": "Port the already done work for CRM into the monorepo",
+      "details": "Copy the existing work that has been carried out through spikes and git commit to our monorepo",
       "description": null,
       "thumbnailURL": null
     },
@@ -32,14 +32,9 @@
           "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
         }
       },
-      "subtasks.0": {
+      "subtasks": {
         "links": {
-          "self": "./20058a9d-3c2d-4b42-8430-a95b6183245c"
-        }
-      },
-      "subtasks.1": {
-        "links": {
-          "self": "./9e23b8b5-d541-48ef-a652-e7afefb29777"
+          "self": null
         }
       },
       "assignee": {
@@ -65,7 +60,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json b/packages/experiments-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json
index bf019d15fb..3052a78d24 100644
--- a/packages/experiments-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json
+++ b/packages/experiments-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json
@@ -3,10 +3,10 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
         "index": 3,
         "label": "In Progress",
-        "color": "#FFB74D"
+        "color": "#FFB74D",
+        "completed": false
       },
       "dateRange": {
         "start": "2024-11-19",
@@ -17,7 +17,7 @@
         "label": "High"
       },
       "name": "Make fitted / embeddedd view for task",
-      "details": null,
+      "details": "Implement a responsive task view that adapts to its container size using container queries (@container), allowing tasks to be embedded in different contexts while maintaining proper layout and readability. This will ensure consistent display whether tasks appear in boards, lists, or as embedded components.",
       "description": null,
       "thumbnailURL": null
     },
@@ -39,18 +39,18 @@
       },
       "assignee": {
         "links": {
-          "self": null
+          "self": "../TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be"
         }
       },
-      "tags": {
+      "tags.0": {
         "links": {
-          "self": null
+          "self": "../Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98"
         }
       }
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json b/packages/experiments-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json
index dd7adb9eee..2ab10341a2 100644
--- a/packages/experiments-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json
+++ b/packages/experiments-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json
@@ -3,10 +3,10 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
-        "index": 0,
-        "label": "Not Started",
-        "color": "#B0BEC5"
+        "index": 6,
+        "label": "Shipped",
+        "color": "#66BB6A",
+        "completed": true
       },
       "dateRange": {
         "start": "2024-11-06",
@@ -16,8 +16,8 @@
         "index": null,
         "label": null
       },
-      "name": "Create kanban board",
-      "details": null,
+      "name": "Build Kanban Board Component",
+      "details": "Implement drag and drop functionality using ember-modifier-drag-and-drop:\n\n- Install addon and implement TypeScript interfaces for events/data transfer\n- Create reusable drag/drop modifiers with visual feedback and preview\n- Add validation logic and write tests",
       "description": null,
       "thumbnailURL": null
     },
@@ -50,7 +50,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json b/packages/experiments-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json
index 1b726fed81..59c53d3917 100644
--- a/packages/experiments-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json
+++ b/packages/experiments-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json
@@ -3,21 +3,21 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
-        "index": 3,
-        "label": "In Progress",
-        "color": "#FFB74D"
+        "index": 2,
+        "label": "Current Sprint",
+        "color": "#00BCD4",
+        "completed": false
       },
       "dateRange": {
         "start": null,
         "end": null
       },
       "priority": {
-        "index": null,
-        "label": null
+        "index": 4,
+        "label": "Highest"
       },
       "name": "Fill up task board with realistic data",
-      "details": null,
+      "details": "### Objective\nPopulate the task board with realistic sample data that demonstrates the full capabilities of our markdown and task tracking features.\n\n#### Requirements\n- [ ] Add variety of task statuses (Todo, In Progress, Done)\n- [ ] Include tasks with different priority levels\n- [ ] Create sample tasks with rich markdown content\n- [ ] Add realistic date ranges and deadlines",
       "description": null,
       "thumbnailURL": null
     },
@@ -42,15 +42,15 @@
           "self": "../TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086"
         }
       },
-      "tags": {
+      "tags.0": {
         "links": {
-          "self": null
+          "self": "../Tag/6d80a75f-71bb-474f-979d-ef4bc571ad63"
         }
       }
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json b/packages/experiments-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json
index 11aced6955..a5229e4f23 100644
--- a/packages/experiments-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json
+++ b/packages/experiments-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json
@@ -3,21 +3,21 @@
     "type": "card",
     "attributes": {
       "status": {
-        "index": 0,
-        "label": "Not Started",
-        "color": "#B0BEC5",
+        "index": 4,
+        "label": "In Review",
+        "color": "#9575CD",
         "completed": false
       },
       "dateRange": {
         "start": "2024-11-20",
-        "end": "2024-11-21"
+        "end": "2024-11-27"
       },
       "priority": {
         "index": null,
         "label": null
       },
-      "name": "Drag and drop task",
-      "details": null,
+      "name": "Implement Cross-Component Drag and Drop System",
+      "details": "Design and implement a robust drag and drop system with the following specifications:\n\n- Evaluate and integrate a suitable drag and drop library (e.g., react-dnd, dnd-kit, or sortablejs)\n- Create reusable drag and drop hooks/utilities\n- Implement drag source and drop target abstractions\n- Add visual feedback during drag operations\n- Handle drag preview with custom styling\n- Implement drop validation logic\n- Add support for touch devices\n- Create comprehensive test suite for DnD interactions\n- Document library integration and custom implementation details",
       "description": null,
       "thumbnailURL": null
     },
@@ -50,9 +50,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json b/packages/experiments-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json
index 9ea0c99eb9..649d317a2f 100644
--- a/packages/experiments-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json
+++ b/packages/experiments-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json
@@ -3,10 +3,10 @@
     "type": "card",
     "attributes": {
       "status": {
-        "completed": false,
-        "index": 3,
-        "label": "In Progress",
-        "color": "#FFB74D"
+        "index": 2,
+        "label": "Current Sprint",
+        "color": "#00BCD4",
+        "completed": false
       },
       "dateRange": {
         "start": null,
@@ -17,7 +17,7 @@
         "label": null
       },
       "name": "Resolve bug where overlay only appears on certain cards",
-      "details": null,
+      "details": "The overlay is only appearing on specific cards due to a faulty modifier that's not being applied consistently across all card instances.",
       "description": null,
       "thumbnailURL": null
     },
@@ -39,18 +39,18 @@
       },
       "assignee": {
         "links": {
-          "self": null
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
         }
       },
-      "tags": {
+      "tags.0": {
         "links": {
-          "self": null
+          "self": "../Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc"
         }
       }
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json b/packages/experiments-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json
index 8c83e02911..44206a770e 100644
--- a/packages/experiments-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json
+++ b/packages/experiments-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json
@@ -17,7 +17,7 @@
         "label": null
       },
       "name": "Incoporate Boxel Multi Select in Dropdown",
-      "details": null,
+      "details": "Integrate Boxel's multi-select dropdown component to be more unified with the single-select dropdown.\n\nThe trigger component should share the same designs.",
       "description": null,
       "thumbnailURL": null
     },
@@ -50,7 +50,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/c734e2c7-71d9-446e-a2c1-e6e930fcee55.json b/packages/experiments-realm/SprintTask/a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3.json
similarity index 60%
rename from packages/experiments-realm/SprintTask/c734e2c7-71d9-446e-a2c1-e6e930fcee55.json
rename to packages/experiments-realm/SprintTask/a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3.json
index 8ba75e2e92..0e0b089c0b 100644
--- a/packages/experiments-realm/SprintTask/c734e2c7-71d9-446e-a2c1-e6e930fcee55.json
+++ b/packages/experiments-realm/SprintTask/a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3.json
@@ -3,9 +3,9 @@
     "type": "card",
     "attributes": {
       "status": {
-        "index": 3,
-        "label": "In Progress",
-        "color": "#FFB74D",
+        "index": 1,
+        "label": "Next Sprint",
+        "color": null,
         "completed": false
       },
       "dateRange": {
@@ -13,10 +13,10 @@
         "end": null
       },
       "priority": {
-        "index": 0,
-        "label": "Low"
+        "index": 4,
+        "label": "Highest"
       },
-      "name": "Add functionality where + opens create card modal with correct status",
+      "name": "Calendar displays wrong date after closing",
       "details": null,
       "description": null,
       "thumbnailURL": null
@@ -24,12 +24,12 @@
     "relationships": {
       "project": {
         "links": {
-          "self": "../Project/9b43240d-8c9c-42bc-a4d1-f9c626661562"
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
         }
       },
       "team": {
         "links": {
-          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+          "self": null
         }
       },
       "subtasks": {
@@ -39,18 +39,18 @@
       },
       "assignee": {
         "links": {
-          "self": "../TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be"
+          "self": null
         }
       },
-      "tags": {
+      "tags.0": {
         "links": {
-          "self": null
+          "self": "../Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc"
         }
       }
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json b/packages/experiments-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json
index 8af6ba7a4b..0c59d1133f 100644
--- a/packages/experiments-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json
+++ b/packages/experiments-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json
@@ -50,9 +50,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json b/packages/experiments-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json
index 7b0ec1cd57..0376341087 100644
--- a/packages/experiments-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json
+++ b/packages/experiments-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json
@@ -13,11 +13,11 @@
         "end": "2024-12-17"
       },
       "priority": {
-        "index": null,
-        "label": null
+        "index": 0,
+        "label": "Lowest"
       },
       "name": "Build Date Range Card",
-      "details": null,
+      "details": "",
       "description": null,
       "thumbnailURL": null
     },
@@ -32,9 +32,14 @@
           "self": "../Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55"
         }
       },
-      "subtasks": {
+      "subtasks.0": {
+        "links": {
+          "self": "./a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3"
+        }
+      },
+      "subtasks.1": {
         "links": {
-          "self": null
+          "self": "./d9fdfbbc-fb17-41d9-90a2-c5765819930b"
         }
       },
       "assignee": {
@@ -42,17 +47,17 @@
           "self": "../TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086"
         }
       },
-      "tags": {
+      "tags.0": {
         "links": {
-          "self": null
+          "self": "../Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98"
         }
       }
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/SprintTask/d9fdfbbc-fb17-41d9-90a2-c5765819930b.json b/packages/experiments-realm/SprintTask/d9fdfbbc-fb17-41d9-90a2-c5765819930b.json
new file mode 100644
index 0000000000..d230492914
--- /dev/null
+++ b/packages/experiments-realm/SprintTask/d9fdfbbc-fb17-41d9-90a2-c5765819930b.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 1,
+        "label": "Next Sprint",
+        "color": null,
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2025-01-09",
+        "end": "2025-01-12"
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Integrate Ember Power Calendar Picker",
+      "details": "Create a date range picker component using Ember Power Calendar with built-in validation to prevent end dates being set before start dates. Component should be implemented within a dropdown for better UX, following this pattern:\n\n1. Click triggers dropdown with calendar\n2. First click sets start date\n3. Second click sets end date (with validation)\n4. Invalid date ranges should be prevented and show validation feedback\n\n**Technical Requirements:**\n- Use `ember-power-calendar` for the calendar implementation\n- Implement date validation logic in the component\n- Style dropdown to match our design system",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": null
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": null
+        }
+      },
+      "tags": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json b/packages/experiments-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json
index b5f6791058..c625a07921 100644
--- a/packages/experiments-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json
+++ b/packages/experiments-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json
@@ -50,7 +50,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/experiments-realm/Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc.json b/packages/experiments-realm/Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc.json
new file mode 100644
index 0000000000..4c7f6196c4
--- /dev/null
+++ b/packages/experiments-realm/Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Bug",
+      "color": "#FFCCCB",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json b/packages/experiments-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json
index 4719eab7b2..ded61fd31b 100644
--- a/packages/experiments-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json
+++ b/packages/experiments-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json
@@ -8,9 +8,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "Team"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json b/packages/experiments-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json
index 6032ebd96a..fc3e5ca3c3 100644
--- a/packages/experiments-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json
+++ b/packages/experiments-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json
@@ -8,9 +8,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "Team"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json b/packages/experiments-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json
index f06ead1d06..a96a2f91be 100644
--- a/packages/experiments-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json
+++ b/packages/experiments-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json
@@ -16,7 +16,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "TeamMember"
       }
     }
diff --git a/packages/experiments-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json b/packages/experiments-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json
index 247108b2df..8c1fa2b79d 100644
--- a/packages/experiments-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json
+++ b/packages/experiments-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json
@@ -16,9 +16,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "TeamMember"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json b/packages/experiments-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json
index 96839e818b..32c36b206b 100644
--- a/packages/experiments-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json
+++ b/packages/experiments-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json
@@ -16,9 +16,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "TeamMember"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json b/packages/experiments-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json
index ff921dbde5..61eff946d8 100644
--- a/packages/experiments-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json
+++ b/packages/experiments-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json
@@ -16,9 +16,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "TeamMember"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json b/packages/experiments-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json
index c0963ed97a..098ecf72e8 100644
--- a/packages/experiments-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json
+++ b/packages/experiments-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json
@@ -16,9 +16,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "TeamMember"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments-realm/atom-examples.gts b/packages/experiments-realm/atom-examples.gts
index 81aea3a4fb..7e5d03ac98 100644
--- a/packages/experiments-realm/atom-examples.gts
+++ b/packages/experiments-realm/atom-examples.gts
@@ -17,7 +17,7 @@ import { Button } from '@cardstack/boxel-ui/components';
 import { Author } from './author';
 import { Pet } from './pet';
 import { Country } from './country';
-import { TeamMember } from './productivity/task';
+import { TeamMember } from './sprint-task';
 import { Company } from './crm/company';
 import { Contact } from './crm/contact';
 import { ContactLinkField } from './fields/contact-link';
diff --git a/packages/experiments-realm/components/activity-card.gts b/packages/experiments-realm/components/activity-card.gts
index b5277ff520..853e9a1819 100644
--- a/packages/experiments-realm/components/activity-card.gts
+++ b/packages/experiments-realm/components/activity-card.gts
@@ -1,12 +1,8 @@
 import GlimmerComponent from '@glimmer/component';
-import EntityDisplayWithThumbnail from './entity-thumbnail-display';
 
 interface ActivityCardArgs {
   Blocks: {
-    title?: [];
-    thumbnail?: [];
-    description?: [];
-    icon?: [];
+    header?: [];
     content?: [];
   };
   Element: HTMLElement;
@@ -15,34 +11,9 @@ interface ActivityCardArgs {
 export default class ActivityCard extends GlimmerComponent<ActivityCardArgs> {
   <template>
     <article class='activity-card' ...attributes>
-      <header class='activity-card-header'>
-        <div class='activity-card-title-desc-group'>
-          <EntityDisplayWithThumbnail>
-            <:title>
-              <span class='activity-card-title'>
-                {{yield to='title'}}
-              </span>
-            </:title>
-            <:thumbnail>
-              <span class='activity-card-thumbnail'>
-                {{yield to='thumbnail'}}
-              </span>
-            </:thumbnail>
-          </EntityDisplayWithThumbnail>
-
-          {{#if (has-block 'description')}}
-            <p class='activity-card-description'>
-              {{yield to='description'}}
-            </p>
-          {{/if}}
-        </div>
-
-        <div class='activity-card-icon'>
-          {{#if (has-block 'icon')}}
-            {{yield to='icon'}}
-          {{/if}}
-        </div>
-      </header>
+      {{#if (has-block 'header')}}
+        {{yield to='header'}}
+      {{/if}}
 
       <hr class='activity-card-divider' />
 
@@ -56,62 +27,15 @@ export default class ActivityCard extends GlimmerComponent<ActivityCardArgs> {
     <style scoped>
       .activity-card {
         background: var(--activity-card-bg, var(--boxel-light));
-        border: 1px solid var(--activity-card-border, var(--boxel-300));
-        border-radius: var(
-          --activity-card-border-radius,
-          var(--boxel-border-radius-xl)
-        );
         padding: var(--activity-card-padding, var(--boxel-sp-sm));
+        border: 1px solid var(--activity-card-border-color, transparent);
+        border-radius: var(--activity-card-border-radius, 0px);
         display: flex;
         flex-direction: column;
         justify-content: space-between;
         gap: var(--activity-card-gap, 0);
         overflow: hidden;
         min-width: 0;
-        container-type: inline-size;
-      }
-      .activity-card-header {
-        display: flex;
-        flex-wrap: wrap;
-        align-items: center;
-        justify-content: space-between;
-        gap: var(--activity-card-header-gap, var(--boxel-sp-sm));
-      }
-      .activity-card-title-desc-group {
-        display: flex;
-        align-items: center;
-        gap: var(--activity-card-title-desc-group-gap, var(--boxel-sp-sm));
-      }
-      /* extend from entity-display */
-      .activity-card-thumbnail {
-        flex-shrink: 0;
-        width: var(--entity-display-thumbnail-size, var(--boxel-icon-sm));
-        height: var(--entity-display-thumbnail-size, var(--boxel-icon-sm));
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        color: var(--entity-display-thumbnail-color, var(--boxel-600));
-      }
-      .activity-card-title {
-        font-size: var(
-          --activity-card-title-font-size,
-          var(--boxel-font-size-sm)
-        );
-        font-weight: var(--activity-card-title-font-weight, 600);
-        margin: 0;
-      }
-      .activity-card-description {
-        margin: 0;
-        font-size: var(
-          --activity-card-description-font-size,
-          var(--boxel-font-size-sm)
-        );
-        color: var(--activity-card-description-color, var(--boxel-400));
-      }
-      .activity-card-icon {
-        flex-shrink: 0;
-        width: var(--activity-card-icon-size, auto);
-        height: var(--activity-card-icon-size, auto);
       }
       .activity-card-divider {
         border-top: 1px solid
@@ -121,21 +45,6 @@ export default class ActivityCard extends GlimmerComponent<ActivityCardArgs> {
       .activity-card-content {
         padding: var(--activity-card-content-padding, var(--boxel-sp-sm));
       }
-
-      @container (max-width: 447px) {
-        .activity-card-header {
-          align-items: flex-start;
-        }
-
-        .activity-card-title-desc-group {
-          flex-direction: column;
-          align-items: flex-start;
-          gap: var(--boxel-sp-xxxs);
-        }
-        .activity-card-content {
-          padding: var(--activity-card-content-padding, 0);
-        }
-      }
     </style>
   </template>
 }
diff --git a/packages/experiments-realm/components/entity-icon-display.gts b/packages/experiments-realm/components/entity-icon-display.gts
index 73cc4142d1..847d46f8fa 100644
--- a/packages/experiments-realm/components/entity-icon-display.gts
+++ b/packages/experiments-realm/components/entity-icon-display.gts
@@ -77,10 +77,15 @@ export default class EntityDisplayWithIcon extends GlimmerComponent<EntityDispla
           --entity-display-title-font-size,
           var(--boxel-font-size-sm)
         );
+        --title-font-weight: var(--entity-display-title-font-weight, 600);
         --content-font-size: var(
           --entity-display-content-font-size,
           var(--boxel-font-size-xs)
         );
+        --content-font-weight: var(
+          --entity-display-content-font-weight,
+          var(--boxel-font-weight-normal)
+        );
         --content-color: var(--entity-display-content-color, var(--boxel-400));
         --content-gap: var(--entity-display-content-gap, var(--boxel-sp-xxxs));
         display: flex;
@@ -112,6 +117,7 @@ export default class EntityDisplayWithIcon extends GlimmerComponent<EntityDispla
       .entity-title {
         word-break: break-word;
         font-size: var(--title-font-size);
+        font-weight: var(--title-font-weight);
       }
       .entity-title.underline {
         text-decoration: underline;
@@ -119,6 +125,7 @@ export default class EntityDisplayWithIcon extends GlimmerComponent<EntityDispla
       .entity-content {
         margin: 0;
         font-size: var(--content-font-size);
+        font-weight: var(--content-font-weight);
         color: var(--content-color);
       }
     </style>
diff --git a/packages/experiments-realm/components/entity-thumbnail-display.gts b/packages/experiments-realm/components/entity-thumbnail-display.gts
index 26aac840e9..0d4f7ce3d7 100644
--- a/packages/experiments-realm/components/entity-thumbnail-display.gts
+++ b/packages/experiments-realm/components/entity-thumbnail-display.gts
@@ -80,10 +80,15 @@ export default class EntityDisplayWithThumbnail extends GlimmerComponent<EntityD
           --entity-display-title-font-size,
           var(--boxel-font-size-sm)
         );
+        --title-font-weight: var(--entity-display-title-font-weight, 600);
         --content-font-size: var(
           --entity-display-content-font-size,
           var(--boxel-font-size-xs)
         );
+        --content-font-weight: var(
+          --entity-display-content-font-weight,
+          var(--boxel-font-weight-normal)
+        );
         --content-color: var(--entity-display-content-color, var(--boxel-400));
         --content-gap: var(--entity-display-content-gap, var(--boxel-sp-xxxs));
         display: flex;
@@ -116,6 +121,7 @@ export default class EntityDisplayWithThumbnail extends GlimmerComponent<EntityD
       .entity-title {
         word-break: break-word;
         font-size: var(--title-font-size);
+        font-weight: var(--title-font-weight);
       }
       .entity-title.underline {
         text-decoration: underline;
@@ -123,6 +129,7 @@ export default class EntityDisplayWithThumbnail extends GlimmerComponent<EntityD
       .entity-content {
         margin: 0;
         font-size: var(--content-font-size);
+        font-weight: var(--content-font-weight);
         color: var(--content-color);
       }
     </style>
diff --git a/packages/experiments-realm/productivity/filter-display.gts b/packages/experiments-realm/components/filter/filter-display.gts
similarity index 100%
rename from packages/experiments-realm/productivity/filter-display.gts
rename to packages/experiments-realm/components/filter/filter-display.gts
diff --git a/packages/experiments-realm/productivity/filter-dropdown-item.gts b/packages/experiments-realm/components/filter/filter-dropdown-item.gts
similarity index 100%
rename from packages/experiments-realm/productivity/filter-dropdown-item.gts
rename to packages/experiments-realm/components/filter/filter-dropdown-item.gts
diff --git a/packages/experiments-realm/productivity/filter-dropdown.gts b/packages/experiments-realm/components/filter/filter-dropdown.gts
similarity index 100%
rename from packages/experiments-realm/productivity/filter-dropdown.gts
rename to packages/experiments-realm/components/filter/filter-dropdown.gts
diff --git a/packages/experiments-realm/productivity/filter-trigger.gts b/packages/experiments-realm/components/filter/filter-trigger.gts
similarity index 100%
rename from packages/experiments-realm/productivity/filter-trigger.gts
rename to packages/experiments-realm/components/filter/filter-trigger.gts
diff --git a/packages/experiments-realm/crm/account.gts b/packages/experiments-realm/crm/account.gts
index edf0725047..9d88ac21f2 100644
--- a/packages/experiments-realm/crm/account.gts
+++ b/packages/experiments-realm/crm/account.gts
@@ -25,13 +25,8 @@ import ContactIcon from '@cardstack/boxel-icons/contact';
 import CalendarExclamation from '@cardstack/boxel-icons/calendar-exclamation';
 import { LooseGooseyField } from '../loosey-goosey';
 import { StatusPill } from '../components/status-pill';
-import { Avatar, Pill, BoxelButton } from '@cardstack/boxel-ui/components';
-import EntityDisplayWithIcon from '../components/entity-icon-display';
-import EntityDisplayWithThumbnail from '../components/entity-thumbnail-display';
-import ActivityCard from '../components/activity-card';
+import { BoxelButton } from '@cardstack/boxel-ui/components';
 import PlusIcon from '@cardstack/boxel-icons/plus';
-import PhoneIcon from '@cardstack/boxel-icons/phone';
-import SquareUser from '@cardstack/boxel-icons/square-user';
 import CalendarTime from '@cardstack/boxel-icons/calendar-time';
 import ClockExclamation from '@cardstack/boxel-icons/clock-exclamation';
 import Clock24 from '@cardstack/boxel-icons/clock-24';
@@ -274,56 +269,7 @@ class IsolatedTemplate extends Component<typeof Account> {
             </BoxelButton>
           </:icon>
           <:content>
-            <ActivityCard>
-              <:thumbnail>
-                <PhoneIcon />
-              </:thumbnail>
-              <:title>
-                Customer Call
-              </:title>
-              <:icon>
-                <Pill class='activity-pill'>
-                  Left VoiceMail
-                </Pill>
-              </:icon>
-              <:description>
-                Discuss Q3 product roadmap
-              </:description>
-              <:content>
-                <div class='activity-card-group'>
-                  <EntityDisplayWithIcon @title='Technova'>
-                    <:icon>
-                      <SquareUser />
-                    </:icon>
-                    <:content>
-                      Technova
-                    </:content>
-                  </EntityDisplayWithIcon>
-                  <EntityDisplayWithThumbnail @title='Rep: Janus Dios'>
-                    <:thumbnail>
-                      <Avatar
-                        @thumbnailURL='https://images.pexels.com/photos/1624229/pexels-photo-1624229.jpeg?auto=compress&cs=tinysrgb&w=300&h=300&dpr=2'
-                        class='avatar'
-                      />
-                    </:thumbnail>
-                    <:content>
-                      Sales Associate
-                    </:content>
-                  </EntityDisplayWithThumbnail>
-                  <EntityDisplayWithIcon
-                    class='activity-time'
-                    @title='May 15, 2024'
-                  >
-                    <:icon>
-                      <CalendarTime />
-                    </:icon>
-                    <:content>
-                      3:15pm
-                    </:content>
-                  </EntityDisplayWithIcon>
-                </div>
-              </:content>
-            </ActivityCard>
+            {{! remove activity mock }}
           </:content>
         </SummaryCard>
       </:activities>
diff --git a/packages/experiments-realm/crm/contact.gts b/packages/experiments-realm/crm/contact.gts
index 8d29b1c062..b5afa3db3b 100644
--- a/packages/experiments-realm/crm/contact.gts
+++ b/packages/experiments-realm/crm/contact.gts
@@ -48,9 +48,7 @@ export class SocialLinkField extends ContactLinkField {
 
 class EmbeddedTemplate extends Component<typeof Contact> {
   get hasSocialLinks() {
-    return (
-      this.args.model.socialLinks && this.args.model.socialLinks.length > 0
-    );
+    return Boolean(this.args.model?.socialLinks?.length);
   }
 
   <template>
@@ -120,9 +118,7 @@ class EmbeddedTemplate extends Component<typeof Contact> {
 
 class FittedTemplate extends Component<typeof Contact> {
   get hasSocialLinks() {
-    return (
-      this.args.model.socialLinks && this.args.model.socialLinks.length > 0
-    );
+    return Boolean(this.args.model?.socialLinks?.length);
   }
 
   <template>
diff --git a/packages/experiments-realm/date-range-field.gts b/packages/experiments-realm/fields/date-range-field.gts
similarity index 100%
rename from packages/experiments-realm/date-range-field.gts
rename to packages/experiments-realm/fields/date-range-field.gts
diff --git a/packages/experiments-realm/sprint-planner.gts b/packages/experiments-realm/sprint-planner.gts
index 59449c1958..ba43847d6e 100644
--- a/packages/experiments-realm/sprint-planner.gts
+++ b/packages/experiments-realm/sprint-planner.gts
@@ -24,19 +24,13 @@ import { IconPlus } from '@cardstack/boxel-ui/icons';
 import { action } from '@ember/object';
 import { LooseSingleCardDocument, getCards } from '@cardstack/runtime-common';
 import { restartableTask } from 'ember-concurrency';
-// @ts-expect-error path resolution issue
-import { AppCard } from '/experiments/app-card';
-import {
-  SprintTaskStatusField,
-  Project,
-  SprintTask,
-} from './productivity/task';
-import { FilterDropdown } from './productivity/filter-dropdown';
-import { StatusPill } from './productivity/filter-dropdown-item';
-import { FilterTrigger } from './productivity/filter-trigger';
+import { SprintTaskStatusField, Project, SprintTask } from './sprint-task';
+import { FilterDropdown } from './components/filter/filter-dropdown';
+import { StatusPill } from './components/filter/filter-dropdown-item';
+import { FilterTrigger } from './components/filter/filter-trigger';
 import getKanbanResource from './kanban-resource';
-import { FilterDisplay } from './productivity/filter-display';
-import Checklist from '@cardstack/boxel-icons/checklist';
+import { FilterDisplay } from './components/filter/filter-display';
+import LayoutKanbanIcon from '@cardstack/boxel-icons/layout-kanban';
 import RectangleEllipsis from '@cardstack/boxel-icons/rectangle-ellipsis';
 import User from '@cardstack/boxel-icons/user';
 import { eq, not } from '@cardstack/boxel-ui/helpers';
@@ -57,7 +51,7 @@ export interface SelectedItem {
   index?: number;
 }
 
-class SprintPlannerIsolated extends Component<typeof AppCard> {
+class SprintPlannerIsolated extends Component<typeof SprintPlanner> {
   @tracked loadingColumnKey: string | undefined;
   @tracked selectedFilter: FilterType | undefined;
   filters = {
@@ -65,7 +59,7 @@ class SprintPlannerIsolated extends Component<typeof AppCard> {
       searchKey: 'label',
       label: 'Status',
       codeRef: {
-        module: new URL('./productivity/task', import.meta.url).href,
+        module: new URL('./sprint-task', import.meta.url).href,
         name: 'Status',
       },
       options: () => SprintTaskStatusField.values,
@@ -74,7 +68,7 @@ class SprintPlannerIsolated extends Component<typeof AppCard> {
       searchKey: 'name',
       label: 'Assignee',
       codeRef: {
-        module: new URL('./productivity/task', import.meta.url).href,
+        module: new URL('./sprint-task', import.meta.url).href,
         name: 'TeamMember',
       },
       options: () => this.assigneeCards,
@@ -167,7 +161,7 @@ class SprintPlannerIsolated extends Component<typeof AppCard> {
 
   get assignedTaskCodeRef() {
     return {
-      module: new URL('./productivity/task', import.meta.url).href,
+      module: new URL('./sprint-task', import.meta.url).href,
       name: 'SprintTask',
     };
   }
@@ -257,7 +251,7 @@ class SprintPlannerIsolated extends Component<typeof AppCard> {
             },
             project: {
               links: {
-                self: this.currentProject.id ?? null,
+                self: this.currentProject?.id ?? null,
               },
             },
           },
@@ -364,6 +358,9 @@ class SprintPlannerIsolated extends Component<typeof AppCard> {
   }
 
   @action viewCard() {
+    if (!this.args.model.id) {
+      throw new Error('No card id');
+    }
     this.args.context?.actions?.viewCard?.(new URL(this.args.model.id), 'edit');
   }
 
@@ -630,9 +627,9 @@ class ColumnHeader extends GlimmerComponent<ColumnHeaderSignature> {
   }
 }
 
-export class SprintPlanner extends AppCard {
+export class SprintPlanner extends CardDef {
   static displayName = 'Sprint Planner';
-  static icon = Checklist;
+  static icon = LayoutKanbanIcon;
   static headerColor = '#ff7f7b';
   static prefersWideFormat = true;
   static isolated = SprintPlannerIsolated;
diff --git a/packages/experiments-realm/productivity/task.gts b/packages/experiments-realm/sprint-task.gts
similarity index 99%
rename from packages/experiments-realm/productivity/task.gts
rename to packages/experiments-realm/sprint-task.gts
index dc0adffd83..39e8d48585 100644
--- a/packages/experiments-realm/productivity/task.gts
+++ b/packages/experiments-realm/sprint-task.gts
@@ -18,8 +18,8 @@ import CheckboxIcon from '@cardstack/boxel-icons/checkbox';
 import UsersIcon from '@cardstack/boxel-icons/users';
 import UserIcon from '@cardstack/boxel-icons/user';
 import Calendar from '@cardstack/boxel-icons/calendar';
-import { User } from '../user';
-import { Task, TaskStatusField, getDueDateStatus } from '../task';
+import { User } from './user';
+import { Task, TaskStatusField, getDueDateStatus } from './task';
 
 export class Team extends CardDef {
   static displayName = 'Team';
@@ -193,7 +193,7 @@ class TaskIsolated extends Component<typeof SprintTask> {
         <div class='left-column'>
           <h4>Description</h4>
           {{#if @model.details}}
-            <p>{{@model.details}}</p>
+            <@fields.details />
           {{else}}
             <span class='no-data-found-txt'>No Task Description Provided</span>
           {{/if}}
diff --git a/packages/experiments-realm/task.gts b/packages/experiments-realm/task.gts
index 9682e5fc2a..cd3361e31c 100644
--- a/packages/experiments-realm/task.gts
+++ b/packages/experiments-realm/task.gts
@@ -11,7 +11,7 @@ import NumberField from 'https://cardstack.com/base/number';
 
 import BooleanField from 'https://cardstack.com/base/boolean';
 
-import DateRangeField from './date-range-field';
+import DateRangeField from './fields/date-range-field';
 import { Tag } from './tag';
 import { User } from './user';
 import { BoxelSelect } from '@cardstack/boxel-ui/components';
diff --git a/packages/experiments-realm/todo.gts b/packages/experiments-realm/todo.gts
index df1d3006f7..5b57076313 100644
--- a/packages/experiments-realm/todo.gts
+++ b/packages/experiments-realm/todo.gts
@@ -4,10 +4,10 @@ import {
   contains,
   StringField,
 } from 'https://cardstack.com/base/card-api';
-import TextAreaCard from 'https://cardstack.com/base/text-area';
+import MarkdownField from 'https://cardstack.com/base/markdown';
 
 export class Todo extends CardDef {
   static displayName = 'Todo';
   @field name = contains(StringField);
-  @field details = contains(TextAreaCard);
+  @field details = contains(MarkdownField);
 }
diff --git a/packages/host/app/components/card-prerender.gts b/packages/host/app/components/card-prerender.gts
index cfd63c3a4d..c2c9fb1ed0 100644
--- a/packages/host/app/components/card-prerender.gts
+++ b/packages/host/app/components/card-prerender.gts
@@ -105,7 +105,8 @@ export default class CardPrerender extends Component {
       realmURL,
       reader,
       indexWriter,
-      renderCard: this.renderService.renderCard.bind(this.renderService),
+      renderCard: this.renderService.renderCard,
+      render: this.renderService.render,
     });
     setOwner(currentRun, getOwner(this)!);
 
@@ -127,7 +128,8 @@ export default class CardPrerender extends Component {
         reader,
         indexWriter,
         ignoreData: { ...ignoreData },
-        renderCard: this.renderService.renderCard.bind(this.renderService),
+        renderCard: this.renderService.renderCard,
+        render: this.renderService.render,
       });
       setOwner(currentRun, getOwner(this)!);
       let current = await CurrentRun.incremental(currentRun, {
diff --git a/packages/host/app/components/matrix/room-message-command.gts b/packages/host/app/components/matrix/room-message-command.gts
index 58ae669253..65498df15b 100644
--- a/packages/host/app/components/matrix/room-message-command.gts
+++ b/packages/host/app/components/matrix/room-message-command.gts
@@ -3,7 +3,7 @@ import { action } from '@ember/object';
 import { inject as service } from '@ember/service';
 import Component from '@glimmer/component';
 
-import { cached, tracked } from '@glimmer/tracking';
+import { cached } from '@glimmer/tracking';
 
 import { task } from 'ember-concurrency';
 
@@ -51,10 +51,11 @@ interface Signature {
     runCommand: () => void;
     isError?: boolean;
     isPending?: boolean;
+    isDisplayingCode: boolean;
     failedCommandState: Error | undefined;
     monacoSDK: MonacoSDK;
+    onToggleViewCode: () => void;
     currentEditor: number | undefined;
-    setCurrentEditor: (editor: number | undefined) => void;
   };
 }
 
@@ -63,8 +64,6 @@ export default class RoomMessageCommand extends Component<Signature> {
   @service private declare matrixService: MatrixService;
   @service private declare monacoService: MonacoService;
 
-  @tracked private isDisplayingCode = false;
-
   editorDisplayOptions: MonacoEditorOptions = {
     wordWrap: 'on',
     wrappingIndent: 'indent',
@@ -91,13 +90,6 @@ export default class RoomMessageCommand extends Component<Signature> {
     return this.args.messageCommand?.status ?? 'ready';
   }
 
-  @action private viewCodeToggle() {
-    this.isDisplayingCode = !this.isDisplayingCode;
-    if (this.isDisplayingCode) {
-      this.args.setCurrentEditor(this.args.messageIndex);
-    }
-  }
-
   @use private commandResultCard = resource(() => {
     let initialState = { card: undefined } as { card: CardDef | undefined };
     let state = new TrackedObject(initialState);
@@ -180,12 +172,12 @@ export default class RoomMessageCommand extends Component<Signature> {
       >
         <Button
           class='view-code-button'
-          {{on 'click' this.viewCodeToggle}}
-          @kind={{if this.isDisplayingCode 'primary-dark' 'secondary-dark'}}
+          {{on 'click' @onToggleViewCode}}
+          @kind={{if @isDisplayingCode 'primary-dark' 'secondary-dark'}}
           @size='extra-small'
           data-test-view-code-button
         >
-          {{if this.isDisplayingCode 'Hide Code' 'View Code'}}
+          {{if @isDisplayingCode 'Hide Code' 'View Code'}}
         </Button>
         <ApplyButton
           @state={{this.applyButtonState}}
@@ -193,7 +185,7 @@ export default class RoomMessageCommand extends Component<Signature> {
           data-test-command-apply={{this.applyButtonState}}
         />
       </div>
-      {{#if this.isDisplayingCode}}
+      {{#if @isDisplayingCode}}
         <div class='preview-code'>
           <Button
             class='copy-to-clipboard-button'
diff --git a/packages/host/app/components/matrix/room-message.gts b/packages/host/app/components/matrix/room-message.gts
index 0531b14791..955b13e841 100644
--- a/packages/host/app/components/matrix/room-message.gts
+++ b/packages/host/app/components/matrix/room-message.gts
@@ -39,6 +39,8 @@ interface Signature {
     setCurrentEditor: (editor: number | undefined) => void;
     retryAction?: () => void;
     isPending?: boolean;
+    isDisplayingCode: boolean;
+    onToggleViewCode: () => void;
     registerScroller: (args: {
       index: number;
       element: HTMLElement;
@@ -127,9 +129,10 @@ export default class RoomMessage extends Component<Signature> {
             @runCommand={{perform this.run}}
             @roomId={{@roomId}}
             @isPending={{@isPending}}
+            @isDisplayingCode={{@isDisplayingCode}}
+            @onToggleViewCode={{@onToggleViewCode}}
             @monacoSDK={{@monacoSDK}}
             @currentEditor={{@currentEditor}}
-            @setCurrentEditor={{@setCurrentEditor}}
             @failedCommandState={{this.failedCommandState}}
             @isError={{bool this.errorMessage}}
           />
diff --git a/packages/host/app/components/matrix/room.gts b/packages/host/app/components/matrix/room.gts
index ed4568c4c6..16b8b48fb7 100644
--- a/packages/host/app/components/matrix/room.gts
+++ b/packages/host/app/components/matrix/room.gts
@@ -1,3 +1,4 @@
+import { fn } from '@ember/helper';
 import { on } from '@ember/modifier';
 import { action } from '@ember/object';
 import type Owner from '@ember/owner';
@@ -87,6 +88,8 @@ export default class Room extends Component<Signature> {
               @isPending={{this.isPendingMessage message}}
               @monacoSDK={{@monacoSDK}}
               @isStreaming={{this.isMessageStreaming message i}}
+              @isDisplayingCode={{this.isDisplayingCode message}}
+              @onToggleViewCode={{fn this.toggleViewCode message}}
               @currentEditor={{this.currentMonacoContainer}}
               @setCurrentEditor={{this.setCurrentMonacoContainer}}
               @retryAction={{this.maybeRetryAction i message}}
@@ -419,7 +422,7 @@ export default class Room extends Component<Signature> {
     return undefined;
   };
 
-  @action private isMessageStreaming(message: Message, messageIndex: number) {
+  private isMessageStreaming = (message: Message, messageIndex: number) => {
     return (
       !message.isStreamingFinished &&
       this.isLastMessage(messageIndex) &&
@@ -429,7 +432,15 @@ export default class Room extends Component<Signature> {
       // threshold)
       unixTime(new Date().getTime() - message.created.getTime()) < 60
     );
-  }
+  };
+
+  private isDisplayingCode = (message: Message) => {
+    return this.roomResource?.isDisplayingCode(message);
+  };
+
+  private toggleViewCode = (message: Message) => {
+    this.roomResource.toggleViewCode(message);
+  };
 
   private doMatrixEventFlush = restartableTask(async () => {
     await this.matrixService.flushMembership;
diff --git a/packages/host/app/lib/current-run.ts b/packages/host/app/lib/current-run.ts
index e3d2d6f8c3..70522c33fd 100644
--- a/packages/host/app/lib/current-run.ts
+++ b/packages/host/app/lib/current-run.ts
@@ -41,6 +41,7 @@ import {
   serializableError,
   type SerializedError,
 } from '@cardstack/runtime-common/error';
+import { cardTypeIcon } from '@cardstack/runtime-common/helpers';
 import { RealmPaths, LocalPath } from '@cardstack/runtime-common/paths';
 import { isIgnored } from '@cardstack/runtime-common/realm-index-updater';
 import { type Reader, type Stats } from '@cardstack/runtime-common/worker';
@@ -50,6 +51,7 @@ import type * as CardAPI from 'https://cardstack.com/base/card-api';
 
 import {
   type RenderCard,
+  type Render,
   IdentityContextWithErrors,
 } from '../services/render-service';
 
@@ -82,6 +84,7 @@ export class CurrentRun {
   #realmPaths: RealmPaths;
   #ignoreData: Record<string, string>;
   #renderCard: RenderCard;
+  #render: Render;
   #realmURL: URL;
   #realmInfo?: RealmInfo;
   readonly stats: Stats = {
@@ -100,12 +103,14 @@ export class CurrentRun {
     indexWriter,
     ignoreData = {},
     renderCard,
+    render,
   }: {
     realmURL: URL;
     reader: Reader;
     indexWriter: IndexWriter;
     ignoreData?: Record<string, string>;
     renderCard: RenderCard;
+    render: Render;
   }) {
     this.#indexWriter = indexWriter;
     this.#realmPaths = new RealmPaths(realmURL);
@@ -113,6 +118,7 @@ export class CurrentRun {
     this.#realmURL = realmURL;
     this.#ignoreData = ignoreData;
     this.#renderCard = renderCard;
+    this.#render = render;
   }
 
   static async fromScratch(current: CurrentRun): Promise<IndexResults> {
@@ -413,6 +419,7 @@ export class CurrentRun {
     let cardType: typeof CardDef | undefined;
     let isolatedHtml: string | undefined;
     let atomHtml: string | undefined;
+    let iconHTML: string | undefined;
     let card: CardDef | undefined;
     let embeddedHtml: Record<string, string> | undefined;
     let fittedHtml: Record<string, string> | undefined;
@@ -473,6 +480,7 @@ export class CurrentRun {
           }),
         ),
       );
+      iconHTML = unwrap(sanitizeHTML(this.#render(cardTypeIcon(card))));
       cardType = Reflect.getPrototypeOf(card)?.constructor as typeof CardDef;
       let data = api.serializeCard(card, { includeComputeds: true });
       // prepare the document for index serialization
@@ -552,6 +560,7 @@ export class CurrentRun {
         atomHtml,
         embeddedHtml,
         fittedHtml,
+        iconHTML,
         lastModified,
         resourceCreatedAt,
         types: typesMaybeError.types.map(({ refURL }) => refURL),
diff --git a/packages/host/app/lib/isolated-render.gts b/packages/host/app/lib/isolated-render.gts
index 28ca079157..c612132512 100644
--- a/packages/host/app/lib/isolated-render.gts
+++ b/packages/host/app/lib/isolated-render.gts
@@ -16,7 +16,7 @@ import type { SimpleElement } from '@simple-dom/interface';
 
 interface Signature {
   Args: {
-    format: Format;
+    format?: Format;
   };
 }
 
@@ -24,7 +24,7 @@ export function render(
   C: ComponentLike<Signature>,
   element: SimpleElement,
   owner: Owner,
-  format: Format,
+  format?: Format,
 ): void {
   // this needs to be a template-only component because the way we're invoking it
   // just grabs the template and would drop any associated class.
diff --git a/packages/host/app/resources/room.ts b/packages/host/app/resources/room.ts
index 8571f74a6f..f4dbe271fc 100644
--- a/packages/host/app/resources/room.ts
+++ b/packages/host/app/resources/room.ts
@@ -65,6 +65,8 @@ export class RoomResource extends Resource<Args> {
   private _memberCache: TrackedMap<string, RoomMember> = new TrackedMap();
   private _fragmentCache: TrackedMap<string, CardFragmentContent> =
     new TrackedMap();
+  private _isDisplayingViewCodeMap: TrackedMap<string, boolean> =
+    new TrackedMap();
   @tracked matrixRoom: Room | undefined;
   @tracked loading: Promise<void> | undefined;
   @service private declare matrixService: MatrixService;
@@ -92,6 +94,7 @@ export class RoomResource extends Resource<Args> {
     this._fragmentCache = new TrackedMap();
     this._nameEventsCache = new TrackedMap();
     this._skillCardsCache = new TrackedMap();
+    this._isDisplayingViewCodeMap = new TrackedMap();
     this._createEvent = undefined;
   }
 
@@ -404,6 +407,17 @@ export class RoomResource extends Resource<Args> {
     ) as LooseSingleCardDocument;
     return cardDoc;
   };
+
+  public isDisplayingCode(message: Message) {
+    return this._isDisplayingViewCodeMap.get(message.eventId) ?? false;
+  }
+
+  public toggleViewCode(message: Message) {
+    this._isDisplayingViewCodeMap.set(
+      message.eventId,
+      !this.isDisplayingCode(message),
+    );
+  }
 }
 
 export function getRoom(
diff --git a/packages/host/app/services/render-service.ts b/packages/host/app/services/render-service.ts
index 30d2539f87..f8d1872ccf 100644
--- a/packages/host/app/services/render-service.ts
+++ b/packages/host/app/services/render-service.ts
@@ -2,6 +2,7 @@ import { getOwner } from '@ember/application';
 import type Owner from '@ember/owner';
 import Service, { service } from '@ember/service';
 
+import { ComponentLike } from '@glint/template';
 import Serializer from '@simple-dom/serializer';
 
 import voidMap from '@simple-dom/void-map';
@@ -58,6 +59,7 @@ interface RenderCardParams {
   componentCodeRef?: CodeRef;
 }
 export type RenderCard = (params: RenderCardParams) => Promise<string>;
+export type Render = (component: ComponentLike) => string;
 
 const maxRenderThreshold = 10000;
 export default class RenderService extends Service {
@@ -69,7 +71,7 @@ export default class RenderService extends Service {
   renderError: Error | undefined;
   owner: Owner = getOwner(this)!;
 
-  async renderCard(params: RenderCardParams): Promise<string> {
+  renderCard = async (params: RenderCardParams): Promise<string> => {
     let {
       card,
       visit,
@@ -127,7 +129,16 @@ export default class RenderService extends Service {
     let serializer = new Serializer(voidMap);
     let html = serializer.serialize(element);
     return parseCardHtml(html);
-  }
+  };
+
+  render = (component: ComponentLike): string => {
+    let element = getIsolatedRenderElement(this.document);
+    render(component, element, this.owner);
+
+    let serializer = new Serializer(voidMap);
+    let html = serializer.serialize(element);
+    return parseCardHtml(html);
+  };
 
   // TODO delete me
   private async resolveField(
diff --git a/packages/host/config/schema/1735832183444_schema.sql b/packages/host/config/schema/1735832183444_schema.sql
index f46c27c89c..d30eef04e8 100644
--- a/packages/host/config/schema/1735832183444_schema.sql
+++ b/packages/host/config/schema/1735832183444_schema.sql
@@ -23,6 +23,7 @@
    fitted_html BLOB,
    display_names BLOB,
    resource_created_at,
+   icon_html TEXT,
    PRIMARY KEY ( url, realm_url ) 
 );
 
@@ -37,6 +38,7 @@
    error_doc BLOB,
    deps BLOB,
    types BLOB,
+   icon_html TEXT,
    isolated_html TEXT,
    indexed_at,
    is_deleted BOOLEAN,
diff --git a/packages/host/tests/integration/components/ai-assistant-panel-test.gts b/packages/host/tests/integration/components/ai-assistant-panel-test.gts
index f26b212f82..468f5c7193 100644
--- a/packages/host/tests/integration/components/ai-assistant-panel-test.gts
+++ b/packages/host/tests/integration/components/ai-assistant-panel-test.gts
@@ -2331,4 +2331,66 @@ module('Integration | ai-assistant-panel', function (hooks) {
     assert.dom(`${resultListItem}:nth-child(6)`).containsText('Justin');
     assert.dom(`${resultListItem}:nth-child(8)`).containsText('Mickey');
   });
+
+  test('it maintains status of View Code panel as additional events stream in', async function (assert) {
+    await setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+    await renderComponent(
+      class TestDriver extends GlimmerComponent {
+        <template>
+          <OperatorMode @onClose={{noop}} />
+          <CardPrerender />
+        </template>
+      },
+    );
+    await waitFor('[data-test-person="Fadhlan"]');
+    let room1Id = createAndJoinRoom('@testuser:staging', 'test room 1');
+
+    simulateRemoteMessage(room1Id, '@aibot:localhost', {
+      msgtype: APP_BOXEL_COMMAND_MSGTYPE,
+      body: 'Changing first name to Evie',
+      formatted_body: 'Changing first name to Evie',
+      format: 'org.matrix.custom.html',
+      data: JSON.stringify({
+        toolCall: {
+          name: 'patchCard',
+          arguments: {
+            attributes: {
+              cardId: `${testRealmURL}Person/fadhlan`,
+              patch: {
+                attributes: { firstName: 'Evie' },
+              },
+            },
+          },
+        },
+        eventId: '__EVENT_ID__',
+      }),
+      'm.relates_to': {
+        rel_type: 'm.replace',
+        event_id: '__EVENT_ID__',
+      },
+    });
+
+    await settled();
+
+    await click('[data-test-open-ai-assistant]');
+    await waitFor('[data-test-room-name="test room 1"]');
+    assert
+      .dom('[data-test-ai-message-content] [data-test-editor]')
+      .doesNotExist('View Code panel should not yet be open');
+    await click('[data-test-view-code-button]');
+    assert
+      .dom('[data-test-ai-message-content] [data-test-editor]')
+      .exists('View Code panel should be open');
+
+    await fillIn(
+      '[data-test-message-field]',
+      'Asking a question about what I saw in the proposed code...',
+    );
+    await click('[data-test-send-message-btn]');
+
+    // previously, a new event would cause re-rendering and the open-ness of the View Code panel to be lost
+    assert
+      .dom('[data-test-ai-message-content] [data-test-editor]')
+      .exists('View Code panel should remain open');
+  });
 });
diff --git a/packages/postgres/migrations/1734686216941_prerendered-card-type-icon.js b/packages/postgres/migrations/1734686216941_prerendered-card-type-icon.js
new file mode 100644
index 0000000000..83964f952e
--- /dev/null
+++ b/packages/postgres/migrations/1734686216941_prerendered-card-type-icon.js
@@ -0,0 +1,13 @@
+/* eslint-disable camelcase */
+
+exports.shorthands = undefined;
+
+exports.up = (pgm) => {
+  pgm.addColumns('boxel_index', {
+    icon_html: 'varchar',
+  });
+};
+
+exports.down = (pgm) => {
+  pgm.dropColumns('boxel_index', ['icon_html']);
+};
diff --git a/packages/postgres/migrations/1735832183444_add-boxel-index-working.js b/packages/postgres/migrations/1735832183444_add-boxel-index-working.js
index 8476371505..7cd03fffa4 100644
--- a/packages/postgres/migrations/1735832183444_add-boxel-index-working.js
+++ b/packages/postgres/migrations/1735832183444_add-boxel-index-working.js
@@ -10,6 +10,7 @@ exports.up = (pgm) => {
     error_doc: 'jsonb',
     deps: 'jsonb',
     types: 'jsonb',
+    icon_html: 'varchar',
     isolated_html: 'varchar',
     indexed_at: 'bigint',
     is_deleted: 'boolean',
diff --git a/packages/realm-server/tests/realm-server-test.ts b/packages/realm-server/tests/realm-server-test.ts
index f892a1f5ca..405058b1a1 100644
--- a/packages/realm-server/tests/realm-server-test.ts
+++ b/packages/realm-server/tests/realm-server-test.ts
@@ -4055,7 +4055,8 @@ module('Realm Server', function (hooks) {
       let response = await request
         .get('/_types')
         .set('Accept', 'application/json');
-
+      let iconHTML =
+        '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="lucide lucide-captions" viewbox="0 0 24 24"><rect width="18" height="14" x="3" y="5" rx="2" ry="2"></rect><path d="M7 15h4m4 0h2M7 11h2m4 0h4"></path></svg>';
       assert.strictEqual(response.status, 200, 'HTTP 200 status');
       assert.deepEqual(response.body, {
         data: [
@@ -4065,6 +4066,7 @@ module('Realm Server', function (hooks) {
             attributes: {
               displayName: 'Friend',
               total: 2,
+              iconHTML,
             },
           },
           {
@@ -4073,6 +4075,7 @@ module('Realm Server', function (hooks) {
             attributes: {
               displayName: 'Home',
               total: 1,
+              iconHTML,
             },
           },
           {
@@ -4081,6 +4084,7 @@ module('Realm Server', function (hooks) {
             attributes: {
               displayName: 'Person',
               total: 3,
+              iconHTML,
             },
           },
         ],
diff --git a/packages/runtime-common/card-document.ts b/packages/runtime-common/card-document.ts
index 8386d478af..c8f55767f7 100644
--- a/packages/runtime-common/card-document.ts
+++ b/packages/runtime-common/card-document.ts
@@ -356,6 +356,7 @@ export function makeCardTypeSummaryDoc(summaries: CardTypeSummary[]) {
     attributes: {
       displayName: summary.display_name,
       total: summary.total,
+      iconHTML: summary.icon_html,
     },
   }));
 
diff --git a/packages/runtime-common/helpers/index.ts b/packages/runtime-common/helpers/index.ts
index f9d7199a4a..c00d4fd6d4 100644
--- a/packages/runtime-common/helpers/index.ts
+++ b/packages/runtime-common/helpers/index.ts
@@ -1,5 +1,7 @@
 import { parse } from 'date-fns';
 
+export * from './card-type-display-name';
+
 export interface SharedTests<T> {
   [testName: string]: (assert: Assert, args: T) => Promise<void>;
 }
diff --git a/packages/runtime-common/index-structure.ts b/packages/runtime-common/index-structure.ts
index 097f45b321..e8986ec03d 100644
--- a/packages/runtime-common/index-structure.ts
+++ b/packages/runtime-common/index-structure.ts
@@ -25,6 +25,7 @@ export interface BoxelIndexTable {
   fitted_html: Record<string, string> | null;
   isolated_html: string | null;
   atom_html: string | null;
+  icon_html: string | null;
   indexed_at: string | null; // pg represents big integers as strings in javascript
   last_modified: string | null; // pg represents big integers as strings in javascript
   resource_created_at: string | null; // pg represents big integers as strings in javascript
@@ -40,6 +41,7 @@ export interface CardTypeSummary {
   code_ref: string;
   display_name: string;
   total: number;
+  icon_html: string;
 }
 
 export interface RealmMetaTable {
diff --git a/packages/runtime-common/index-writer.ts b/packages/runtime-common/index-writer.ts
index 80a94f21bc..ebffc0fbb5 100644
--- a/packages/runtime-common/index-writer.ts
+++ b/packages/runtime-common/index-writer.ts
@@ -72,6 +72,7 @@ export interface InstanceEntry {
   embeddedHtml?: Record<string, string>;
   fittedHtml?: Record<string, string>;
   atomHtml?: string;
+  iconHTML?: string;
   types: string[];
   displayNames: string[];
   deps: Set<string>;
@@ -164,6 +165,7 @@ export class Batch {
             embedded_html: entry.embeddedHtml,
             fitted_html: entry.fittedHtml,
             atom_html: entry.atomHtml,
+            icon_html: entry.iconHTML,
             deps: [...entry.deps],
             types: entry.types,
             display_names: entry.displayNames,
@@ -291,7 +293,7 @@ export class Batch {
 
   private async updateRealmMeta() {
     let results = await this.#query([
-      `SELECT CAST(count(i.url) AS INTEGER) as total, i.display_names->>0 as display_name, i.types->>0 as code_ref
+      `SELECT CAST(count(i.url) AS INTEGER) as total, i.display_names->>0 as display_name, i.types->>0 as code_ref, MAX(i.icon_html) as icon_html
        FROM boxel_index_working as i
           WHERE`,
       ...every([
diff --git a/packages/runtime-common/tests/index-writer-test.ts b/packages/runtime-common/tests/index-writer-test.ts
index 748605e0ad..d49d1b0060 100644
--- a/packages/runtime-common/tests/index-writer-test.ts
+++ b/packages/runtime-common/tests/index-writer-test.ts
@@ -472,6 +472,7 @@ const tests = Object.freeze({
           ),
           isolated_html: `<div class="isolated">Isolated HTML</div>`,
           atom_html: `<span class="atom">Atom HTML</span>`,
+          icon_html: '<svg>test icon</svg>',
         },
       ],
     );
@@ -527,6 +528,7 @@ const tests = Object.freeze({
         last_modified: String(modified),
         resource_created_at: String(modified),
         is_deleted: null,
+        icon_html: '<svg>test icon</svg>',
       },
       'the error entry includes last known good state of instance',
     );
@@ -581,6 +583,7 @@ const tests = Object.freeze({
           last_modified: null,
           resource_created_at: null,
           is_deleted: false,
+          icon_html: null,
         },
         'the error entry does not include last known good state of instance',
       );
@@ -1073,6 +1076,7 @@ const tests = Object.freeze({
     assert,
     { indexWriter, adapter },
   ) => {
+    let iconHTML = '<svg>test icon</svg>';
     await setupIndex(
       adapter,
       [{ realm_url: testRealmURL, current_version: 1 }],
@@ -1100,6 +1104,7 @@ const tests = Object.freeze({
           types: [{ module: `./person`, name: 'Person' }, baseCardRef].map(
             (i) => internalKeyFor(i, new URL(testRealmURL)),
           ),
+          icon_html: iconHTML,
         },
       ],
     );
@@ -1133,6 +1138,7 @@ const tests = Object.freeze({
         { module: `./person`, name: 'Person' },
         baseCardRef,
       ].map((i) => internalKeyFor(i, new URL(testRealmURL))),
+      iconHTML,
     });
 
     let results = await adapter.execute(
@@ -1168,7 +1174,12 @@ const tests = Object.freeze({
       'correct length of query result after indexing is done',
     );
     let value = results[0].value as [
-      { code_ref: string; display_name: string; total: number },
+      {
+        code_ref: string;
+        display_name: string;
+        icon_html: string;
+        total: number;
+      },
     ];
     assert.strictEqual(
       value.length,
@@ -1182,11 +1193,13 @@ const tests = Object.freeze({
           total: 1,
           code_ref: `${testRealmURL}fancy-person/FancyPerson`,
           display_name: 'Fancy Person',
+          icon_html: iconHTML,
         },
         {
           total: 1,
           code_ref: `${testRealmURL}person/Person`,
           display_name: 'Person',
+          icon_html: iconHTML,
         },
       ],
       'correct card type summary after indexing is done',
@@ -1221,6 +1234,7 @@ const tests = Object.freeze({
         { module: `./person`, name: 'Person' },
         baseCardRef,
       ].map((i) => internalKeyFor(i, new URL(testRealmURL))),
+      iconHTML,
     });
     let resource4: CardResource = {
       id: `${testRealmURL}4`,
@@ -1250,6 +1264,7 @@ const tests = Object.freeze({
         { module: `./card-api`, name: 'CardDef' },
         baseCardRef,
       ].map((i) => internalKeyFor(i, new URL(testRealmURL))),
+      iconHTML,
     });
     await batch.done();
 
@@ -1268,13 +1283,19 @@ const tests = Object.freeze({
       'correct length of query result after indexing is done',
     );
     value = results[0].value as [
-      { code_ref: string; display_name: string; total: number },
+      {
+        code_ref: string;
+        display_name: string;
+        total: number;
+        icon_html: string;
+      },
     ];
     assert.strictEqual(
       value.length,
       3,
       'correct length of card type summary after indexing is done',
     );
+
     assert.deepEqual(
       value,
       [
@@ -1282,16 +1303,19 @@ const tests = Object.freeze({
           total: 2,
           code_ref: `${testRealmURL}fancy-person/FancyPerson`,
           display_name: 'Fancy Person',
+          icon_html: iconHTML,
         },
         {
           total: 1,
           code_ref: `${testRealmURL}person/Person`,
           display_name: 'Person',
+          icon_html: iconHTML,
         },
         {
           total: 1,
           code_ref: `${testRealmURL}pet/Pet`,
           display_name: 'Pet',
+          icon_html: iconHTML,
         },
       ],
       'correct card type summary after indexing is done',
diff --git a/packages/seed-realm/CatalogEntry/sprint-planner.json b/packages/seed-realm/CatalogEntry/sprint-planner.json
new file mode 100644
index 0000000000..79253670da
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/sprint-planner.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Sprint Planner",
+      "description": "Catalog entry for Sprint Planner App card",
+      "isField": false,
+      "ref": {
+        "module": "../sprint-planner",
+        "name": "SprintPlanner"
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/CatalogEntry/sprint-task.json b/packages/seed-realm/CatalogEntry/sprint-task.json
new file mode 100644
index 0000000000..1725e33d70
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/sprint-task.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Sprint Task",
+      "description": "Catalog entry for Sprint Task",
+      "ref": {
+        "name": "SprintTask",
+        "module": "../sprint-task"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/CatalogEntry/tag.json b/packages/seed-realm/CatalogEntry/tag.json
new file mode 100644
index 0000000000..db4d9831a1
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/tag.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Tag",
+      "description": "Catalog entry for Tag",
+      "ref": {
+        "name": "Tag",
+        "module": "../tag"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/CatalogEntry/task.json b/packages/seed-realm/CatalogEntry/task.json
new file mode 100644
index 0000000000..be66653e3c
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/task.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Task",
+      "description": "Catalog entry for Task",
+      "ref": {
+        "name": "Task",
+        "module": "../task"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/CatalogEntry/team-member.json b/packages/seed-realm/CatalogEntry/team-member.json
new file mode 100644
index 0000000000..0f04ce5802
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/team-member.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Team Member",
+      "description": "Catalog entry for Team Member",
+      "ref": {
+        "name": "TeamMember",
+        "module": "../sprint-task"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/CatalogEntry/team.json b/packages/seed-realm/CatalogEntry/team.json
new file mode 100644
index 0000000000..d259682406
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/team.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Team",
+      "description": "Catalog entry for Team",
+      "ref": {
+        "name": "Team",
+        "module": "../sprint-task"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/CatalogEntry/todo.json b/packages/seed-realm/CatalogEntry/todo.json
new file mode 100644
index 0000000000..a8e6108852
--- /dev/null
+++ b/packages/seed-realm/CatalogEntry/todo.json
@@ -0,0 +1,20 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "title": "Todo",
+      "description": "Catalog entry for Todo",
+      "ref": {
+        "name": "Todo",
+        "module": "../todo"
+      },
+      "isField": false
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "https://cardstack.com/base/catalog-entry",
+        "name": "CatalogEntry"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json b/packages/seed-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json
new file mode 100644
index 0000000000..d30fa2fefc
--- /dev/null
+++ b/packages/seed-realm/Project/51ca069b-1c55-4648-8654-bd82bf162f9d.json
@@ -0,0 +1,16 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Build Work Tracker",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "Project"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json b/packages/seed-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json
new file mode 100644
index 0000000000..4e1e461909
--- /dev/null
+++ b/packages/seed-realm/Project/9b43240d-8c9c-42bc-a4d1-f9c626661562.json
@@ -0,0 +1,16 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Miscellaneous Backlog",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "Project"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/SprintPlanner/6bacffa6-952f-4c49-b0e3-ad0e5bf4f899.json b/packages/seed-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json
similarity index 55%
rename from packages/experiments-realm/SprintPlanner/6bacffa6-952f-4c49-b0e3-ad0e5bf4f899.json
rename to packages/seed-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json
index 70c134e6fe..27030b89d9 100644
--- a/packages/experiments-realm/SprintPlanner/6bacffa6-952f-4c49-b0e3-ad0e5bf4f899.json
+++ b/packages/seed-realm/SprintPlanner/89209d31-328a-4c18-9758-53eb3c38d4f0.json
@@ -2,22 +2,14 @@
   "data": {
     "type": "card",
     "attributes": {
-      "tabs": [],
-      "headerIcon": {
-        "altText": null,
-        "size": "actual",
-        "height": null,
-        "width": null,
-        "base64": null
-      },
-      "moduleId": null,
+      "title": "Engineering Team Sprint",
       "description": null,
       "thumbnailURL": null
     },
     "relationships": {
       "project": {
         "links": {
-          "self": "../Project/9b43240d-8c9c-42bc-a4d1-f9c626661562"
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
         }
       }
     },
diff --git a/packages/seed-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json b/packages/seed-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json
new file mode 100644
index 0000000000..831a182826
--- /dev/null
+++ b/packages/seed-realm/SprintTask/10402eaa-3826-4602-994b-60b7506fb98d.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 1,
+        "label": "Next Sprint",
+        "color": "#64B5F6",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-12-08",
+        "end": "2024-12-10"
+      },
+      "priority": {
+        "index": 1,
+        "label": "Medium"
+      },
+      "name": "Create Pill Picker Example",
+      "details": "Implementation of a multi-select component using pills UI pattern, intended for use in the multi-filter feature. Users can select multiple pills simultaneously.\n\n**Note:** *This ticket is no longer relevant*",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json b/packages/seed-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json
new file mode 100644
index 0000000000..f2779bcf6f
--- /dev/null
+++ b/packages/seed-realm/SprintTask/186c797c-cee8-449c-a5a7-6624052deefc.json
@@ -0,0 +1,68 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 4,
+        "label": "In Review",
+        "color": "#9575CD",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-10-10",
+        "end": "2025-01-09"
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Pair with Lucas to complete demo",
+      "details": "By Tuesday, we should have a demo that completes everything",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks.0": {
+        "links": {
+          "self": "./20058a9d-3c2d-4b42-8430-a95b6183245c"
+        }
+      },
+      "subtasks.1": {
+        "links": {
+          "self": "./9e23b8b5-d541-48ef-a652-e7afefb29777"
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5"
+        }
+      },
+      "tags.1": {
+        "links": {
+          "self": "../Tag/ad921cba-ffc7-4fdb-af34-ab8b93eae228"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json b/packages/seed-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json
new file mode 100644
index 0000000000..4dc6c0fc9e
--- /dev/null
+++ b/packages/seed-realm/SprintTask/1b1fb4fd-d722-4cf9-a956-66fc64ccbc48.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 2,
+        "label": "Current Sprint",
+        "color": "#00BCD4",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-12-19",
+        "end": "2025-01-09"
+      },
+      "priority": {
+        "index": 2,
+        "label": "Medium"
+      },
+      "name": "Implement Status and Priority Template Component with Dynamic Rendering",
+      "details": "Technical implementation of a reusable template component for displaying status and priority indicators across the application. Requirements include:\n- Create base template structure\n- Implement dynamic color rendering based on status\n- Add priority level visualization\n- Ensure accessibility compliance\n- Add unit tests for component",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a"
+        }
+      },
+      "tags": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json b/packages/seed-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json
new file mode 100644
index 0000000000..976286cce0
--- /dev/null
+++ b/packages/seed-realm/SprintTask/20058a9d-3c2d-4b42-8430-a95b6183245c.json
@@ -0,0 +1,68 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 5,
+        "label": "Staged",
+        "color": "#26A69A",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-11-06",
+        "end": "2024-11-15"
+      },
+      "priority": {
+        "index": 1,
+        "label": "Medium"
+      },
+      "name": "Port the already done work for CRM into the monorepo",
+      "details": "Copy the existing work that has been carried out through spikes and git commit to our monorepo",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/ad921cba-ffc7-4fdb-af34-ab8b93eae228"
+        }
+      },
+      "tags.1": {
+        "links": {
+          "self": "../Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5"
+        }
+      },
+      "tags.2": {
+        "links": {
+          "self": "../Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json b/packages/seed-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json
new file mode 100644
index 0000000000..3052a78d24
--- /dev/null
+++ b/packages/seed-realm/SprintTask/346cc7ac-eb65-41fd-a1d7-0400668da097.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 3,
+        "label": "In Progress",
+        "color": "#FFB74D",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-11-19",
+        "end": "2024-11-30"
+      },
+      "priority": {
+        "index": 2,
+        "label": "High"
+      },
+      "name": "Make fitted / embeddedd view for task",
+      "details": "Implement a responsive task view that adapts to its container size using container queries (@container), allowing tasks to be embedded in different contexts while maintaining proper layout and readability. This will ensure consistent display whether tasks appear in boards, lists, or as embedded components.",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json b/packages/seed-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json
new file mode 100644
index 0000000000..2ab10341a2
--- /dev/null
+++ b/packages/seed-realm/SprintTask/3cd737c3-4157-46be-9880-6ead8ea60652.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 6,
+        "label": "Shipped",
+        "color": "#66BB6A",
+        "completed": true
+      },
+      "dateRange": {
+        "start": "2024-11-06",
+        "end": "2025-02-04"
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Build Kanban Board Component",
+      "details": "Implement drag and drop functionality using ember-modifier-drag-and-drop:\n\n- Install addon and implement TypeScript interfaces for events/data transfer\n- Create reusable drag/drop modifiers with visual feedback and preview\n- Add validation logic and write tests",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925"
+        }
+      },
+      "tags": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json b/packages/seed-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json
new file mode 100644
index 0000000000..59c53d3917
--- /dev/null
+++ b/packages/seed-realm/SprintTask/48630c9d-2849-43d1-b356-890b016fffe9.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 2,
+        "label": "Current Sprint",
+        "color": "#00BCD4",
+        "completed": false
+      },
+      "dateRange": {
+        "start": null,
+        "end": null
+      },
+      "priority": {
+        "index": 4,
+        "label": "Highest"
+      },
+      "name": "Fill up task board with realistic data",
+      "details": "### Objective\nPopulate the task board with realistic sample data that demonstrates the full capabilities of our markdown and task tracking features.\n\n#### Requirements\n- [ ] Add variety of task statuses (Todo, In Progress, Done)\n- [ ] Include tasks with different priority levels\n- [ ] Create sample tasks with rich markdown content\n- [ ] Add realistic date ranges and deadlines",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/6d80a75f-71bb-474f-979d-ef4bc571ad63"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json b/packages/seed-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json
new file mode 100644
index 0000000000..a5229e4f23
--- /dev/null
+++ b/packages/seed-realm/SprintTask/7d92636a-e306-4433-93c5-3b5d976986f3.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 4,
+        "label": "In Review",
+        "color": "#9575CD",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-11-20",
+        "end": "2024-11-27"
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Implement Cross-Component Drag and Drop System",
+      "details": "Design and implement a robust drag and drop system with the following specifications:\n\n- Evaluate and integrate a suitable drag and drop library (e.g., react-dnd, dnd-kit, or sortablejs)\n- Create reusable drag and drop hooks/utilities\n- Implement drag source and drop target abstractions\n- Add visual feedback during drag operations\n- Handle drag preview with custom styling\n- Implement drop validation logic\n- Add support for touch devices\n- Create comprehensive test suite for DnD interactions\n- Document library integration and custom implementation details",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks.0": {
+        "links": {
+          "self": "./3cd737c3-4157-46be-9880-6ead8ea60652"
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json b/packages/seed-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json
new file mode 100644
index 0000000000..649d317a2f
--- /dev/null
+++ b/packages/seed-realm/SprintTask/8ca45d40-adcb-437f-83ee-07ffd973cd17.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 2,
+        "label": "Current Sprint",
+        "color": "#00BCD4",
+        "completed": false
+      },
+      "dateRange": {
+        "start": null,
+        "end": null
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Resolve bug where overlay only appears on certain cards",
+      "details": "The overlay is only appearing on specific cards due to a faulty modifier that's not being applied consistently across all card instances.",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json b/packages/seed-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json
new file mode 100644
index 0000000000..44206a770e
--- /dev/null
+++ b/packages/seed-realm/SprintTask/9e23b8b5-d541-48ef-a652-e7afefb29777.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 6,
+        "label": "Shipped",
+        "color": "#66BB6A",
+        "completed": true
+      },
+      "dateRange": {
+        "start": "2024-11-07",
+        "end": "2024-11-21"
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Incoporate Boxel Multi Select in Dropdown",
+      "details": "Integrate Boxel's multi-select dropdown component to be more unified with the single-select dropdown.\n\nThe trigger component should share the same designs.",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/cc574556-4253-44b8-ba80-0cfb844b4908"
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
+        }
+      },
+      "tags": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3.json b/packages/seed-realm/SprintTask/a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3.json
new file mode 100644
index 0000000000..0e0b089c0b
--- /dev/null
+++ b/packages/seed-realm/SprintTask/a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 1,
+        "label": "Next Sprint",
+        "color": null,
+        "completed": false
+      },
+      "dateRange": {
+        "start": null,
+        "end": null
+      },
+      "priority": {
+        "index": 4,
+        "label": "Highest"
+      },
+      "name": "Calendar displays wrong date after closing",
+      "details": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": null
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": null
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/SprintTask/9b0425f9-ac54-44a4-8cfb-1774442490ea.json b/packages/seed-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json
similarity index 71%
rename from packages/experiments-realm/SprintTask/9b0425f9-ac54-44a4-8cfb-1774442490ea.json
rename to packages/seed-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json
index a180327692..0c59d1133f 100644
--- a/packages/experiments-realm/SprintTask/9b0425f9-ac54-44a4-8cfb-1774442490ea.json
+++ b/packages/seed-realm/SprintTask/d21d407b-9c1c-4204-a3bb-7b91f9260017.json
@@ -9,14 +9,14 @@
         "completed": false
       },
       "dateRange": {
-        "start": null,
-        "end": null
+        "start": "2024-12-01",
+        "end": "2024-12-08"
       },
       "priority": {
-        "index": 3,
-        "label": "High"
+        "index": null,
+        "label": null
       },
-      "name": "Cleanup all the dbs",
+      "name": "Create RHS Sheet",
       "details": null,
       "description": null,
       "thumbnailURL": null
@@ -24,12 +24,12 @@
     "relationships": {
       "project": {
         "links": {
-          "self": "../Project/9b43240d-8c9c-42bc-a4d1-f9c626661562"
+          "self": null
         }
       },
       "team": {
         "links": {
-          "self": null
+          "self": "../Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55"
         }
       },
       "subtasks": {
@@ -39,7 +39,7 @@
       },
       "assignee": {
         "links": {
-          "self": null
+          "self": "../TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be"
         }
       },
       "tags": {
@@ -50,9 +50,9 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/seed-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json b/packages/seed-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json
new file mode 100644
index 0000000000..0376341087
--- /dev/null
+++ b/packages/seed-realm/SprintTask/d8ce7466-3693-4d54-8931-8ccd25ca079f.json
@@ -0,0 +1,63 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 0,
+        "label": "Not Started",
+        "color": "#B0BEC5",
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2024-11-13",
+        "end": "2024-12-17"
+      },
+      "priority": {
+        "index": 0,
+        "label": "Lowest"
+      },
+      "name": "Build Date Range Card",
+      "details": "",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": "../Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55"
+        }
+      },
+      "subtasks.0": {
+        "links": {
+          "self": "./a1fd93a9-6b00-4b79-8d97-6c34c3a19cc3"
+        }
+      },
+      "subtasks.1": {
+        "links": {
+          "self": "./d9fdfbbc-fb17-41d9-90a2-c5765819930b"
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086"
+        }
+      },
+      "tags.0": {
+        "links": {
+          "self": "../Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/SprintTask/d9fdfbbc-fb17-41d9-90a2-c5765819930b.json b/packages/seed-realm/SprintTask/d9fdfbbc-fb17-41d9-90a2-c5765819930b.json
new file mode 100644
index 0000000000..d230492914
--- /dev/null
+++ b/packages/seed-realm/SprintTask/d9fdfbbc-fb17-41d9-90a2-c5765819930b.json
@@ -0,0 +1,58 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "status": {
+        "index": 1,
+        "label": "Next Sprint",
+        "color": null,
+        "completed": false
+      },
+      "dateRange": {
+        "start": "2025-01-09",
+        "end": "2025-01-12"
+      },
+      "priority": {
+        "index": null,
+        "label": null
+      },
+      "name": "Integrate Ember Power Calendar Picker",
+      "details": "Create a date range picker component using Ember Power Calendar with built-in validation to prevent end dates being set before start dates. Component should be implemented within a dropdown for better UX, following this pattern:\n\n1. Click triggers dropdown with calendar\n2. First click sets start date\n3. Second click sets end date (with validation)\n4. Invalid date ranges should be prevented and show validation feedback\n\n**Technical Requirements:**\n- Use `ember-power-calendar` for the calendar implementation\n- Implement date validation logic in the component\n- Style dropdown to match our design system",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "project": {
+        "links": {
+          "self": "../Project/51ca069b-1c55-4648-8654-bd82bf162f9d"
+        }
+      },
+      "team": {
+        "links": {
+          "self": null
+        }
+      },
+      "subtasks": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": null
+        }
+      },
+      "tags": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "SprintTask"
+      }
+    }
+  }
+}
diff --git a/packages/experiments-realm/SprintTask/bb4323d6-1ea4-40d0-a039-85d13e55d4a6.json b/packages/seed-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json
similarity index 73%
rename from packages/experiments-realm/SprintTask/bb4323d6-1ea4-40d0-a039-85d13e55d4a6.json
rename to packages/seed-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json
index aaaf0426a4..c625a07921 100644
--- a/packages/experiments-realm/SprintTask/bb4323d6-1ea4-40d0-a039-85d13e55d4a6.json
+++ b/packages/seed-realm/SprintTask/f81ea9a1-0b94-4e12-8e2e-c84fba78c551.json
@@ -4,9 +4,9 @@
     "attributes": {
       "status": {
         "completed": false,
-        "index": 1,
-        "label": "Next Sprint",
-        "color": "#64B5F6"
+        "index": 2,
+        "label": "Current Sprint",
+        "color": "#00BCD4"
       },
       "dateRange": {
         "start": null,
@@ -16,7 +16,7 @@
         "index": null,
         "label": null
       },
-      "name": "Create Tag List",
+      "name": "Move cards-grid fitted template into a component that can be re-used",
       "details": null,
       "description": null,
       "thumbnailURL": null
@@ -24,7 +24,7 @@
     "relationships": {
       "project": {
         "links": {
-          "self": "../Project/9b43240d-8c9c-42bc-a4d1-f9c626661562"
+          "self": null
         }
       },
       "team": {
@@ -39,7 +39,7 @@
       },
       "assignee": {
         "links": {
-          "self": "../TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086"
+          "self": null
         }
       },
       "tags": {
@@ -50,7 +50,7 @@
     },
     "meta": {
       "adoptsFrom": {
-        "module": "../productivity/task",
+        "module": "../sprint-task",
         "name": "SprintTask"
       }
     }
diff --git a/packages/seed-realm/Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5.json b/packages/seed-realm/Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5.json
new file mode 100644
index 0000000000..53db14bba4
--- /dev/null
+++ b/packages/seed-realm/Tag/6b8446c8-b185-4de9-ba81-88f8b9eee7f5.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Boxel UI",
+      "color": "",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Tag/6d80a75f-71bb-474f-979d-ef4bc571ad63.json b/packages/seed-realm/Tag/6d80a75f-71bb-474f-979d-ef4bc571ad63.json
new file mode 100644
index 0000000000..88c1cfd577
--- /dev/null
+++ b/packages/seed-realm/Tag/6d80a75f-71bb-474f-979d-ef4bc571ad63.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "High Priority",
+      "color": "var(--boxel-yellow)",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/seed-realm/Tag/8a14f671-4daf-4195-aca5-85dc143d15b8.json b/packages/seed-realm/Tag/8a14f671-4daf-4195-aca5-85dc143d15b8.json
new file mode 100644
index 0000000000..b4bb5907ad
--- /dev/null
+++ b/packages/seed-realm/Tag/8a14f671-4daf-4195-aca5-85dc143d15b8.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Proposal",
+      "color": "var(--boxel-lilac)",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/seed-realm/Tag/ad921cba-ffc7-4fdb-af34-ab8b93eae228.json b/packages/seed-realm/Tag/ad921cba-ffc7-4fdb-af34-ab8b93eae228.json
new file mode 100644
index 0000000000..10ca6b584c
--- /dev/null
+++ b/packages/seed-realm/Tag/ad921cba-ffc7-4fdb-af34-ab8b93eae228.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "App",
+      "color": "",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc.json b/packages/seed-realm/Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc.json
new file mode 100644
index 0000000000..4c7f6196c4
--- /dev/null
+++ b/packages/seed-realm/Tag/c3b47bc8-a7df-48c3-8b7b-50dacbf124fc.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Bug",
+      "color": "#FFCCCB",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/seed-realm/Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98.json b/packages/seed-realm/Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98.json
new file mode 100644
index 0000000000..e03a6343a0
--- /dev/null
+++ b/packages/seed-realm/Tag/f00a2177-df10-4ad7-8eac-2fbf8448de98.json
@@ -0,0 +1,17 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Card",
+      "color": "",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../tag",
+        "name": "Tag"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Task/c0bf3231-435c-4363-ad92-a1d756aea8d9.json b/packages/seed-realm/Task/c0bf3231-435c-4363-ad92-a1d756aea8d9.json
new file mode 100644
index 0000000000..1bad35496c
--- /dev/null
+++ b/packages/seed-realm/Task/c0bf3231-435c-4363-ad92-a1d756aea8d9.json
@@ -0,0 +1,43 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "dateRange": {
+        "start": null,
+        "end": null
+      },
+      "status": {
+        "index": 0,
+        "label": "Not Started",
+        "color": "#B0BEC5",
+        "completed": false
+      },
+      "priority": {
+        "index": 1,
+        "label": "Low"
+      },
+      "name": "Renew Google Play Data Agreement",
+      "details": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "tags": {
+        "links": {
+          "self": null
+        }
+      },
+      "assignee": {
+        "links": {
+          "self": "../TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../task",
+        "name": "Task"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/seed-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json b/packages/seed-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json
new file mode 100644
index 0000000000..ded61fd31b
--- /dev/null
+++ b/packages/seed-realm/Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55.json
@@ -0,0 +1,16 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Core",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "Team"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json b/packages/seed-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json
new file mode 100644
index 0000000000..fc3e5ca3c3
--- /dev/null
+++ b/packages/seed-realm/Team/cc574556-4253-44b8-ba80-0cfb844b4908.json
@@ -0,0 +1,16 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Ecosystem",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "Team"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json b/packages/seed-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json
new file mode 100644
index 0000000000..a96a2f91be
--- /dev/null
+++ b/packages/seed-realm/TeamMember/03e293b9-e4c1-4592-b8d1-e6f963829086.json
@@ -0,0 +1,24 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Richard",
+      "email": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "team": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "TeamMember"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json b/packages/seed-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json
new file mode 100644
index 0000000000..8c1fa2b79d
--- /dev/null
+++ b/packages/seed-realm/TeamMember/4c9614cd-ecda-42cf-bc18-37903019a7be.json
@@ -0,0 +1,24 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Luke",
+      "email": "",
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "team": {
+        "links": {
+          "self": "../Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "TeamMember"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json b/packages/seed-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json
new file mode 100644
index 0000000000..32c36b206b
--- /dev/null
+++ b/packages/seed-realm/TeamMember/5c42e6e9-59c8-4585-a721-e3414d7e7c9e.json
@@ -0,0 +1,24 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Justin",
+      "email": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "team": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "TeamMember"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json b/packages/seed-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json
new file mode 100644
index 0000000000..61eff946d8
--- /dev/null
+++ b/packages/seed-realm/TeamMember/847c1f4e-e0ae-43d3-a012-8ffaa66f5925.json
@@ -0,0 +1,24 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Lucas",
+      "email": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "team": {
+        "links": {
+          "self": null
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "TeamMember"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json b/packages/seed-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json
new file mode 100644
index 0000000000..098ecf72e8
--- /dev/null
+++ b/packages/seed-realm/TeamMember/f832cfb6-959e-4d0d-bc83-8712a36a910a.json
@@ -0,0 +1,24 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Burcu",
+      "email": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "relationships": {
+      "team": {
+        "links": {
+          "self": "../Team/0a799af4-c49a-4d27-aabe-9ed54b9baf55"
+        }
+      }
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../sprint-task",
+        "name": "TeamMember"
+      }
+    }
+  }
+}
diff --git a/packages/seed-realm/Todo/959133bc-c472-4cf7-ba6f-1c5b03979eba.json b/packages/seed-realm/Todo/959133bc-c472-4cf7-ba6f-1c5b03979eba.json
new file mode 100644
index 0000000000..eba687f4c4
--- /dev/null
+++ b/packages/seed-realm/Todo/959133bc-c472-4cf7-ba6f-1c5b03979eba.json
@@ -0,0 +1,18 @@
+{
+  "data": {
+    "type": "card",
+    "attributes": {
+      "name": "Buy pancake flour for dinner",
+      "details": "Make sure to get Krusteaz Buttermilk mix. Do not buy the cinnamon one!",
+      "title": null,
+      "description": null,
+      "thumbnailURL": null
+    },
+    "meta": {
+      "adoptsFrom": {
+        "module": "../todo",
+        "name": "Todo"
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/seed-realm/components/filter/filter-display.gts b/packages/seed-realm/components/filter/filter-display.gts
new file mode 100644
index 0000000000..1b8ec06499
--- /dev/null
+++ b/packages/seed-realm/components/filter/filter-display.gts
@@ -0,0 +1,64 @@
+import GlimmerComponent from '@glimmer/component';
+import { Pill, IconButton } from '@cardstack/boxel-ui/components';
+import { IconX } from '@cardstack/boxel-ui/icons';
+import { on } from '@ember/modifier';
+import { fn } from '@ember/helper';
+
+export interface FilterDisplaySignature {
+  Args: {
+    key: string;
+    items: any[];
+    removeItem: (item: any) => void;
+    icon: any;
+  };
+  Element: HTMLDivElement;
+  Blocks: {
+    default: [any];
+  };
+}
+
+export class FilterDisplay extends GlimmerComponent<FilterDisplaySignature> {
+  <template>
+    {{#each @items as |item|}}
+      <Pill class='filter-display-pill'>
+        <:default>
+          {{#if @icon}}
+            <@icon class='filter-display-icon' />
+          {{/if}}
+          {{@key}}
+          =
+          <strong>{{yield item}}</strong>
+        </:default>
+        <:iconRight>
+          <IconButton
+            @icon={{IconX}}
+            {{on 'click' (fn @removeItem item)}}
+            class='filter-display-remove-button'
+          />
+        </:iconRight>
+      </Pill>
+    {{/each}}
+    <style scoped>
+      .filter-display-pill {
+        flex-shrink: 0;
+        font: 500 var(--boxel-font-sm);
+        --pill-padding: var(--boxel-sp-xxxs) var(--boxel-sp-xxs);
+        --pill-background-color: var(--boxel-100);
+      }
+      .filter-display-remove-button {
+        --boxel-icon-button-height: 10px;
+        --boxel-icon-button-width: 10px;
+        --inner-boxel-icon-button-width: 8px;
+        --inner-boxel-icon-button-height: 8px;
+      }
+      .filter-display-icon {
+        width: 15px;
+        height: 15px;
+        margin-right: var(--boxel-sp-xxxs);
+      }
+      strong {
+        font-weight: 600;
+      }
+    </style>
+  </template>
+}
diff --git a/packages/seed-realm/components/filter/filter-dropdown-item.gts b/packages/seed-realm/components/filter/filter-dropdown-item.gts
new file mode 100644
index 0000000000..309272c05c
--- /dev/null
+++ b/packages/seed-realm/components/filter/filter-dropdown-item.gts
@@ -0,0 +1,96 @@
+import GlimmerComponent from '@glimmer/component';
+import { CheckMark } from '@cardstack/boxel-ui/icons';
+import { cn } from '@cardstack/boxel-ui/helpers';
+
+interface CheckBoxArgs {
+  Args: {
+    isSelected: boolean;
+  };
+  Element: Element;
+}
+
+class CheckboxIndicator extends GlimmerComponent<CheckBoxArgs> {
+  <template>
+    <div class='checkbox-indicator'>
+      <span class={{cn 'check-icon' check-icon--selected=@isSelected}}>
+        <CheckMark width='12' height='12' />
+      </span>
+    </div>
+    <style scoped>
+      .checkbox-indicator {
+        width: 16px;
+        height: 16px;
+        border: 1px solid var(--boxel-500);
+        border-radius: 3px;
+        margin-right: var(--boxel-sp-xs);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+      .checkbox-indicator:hover,
+      .checkbox-indicator:focus {
+        box-shadow: 0 0 0 2px var(--boxel-dark-teal);
+      }
+      .check-icon {
+        --icon-color: var(--boxel-dark-teal);
+        visibility: collapse;
+        display: contents;
+      }
+      .check-icon--selected {
+        visibility: visible;
+      }
+    </style>
+  </template>
+}
+
+interface StatusPillArgs {
+  Args: {
+    isSelected: boolean;
+    label: string;
+  };
+  Element: Element;
+}
+
+export class StatusPill extends GlimmerComponent<StatusPillArgs> {
+  <template>
+    <span class='status-pill'>
+      <div class='status-pill-content'>
+        <CheckboxIndicator @isSelected={{@isSelected}} />
+        <div class='status-name'>{{@label}}</div>
+      </div>
+    </span>
+
+    <style scoped>
+      .status-pill {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-size: var(--boxel-font-size-sm);
+        cursor: pointer;
+        width: 100%;
+      }
+      .status-pill.selected {
+        background-color: var(--boxel-highlight);
+      }
+      .status-pill-content {
+        display: flex;
+        align-items: center;
+        gap: var(--boxel-sp-4xs);
+      }
+      .status-avatar {
+        width: var(--boxel-sp-sm);
+        height: var(--boxel-sp-sm);
+        border-radius: 50%;
+        background-color: var(--avatar-bg-color, var(--boxel-light));
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-right: var(--boxel-sp-xs);
+        font-size: var(--boxel-font-size-xs);
+      }
+      .status-name {
+        flex-grow: 1;
+      }
+    </style>
+  </template>
+}
diff --git a/packages/seed-realm/components/filter/filter-dropdown.gts b/packages/seed-realm/components/filter/filter-dropdown.gts
new file mode 100644
index 0000000000..fef84b598e
--- /dev/null
+++ b/packages/seed-realm/components/filter/filter-dropdown.gts
@@ -0,0 +1,50 @@
+import GlimmerComponent from '@glimmer/component';
+import { BoxelMultiSelectBasic } from '@cardstack/boxel-ui/components';
+import { FilterTrigger } from './filter-trigger';
+
+interface FilterDropdownSignature {
+  Element: HTMLDivElement;
+  Args: {
+    searchField: string;
+    realmURLs: string[];
+    options: any;
+    selected: any;
+    onChange: (value: any) => void;
+    onClose: () => boolean | undefined;
+    isLoading?: boolean;
+  };
+  Blocks: {
+    default: [any];
+  };
+}
+
+export class FilterDropdown extends GlimmerComponent<FilterDropdownSignature> {
+  <template>
+    <BoxelMultiSelectBasic
+      class='filter-multi-select'
+      @options={{@options}}
+      @selected={{@selected}}
+      @onChange={{@onChange}}
+      @triggerComponent={{(component FilterTrigger isLoading=@isLoading)}}
+      @initiallyOpened={{true}}
+      @searchEnabled={{true}}
+      @searchField={{@searchField}}
+      @closeOnSelect={{false}}
+      @onClose={{@onClose}}
+      @matchTriggerWidth={{false}}
+      ...attributes
+      as |item|
+    >
+      <div class='filter-option'>{{yield item}}</div>
+    </BoxelMultiSelectBasic>
+
+    <style scoped>
+      .filter-multi-select {
+        border: none;
+      }
+      .filter-option {
+        width: 200px;
+      }
+    </style>
+  </template>
+}
diff --git a/packages/seed-realm/components/filter/filter-trigger.gts b/packages/seed-realm/components/filter/filter-trigger.gts
new file mode 100644
index 0000000000..4f921e1602
--- /dev/null
+++ b/packages/seed-realm/components/filter/filter-trigger.gts
@@ -0,0 +1,48 @@
+import GlimmerComponent from '@glimmer/component';
+import { IconButton } from '@cardstack/boxel-ui/components';
+import ListFilter from '@cardstack/boxel-icons/list-filter';
+
+interface TriggerSignature {
+  Args: {
+    isLoading?: boolean;
+  };
+  Element: HTMLDivElement;
+}
+
+export class FilterTrigger extends GlimmerComponent<TriggerSignature> {
+  <template>
+    <div class='filter-trigger'>
+      <IconButton @icon={{ListFilter}} width='13px' height='13px' />
+      <span class='filter-trigger-text'>
+        {{#if @isLoading}}
+          Loading...
+        {{else}}
+          Filter
+        {{/if}}
+      </span>
+    </div>
+
+    <style scoped>
+      .filter-trigger {
+        display: flex;
+        align-items: center;
+        font: 600 var(--boxel-font-sm);
+        transition: background-color 0.5s ease-in-out;
+        overflow: hidden;
+      }
+      .filter-trigger-text {
+        padding-right: var(--boxel-sp-sm);
+      }
+      .filter-trigger:hover {
+        cursor: pointer;
+        background-color: var(--boxel-100);
+      }
+    </style>
+    {{! template-lint-disable require-scoped-style }}
+    <style>
+      .ember-power-select-trigger {
+        padding: 0;
+      }
+    </style>
+  </template>
+}
diff --git a/packages/seed-realm/fields/date-range-field.gts b/packages/seed-realm/fields/date-range-field.gts
new file mode 100644
index 0000000000..f7a6b35f7a
--- /dev/null
+++ b/packages/seed-realm/fields/date-range-field.gts
@@ -0,0 +1,206 @@
+import DateField from 'https://cardstack.com/base/date';
+import {
+  FieldDef,
+  contains,
+  field,
+  Component,
+} from 'https://cardstack.com/base/card-api';
+import {
+  DateRangePicker,
+  BoxelDropdown,
+  Pill,
+  BoxelButton,
+} from '@cardstack/boxel-ui/components';
+import StringField from 'https://cardstack.com/base/string';
+import { action } from '@ember/object';
+import { tracked } from '@glimmer/tracking';
+import { on } from '@ember/modifier';
+import { fn } from '@ember/helper';
+import CalendarIcon from '@cardstack/boxel-icons/calendar';
+import { cn } from '@cardstack/boxel-ui/helpers';
+
+const Format = new Intl.DateTimeFormat('en-US', {
+  year: 'numeric',
+  month: 'short',
+  day: 'numeric',
+});
+
+interface DateRange {
+  start: Date | null | undefined;
+  end: Date | null | undefined;
+}
+
+class Edit extends Component<typeof DateRangeField> {
+  @tracked range: DateRange = {
+    start: this.args.model.start,
+    end: this.args.model.end,
+  };
+
+  get formatted() {
+    return getFormattedDate(this.range);
+  }
+
+  @action onSelect(selected: any) {
+    this.range = selected.date;
+  }
+
+  write() {
+    if (this.range.start) {
+      this.args.model.start = this.range.start;
+    }
+    if (this.range.end) {
+      this.args.model.end = this.range.end;
+    }
+  }
+
+  @action save(close: () => void) {
+    this.write();
+    close();
+  }
+
+  @action onClose() {
+    this.range = {
+      start: this.args.model.start,
+      end: this.args.model.end,
+    };
+  }
+  // reset allows the user to
+  //1. decide if he even wants a field to be present (ie he might want an empty date range)
+  //2. allows the user to also go back to the original state of TODAY while editing
+  @action reset() {
+    this.range = {
+      start: null,
+      end: null,
+    };
+    this.args.model.start = undefined;
+    this.args.model.end = undefined;
+  }
+
+  <template>
+    <BoxelDropdown @onClose={{this.onClose}}>
+      <:trigger as |bindings|>
+        <Pill {{bindings}} @kind='button'>
+          {{this.formatted}}
+        </Pill>
+      </:trigger>
+      <:content as |dd|>
+        <div class='dropdown-content'>
+          <div>
+            <DateRangePicker
+              @start={{this.range.start}}
+              @end={{this.range.end}}
+              @onSelect={{this.onSelect}}
+              @selected={{this.range}}
+            />
+          </div>
+          <div class='dropdown-actions'>
+            <BoxelButton
+              @kind='secondary'
+              {{on 'click' this.reset}}
+            >Reset</BoxelButton>
+            <BoxelButton
+              @kind='primary'
+              {{on 'click' (fn this.save dd.close)}}
+            >Save</BoxelButton>
+          </div>
+        </div>
+      </:content>
+    </BoxelDropdown>
+    <style scoped>
+      .dropdown-content {
+        display: flex;
+        flex-direction: column;
+        gap: var(--boxel-sp-sm);
+        padding: var(--boxel-sp-sm);
+      }
+      .dropdown-actions {
+        display: flex;
+        justify-content: flex-end;
+        gap: var(--boxel-sp-sm);
+      }
+    </style>
+  </template>
+}
+
+export default class DateRangeField extends FieldDef {
+  static displayName = 'Date Range';
+  static icon = CalendarIcon;
+  @field start = contains(DateField);
+  @field end = contains(DateField);
+  @field title = contains(StringField, {
+    computeVia: function (this: DateRangeField) {
+      return 'Date Range';
+    },
+  });
+
+  static edit = Edit;
+  static atom = class Atom extends Component<typeof this> {
+    get hasNoDateInfo() {
+      return !this.args.model.start && !this.args.model.end;
+    }
+
+    get formatted() {
+      return getFormattedDate(this.args.model as DateRange);
+    }
+
+    get dateIcon() {
+      return this.args.model.constructor?.icon;
+    }
+
+    <template>
+      <time class='date-info'>
+        {{#if this.dateIcon}}
+          <this.dateIcon class='icon' />
+        {{/if}}
+        <div class={{cn 'text' no-date-info=this.hasNoDateInfo}}>
+          {{this.formatted}}
+        </div>
+      </time>
+      <style scoped>
+        .date-info {
+          --date-icon-size: 14px;
+          display: inline-flex;
+          align-items: center;
+          font-size: calc(var(--date-icon-size) * 0.9);
+          gap: var(--boxel-sp-xxs);
+          white-space: nowrap;
+          -webkit-line-clamp: 1;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          font-weight: 500;
+        }
+        .icon {
+          width: var(--date-icon-size);
+          height: var(--date-icon-size);
+        }
+        .text {
+          color: var(--boxel-600);
+        }
+        .text.no-date-info {
+          color: var(--boxel-600);
+        }
+      </style>
+    </template>
+  };
+}
+
+interface DateRangeConfig {
+  noDateMsg: string;
+}
+
+function getFormattedDate(
+  range: DateRange,
+  config: Partial<DateRangeConfig> = {},
+): string {
+  const defaults = {
+    noDateMsg: '[Select a date]',
+  };
+  const finalConfig = { ...defaults, ...config };
+
+  if (!range.start && !range.end) {
+    return finalConfig.noDateMsg;
+  }
+  let start = range.start ? Format.format(range.start) : '[Select start date]';
+  let end = range.end ? Format.format(range.end) : '[Select end date]';
+  return `${start} - ${end}`;
+}
diff --git a/packages/seed-realm/kanban-resource.gts b/packages/seed-realm/kanban-resource.gts
new file mode 100644
index 0000000000..b64a58cfd4
--- /dev/null
+++ b/packages/seed-realm/kanban-resource.gts
@@ -0,0 +1,76 @@
+import { tracked } from '@glimmer/tracking';
+import { DndColumn } from '@cardstack/boxel-ui/components';
+import { CardDef } from 'https://cardstack.com/base/card-api';
+
+import { Resource } from 'ember-resources';
+
+interface Args {
+  named: {
+    cards: CardDef[];
+    hasColumnKey: <T extends CardDef>(card: T, key: string) => boolean;
+    columnKeys: string[];
+  };
+}
+
+// This is a resource because we have to
+// 1. to hold state of cards inside of the kanban board without a flickering/ loading
+// 2. to maintain a natural order cards that are newly added to the kanban board
+// Note: this resource assumes that you have already loaded the cards and is unsuitable for pre-rendered cards
+class KanbanResource extends Resource<Args> {
+  @tracked private data: Map<string, DndColumn> = new Map();
+  hasColumnKey?: <T extends CardDef>(card: T, key: string) => boolean =
+    undefined;
+
+  commit(cards: CardDef[], columnKeys: string[]) {
+    columnKeys.forEach((key: string) => {
+      let currentColumn = this.data.get(key);
+      let cardsForStatus = cards.filter((card) => {
+        return this.hasColumnKey ? this.hasColumnKey(card, key) : false;
+      });
+
+      if (currentColumn) {
+        // Maintain order of existing cards and append new ones
+        let existingCardIds = new Set(
+          currentColumn.cards.map((card: CardDef) => card.id),
+        );
+        let existingCards = currentColumn.cards.filter((card: CardDef) =>
+          cardsForStatus.some((c) => c.id === card.id),
+        );
+        let newCards = cardsForStatus.filter(
+          (card: CardDef) => !existingCardIds.has(card.id),
+        );
+        this.data.set(key, new DndColumn(key, [...newCards, ...existingCards]));
+      } else {
+        // First time loading this column
+        this.data.set(key, new DndColumn(key, cardsForStatus));
+      }
+    });
+  }
+
+  get columns() {
+    return Array.from(this.data.values());
+  }
+
+  modify(_positional: never[], named: Args['named']) {
+    this.hasColumnKey = named.hasColumnKey;
+    this.commit(named.cards, named.columnKeys);
+  }
+}
+
+export default function getKanbanResource<T extends CardDef>(
+  parent: object,
+  cards: () => T[],
+  columnKeys: () => string[],
+  hasColumnKey: () => (card: T, key: string) => boolean,
+) {
+  return KanbanResource.from(parent, () => ({
+    named: {
+      cards: cards(),
+      columnKeys: columnKeys(),
+      hasColumnKey: hasColumnKey() as <T extends CardDef>(
+        card: T,
+        key: string,
+      ) => boolean,
+    },
+  }));
+}
diff --git a/packages/seed-realm/sprint-planner.gts b/packages/seed-realm/sprint-planner.gts
new file mode 100644
index 0000000000..ba43847d6e
--- /dev/null
+++ b/packages/seed-realm/sprint-planner.gts
@@ -0,0 +1,645 @@
+import {
+  Component,
+  realmURL,
+  field,
+  BaseDef,
+  CardDef,
+  linksTo,
+} from 'https://cardstack.com/base/card-api';
+import { tracked } from '@glimmer/tracking';
+import { on } from '@ember/modifier';
+import { TrackedMap } from 'tracked-built-ins';
+import GlimmerComponent from '@glimmer/component';
+import {
+  BoxelButton,
+  DndItem,
+  LoadingIndicator,
+} from '@cardstack/boxel-ui/components';
+import {
+  DndKanbanBoard,
+  DndColumn,
+  BoxelSelect,
+} from '@cardstack/boxel-ui/components';
+import { IconPlus } from '@cardstack/boxel-ui/icons';
+import { action } from '@ember/object';
+import { LooseSingleCardDocument, getCards } from '@cardstack/runtime-common';
+import { restartableTask } from 'ember-concurrency';
+import { SprintTaskStatusField, Project, SprintTask } from './sprint-task';
+import { FilterDropdown } from './components/filter/filter-dropdown';
+import { StatusPill } from './components/filter/filter-dropdown-item';
+import { FilterTrigger } from './components/filter/filter-trigger';
+import getKanbanResource from './kanban-resource';
+import { FilterDisplay } from './components/filter/filter-display';
+import LayoutKanbanIcon from '@cardstack/boxel-icons/layout-kanban';
+import RectangleEllipsis from '@cardstack/boxel-icons/rectangle-ellipsis';
+import User from '@cardstack/boxel-icons/user';
+import { eq, not } from '@cardstack/boxel-ui/helpers';
+import { fn } from '@ember/helper';
+import type Owner from '@ember/owner';
+import {
+  AnyFilter,
+  CardTypeFilter,
+  Query,
+  EqFilter,
+} from '@cardstack/runtime-common/query';
+
+type FilterType = 'status' | 'assignee';
+
+export interface SelectedItem {
+  name?: string;
+  label?: string;
+  index?: number;
+}
+
+class SprintPlannerIsolated extends Component<typeof SprintPlanner> {
+  @tracked loadingColumnKey: string | undefined;
+  @tracked selectedFilter: FilterType | undefined;
+  filters = {
+    status: {
+      searchKey: 'label',
+      label: 'Status',
+      codeRef: {
+        module: new URL('./sprint-task', import.meta.url).href,
+        name: 'Status',
+      },
+      options: () => SprintTaskStatusField.values,
+    },
+    assignee: {
+      searchKey: 'name',
+      label: 'Assignee',
+      codeRef: {
+        module: new URL('./sprint-task', import.meta.url).href,
+        name: 'TeamMember',
+      },
+      options: () => this.assigneeCards,
+    },
+  };
+  selectedItems = new TrackedMap<FilterType, SelectedItem[]>();
+  constructor(owner: Owner, args: any) {
+    super(owner, args);
+  }
+
+  get filterTypes() {
+    return Object.keys(this.filters) as FilterType[];
+  }
+
+  cards = getCards(this.getTaskQuery, this.realmHrefs, { isLive: true });
+
+  assigneeQuery = getCards(
+    {
+      filter: {
+        type: this.filters.assignee.codeRef,
+      },
+    },
+    this.realmHrefs,
+    { isLive: true },
+  );
+
+  get cardInstances() {
+    if (!this.cards || !this.cards.instances) {
+      return [];
+    }
+    return this.cards.instances as SprintTask[];
+  }
+
+  get assigneeCards() {
+    return this.assigneeQuery.instances;
+  }
+
+  @action showTaskCard(card: SprintTask): boolean {
+    return this.filterTypes.every((filterType: FilterType) => {
+      let selectedItems = this.selectedItems.get(filterType) ?? [];
+      if (selectedItems.length === 0) return true;
+      return selectedItems.some((item) => {
+        if (filterType === 'status') {
+          return card.status?.label === item.label;
+        } else if (filterType === 'assignee') {
+          return card.assignee?.name === item.name;
+        } else {
+          return false;
+        }
+      });
+    });
+  }
+
+  hasColumnKey = (card: SprintTask, key: string) => {
+    return card.status?.label === key;
+  };
+
+  taskCollection = getKanbanResource(
+    this,
+    () => this.cardInstances,
+    () => SprintTaskStatusField.values.map((status) => status.label) ?? [],
+    () => this.hasColumnKey,
+  );
+
+  get selectedFilterConfig() {
+    if (this.selectedFilter === undefined) {
+      return undefined;
+    }
+    return this.filters[this.selectedFilter];
+  }
+
+  get selectedItemsForFilter() {
+    if (this.selectedFilter === undefined) {
+      return [];
+    }
+    return this.selectedItems.get(this.selectedFilter) ?? [];
+  }
+
+  get realmURL(): URL {
+    return this.args.model[realmURL]!;
+  }
+
+  get realmHref() {
+    return this.realmURL.href;
+  }
+
+  get realmHrefs() {
+    return [this.realmURL?.href];
+  }
+
+  get assignedTaskCodeRef() {
+    return {
+      module: new URL('./sprint-task', import.meta.url).href,
+      name: 'SprintTask',
+    };
+  }
+
+  get currentProject() {
+    return this.args.model.project;
+  }
+
+  get getTaskQuery(): Query {
+    let everyArr: (AnyFilter | CardTypeFilter | EqFilter)[] = [];
+    if (!this.realmURL) {
+      throw new Error('No realm url');
+    }
+    if (!this.currentProject || !this.currentProject.id) {
+      console.log('No project');
+      everyArr.push({ eq: { 'project.id': null } });
+    } else {
+      everyArr.push({ eq: { 'project.id': this.currentProject.id } });
+    }
+    return (
+      everyArr.length > 0
+        ? {
+            filter: {
+              on: this.assignedTaskCodeRef,
+              every: everyArr,
+            },
+          }
+        : {
+            filter: {
+              type: this.assignedTaskCodeRef,
+            },
+          }
+    ) as Query;
+  }
+
+  @action isSelectedItem(item: SelectedItem) {
+    let selectedItems = this.selectedItemsForFilter;
+    return selectedItems.includes(item);
+  }
+
+  @action createNewTask(statusLabel: string) {
+    this.loadingColumnKey = statusLabel;
+    this._createNewTask.perform(statusLabel);
+  }
+
+  @action isCreateNewTaskLoading(statusLabel: string) {
+    return this.loadingColumnKey === statusLabel;
+  }
+  private _createNewTask = restartableTask(async (statusLabel: string) => {
+    if (this.realmURL === undefined) {
+      return;
+    }
+
+    try {
+      let cardRef = this.assignedTaskCodeRef;
+
+      if (!cardRef) {
+        return;
+      }
+
+      let index = SprintTaskStatusField.values.find((value) => {
+        return value.label === statusLabel;
+      })?.index;
+
+      let doc: LooseSingleCardDocument = {
+        data: {
+          type: 'card',
+          attributes: {
+            name: null,
+            details: null,
+            status: {
+              index,
+              label: statusLabel,
+            },
+            priority: {
+              index: null,
+              label: null,
+            },
+            description: null,
+            thumbnailURL: null,
+          },
+          relationships: {
+            assignee: {
+              links: {
+                self: null,
+              },
+            },
+            project: {
+              links: {
+                self: this.currentProject?.id ?? null,
+              },
+            },
+          },
+          meta: {
+            adoptsFrom: cardRef,
+          },
+        },
+      };
+
+      await this.args.context?.actions?.createCard?.(
+        cardRef,
+        new URL(cardRef.module),
+        {
+          realmURL: this.realmURL,
+          doc,
+        },
+      );
+    } catch (error) {
+      console.error('Error creating card:', error);
+    } finally {
+      this.loadingColumnKey = undefined;
+    }
+  });
+
+  @action async onMoveCardMutation(
+    draggedCard: DndItem,
+    _targetCard: DndItem | undefined,
+    _sourceColumnAfterDrag: DndColumn,
+    targetColumnAfterDrag: DndColumn,
+  ) {
+    let cardInNewCol = targetColumnAfterDrag.cards.find(
+      (c: CardDef) => c.id === draggedCard.id,
+    );
+    if (
+      cardInNewCol &&
+      cardInNewCol.status.label !== targetColumnAfterDrag.title //not dragging to the same column
+    ) {
+      let statusValue = SprintTaskStatusField.values.find(
+        (value) => value.label === targetColumnAfterDrag.title,
+      );
+      cardInNewCol.status = new SprintTaskStatusField(statusValue);
+      await this.args.context?.actions?.saveCard?.(cardInNewCol);
+    }
+  }
+
+  @action onSelectFilter(item: FilterType) {
+    this.selectedFilter = item;
+  }
+
+  @action onChange(selected: SelectedItem[]) {
+    if (this.selectedFilter) {
+      this.selectedItems.set(this.selectedFilter, selected);
+    }
+  }
+
+  @action onClose() {
+    this.selectedFilter = undefined;
+    return true;
+  }
+
+  get options() {
+    return this.selectedFilterConfig?.options();
+  }
+
+  @action removeFilter(key: FilterType, item: SelectedItem) {
+    let items = this.selectedItems.get(key);
+    if (!items) {
+      return;
+    }
+    let itemIndex: number;
+    if (key === 'status') {
+      itemIndex = items.findIndex((o) => item?.index === o?.index);
+    } else {
+      itemIndex = items.findIndex((o) => item === o);
+    }
+
+    if (itemIndex > -1) {
+      items.splice(itemIndex, 1);
+      this.selectedItems.set(key, items);
+    }
+  }
+
+  @action selectedFilterItems(filterType: FilterType) {
+    return this.selectedItems.get(filterType) ?? [];
+  }
+
+  @action getFilterIcon(filterType: FilterType) {
+    switch (filterType) {
+      case 'status':
+        return RectangleEllipsis;
+      case 'assignee':
+        return User;
+      default:
+        return undefined;
+    }
+  }
+
+  get assigneeIsLoading() {
+    return (
+      this.selectedFilter === 'assignee' &&
+      this.assigneeQuery &&
+      this.assigneeQuery.isLoading
+    );
+  }
+
+  @action viewCard() {
+    if (!this.args.model.id) {
+      throw new Error('No card id');
+    }
+    this.args.context?.actions?.viewCard?.(new URL(this.args.model.id), 'edit');
+  }
+
+  <template>
+    <div class='task-app'>
+      {{#if (not this.currentProject.id)}}
+        <div class='disabled'>
+          {{#if @context.actions.viewCard}}
+            <BoxelButton @kind='primary' {{on 'click' this.viewCard}}>
+              Link a project to continue
+            </BoxelButton>
+          {{/if}}
+        </div>
+      {{/if}}
+      <div class='filter-section'>
+        <div class='filter-dropdown-container'>
+          {{#if this.selectedFilterConfig}}
+            {{#let (this.selectedFilterConfig.options) as |options|}}
+              <FilterDropdown
+                @isLoading={{this.assigneeIsLoading}}
+                @searchField={{this.selectedFilterConfig.searchKey}}
+                @options={{options}}
+                @realmURLs={{this.realmHrefs}}
+                @selected={{this.selectedItemsForFilter}}
+                @onChange={{this.onChange}}
+                @onClose={{this.onClose}}
+                as |item|
+              >
+                {{#let (this.isSelectedItem item) as |isSelected|}}
+                  <StatusPill
+                    @isSelected={{isSelected}}
+                    @label={{if
+                      (eq this.selectedFilter 'status')
+                      item.label
+                      item.name
+                    }}
+                  />
+                {{/let}}
+              </FilterDropdown>
+            {{/let}}
+          {{else}}
+            <BoxelSelect
+              class='status-select'
+              @selected={{this.selectedFilter}}
+              @options={{this.filterTypes}}
+              @onChange={{this.onSelectFilter}}
+              @placeholder={{'Choose a Filter'}}
+              @matchTriggerWidth={{false}}
+              @triggerComponent={{FilterTrigger}}
+              as |item|
+            >
+              {{#let (this.getFilterIcon item) as |Icon|}}
+                <div class='filter-option'>
+                  {{#if Icon}}
+                    <Icon class='filter-display-icon' />
+                  {{/if}}
+                  <span class='filter-display-text'>{{item}}</span>
+                </div>
+              {{/let}}
+            </BoxelSelect>
+          {{/if}}
+        </div>
+        <div class='filter-display-sec'>
+          {{#each this.filterTypes as |filterType|}}
+            {{#let (this.selectedFilterItems filterType) as |items|}}
+              <FilterDisplay
+                @key={{filterType}}
+                @items={{items}}
+                @removeItem={{(fn this.removeFilter filterType)}}
+                @icon={{this.getFilterIcon filterType}}
+                as |item|
+              >
+                {{#if (eq filterType 'status')}}
+                  {{item.label}}
+                {{else}}
+                  {{item.name}}
+                {{/if}}
+              </FilterDisplay>
+            {{/let}}
+          {{/each}}
+        </div>
+      </div>
+      <div class='columns-container'>
+        <DndKanbanBoard
+          @columns={{this.taskCollection.columns}}
+          @onMove={{this.onMoveCardMutation}}
+          @displayCard={{this.showTaskCard}}
+        >
+          <:header as |column|>
+            <ColumnHeader
+              @statusLabel={{column.title}}
+              @createNewTask={{this.createNewTask}}
+              @isCreateNewTaskLoading={{this.isCreateNewTaskLoading}}
+            />
+          </:header>
+          <:card as |card|>
+            {{#let (getComponent card) as |CardComponent|}}
+              <div
+                {{@context.cardComponentModifier
+                  cardId=card.id
+                  format='data'
+                  fieldType=undefined
+                  fieldName=undefined
+                }}
+                data-test-cards-grid-item={{removeFileExtension card.id}}
+                data-cards-grid-item={{removeFileExtension card.id}}
+              >
+                <CardComponent class='card' />
+              </div>
+            {{/let}}
+          </:card>
+        </DndKanbanBoard>
+      </div>
+    </div>
+    {{!TODO: Get rid of global styles}}
+    {{! template-lint-disable require-scoped-style }}
+    <style>
+      .ember-power-select-dropdown.ember-basic-dropdown-content--below,
+      .ember-power-select-dropdown.ember-basic-dropdown-content--in-place {
+        border-top: 1px solid #aaaaaa;
+        border-top-left-radius: var(--boxel-border-radius-sm);
+        border-top-right-radius: var(--boxel-border-radius-sm);
+      }
+    </style>
+    <style scoped>
+      .task-app {
+        display: flex;
+        position: relative;
+        flex-direction: column;
+        font: var(--boxel-font);
+        padding-left: var(--boxel-sp);
+        height: 100%;
+      }
+      .disabled {
+        position: absolute;
+        top: 0%;
+        left: 0%;
+        width: 100%;
+        height: 100%;
+        background-color: rgb(38 38 38 / 50%);
+        z-index: 10; /*TODO: Resolve z-index with drag and drop. This has to be greater than --draggable-overlay-z-index + 1*/
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: white;
+        font-size: var(--boxel-font-size-lg);
+        font-weight: 500;
+      }
+      .filter-section {
+        display: flex;
+        justify-content: space-between;
+        gap: var(--boxel-sp);
+        align-items: center;
+        padding: var(--boxel-sp-xxxs) var(--boxel-sp-xxxs);
+        width: 100%;
+      }
+      .filter-dropdown-container {
+        width: auto;
+      }
+      .filter-display-sec {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        justify-content: end;
+        gap: var(--boxel-sp-xxs);
+        flex: 1;
+        min-width: 0;
+      }
+      .columns-container {
+        display: block;
+        height: calc(100vh - 58px);
+        overflow: hidden;
+      }
+      .dropdown-filter-button {
+        display: flex;
+        align-items: center;
+      }
+      .dropdown-filter-text {
+        margin-right: var(--boxel-sp-xxs);
+      }
+      .dropdown-arrow {
+        display: inline-block;
+      }
+      /** Need to specify height because fitted field component has a default height**/
+      .card {
+        height: 170px !important;
+      }
+      .status-select {
+        border: none;
+      }
+      .filter-option {
+        display: flex;
+        align-items: center;
+        gap: var(--boxel-sp-xs);
+        width: 200px;
+      }
+      .filter-display-icon {
+        width: 14px;
+        height: 14px;
+        flex-shrink: 0;
+        margin-right: var(--boxel-sp-xxxs);
+      }
+      .filter-display-text {
+        word-break: break-word;
+      }
+      .filter-option {
+        display: flex;
+        align-items: center;
+        gap: var(--boxel-sp-xs);
+        width: 200px;
+      }
+      .filter-display-icon {
+        width: 14px;
+        height: 14px;
+        flex-shrink: 0;
+        margin-right: var(--boxel-sp-xxxs);
+      }
+      .filter-display-text {
+        word-break: break-word;
+      }
+    </style>
+  </template>
+}
+
+interface ColumnHeaderSignature {
+  statusLabel: string;
+  createNewTask: (statusLabel: string) => void;
+  isCreateNewTaskLoading: (statusLabel: string) => boolean;
+}
+
+class ColumnHeader extends GlimmerComponent<ColumnHeaderSignature> {
+  <template>
+    <div class='column-header-content'>
+      {{@statusLabel}}
+      <button class='create-new-task-button' {{on 'click' this.createNewTask}}>
+        {{#let (@isCreateNewTaskLoading @statusLabel) as |isLoading|}}
+          {{#if isLoading}}
+            <LoadingIndicator class='loading' />
+          {{else}}
+            <IconPlus width='12px' height='12px' />
+          {{/if}}
+        {{/let}}
+      </button>
+    </div>
+    <style scoped>
+      .loading {
+        --boxel-loading-indicator-size: 14px;
+      }
+      .column-header-content {
+        display: flex;
+        justify-content: space-between;
+        gap: var(--boxel-sp-xxs);
+        font-size: 0.9rem;
+      }
+      .create-new-task-button {
+        all: unset;
+        cursor: pointer;
+      }
+    </style>
+  </template>
+
+  @action createNewTask() {
+    this.args.createNewTask(this.args.statusLabel);
+  }
+}
+
+export class SprintPlanner extends CardDef {
+  static displayName = 'Sprint Planner';
+  static icon = LayoutKanbanIcon;
+  static headerColor = '#ff7f7b';
+  static prefersWideFormat = true;
+  static isolated = SprintPlannerIsolated;
+  @field project = linksTo(() => Project);
+}
+
+function removeFileExtension(cardUrl: string) {
+  return cardUrl.replace(/\.[^/.]+$/, '');
+}
+
+function getComponent(cardOrField: BaseDef) {
+  return cardOrField.constructor.getComponent(cardOrField);
+}
diff --git a/packages/seed-realm/sprint-task.gts b/packages/seed-realm/sprint-task.gts
new file mode 100644
index 0000000000..39e8d48585
--- /dev/null
+++ b/packages/seed-realm/sprint-task.gts
@@ -0,0 +1,537 @@
+import {
+  CardDef,
+  Component,
+  StringField,
+  contains,
+  field,
+  linksTo,
+  linksToMany,
+} from 'https://cardstack.com/base/card-api';
+import {
+  Avatar,
+  Pill,
+  ProgressBar,
+  ProgressRadial,
+} from '@cardstack/boxel-ui/components';
+import FolderGitIcon from '@cardstack/boxel-icons/folder-git';
+import CheckboxIcon from '@cardstack/boxel-icons/checkbox';
+import UsersIcon from '@cardstack/boxel-icons/users';
+import UserIcon from '@cardstack/boxel-icons/user';
+import Calendar from '@cardstack/boxel-icons/calendar';
+import { User } from './user';
+import { Task, TaskStatusField, getDueDateStatus } from './task';
+
+export class Team extends CardDef {
+  static displayName = 'Team';
+  static icon = UsersIcon;
+  @field name = contains(StringField);
+  @field title = contains(StringField, {
+    computeVia: function (this: Team) {
+      return this.name;
+    },
+  });
+
+  @field shortName = contains(StringField, {
+    computeVia: function (this: Team) {
+      return this.name ? this.name.slice(0, 2).toUpperCase() : undefined;
+    },
+  });
+
+  static atom = class Atom extends Component<typeof this> {
+    <template>
+      <Pill>
+        <:default>
+          {{@model.name}}
+        </:default>
+      </Pill>
+    </template>
+  };
+}
+
+export class TeamMember extends User {
+  static displayName = 'Team Member';
+  static icon = UserIcon;
+  @field team = linksTo(Team);
+
+  static atom = class Atom extends Component<typeof this> {
+    <template>
+      {{#if @model}}
+        <div class='assignee-display'>
+          <Avatar
+            class='avatar'
+            @userId={{@model.id}}
+            @displayName={{@model.name}}
+            @isReady={{true}}
+          />
+          <span class='assignee-name'>
+            {{@model.name}}
+          </span>
+        </div>
+      {{/if}}
+      <style scoped>
+        .assignee-display {
+          display: inline-flex;
+          align-items: center;
+          background-color: var(--boxel-200);
+          border-radius: 100px;
+          overflow: hidden;
+          max-width: 100px;
+          width: fit-content;
+        }
+        .avatar {
+          --profile-avatar-icon-size: 20px;
+          --profile-avatar-icon-border: 0px;
+          flex-shrink: 0;
+        }
+        .assignee-name {
+          padding: 0 var(--boxel-sp-xs) 0 var(--boxel-sp-xxxs);
+          font: 500 var(--boxel-font-xs);
+          letter-spacing: var(--boxel-lsp-sm);
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      </style>
+    </template>
+  };
+}
+
+export class Project extends CardDef {
+  static displayName = 'Project';
+  static icon = FolderGitIcon;
+  @field name = contains(StringField);
+  @field title = contains(StringField, {
+    computeVia: function (this: Project) {
+      return this.name;
+    },
+  });
+  static atom = class Atom extends Component<typeof this> {
+    <template>
+      <Pill class='project-pill'>
+        <:default>
+          {{@model.name}}
+        </:default>
+      </Pill>
+      <style scoped>
+        .project-pill {
+          --boxel-pill-background-color: var(--boxel-purple);
+          background: var(--profile-avatar-icon-background);
+        }
+      </style>
+    </template>
+  };
+}
+
+export class Issues extends CardDef {
+  static displayName = 'Issues';
+}
+
+function extractId(href: string): string {
+  const urlObj = new URL(href);
+  const pathname = urlObj.pathname;
+  const parts = pathname.split('/');
+  const lastPart = parts[parts.length - 1];
+  return lastPart.replace('.json', '');
+}
+
+function shortenId(id: string): string {
+  const shortUuid = id.slice(0, 8);
+  const decimal = parseInt(shortUuid, 16);
+  return decimal.toString(36).padStart(6, '0');
+}
+
+class TaskIsolated extends Component<typeof SprintTask> {
+  get dueDate() {
+    return this.args.model.dateRange?.end;
+  }
+
+  get dueDateStatus() {
+    return this.dueDate ? getDueDateStatus(this.dueDate.toString()) : undefined;
+  }
+
+  get hasDueDate() {
+    return Boolean(this.dueDate);
+  }
+
+  get hasDueDateStatus() {
+    return Boolean(this.dueDateStatus);
+  }
+
+  <template>
+    <div class='task-container'>
+      <header>
+        <div class='left-column'>
+          <h2 class='task-title'>{{@model.name}}</h2>
+          <div class='status-label'>
+            <span class='text-gray'>in</span>
+            {{@model.status.label}}
+          </div>
+        </div>
+
+        <div class='right-column'>
+          <ProgressRadial
+            @value={{this.progress}}
+            @max={{100}}
+            @variant='circular'
+            class='task-progress-radial'
+          />
+          {{#if this.hasProgress}}
+            <ProgressBar
+              @value={{this.progress}}
+              @max={{100}}
+              @label={{this.progressLabel}}
+              @variant='horizontal'
+              class='task-progress-bar'
+            />
+          {{/if}}
+        </div>
+      </header>
+
+      <hr class='task-divider border-gray' />
+
+      <div class='task-info'>
+        <div class='left-column'>
+          <h4>Description</h4>
+          {{#if @model.details}}
+            <@fields.details />
+          {{else}}
+            <span class='no-data-found-txt'>No Task Description Provided</span>
+          {{/if}}
+        </div>
+
+        <div class='right-column'>
+          <div class='assignee'>
+            <h4>Assignee</h4>
+
+            {{#if @model.assignee}}
+              <@fields.assignee
+                @format='atom'
+                @displayContainer={{false}}
+                class='task-assignee'
+              />
+            {{else}}
+              <span class='no-data-found-txt'>No Assignees Found</span>
+            {{/if}}
+          </div>
+
+          <div class='due-date'>
+            <h4>Due Date</h4>
+            <div class='date-info-container'>
+              {{#if this.hasDueDate}}
+                <div class='date-status-pill-container'>
+                  {{#if this.dueDateStatus}}
+                    <Pill
+                      class='date-status-pill'
+                      @pillBackgroundColor={{this.dueDateStatus.color}}
+                    >
+                      <:default>{{this.dueDateStatus.label}}</:default>
+                    </Pill>
+                  {{/if}}
+
+                  <div class='calendar-icon-container'>
+                    <Calendar
+                      width='14px'
+                      height='14px'
+                      class='calendar-icon'
+                    />
+                    <@fields.dateRange.end @format='atom' />
+                  </div>
+                </div>
+              {{else}}
+                <span class='no-data-found-txt'>No Due Date Assigned</span>
+              {{/if}}
+            </div>
+          </div>
+
+          <div class='tags'>
+            <h4>Tags</h4>
+            {{#if @model.tags}}
+              <div class='task-tags'>
+                {{#each @fields.tags as |Tag|}}
+                  <Tag
+                    @format='atom'
+                    class='task-tag'
+                    @displayContainer={{false}}
+                  />
+                {{/each}}
+              </div>
+            {{else}}
+              <span class='no-data-found-txt'>No Tags Found</span>
+            {{/if}}
+          </div>
+        </div>
+      </div>
+
+      <hr class='task-divider border-white' />
+
+      <div class='task-subtasks'>
+        <h4>Subtasks ({{@model.subtasks.length}})</h4>
+
+        {{#if @model.subtasks}}
+          <@fields.subtasks @format='fitted' />
+        {{else}}
+          <span class='no-data-found-txt'>No Subtasks Found</span>
+        {{/if}}
+      </div>
+    </div>
+
+    <style scoped>
+      h2,
+      h4,
+      p {
+        margin-block-start: 0;
+        margin-block-end: 1em;
+        word-break: break-word;
+      }
+      p {
+        font-size: var(--boxel-font-size-sm);
+      }
+      .task-container {
+        --task-font-weight-500: 500;
+        --task-font-weight-600: 600;
+        --tasl-font-size-extra-small: calc(var(--boxel-font-size-xs) * 0.95);
+        padding: var(--boxel-sp-lg);
+        container-type: inline-size;
+      }
+      .task-container > * {
+        margin-top: var(--boxel-sp-lg);
+      }
+      header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+      .task-title {
+        font-size: var(--boxel-font-size-med);
+        font-weight: var(--task-font-weight-600);
+      }
+      .status-label {
+        font-size: var(--boxel-font-size-sm);
+        font-weight: var(--task-font-weight-600);
+        margin-top: var(--boxel-sp-xs);
+      }
+      .text-gray {
+        color: var(--boxel-400);
+      }
+      .task-progress-bar {
+        display: none;
+        --progress-bar-font-color: var(--boxel-dark);
+        border: 0px;
+        margin-top: var(--boxel-sp);
+      }
+      .task-divider.border-gray {
+        border: 1px solid var(--boxel-100);
+      }
+      .task-divider.border-white {
+        border: 1px solid var(--boxel-light);
+      }
+      .task-info {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: var(--boxel-sp-xl);
+      }
+      .task-info .right-column {
+        display: grid;
+        gap: var(--boxel-sp-xl);
+      }
+      .task-assignee {
+        width: auto;
+        height: auto;
+        overflow: unset;
+      }
+      .task-tags {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: var(--boxel-sp-xxs);
+        overflow: hidden;
+      }
+      .task-tag {
+        width: auto;
+        height: auto;
+        overflow: unset;
+      }
+      .no-data-found-txt {
+        font-size: calc(var(--boxel-font-size-xs) * 0.95);
+        font-weight: var(--task-font-weight-500);
+        color: var(--boxel-400);
+        white-space: nowrap;
+        -webkit-line-clamp: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        margin-top: 1px;
+      }
+      .date-status-pill-container {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: var(--boxel-sp-xxs);
+      }
+      .date-status-pill {
+        height: 24px;
+        border: none;
+        border-radius: 5px 0 0 5px;
+        font-size: var(--tasl-font-size-extra-small);
+        font-weight: var(--task-font-weight-500);
+        position: relative;
+        padding: var(--boxel-sp-5xs) var(--boxel-sp-sm) var(--boxel-sp-5xs)
+          var(--boxel-sp-xxs);
+        clip-path: polygon(
+          0 0,
+          calc(100% - 8px) 0,
+          100% 50%,
+          calc(100% - 8px) 100%,
+          0 100%
+        );
+      }
+      .calendar-icon-container {
+        font-size: var(--tasl-font-size-extra-small);
+        display: inline-flex;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        overflow: hidden;
+      }
+      .calendar-icon {
+        flex-shrink: 0;
+      }
+
+      @container (max-width: 600px) {
+        header {
+          display: block;
+        }
+        .task-progress-radial {
+          display: none;
+        }
+        .task-progress-bar {
+          display: block;
+        }
+        .task-info {
+          grid-template-columns: 1fr;
+          gap: var(--boxel-sp-lg);
+        }
+        .task-info .right-column {
+          gap: var(--boxel-sp-lg);
+        }
+      }
+    </style>
+  </template>
+
+  get tagNames() {
+    return this.args.model.tags?.map((tag) => tag.name) ?? [];
+  }
+  get hasDateRange() {
+    return this.args.model.dateRange;
+  }
+
+  get progress() {
+    if (!this.hasChildren) return 0;
+    const shippedCount = this.args.model.subtasks!.filter(
+      (child) => child.status.label === 'Shipped',
+    ).length;
+
+    return Math.round((shippedCount / this.childrenCount) * 100);
+  }
+
+  get hasProgress() {
+    return this.progress > 0;
+  }
+
+  get progressLabel() {
+    return `${this.progress}%`;
+  }
+
+  get hasChildren() {
+    return this.args.model.subtasks && this.args.model.subtasks.length > 0;
+  }
+
+  get childrenCount() {
+    return this.args.model.subtasks ? this.args.model.subtasks.length : 0;
+  }
+
+  get shippedCount() {
+    return this.args.model.subtasks
+      ? this.args.model.subtasks.filter(
+          (child) => child.status.label === 'Shipped',
+        ).length
+      : 0;
+  }
+}
+
+export class SprintTaskStatusField extends TaskStatusField {
+  static values = [
+    { index: 0, label: 'Not Started', color: '#B0BEC5', completed: false },
+    {
+      index: 1,
+      label: 'Next Sprint',
+      color: '#64B5F6',
+      completed: false,
+    },
+    {
+      index: 2,
+      label: 'Current Sprint',
+      color: '#00BCD4',
+      completed: false,
+    },
+    {
+      index: 3,
+      label: 'In Progress',
+      color: '#FFB74D',
+      completed: false,
+    },
+    {
+      index: 4,
+      label: 'In Review',
+      color: '#9575CD',
+      completed: false,
+    },
+    {
+      index: 5,
+      label: 'Staged',
+      color: '#26A69A',
+      completed: false,
+    },
+    {
+      index: 6,
+      label: 'Shipped',
+      color: '#66BB6A',
+      completed: true,
+    },
+  ];
+}
+
+export class SprintTask extends Task {
+  static displayName = 'Sprint Task';
+  static icon = CheckboxIcon;
+  @field project = linksTo(() => Project);
+  @field team = linksTo(() => Team);
+  @field subtasks = linksToMany(() => SprintTask);
+  @field status = contains(SprintTaskStatusField);
+
+  @field title = contains(StringField, {
+    computeVia: function (this: SprintTask) {
+      return this.name;
+    },
+  });
+
+  //Removing this causes a missing .title error
+  @field assignee = linksTo(() => TeamMember);
+
+  @field shortId = contains(StringField, {
+    computeVia: function (this: SprintTask) {
+      if (this.id) {
+        let id = shortenId(extractId(this.id));
+        let _shortId: string;
+        if (this.team && this.team.shortName) {
+          // computeds are hard to debug -- the logs only appear on the server. We need to always include a check for links
+          _shortId = this.team.shortName + '-' + id;
+        } else {
+          _shortId = id;
+        }
+        return _shortId.toUpperCase();
+      }
+      return;
+    },
+  });
+
+  static isolated = TaskIsolated;
+}
diff --git a/packages/seed-realm/tag.gts b/packages/seed-realm/tag.gts
new file mode 100644
index 0000000000..221412c25a
--- /dev/null
+++ b/packages/seed-realm/tag.gts
@@ -0,0 +1,43 @@
+import {
+  CardDef,
+  StringField,
+  contains,
+  field,
+  Component,
+} from 'https://cardstack.com/base/card-api';
+import TagIcon from '@cardstack/boxel-icons/tag';
+import { Pill } from '@cardstack/boxel-ui/components';
+
+export class Tag extends CardDef {
+  static displayName = 'Tag';
+  static icon = TagIcon;
+  @field name = contains(StringField);
+  @field title = contains(StringField, {
+    computeVia: function (this: Tag) {
+      return this.name;
+    },
+  });
+  @field color = contains(StringField);
+
+  static atom = class Atom extends Component<typeof this> {
+    <template>
+      {{#if @model.name}}
+        <Pill class='tag-pill' @pillBackgroundColor={{@model.color}}>
+          <:default>
+            <span># {{@model.name}}</span>
+          </:default>
+        </Pill>
+      {{/if}}
+
+      <style scoped>
+        .tag-pill {
+          font-size: calc(var(--boxel-font-size-xs) * 0.95);
+          font-weight: 500;
+          padding: 0;
+          --pill-font-color: var(--boxel-400);
+          border: none;
+        }
+      </style>
+    </template>
+  };
+}
diff --git a/packages/seed-realm/task-priority.gts b/packages/seed-realm/task-priority.gts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/packages/seed-realm/task.gts b/packages/seed-realm/task.gts
new file mode 100644
index 0000000000..cd3361e31c
--- /dev/null
+++ b/packages/seed-realm/task.gts
@@ -0,0 +1,648 @@
+import {
+  StringField,
+  contains,
+  field,
+  linksTo,
+  linksToMany,
+  Component,
+  FieldDef,
+} from 'https://cardstack.com/base/card-api';
+import NumberField from 'https://cardstack.com/base/number';
+
+import BooleanField from 'https://cardstack.com/base/boolean';
+
+import DateRangeField from './fields/date-range-field';
+import { Tag } from './tag';
+import { User } from './user';
+import { BoxelSelect } from '@cardstack/boxel-ui/components';
+import { RadioInput } from '@cardstack/boxel-ui/components';
+
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { fn } from '@ember/helper';
+import ChevronsUp from '@cardstack/boxel-icons/chevrons-up';
+import ChevronUp from '@cardstack/boxel-icons/chevron-up';
+import ChevronsDown from '@cardstack/boxel-icons/chevrons-down';
+import ChevronDown from '@cardstack/boxel-icons/chevrons-down';
+import CircleEqual from '@cardstack/boxel-icons/circle-equal';
+import { isToday, isThisWeek, addWeeks } from 'date-fns';
+import GlimmerComponent from '@glimmer/component';
+import Calendar from '@cardstack/boxel-icons/calendar';
+import { Pill } from '@cardstack/boxel-ui/components';
+import { CheckMark } from '@cardstack/boxel-ui/icons';
+import { Todo } from './todo';
+
+export class TaskStatusEdit extends Component<typeof TaskStatusField> {
+  @tracked label: string | undefined = this.args.model.label;
+  <template>
+    <BoxelSelect
+      @placeholder={{this.placeholder}}
+      @options={{this.statuses}}
+      @selected={{this.selectedStatus}}
+      @onChange={{this.onSelectStatus}}
+      as |item|
+    >
+      <div> {{item.label}}</div>
+    </BoxelSelect>
+  </template>
+
+  get selectedStatus() {
+    return this.statuses.find((status) => {
+      return status.label === this.label;
+    });
+  }
+
+  // This ensures you get values from the class the instance is created
+  get statuses() {
+    return (this.args.model.constructor as any).values as TaskStatusField[];
+  }
+
+  @action onSelectStatus(status: TaskStatusField): void {
+    this.label = status.label;
+    this.args.model.label = this.selectedStatus?.label;
+    this.args.model.index = this.selectedStatus?.index;
+    this.args.model.color = this.selectedStatus?.color;
+    this.args.model.completed = this.selectedStatus?.completed;
+  }
+
+  get placeholder() {
+    return 'Fill in';
+  }
+}
+
+export class TaskStatusField extends FieldDef {
+  @field index = contains(NumberField); //sorting order
+  @field label = contains(StringField);
+  @field color = contains(StringField);
+  @field completed = contains(BooleanField);
+  static values = [
+    { index: 0, label: 'Not Started', color: '#B0BEC5', completed: false },
+    {
+      index: 1,
+      label: 'In Progress',
+      color: '#64B5F6',
+      completed: false,
+    },
+    {
+      index: 2,
+      label: 'Done',
+      color: '#00BCD4',
+      completed: true,
+    },
+  ];
+
+  static embedded = class Embedded extends Component<typeof TaskStatusField> {
+    <template>
+      {{@model.label}}
+    </template>
+  };
+
+  //TODO: Not static. Need to improve ability to extend field templates
+  static edit = TaskStatusEdit;
+}
+
+export class FittedTask extends Component<typeof Task> {
+  get visibleTags() {
+    return [this.args.fields.tags[0], this.args.fields.tags[1]].filter(Boolean);
+  }
+
+  get dueDate() {
+    return this.args.model.dateRange?.end;
+  }
+
+  get dueDateStatus() {
+    return this.dueDate ? getDueDateStatus(this.dueDate.toString()) : undefined;
+  }
+
+  get hasDueDate() {
+    return Boolean(this.dueDate);
+  }
+
+  get hasDueDateStatus() {
+    return Boolean(this.dueDateStatus);
+  }
+
+  get isCompleted() {
+    return this.args.model.status?.completed ?? false;
+  }
+
+  <template>
+    <div class='task-card'>
+      <header>
+        <div class='task-status-and-tags-container'>
+          <TaskCompletionStatus
+            class='task-completion-status'
+            @completed={{this.isCompleted}}
+          />
+          {{#if this.visibleTags.length}}
+            <div class='card-tags'>
+              {{#each this.visibleTags as |Tag|}}
+                <Tag
+                  @format='atom'
+                  class='card-tag'
+                  @displayContainer={{false}}
+                />
+              {{/each}}
+            </div>
+          {{/if}}
+        </div>
+        <div class='priority-and-id-container'>
+          <@fields.priority class='priority' @format='atom' />
+          <span class='short-id'>{{@model.shortId}}</span>
+        </div>
+      </header>
+
+      <div class='card-info'>
+        {{#if @model.name}}
+          <h3 class='task-title'>{{@model.name}}</h3>
+        {{/if}}
+
+        <div class='date-info-container'>
+          {{#if this.hasDueDate}}
+            <div class='date-status-pill-container'>
+              {{#if this.dueDateStatus}}
+                <Pill
+                  class='date-status-pill'
+                  @pillBackgroundColor={{this.dueDateStatus.color}}
+                >
+                  <:default>{{this.dueDateStatus.label}}</:default>
+                </Pill>
+              {{/if}}
+
+              <div class='calendar-icon-container'>
+                <Calendar width='14px' height='14px' class='calendar-icon' />
+                <@fields.dateRange.end @format='atom' />
+              </div>
+            </div>
+          {{else}}
+            <span class='no-data-found-txt'>No Due Date Assigned</span>
+          {{/if}}
+        </div>
+      </div>
+
+      <footer>
+        {{!TODO: Actually, this shudn't be needed. atom default templates can't handle null values }}
+        {{#if @model.assignee}}
+          <@fields.assignee
+            class='card-assignee'
+            @format='atom'
+            @displayContainer={{false}}
+          />
+        {{/if}}
+      </footer>
+    </div>
+
+    <style scoped>
+      .task-status-and-tags-container {
+        display: flex;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        flex-shrink: 0;
+      }
+
+      .task-completion-status {
+        --boxel-circle-size: 14px;
+        --boxel-border-radius: var(--boxel-border-radius-xxs);
+      }
+
+      .task-card {
+        --task-font-weight-500: 500;
+        --task-font-weight-600: 600;
+        --tasl-font-size-extra-small: calc(var(--boxel-font-size-xs) * 0.95);
+        width: 100%;
+        height: 100%;
+        padding: var(--boxel-sp-sm);
+        display: flex;
+        flex-direction: column;
+        gap: var(--boxel-sp-sm);
+        overflow: hidden;
+      }
+      header {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: var(--boxel-sp-xxs);
+        justify-content: space-between;
+      }
+      .card-tags {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        overflow: hidden;
+        line-height: 1;
+      }
+      .card-tag {
+        width: auto;
+        height: auto;
+        overflow: unset;
+      }
+      .card-tags > :last-child {
+        -webkit-line-clamp: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .priority-and-id-container {
+        display: flex;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        margin-left: auto;
+      }
+      .short-id {
+        font-size: var(--tasl-font-size-extra-small);
+        font-weight: var(--task-font-weight-600);
+        color: var(--boxel-600);
+        line-height: normal;
+        background-color: var(--boxel-200);
+        padding: var(--boxel-sp-6xs) var(--boxel-sp-xxs);
+        border-radius: 5px;
+        white-space: nowrap;
+      }
+      .task-title {
+        margin: var(--boxel-sp-xxxs) 0;
+        padding: 0;
+        font-size: var(--boxel-font-size);
+        font-weight: var(--task-font-weight-600);
+        line-height: 1.2;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 2;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .date-info-container {
+        display: flex;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        margin-top: var(--boxel-sp-xxxs);
+      }
+      .no-data-found-txt {
+        font-size: var(--tasl-font-size-extra-small);
+        font-weight: var(--task-font-weight-500);
+        color: var(--boxel-400);
+        white-space: nowrap;
+        -webkit-line-clamp: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        margin-top: 1px;
+      }
+      .date-status-pill-container {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+      }
+      .date-status-pill {
+        height: 24px;
+        border: none;
+        border-radius: 5px 0 0 5px;
+        font-size: var(--tasl-font-size-extra-small);
+        font-weight: var(--task-font-weight-500);
+        position: relative;
+        padding: var(--boxel-sp-5xs) var(--boxel-sp-sm) var(--boxel-sp-5xs)
+          var(--boxel-sp-xxs);
+        clip-path: polygon(
+          0 0,
+          calc(100% - 8px) 0,
+          100% 50%,
+          calc(100% - 8px) 100%,
+          0 100%
+        );
+      }
+      .calendar-icon-container {
+        font-size: var(--tasl-font-size-extra-small);
+        display: inline-flex;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        overflow: hidden;
+      }
+      .calendar-icon {
+        flex-shrink: 0;
+      }
+      footer {
+        display: inline-flex;
+        align-items: center;
+        gap: var(--boxel-sp-xxxs);
+        color: var(--boxel-dark);
+        margin-top: auto;
+      }
+      .card-assignee {
+        width: auto;
+        height: auto;
+        overflow: unset;
+        margin-left: auto;
+      }
+      /*catch all for dismissing tags*/
+      @container fitted-card (width <= 226px) {
+        .card-tags {
+          display: none;
+        }
+      }
+
+      /*Aspect Ratio 0.95, 140px × 148px*/
+      /*Aspect Ratio 0.94, 120px × 128px*/
+      @container fitted-card (aspect-ratio <1.0) and (118px <= height < 129px) {
+        .priority,
+        .date-info-container {
+          display: none;
+        }
+        header {
+          flex-wrap: nowrap;
+        }
+      }
+
+      /*Aspect Ratio 3.4, 100px × 29px*/
+      /*Aspect Ratio 2.6, 150px × 58px*/
+      @container (aspect-ratio > 2.0) and (100px <= width <151px) and (29px <= height < 59px) {
+        .task-card {
+          padding: var(--boxel-sp-xxxs);
+          flex-direction: row;
+          align-items: center;
+          gap: var(--boxel-sp-sm);
+        }
+        .task-title,
+        .priority,
+        .date-info-container {
+          display: none;
+        }
+        header {
+          flex-wrap: nowrap;
+        }
+        .card-assignee {
+          display: none;
+        }
+      }
+
+      /*Aspect Ratio 3.9, 226px × 58px*/
+      /*Aspect Ratio 2.6, 300px × 115px*/
+      @container (aspect-ratio > 2.0) and (151px <= width < 301px) and (29px <= height < 116px) {
+        .task-title {
+          font-size: var(--boxel-font-size-sm);
+          -webkit-line-clamp: 1;
+        }
+        .task-card {
+          padding: var(--boxel-sp-xxxs);
+          flex-direction: row;
+          align-items: center;
+          gap: var(--boxel-sp-sm);
+        }
+        .priority {
+          display: none;
+        }
+        header {
+          flex-wrap: nowrap;
+        }
+        .date-info-container .date-status-pill {
+          display: none;
+        }
+        .card-assignee {
+          display: none;
+        }
+      }
+
+      /*Aspect Ratio 8.6, 500px × 58px*/
+      @container fitted-card (aspect-ratio > 6.0) {
+        .task-card {
+          padding: var(--boxel-sp-xs);
+          flex-direction: row;
+          align-items: center;
+          gap: var(--boxel-sp-sm);
+        }
+
+        .card-tags,
+        .date-info-container {
+          display: none;
+        }
+
+        .task-title {
+          font-size: var(--boxel-font-size-sm);
+        }
+
+        footer {
+          margin-top: 0;
+          margin-left: auto;
+        }
+        .task-completion-status {
+          --boxel-circle-size: 18px;
+          --boxel-border-radius: var(--boxel-border-radius-xs);
+        }
+      }
+    </style>
+  </template>
+}
+
+class EditPriority extends Component<typeof TaskPriority> {
+  @tracked label = this.args.model.label;
+
+  get priorities() {
+    return TaskPriority.values;
+  }
+
+  get selectedPriority() {
+    return this.priorities?.find((priority) => {
+      return priority.label === this.label;
+    });
+  }
+
+  @action handlePriorityChange(priority: TaskPriority): void {
+    this.label = priority.label;
+    this.args.model.label = this.selectedPriority?.label;
+    this.args.model.index = this.selectedPriority?.index;
+  }
+
+  <template>
+    <div class='priority-field'>
+      <RadioInput
+        @groupDescription='Select Task Priority'
+        @items={{this.priorities}}
+        @checkedId={{this.selectedPriority.label}}
+        @orientation='horizontal'
+        @spacing='default'
+        @keyName='label'
+        as |item|
+      >
+        <item.component @onChange={{fn this.handlePriorityChange item.data}}>
+          {{item.data.label}}
+        </item.component>
+      </RadioInput>
+    </div>
+  </template>
+}
+
+export class TaskPriority extends FieldDef {
+  @field index = contains(NumberField); //sorting order
+  @field label = contains(StringField);
+  // loosey goosey pattern
+  static values = [
+    { index: 0, label: 'Lowest', icon: ChevronsDown },
+    { index: 1, label: 'Low', icon: ChevronDown },
+    {
+      index: 2,
+      label: 'Medium',
+      icon: CircleEqual,
+    },
+    {
+      index: 3,
+      label: 'High',
+      icon: ChevronUp,
+    },
+    {
+      index: 4,
+      label: 'Highest',
+      icon: ChevronsUp,
+    },
+  ];
+
+  static edit = EditPriority;
+  static embedded = class Embedded extends Component<typeof TaskPriority> {
+    <template>
+      {{@model.label}}
+    </template>
+  };
+
+  static atom = class Atom extends Component<typeof this> {
+    get selectedPriority() {
+      return TaskPriority.values.find((priority) => {
+        return priority.label === this.args.model.label;
+      });
+    }
+
+    get selectedIcon() {
+      return this.selectedPriority?.icon;
+    }
+    <template>
+      <div class='icon-container'>
+        <this.selectedIcon width='14px' height='14px' />
+      </div>
+      <style scoped>
+        .icon-container {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 100%;
+          height: 100%;
+        }
+      </style>
+    </template>
+  };
+}
+
+export class Task extends Todo {
+  static displayName = 'Task';
+  @field tags = linksToMany(() => Tag);
+  @field dateRange = contains(DateRangeField);
+  @field status = contains(TaskStatusField);
+  @field assignee = linksTo(() => User);
+  @field priority = contains(TaskPriority);
+
+  @field title = contains(StringField, {
+    computeVia: function (this: Task) {
+      return this.name ?? `Untitled ${this.constructor.displayName}`;
+    },
+  });
+
+  @field shortId = contains(StringField, {
+    computeVia: function (this: Task) {
+      if (this.id) {
+        let id = shortenId(extractId(this.id));
+        return id.toUpperCase();
+      }
+      return;
+    },
+  });
+
+  static fitted = FittedTask;
+}
+
+function extractId(href: string): string {
+  const urlObj = new URL(href);
+  const pathname = urlObj.pathname;
+  const parts = pathname.split('/');
+  const lastPart = parts[parts.length - 1];
+  return lastPart.replace('.json', '');
+}
+
+function shortenId(id: string): string {
+  const shortUuid = id.slice(0, 8);
+  const decimal = parseInt(shortUuid, 16);
+  return decimal.toString(36).padStart(6, '0');
+}
+
+export function getDueDateStatus(dueDateString: string | null) {
+  if (!dueDateString) return null;
+
+  const dueDate = new Date(dueDateString);
+  const today = new Date();
+  const nextWeek = addWeeks(today, 1);
+
+  if (isToday(dueDate)) {
+    return {
+      label: 'Due Today',
+      color: '#01de67',
+    };
+  } else if (isThisWeek(dueDate)) {
+    return {
+      label: 'This Week',
+      color: '#ffbc00',
+    };
+  } else if (dueDate > today && dueDate < nextWeek) {
+    return {
+      label: 'Next Week',
+      color: '#4fc8fd',
+    };
+  }
+
+  return null;
+}
+
+interface TaskCompletionStatusSignature {
+  Element: HTMLDivElement;
+  Args: {
+    completed: boolean;
+  };
+}
+
+export class TaskCompletionStatus extends GlimmerComponent<TaskCompletionStatusSignature> {
+  <template>
+    <div class='completion-status' ...attributes>
+      <span class='checkmark {{if @completed "completed"}}'>
+        {{#if @completed}}
+          <CheckMark class='checkmark-icon' />
+        {{/if}}
+      </span>
+    </div>
+
+    <style scoped>
+      .completion-status {
+        --circle-size: var(--boxel-circle-size, 20px);
+        --border-radius: var(
+          --boxel-border-radius,
+          var(--boxel-border-radius-xxs)
+        );
+        display: inline-flex;
+        align-items: center;
+      }
+      .checkmark {
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        height: var(--circle-size);
+        width: var(--circle-size);
+        background-color: white;
+        border: 2px solid var(--boxel-400);
+        border-radius: var(--border-radius);
+        transition: all 0.2s ease;
+      }
+      .checkmark.completed {
+        background-color: var(--boxel-highlight);
+        color: white;
+      }
+      .checkmark-icon {
+        --icon-size: calc(var(--circle-size, 20px) * 0.8);
+        width: var(--icon-size);
+        height: var(--icon-size);
+      }
+    </style>
+  </template>
+}
diff --git a/packages/seed-realm/todo.gts b/packages/seed-realm/todo.gts
new file mode 100644
index 0000000000..5b57076313
--- /dev/null
+++ b/packages/seed-realm/todo.gts
@@ -0,0 +1,13 @@
+import {
+  CardDef,
+  field,
+  contains,
+  StringField,
+} from 'https://cardstack.com/base/card-api';
+import MarkdownField from 'https://cardstack.com/base/markdown';
+
+export class Todo extends CardDef {
+  static displayName = 'Todo';
+  @field name = contains(StringField);
+  @field details = contains(MarkdownField);
+}