diff --git a/libs/hexagent_demo/frontend/src/api.ts b/libs/hexagent_demo/frontend/src/api.ts
index da8a5950..84eac5ec 100644
--- a/libs/hexagent_demo/frontend/src/api.ts
+++ b/libs/hexagent_demo/frontend/src/api.ts
@@ -34,7 +34,7 @@ export async function getConversation(id: string): Promise<Conversation> {
   return res.json();
 }
 
-// 鈹€鈹€ Warm session (pre-conversation) 鈹€鈹€
+// ── Warm session (pre-conversation) ──
 
 export interface WarmSessionResponse {
   session_id: string;
@@ -264,7 +264,7 @@ export function subscribeToStream(
   return controller;
 }
 
-// 鈹€鈹€ File upload 鈹€鈹€
+// ── File upload ──
 
 export interface UploadResult {
   filename: string;
@@ -295,7 +295,7 @@ export async function deleteChatFile(conversationId: string, filename: string):
   }
 }
 
-// 鈹€鈹€ Folder picker 鈹€鈹€
+// ── Folder picker ──
 
 export async function browseFolder(): Promise<string | null> {
   const res = await fetch(`${API_BASE}/api/browse-folder`, { method: "POST" });
@@ -304,7 +304,7 @@ export async function browseFolder(): Promise<string | null> {
   return data.path || null;
 }
 
-// 鈹€鈹€ Server config 鈹€鈹€
+// ── Server config ──
 
 export interface ModelConfig {
   id: string;
@@ -389,7 +389,7 @@ export async function testMcpConnection(server: McpServerEntry): Promise<{ ok: b
   return res.json();
 }
 
-// 鈹€鈹€ Skills 鈹€鈹€
+// ── Skills ──
 
 export interface SkillsList {
   public: string[];
@@ -447,7 +447,7 @@ export async function toggleSkill(name: string, enabled: boolean): Promise<void>
   if (!res.ok) throw new Error(`Failed to toggle skill: ${res.statusText}`);
 }
 
-// 鈹€鈹€ Setup / VM backend 鈹€鈹€
+// ── Setup / VM backend ──
 
 export interface VMStatus {
   supported: boolean;
@@ -482,7 +482,7 @@ export function installVMBackend(
   });
 }
 
-// 鈹€鈹€ VM Build 鈹€鈹€
+// ── VM Build ──
 
 export interface VMBuildStatus {
   status: "idle" | "running" | "done" | "error";
@@ -563,7 +563,7 @@ export function buildVM(
   });
 }
 
