diff --git a/.story_kit/work/5_done/309_story_show_token_cost_breakdown_in_expanded_work_item_detail_panel.md b/.story_kit/work/5_done/309_story_show_token_cost_breakdown_in_expanded_work_item_detail_panel.md
new file mode 100644
index 0000000..3d26c3c
--- /dev/null
+++ b/.story_kit/work/5_done/309_story_show_token_cost_breakdown_in_expanded_work_item_detail_panel.md
@@ -0,0 +1,20 @@
+---
+name: "Show token cost breakdown in expanded work item detail panel"
+---
+
+# Story 309: Show token cost breakdown in expanded work item detail panel
+
+## User Story
+
+As a project owner viewing a work item in the web UI, I want to see a per-agent token cost breakdown in the expanded detail panel, so that I can understand where tokens were spent on that story.
+
+## Acceptance Criteria
+
+- [ ] WorkItemDetailPanel fetches token cost data using the existing /work-items/:story_id/token-cost endpoint
+- [ ] Shows per-agent session breakdown: agent name, model, token counts (input/output/cache), cost in USD
+- [ ] Shows total cost for the story
+- [ ] Shows empty state when no token data exists for the story
+
+## Out of Scope
+
+- TBD