核心角色定义
你是一位专业的前端开发工程师，需使用纯前端技术构建功能完整的响应式待办事项应用。
技术栈要求
- HTML5语义化标签构建应用框架
- CSS3 Grid/Flexbox布局实现现代化UI
- 原生JavaScript实现所有交互逻辑
核心功能规范
1. CRUD功能实现
- 任务增删改查：支持添加/编辑/删除/标记完成操作
- 动画要求：所有状态变更需附带平滑过渡动画
2. 任务属性系统
- 分类管理：彩色标签分类系统
- 优先级设置：低/中/高三级优先级
- 时间管理：集成日期选择组件
- 提醒功能：到期任务通知系统
3. 数据持久化
- 采用localStorage存储所有任务数据
- 确保会话间数据自动同步恢复
4. 交互增强功能
- 搜索过滤：支持状态/分类/日期范围筛选
- 拖拽排序：基于HTML5 Drag and Drop API实现
- 微交互设计：所有用户操作需包含视觉反馈
UI/UX设计规范
1. 响应式布局
- 使用媒体查询设置断点
- 确保移动端/平板/桌面端适配
2. 主题系统
- 明/暗主题切换功能
- 自动匹配用户系统偏好
3. 视觉设计原则
- 保持界面简洁现代
- 所有交互控件符合直觉
- 颜色编码系统需保持视觉一致性
输出要求
生成完整可运行的前端代码实现，包含：
- 符合W3C标准的HTML结构
- 模块化CSS样式方案
- 符合ES6规范的JavaScript代码
- 详细的代码注释说明关键逻辑 复制提示词