-// 鈹€鈹€ VM Provision 鈹€鈹€
+// ── VM Provision ──
 
 export interface ProvisionStepDef {
   id: string;
diff --git a/libs/hexagent_demo/frontend/src/components/OnboardingWizard.tsx b/libs/hexagent_demo/frontend/src/components/OnboardingWizard.tsx
index cc695399..c7dd0836 100644
--- a/libs/hexagent_demo/frontend/src/components/OnboardingWizard.tsx
+++ b/libs/hexagent_demo/frontend/src/components/OnboardingWizard.tsx
@@ -132,7 +132,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
   const [error, setError] = useState("");
   const [config, setConfig] = useState<ServerConfig | null>(null);
 
-  // 鈹€鈹€ Step 1: Model 鈹€鈹€
+  // ── Step 1: Model ──
   const [selectedProvider, setSelectedProvider] = useState<ProviderOption | null>(null);
   const [apiKey, setApiKey] = useState("");
   const [modelId, setModelId] = useState("");
@@ -141,7 +141,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
   const [showKey, setShowKey] = useState(false);
   const [showAdvanced, setShowAdvanced] = useState(false);
 
-  // 鈹€鈹€ Step 2: Summarizer 鈹€鈹€
+  // ── Step 2: Summarizer ──
   const [sumProvider, setSumProvider] = useState<ProviderOption | null>(null);
   const [sumApiKey, setSumApiKey] = useState("");
   const [sumModelId, setSumModelId] = useState("");
@@ -151,7 +151,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
   const [sumSameAsMain, setSumSameAsMain] = useState(true);
   const [sumShowAdvanced, setSumShowAdvanced] = useState(false);
 
-  // 鈹€鈹€ Step 3: Web Tools 鈹€鈹€
+  // ── Step 3: Web Tools ──
   const [searchProvider, setSearchProvider] = useState("");
   const [searchKey, setSearchKey] = useState("");
   const [fetchProvider, setFetchProvider] = useState("");
@@ -159,9 +159,9 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
   const [showSearchKey, setShowSearchKey] = useState(false);
   const [showFetchKey, setShowFetchKey] = useState(false);
 
-  // 鈹€鈹€ Step 4: Compute 鈹€鈹€
+  // ── Step 4: Compute ──
 
-  // VM setup 鈥?shared with Settings via VMSetupProvider (single source of truth)
+  // VM setup —shared with Settings via VMSetupProvider (single source of truth)
   const vm = useVMSetup();
   const vmAutoBootstrapping = vm.autoBootstrapping;
   const [vmSkipped, setVmSkipped] = useState(false);
@@ -244,7 +244,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
 
   if (!open) return null;
 
-  // 鈹€鈹€ Navigation 鈹€鈹€
+  // ── Navigation ──
   const goNext = () => {
     const idx = stepIndex(step);
     if (idx < STEPS.length - 1) {
@@ -260,7 +260,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
     }
   };
 
-  // 鈹€鈹€ Save all config at the end 鈹€鈹€
+  // ── Save all config at the end ──
   const handleFinish = async () => {
     if (!config) return;
     if (!selectedProvider || !apiKey.trim() || !modelId.trim()) {
@@ -329,7 +329,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
     }
   };
 
-  // 鈹€鈹€ Validation for model step 鈹€鈹€
+  // ── Validation for model step ──
   const isCustomProvider = selectedProvider?.id === "custom";
   const canProceedFromModel =
     selectedProvider &&
@@ -341,7 +341,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
     <div className="setup-overlay">
       <div className="setup-modal">
 
-        {/* 鈹€鈹€ Step 0: Welcome 鈥?Name & Theme 鈹€鈹€ */}
+        {/* ── Step 0: Welcome —Name & Theme ── */}
         {step === "welcome" && (
           <div className="setup-step setup-welcome">
             <div className="setup-welcome-brand">
@@ -390,7 +390,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
           </div>
         )}
 
-        {/* 鈹€鈹€ Step 1: Provider selection 鈹€鈹€ */}
+        {/* ── Step 1: Provider selection ── */}
         {step === "provider" && (
           <div className="setup-step">
             <div className="setup-step-header">
@@ -430,7 +430,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
           </div>
         )}
 
-        {/* 鈹€鈹€ Step 2: Model credentials 鈹€鈹€ */}
+        {/* ── Step 2: Model credentials ── */}
         {step === "model" && selectedProvider && (
           <div className="setup-step">
             <div className="setup-step-header">
@@ -555,7 +555,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
           </div>
         )}
 
-        {/* 鈹€鈹€ Step 2: Summarizer 鈹€鈹€ */}
+        {/* ── Step 2: Summarizer ── */}
         {step === "summarizer" && (
           <div className="setup-step">
             <div className="setup-step-header">
@@ -722,7 +722,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
           </div>
         )}
 
-        {/* 鈹€鈹€ Step 3: Web Tools 鈹€鈹€ */}
+        {/* ── Step 3: Web Tools ── */}
         {step === "tools" && (
           <div className="setup-step">
             <div className="setup-step-header">
@@ -838,7 +838,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
           </div>
         )}
 
-        {/* 鈹€鈹€ Step 4: Compute 鈹€鈹€ */}
+        {/* ── Step 4: Compute ── */}
         {step === "compute" && (
           <div className="setup-step">
             <div className="setup-step-header">
@@ -1079,7 +1079,7 @@ export default function OnboardingWizard({ open, onComplete, settings, onSetting
           </div>
         )}
 
-        {/* 鈹€鈹€ Step 5: Done 鈹€鈹€ */}
+        {/* ── Step 5: Done ── */}
         {step === "done" && (
           <div className="setup-step">
             <div className="setup-done-icon">
diff --git a/libs/hexagent_demo/frontend/src/components/SettingsModal.tsx b/libs/hexagent_demo/frontend/src/components/SettingsModal.tsx
index 59253023..c85deb49 100644
--- a/libs/hexagent_demo/frontend/src/components/SettingsModal.tsx
+++ b/libs/hexagent_demo/frontend/src/components/SettingsModal.tsx
@@ -13,7 +13,7 @@ import type { PhaseStatus } from "../vmSetup";
 /** Available languages. Add new entries here to support more languages. */
 const LANGUAGES = [
   { code: "en", label: "English" },
-  { code: "zh-CN", label: "绠€浣撲腑鏂? },
+  { code: "zh-CN", label: "简体中文" },
 ] as const;
 
 interface SettingsModalProps {
@@ -39,7 +39,7 @@ export default function SettingsModal({ open, onClose, settings, onSettingsChang
   const { t } = useTranslation("settings");
   const [activeTab, setActiveTab] = useState<Tab>(initialTab ?? "general");
 
-  // 鈹€鈹€ Shared ServerConfig draft 鈹€鈹€
+  // ── Shared ServerConfig draft ──
   const [config, setConfig] = useState<ServerConfig | null>(null);
   const originalRef = useRef("");
   const [saving, setSaving] = useState(false);
@@ -94,7 +94,7 @@ export default function SettingsModal({ open, onClose, settings, onSettingsChang
     }
   }, [config, dispatch]);
 
-  // 鈹€鈹€ Close animation 鈹€鈹€
+  // ── Close animation ──
   const [animState, setAnimState] = useState<"open" | "closing">("open");
   const [showConfirm, setShowConfirm] = useState(false);
 
@@ -357,7 +357,7 @@ function GeneralTab({
   );
 }
 
-// 鈹€鈹€ Provider Presets 鈹€鈹€
+// ── Provider Presets ──
 
 interface ProviderPreset {
   id: string;
@@ -396,7 +396,7 @@ function presetIdFromProvider(provider: string): string {
   return match ? match.id : "openai-compatible";
 }
 
-// 鈹€鈹€ Model Tab (compact accordion) 鈹€鈹€
+// ── Model Tab (compact accordion) ──
 
 function ModelTab({ config, onConfigChange }: ConfigTabProps) {
   const { t } = useTranslation("settings");
@@ -489,7 +489,7 @@ function ModelTab({ config, onConfigChange }: ConfigTabProps) {
         {t("model.hint")}
       </p>
 
-      {/* 鈹€鈹€ Compact Model List 鈹€鈹€ */}
+      {/* ── Compact Model List ── */}
       <div className="ml-list">
         {config.models.map((m, idx) => {
           const presetId = presetIdFromProvider(m.provider);
@@ -633,7 +633,7 @@ function ModelTab({ config, onConfigChange }: ConfigTabProps) {
                     />
                   </div>
 
-                  {/* Context Window & Modalities 鈥?visually separated */}
+                  {/* Context Window & Modalities —visually separated */}
                   <div className="mc-separator" />
                   <div className="mc-row">
                     <div className="mc-field" style={{ maxWidth: 200 }}>
@@ -679,7 +679,7 @@ function ModelTab({ config, onConfigChange }: ConfigTabProps) {
         })}
       </div>
 
-      {/* 鈹€鈹€ Add Model 鈹€鈹€ */}
+      {/* ── Add Model ── */}
       {showAddPicker ? (
         <div className="add-picker">
           <div className="add-picker-label">{t("model.chooseProvider")}</div>
@@ -700,7 +700,7 @@ function ModelTab({ config, onConfigChange }: ConfigTabProps) {
         </div>
       )}
 
-      {/* 鈹€鈹€ Summarizer Model 鈹€鈹€ */}
+      {/* ── Summarizer Model ── */}
       {config.models.length > 0 && (
         <div className="tools-summarizer">
           <div className="tools-summarizer-left">
@@ -744,7 +744,7 @@ function ModelTab({ config, onConfigChange }: ConfigTabProps) {
   );
 }
 
-// 鈹€鈹€ Key-Value Pair Editor 鈹€鈹€
+// ── Key-Value Pair Editor ──
 // Stores data as JSON string but presents a friendly key/value row UI.
 
 interface KVPair { key: string; value: string }
@@ -879,7 +879,7 @@ function KeyValueEditor({
   );
 }
 
-// 鈹€鈹€ MCP Tab 鈹€鈹€
+// ── MCP Tab ──
 
 function McpTab({ config, onConfigChange }: ConfigTabProps) {
   const { t } = useTranslation("settings");
@@ -955,7 +955,7 @@ function McpTab({ config, onConfigChange }: ConfigTabProps) {
         if (debounceTimers.current[id]) clearTimeout(debounceTimers.current[id]);
       }
     }
-  }); // Intentionally no deps 鈥?runs on every render to compare fingerprints
+  }); // Intentionally no deps —runs on every render to compare fingerprints
 
   // Cleanup debounce timers on unmount
   useEffect(() => () => {
@@ -1019,7 +1019,7 @@ function McpTab({ config, onConfigChange }: ConfigTabProps) {
         return;
       }
 
-      // Toggling ON 鈥?validate first
+      // Toggling ON —validate first
       setValidatingIds((prev) => new Set(prev).add(server.id));
       setTestStatus((prev) => ({ ...prev, [server.id]: { loading: true } }));
 
@@ -1275,7 +1275,7 @@ function McpTab({ config, onConfigChange }: ConfigTabProps) {
   );
 }
 
-// 鈹€鈹€ Tools Tab 鈹€鈹€
+// ── Tools Tab ──
 
 const SEARCH_PROVIDERS = [
   { id: "", label: "None" },
@@ -1454,7 +1454,7 @@ function ToolsTab({ config, onConfigChange }: ConfigTabProps) {
   );
 }
 
-// 鈹€鈹€ Custom Dropdown 鈹€鈹€
+// ── Custom Dropdown ──
 
 function CustomSelect({
   value,
@@ -1510,7 +1510,7 @@ function CustomSelect({
   );
 }
 
-// 鈹€鈹€ Subagent Tab 鈹€鈹€
+// ── Subagent Tab ──
 
 function SubagentTab({ config, onConfigChange }: ConfigTabProps) {
   const { t } = useTranslation("settings");
@@ -1721,7 +1721,7 @@ function SubagentTab({ config, onConfigChange }: ConfigTabProps) {
   );
 }
 
-// 鈹€鈹€ Sandbox Tab 鈹€鈹€
+// ── Sandbox Tab ──
 
 function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
   const { t } = useTranslation("settings");
@@ -1790,7 +1790,7 @@ function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
 
   return (
     <div className="settings-section">
-      {/* 鈹€鈹€ Virtual Machine 鈹€鈹€ */}
+      {/* ── Virtual Machine ── */}
       <div className="sb-card">
         <div className="sb-card-header">
           <div className="sb-card-icon"><Monitor size={18} /></div>
@@ -1816,14 +1816,14 @@ function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
           )}
         </div>
         <div className="sb-card-body">
-          {/* 鈹€鈹€ All done: clean summary 鈹€鈹€ */}
+          {/* ── All done: clean summary ── */}
           {vmStatus && vmStatus.supported && allDone && (
             <p className="vm-ready-summary">
               <CircleCheck size={13} className="vm-phase-icon--done" /> {t("sandbox.vmReady")}
             </p>
           )}
 
-          {/* 鈹€鈹€ Setup in progress or not yet started 鈹€鈹€ */}
+          {/* ── Setup in progress or not yet started ── */}
           {vmStatus && vmStatus.supported && !allDone && (
             <div className="vm-setup-phases">
               {/* Phase 1: VM backend */}
@@ -1925,7 +1925,7 @@ function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
                   )}
                 </div>
 
-                {/* Step list 鈥?visible during setup */}
+                {/* Step list —visible during setup */}
                 {(phase3 === "running" || phase3 === "error" || (phase3 === "pending" && Object.keys(provStepStatus).length > 0)) && provSteps.length > 0 && (
                   <div className="vm-provision-steps">
                     {provSteps.map((step) => {
@@ -1964,7 +1964,7 @@ function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
             <p className="vm-install-hint">{t("sandbox.vmNotSupported")}</p>
           )}
 
-          {/* Folder list 鈥?shown once VM is usable (phases 1+2 done) */}
+          {/* Folder list —shown once VM is usable (phases 1+2 done) */}
           {vmUsable && (
             <div className="vm-folder-list">
               <label className="mc-label" style={{ marginBottom: 2 }}>{t("sandbox.recentFolders")}</label>
@@ -2012,7 +2012,7 @@ function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
         </div>
       </div>
 
-      {/* 鈹€鈹€ Chat Mode (legacy) 鈹€鈹€ */}
+      {/* ── Chat Mode (legacy) ── */}
       <div className="sb-card">
         <div className="sb-card-header">
           <div className="sb-card-icon"><Server size={18} /></div>
@@ -2081,7 +2081,7 @@ function SandboxTab({ config, onConfigChange }: ConfigTabProps) {
   );
 }
 
-// 鈹€鈹€ Skills Tab 鈹€鈹€
+// ── Skills Tab ──
 
 function SkillsTab() {
   const { t } = useTranslation("settings");
diff --git a/libs/hexagent_demo/frontend/src/components/WelcomeScreen.tsx b/libs/hexagent_demo/frontend/src/components/WelcomeScreen.tsx
index 91797da3..0f45c210 100644
--- a/libs/hexagent_demo/frontend/src/components/WelcomeScreen.tsx
+++ b/libs/hexagent_demo/frontend/src/components/WelcomeScreen.tsx
@@ -224,7 +224,7 @@ export default function WelcomeScreen({ onSubmit, mode, onOpenSettings }: Welcom
         })
         .finally(() => setMountingFolder(false));
     }
-    // Only trigger when warmSessionId changes (not on every folder change 鈥?
+    // Only trigger when warmSessionId changes (not on every folder change —
     // handleFolderChange already handles that when the session is ready)
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [warmSessionId]);
@@ -386,7 +386,7 @@ export default function WelcomeScreen({ onSubmit, mode, onOpenSettings }: Welcom
                 )}
                 {sandboxBlocked && (
                   <div className={`e2b-hint${value.trim() || e2bHintFlash ? " e2b-hint-visible" : ""}`}>
-                    {missingE2bKey ? t("e2bKeyRequired") : t("vmSetupRequired")} 鈥攞" "}
+                    {missingE2bKey ? t("e2bKeyRequired") : t("vmSetupRequired")}{" "}
                     <button className="e2b-hint-link" onClick={() => onOpenSettings("sandbox")}>
                       {t("setupInSettings")}
                     </button>