Diagram playground

• a C4 node drags to a position the text records
• a flowchart step drags to a position the text pins it at, while every step left unpinned stays solved from the arrows
• a use case or an actor drags to a position the text records, and the boundary grows around it rather than cropping it
• an ER entity drags to a position the text records, while its connectors still leave the faces the solved columns chose
• a sequence message or lifeline drags into a new order, its wording edited in place
• a C4 node's type, name, description, technology, icon, colour, tags and boundary edited in the details panel beside it, where a child view is added or removed, a selected boundary renamed or removed, and a selected relationship's wording, direction and line style edited — or the relationship deleted
• a selected flowchart step's wording, technology and tags are edited in the details dock, and a selected arrow's guard label with them — or the arrow removed
• a selected use case or actor's wording, technology and tags are edited in the details dock
• a selected ER entity's wording, technology and tags are edited in the detail panel, and a relationship's verb in its own
• a dictionary section or field drags to a new place in the reading order, which is the order the text already states
• a new C4 node — or a reference to an element from an outer level — added from the palette, at a spot the text records
• a flowchart step is added by splitting an arrow, which writes the step between the two it already joined
• a relationship drawn from one C4 element onto another — or onto a new element added with it — landing as a relationship line
• a flowchart arrow is drawn by dragging from one step to another, writing the connection as a line of text
• a use case diagram's title and description are retyped in the heading the canvas already draws above the boundary
• a dictionary's title is retyped in the heading above the table
• C4 nodes group into a boundary with a drag selection — the Select / Pan toggle by the zoom controls makes a drag pan instead
• on a sequence diagram: reword a step · change ends · move a step in time · remove a step · rename a lifeline · move a column · remove a lifeline · add a step · add a lifeline · number the steps
• the other kinds lay themselves out from the text

.alab is the format to write: it is what the syntax reference documents, what share links carry, and what reads cleanly in a code review. .archlab.json is the same C4 model on disk — the interchange form any other tool can read without implementing a grammar; the two are lossless twins in both directions (proved on every build), so you never have to write the JSON by hand. Mermaid is read and written too, lossily — the format toggle above the pane converts in place and states what each direction drops.