gvc_cards

The three non-playing phase cards for Gumdrop Vale.

M.build(kind, data) returns a full-screen tree for "title", "won" or "lost". The win card names the time left (data.secondsLeft); the lose card names how many wells were bloomed (data.bloomCount).

A card mounts once per phase change, so unlike the HUD it does use CSS animation: the scrim fades up, the plate rises and settles, and the eyebrow, heading, rule and body cascade in behind it on staggered delays. Re-registering the same tree restarts all of that, which is why the driver registers a card on the phaseChanged edge and then leaves it alone.

Two layout facts the tree depends on

• wrap is a label prop, not a style key. A width in style alone clips nothing; the line runs straight off both edges of the plate. The paragraph helper sets props.wrap.
• The accent colour never paints text. Each card's accent (MOTE for the title, BLOOM_FLORA for the win, a drained lilac for the loss) tints the border, the rule and the pill behind the hint, while the hint itself stays UI_INK — a mint or cream accent as type on a cream plate is invisible.