spencerkit · pallyoung · May 18, 2026 · May 17, 2026 · May 17, 2026 · May 17, 2026
diff --git a/.changeset/bright-rabbits-attend.md b/.changeset/bright-rabbits-attend.md
@@ -0,0 +1,4 @@
+"@spencer-kit/coder-studio": patch
+---
+
+Fix supervisor dialog polish by removing the duplicated desktop intro panel and ensuring the scheduled-time picker popover renders above modal overlays.
diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@
 
 # Coder Studio
 
-**A browser-based AI coding workspace for developers who move between desktop, tablet, and phone.**
+**Coder Studio, made for vibe coding.**
 
 Run Claude Code and Codex in one workspace. Keep your terminal, files, Git view, and AI sessions available from any device.
 
@@ -21,14 +21,34 @@ Run Claude Code and Codex in one workspace. Keep your terminal, files, Git view,
 
 [![Workspace Preview](docs/help/assets/screenshot-desktop-workspace-full.png)](docs/help/assets/screenshot-desktop-workspace-full.png)
 
-<div align="center">Preview the full workspace layout built for AI coding, supervision, and device switching.</div>
+<div align="center">Preview the full workspace layout built for vibe coding, supervision, and device switching.</div>
 
 ## Why It Feels Different
 
-- **One browser workspace for AI coding** — Keep terminal, files, Git, and AI sessions in one place.
+- **One browser workspace for vibe coding** — Keep terminal, files, Git, and agent sessions in one place.
 - **Built for device switching** — Start on desktop, continue on tablet, and check progress from your phone.
 - **Objective-driven multi-step orchestration** — Let Supervisor steer long-running AI tasks so you do not have to babysit every turn, reduce repetitive manual prompting, and get more consistent outcomes.
 
+## Why Coder Studio?
+
+Vibe coding agents are powerful, but the raw workflow is still fragmented:
+
+- the agent runs in one terminal
+- files and diffs live in another editor
+- verification happens in separate shell tabs
+- long-running tasks are hard to monitor away from your desk
+- mobile access usually means SSH or remote desktop
+
+Coder Studio turns that scattered workflow into one local browser workspace.
+
+| Pain | Without Coder Studio | With Coder Studio |
+|------|----------------------|-------------------|
+| Long agent tasks | Watch a terminal or come back later and reconstruct context | Keep sessions, terminal output, files, and Git changes visible in one workspace |
+| Cross-device work | Use SSH, remote desktop, or rebuild context on another machine | Reopen the same local workspace from desktop, tablet, or phone |
+| Reviewing AI changes | Jump between terminal, editor, and Git tools | Inspect files and diffs beside the agent session |
+| Multiple agents | Manage separate terminal windows and histories | Run Claude and Codex sessions side by side in one workspace |
+| Local-first control | Move work into a hosted IDE or cloud VM | Keep the runtime and project files on your own machine |
+
 ## Quick Start
 
 ```bash
@@ -119,10 +139,12 @@ The same workspace URL works across all devices — interface adapts automatical
 | [App Overview](docs/help/app-overview.md) | Core concepts and features |
 | [Provider Setup](docs/help/providers.md) | Claude Code / Codex CLI installation |
 | [Desktop Guide](docs/help/desktop-guide.md) | PC interface and shortcuts |
-| [Mobile Guide](docs/help/mobile-guide.md) | Phone / tablet usage |
+| [Mobile & Remote Access Guide](docs/help/mobile-guide.md) | Phone / tablet usage, LAN access, Tailscale/ngrok/Cloudflare Tunnel |
 | [Common Workflows](docs/help/workflows.md) | Task-based tutorials |
 | [Troubleshooting](docs/help/troubleshooting.md) | FAQ and known issues |
 | [CLI Reference](docs/help/cli.md) | Command-line options |
+| [GitHub Wiki Source](docs/wiki/README.md) | Wiki pages for product positioning, security, and workflows |
+| [AI Coding Terms](docs/wiki/AI-Coding-Terms.md) | Vibe coding, agentic harnesses, eval harnesses, and where Coder Studio fits |
 
 ---
 

diff --git a/README.zh-CN.md b/README.zh-CN.md
@@ -4,7 +4,7 @@
 
 # Coder Studio
 
-**一个浏览器里的 AI 编程工作台，适合在桌面、平板和手机之间切换的开发者。**
+**Coder Studio，生来就是 vibe coding。**
 
 在同一个工作台里运行 Claude Code 和 Codex，让终端、文件、Git 视图和 AI 会话跟着你在不同设备间延续。
 
@@ -21,14 +21,34 @@
 
 [![工作区预览](docs/help/assets/screenshot-desktop-workspace-full.png)](docs/help/assets/screenshot-desktop-workspace-full.png)
 
-<div align="center">预览这个为 AI 编程、Supervisor 监督和跨设备切换而设计的完整工作区布局。</div>
+<div align="center">预览这个为 vibe coding、Supervisor 监督和跨设备切换而设计的完整工作区布局。</div>
 
 ## 为什么它不一样
 
 - **一个浏览器里完成 AI 编程工作流** — 把终端、文件、Git 和 AI 会话放到同一个工作台。
 - **真正为设备切换而设计** — 在桌面端开始，在平板继续，用手机随时查看 Agent 进度。
 - **目标驱动的多轮调度** — 让 Supervisor 接管长任务推进，你不必全程盯守每一轮输出，减少机械重复的人工催促，并获得更稳定的执行效果。
 
+## 为什么选择 Coder Studio？
+
+vibe coding agent 已经很强，但原始工作流仍然是割裂的：
+
+- Agent 跑在一个终端里
+- 文件和 diff 在另一个编辑器里
+- 验证命令散落在不同 shell tab
+- 长任务离开电脑后很难继续观察
+- 手机访问通常只能靠 SSH 或远程桌面
+
+Coder Studio 把这些分散的环节收进同一个本地浏览器工作台。
+
+| 痛点 | 没有 Coder Studio | 使用 Coder Studio |
+|------|-------------------|-------------------|
+| 长时间 Agent 任务 | 盯着终端，或者回来后重新拼上下文 | 会话、终端输出、文件和 Git 变更都在同一个工作区里 |
+| 跨设备继续 | SSH、远程桌面，或在另一台机器重新配置 | 桌面、平板、手机重新打开同一个本地工作区 |
+| 审阅 AI 改动 | 在终端、编辑器、Git 工具之间切换 | 在 Agent 会话旁边直接查看文件和 diff |
+| 多 Agent 并行 | 多个终端窗口和历史记录分散管理 | Claude 和 Codex 会话在同一个工作区里并行管理 |
+| 本地优先 | 把环境迁到云 IDE 或远程 VM | 运行时和项目文件留在自己的机器上 |
+
 ## 快速开始
 
 ```bash
