待办清单

用 HTML5、CSS3 和原生 JavaScript 创建一个响应式待办事项应用。该应用应具有现代、简洁的 UI，使用 CSS Grid/Flexbox 和直观的控件。实现完整的 CRUD 功能（添加/编辑/删除/完成任务），并带有流畅的动画。包含任务分类，支持颜色编码和优先级（低/中/高）。添加截止日期，带有日期选择器组件和提醒通知。使用 localStorage 在会话之间持久化数据。实现搜索功能，支持按状态、分类和日期范围筛选。使用 HTML5 Drag and Drop API 实现任务的拖放重新排序。确保设计完全响应式，使用媒体查询设置适当的断点。包含深色/浅色主题切换，并遵循用户系统偏好。添加细微的微交互和过渡，以提升用户体验。

Create a responsive todo app with HTML5, CSS3 and vanilla JavaScript. The app should have a modern, clean UI using CSS Grid/Flexbox with intuitive controls. Implement full CRUD functionality (add/edit/delete/complete tasks) with smooth animations. Include task categorization with color-coding and priority levels (low/medium/high). Add due dates with a date-picker component and reminder notifications. Use localStorage for data persistence between sessions. Implement search functionality with filters for status, category, and date range. Add drag and drop reordering of tasks using the HTML5 Drag and Drop API. Ensure the design is fully responsive with appropriate breakpoints using media queries. Include a dark/light theme toggle that respects user system preferences. Add subtle micro-interactions and transitions for better UX.