Prompt it

Create a beginner-friendly responsive activity timeline using semantic HTML and dependency-free CSS. Use a section labelled by a visible Project activity heading and an ordered list of three chronological project milestones. Each milestone needs a time element with a machine-readable datetime, a short heading, and a concise description. Draw a vertical connecting line and decorative circular markers with CSS pseudo-elements, without inserting meaningless characters into accessible text. Keep long headings and descriptions wrapping at 320px and in a narrow padded grid preview. Use scoped classes, min-width: 0 where needed, system fonts, readable contrast, and generous spacing. This is static content, so do not add tabindex, interactive-looking controls, JavaScript, frameworks, external assets, animations, or transitions. Return complete copy-ready HTML and CSS, then explain the ordered list, semantic dates, and decorative line for a beginner. Explain that new activity must be added manually or supplied by the host application.