Motir

Estimate: 40m · Depends on: 4.2.1

The design asset every UI subtask of this story builds against. The start/complete ENTRY POINTS are already designed — the Start-sprint button in the backlog sprint container (4.2.1) and the Complete-sprint button in the scrum header (4.5.1) — but the FLOWS they open are drawn nowhere (both prior assets explicitly defer the flow to Story 4.4). Unspecified == NO design, so this subtask produces it FIRST (mirrors 1.0.5 / 1.2.1 / 1.3.3 / 1.5.1, the 4.2.1 backlog area it inherits the sprint-container visual language from, and the 4.5.1 scrum extension). Output: design/sprints/sprint-lifecycle.mock.html (an HTML mockup built from the real design system — components/ui/* + the --el-* tokens, so a coding agent has no Pencil→code gap) + a PNG export + design/sprints/design-notes.md naming the composing primitives, copy, and placement. --el-* only (no Tier-0 --color-*); shape via the element shape tokens; AA-safe; Jira start-sprint / complete-sprint / sprint-report dialogs as the mirror (rung 1).

Specify, panel by panel:

• Start-sprint modal — a Modal launched from the (already-designed) backlog Start-sprint button: the sprint name (editable), a duration control (1 / 2 / 3 / 4 weeks / Custom — the Jira deck; Custom reveals explicit start/end date pickers), the derived start + end dates, and a goal textarea. Primary "Start" + cancel. Reuse Modal, FormField, Button, the date input, the Combobox/segmented control for duration — do not invent a dialog shell.
• Start error state — the "already active" message when the project has an active sprint ("Project X already has an active sprint — complete it first"), and the invalid-window inline error. Drawn as the modal's error treatment (text + --el-danger, not colour alone).
• Complete-sprint modal — a Modal launched from the Complete-sprint button: a summary line ("N completed · M incomplete"), and a carry-over chooser for the incomplete issues — a radio/Combobox group: Backlog (default) or a planned sprint (a select of the project's planned sprints; empty when none). Primary "Complete sprint" + cancel. Note the no-incomplete case (the chooser collapses to "All issues complete").
• Sprint report — the post-completion success surface (and the standalone view): the completed vs not-completed issue lists (each a bounded list of issue rows reusing the work-items row vocabulary, with a "view all in Issues" link), the points summary (committed / completed / not-completed as labelled numbers — text+number, "—" when unestimated, finding #35), and the scope-change line ("N issues added during the sprint"). Leave a documented chart SEAM for Story 4.6's burndown (an empty slot, the same seam pattern 4.5 used). Specify where the report renders: inline as the complete modal's success state AND as a reachable standalone panel for a closed sprint.
• States — loading + error for each modal (reuse the shipped Modal/ErrorState); the disabled Start button (empty sprint) is the 4.2.1 entry-point's concern (reference, don't redraw).

Acceptance criteria

• design/sprints/sprint-lifecycle.mock.html + a PNG export + design/sprints/design-notes.md exist; the mockup is built from components/ui/* + --el-*/element-shape tokens only (no Tier-0 --color-*, no raw rounded-*/p-* for control shape), passes the render checklist (icon viewBox, no nested buttons, prettier), and is AA-safe.
• The mockup draws: the start-sprint modal (name + duration deck + derived dates + custom-date reveal + goal), the start error states (already-active, invalid window), the complete-sprint modal (completed/incomplete summary + carry-over chooser: Backlog · planned sprint · no-incomplete collapse), and the sprint report (completed/not-completed lists with "view all" links + committed/completed/not-completed points + "—" unestimated + scope-change line + the 4.6 chart seam).
• design-notes.md names each composing primitive (Modal, FormField, Button, date input, Combobox/segmented duration, the issue-row vocabulary, EmptyState), documents that the Start/Complete ENTRY POINTS live in 4.2.1 / 4.5.1 (this asset is the FLOWS only), that the burndown CHART is Story 4.6 (the report shows numeric/list summary + a chart seam), and the dialog-a11y + not-colour-alone (finding #35) rules.
• The asset REFERENCES (does not redraw) the backlog sprint container (4.2.1) + the scrum header (4.5.1) entry points; it specifies only the modal flows + the report.

Context refs

• design/backlog/backlog.mock.html + design-notes.md (4.2.1) — the Start-sprint entry point + sprint-container visual language this inherits (the modal launches from there)
• design/boards/scrum.mock.html + design-notes.md §"Complete-sprint is an ENTRY POINT only (the flow is Story 4.4)" (4.5.1) — the Complete-sprint entry point this flow opens from
• components/ui/* (Modal, FormField, Button, Combobox, date input, EmptyState, Pill) + the heading type scale — the primitives to compose
• app/globals.css --el-* + element-shape tokens; the /tokens specimen route
• Jira start-sprint / complete-sprint / sprint-report dialogs as the mirror; finding #35 (not colour-alone), #54 (use the palette); the design-mockup render checklist