diff --git a/docs/roo-code-cloud/environments.mdx b/docs/roo-code-cloud/environments.mdx
index 63c028da..2121dbcc 100644
--- a/docs/roo-code-cloud/environments.mdx
+++ b/docs/roo-code-cloud/environments.mdx
@@ -323,46 +323,53 @@ After the environment starts, you'll get unique URLs for each port. Visit the WE
 
 ### CORS Errors
 
-In a preview environment, your frontend and backend run on different domains (e.g., `https://abc123.vercel.run` and `https://def456.vercel.run`). Browsers block cross-origin requests by default, so your backend needs to explicitly allow the frontend's domain.
+In a preview environment, your frontend and backend run on different domains (e.g., `https://abc123.vercel.run` and `https://def456.vercel.run`). Browsers block cross-origin requests by default, so you need to configure both sides: the backend must allow the frontend's origin, and the frontend dev server must accept the preview domain.
 
-Use the `ROO_WEB_HOST` variable to configure your backend's CORS policy:
+Make sure both ports are defined so the `ROO_*_HOST` variables get injected:
 
-**Express:**
-
-```typescript
-import cors from 'cors';
-
-app.use(cors({
-  origin: process.env.ROO_WEB_HOST || 'http://localhost:3000'
-}));
+```yaml
+ports:
+  - name: WEB
+    port: 3000
+  - name: API
+    port: 3001
 ```
 
-**Hono:**
+#### Backend: Allow the frontend origin
 
-```typescript
-import { cors } from 'hono/cors';
+Use `ROO_WEB_HOST` to configure your backend's CORS policy:
 
-app.use(cors({
-  origin: process.env.ROO_WEB_HOST || 'http://localhost:3000'
-}));
-```
+```typescript
+// Express
+import cors from 'cors';
+app.use(cors({ origin: process.env.ROO_WEB_HOST || 'http://localhost:3000' }));
 
-**Fastify:**
+// Hono
+import { cors } from 'hono/cors';
+app.use(cors({ origin: process.env.ROO_WEB_HOST || 'http://localhost:3000' }));
 
-```typescript
+// Fastify
 app.register(import('@fastify/cors'), {
   origin: process.env.ROO_WEB_HOST || 'http://localhost:3000'
 });
 ```
 
-Then in your environment config, make sure both ports are defined so the variables get injected:
+#### Frontend: Allow the preview domain
 
-```yaml
-ports:
-  - name: WEB
-    port: 3000
-  - name: API
-    port: 3001
+Dev servers like Vite and Next.js reject requests from unrecognized hosts by default. You need to allow the preview domain so the dev server responds to requests on `https://<id>.vercel.run`:
+
+```typescript
+// Vite — vite.config.ts
+export default defineConfig({
+  server: {
+    allowedHosts: ['.vercel.run'],
+  }
+})
+
+// Next.js — next.config.ts
+export default {
+  allowedDevOrigins: ['*.vercel.run'],
+}
 ```
 
 ### Managing Frontend API URLs with `.env` Files