@@ -119,10 +139,12 @@ coder-studio open
 | [功能总览](docs/help/app-overview.md) | 核心概念和功能 |
 | [Provider 配置](docs/help/providers.md) | Claude Code / Codex CLI 安装 |
 | [桌面端指南](docs/help/desktop-guide.md) | PC 界面和快捷键 |
-| [移动端指南](docs/help/mobile-guide.md) | 手机/平板使用 |
+| [移动端与远程访问指南](docs/help/mobile-guide.md) | 手机/平板使用、局域网访问、Tailscale/ngrok/Cloudflare Tunnel |
 | [常用工作流](docs/help/workflows.md) | 任务式教程 |
 | [故障排除](docs/help/troubleshooting.md) | 常见问题和修复 |
 | [CLI 参考](docs/help/cli.md) | 命令行选项 |
+| [GitHub Wiki 源文件](docs/wiki/README.md) | 产品定位、安全说明和工作流 Wiki 页面 |
+| [AI Coding 术语](docs/wiki/AI-Coding-Terms.md) | Vibe coding、agentic harness、eval harness，以及 Coder Studio 的定位 |
 
 ---
 

diff --git a/docs/help/README.md b/docs/help/README.md
@@ -14,7 +14,7 @@
 
 ## 我主要在手机上使用
 
-- [移动端使用指南](mobile-guide.md) — 手机端界面和操作
+- [移动端与远程访问指南](mobile-guide.md) — 手机端界面、局域网访问、Tailscale/ngrok/Cloudflare Tunnel
 
 ## 我想了解产品结构
 

