Build a guide library with Tailwind CSS: a filter bar with difficulty pills (Beginner / Intermediate / Advanced), a topic select and a sort control (Newest / Shortest / Most popular), and a grid of guide cards each showing a level badge, estimated reading time, the guide title and a one-line outcome ("By the end you'll…"). Show a progress ring on guides the visitor already started, and display an empty state with a reset-filters button when nothing matches.
提示词保持英文原文——直接粘贴进 Claude、Cursor、v0 或任何 AI 编程工具即可使用。