diff --git a/web/svelte.config.js b/web/svelte.config.js
index 408795a..c94c11f 100644
--- a/web/svelte.config.js
+++ b/web/svelte.config.js
@@ -1,18 +1,23 @@
 import adapter from "@sveltejs/adapter-static";
 import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
+import { loadEnv } from "vite";
 
 const profile = process.env.BUILD_PROFILE;
 const isCodeserver = process.env.VITE_DEV_PROFILE === "codeserver";
 
+// Same env-loading concern as vite.config.js — .env.local isn't in
+// process.env at config-eval time. loadEnv reads it.
+const env = loadEnv(process.env.NODE_ENV ?? "development", process.cwd(), "");
+
 // basePath resolution:
-//   1. NEXT_BASE_PATH (kept name for consistency with prior config; treated as opaque override)
+//   1. NEXT_BASE_PATH — explicit override (escape hatch)
 //   2. codeserver dev → /absproxy/{port}
 //   3. BUILD_PROFILE=gh → /loto
 //   4. default (CF Pages root, local dev) → ""
 function resolveBase() {
   if (process.env.NEXT_BASE_PATH != null) return process.env.NEXT_BASE_PATH;
   if (isCodeserver) {
-    const port = process.env.CODESERVER_PORT ?? "3000";
+    const port = env.CODESERVER_PORT ?? "3000";
     return `/absproxy/${port}`;
   }
   if (profile === "gh") return "/loto";
diff --git a/web/vite.config.js b/web/vite.config.js
index 168020e..53bd1d8 100644
--- a/web/vite.config.js
+++ b/web/vite.config.js
@@ -1,26 +1,34 @@
 import { sveltekit } from "@sveltejs/kit/vite";
 import tailwindcss from "@tailwindcss/vite";
+import { defineConfig, loadEnv } from "vite";
 
-const isCodeserver = process.env.VITE_DEV_PROFILE === "codeserver";
-const host = process.env.CODESERVER_HOST;
-const port = Number(process.env.CODESERVER_PORT ?? 3000);
+export default defineConfig(({ mode }) => {
+  // .env.local lives outside process.env at config-eval time; loadEnv reads it.
+  const env = loadEnv(mode, process.cwd(), "");
+  const isCodeserver = process.env.VITE_DEV_PROFILE === "codeserver";
+  const host = env.CODESERVER_HOST;
+  const port = Number(env.CODESERVER_PORT ?? 3000);
 
-const codeserverServer = host
-  ? {
+  return {
+    plugins: [tailwindcss(), sveltekit()],
+    server: {
       port,
       host: true,
       strictPort: true,
-      allowedHosts: [host],
-      hmr: {
-        host,
-        protocol: "wss",
-        clientPort: 443,
-        path: `/absproxy/${port}/`,
-      },
-    }
-  : { port: 3000, host: true };
-
-export default {
-  plugins: [tailwindcss(), sveltekit()],
-  server: isCodeserver ? codeserverServer : { port: 3000 },
-};
+      // Always allow the codeserver host if .env.local sets one — covers
+      // both `npm run dev` (no proxy config) and `npm run dev:codeserver`.
+      ...(host ? { allowedHosts: [host] } : {}),
+      // HMR through the proxy only in the explicit codeserver profile.
+      ...(isCodeserver && host
+        ? {
+            hmr: {
+              host,
+              protocol: "wss",
+              clientPort: 443,
+              path: `/absproxy/${port}/`,
+            },
+          }
+        : {}),
+    },
+  };
+});