diff --git a/docs/help/assets/screenshot-desktop-workspace-full.png b/docs/help/assets/screenshot-desktop-workspace-full.png
diff --git a/docs/help/assets/screenshot-mobile.png b/docs/help/assets/screenshot-mobile.png
diff --git a/docs/help/assets/screenshot-pc.png b/docs/help/assets/screenshot-pc.png
diff --git a/docs/help/mobile-guide.md b/docs/help/mobile-guide.md
@@ -1,18 +1,161 @@
-# 移动端使用指南
+# 移动端与远程访问指南
 
-这篇文档介绍如何通过手机浏览器使用 Coder Studio。移动端适合查看状态、监控 Agent 进度和轻量操作。
+这篇文档介绍如何通过手机浏览器使用 Coder Studio，以及如何把本机运行的 Coder Studio 安全地开放给其他设备或外网访问。移动端适合查看状态、监控 Agent 进度和轻量操作。
 
 ## 这篇文档解决什么问题
 
-如何在手机上访问和使用 Coder Studio，包括界面导航、会话管理和文件查看。
+如何在手机上访问和使用 Coder Studio，包括局域网访问、远程访问、界面导航、会话管理和文件查看。
 
 ## 前置条件
 
 - Coder Studio 服务已在电脑上运行（`coder-studio serve` 或 `coder-studio open`）
-- 手机和电脑在同一局域网
-- 手机浏览器访问 `http://<电脑IP>:<端口>`
+- 如果要从其他设备访问，建议先设置密码：`coder-studio config --password <强密码>`
+- 如果要从局域网其他设备访问，服务需要监听非 localhost 地址：`coder-studio config --host 0.0.0.0`
+- 修改配置后重启服务：`coder-studio serve --restart`
 
-> 如果不知道本机 IP 和端口，执行 `coder-studio status` 查看 "Listen URL"。
+> 如果不知道本机 IP 和端口，执行 `coder-studio status` 查看监听地址和端口。
+
+## 选择访问方式
+
+| 场景 | 推荐方式 | 适合谁 |
+|------|----------|--------|
+| 手机和电脑在同一个 Wi-Fi | 局域网 IP 访问 | 家里、办公室内网、临时查看 |
+| 只有自己的设备需要远程访问 | Tailscale | 多设备开发者、长期使用 |
+| 临时给外网一个访问地址 | ngrok | 演示、临时测试、Webhook |
+| 有自己的域名并想长期暴露 | Cloudflare Tunnel | 固定域名、长期远程访问 |
+
+不建议直接把 Coder Studio 端口暴露到公网。至少先启用密码，并优先使用 Tailscale、ngrok 或 Cloudflare Tunnel 这类反向隧道/VPN 方案。
+
+## 局域网访问
+
+局域网访问适合手机和电脑在同一 Wi-Fi 下的情况。
+
+### 1. 启用密码
+
+```bash
+coder-studio config --password <强密码>
+```
+
+### 2. 监听局域网地址
+
+默认如果服务只监听 `localhost`，手机无法访问电脑上的服务。改成监听所有网卡：
+
+```bash
+coder-studio config --host 0.0.0.0
+coder-studio serve --restart
+```
+
+### 3. 查看地址
+
+```bash
+coder-studio status
+```
+
+在手机浏览器中访问：
+
+```text
+http://<电脑局域网IP>:<端口>
+```
+
+例如：
+
+```text
+http://192.168.1.23:4173
+```
+
+### 4. 如果打不开
+
+- 确认手机和电脑在同一个 Wi-Fi，且没有开启访客网络隔离
+- 确认电脑防火墙允许该端口的入站连接
+- 确认 Coder Studio 不是只监听 `localhost`
+- 如果正在使用 VPN、公司网络或校园网，网络可能禁止设备互访
+- 在电脑上重新执行 `coder-studio status`，确认端口没有变化
+
+## Tailscale 访问
+
+Tailscale 适合“只让自己的设备访问”。它会把你的电脑、手机、平板加入同一个私有 tailnet，不需要把服务直接暴露到公网。
+
+基本流程：
+
+1. 在电脑和手机上安装并登录 Tailscale
+2. 在电脑上启动 Coder Studio
+3. 启用密码并重启服务
+4. 在手机上用电脑的 Tailscale IP 或 MagicDNS 名称访问
+
+```bash
+coder-studio config --password <强密码>
+coder-studio config --host 0.0.0.0
+coder-studio serve --restart
+tailscale status
+```
+
+然后在手机浏览器访问：
+
+```text
+http://<电脑的 Tailscale IP>:<端口>
+```
+
+如果你希望使用 Tailscale 的 HTTPS/Serve/Funnel 能力，请参考官方文档：
+
+- Tailscale Serve：适合 tailnet 内设备访问
+- Tailscale Funnel：适合公开到互联网，风险更高，启用前确认访问控制和认证
+
+## ngrok 临时外网访问
+
+ngrok 适合临时把本机服务暴露给外网，例如演示或测试。它会生成一个公开 HTTPS 地址，并转发到本机端口。
+
+先确认端口：
+
+```bash
+coder-studio status
+```
+
+假设 Coder Studio 运行在 `4173`：
+
+```bash
+ngrok http 4173
+```
+
+ngrok 会显示一个 `https://...ngrok...` 地址。用手机打开这个地址即可。
+
+使用 ngrok 前请注意：
+
+- 一定先设置 Coder Studio 密码
+- 不要把生成的公网地址发给不可信的人
+- 演示结束后停止 ngrok 进程
+- 免费/付费能力、固定域名和访问控制以 ngrok 官方说明为准
+
+## Cloudflare Tunnel 长期外网访问
+
+Cloudflare Tunnel 适合你有自己的域名，并希望长期通过 HTTPS 访问本机服务。它通过 `cloudflared` 从你的电脑主动连接 Cloudflare，不需要在路由器上开公网入站端口。
+
+临时 Quick Tunnel 示例：
+
+```bash
+cloudflared tunnel --url http://localhost:<端口>
+```
+
+长期使用建议在 Cloudflare Zero Trust 中创建受管理的 Tunnel，并绑定自己的域名，例如：
+
+```text
+https://coder.example.com -> http://localhost:<端口>
+```
+
+使用 Cloudflare Tunnel 前请注意：
+
+- 一定先设置 Coder Studio 密码
+- 更推荐配合 Cloudflare Access 或其他身份校验
+- 如果电脑关机、休眠或 `cloudflared` 停止，远程地址也会不可用
+- 固定域名和访问策略以 Cloudflare 官方文档为准
+
+## 安全建议
+
+- 只在可信网络中使用局域网访问
+- 开放给其他设备前先执行 `coder-studio config --password <强密码>`
+- 不要把无密码的 Coder Studio 暴露到公网
+- 不要在公开链接中打开敏感项目，除非你确认认证、网络和访问控制都已配置好
+- 如果只是自己跨设备使用，优先选择 Tailscale，而不是直接公网暴露
+- 临时分享结束后，停止 ngrok、Cloudflare Tunnel 或 Tailscale Funnel
 
 ## 移动端界面结构
 
