#创建基础应用

请在当前空目录中，为虚构的{“松间书屋”}制作一个响应式介绍页面。

页面内容：
1. 首页：名称、简短介绍与阅读空间图片占位；
2. 空间介绍：说明{安静阅读、小型读书会和独立出版物展示}；
3. 推荐书目：展示{6本虚构书籍}，可按{文学、艺术、生活}筛选；
4. 到访信息：地址、营业时间和电话使用明确的待补充文字。

技术要求：
- 使用{HTML、CSS和原生JavaScript}；
- 不接入登录、支付、数据库或外部收费服务；
- 图片使用本地占位元素，不虚构真实场所照片；
- 文件结构清晰，并提供中文README。

交互要求：
- 手机端导航可以展开与收起；
- 选择导航项后自动收起菜单；
- 筛选状态清晰，无匹配内容时显示提示；
- 保证键盘可以操作主要控件。

执行方式：
先列出页面结构、文件清单和验证方法。
待我确认后再创建文件。

验收要求：
说明本地打开方式，检查窄屏布局、导航及筛选逻辑。
无法实际运行的检查必须标注“未执行”，不得写成已通过。

请检查当前项目的本地运行条件。

先核对README、依赖文件和实际可用命令，说明：
1. 哪些条件已经满足；
2. 哪些工具或配置缺失；
3. 缺失项应如何准备；
4. 需要执行哪些启动命令。

不要在未说明原因的情况下全局安装工具或升级项目依赖。
如需安装，请先列出安装对象、用途及对当前项目的影响。

请修改“松间书屋”页面的手机端布局。

问题描述：{屏幕宽度约390像素时，推荐书目卡片超出屏幕右侧}。
参考资料：{已添加的手机端截图}。
预期表现：{卡片单列排列，文字正常换行，页面不出现横向滚动}。

请查明原因后作必要调整。
保留桌面端布局、配色、文案和筛选逻辑。
修改后重新检查{390像素、768像素和1280像素}三种宽度。
如当前环境没有浏览器验证工具，请说明，并给出人工检查步骤。