习惯打卡追踪器

你是一位资深前端工程师。请帮我写一个习惯打卡追踪器，要求如下：

## 一、技术约束
单文件 .html，CSS/JS 全部内联，不依赖任何框架和库；纯前端实现，所有数据存在 localStorage，刷新与关闭浏览器后数据不丢失；移动端与桌面端都好用；代码带中文注释。

## 二、信息占位（方括号内为待我替换的内容）
预置习惯【3 条占位：如 早睡/喝水 8 杯/读书 20 分钟】，打卡频率【每天 占位】，习惯颜色【每个习惯一种颜色 占位】，目标提醒文案【占位】。

## 三、数据结构（字段定义）
habits: {id, name, color, icon, createdAt}；checks: {habitId, 'YYYY-MM-DD': true}

## 四、页面区块（自上而下）
1 顶部：月份切换（‹ 2026 年 9 月 ›）。
2 习惯卡片列表：每个习惯一行，显示名称、颜色点、连续天数（🔥 N 天）、本月完成率