@@ -89,7 +232,21 @@
 确保 Provider 已正确安装且服务在运行。
 
 **Q：手机上怎么知道访问地址？**
-在电脑上执行 `coder-studio status`，找到 "Local URL" 对应的地址。确保手机和电脑在同一网络。
+在电脑上执行 `coder-studio status`，找到当前监听地址和端口。如果手机和电脑在同一局域网，访问 `http://<电脑局域网IP>:<端口>`。如果使用 Tailscale，访问 `http://<电脑 Tailscale IP>:<端口>`。
+
+**Q：为什么电脑能打开，手机打不开？**
+常见原因是服务只监听 `localhost`、手机和电脑不在同一网络、Wi-Fi 开启了设备隔离，或电脑防火墙阻止端口访问。先执行 `coder-studio config --host 0.0.0.0`，再执行 `coder-studio serve --restart`。
+
+**Q：可以直接把端口映射到公网吗？**
+不建议。Coder Studio 能操作本机项目、终端和 AI 会话，公网暴露前至少要启用密码。更推荐使用 Tailscale、ngrok 或 Cloudflare Tunnel。
+
+## 参考文档
+
+- [Tailscale Funnel 文档](https://tailscale.com/docs/features/tailscale-funnel)
+- [Tailscale Funnel CLI 参考](https://tailscale.com/docs/reference/tailscale-cli/funnel)
+- [ngrok HTTP Endpoints 文档](https://ngrok.com/docs/http/)
+- [Cloudflare Tunnel 文档](https://developers.cloudflare.com/tunnel/)
+- [Cloudflare Quick Tunnels](https://try.cloudflare.com/)
 
 ## 下一步