Tasks

You have a proposal, two specs, and a design doc. The AI has everything it needs. Now you break the work into tasks and hand it over.

Run this:

/opsx:apply

OpenSpec reads all four artifacts and generates a tasks.md in your change folder. Open it. You'll see three sections — HTML Structure, CSS, JavaScript — with numbered checkboxes:

• Build the page scaffold and container div
• Style the variants using CSS custom properties
• Add the enter animation and exit transition
• Implement ToastManager with show() and dismiss()
• Wire the demo buttons

Each task maps directly to a decision in the design doc. The ToastManager class is task 3.1 because the design doc named it. The once: true fix is baked into task 3.3 because the risks section flagged it. Nothing is a surprise.

Now run /opsx:apply a second time. This time it doesn't generate tasks — it reads them and starts working through them, checking each one off as it goes.

Watch what happens. The AI isn't guessing at the shape of the code — it's reading the spec and executing against it. When it implements dismiss(), it knows the animation plays before the element is removed because that's in toast-lifecycle/spec.md. When it defines the color variables, it knows the names because the design doc said "CSS custom properties for variant colors."

When it's done, open toast.html in a browser and try each button. The implementation should match what you wrote in lessons 03 through 05 — because the AI read those files instead of guessing.