feat: preserve compact agent context and bump to 1.2.25

fix: show agent messages before workspace lookup and bump to 1.2.24
fix: open agent model picker above chat attachment controls
2026-10-29 10:39:20 +09:00 · 2026-10-20 12:57:12 +09:00 · 2026-10-20 11:45:12 +09:00 · 2026-10-20 11:36:28 +09:00 · 2026-10-20 10:21:10 +09:00 · 2026-10-20 10:10:48 +09:00
166 changed files with 14113 additions and 1884 deletions
@@ -0,0 +1,47 @@
+# Korean and English UI
+
+Use the language selector at the top of the studio settings screen (local or
+remote workspace). Select a language and press Save to apply it. Unsaved choices
+do not change the UI or stored preference. Korean is the default. The choice is
+stored under `autonomy-studio.lms.language` in local storage and applies on the
+next launch. Switching language updates React subscribers without remounting the
+workspace, terminal, editor, or visualization iframe.
+
+## Scope
+
+- App navigation, curriculum UI, studio controls, settings, dialogs and help.
+- Known application status/error messages and NAV2/SLAM viewer controls.
+- Course titles, learning content, materials, module names, source code, terminal
+  output and server-authored notifications remain in their original language.
+- Unrecognized backend/SSH/Docker errors are preserved verbatim for diagnosis.
+- Embedded text in guide images and external pages is not translated.
+- This does not change ROS, Docker, SSH, the OS locale, or module parameters.
+
+## Adding Text
+
+Use `t('Korean source text')` from `src/renderer/src/i18n` at the display boundary
+and add the English value to `en.json`. Call `useLocaleRender()` in components
+which render translations so an open screen reacts to language changes.
+
+Keep identifiers and state values unchanged. Do not translate stored form values,
+parameter strings, module identifiers, or values used in conditions. Use whole
+sentences with named interpolation placeholders instead of joining translated
+fragments. Korean falls back to the source key; unknown messages retain the source.
+
+The standalone SLAM viewer uses `public/slam-viewer/locale.js` and explicitly
+marked text/attributes. It follows the same saved preference through storage
+events, without reconnecting the bridge or resetting the scene.
+
+## Verification
+
+```sh
+npm run test:i18n
+npx tsc --noEmit -p tsconfig.web.json
+npm run build
+```
+
+The tests cover language persistence, storage failure, cross-window updates,
+interpolation, source fallback and literal translation-key coverage. Browser
+checks should additionally cover both languages, narrow studio panels, preserving
+unsaved edits, and language changes with the viewer open. `npm run build` does not
+package an AppImage.
@@ -4,6 +4,12 @@ import react from '@vitejs/plugin-react';
 import tailwindcss from '@tailwindcss/vite';
 export default defineConfig({
    main: {
+        build: {
+            rollupOptions: {
+                input: { index: resolve(__dirname, 'src/main/bootstrap.ts') },
+                output: { inlineDynamicImports: false, chunkFileNames: '[name]-[hash].js' }
+            }
+        },
        plugins: [externalizeDepsPlugin()]
    },
    preload: {
@@ -5,6 +5,12 @@ import tailwindcss from '@tailwindcss/vite'

 export default defineConfig({
  main: {
+    build: {
+      rollupOptions: {
+        input: { index: resolve(__dirname, 'src/main/bootstrap.ts') },
+        output: { inlineDynamicImports: false, chunkFileNames: '[name]-[hash].js' }
+      }
+    },
    plugins: [externalizeDepsPlugin()]
  },
  preload: {
@@ -1,12 +1,12 @@
 {
  "name": "lms",
-  "version": "1.0.23",
+  "version": "1.2.25",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "lms",
-      "version": "1.0.23",
+      "version": "1.2.25",
      "dependencies": {
        "@electron-toolkit/preload": "^3.0.1",
        "@electron-toolkit/utils": "^4.0.0",
@@ -16,13 +16,18 @@
        "@xterm/addon-fit": "^0.11.0",
        "@xterm/xterm": "^6.0.0",
        "driver.js": "^1.4.0",
+        "i18next": "^26.4.2",
+        "lowlight": "^3.3.0",
        "lucide-react": "^1.14.0",
        "monaco-editor": "^0.55.1",
        "node-pty": "^1.1.0",
+        "react-i18next": "^17.0.15",
        "react-markdown": "^10.1.0",
        "remark-gfm": "^4.0.1",
+        "remark-parse": "11.0.0",
        "socket.io-client": "^4.8.3",
-        "three": "^0.181.2"
+        "three": "^0.181.2",
+        "unified": "11.0.5"
      },
      "devDependencies": {
        "@electron-toolkit/tsconfig": "^1.0.1",
@@ -289,6 +294,15 @@
        "@babel/core": "^7.0.0-0"
      }
    },
+    "node_modules/@babel/runtime": {
+      "version": "7.29.7",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.7.tgz",
+      "integrity": "sha512-Nq8OhGWiZIZGV6hLHoyAKLLcJihP/xFeBMGJoUrxTX2psI8dCifzLhZISFb+VWS3wFMRDmCGw5R+dOySCqPLhw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
    "node_modules/@babel/template": {
      "version": "7.28.6",
      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.28.6.tgz",
@@ -5236,6 +5250,15 @@
        "url": "https://opencollective.com/unified"
      }
    },
+    "node_modules/highlight.js": {
+      "version": "11.11.2",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.2.tgz",
+      "integrity": "sha512-oaXMACAU0kzOMXBjWpNcX+vlwSBCIAiZ9BHa7gA15NOTtT2L/l8OSZDuqS2XppOhZBPJ7hm4o8ep2kyuip2uEQ==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
    "node_modules/hosted-git-info": {
      "version": "4.1.0",
      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-4.1.0.tgz",
@@ -5269,6 +5292,15 @@
      "dev": true,
      "license": "ISC"
    },
+    "node_modules/html-parse-stringify": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-4.0.1.tgz",
+      "integrity": "sha512-0zHsZJrK7S3K2aucXWL6ycoYJ/iNtIcFHC/nYQgFklPtrv5LpJctIiSCroWZWeuoXvuyFdzp6KzjJQ+OT5MfFw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://locize.com"
+      }
+    },
    "node_modules/html-url-attributes": {
      "version": "3.0.1",
      "resolved": "https://registry.npmjs.org/html-url-attributes/-/html-url-attributes-3.0.1.tgz",
@@ -5336,6 +5368,34 @@
        "ms": "^2.0.0"
      }
    },
+    "node_modules/i18next": {
+      "version": "26.4.2",
+      "resolved": "https://registry.npmjs.org/i18next/-/i18next-26.4.2.tgz",
+      "integrity": "sha512-RX+R0VLg13IbvRuJSxnqykUFS9vQZTl8wYpWPCIUDWVrSGjsQywB5Y+pjzrkboxGAuYfJZVH1InFTdgBdxq6ug==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://www.locize.com/i18next"
+        },
+        {
+          "type": "individual",
+          "url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
+        },
+        {
+          "type": "individual",
+          "url": "https://www.locize.com"
+        }
+      ],
+      "license": "MIT",
+      "peerDependencies": {
+        "typescript": "^5 || ^6 || ^7"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/iconv-corefoundation": {
      "version": "1.1.7",
      "resolved": "https://registry.npmjs.org/iconv-corefoundation/-/iconv-corefoundation-1.1.7.tgz",
@@ -6128,6 +6188,21 @@
        "node": ">=8"
      }
    },
+    "node_modules/lowlight": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/lowlight/-/lowlight-3.3.0.tgz",
+      "integrity": "sha512-0JNhgFoPvP6U6lE/UdVsSq99tn6DhjjpAj5MxG49ewd2mOBVtwWYIT8ClyABhq198aXXODMU6Ox8DrGy/CpTZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "devlop": "^1.0.0",
+        "highlight.js": "~11.11.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
    "node_modules/lru-cache": {
      "version": "5.1.1",
      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
@@ -7933,6 +8008,33 @@
        "react": "^19.2.6"
      }
    },
+    "node_modules/react-i18next": {
+      "version": "17.0.15",
+      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-17.0.15.tgz",
+      "integrity": "sha512-7uYpx/oBkesLto7cOzOmfITlUBaXHCAcFahmgETMfWr8nbbWRRnVGvz8wsH/xpbNcyoH+NpCcnOQEqWPMO6/hw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.29.7",
+        "html-parse-stringify": "^4.0.1",
+        "use-sync-external-store": "^1.6.0"
+      },
+      "peerDependencies": {
+        "i18next": ">= 26.2.0",
+        "react": ">= 16.8.0",
+        "typescript": "^5 || ^6 || ^7"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        },
+        "react-native": {
+          "optional": true
+        },
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
    "node_modules/react-markdown": {
      "version": "10.1.0",
      "resolved": "https://registry.npmjs.org/react-markdown/-/react-markdown-10.1.0.tgz",
@@ -8923,7 +9025,7 @@
      "version": "5.9.3",
      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
-      "dev": true,
+      "devOptional": true,
      "license": "Apache-2.0",
      "bin": {
        "tsc": "bin/tsc",
@@ -9102,6 +9204,15 @@
        "punycode": "^2.1.0"
      }
    },
+    "node_modules/use-sync-external-store": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.7.0.tgz",
+      "integrity": "sha512-6L+EeigHMQhdaIPNIFUKwfWJSwWFQ8gJbJ2DLOs5sDIegTwR9fRxvnM3uciHKjIZhFz+KAv2emhWMRvDmMcY8A==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
    "node_modules/utf8-byte-length": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/utf8-byte-length/-/utf8-byte-length-1.0.5.tgz",
@@ -1,6 +1,6 @@
 {
  "name": "lms",
-  "version": "1.2.1",
+  "version": "1.2.25",
  "description": "Autonomy Studio LMS Electron app",
  "main": "./out/main/index.js",
  "author": {
@@ -8,6 +8,8 @@
    "email": "hooladhoon@gmail.com"
  },
  "scripts": {
+    "test:i18n": "node --test scripts/test-i18n.cjs",
+    "test:theme": "node --test scripts/test-studio-theme.cjs",
    "dev": "electron-vite dev",
    "build": "electron-vite build",
    "build:linux": "npm run build && electron-builder --linux"
@@ -55,13 +57,18 @@
    "@xterm/addon-fit": "^0.11.0",
    "@xterm/xterm": "^6.0.0",
    "driver.js": "^1.4.0",
+    "i18next": "^26.4.2",
+    "lowlight": "^3.3.0",
    "lucide-react": "^1.14.0",
    "monaco-editor": "^0.55.1",
    "node-pty": "^1.1.0",
+    "react-i18next": "^17.0.15",
    "react-markdown": "^10.1.0",
    "remark-gfm": "^4.0.1",
+    "remark-parse": "11.0.0",
    "socket.io-client": "^4.8.3",
-    "three": "^0.181.2"
+    "three": "^0.181.2",
+    "unified": "11.0.5"
  },
  "devDependencies": {
    "@electron-toolkit/tsconfig": "^1.0.1",
@@ -6,6 +6,7 @@ import json
 import logging
 import math
 import os
+import re
 import shutil
 import sqlite3
 import struct
@@ -207,6 +208,8 @@ class SlamNode(Node):
        self._fallback_point_cloud: Optional[PointCloud2] = None
        self._color_point_cloud: Optional[PointCloud2] = None
        self._camera_image: Optional[CompressedImage] = None
+        self._camera_frames = {}
+        self._camera_subscriptions = {}
        self._icp_odom: Optional[Odometry] = None
        self._map: Optional[OccupancyGrid] = None
        self._plan: Optional[NavPath] = None
@@ -261,6 +264,8 @@ class SlamNode(Node):
        self.create_subscription(CompressedImage, self.camera_image_topic, self._on_camera_image, qos_profile_sensor_data)
        if not os.environ.get("CAMERA_IMAGE_TOPIC"):
            self.create_subscription(CompressedImage, "/image_raw/compressed", self._on_camera_image, qos_profile_sensor_data)
+        self._camera_discovery_timer = self.create_timer(
+            1.0, self._discover_cameras, clock=Clock(clock_type=ClockType.STEADY_TIME))
        self.create_subscription(Odometry, self.icp_odom_topic, self._on_icp_odom, best_effort_qos)
        self.create_subscription(Odometry, self.icp_odom_topic, self._on_icp_odom, reliable_qos)
        self.create_subscription(OccupancyGrid, self.map_topic, self._on_map, map_qos)
@@ -625,11 +630,45 @@ class SlamNode(Node):
            self._color_point_cloud_count += 1
            self._last_color_point_cloud_wall_time = time.time()

-    def _on_camera_image(self, msg: CompressedImage):
+    def _discover_cameras(self):
+        try:
+            topics = sorted(name for name, types in self.get_topic_names_and_types()
+                            if re.fullmatch(r'/camera_test/cameras/video[0-9]+/image_jpeg', name)
+                            and 'sensor_msgs/msg/CompressedImage' in types)[:8]
+        except Exception:
+            return
+        for topic in topics:
+            camera_id = topic.split('/')[-2]
+            if camera_id not in self._camera_subscriptions:
+                self._camera_subscriptions[camera_id] = self.create_subscription(
+                    CompressedImage, topic,
+                    lambda msg, key=camera_id, name=topic: self._on_camera_image(msg, key, name),
+                    qos_profile_sensor_data)
+        active = {topic.split('/')[-2] for topic in topics}
+        for camera_id in list(self._camera_subscriptions):
+            if camera_id not in active:
+                self.destroy_subscription(self._camera_subscriptions.pop(camera_id))
                with self._lock:
+                    self._camera_frames.pop(camera_id, None)
+
+    def _on_camera_image(self, msg: CompressedImage, camera_id='legacy', topic=None):
+        with self._lock:
+            if camera_id != 'legacy' and camera_id not in self._camera_subscriptions:
+                return
            self._camera_image = msg
            self._camera_image_count += 1
            self._last_camera_image_wall_time = time.time()
+            self._camera_frames[camera_id] = (msg, self._last_camera_image_wall_time,
+                                               topic or self.camera_image_topic)
+
+    def camera_sources(self):
+        now = time.time()
+        with self._lock:
+            frames = list(self._camera_frames.items())
+        return [{"id": key, "name": f'/dev/{key}' if key != 'legacy' else 'Camera',
+                 "topic": topic, "available": now - received <= _CAMERA_FRAME_MAX_AGE_SECONDS
+                 and bool(image.data) and 'jpeg' in image.format.lower()}
+                for key, (image, received, topic) in sorted(frames)]

    def _active_point_cloud(self) -> Optional[PointCloud2]:
        with self._lock:
@@ -687,7 +726,6 @@ class SlamNode(Node):
            point_cloud_last = self._last_point_cloud_wall_time
            fallback_point_cloud_last = self._last_fallback_point_cloud_wall_time
            color_point_cloud_last = self._last_color_point_cloud_wall_time
-            camera_image_last = self._last_camera_image_wall_time
            map_count = self._map_count
            plan_count = self._plan_count

@@ -727,7 +765,7 @@ class SlamNode(Node):
            },
            "camera_image": {
                "name": self.camera_image_topic,
-                "available": received_recently(camera_image_last),
+                "available": any(camera['available'] for camera in self.camera_sources()),
            },
            "plan": {"name": self.plan_topic, "available": plan_available},
            "cmd_vel": {"name": self.cmd_vel_topic, "available": cmd_vel_available},
@@ -1238,6 +1276,7 @@ class SlamNode(Node):
            "sensor_point_cloud": sensor_point_cloud_payload,
            "color_point_cloud": color_point_cloud_payload,
            "camera_image": camera_image_payload,
+            "cameras": self.camera_sources(),
            "map": map_payload,
            "tf": {
                "map_to_odom": resolve_2d_transform(tf_snapshot, "map", "odom"),
@@ -1302,8 +1341,14 @@ class SlamNode(Node):
        payload["received_at"] = received_at
        return payload

-    def camera_frame_jpeg(self) -> Optional[bytes]:
+    def camera_frame_jpeg(self, camera_id=None) -> Optional[bytes]:
        with self._lock:
+            if camera_id is not None:
+                entry = self._camera_frames.get(camera_id)
+                if entry is None:
+                    return None
+                image, received_at, _topic = entry
+            else:
                image = self._camera_image
                received_at = self._last_camera_image_wall_time
        if image is None or received_at is None or time.time() - received_at > _CAMERA_FRAME_MAX_AGE_SECONDS:
@@ -1531,10 +1576,10 @@ def color_point_cloud():


@app.get("/camera-frame")
-def camera_frame():
+def camera_frame(camera_id: Optional[str] = None):
    if not slam_node:
        raise HTTPException(status_code=503, detail="ROS node is not ready")
-    frame = slam_node.camera_frame_jpeg()
+    frame = slam_node.camera_frame_jpeg(camera_id)
    if frame is None:
        raise HTTPException(status_code=404, detail="카메라 프레임을 아직 수신하지 못했습니다.")
    return Response(content=frame, media_type="image/jpeg", headers={"Cache-Control": "no-store"})
@@ -0,0 +1,67 @@
+import ast
+from pathlib import Path
+import re
+import threading
+from types import SimpleNamespace
+from typing import Optional
+import unittest
+
+
+class CameraTests(unittest.TestCase):
+    def setUp(self):
+        self.now = 10.0
+        source = ast.parse(Path(__file__).with_name('bridge.py').read_text())
+        node = next(item for item in source.body if isinstance(item, ast.ClassDef) and item.name == 'SlamNode')
+        names = ('_discover_cameras', '_on_camera_image', 'camera_sources', 'camera_frame_jpeg')
+        methods = [item for item in node.body if isinstance(item, ast.FunctionDef) and item.name in names]
+        scope = {'re': re, 'Optional': Optional, 'CompressedImage': object,
+                 'time': SimpleNamespace(time=lambda: self.now), '_CAMERA_FRAME_MAX_AGE_SECONDS': 3,
+                 'qos_profile_sensor_data': object()}
+        exec(compile(ast.Module(body=methods, type_ignores=[]), 'camera-bridge', 'exec'), scope)
+        self.node = type('CameraNode', (), {name: scope[name] for name in names})()
+        self.node._lock = threading.Lock()
+        self.node._camera_frames = {}
+        self.node._camera_subscriptions = {}
+        self.node._camera_image = None
+        self.node._last_camera_image_wall_time = None
+        self.node._camera_image_count = 0
+        self.node.camera_image_topic = '/camera_test/image_jpeg'
+        self.topics = []
+        self.callbacks = {}
+        self.node.get_topic_names_and_types = lambda: self.topics
+        def subscribe(kind, topic, callback, qos):
+            self.callbacks[topic] = callback
+            return topic
+        self.node.create_subscription = subscribe
+        self.node.destroy_subscription = lambda sub: self.callbacks.pop(sub)
+
+    def test_independent_frames_and_disconnect(self):
+        for key in ['video0', 'video2']:
+            self.topics.append((f'/camera_test/cameras/{key}/image_jpeg', ['sensor_msgs/msg/CompressedImage']))
+        self.topics += [('/other/image_jpeg', ['sensor_msgs/msg/CompressedImage']),
+                        ('/camera_test/cameras/video9/image_jpeg', ['sensor_msgs/msg/Image'])]
+        self.node._discover_cameras()
+        self.assertEqual(len(self.callbacks), 2)
+        for topic, callback in self.callbacks.items():
+            callback(SimpleNamespace(data=topic.encode(), format='jpeg'))
+        self.assertEqual([item['id'] for item in self.node.camera_sources()], ['video0', 'video2'])
+        self.assertIn(b'video2', self.node.camera_frame_jpeg('video2'))
+        self.assertIsNone(self.node.camera_frame_jpeg('../video0'))
+        self.now += 4
+        self.assertTrue(all(not item['available'] for item in self.node.camera_sources()))
+        self.assertIsNone(self.node.camera_frame_jpeg('video0'))
+        self.topics = self.topics[:1]
+        self.node._discover_cameras()
+        self.assertNotIn('video2', self.node._camera_frames)
+
+    def test_single_camera_compatibility_and_non_jpeg(self):
+        self.node._on_camera_image(SimpleNamespace(data=b'jpeg', format='jpeg'))
+        self.assertEqual(self.node.camera_frame_jpeg(), b'jpeg')
+        self.assertEqual(self.node.camera_frame_jpeg('legacy'), b'jpeg')
+        self.node._on_camera_image(SimpleNamespace(data=b'png', format='png'))
+        self.assertIsNone(self.node.camera_frame_jpeg('legacy'))
+        self.assertFalse(self.node.camera_sources()[0]['available'])
+
+
+if __name__ == '__main__':
+    unittest.main()
@@ -0,0 +1,85 @@
+"""Regenerate font coverage after replacing the bundled NanumSquare WOFF2 files.
+
+Requires fonttools[woff]. Normal app builds use the checked-in CSS, not Python.
+Run: python3 scripts/generate-nanumsquare-css.py [--check]
+"""
+
+import argparse
+import hashlib
+import unicodedata
+from pathlib import Path
+
+from fontTools.pens.boundsPen import BoundsPen
+from fontTools.ttLib import TTFont
+
+
+ROOT = Path(__file__).resolve().parents[1]
+FONTS = ROOT / "src/renderer/public/assets/fonts"
+OUTPUT = ROOT / "src/renderer/src/styles/nanumSquare.css"
+FACES = [(300, "NanumSquareL"), (400, "NanumSquare"), (700, "NanumSquareB"), (800, "NanumSquareEB")]
+# Hangul fillers are intentionally invisible, like whitespace and controls.
+FILLERS = {0x115F, 0x1160, 0x3164, 0xFFA0}
+
+
+def coverage(font):
+    glyphs = font.getGlyphSet()
+    supported = []
+    for code, name in sorted(font.getBestCmap().items()):
+        pen = BoundsPen(glyphs)
+        glyphs[name].draw(pen)
+        intentional = chr(code).isspace() or unicodedata.category(chr(code)) in {"Cc", "Cf"} or code in FILLERS
+        if pen.bounds is not None or intentional:
+            supported.append(code)
+    return supported
+
+
+def unicode_ranges(codes):
+    ranges = []
+    start = end = codes[0]
+    for code in codes[1:]:
+        if code == end + 1:
+            end = code
+        else:
+            ranges.append((start, end))
+            start = end = code
+    ranges.append((start, end))
+    return [f"U+{start:X}" if start == end else f"U+{start:X}-{end:X}" for start, end in ranges]
+
+
+def generate():
+    sections = [
+        "/* Generated by scripts/generate-nanumsquare-css.py. Do not edit manually.\n"
+        " * Empty glyphs are excluded so the existing system-font fallback can render them.\n"
+        " * Font binaries and visible glyphs are unchanged.\n */"
+    ]
+    for weight, name in FACES:
+        file = FONTS / f"{name}.woff2"
+        with TTFont(file) as font:
+            ranges = unicode_ranges(coverage(font))
+        lines = [", ".join(ranges[index:index + 10]) for index in range(0, len(ranges), 10)]
+        sections.append(
+            f"/* {file.name} sha256: {hashlib.sha256(file.read_bytes()).hexdigest()} */\n"
+            "@font-face {\n"
+            "  font-family: 'NanumSquare';\n"
+            f"  src: url('/assets/fonts/{file.name}') format('woff2');\n"
+            f"  font-weight: {weight};\n"
+            "  font-style: normal;\n"
+            "  font-display: swap;\n"
+            "  unicode-range:\n    " + ",\n    ".join(lines) + ";\n}"
+        )
+    return "\n\n".join(sections) + "\n"
+
+
+if __name__ == "__main__":
+    parser = argparse.ArgumentParser(description=__doc__)
+    parser.add_argument("--check", action="store_true")
+    args = parser.parse_args()
+    generated = generate()
+    if args.check:
+        if not OUTPUT.exists() or OUTPUT.read_text(encoding="utf-8") != generated:
+            raise SystemExit("NanumSquare coverage CSS is stale; regenerate it")
+        print("NanumSquare coverage matches all four font files")
+    else:
+        OUTPUT.parent.mkdir(parents=True, exist_ok=True)
+        OUTPUT.write_text(generated, encoding="utf-8")
+        print(f"Generated {OUTPUT.relative_to(ROOT)}")
@@ -0,0 +1,228 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { createHash, webcrypto } = require('node:crypto')
+
+function compile(source, globals = {}, requireModule = require) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(source, { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX } }).outputText, {
+    exports, require: requireModule, Error, crypto: webcrypto, TextEncoder, window: { setTimeout: callback => setTimeout(callback, 1) }, ...globals
+  })
+  return exports
+}
+const tools = compile(fs.readFileSync(require.resolve('../src/shared/agentTools.ts'), 'utf8'))
+const navigation = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentCodeNavigation.ts'), 'utf8'), {}, name => name.endsWith('shared/agentTools') ? tools : require(name))
+const content = 'def configure():\n    speed = 0.4\n    return speed\n'
+const hash = value => createHash('sha256').update(value).digest('hex')
+const reference = { id: 'location', moduleName: 'Control', path: 'src/node.py', startLine: 2, endLine: 3, reason: 'speed config', snippet: '    speed = 0.4\n    return speed', expectedHash: hash(content) }
+
+test('unchanged source reveals the verified line range, while unsaved insertions relocate it', async () => {
+  assert.deepEqual(JSON.parse(JSON.stringify(await navigation.resolveCodeReferenceRange(content, reference))), { startLine: 2, endLine: 3 })
+  assert.deepEqual(JSON.parse(JSON.stringify(await navigation.resolveCodeReferenceRange('# unsaved\n' + content, reference))), { startLine: 3, endLine: 4 })
+  assert.deepEqual(JSON.parse(JSON.stringify(await navigation.resolveCodeReferenceRange(content.replace(/\n/g, '\r\n'), reference))), { startLine: 2, endLine: 3 })
+})
+
+test('rejects missing, ambiguous or altered code rather than highlighting a guessed line', async () => {
+  for (const changed of [content.replace('0.4', '0.8'), `${content}\n${content}`]) await assert.rejects(navigation.resolveCodeReferenceRange(changed, reference), /위치를 확정/)
+  for (const patch of [{ expectedHash: undefined }, { snippet: '' }, { snippet: '[REDACTED]' }, { snippet: 'one line' }, { path: '../etc/passwd' }, { path: '.env' }, { startLine: 0 }, { endLine: 500 }]) {
+    await assert.rejects(navigation.resolveCodeReferenceRange(content, { ...reference, ...patch }))
+  }
+})
+
+function editorHarness(text = content) {
+  const calls = []
+  const collection = { clear: () => calls.push('clear') }
+  const model = { uri: { path: '/modules/Control/src/node.py' }, getValue: () => text, isDisposed: () => false, getLineMaxColumn: line => text.split('\n')[line - 1].length + 1 }
+  const editor = { getModel: () => model, getDomNode: () => ({ clientWidth: 800, clientHeight: 600 }), layout: () => calls.push('layout'), createDecorationsCollection: value => { calls.push(['decorate', value]); return collection }, revealRangeInCenter: value => calls.push(['reveal', value]), setPosition: value => calls.push(['position', value]), focus: () => calls.push('focus') }
+  const options = { file: 'modules/Control/src/node.py', reference, isCurrent: () => true, getEditor: () => editor, getActiveFile: () => 'modules/Control/src/node.py', isReady: () => true, attempts: 4 }
+  return { model, editor, options, calls, collection }
+}
+
+test('focuses and highlights only after the correct Monaco model has loaded', async () => {
+  const h = editorHarness()
+  let reads = 0
+  h.options.getEditor = () => ++reads < 3 ? null : h.editor
+  assert.equal(await navigation.revealAgentCodeReference(h.options), h.collection)
+  assert.deepEqual(h.calls.map(call => Array.isArray(call) ? call[0] : call), ['layout', 'decorate', 'position', 'reveal', 'focus'])
+  const selection = h.calls.find(call => call[0] === 'reveal')[1]
+  assert.equal(selection.startLineNumber, 2)
+  assert.equal(selection.endLineNumber, 3)
+  assert.equal(h.calls[1][1][0].options.isWholeLine, true)
+})
+
+test('does not decorate another file, a hidden/diff editor, stale scope or unready model', async () => {
+  for (const setup of [
+    h => { h.model.uri.path = '/modules/Other/src/node.py' },
+    h => { h.options.getActiveFile = () => 'other.py' },
+    h => { h.options.isReady = () => false },
+    h => { h.options.isCurrent = () => false },
+    h => { h.editor.getDomNode = () => ({ clientWidth: 0, clientHeight: 0 }) },
+    h => { h.model.isDisposed = () => true }
+  ]) {
+    const h = editorHarness()
+    setup(h)
+    await assert.rejects(navigation.revealAgentCodeReference(h.options))
+    assert.equal(h.calls.length, 0)
+  }
+})
+
+const hookSource = ts.createSourceFile('useAiAgent.ts', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/useAiAgent.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+const hook = hookSource.statements.find(node => ts.isFunctionDeclaration(node) && node.name?.text === 'useAiAgent')
+const functions = hook.body.statements.filter(node => ts.isVariableStatement(node) && node.declarationList.declarations[0].name.getText(hookSource) === 'openCodeReference')
+function consentHarness() {
+  const session = {}
+  const messageStateRef = { current: { session, messages: [{ id: 'answer', role: 'assistant', plan: { codeReferences: [reference] } }] } }
+  const globals = { session, messageStateRef, navigatingRef: { current: false }, applyingRef: { current: false }, abortControllerRef: { current: null }, updateMessages: update => { messageStateRef.current.messages = update(messageStateRef.current.messages) } }
+  return { ...compile(functions.map(node => `export ${node.getText(hookSource)}`).join('\n'), globals), globals, message: () => messageStateRef.current.messages[0] }
+}
+
+test('code navigation opens only when the user selects View in editor', async () => {
+  const h = consentHarness()
+  let opened = 0
+  const open = async () => { opened++ }
+  assert.equal(opened, 0)
+  await h.openCodeReference('answer', 'location', open)
+  assert.equal(opened, 1)
+  assert.equal(h.message().codeReferenceStates.location.status, 'opened')
+})
+
+test('legacy cancelled references can be opened with the same read-only navigation action', async () => {
+  const h = consentHarness()
+  h.message().codeReferenceStates = { location: { status: 'cancelled' } }
+  let opened = 0
+  await h.openCodeReference('answer', 'location', async ref => { assert.equal(ref.path, reference.path); opened++ })
+  assert.equal(opened, 1)
+  assert.equal(h.message().codeReferenceStates.location.status, 'opened')
+})
+
+test('code navigation does not block or abort a pending model response', async () => {
+  const h = consentHarness()
+  const controller = new AbortController()
+  h.globals.abortControllerRef.current = controller
+  let opened = 0
+  await h.openCodeReference('answer', 'location', async (_reference, isCurrent) => {
+    assert.equal(isCurrent(), true)
+    opened++
+  })
+  assert.equal(opened, 1)
+  assert.equal(controller.signal.aborted, false)
+  assert.equal(h.globals.abortControllerRef.current, controller)
+  assert.equal(h.message().codeReferenceStates.location.status, 'opened')
+})
+
+test('an arriving model response does not cancel an in-flight code navigation', async () => {
+  const h = consentHarness()
+  h.globals.abortControllerRef.current = new AbortController()
+  let finish, current
+  const pending = h.openCodeReference('answer', 'location', (_reference, isCurrent) => {
+    current = isCurrent
+    return new Promise(resolve => { finish = resolve })
+  })
+  h.globals.messageStateRef.current.messages.push({ id: 'new-answer', role: 'assistant' })
+  h.globals.abortControllerRef.current = null
+  assert.equal(current(), true)
+  finish()
+  await pending
+  assert.equal(h.globals.messageStateRef.current.messages[0].codeReferenceStates.location.status, 'opened')
+})
+
+test('starting file application invalidates a navigation that is still reading', async () => {
+  const h = consentHarness()
+  let finish, current
+  const pending = h.openCodeReference('answer', 'location', (_reference, isCurrent) => {
+    current = isCurrent
+    return new Promise((_resolve, reject) => { finish = () => reject(Error('applying')) })
+  })
+  h.globals.applyingRef.current = true
+  assert.equal(current(), false)
+  finish()
+  await pending
+  assert.equal(h.message().codeReferenceStates.location.status, 'error')
+})
+
+test('duplicate clicks, invalid IDs and busy tasks do not open more files', async () => {
+  const h = consentHarness()
+  let finish, opened = 0
+  const first = h.openCodeReference('answer', 'location', () => { opened++; return new Promise(resolve => { finish = resolve }) })
+  assert.equal(h.message().codeReferenceStates.location.status, 'opening')
+  await h.openCodeReference('answer', 'location', async () => { opened++ })
+  finish()
+  await first
+  assert.equal(opened, 1)
+  await h.openCodeReference('answer', 'invented', async () => { opened++ })
+  h.globals.applyingRef.current = true
+  await h.openCodeReference('answer', 'location', async () => { opened++ })
+  assert.equal(opened, 1)
+})
+
+test('errors remain visible and late navigation cannot update another conversation', async () => {
+  const h = consentHarness()
+  await h.openCodeReference('answer', 'location', async () => { throw Error('missing file') })
+  assert.equal(h.message().codeReferenceStates.location.status, 'error')
+  assert.equal(h.message().codeReferenceStates.location.error, 'missing file')
+  let finish
+  const pending = h.openCodeReference('answer', 'location', () => new Promise(resolve => { finish = resolve }))
+  const other = { id: 'other' }
+  h.globals.messageStateRef.current = { session: {}, messages: [other] }
+  finish()
+  await pending
+  assert.equal(h.message(), other)
+})
+
+test('a new question cancels pending navigation without leaving its old state stuck opening', async () => {
+  const h = consentHarness()
+  let finish, current
+  const pending = h.openCodeReference('answer', 'location', (_reference, isCurrent) => {
+    current = isCurrent
+    return new Promise((_resolve, reject) => { finish = () => reject(Error('cancelled')) })
+  })
+  h.globals.messageStateRef.current.messages.push({ id: 'new-question', role: 'user' })
+  assert.equal(current(), false)
+  finish()
+  await pending
+  assert.equal(h.globals.messageStateRef.current.messages[0].codeReferenceStates.location.status, 'error')
+  assert.equal(h.globals.messageStateRef.current.messages.at(-1).id, 'new-question')
+})
+
+test('restored interrupted navigation becomes retryable without reopening any file', () => {
+  const evidence = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentEvidence.ts'), 'utf8'))
+  const { recoverInterruptedAgentMessages } = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentContext.ts'), 'utf8'), {}, name => name === './agentEvidence' ? evidence : require(name))
+  const message = { id: 'answer', role: 'assistant', codeReferenceStates: { pending: { status: 'opening' }, approved: { status: 'opened' }, declined: { status: 'cancelled' } } }
+  const restored = recoverInterruptedAgentMessages([message])[0]
+  assert.equal(restored.codeReferenceStates.pending.status, 'error')
+  assert.equal(restored.codeReferenceStates.approved.status, 'opened')
+  assert.equal(restored.codeReferenceStates.declined.status, 'cancelled')
+  assert.equal(message.codeReferenceStates.pending.status, 'opening')
+})
+
+function elements(tree, predicate) {
+  if (!React.isValidElement(tree)) return []
+  return [...(predicate(tree) ? [tree] : []), ...React.Children.toArray(tree.props.children).flatMap(child => elements(child, predicate))]
+}
+function text(tree) {
+  return typeof tree === 'string' ? tree : React.isValidElement(tree) ? React.Children.toArray(tree.props.children).map(text).join('') : ''
+}
+const render = compile(fs.readFileSync(require.resolve('../src/renderer/src/components/AgentCodeReferences.tsx'), 'utf8'), {}, name => name.endsWith('/i18n') ? { t: key => key, useLocaleRender() {} } : require(name)).AgentCodeReferences
+for (const dark of [true, false]) test(`code navigation has only a vertically aligned View in editor button (${dark})`, () => {
+  const clicked = []
+  const props = { dark, references: [reference], onOpen: id => clicked.push(`open:${id}`) }
+  const buttons = elements(render(props), element => element.type === 'button')
+  assert.equal(clicked.length, 0)
+  assert.deepEqual(buttons.map(text), ['코드에서 보기'])
+  const label = elements(buttons[0], element => element.type === 'span')[0]
+  assert.match(buttons[0].props.className, /items-center.*leading-none/)
+  assert.match(label.props.className, /top-px leading-none/)
+  buttons[0].props.onClick()
+  assert.deepEqual(clicked, ['open:location'])
+  for (const button of elements(render({ ...props, busy: true }), element => element.type === 'button')) assert.equal(button.props.disabled, true)
+  for (const status of ['cancelled', 'opened', 'error']) {
+    assert.deepEqual(elements(render({ ...props, states: { location: { status } } }), element => element.type === 'button').map(text), ['코드에서 보기'])
+  }
+  const opening = elements(render({ ...props, states: { location: { status: 'opening' } } }), element => element.type === 'button')[0]
+  assert.equal(opening.props.disabled, true)
+  assert.equal(text(opening), '파일 여는 중...')
+  assert.equal(elements(render({ ...props, states: { location: { status: 'error', error: 'missing' } } }), element => element.props.role === 'alert').length, 1)
+})
@@ -0,0 +1,371 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+const output = {}
+const evidenceApi = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentEvidence.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: evidenceApi })
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentContext.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: output, DOMException, require: name => { assert.equal(name, './agentEvidence'); return evidenceApi } })
+const { resolveAgentContext } = output
+const plain = value => JSON.parse(JSON.stringify(value))
+const moduleInfo = (name, files = []) => ({ name, state: 'stopped', files })
+const response = (requestedModules = [], requestedLogs = []) => ({
+  provider: 'QWEN', model: 'test', usage: { totalTokens: 10 },
+  plan: { summary: 'result', explanation: 'analysis', requestedModules, requestedLogs, actionPlan: [], commands: [], changes: [], createModule: null }
+})
+const options = overrides => ({
+  initialContext: { modules: [moduleInfo('MKMini'), moduleInfo('Control')], runtimeLogs: [] },
+  signal: new AbortController().signal,
+  ...overrides
+})
+
+test('continues MKMini -> Control -> final analysis and retains earlier source files', async () => {
+  const inputs = []
+  const loads = []
+  const result = await resolveAgentContext(options({
+    requestPlan: async context => {
+      inputs.push(plain(context))
+      return [response(['MKMini']), response(['Control']), response()][inputs.length - 1]
+    },
+    loadRequestedContext: async request => {
+      loads.push(plain(request))
+      return { modules: ['MKMini', 'Control'].map(name => moduleInfo(name, request.modules.includes(name) ? [{ path: `${name}.py`, content: `${name} source` }] : [])), runtimeLogs: [] }
+    }
+  }))
+  assert.equal(inputs.length, 3)
+  assert.deepEqual(loads, [{ modules: ['MKMini'], logs: [] }, { modules: ['Control'], logs: [] }])
+  assert.equal(inputs[2].modules[0].files[0].content, 'MKMini source')
+  assert.equal(inputs[2].modules[1].files[0].content, 'Control source')
+  assert.deepEqual(plain(result.plan.requestedModules), [])
+  assert.equal(result.usage.totalTokens, 30)
+})
+
+test('keeps logs while loading a later source module', async () => {
+  let calls = 0
+  await resolveAgentContext(options({
+    requestPlan: async context => {
+      calls += 1
+      if (calls === 3) assert.equal(context.runtimeLogs[0].content, 'error log')
+      return [response([], ['Control']), response(['Control']), response()][calls - 1]
+    },
+    loadRequestedContext: async request => ({
+      modules: [moduleInfo('Control', request.modules.length ? [{ path: 'node.py', content: 'code' }] : [])],
+      runtimeLogs: request.logs.length ? [{ moduleName: 'Control', state: 'running', content: 'error log' }] : []
+    })
+  }))
+  assert.equal(calls, 3)
+})
+
+test('makes one analysis-only completion when the model repeats a context request', async () => {
+  let loads = 0
+  let calls = 0
+  const result = await resolveAgentContext(options({
+    requestPlan: async (context, finalize) => {
+      calls++
+      if (!finalize) return response(['Control'])
+      assert.equal(context.modules.find(module => module.name === 'Control').files[0].path, 'controller.py')
+      return { ...response(), plan: { ...response().plan, explanation: 'controller.py에서 조향 설정을 확인했습니다.' } }
+    },
+    loadRequestedContext: async () => { loads += 1; return { modules: [moduleInfo('Control', [{ path: 'controller.py', content: 'steering = 1' }])], runtimeLogs: [] } }
+  }))
+  assert.equal(loads, 1)
+  assert.equal(calls, 3)
+  assert.match(result.plan.explanation, /조향 설정을 확인/)
+  assert.equal(result.usage.totalTokens, 30)
+})
+
+test('finishes honestly without an infinite loop if the model ignores the finalization request', async () => {
+  let loads = 0
+  let calls = 0
+  const result = await resolveAgentContext(options({
+    requestPlan: async () => { calls++; return response(['Control']) },
+    loadRequestedContext: async () => { loads += 1; return { modules: [moduleInfo('Control')], runtimeLogs: [] } }
+  }))
+  assert.equal(loads, 1)
+  assert.equal(calls, 3)
+  assert.deepEqual(plain(result.plan.requestedModules), [])
+  assert.deepEqual(plain(result.plan.actionPlan), [])
+  assert.match(result.plan.explanation, /결론을 확정하지 못했습니다/)
+  assert.match(result.plan.explanation, /Control: 제공된 파일 0개/)
+  assert.equal(result.plan.createModule, null)
+})
+
+test('uses already provided source files without loading the same module again', async () => {
+  let loads = 0
+  let calls = 0
+  const result = await resolveAgentContext(options({
+    initialContext: { modules: [moduleInfo('Control', [{ path: 'control.py', content: 'steering = 1' }])], runtimeLogs: [] },
+    requestPlan: async (_, finalize) => { calls++; return finalize ? response() : response(['Control']) },
+    loadRequestedContext: async () => { loads++; return { modules: [], runtimeLogs: [] } }
+  }))
+  assert.equal(loads, 0)
+  assert.equal(calls, 2)
+  assert.deepEqual(plain(result.plan.requestedModules), [])
+})
+
+test('recovery cannot turn repeated source requests into executable commands or edits', async () => {
+  const result = await resolveAgentContext(options({
+    initialContext: { modules: [moduleInfo('Control', [{ path: 'control.py', content: 'source' }])], runtimeLogs: [] },
+    requestPlan: async (_, finalize) => finalize ? {
+      ...response(),
+      plan: {
+        ...response().plan, actionPlan: ['execute'], commands: [{ id: 'run', command: './run.sh' }],
+        changes: [{ moduleName: 'Control', path: 'control.py', content: 'changed' }], createModule: { name: 'new' }
+      }
+    } : response(['Control']),
+    loadRequestedContext: async () => ({ modules: [], runtimeLogs: [] })
+  }))
+  for (const field of ['commands', 'changes', 'actionPlan']) assert.deepEqual(plain(result.plan[field]), [])
+  assert.equal(result.plan.createModule, null)
+})
+
+test('does not publish a finalization response received after cancellation', async () => {
+  const controller = new AbortController()
+  let calls = 0
+  await assert.rejects(resolveAgentContext(options({
+    signal: controller.signal,
+    requestPlan: async (_, finalize) => {
+      calls++
+      if (finalize) controller.abort()
+      return finalize ? response() : response(['Control'])
+    }
+  })), { name: 'AbortError' })
+  assert.equal(calls, 2)
+})
+
+test('requests only new resources when the model also repeats an earlier module', async () => {
+  let count = 0
+  const loads = []
+  await resolveAgentContext(options({
+    requestPlan: async () => [response(['MKMini']), response(['MKMini', 'Control']), response()][count++],
+    loadRequestedContext: async request => { loads.push(plain(request)); return { modules: request.modules.map(name => moduleInfo(name)), runtimeLogs: [] } }
+  }))
+  assert.deepEqual(loads[1], { modules: ['Control'], logs: [] })
+})
+
+test('does not start another API call after cancellation during context loading', async () => {
+  const controller = new AbortController()
+  let calls = 0
+  await assert.rejects(resolveAgentContext(options({
+    signal: controller.signal,
+    requestPlan: async () => { calls += 1; return response(['Control']) },
+    loadRequestedContext: async () => { controller.abort(); return { modules: [], runtimeLogs: [] } }
+  })), { name: 'AbortError' })
+  assert.equal(calls, 1)
+})
+
+test('bounds the number of distinct automatic context requests', async () => {
+  let calls = 0
+  let loads = 0
+  const result = await resolveAgentContext(options({
+    requestPlan: async (_, finalize) => { calls++; return finalize ? response() : response([`Module${calls}`]) },
+    loadRequestedContext: async request => { loads++; return { modules: request.modules.map(name => moduleInfo(name)), runtimeLogs: [] } }
+  }))
+  assert.equal(calls, 7)
+  assert.equal(loads, 5)
+  assert.deepEqual(plain(result.plan.requestedModules), [])
+})
+
+test('passes file-read failures to the model for a concrete final explanation', async () => {
+  let count = 0
+  await resolveAgentContext(options({
+    requestPlan: async context => {
+      if (count++ === 0) return response(['Control'])
+      assert.equal(context.modules.find(module => module.name === 'Control').fileContext.status, 'error')
+      return response()
+    },
+    loadRequestedContext: async () => ({ modules: [{ ...moduleInfo('Control'), fileContext: { status: 'error', message: 'permission denied' } }], runtimeLogs: [] })
+  }))
+})
+
+test('excludes oversized source files with an explicit notice and continues with complete smaller files', async () => {
+  let calls = 0
+  const smallFile = { path: 'config/steering.yaml', content: 'kinematics: ackermann' }
+  await resolveAgentContext(options({
+    requestPlan: async context => {
+      if (calls++ === 0) return response(['Control'])
+      const control = context.modules.find(module => module.name === 'Control')
+      assert.deepEqual(plain(control.files), [smallFile])
+      assert.equal(control.fileContext.status, 'limited')
+      assert.match(control.fileContext.message, /전체 2개 중 1개/)
+      return response()
+    },
+    loadRequestedContext: async () => ({ modules: [moduleInfo('Control', [{ path: 'large.py', content: 'x'.repeat(160_001) }, smallFile])], runtimeLogs: [] })
+  }))
+  assert.equal(calls, 2)
+})
+
+test('requests a final answer rather than leaving a context-only response when no loader is available', async () => {
+  let calls = 0
+  const result = await resolveAgentContext(options({
+    requestPlan: async (_, finalize) => { calls++; return finalize ? response() : response(['Control']) }
+  }))
+  assert.equal(calls, 2)
+  assert.deepEqual(plain(result.plan.requestedModules), [])
+})
+
+test('keeps a just-started module running when a stale collector supplies source files', async () => {
+  let calls = 0
+  await resolveAgentContext(options({
+    initialContext: { modules: [{ ...moduleInfo('Control'), state: 'running' }], runtimeLogs: [] },
+    requestPlan: async context => {
+      if (calls++ === 0) return response(['Control'])
+      assert.equal(context.modules[0].state, 'running')
+      assert.equal(context.modules[0].files[0].content, 'code')
+      return response()
+    },
+    loadRequestedContext: async () => ({ modules: [moduleInfo('Control', [{ path: 'node.py', content: 'code' }])], runtimeLogs: [] })
+  }))
+})
+
+const files = (name, count, size = 10) => Array.from({ length: count }, (_, index) => ({ path: `${name}-${index}.py`, content: String(index).padEnd(size, 'x') }))
+const sourceSize = modules => modules.reduce((sum, module) => sum + module.files.reduce((total, file) => total + file.path.length + file.content.length, 0), 0)
+
+test('balances 24 old and 24 new files instead of failing the second module lookup', async () => {
+  let calls = 0
+  await resolveAgentContext(options({
+    requestPlan: async context => {
+      calls++
+      if (calls === 1) return response(['MKMini'])
+      if (calls === 2) return response(['Control'])
+      assert.equal(context.modules.reduce((sum, module) => sum + module.files.length, 0), 24)
+      for (const name of ['MKMini', 'Control']) {
+        const module = context.modules.find(module => module.name === name)
+        assert.equal(module.files.length, 12)
+        assert.equal(module.fileContext.status, 'limited')
+        assert.match(module.fileContext.message, /전체 24개 중 12개/)
+      }
+      return response()
+    },
+    loadRequestedContext: async request => ({ modules: request.modules.map(name => moduleInfo(name, files(name, 24))), runtimeLogs: [] })
+  }))
+  assert.equal(calls, 3)
+})
+
+test('enforces the combined character budget without slicing source file contents', async () => {
+  let calls = 0
+  const contents = new Set(['a'.repeat(60_000), 'b'.repeat(60_000)])
+  await resolveAgentContext(options({
+    requestPlan: async context => {
+      if (calls++ === 0) return response(['Control'])
+      assert.ok(sourceSize(context.modules) <= 160_000)
+      for (const module of context.modules) {
+        assert.equal(module.files.length, 1)
+        assert.ok(contents.has(module.files[0].content))
+        assert.equal(module.fileContext.status, 'limited')
+      }
+      return response()
+    },
+    loadRequestedContext: async () => ({ modules: ['MKMini', 'Control'].map((name, index) => moduleInfo(name, [
+      { path: 'one.py', content: [...contents][index] },
+      { path: 'two.py', content: [...contents][index] }
+    ])), runtimeLogs: [] }),
+    initialContext: { modules: [moduleInfo('MKMini', [{ path: 'one.py', content: [...contents][0] }, { path: 'two.py', content: [...contents][0] }]), moduleInfo('Control')], runtimeLogs: [] }
+  }))
+})
+
+test('prioritizes newly requested source when earlier context nearly fills the character budget', async () => {
+  let calls = 0
+  await resolveAgentContext(options({
+    initialContext: { modules: [moduleInfo('MKMini', files('old', 2, 70_000)), moduleInfo('Control')], runtimeLogs: [] },
+    requestPlan: async context => {
+      if (calls++ === 0) return response(['Control'])
+      assert.equal(context.modules.find(module => module.name === 'Control').files[0].content, 'new'.repeat(20_000))
+      assert.ok(context.modules.find(module => module.name === 'MKMini').files.length > 0)
+      assert.ok(sourceSize(context.modules) <= 160_000)
+      return response()
+    },
+    loadRequestedContext: async () => ({ modules: [moduleInfo('Control', [{ path: 'controller.py', content: 'new'.repeat(20_000) }])], runtimeLogs: [] })
+  }))
+})
+
+test('budgets initial source context before sending the first API request', async () => {
+  const initialContext = { modules: [moduleInfo('Control', files('source', 30))], runtimeLogs: [] }
+  await resolveAgentContext(options({
+    initialContext,
+    requestPlan: async context => {
+      assert.equal(context.modules[0].files.length, 24)
+      assert.equal(context.modules[0].fileContext.status, 'limited')
+      return response()
+    }
+  }))
+  assert.equal(initialContext.modules[0].files.length, 30)
+  assert.equal(initialContext.modules[0].fileContext, undefined)
+})
+
+test('rotates older logs out with a notice rather than failing on a fourth module', async () => {
+  let calls = 0
+  await resolveAgentContext(options({
+    initialContext: { modules: [], runtimeLogs: ['A', 'B', 'C'].map(moduleName => ({ moduleName, state: 'running', content: `${moduleName} log` })) },
+    requestPlan: async context => {
+      if (calls++ === 0) return response([], ['D'])
+      assert.deepEqual(plain(context.runtimeLogs.map(log => log.moduleName)), ['D', 'C', 'B'])
+      assert.match(context.runtimeLogs[0].message, /이전 로그 제외: A/)
+      return response()
+    },
+    loadRequestedContext: async () => ({ modules: [], runtimeLogs: [{ moduleName: 'D', state: 'running', content: 'latest error' }] })
+  }))
+})
+
+test('counts log messages in the server budget and keeps recent log content', async () => {
+  await resolveAgentContext(options({
+    initialContext: { modules: [], runtimeLogs: ['A', 'B', 'C'].map(moduleName => ({ moduleName, state: 'running', content: `${'x'.repeat(20_000)}LATEST`, message: 'm'.repeat(500) })) },
+    requestPlan: async context => {
+      assert.equal(context.runtimeLogs.length, 3)
+      assert.ok(context.runtimeLogs.reduce((sum, log) => sum + log.content.length + (log.message?.length ?? 0), 0) <= 60_000)
+      for (const log of context.runtimeLogs) {
+        assert.ok(log.content.endsWith('LATEST'))
+        assert.match(log.message, /최근 구간/)
+        assert.ok(log.message.length <= 500)
+      }
+      return response()
+    }
+  }))
+})
+
+test('collects candidates from every requested module and prioritizes configuration before large source trees', async () => {
+  const source = ts.createSourceFile('App.tsx', fs.readFileSync(require.resolve('../src/renderer/src/App.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+  let collector
+  function visit(node) {
+    if (ts.isVariableDeclaration(node) && node.name.getText(source) === 'collectAgentWorkspace') collector = node.initializer.getText(source)
+    ts.forEachChild(node, visit)
+  }
+  visit(source)
+  assert.ok(collector)
+  const api = {}
+  vm.runInNewContext(ts.transpileModule(`exports.collect = ${collector}`, {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+  }).outputText, {
+    exports: api,
+    availableModules: ['MKMini', 'Control'].map(name => ({ name, state: 'stopped' })),
+    remoteWorkspace: false,
+    clonePathPreview: '/workspace',
+    currentActiveEditorFile: null,
+    editorFiles: {},
+    window: { localWorkspace: { moduleFiles: { read: async name => ({ files: Object.fromEntries([
+      ...files(name, 30).map((file, index) => [`src/node${index}.py`, file.content]),
+      ['config/steering.yaml', 'kinematics: ackermann']
+    ]) }) } } }
+  })
+  const modules = await api.collect(['MKMini', 'Control'])
+  assert.deepEqual(plain(modules.map(module => module.files.length)), [24, 24])
+  for (const module of modules) assert.equal(module.files[0].path, 'config/steering.yaml')
+  let calls = 0
+  await resolveAgentContext(options({
+    requestPlan: async context => {
+      if (calls++ === 0) return response(['MKMini', 'Control'])
+      for (const module of context.modules) {
+        assert.equal(module.files.length, 12)
+        assert.equal(module.files[0].path, 'config/steering.yaml')
+      }
+      return response()
+    },
+    loadRequestedContext: async request => ({ modules: await api.collect(request.modules), runtimeLogs: [] })
+  }))
+})
@@ -0,0 +1,105 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+const api = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentConversationContext.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: api })
+const { agentConversationWorkspace: scope, buildAgentConversationContext: build } = api
+const now = Date.now()
+const local = scope('local', 'local-host', '/workspace/a')
+const plain = value => JSON.parse(JSON.stringify(value))
+const turn = (n, workspace = local, createdAt = now) => [
+  { id: `u${n}`, role: 'user', content: `question-${n}`, conversationScope: { workspace, createdAt } },
+  { id: `a${n}`, role: 'assistant', content: `summary-${n}`, conversationScope: { workspace, createdAt }, plan: {
+    summary: `summary-${n}`, explanation: `answer-${n}`, conversationSummary: `누적 기억-${n}`, changes: [], commands: [], requestedModules: [], requestedLogs: [], createModule: null
+  } }
+]
+
+test('uses the latest cumulative summary with only two recent exchanges and no duplicate current question', () => {
+  const messages = Array.from({ length: 20 }, (_, i) => turn(i)).flat()
+  messages.push({ ...turn(20)[0], content: 'pending current question' })
+  const context = build(messages, local, now)
+  assert.deepEqual(plain(context.recentMessages).map(item => item.content), ['question-18', 'summary-18\nanswer-18', 'question-19', 'summary-19\nanswer-19'])
+  assert.equal(context.summary, '누적 기억-19')
+  assert.doesNotMatch(JSON.stringify(context), /question-17|pending current question/)
+})
+
+test('hard caps payload text even with huge original answers and requests', () => {
+  const messages = Array.from({ length: 10 }, (_, i) => {
+    const pair = turn(i)
+    pair[0].content = 'q'.repeat(4000)
+    pair[1].plan.summary = 's'.repeat(500)
+    pair[1].plan.explanation = 'e'.repeat(12000)
+    pair[1].plan.conversationSummary = 'm'.repeat(2000)
+    return pair
+  }).flat()
+  const context = build(messages, local, now)
+  assert.ok(context.summary.length <= 1000)
+  assert.equal(context.recentMessages.length, 4)
+  assert.ok(context.recentMessages.every(message => message.content.length <= 700))
+  assert.ok(context.summary.length + context.recentMessages.reduce((sum, item) => sum + item.content.length, 0) <= 3800)
+})
+
+test('does not mix hosts, roots, SSH identities, unscoped legacy messages or expired history', () => {
+  for (const other of [scope('remote', 'ssh:a', '/workspace/a'), scope('local', 'local-host', '/workspace/b'), scope('remote', 'ssh:b', '/workspace/a')]) {
+    assert.equal(build(turn(1, other), local, now), undefined)
+  }
+  assert.equal(build(turn(1, local, now - 86400000), local, now), undefined)
+  assert.equal(build(turn(1, local, now + 1), local, now), undefined)
+  assert.equal(build(turn(1).map(({ conversationScope, ...message }) => message), local, now), undefined)
+  assert.equal(scope('local', 'local-host'), undefined)
+  assert.equal(build(turn(1), undefined, now), undefined)
+  assert.equal(build([], local, now), undefined)
+})
+
+test('a missing or empty generated summary preserves earlier valid memory without an extra model call', () => {
+  const first = turn(1), second = turn(2)
+  delete second[1].plan.conversationSummary
+  assert.equal(build([...first, ...second], local, now).summary, '누적 기억-1')
+  second[1].plan.conversationSummary = ''
+  assert.equal(build([...first, ...second], local, now).summary, '누적 기억-1')
+  delete first[1].plan.conversationSummary
+  assert.equal(build([...first, ...second], local, now).summary, '')
+  second[1].plan.conversationSummary = '새 누적 요약'
+  assert.equal(build([...first, ...second], local, now).summary, '새 누적 요약')
+})
+
+test('keeps file identities and action outcomes, but excludes payloads and tool evidence', () => {
+  const pair = turn(1)
+  pair[1].plan.explanation = '설명\n```python\nPRIVATE_SOURCE\n```\n끝'
+  pair[1].plan.changes = [{ moduleName: 'Control', path: 'config.yaml', content: 'PRIVATE_CHANGE' }]
+  pair[1].plan.commands = [{ id: 'build', moduleName: 'Control', purpose: 'build', command: 'PRIVATE_COMMAND' }]
+  pair[1].plan.evidence = [{ data: 'PRIVATE_LOG' }]
+  pair[1].plan.codeReferences = [{ moduleName: 'Control', path: 'node.py', startLine: 20, endLine: 23, snippet: 'PRIVATE_SNIPPET' }]
+  pair[1].commandExecutions = { build: { status: 'completed', output: 'PRIVATE_OUTPUT' } }
+  pair[1].applyState = 'cancelled'
+  const context = JSON.stringify(build(pair, local, now))
+  assert.match(context, /Control\/node.py:20-23/)
+  assert.match(context, /file change: cancelled/)
+  assert.match(context, /build: completed/)
+  assert.doesNotMatch(context, /PRIVATE_/)
+})
+
+test('ignores errors, interrupted turns and initial lookup responses', () => {
+  const pair = turn(1)
+  const error = { ...pair[1], plan: undefined, content: 'network error' }
+  assert.equal(build([pair[0], error], local, now), undefined)
+  pair[1].plan.toolRequests = [{ name: 'files.read' }]
+  assert.equal(build(pair, local, now), undefined)
+  assert.equal(build([turn(1)[0], ...turn(2, scope('remote', 'ssh:x', '/workspace'))], local, now), undefined)
+})
+
+test('rebuilds from persisted metadata and reflects updated execution outcomes without new memory storage', () => {
+  const pair = turn(1)
+  pair[1].plan.commands = [{ id: 'build', moduleName: 'Control', purpose: 'build' }]
+  assert.match(JSON.stringify(build(plain(pair), local, now)), /pending/)
+  pair[1].commandExecutions = { build: { status: 'failed' } }
+  assert.match(JSON.stringify(build(plain(pair), local, now)), /failed/)
+  const followUp = { ...pair[1], content: 'result', plan: { ...pair[1].plan, summary: '실행 결과 분석', explanation: '실패했습니다.' } }
+  assert.match(JSON.stringify(build([...pair, followUp], local, now)), /실행 결과 분석/)
+  assert.equal(build([], local, now), undefined)
+})
@@ -0,0 +1,31 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const api = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/WorkspaceEditorPane.tsx'), 'utf8'), { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX, esModuleInterop: true } }).outputText, {
+  exports: api,
+  require: id => id === '../../i18n' ? { t: value => value, useLocaleRender() {} }
+    : id === '@monaco-editor/react' ? { __esModule: true, default: 'Editor', DiffEditor: 'DiffEditor' }
+    : id === 'lucide-react' ? {} : require(id)
+})
+const props = { dark: true, textDim: '', editorPaneRef: { current: null }, currentActiveEditorFile: 'config/control.yaml', activeFileIsImage: false, editorLanguage: 'yaml', editorValue: 'steering: ackermann', fontSize: 12, tabSize: 4, minimapEnabled: false, exampleActive: false, beforeMount() {}, onMount() {}, onChange() {} }
+for (const locked of [false, true]) {
+  test(`the source editor is read-only only while an agent file batch is applying (locked=${locked})`, () => {
+    const tree = api.default({ ...props, editingLocked: locked })
+    assert.equal(tree.props.children.type, 'Editor')
+    assert.equal(tree.props.children.props.options.readOnly, locked)
+  })
+}
+test('agent diff previews remain read-only and set tab width through text models', () => {
+  const tree = api.default({ ...props, diffPreview: { id: 'diff', originalContent: 'old', modifiedContent: 'new' } })
+  const diff = tree.props.children
+  assert.equal(diff.type, 'DiffEditor')
+  assert.equal(diff.props.options.readOnly, true)
+  assert.equal('tabSize' in diff.props.options, false)
+  const updates = []
+  const editor = { getModel: () => ({ updateOptions: options => updates.push(options.tabSize) }) }
+  diff.props.onMount({ getOriginalEditor: () => editor, getModifiedEditor: () => editor })
+  assert.deepEqual(updates, [4, 4])
+})
@@ -0,0 +1,143 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const ts = require('typescript')
+require.extensions['.ts'] = (module, filename) => module._compile(ts.transpileModule(fs.readFileSync(filename, 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, filename)
+const { compactAgentEvidence, missingAgentRead, readFileEvidence } = require('../src/renderer/src/features/workspace/agentEvidence.ts')
+const { resolveAgentContext } = require('../src/renderer/src/features/workspace/agentContext.ts')
+const file = (startLine, endLine, extra = {}, result = {}) => ({
+  id: `read-${startLine}-${endLine}`, name: 'files.read', moduleName: 'Control', target: 'ssh:jetson', status: 'ok', observedAt: '2026-10-20T00:00:00.000Z', truncated: true,
+  data: JSON.stringify({ path: 'config/car.yaml', exists: true, hash: 'a'.repeat(64), content: Array.from({ length: endLine - startLine + 1 }, (_, i) => `line${startLine + i}`).join('\n'),
+    startLine, endLine, totalLines: 100, complete: false, contentTruncated: false, ...extra }), ...result
+})
+const read = (startLine, lineCount, path = 'config/car.yaml') => ({ id: 'read', name: 'files.read', moduleName: 'Control', args: { path, ...(startLine === undefined ? {} : { startLine }), ...(lineCount === undefined ? {} : { lineCount }) } })
+const answer = toolRequests => ({ provider: 'test', model: 'test', plan: { summary: 'result', explanation: 'verified code', toolRequests, changes: [], commands: [], actionPlan: [], createModule: null } })
+
+test('overlapping and adjacent ranges merge without promoting partial evidence to editable full files', () => {
+  const results = compactAgentEvidence([file(1, 10), file(8, 15), file(16, 20)])
+  assert.equal(results.length, 1)
+  const data = readFileEvidence(results[0])
+  assert.equal(data.startLine, 1)
+  assert.equal(data.endLine, 20)
+  assert.equal(data.content.split('\n').length, 20)
+  assert.equal(data.complete, false)
+  assert.equal(results[0].truncated, true)
+  assert.equal(missingAgentRead(read(3, 16), results), undefined)
+  assert.deepEqual(missingAgentRead(read(), results), read())
+})
+
+test('queries only the first missing range and never joins disjoint or conflicting content', () => {
+  const results = compactAgentEvidence([file(1, 5), file(10, 15)])
+  assert.equal(results.length, 2)
+  assert.deepEqual(missingAgentRead(read(3, 15), results).args, { path: 'config/car.yaml', startLine: 6, lineCount: 4 })
+  assert.equal(compactAgentEvidence([file(1, 10), file(8, 15, { content: 'different\ncontent' })]).length, 2)
+})
+
+test('host boundaries and file revisions cannot be combined or used to fill each other’s gaps', () => {
+  const changed = compactAgentEvidence([file(1, 10), file(11, 20, { hash: 'b'.repeat(64) })])
+  assert.equal(changed.length, 1)
+  assert.equal(missingAgentRead(read(1, 20), changed).args.startLine, 1)
+  const hosts = compactAgentEvidence([file(1, 10, {}, { target: 'local-host' }), file(11, 20)])
+  assert.equal(hosts.length, 2)
+  assert.equal(missingAgentRead(read(1, 20), hosts).args.startLine, 1)
+})
+
+test('full and missing observations are reused but partial character fragments are never coverage', () => {
+  const full = file(1, 10, { complete: true }, { truncated: false })
+  assert.equal(missingAgentRead(read(5, 100), [full]), undefined)
+  assert.equal(compactAgentEvidence([full, file(5, 8)]).length, 1)
+  const missing = file(1, 1, { exists: false, content: '', hash: null, complete: true }, { truncated: false })
+  assert.equal(missingAgentRead(read(), [missing]), undefined)
+  const cut = file(1, 2, { content: 'whole\ncut', endLine: 1, contentTruncated: true })
+  assert.equal(missingAgentRead(read(2, 1), [cut]).args.startLine, 2)
+  const legacy = file(1, 2, { endLine: undefined, contentTruncated: undefined })
+  assert.equal(missingAgentRead(read(2, 1), [legacy]).args.startLine, 2)
+})
+
+test('malformed or oversized evidence never becomes reusable complete coverage', () => {
+  assert.equal(readFileEvidence(file(1, 10, { hash: 'not-a-hash' })), undefined)
+  assert.equal(readFileEvidence(file(1, 10, { endLine: 999 })), undefined)
+  const large = compactAgentEvidence([file(1, 1, { content: 'a'.repeat(30_000) }), file(2, 2, { content: 'b'.repeat(30_000) })])
+  assert.equal(large.length, 2)
+})
+
+test('overlap requests execute only missing lines and finish once the requested range is cached', async () => {
+  const executions = []
+  let calls = 0
+  await resolveAgentContext({
+    initialContext: { modules: [], runtimeLogs: [] }, signal: new AbortController().signal,
+    executeTool: async tool => { executions.push(tool.args); return file(tool.args.startLine, tool.args.startLine + tool.args.lineCount - 1) },
+    requestPlan: async (context, final) => {
+      calls++
+      if (final) {
+        assert.equal(context.toolResults.length, 1)
+        assert.equal(JSON.parse(context.toolResults[0].data).endLine, 15)
+        return answer([])
+      }
+      return answer([[read(1, 10)], [read(5, 11)], [read(4, 10)]][calls - 1])
+    }
+  })
+  assert.deepEqual(executions, [read(1, 10).args, read(11, 5).args])
+  assert.equal(calls, 4)
+})
+
+test('source evidence survives many later searches and omissions are reported within DTO limits', async () => {
+  const searchResults = Array.from({ length: 15 }, (_, i) => ({ ...file(1, 1), id: `search-${i}`, name: 'files.search', data: JSON.stringify({ query: `speed${i}`, matches: [] }) }))
+  await resolveAgentContext({
+    initialContext: { modules: [], runtimeLogs: [], toolResults: [file(1, 10), ...searchResults] }, signal: new AbortController().signal,
+    requestPlan: async context => {
+      assert.equal(context.toolResults.length, 12)
+      assert.equal(context.toolResults[0].name, 'files.read')
+      assert.match(context.contextNotes[0], /4개/)
+      assert.ok(context.contextNotes.length <= 12)
+      assert.ok(context.contextNotes.every(note => note.length <= 500))
+      return answer([])
+    }
+  })
+})
+
+test('a cached file omitted by budgets is restored when the model requests it again', async () => {
+  let calls = 0
+  const results = Array.from({ length: 13 }, (_, i) => file(1, 10, { path: `file${i}.yaml` }))
+  await resolveAgentContext({
+    initialContext: { modules: [], runtimeLogs: [], toolResults: results }, signal: new AbortController().signal,
+    executeTool: async () => { throw Error('cached file must not be queried again') },
+    requestPlan: async (context, final) => {
+      calls++
+      if (!final) return answer([read(1, 5, 'file0.yaml')])
+      assert.ok(context.toolResults.some(result => JSON.parse(result.data).path === 'file0.yaml'))
+      return answer([])
+    }
+  })
+  assert.equal(calls, 2)
+})
+
+test('finalization retains verified code locations while stripping all proposed mutations', async () => {
+  const reference = { id: 'code-1', moduleName: 'Control', path: 'config/car.yaml', startLine: 1, endLine: 3, reason: 'verified', expectedHash: 'a'.repeat(64), snippet: 'line1' }
+  const result = await resolveAgentContext({
+    initialContext: { modules: [], runtimeLogs: [], toolResults: [file(1, 10)] }, signal: new AbortController().signal,
+    executeTool: async () => { throw Error('already cached') },
+    requestPlan: async (_, final) => ({ ...answer([read(1, 5)]), plan: { ...answer([read(1, 5)]).plan, ...(final ? { changes: [{ path: 'unsafe' }], commands: [{ command: 'unsafe' }] } : { codeReferences: [reference] }) } })
+  })
+  assert.equal(result.plan.codeReferences.length, 1)
+  assert.match(result.plan.explanation, /verified code/)
+  assert.deepEqual(result.plan.changes, [])
+  assert.deepEqual(result.plan.commands, [])
+})
+
+test('recovery never resurrects code locations after a different file revision was observed', async () => {
+  let calls = 0
+  const reference = { id: 'code-1', moduleName: 'Control', path: 'config/car.yaml', startLine: 1, endLine: 3, reason: 'verified', expectedHash: 'a'.repeat(64), snippet: 'line1' }
+  const result = await resolveAgentContext({
+    initialContext: { modules: [], runtimeLogs: [], toolResults: [file(1, 10)] }, signal: new AbortController().signal,
+    executeTool: async () => file(11, 20, { hash: 'b'.repeat(64) }),
+    requestPlan: async (_, final) => {
+      calls++
+      return !final && calls === 1 ? { ...answer([read(11, 10)]), plan: { ...answer([read(11, 10)]).plan, codeReferences: [reference] } } : answer([read(11, 10)])
+    }
+  })
+  assert.deepEqual(result.plan.codeReferences, [])
+  assert.match(result.plan.summary, /확정하지 못했습니다/)
+})
@@ -0,0 +1,99 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+
+function compile(path, overrides = {}) {
+  const exports = {}
+  const source = fs.readFileSync(require.resolve(path), 'utf8')
+  vm.runInNewContext(ts.transpileModule(source, { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX } }).outputText,
+    { exports, document: { body: {} }, require: name => overrides[name] ?? require(name) })
+  return exports
+}
+const models = compile('../src/renderer/src/features/workspace/agentModels.ts')
+const options = [{ provider: 'OPENAI', model: 'gpt-6.1-sol', imagesEnabled: false }, { provider: 'QWEN', model: 'qwen3.8-flash', imagesEnabled: true }]
+const plain = value => JSON.parse(JSON.stringify(value))
+
+test('normalizes enabled models, validates IDs and preserves old single-model servers', () => {
+  const status = models.normalizeAgentStatus({ enabled: true, models: [options[1], options[0], options[0], { provider: 'FORGED', model: 'bad' }, { provider: 'GEMINI', model: '' }] })
+  assert.deepEqual(plain(status.models), options)
+  assert.equal(status.selectionSupported, true)
+  assert.deepEqual(plain(models.normalizeAgentStatus({ enabled: true, ...options[1] }).models), [options[1]])
+  assert.equal(models.normalizeAgentStatus({ enabled: true, ...options[1] }).selectionSupported, false)
+  assert.equal(models.normalizeAgentStatus({ enabled: false, models: options }).models.length, 0)
+  assert.equal(models.normalizeAgentStatus({ enabled: true, models: [] }).enabled, false)
+})
+
+test('selects the saved provider only while it is available, and never invents one', () => {
+  assert.equal(models.selectedAgentModel(options, 'QWEN'), options[1])
+  assert.equal(models.selectedAgentModel(options, 'ANTHROPIC'), options[0])
+  assert.equal(models.selectedAgentModel([options[0]], 'QWEN'), options[0])
+  assert.equal(models.selectedAgentModel([], 'QWEN'), null)
+})
+
+function elements(root, predicate) {
+  if (!React.isValidElement(root)) return []
+  return [...(predicate(root) ? [root] : []), ...React.Children.toArray(root.props.children).flatMap(child => elements(child, predicate))]
+}
+function selectorHarness(props) {
+  const state = [], refs = []
+  let stateIndex = 0, refIndex = 0
+  const { AgentModelSelector } = compile('../src/renderer/src/components/AgentModelSelector.tsx', {
+    '../i18n': { t: value => value }, '../features/workspace/agentModels': models,
+    'react-dom': { createPortal: child => child },
+    react: { ...React, useId: () => 'model-menu', useEffect() {}, useLayoutEffect() {},
+      useState(initial) { const index = stateIndex++; if (!(index in state)) state[index] = initial; return [state[index], value => { state[index] = typeof value === 'function' ? value(state[index]) : value }] },
+      useRef(initial) { return refs[refIndex++] ?? (refs[refIndex - 1] = { current: initial }) }
+    }
+  })
+  return { render(patch = {}) { stateIndex = 0; refIndex = 0; return AgentModelSelector({ ...props, ...patch }) } }
+}
+
+for (const dark of [true, false]) test(`model control lists only allowed providers and follows the theme (${dark})`, () => {
+  let selected
+  const h = selectorHarness({ models: options, provider: 'QWEN', dark, disabled: false, onChange: value => { selected = value } })
+  const tree = h.render()
+  const trigger = elements(tree, node => node.type === 'button')[0]
+  assert.equal(trigger.props['aria-haspopup'], 'menu')
+  assert.equal(trigger.props['aria-expanded'], false)
+  assert.equal(trigger.props.title, 'Qwen · qwen3.8-flash')
+  assert.equal(elements(tree, node => node.props.role === 'menu').length, 0)
+  assert.equal(elements(tree, node => node.type === 'select').length, 0)
+  trigger.props.onClick()
+  const menu = elements(h.render(), node => node.props.role === 'menu')[0]
+  assert.match(menu.props.className, dark ? /bg-\[#252526\]/ : /bg-white/)
+  assert.match(menu.props.className, /fixed/)
+  const items = elements(menu, node => node.props.role === 'menuitemradio')
+  assert.deepEqual(items.map(node => node.props.title), ['OpenAI · gpt-6.1-sol', 'Qwen · qwen3.8-flash'])
+  assert.deepEqual(items.map(node => node.props['aria-checked']), [false, true])
+  assert.ok(items.every(node => elements(node, item => item.type === 'span' && item.props.className.includes('truncate')).length === 1))
+  items[0].props.onClick()
+  assert.equal(selected, 'OPENAI')
+  assert.equal(elements(h.render(), node => node.props.role === 'menu').length, 0)
+  assert.ok(elements(h.render({ disabled: true }), node => node.type === 'button')[0].props.disabled)
+  const empty = elements(h.render({ models: [], provider: null }), node => node.type === 'button')[0]
+  assert.ok(empty.props.disabled)
+  assert.equal(empty.props.title, '사용 가능한 모델 없음')
+})
+
+test('model menu opens from arrow keys and closes when a request blocks the selector', () => {
+  const h = selectorHarness({ models: options, provider: 'QWEN', dark: true, disabled: false, onChange() {} })
+  const trigger = elements(h.render(), node => node.type === 'button')[0]
+  trigger.props.onKeyDown({ key: 'ArrowUp', preventDefault() {} })
+  assert.equal(elements(h.render(), node => node.props.role === 'menu').length, 1)
+  assert.equal(elements(h.render({ disabled: true }), node => node.props.role === 'menu').length, 0)
+})
+
+test('input footer places the model action before the attachment and clear controls', () => {
+  const source = fs.readFileSync(require.resolve('../src/renderer/src/components/ChatWidgets.tsx'), 'utf8')
+  const row = source.slice(source.indexOf('{(attachmentsEnabled || onClearConversation || footerAction)'))
+  assert.ok(row.indexOf('{footerAction}') < row.indexOf('title={t(\'파일 첨부\')}'))
+  assert.ok(row.indexOf('{footerAction}') < row.indexOf('title={t(\'대화내역 삭제\')}'))
+})
+
+test('A-Copilot has a single managed label', () => {
+  assert.equal(models.agentModelLabel({ provider: 'A_COPILOT', model: 'A-Copilot', imagesEnabled: false }), 'A-Copilot')
+  assert.equal(models.agentModelLabel(options[0]), 'OpenAI · gpt-6.1-sol')
+})
@@ -0,0 +1,146 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+
+function compile(source, globals) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(source, {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText, { exports, require, ...globals })
+  return exports
+}
+const hookSource = ts.createSourceFile('useAiAgent.ts', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/useAiAgent.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+const hook = hookSource.statements.find(node => ts.isFunctionDeclaration(node) && node.name?.text === 'useAiAgent')
+const functions = hook.body.statements.filter(node => ts.isVariableStatement(node) && ['applyPlan', 'cancelPlan'].includes(node.declarationList.declarations[0].name.getText(hookSource)))
+const proposal = (extra = {}) => ({
+  id: 'proposal', role: 'assistant', content: '로그 추가', applyState: 'ready',
+  plan: { summary: '로그 추가', explanation: '시작 로그', requestedModules: [], requestedLogs: [], actionPlan: [], createModule: null,
+    changes: [{ moduleName: 'Control', path: 'node.py', content: 'new', reason: 'log' }],
+    commands: [{ id: 'build', moduleName: 'Control', command: 'bash build.sh', purpose: 'build' }] },
+  commandExecutions: { build: { status: 'pending' } }, ...extra
+})
+function harness(message) {
+  const session = {}
+  const messageStateRef = { current: { session, messages: [message] } }
+  const applyingRef = { current: false }
+  const abortControllerRef = { current: null }
+  const saved = []
+  const api = compile(functions.map(node => `export ${node.getText(hookSource)}`).join('\n'), {
+    session, messageStateRef, applyingRef, abortControllerRef,
+    updateMessages(update) {
+      const next = update(messageStateRef.current.messages)
+      messageStateRef.current.messages = next
+      saved.push(JSON.parse(JSON.stringify(next)))
+    }
+  })
+  return { ...api, messageStateRef, applyingRef, abortControllerRef, saved, current: () => messageStateRef.current.messages[0] }
+}
+
+test('cancel marks the proposal and unfinished commands without applying files', async () => {
+  const h = harness(proposal({ applyError: 'old error' }))
+  assert.equal(h.cancelPlan('proposal'), true)
+  assert.equal(h.current().applyState, 'cancelled')
+  assert.equal(h.current().applyError, undefined)
+  assert.equal(h.current().commandExecutions.build.status, 'rejected')
+  assert.equal(h.saved.at(-1)[0].applyState, 'cancelled')
+  let applied = false
+  await h.applyPlan('proposal', async () => { applied = true })
+  assert.equal(applied, false)
+  assert.equal(h.cancelPlan('proposal'), false)
+})
+
+test('cancel preserves existing successful command results and rejects failed commands', () => {
+  const message = proposal()
+  message.plan.commands.push({ id: 'inspect', moduleName: 'Control', command: 'inspect', purpose: 'inspect' })
+  message.commandExecutions = { build: { status: 'failed', output: 'build failed' }, inspect: { status: 'completed', output: 'done' } }
+  const h = harness(message)
+  h.cancelPlan('proposal')
+  assert.equal(h.current().commandExecutions.inspect.status, 'completed')
+  assert.equal(h.current().commandExecutions.inspect.output, 'done')
+  assert.equal(h.current().commandExecutions.build.status, 'rejected')
+  assert.equal(h.current().commandExecutions.build.output, 'build failed')
+})
+
+for (const applyState of ['applying', 'applied', 'cancelled']) {
+  test(`cannot cancel a proposal in ${applyState} state`, () => {
+    const h = harness(proposal({ applyState }))
+    assert.equal(h.cancelPlan('proposal'), false)
+    assert.equal(h.saved.length, 0)
+  })
+}
+
+test('cannot cancel during a running command, another apply, pending request, or changed conversation', () => {
+  for (const setup of [
+    h => { h.current().commandExecutions.build.status = 'running' },
+    h => { h.applyingRef.current = true },
+    h => { h.abortControllerRef.current = {} },
+    h => { h.messageStateRef.current.session = {} }
+  ]) {
+    const h = harness(proposal())
+    setup(h)
+    assert.equal(h.cancelPlan('proposal'), false)
+    assert.equal(h.saved.length, 0)
+  }
+})
+
+test('an apply already started cannot be cancelled and completes normally', async () => {
+  const h = harness(proposal())
+  let finish
+  const applying = h.applyPlan('proposal', () => new Promise(resolve => { finish = resolve }))
+  assert.equal(h.current().applyState, 'applying')
+  assert.equal(h.cancelPlan('proposal'), false)
+  finish()
+  await applying
+  assert.equal(h.current().applyState, 'applied')
+})
+
+test('new module proposals can be cancelled without creating anything', () => {
+  const message = proposal()
+  message.plan.changes = []
+  message.plan.createModule = { name: 'Example' }
+  const h = harness(message)
+  assert.equal(h.cancelPlan('proposal'), true)
+  assert.equal(h.current().applyState, 'cancelled')
+})
+
+function elements(root, predicate) {
+  if (!React.isValidElement(root)) return []
+  return [...(predicate(root) ? [root] : []), ...React.Children.toArray(root.props.children).flatMap(child => elements(child, predicate))]
+}
+function text(root) {
+  if (typeof root === 'string') return root
+  return React.isValidElement(root) ? React.Children.toArray(root.props.children).map(text).join('') : ''
+}
+const panelSource = ts.createSourceFile('WorkspaceQaPanel.tsx', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/WorkspaceQaPanel.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+const renderAgent = compile(`export ${panelSource.statements.find(node => ts.isFunctionDeclaration(node) && node.name?.text === 'AgentMessages').getText(panelSource)}`, {
+  ...require('lucide-react'), t: key => key, useLocaleRender() {},
+  ProgressiveChatResponse: () => null, MessageCopyButton: () => null,
+  AgentWorkDuration: () => null,
+  agentMessageCopyText: message => message.content
+}).AgentMessages
+
+for (const dark of [true, false]) {
+  test(`cancel is left of apply, disabled during work, and absent after cancellation (${dark ? 'dark' : 'light'})`, () => {
+    let cancelled
+    const props = { dark, enabled: true, statusLoading: false, pending: false,
+      messages: [proposal()], onApply() {}, onCancel: id => { cancelled = id }, onOpenChange() {}, onRunCommand() {}, onRejectCommand() {} }
+    let tree = renderAgent(props)
+    let buttons = elements(tree, node => node.type === 'button')
+    const cancel = buttons.find(button => text(button) === '취소')
+    const apply = buttons.find(button => text(button) === '변경 적용')
+    assert.ok(buttons.indexOf(cancel) < buttons.indexOf(apply))
+    const cancelLabel = elements(cancel, node => node.type === 'span' && text(node) === '취소')[0]
+    assert.match(cancelLabel.props.className, /top-px leading-none/)
+    cancel.props.onClick()
+    assert.equal(cancelled, 'proposal')
+    const busyCancel = elements(renderAgent({ ...props, busy: true }), node => node.type === 'button' && text(node) === '취소')[0]
+    assert.equal(busyCancel.props.disabled, true)
+    tree = renderAgent({ ...props, messages: [proposal({ applyState: 'cancelled' })] })
+    buttons = elements(tree, node => node.type === 'button')
+    assert.equal(buttons.some(button => ['취소', '승인', '다시 적용', '변경 적용'].includes(text(button))), false)
+    assert.equal(buttons.find(button => text(button) === '취소됨').props.disabled, true)
+  })
+}
@@ -0,0 +1,123 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const api = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentPractice.ts'), 'utf8'), { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 } }).outputText, { exports: api, DOMException, setTimeout })
+const { AGENT_PRACTICE_PROFILES: profiles, inspectAgentPractice, verifyAgentPractice, prepareAgentPractice } = api
+const plain = value => JSON.parse(JSON.stringify(value))
+const profile = profiles.find(item => item.id === 'mkmini-2d')
+const modulesFor = p => p.modules.map((name, sortOrder) => ({ name, sortOrder, category: name.includes('MKMini') || name.includes('TurtleBot') || name === 'NAV2-Yahboom' ? 'Vehicle' : name.includes('Gazebo') ? 'Simulator' : name.includes('Perception') ? 'Sensing' : 'System', state: 'stopped', parameters: [`sim_mode:=${p.environment === 'local'}`, `platform:=${p.platform}`, `robot:=${p.platform}`, `level:=${p.level}`] }))
+const probeFor = (p, overrides = {}) => ({ id: 'probe', name: 'ros.inspect', status: 'ok', target: 'test:container', observedAt: new Date().toISOString(), truncated: false, data: JSON.stringify({ topics: p.topics.map(name => ({ name, publishers: 1, samples: 3, validSamples: 3, frameIds: name === p.topics[0] ? ['laser'] : [] })), tfEdges: [{ parent: 'map', child: 'odom' }, { parent: 'odom', child: 'base_footprint' }, { parent: 'base_footprint', child: 'base_link' }, { parent: 'base_link', child: 'laser' }], ...overrides }) })
+function scenario(overrides = {}) {
+  const modules = modulesFor(profile)
+  const starts = []
+  const controller = new AbortController()
+  const options = {
+    profileId: profile.id, environment: 'remote', signal: controller.signal,
+    approvedStarts: [...profile.modules],
+    list: async () => modules.map(module => ({ ...module, parameters: [...module.parameters] })),
+    start: async module => { starts.push(module.name); modules.find(item => item.name === module.name).state = 'running'; return true },
+    probe: async () => probeFor(profile), progress: () => {}, pause: async () => {}, ...overrides
+  }
+  return { modules, starts, controller, options }
+}
+
+test('SLAM profiles follow the module guide module sequences', () => {
+  const source = ts.createSourceFile('ModuleListView.tsx', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/ModuleListView.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+  let expression
+  const visit = node => { if (ts.isVariableDeclaration(node) && node.name.getText(source) === 'moduleGuidePages') expression = node.initializer.getText(source); ts.forEachChild(node, visit) }
+  visit(source)
+  const guide = {}
+  vm.runInNewContext(ts.transpileModule(`exports.pages = ${expression}`, { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 } }).outputText, { exports: guide })
+  for (const p of profiles) assert.ok(guide.pages.some(page => JSON.stringify(page.slamModules) === JSON.stringify(p.modules)))
+})
+
+test('preflight rejects wrong environments, missing modules, conflicting parameters and unrelated running modules', () => {
+  const modules = modulesFor(profile)
+  assert.equal(inspectAgentPractice(profile.id, modules, 'remote').canPrepare, true)
+  assert.equal(inspectAgentPractice(profile.id, modules, 'local').canPrepare, false)
+  assert.equal(inspectAgentPractice(profile.id, modules.slice(1), 'remote').canPrepare, false)
+  modules[0].parameters[0] = 'sim_mode:=true'
+  assert.match(inspectAgentPractice(profile.id, modules, 'remote').blockers.join(), /sim_mode/)
+  modules[0].parameters = []
+  assert.match(inspectAgentPractice(profile.id, modules, 'remote').blockers.join(), /sim_mode/)
+  const conflicting = [...modulesFor(profile), { name: 'NAV2-Control', category: 'Control', state: 'running', parameters: [] }]
+  assert.match(inspectAgentPractice(profile.id, conflicting, 'remote').blockers.join(), /NAV2-Control/)
+  assert.equal(inspectAgentPractice(profile.id, [...modulesFor(profile), { name: 'NAV2-Camera', category: 'Sensing', state: 'running', parameters: [] }], 'remote').canPrepare, true)
+})
+
+test('readiness requires observed sensor, odometry, map data and a connected TF chain', () => {
+  assert.equal(verifyAgentPractice(profile.id, probeFor(profile)).ready, true)
+  assert.equal(verifyAgentPractice(profile.id, probeFor(profile, { tfEdges: [] })).ready, false)
+  assert.equal(verifyAgentPractice(profile.id, probeFor(profile, { topics: profile.topics.map(name => ({ name, publishers: 1, samples: 0 })) })).ready, false)
+  assert.equal(verifyAgentPractice(profile.id, probeFor(profile, { tfEdges: [{ parent: 'map', child: 'odom' }, { parent: 'odom', child: 'base_link' }] })).ready, false)
+  assert.equal(verifyAgentPractice(profile.id, { ...probeFor(profile), status: 'error' }).ready, false)
+  assert.equal(verifyAgentPractice(profile.id, { ...probeFor(profile), truncated: true }).ready, false)
+  assert.equal(verifyAgentPractice(profile.id, { ...probeFor(profile), data: 'null' }).ready, false)
+})
+
+test('prepares only missing starts, in dependency order, and verifies in the SLAM container', async () => {
+  const s = scenario()
+  s.modules[0].state = 'running'
+  let observed
+  s.options.probe = async (module, topics) => { observed = { module: module.name, topics }; return probeFor(profile) }
+  const result = await prepareAgentPractice(s.options)
+  assert.equal(result.ready, true)
+  assert.deepEqual(s.starts, [...profile.modules].slice(1))
+  assert.equal(observed.module, 'NAV2-SLAM')
+  assert.ok(observed.topics.includes('/tf_static'))
+  assert.equal(result.steps[0].status, 'already-running')
+})
+
+test('a failed start stops subsequent starts and does not issue rollback stop commands', async () => {
+  const s = scenario()
+  s.options.start = async module => { s.starts.push(module.name); if (s.starts.length === 2) return false; s.modules[0].state = 'running'; return true }
+  const result = await prepareAgentPractice(s.options)
+  assert.equal(result.ready, false)
+  assert.deepEqual(s.starts, [...profile.modules].slice(0, 2))
+  assert.match(result.failures[0], /자동 종료하지/)
+})
+
+test('does not start modules that became stopped after approval', async () => {
+  const s = scenario({ approvedStarts: ['NAV2-SLAM'] })
+  await assert.rejects(prepareAgentPractice(s.options), /승인 이후/)
+  assert.equal(s.starts.length, 0)
+})
+
+test('does not start with changed parameters after approval', async () => {
+  const s = scenario()
+  s.options.approvedParameters = Object.fromEntries(s.modules.map(module => [module.name, [...module.parameters]]))
+  s.modules[0].parameters.push('custom_speed:=9')
+  await assert.rejects(prepareAgentPractice(s.options), /실행 파라미터가 바뀌/)
+  assert.equal(s.starts.length, 0)
+})
+
+test('cancellation during a start prevents any subsequent module start', async () => {
+  const s = scenario()
+  s.options.start = async module => { s.starts.push(module.name); s.controller.abort(); return true }
+  await assert.rejects(prepareAgentPractice(s.options), { name: 'AbortError' })
+  assert.equal(s.starts.length, 1)
+})
+
+test('verification retries are bounded and never report ready for publisher-only data', async () => {
+  const s = scenario()
+  let probes = 0
+  s.options.probe = async () => { probes++; return probeFor(profile, { topics: [] }) }
+  const result = await prepareAgentPractice(s.options)
+  assert.equal(result.ready, false)
+  assert.equal(probes, 3)
+  assert.equal(result.failures.length, 4)
+  assert.ok(result.failures.some(message => message.includes('센서 프레임')))
+})
+
+test('the common confirmation and apply-before-build guard are connected in the workspace', () => {
+  const source = fs.readFileSync(require.resolve('../src/renderer/src/App.tsx'), 'utf8')
+  assert.match(source, /<ConfirmStatusModal[\s\S]*?title="SLAM 실습 준비"/)
+  assert.match(source, /requiresAppliedChanges && message.applyState !== 'applied'/)
+  assert.match(source, /agent\.applyFiles\(/)
+  assert.match(source, /getDirtyModuleFiles\(change.moduleName\)/)
+  assert.match(source, /background: true, freshSlam: true/)
+  assert.match(source, /onResult: result =>/)
+})
@@ -0,0 +1,325 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+function compile(source, globals = {}) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(source, {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+  }).outputText, { exports, DOMException, Error, ...globals })
+  return exports
+}
+const evidenceApi = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentEvidence.ts'), 'utf8'))
+const context = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentContext.ts'), 'utf8'), {
+  require: name => { assert.equal(name, './agentEvidence'); return evidenceApi }
+})
+const conversation = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentConversationContext.ts'), 'utf8'))
+const source = ts.createSourceFile('useAiAgent.ts', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/useAiAgent.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+const hook = source.statements.find(node => ts.isFunctionDeclaration(node) && node.name?.text === 'useAiAgent')
+const functions = hook.body.statements.filter(node => ts.isVariableStatement(node) && ['requestPlan', 'stop'].includes(node.declarationList.declarations[0].name.getText(source)))
+const plain = value => JSON.parse(JSON.stringify(value))
+const response = (toolRequests = []) => ({ provider: 'QWEN', model: 'fixture', plan: { summary: '분석 완료', explanation: '최종 설명', requestedModules: [], requestedLogs: [], changes: [], commands: [], createModule: null, actionPlan: [], toolRequests } })
+const deferred = () => { let resolve; let reject; const promise = new Promise((yes, no) => { resolve = yes; reject = no }); return { promise, resolve, reject } }
+const tick = () => new Promise(resolve => setImmediate(resolve))
+const result = (extra = {}) => ({ id: 'tool', name: 'files.read', status: 'ok', target: 'fixture', observedAt: new Date().toISOString(), data: '{"exists":true,"complete":true,"content":"PRIVATE_SOURCE"}', truncated: false, ...extra })
+
+function harness(requestApi) {
+  const session = {}
+  let now = 1000
+  class Clock extends Date { static now() { return now } }
+  const state = { pending: false, activity: '', steps: [], messages: [], saved: [], notices: 0, requestStartedAt: null }
+  const messageStateRef = { current: { session, messages: [] } }
+  const selectedModel = { provider: 'QWEN', model: 'fixture', imagesEnabled: true }
+  const api = compile(functions.map(node => `export ${node.getText(source)}`).join('\n'), {
+    ...context, ...conversation, session, messageStateRef, AbortController, FormData,
+    Date: Clock,
+    courseId: 'course', weekNumber: 3, pending: false, historyLoading: false, statusLoading: false,
+    selectedModel,
+    status: { enabled: true, selectionSupported: true }, abortControllerRef: { current: null },
+    setPending: value => { state.pending = value },
+    setRequestStartedAt: value => { state.requestStartedAt = value },
+    setActivity: value => { state.activity = value },
+    setProgressSteps: value => { state.steps = typeof value === 'function' ? value(state.steps) : value },
+    updateMessages: update => { state.messages = update(state.messages); messageStateRef.current.messages = state.messages; state.saved.push(plain(state.messages)) },
+    onResponseRef: { current: () => { state.notices++ } }, requestApi
+  })
+  return { ...api, state, selectedModel, messageStateRef, advance: ms => { now += ms } }
+}
+
+test('shows and persists the question, pending state and timer before a slow module snapshot finishes', async () => {
+  const snapshot = deferred(), completion = deferred()
+  const bodies = []
+  let loads = 0
+  const h = harness((_, request) => { bodies.push(JSON.parse(request.body)); return completion.promise })
+  const running = h.requestPlan('원격 차량 속도 제한 위치', [], [], {
+    environment: 'remote', workspaceTarget: 'ssh:100.64.0.10', executeTool: async () => result(),
+    loadInitialContext: signal => { loads++; assert.equal(signal.aborted, false); return snapshot.promise }
+  })
+  assert.equal(h.state.messages[0].content, '원격 차량 속도 제한 위치')
+  assert.equal(h.state.saved[0][0].role, 'user')
+  assert.equal(h.state.pending, true)
+  assert.equal(h.state.requestStartedAt, 1000)
+  assert.equal(h.state.activity, '모듈 상태 조회 중')
+  assert.equal(bodies.length, 0)
+  await h.requestPlan('중복 전송', [], [], { loadInitialContext: () => { loads++; return snapshot.promise } })
+  assert.equal(loads, 1)
+  assert.equal(h.state.messages.length, 1)
+  h.advance(5000)
+  h.selectedModel.provider = 'OPENAI'
+  snapshot.resolve({ modules: [{ name: 'Control', state: 'running', parameters: ['sim_mode:=false'], files: [] }], runtimeLogs: [] })
+  await tick()
+  assert.equal(bodies.length, 1)
+  assert.equal(bodies[0].provider, 'QWEN')
+  assert.equal(bodies[0].modules[0].state, 'running')
+  assert.deepEqual(bodies[0].modules[0].parameters, ['sim_mode:=false'])
+  h.advance(2000)
+  completion.resolve(response())
+  await running
+  assert.equal(h.state.messages[1].durationMs, 7000)
+  assert.equal(h.state.pending, false)
+})
+
+for (const reject of [false, true]) test(`cancels during initial module lookup and ignores its late ${reject ? 'failure' : 'result'} without affecting a new request`, async () => {
+  const old = deferred(), next = deferred()
+  let calls = 0, signal
+  const h = harness(async () => { calls++; return response() })
+  const first = h.requestPlan('첫 질문', [], [], { loadInitialContext: current => { signal = current; return old.promise } })
+  h.stop()
+  assert.equal(signal.aborted, true)
+  assert.equal(h.state.pending, false)
+  const second = h.requestPlan('다음 질문', [], [], { loadInitialContext: () => next.promise })
+  if (reject) old.reject(Error('늦게 도착한 SSH 오류'))
+  else old.resolve({ modules: [], runtimeLogs: [] })
+  await first
+  assert.equal(calls, 0)
+  assert.equal(h.state.pending, true)
+  assert.equal(h.state.activity, '모듈 상태 조회 중')
+  assert.equal(h.state.messages.length, 2)
+  assert.equal(h.state.notices, 0)
+  next.resolve({ modules: [], runtimeLogs: [] })
+  await second
+  assert.equal(calls, 1)
+  assert.equal(h.state.messages.length, 3)
+})
+
+test('initial snapshot errors preserve the question and show a timed error without calling the model', async () => {
+  const snapshot = deferred()
+  let calls = 0
+  const h = harness(async () => { calls++; return response() })
+  const running = h.requestPlan('질문', [], [], { loadInitialContext: () => snapshot.promise })
+  h.advance(3000)
+  snapshot.reject(Error('원격 모듈 상태 조회 실패'))
+  await running
+  assert.equal(calls, 0)
+  assert.equal(h.state.messages[0].content, '질문')
+  assert.equal(h.state.messages[1].content, '원격 모듈 상태 조회 실패')
+  assert.equal(h.state.messages[1].durationMs, 3000)
+  assert.equal(h.state.pending, false)
+  assert.equal(h.state.requestStartedAt, null)
+  assert.equal(h.state.activity, '')
+})
+
+test('scope changes during initial snapshot loading suppress later API calls and errors', async () => {
+  const snapshot = deferred()
+  let calls = 0
+  const h = harness(async () => { calls++; return response() })
+  const running = h.requestPlan('이전 강좌 질문', [], [], { loadInitialContext: () => snapshot.promise })
+  h.messageStateRef.current.session = {}
+  snapshot.resolve({ modules: [], runtimeLogs: [] })
+  await running
+  assert.equal(calls, 0)
+  assert.equal(h.state.messages.length, 1)
+  assert.equal(h.state.notices, 0)
+})
+
+test('publishes completed stages immediately without persisting progress or adding model calls', async () => {
+  const first = deferred(), tool = deferred(), final = deferred()
+  let calls = 0
+  const h = harness(() => (++calls === 1 ? first.promise : final.promise))
+  const running = h.requestPlan('카메라 FPS 확인', [{ name: 'Camera', files: [] }], [], { executeTool: () => tool.promise })
+  assert.equal(h.state.pending, true)
+  assert.equal(h.state.requestStartedAt, 1000)
+  assert.equal(h.state.steps.length, 0)
+  first.resolve(response([{ id: 'read', name: 'files.read', moduleName: 'Camera', args: { path: 'config/camera.yaml' } }]))
+  await tick()
+  assert.deepEqual(plain(h.state.steps).map(step => step.kind), ['analysis'])
+  assert.match(h.state.activity, /files.read 조회 중/)
+  tool.resolve(result())
+  await tick()
+  assert.deepEqual(plain(h.state.steps).map(step => step.kind), ['analysis', 'tool'])
+  assert.equal(h.state.steps[1].path, 'config/camera.yaml')
+  assert.equal(JSON.stringify(h.state.steps).includes('PRIVATE_SOURCE'), false)
+  assert.equal(h.state.messages.length, 1)
+  assert.equal(h.state.saved.flat().some(message => message.progressSteps), false)
+  assert.equal(calls, 2)
+  h.advance(20_900)
+  final.resolve(response())
+  await running
+  assert.equal(h.state.steps.length, 0)
+  assert.equal(h.state.pending, false)
+  assert.equal(h.state.activity, '')
+  assert.equal(h.state.requestStartedAt, null)
+  assert.equal(h.state.messages.length, 2)
+  assert.equal(h.state.messages[1].plan.summary, '분석 완료')
+  assert.equal(h.state.messages[1].durationMs, 20_900)
+  assert.equal(h.state.saved.at(-1)[1].durationMs, 20_900)
+  assert.equal(h.state.notices, 1)
+})
+
+test('image uploads and every lookup round retain the original provider without uploading the image twice', async () => {
+  const bodies = []
+  let uploads = 0
+  const h = harness(async (path, request) => {
+    if (path.endsWith('/attachments/images')) {
+      uploads++
+      assert.equal(request.body.get('provider'), 'QWEN')
+      assert.equal(request.body.get('courseId'), 'course')
+      assert.equal(request.body.get('week'), '3')
+      assert.equal(request.body.get('file').name, 'screen.png')
+      return { token: 'image-reference', name: 'screen.png', url: 'https://images.test/screen.png' }
+    }
+    bodies.push(JSON.parse(request.body))
+    h.selectedModel.provider = 'OPENAI'
+    return bodies.length === 1
+      ? { ...response(), plan: { ...response().plan, requestedModules: ['Control'] } }
+      : response()
+  })
+  await h.requestPlan('이미지 확인', [{ name: 'Control', files: [] }], [], {
+    attachments: [{ kind: 'image', name: 'screen.png', file: new Blob(['fixture'], { type: 'image/png' }) }],
+    loadRequestedContext: async () => ({ modules: [{ name: 'Control', files: [{ path: 'config/control.yaml', content: 'speed: 0.3' }] }], runtimeLogs: [] })
+  })
+  assert.equal(uploads, 1)
+  assert.equal(bodies.length, 2)
+  assert.ok(bodies.every(body => body.provider === 'QWEN'))
+  assert.ok(bodies.every(body => body.imageTokens[0] === 'image-reference'))
+  assert.equal(h.state.messages.at(-1).model, 'fixture')
+})
+
+test('remote target and observed source ranges reach each provider request including finalization', async () => {
+  const bodies = []
+  const tool = { id: 'read', name: 'files.read', moduleName: 'Control', args: { path: 'config/car.yaml', startLine: 20, lineCount: 1 } }
+  const h = harness(async (_, request) => {
+    bodies.push(JSON.parse(request.body))
+    return bodies.length < 3 ? response([tool]) : response()
+  })
+  await h.requestPlan('속도 제한 코드 위치', [{ name: 'Control', state: 'running', parameters: ['sim_mode:=false'], files: [] }], [], {
+    environment: 'remote', workspaceTarget: 'ssh:100.64.0.10',
+    executeTool: async input => result({ id: input.id, moduleName: 'Control', target: 'ssh:100.64.0.10', truncated: true,
+      data: JSON.stringify({ path: 'config/car.yaml', exists: true, hash: 'a'.repeat(64), complete: false, content: 'max_speed: 0.4', startLine: 20, endLine: 20, contentTruncated: false, totalLines: 100 }) })
+  })
+  assert.equal(bodies.length, 3)
+  for (const body of bodies) {
+    assert.equal(body.environment, 'remote')
+    assert.equal(body.workspaceTarget, 'ssh:100.64.0.10')
+    assert.deepEqual(body.modules[0].parameters, ['sim_mode:=false'])
+  }
+  assert.equal(JSON.parse(bodies[1].toolResults[0].data).content, 'max_speed: 0.4')
+  assert.equal(JSON.parse(bodies[2].toolResults[0].data).endLine, 20)
+  assert.match(bodies[2].request, /자료 조회는 종료되었습니다/)
+})
+
+test('sends only prior same-workspace context and keeps it stable throughout tool lookups', async () => {
+  const bodies = []
+  const h = harness(async (_, request) => {
+    bodies.push(JSON.parse(request.body))
+    const reply = bodies.length === 2 ? response([{ id: 'read', name: 'files.read', moduleName: 'Control', args: { path: 'config.yaml' } }]) : response()
+    return { ...reply, plan: { ...reply.plan, conversationSummary: 'Control의 config.yaml 설명을 진행 중입니다.' } }
+  })
+  const options = { environment: 'local', workspaceTarget: 'local-host', workspaceRoot: '/workspace/a', executeTool: async () => result() }
+  await h.requestPlan('Control 설정 위치', [], [], options)
+  assert.equal(bodies[0].conversationContext, undefined)
+  await h.requestPlan('그 파일 설명해줘', [], [], options)
+  assert.equal(bodies.length, 3)
+  assert.equal(bodies[1].conversationContext.recentMessages[0].content, 'Control 설정 위치')
+  assert.equal(bodies[1].conversationContext.summary, 'Control의 config.yaml 설명을 진행 중입니다.')
+  assert.equal(h.state.saved[1][1].plan.conversationSummary, 'Control의 config.yaml 설명을 진행 중입니다.')
+  assert.equal(JSON.stringify(bodies[1].conversationContext).includes('그 파일 설명해줘'), false)
+  assert.deepEqual(bodies[1].conversationContext, bodies[2].conversationContext)
+  assert.equal(bodies[1].workspaceRoot, undefined)
+  await h.requestPlan('다른 원격 질문', [], [], { ...options, environment: 'remote', workspaceTarget: 'ssh:device' })
+  assert.equal(bodies.at(-1).conversationContext, undefined)
+  await h.requestPlan('다른 로컬 폴더', [], [], { ...options, workspaceRoot: '/workspace/b' })
+  assert.equal(bodies.at(-1).conversationContext, undefined)
+})
+
+test('errors replace temporary progress with the existing error reply', async () => {
+  let calls = 0
+  const h = harness(async () => {
+    if (++calls === 1) return response([{ id: 'read', name: 'files.read', moduleName: 'Camera', args: { path: 'config.yaml' } }])
+    throw Error('서버 오류')
+  })
+  await h.requestPlan('확인', [{ name: 'Camera', files: [] }], [], { executeTool: async () => result({ status: 'error' }) })
+  assert.equal(h.state.messages.at(-1).content, '서버 오류')
+  assert.equal(h.state.steps.length, 0)
+  assert.equal(h.state.pending, false)
+  assert.equal(h.state.requestStartedAt, null)
+})
+
+test('stopping clears progress and a late response cannot overwrite a newer request', async () => {
+  const old = deferred(), next = deferred()
+  let calls = 0
+  const h = harness(() => (++calls === 1 ? old.promise : next.promise))
+  const first = h.requestPlan('첫 질문', [], [])
+  h.stop()
+  assert.equal(h.state.requestStartedAt, null)
+  assert.equal(h.state.steps.length, 0)
+  assert.equal(h.state.activity, '')
+  const second = h.requestPlan('다음 질문', [], [])
+  old.resolve(response())
+  await first
+  assert.equal(h.state.pending, true)
+  assert.equal(h.state.messages.filter(message => message.role === 'assistant').length, 0)
+  next.resolve(response())
+  await second
+  assert.equal(h.state.pending, false)
+  assert.equal(h.state.steps.length, 0)
+  assert.equal(h.state.messages.filter(message => message.role === 'assistant').length, 1)
+})
+
+test('scope changes suppress late progress callbacks', async () => {
+  const tool = deferred()
+  const h = harness(async () => response([{ id: 'read', name: 'files.read', moduleName: 'Camera', args: { path: 'config.yaml' } }]))
+  const running = h.requestPlan('확인', [], [], { executeTool: () => tool.promise })
+  await tick()
+  h.messageStateRef.current.session = {}
+  const previous = h.state.steps.length
+  h.stop()
+  tool.resolve(result())
+  await running
+  assert.equal(previous, 1)
+  assert.equal(h.state.steps.length, 0)
+  assert.equal(h.state.notices, 0)
+})
+
+test('source context stages report missing and limited modules and empty logs honestly', async () => {
+  const steps = []
+  let calls = 0
+  await context.resolveAgentContext({
+    signal: new AbortController().signal,
+    initialContext: { modules: [{ name: 'Missing', files: [] }, { name: 'Limited', files: [] }], runtimeLogs: [] },
+    onStep: step => steps.push(step),
+    requestPlan: async () => ++calls === 1 ? { ...response(), plan: { ...response().plan, requestedModules: ['Missing', 'Limited'], requestedLogs: ['Missing'] } } : response(),
+    loadRequestedContext: async () => ({ modules: [{ name: 'Missing', files: [], fileContext: { status: 'uninstalled' } }, { name: 'Limited', files: [{ path: 'x', content: 'PRIVATE_SOURCE' }], fileContext: { status: 'limited' } }], runtimeLogs: [] })
+  })
+  assert.deepEqual(plain(steps).map(step => [step.kind, step.status]), [['analysis', 'ok'], ['files', 'missing'], ['files', 'partial'], ['logs', 'empty'], ['analysis', 'ok']])
+  assert.equal(JSON.stringify(steps).includes('PRIVATE_SOURCE'), false)
+})
+
+test('tool stages distinguish missing files, partial reads and counts without exposing raw output', async () => {
+  const steps = []
+  const tools = [
+    { id: 'missing', name: 'files.read', moduleName: 'Camera', args: { path: 'missing.yaml' } },
+    { id: 'partial', name: 'files.read', moduleName: 'Camera', args: { path: 'large.py' } },
+    { id: 'list', name: 'files.list', moduleName: 'Camera' },
+    { id: 'search', name: 'files.search', moduleName: 'Camera', args: { query: 'fps' } }
+  ]
+  let calls = 0
+  await context.resolveAgentContext({
+    signal: new AbortController().signal, initialContext: { modules: [], runtimeLogs: [] }, onStep: step => steps.push(step),
+    requestPlan: async () => response(++calls === 1 ? tools : []),
+    executeTool: async tool => result({ data: JSON.stringify(tool.args?.path === 'missing.yaml' ? { exists: false } : tool.args?.path === 'large.py' ? { complete: false } : tool.name === 'files.list' ? { paths: ['a', 'b'] } : { matches: [] }) })
+  })
+  assert.deepEqual(plain(steps.filter(step => step.kind === 'tool')).map(step => [step.status, step.count]), [['missing', undefined], ['partial', undefined], ['ok', 2], ['ok', 0]])
+})
@@ -0,0 +1,96 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const contextApi = {}
+const evidenceApi = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentEvidence.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: evidenceApi })
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentContext.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: contextApi, DOMException, require: name => { assert.equal(name, './agentEvidence'); return evidenceApi } })
+
+const source = ts.createSourceFile('useAiAgent.ts', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/useAiAgent.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+let payloadExpression
+function visit(node) {
+  if (ts.isCallExpression(node) && node.expression.getText(source) === 'JSON.stringify' && node.arguments[0]?.getText(source).includes('imageTokens')) {
+    payloadExpression = node.getText(source)
+  }
+  ts.forEachChild(node, visit)
+}
+visit(source)
+assert.ok(payloadExpression, 'Agent request JSON serialization must exist')
+
+test('user messages preserve only typed text while attachments remain separate metadata', () => {
+  let initializer
+  function find(node) {
+    if (ts.isVariableDeclaration(node) && node.name.getText(source) === 'userMessage') initializer = node.initializer.getText(source)
+    ts.forEachChild(node, find)
+  }
+  find(source)
+  assert.ok(initializer)
+  for (const request of ['이 이미지에서 슬램에 필요한 모듈만 골라봐', '첫 줄\n첨부 파일: 직접 입력한 내용']) {
+    const message = vm.runInNewContext(`(${initializer})`, { request, conversationScope: undefined, options: { attachments: [{ name: '스크린샷.png' }] } })
+    assert.equal(message.content, request)
+  }
+})
+
+function serialize(attachments, finalize = false, request = '설정 위치 알려줘', imageTokens = [], provider = 'QWEN') {
+  return JSON.parse(vm.runInNewContext(payloadExpression, {
+    courseId: 'course-1', weekNumber: 3, request, options: { attachments }, finalize,
+    textAttachments: attachments ?? [], imageTokens, conversationContext: undefined,
+    selection: provider ? { provider } : {},
+    agentPlanRequestText: contextApi.agentPlanRequestText,
+    context: { modules: [{ name: 'Control', files: [] }], runtimeLogs: [] }
+  }))
+}
+
+test('sends image reference tokens without image bytes or public URLs on every context round', () => {
+  const body = serialize(undefined, true, '이미지 분석', ['signed-image-token'])
+  assert.deepEqual(body.imageTokens, ['signed-image-token'])
+  assert.equal(Object.hasOwn(body, 'attachments'), false)
+  assert.equal(JSON.stringify(body).includes('base64'), false)
+})
+
+for (const attachments of [undefined, []]) {
+  test(`omits attachments when ${attachments ? 'empty' : 'undefined'}`, () => {
+    const body = serialize(attachments)
+    assert.equal(Object.hasOwn(body, 'attachments'), false)
+    assert.equal(body.request, '설정 위치 알려줘')
+    assert.equal(body.modules[0].name, 'Control')
+    assert.equal(body.week, 3)
+  })
+}
+
+test('preserves actual attachment contents rather than silently dropping them', () => {
+  const attachments = [{ name: 'config.yaml', content: 'steering: ackermann' }]
+  assert.deepEqual(serialize(attachments).attachments, attachments)
+})
+
+test('finalization instruction reaches the API without sending unsupported DTO fields', () => {
+  const body = serialize(undefined, true)
+  assert.match(body.request, /자료 조회는 종료/)
+  assert.match(body.request, /설정 위치 알려줘/)
+  assert.match(body.request, /최종 답변/)
+  assert.equal(Object.hasOwn(body, 'finalize'), false)
+  assert.deepEqual(Object.keys(body).sort(), ['courseId', 'modules', 'provider', 'request', 'runtimeLogs', 'week'])
+})
+
+test('finalization keeps the request within the backend 4000-character limit', () => {
+  const body = serialize(undefined, true, 'x'.repeat(4000))
+  assert.equal(body.request.length, 4000)
+  assert.match(body.request, /원래 학생 질문/)
+})
+
+test('sends only a provider selection rather than student-supplied models or keys', () => {
+  for (const finalize of [false, true]) {
+    const body = serialize(undefined, finalize, '확인', [], 'OPENAI')
+    assert.equal(body.provider, 'OPENAI')
+    assert.equal(Object.hasOwn(body, 'model'), false)
+    assert.equal(Object.hasOwn(body, 'apiKey'), false)
+    assert.equal(Object.hasOwn(body, 'endpointUrl'), false)
+  }
+  assert.equal(Object.hasOwn(serialize(undefined, false, '확인', [], null), 'provider'), false)
+})
@@ -0,0 +1,256 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function load(file, overrides = {}, globals = {}) {
+  const exports = {}
+  const source = fs.readFileSync(require.resolve(file), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX
+  } }).outputText
+  vm.runInNewContext(code, { exports, require: name => overrides[name] ?? require(name), ...globals })
+  return exports
+}
+
+const reveal = load('../src/renderer/src/components/agentResponseReveal.ts')
+const { createAgentRevealDocument, agentRevealFrame, AGENT_REVEAL_INTERVAL } = reveal
+const paragraph = 'MK-mini는 바퀴가 4개라도 전륜 조향 모델을 사용합니다.'
+const content = `${paragraph}\n\n1. 물리적 바퀴 수와 운동학 모델은 다릅니다.\n   - 앞바퀴로 조향합니다.\n2. 제어 설정을 확인합니다.\n\n마지막 설명입니다.`
+
+test('reveals paragraphs and complete list items at fixed intervals without splitting Korean sentences', () => {
+  const document = createAgentRevealDocument(content)
+  const first = agentRevealFrame(document, 1000, 1000)
+  assert.equal(first.content, paragraph)
+  assert.equal(first.complete, false)
+  const second = agentRevealFrame(document, 1000, 1000 + AGENT_REVEAL_INTERVAL)
+  assert.match(second.content, /1\. 물리적/)
+  assert.match(second.content, /앞바퀴로 조향합니다\./)
+  assert.doesNotMatch(second.content, /2\. 제어/)
+  const third = agentRevealFrame(document, 1000, 1000 + AGENT_REVEAL_INTERVAL * 2)
+  assert.match(third.content, /2\. 제어 설정을 확인합니다\./)
+  assert.doesNotMatch(third.content, /마지막 설명/)
+})
+
+test('keeps fenced code and GFM tables intact', () => {
+  const text = '설명입니다.\n\n```python\nprint("시작")\nprint("종료")\n```\n\n| 항목 | 값 |\n| --- | --- |\n| 조향 | 전륜 |'
+  const document = createAgentRevealDocument(text)
+  assert.equal(document.boundaries.length, 3)
+  const code = agentRevealFrame(document, 0, AGENT_REVEAL_INTERVAL).content
+  assert.equal((code.match(/```/g) ?? []).length, 2)
+  assert.match(code, /print\("종료"\)/)
+  assert.doesNotMatch(code, /\| 항목/)
+  assert.equal(agentRevealFrame(document, 0, AGENT_REVEAL_INTERVAL * 2).content, text)
+})
+
+test('reference link definitions are available before their position in the answer is revealed', () => {
+  const document = createAgentRevealDocument('[설명][guide]\n\n다음 문단\n\n[guide]: https://example.com/guide')
+  const first = agentRevealFrame(document, 0, 0)
+  assert.match(first.content, /\[guide\]: https:\/\/example.com\/guide/)
+  assert.doesNotMatch(first.content, /다음 문단/)
+})
+
+test('history, elapsed answers and reduced-motion users see the complete response immediately', () => {
+  const document = createAgentRevealDocument(content)
+  for (const frame of [agentRevealFrame(document, undefined, 0), agentRevealFrame(document, 0, 60_000), agentRevealFrame(document, 0, 0, true)]) {
+    assert.equal(frame.content, content)
+    assert.equal(frame.complete, true)
+    assert.equal(frame.fadeFrom, undefined)
+  }
+})
+
+test('long answers are grouped into at most twenty steps and finish within five seconds', () => {
+  const text = Array.from({ length: 100 }, (_, index) => `문단 ${index}입니다.`).join('\n\n')
+  const document = createAgentRevealDocument(text)
+  assert.ok(document.boundaries.length <= 20)
+  assert.ok(agentRevealFrame(document, 0, 0).duration < 5000)
+  assert.equal(agentRevealFrame(document, 0, 5000).content, text)
+})
+
+test('only the newly appended paragraph gets the fade class', () => {
+  const { MarkdownMessage } = load('../src/renderer/src/components/ChatWidgets.tsx', {
+    '../i18n': { t: key => key, useLocaleRender() {} }, './chatAttachments': {}, './ChatTextContextMenu': {}, './ChatImageAttachments': {}, './ChatCodeBlock': {}
+  })
+  const document = createAgentRevealDocument('첫 번째 문단입니다.\n\n두 번째 문단입니다.\n\n세 번째 문단입니다.')
+  const frame = agentRevealFrame(document, 0, AGENT_REVEAL_INTERVAL)
+  const html = renderToStaticMarkup(React.createElement(MarkdownMessage, { content: frame.content, fadeFrom: frame.fadeFrom, dark: true }))
+  assert.equal((html.match(/agent-response-fade/g) ?? []).length, 1)
+  assert.match(html, /첫 번째 문단/)
+  assert.match(html, /두 번째 문단/)
+  assert.doesNotMatch(html, /세 번째 문단/)
+})
+
+function renderResponse(message, now, reducedMotion = false, extra = {}) {
+  const MarkdownMessage = ({ content }) => React.createElement('p', null, content)
+  const { ProgressiveChatResponse } = load('../src/renderer/src/components/ProgressiveChatResponse.tsx', {
+    './ChatWidgets': { MarkdownMessage, ExpandableMarkdownMessage: MarkdownMessage }, './agentResponseReveal': reveal,
+    react: { ...React, useMemo: fn => fn(), useState: initial => [typeof initial === 'function' ? initial() : initial, () => {}], useEffect() {} }
+  }, { Date: { now: () => now }, window: { matchMedia: () => ({ matches: reducedMotion }) } })
+  return renderToStaticMarkup(ProgressiveChatResponse({ message, dark: true, children: React.createElement('button', null, '승인'), ...extra }))
+}
+
+test('internal cumulative memory is not rendered in the response bubble', () => {
+  const html = renderResponse({ content: '화면 답변', plan: { summary: '화면 요약', explanation: '화면 설명', conversationSummary: 'HIDDEN_CONVERSATION_MEMORY' } }, 0)
+  assert.match(html, /화면 설명/)
+  assert.doesNotMatch(html, /HIDDEN_CONVERSATION_MEMORY/)
+})
+
+test('managed agent responses display A-Copilot without an internal provider ID or duplicate model name', () => {
+  const html = renderResponse({ content: '분석 결과', provider: 'A_COPILOT', model: 'A-Copilot' }, 0)
+  assert.ok(html.includes('A-Copilot'))
+  assert.ok(!html.includes('A_COPILOT'))
+  assert.ok(!html.includes('A-Copilot · A-Copilot'))
+  assert.equal((html.match(/>A-Copilot<\/p>/g) ?? []).length, 1)
+  assert.ok(renderResponse({ content: '결과', provider: 'QWEN', model: 'qwen3.8-max' }, 0).includes('QWEN · qwen3.8-max'))
+})
+
+test('approval controls wait for the explanation; restored history does not replay', () => {
+  const message = { role: 'assistant', revealStartedAt: 1000, plan: { summary: '조향 설명', explanation: content }, provider: 'QWEN', model: 'test' }
+  const first = renderResponse(message, 1000)
+  assert.match(first, /조향 설명/)
+  assert.match(first, /aria-busy="true"/)
+  assert.doesNotMatch(first, /승인|QWEN/)
+  for (const html of [renderResponse(message, 10_000), renderResponse({ ...message, revealStartedAt: undefined }, 1000), renderResponse(message, 1000, true)]) {
+    assert.match(html, /aria-busy="false"/)
+    assert.match(html, /마지막 설명/)
+    assert.match(html, /승인/)
+    assert.match(html, /QWEN/)
+  }
+})
+
+test('reveal timing is not included in conversation persistence API payloads', () => {
+  const source = ts.createSourceFile('useAiAgent.ts', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/useAiAgent.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+  let expression
+  function visit(node) {
+    if (ts.isCallExpression(node) && node.expression.getText(source) === 'JSON.stringify' && node.arguments[0]?.getText(source).includes('messages: batch')) expression = node.getText(source)
+    ts.forEachChild(node, visit)
+  }
+  visit(source)
+  assert.ok(expression)
+  const batch = [{ id: '1', role: 'assistant', content: '전체 답변', revealStartedAt: 1000 }]
+  const payload = JSON.parse(vm.runInNewContext(expression, { batch, courseId: 'course', weekNumber: 1 }))
+  assert.equal(Object.hasOwn(payload.messages[0], 'revealStartedAt'), false)
+  assert.equal(payload.messages[0].content, '전체 답변')
+})
+
+test('animation honors reduced motion in CSS', () => {
+  const css = fs.readFileSync(require.resolve('../src/renderer/src/index.css'), 'utf8')
+  assert.match(css, /@keyframes agent-response-fade/)
+  assert.match(css, /prefers-reduced-motion: reduce[\s\S]*?\.agent-response-fade\s*\{\s*animation: none/)
+})
+
+function elements(root, predicate) {
+  if (!React.isValidElement(root)) return []
+  return [...(predicate(root) ? [root] : []), ...React.Children.toArray(root.props.children).flatMap(child => elements(child, predicate))]
+}
+
+test('agent answers use the shared collapse widget after reveal, without hiding action controls', () => {
+  const MarkdownMessage = () => null
+  const ExpandableMarkdownMessage = () => null
+  let now = 1000
+  const { ProgressiveChatResponse } = load('../src/renderer/src/components/ProgressiveChatResponse.tsx', {
+    './ChatWidgets': { MarkdownMessage, ExpandableMarkdownMessage }, './agentResponseReveal': reveal,
+    react: { ...React, useMemo: fn => fn(), useState: initial => [typeof initial === 'function' ? initial() : initial, () => {}], useEffect() {} }
+  }, { Date: { now: () => now }, window: { matchMedia: () => ({ matches: false }) } })
+  const message = { role: 'assistant', revealStartedAt: 1000, plan: { summary: '요약', explanation: '상세 내용입니다.\n\n'.repeat(60) } }
+  const render = (extra = {}) => ProgressiveChatResponse({ message, dark: true, children: React.createElement('button', null, '승인'), ...extra })
+  assert.equal(elements(render(), node => node.type === ExpandableMarkdownMessage).length, 0)
+  now = 10_000
+  const fresh = render()
+  assert.equal(elements(fresh, node => node.type === ExpandableMarkdownMessage)[0].props.defaultCollapsed, false)
+  assert.equal(elements(fresh, node => node.type === 'button').length, 1)
+  const history = render({ message: { ...message, revealStartedAt: undefined }, collapseOnSignal: true, collapseSignal: 4 })
+  const widget = elements(history, node => node.type === ExpandableMarkdownMessage)[0]
+  assert.equal(widget.props.defaultCollapsed, true)
+  assert.equal(widget.props.collapseOnSignal, true)
+  assert.equal(widget.props.collapseSignal, 4)
+  assert.equal(elements(history, node => node.type === 'button').length, 1)
+})
+
+for (const dark of [false, true]) {
+  test(`shared answer can expand and collapse while preserving full source text (${dark ? 'dark' : 'light'})`, () => {
+    let expanded
+    const { ExpandableMarkdownMessage, MarkdownMessage } = load('../src/renderer/src/components/ChatWidgets.tsx', {
+      '../i18n': { t: key => key, useLocaleRender() {} }, './chatAttachments': {}, './ChatTextContextMenu': {}, './ChatImageAttachments': {}, './ChatCodeBlock': {},
+      react: { ...React, useEffect() {}, useState(initial) {
+        if (expanded === undefined) expanded = initial
+        return [expanded, update => { expanded = typeof update === 'function' ? update(expanded) : update }]
+      } }
+    })
+    const content = '파일과 파라미터에 대한 상세 설명입니다.\n'.repeat(50)
+    const render = () => ExpandableMarkdownMessage({ content, dark, defaultCollapsed: true })
+    let tree = render()
+    let button = elements(tree, node => node.type === 'button')[0]
+    assert.equal(button.props['aria-label'], '자세히 보기')
+    assert.ok(elements(tree, node => node.type === MarkdownMessage)[0].props.content.length < content.length)
+    button.props.onClick()
+    tree = render()
+    button = elements(tree, node => node.type === 'button')[0]
+    assert.equal(button.props['aria-label'], '접기')
+    assert.equal(elements(tree, node => node.type === MarkdownMessage)[0].props.content, content)
+    button.props.onClick()
+    assert.equal(elements(render(), node => node.type === 'button')[0].props['aria-label'], '자세히 보기')
+  })
+}
+
+test('short answers do not show an unnecessary collapse button', () => {
+  const { ExpandableMarkdownMessage } = load('../src/renderer/src/components/ChatWidgets.tsx', {
+    '../i18n': { t: key => key, useLocaleRender() {} }, './chatAttachments': {}, './ChatTextContextMenu': {}, './ChatImageAttachments': {}, './ChatCodeBlock': {},
+    react: { ...React, useEffect() {}, useState: initial => [initial, () => {}] }
+  })
+  const tree = ExpandableMarkdownMessage({ content: '짧은 답변입니다.', dark: true, defaultCollapsed: true })
+  assert.equal(elements(tree, node => node.type === 'button').length, 0)
+})
+
+for (const dark of [false, true]) {
+  test(`model label and copy action share the last row after the operation controls (${dark ? 'dark' : 'light'})`, () => {
+    const html = renderResponse({ content: '전체 답변', provider: 'QWEN', model: 'qwen-model-name'.repeat(8) }, 1000, false, {
+      dark,
+      footerAction: React.createElement('button', { title: '복사', className: 'copy-action' }, 'Copy')
+    })
+    assert.match(html, /class="order-10 flex min-h-6 min-w-0 items-center justify-between gap-2"><p[^>]*class="min-w-0 flex-1 truncate[^>]*>QWEN[^<]*<\/p><button title="복사"/)
+    assert.ok(html.indexOf('승인') < html.indexOf('QWEN'))
+  })
+}
+
+test('copy footer remains available when the message has no model metadata', () => {
+  const html = renderResponse({ content: '오류 안내' }, 1000, false, {
+    footerAction: React.createElement('button', { title: '복사' }, 'Copy')
+  })
+  assert.match(html, /min-h-6/)
+  assert.match(html, /title="복사"/)
+})
+
+test('reply copy is an inline fixed-size hover button and still copies the full response', async () => {
+  const source = ts.createSourceFile('WorkspaceQaPanel.tsx', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/WorkspaceQaPanel.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+  const declaration = source.statements.find(node => ts.isFunctionDeclaration(node) && node.name?.text === 'MessageCopyButton')
+  let copied = false
+  let clipboardText
+  const { MessageCopyButton } = compileCopy(declaration.getText(source))
+  function compileCopy(text) {
+    const code = ts.transpileModule(`export ${text}`, { compilerOptions: {
+      module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX
+    } }).outputText
+    const exports = {}
+    vm.runInNewContext(code, {
+      exports, require,
+      useState: () => [copied, value => { copied = value }], t: key => key,
+      Check: () => null, Copy: () => null,
+      navigator: { clipboard: { writeText: async text => { clipboardText = text } } },
+      window: { setTimeout() {} }
+    })
+    return exports
+  }
+  const content = '# 요약\n\n전체 답변입니다.'
+  const button = MessageCopyButton({ content, dark: true })
+  assert.match(button.props.className, /opacity-0.*group-hover:opacity-100/)
+  assert.match(button.props.className, /shrink-0 cursor-pointer/)
+  assert.doesNotMatch(button.props.className, /absolute|bottom-|right-/)
+  button.props.onClick()
+  await Promise.resolve()
+  assert.equal(clipboardText, content)
+  assert.equal(MessageCopyButton({ content, dark: true }).props.title, '복사됨')
+})
@@ -0,0 +1,139 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+const exportsObject = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/agentSessionSync.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: exportsObject, console: { warn() {} } })
+const { createAgentSessionSync } = exportsObject
+const message = (id, content = id) => ({ id, role: 'assistant', content })
+const plain = value => JSON.parse(JSON.stringify(value))
+const deferred = () => {
+  let resolve
+  const promise = new Promise(done => { resolve = done })
+  return { promise, resolve }
+}
+const storage = () => {
+  const data = new Map()
+  return {
+    getItem: key => data.get(key) ?? null,
+    setItem: (key, value) => data.set(key, value),
+    removeItem: key => data.delete(key)
+  }
+}
+
+test('saves replies in order and preserves a newer result arriving during an active save', async () => {
+  const gate = deferred()
+  const calls = []
+  const sync = createAgentSessionSync({ storageKey: 'test', save: async batch => {
+    calls.push(plain(batch))
+    if (calls.length === 1) await gate.promise
+  } })
+  sync.enqueue([message('command', 'running')])
+  await Promise.resolve()
+  sync.enqueue([message('command', 'completed'), message('answer')])
+  assert.equal(calls.length, 1)
+  gate.resolve()
+  await sync.flush()
+  assert.equal(calls.length, 2)
+  assert.deepEqual(calls[1], [message('command', 'completed'), message('answer')])
+})
+
+test('keeps a reply cached before network completion and after failed persistence', async () => {
+  const disk = storage()
+  const sync = createAgentSessionSync({ storage: disk, storageKey: 'student-a', save: async () => { throw Error('offline') } })
+  sync.enqueue([message('answer')])
+  assert.deepEqual(JSON.parse(disk.getItem('student-a')), [message('answer')])
+  await sync.flush()
+  assert.ok(sync.getError())
+  const batches = []
+  const reopened = createAgentSessionSync({ storage: disk, storageKey: 'student-a', save: async batch => { batches.push(plain(batch)) } })
+  assert.deepEqual(plain(reopened.restore([{ id: 'question', role: 'user', content: '?' }])), [
+    { id: 'question', role: 'user', content: '?' }, message('answer')
+  ])
+  await reopened.flush()
+  assert.deepEqual(batches, [[message('answer')]])
+  assert.equal(disk.getItem('student-a'), null)
+  assert.equal(reopened.getError(), null)
+})
+
+test('does not overwrite a new reply with an older history response', async () => {
+  const sync = createAgentSessionSync({ storageKey: 'test', save: async () => {} })
+  sync.enqueue([message('answer', 'new answer')])
+  await sync.flush()
+  assert.deepEqual(plain(sync.restore([message('answer', 'old answer')])), [message('answer', 'new answer')])
+})
+
+test('saves only modified messages even when restored history exceeds 100 messages', async () => {
+  const batches = []
+  const sync = createAgentSessionSync({ storageKey: 'test', save: async batch => { batches.push(plain(batch)) } })
+  const history = Array.from({ length: 150 }, (_, index) => message(`message-${index}`))
+  sync.restore(history)
+  sync.enqueue([...history, message('new-answer')])
+  await sync.flush()
+  assert.deepEqual(batches, [[message('new-answer')]])
+})
+
+test('chunks a large backlog below the server message-count limit', async () => {
+  const batches = []
+  const sync = createAgentSessionSync({ storageKey: 'test', save: async batch => { batches.push(plain(batch)) } })
+  sync.enqueue(Array.from({ length: 205 }, (_, index) => message(`message-${index}`)))
+  await sync.flush()
+  assert.deepEqual(batches.map(batch => batch.length), [100, 100, 5])
+  assert.equal(new Set(batches.flat().map(item => item.id)).size, 205)
+})
+
+test('leaving the view does not cancel an accepted write', async () => {
+  const gate = deferred()
+  const disk = storage()
+  let saved = false
+  const sync = createAgentSessionSync({ storage: disk, storageKey: 'test', save: async () => { await gate.promise; saved = true } })
+  const unsubscribe = sync.subscribe(() => {})
+  sync.enqueue([message('answer')])
+  unsubscribe()
+  gate.resolve()
+  await sync.flush()
+  assert.equal(saved, true)
+  assert.equal(disk.getItem('test'), null)
+})
+
+test('archives after outstanding writes complete and clears cached replies', async () => {
+  const gate = deferred()
+  const order = []
+  const disk = storage()
+  const sync = createAgentSessionSync({ storage: disk, storageKey: 'test', save: async () => { await gate.promise; order.push('saved') } })
+  sync.enqueue([message('answer')])
+  const clearing = sync.clear(async () => { order.push('archived') })
+  gate.resolve()
+  await clearing
+  assert.deepEqual(order, ['saved', 'archived'])
+  assert.deepEqual(plain(sync.restore([])), [])
+  assert.equal(disk.getItem('test'), null)
+})
+
+test('pending replies stay isolated by student and course scope', async () => {
+  const disk = storage()
+  const first = createAgentSessionSync({ storage: disk, storageKey: 'student-a:course-1', save: async () => { throw Error('offline') } })
+  first.enqueue([message('private-answer')])
+  await first.flush()
+  const second = createAgentSessionSync({ storage: disk, storageKey: 'student-b:course-1', save: async () => {} })
+  assert.deepEqual(plain(second.restore([])), [])
+})
+
+test('late command updates cannot recreate a conversation while it is being cleared', async () => {
+  const archive = deferred()
+  const calls = []
+  const sync = createAgentSessionSync({ storageKey: 'test', save: async batch => { calls.push(plain(batch)) } })
+  sync.enqueue([message('answer')])
+  await sync.flush()
+  const clearing = sync.clear(() => archive.promise)
+  sync.enqueue([message('answer', 'late command result')])
+  archive.resolve()
+  await clearing
+  await sync.flush()
+  assert.equal(calls.length, 1)
+  assert.deepEqual(plain(sync.restore([])), [])
+})
@@ -0,0 +1,222 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs/promises')
+const path = require('node:path')
+const os = require('node:os')
+const { spawnSync } = require('node:child_process')
+const ts = require('typescript')
+require.extensions['.ts'] = (module, filename) => module._compile(ts.transpileModule(require('node:fs').readFileSync(filename, 'utf8'), { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, esModuleInterop: true } }).outputText, filename)
+const { validateAgentTool, validateAgentOperation, safeAgentPath } = require('../src/shared/agentTools.ts')
+const { runAgentFileTool, applyAgentFiles, agentFileHash } = require('../src/main/agentFileTools.ts')
+const { agentRemoteFilesScript } = require('../src/main/agentRemoteFiles.ts')
+const { inspectAgentRuntime, agentRosProbePython } = require('../src/main/agentRuntimeTools.ts')
+const { resolveAgentContext } = require('../src/renderer/src/features/workspace/agentContext.ts')
+const plain = value => JSON.parse(JSON.stringify(value))
+const request = (name, args = {}) => ({ id: 'query-1', name, moduleName: 'NAV2-MKMini', args })
+function remote(input) {
+  const result = spawnSync('bash', ['--noprofile', '--norc', '-s'], { input: agentRemoteFilesScript(input), encoding: 'utf8', maxBuffer: 4_000_000, timeout: 10_000 })
+  if (result.error || result.status !== 0) throw new Error(result.stderr || result.error?.message)
+  return JSON.parse(result.stdout)
+}
+async function fixture(t) {
+  const root = await fs.mkdtemp(path.join(os.tmpdir(), 'lms-agent-tools-'))
+  t.after(() => fs.rm(root, { recursive: true, force: true }))
+  await fs.mkdir(path.join(root, 'config'))
+  await fs.writeFile(path.join(root, 'config', 'sensor.yaml'), 'host_ip: 192.168.2.88\n조향: ackermann\n')
+  await fs.writeFile(path.join(root, 'CMakeLists.txt'), 'project(vehicle)\n')
+  return root
+}
+
+test('tool requests reject writes, extra shell arguments, unsafe paths and unbounded observations', () => {
+  for (const name of ['shell', 'files.write', 'network.set', 'ros.publish']) assert.throws(() => validateAgentTool(request(name)))
+  for (const name of ['files.list', 'files.read', 'files.search']) {
+    for (const p of ['../secret', '/etc/passwd', '.env', 'config/.env', 'build/secret.py', 'config/id_rsa', 'config/key.pem', 'config\\x.py', 'a//b']) assert.throws(() => validateAgentTool(request(name, { path: p, ...(name === 'files.search' ? { query: 'ip' } : {}) })))
+  }
+  assert.throws(() => validateAgentTool(request('network.inspect', { command: 'ip addr replace' })))
+  assert.throws(() => validateAgentTool(request('ros.inspect', { topics: ['/scan; reboot'] })))
+  assert.throws(() => validateAgentTool(request('files.read', { path: 'a.py', lineCount: 401 })))
+  assert.throws(() => validateAgentOperation({ name: 'modules.stop' }))
+  assert.throws(() => validateAgentOperation({ name: 'practice.prepare', profile: 'guess' }))
+  assert.equal(validateAgentOperation({ name: 'practice.prepare', profile: 'mkmini-3d' }).name, 'practice.prepare')
+  assert.equal(safeAgentPath('src/launch/vehicle.launch.py'), 'src/launch/vehicle.launch.py')
+})
+
+for (const backend of ['local', 'remote']) {
+  const read = async (root, tool) => backend === 'local' ? runAgentFileTool(root, validateAgentTool(tool)) : remote({ root, request: validateAgentTool(tool) })
+  const apply = changes => backend === 'local' ? applyAgentFiles(changes) : Promise.resolve().then(() => remote({ changes }))
+  test(`${backend}: lists and searches sources without hidden, generated or symlinked data`, async t => {
+    const root = await fixture(t)
+    await fs.writeFile(path.join(root, '.env'), 'host_ip: PRIVATE')
+    await fs.mkdir(path.join(root, 'build'))
+    await fs.writeFile(path.join(root, 'build', 'generated.yaml'), 'host_ip: PRIVATE')
+    await fs.symlink('/etc/passwd', path.join(root, 'config', 'outside.txt'))
+    const listing = await read(root, request('files.list'))
+    assert.deepEqual([...listing.data.paths].sort(), ['CMakeLists.txt', 'config/sensor.yaml'])
+    const search = await read(root, request('files.search', { query: 'HOST_IP' }))
+    assert.equal(search.data.matches.length, 1)
+    assert.equal(search.data.matches[0].path, 'config/sensor.yaml')
+    assert.equal(search.data.matches[0].line, 1)
+    await assert.rejects(read(root, request('files.read', { path: 'config/outside.txt' })))
+  })
+  test(`${backend}: full file reads include a reproducible hash, partial and missing reads are explicit`, async t => {
+    const root = await fixture(t)
+    const full = await read(root, request('files.read', { path: 'config/sensor.yaml' }))
+    assert.equal(full.data.hash, agentFileHash(await fs.readFile(path.join(root, 'config/sensor.yaml'), 'utf8')))
+    assert.equal(full.data.complete, true)
+    const rangedFull = await read(root, request('files.read', { path: 'config/sensor.yaml', startLine: 1, lineCount: 200 }))
+    assert.equal(rangedFull.data.complete, true)
+    assert.equal(rangedFull.truncated, false)
+    assert.equal(rangedFull.data.endLine, 3)
+    assert.equal(rangedFull.data.contentTruncated, false)
+    const partial = await read(root, request('files.read', { path: 'config/sensor.yaml', startLine: 2, lineCount: 1 }))
+    assert.equal(partial.data.content, '조향: ackermann')
+    assert.equal(partial.data.complete, false)
+    assert.equal(partial.truncated, true)
+    assert.equal(partial.data.endLine, 2)
+    assert.equal(partial.data.contentTruncated, false)
+    const missing = await read(root, request('files.read', { path: 'config/new.yaml' }))
+    assert.equal(missing.data.exists, false)
+    assert.equal(missing.data.hash, null)
+    await assert.rejects(read(root, request('files.read', { path: 'missing/new.yaml' })))
+  })
+  test(`${backend}: character truncation never advertises a cut line as fully observed`, async t => {
+    const root = await fixture(t)
+    await fs.writeFile(path.join(root, 'config/long.yaml'), `first: true\n${'x'.repeat(40_000)}\nlast: true`)
+    const readout = await read(root, request('files.read', { path: 'config/long.yaml', startLine: 1, lineCount: 3 }))
+    assert.equal(readout.data.complete, false)
+    assert.equal(readout.data.contentTruncated, true)
+    assert.equal(readout.data.endLine, 1)
+  })
+  test(`${backend}: a scoped search does not consume its budget in unrelated source trees`, async t => {
+    const root = await fixture(t)
+    await fs.mkdir(path.join(root, 'code'))
+    for (let i = 0; i < 5; i++) await fs.writeFile(path.join(root, 'code', `large${i}.py`), 'x'.repeat(900_000))
+    const result = await read(root, request('files.search', { query: 'host_ip', path: 'config' }))
+    assert.equal(result.truncated, false)
+    assert.equal(result.data.matches[0].path, 'config/sensor.yaml')
+  })
+  test(`${backend}: validates every original before changing any file and preserves permissions`, async t => {
+    const root = await fixture(t)
+    const original = await fs.readFile(path.join(root, 'config/sensor.yaml'), 'utf8')
+    const first = { root, moduleName: 'NAV2-MKMini', path: 'config/sensor.yaml', content: 'host_ip: 192.168.1.88\n', expectedHash: agentFileHash(original) }
+    const stale = { root, moduleName: 'NAV2-MKMini', path: 'CMakeLists.txt', content: 'changed', expectedHash: '0'.repeat(64) }
+    await assert.rejects(apply([first, stale]))
+    assert.equal(await fs.readFile(path.join(root, first.path), 'utf8'), original)
+    await fs.chmod(path.join(root, first.path), 0o664)
+    await apply([first, { root, moduleName: 'NAV2-MKMini', path: 'config/new.yaml', content: 'created: true', expectedHash: null }])
+    assert.equal(await fs.readFile(path.join(root, first.path), 'utf8'), first.content)
+    assert.equal((await fs.stat(path.join(root, first.path))).mode & 0o777, 0o664)
+    assert.equal(await fs.readFile(path.join(root, 'config/new.yaml'), 'utf8'), 'created: true')
+    await assert.rejects(apply([first]))
+  })
+}
+
+test('remote batch streams large content rather than putting it into command arguments', async t => {
+  const root = await fixture(t)
+  const content = 'large YAML value '.repeat(11_000)
+  remote({ changes: [{ root, moduleName: 'NAV2-MKMini', path: 'config/large.yaml', expectedHash: null, content }] })
+  assert.equal(await fs.readFile(path.join(root, 'config/large.yaml'), 'utf8'), content)
+})
+
+test('local batch rolls back earlier replacements if a later replacement fails', async t => {
+  const root = await fixture(t)
+  const rename = fs.rename
+  let calls = 0
+  fs.rename = async (...args) => { if (++calls === 2) throw new Error('injected rename error'); return rename(...args) }
+  try {
+    await assert.rejects(applyAgentFiles([
+      { root, moduleName: 'M', path: 'config/new.yaml', expectedHash: null, content: 'new' },
+      { root, moduleName: 'M', path: 'CMakeLists.txt', expectedHash: agentFileHash('project(vehicle)\n'), content: 'changed' }
+    ]), /injected/)
+    await assert.rejects(fs.stat(path.join(root, 'config/new.yaml')), { code: 'ENOENT' })
+    assert.equal(await fs.readFile(path.join(root, 'CMakeLists.txt'), 'utf8'), 'project(vehicle)\n')
+  } finally { fs.rename = rename }
+})
+
+test('network inspection keeps real host and container observations separate', async () => {
+  const calls = []
+  const result = await inspectAgentRuntime(request('network.inspect'), async (executable, args) => { calls.push([executable, args]); return '[{"ifname":"eth0"}]' }, async command => { calls.push(command); throw new Error('container is stopped') })
+  assert.equal(result.host.interfaces[0].ifname, 'eth0')
+  assert.match(result.container.error, /stopped/)
+  assert.equal(calls[0][0], 'ip')
+  assert.equal(calls[1][0], 'ip')
+  assert.equal(calls[2], 'ip -j address show')
+})
+
+test('ROS probe samples retained maps with matching QoS and distinguishes empty sensor payloads', () => {
+  const preamble = String.raw`
+import sys, types, time
+NS = types.SimpleNamespace
+tick = [0]
+def monotonic():
+    tick[0] += 1
+    return tick[0]
+time.monotonic = monotonic
+class Node:
+    def get_topic_names_and_types(self):
+        return [(topic, ['test/Message']) for topic in ['/map', '/scan', '/tf_static']]
+    def get_publishers_info_by_topic(self, topic):
+        return [NS(qos_profile=NS(durability='retained' if topic in ['/map', '/tf_static'] else 'volatile'))]
+    def create_subscription(self, message_type, topic, callback, qos):
+        if topic in ['/map', '/tf_static'] and qos.durability != 'retained':
+            raise ValueError('wrong durability')
+        if topic == '/map':
+            callback(NS(info=NS(width=10, height=10), data=[]))
+        elif topic == '/scan':
+            callback(NS(ranges=[1, 2, 3]))
+        else:
+            callback(NS(transforms=[NS(header=NS(frame_id='map'), child_frame_id='odom')]))
+        return object()
+    def count_publishers(self, topic):
+        return 1
+    def get_node_names(self):
+        return ['probe']
+    def destroy_node(self):
+        pass
+sys.modules['rclpy'] = NS(init=lambda **kw: None, create_node=lambda name: Node(), spin_once=lambda *a, **kw: None, shutdown=lambda: None)
+sys.modules['rclpy.qos'] = NS(QoSProfile=lambda **kw: NS(**kw), ReliabilityPolicy=NS(BEST_EFFORT='best-effort'), DurabilityPolicy=NS(TRANSIENT_LOCAL='retained', VOLATILE='volatile'))
+sys.modules['rosidl_runtime_py'] = types.ModuleType('rosidl_runtime_py')
+sys.modules['rosidl_runtime_py.utilities'] = NS(get_message=lambda name: object)
+`
+  const run = spawnSync('python3', ['-c', `${preamble}\nexec(${JSON.stringify(agentRosProbePython)})`, Buffer.from(JSON.stringify(['/map', '/scan', '/tf_static'])).toString('base64')], { encoding: 'utf8', timeout: 5000 })
+  assert.equal(run.status, 0, run.stderr)
+  const data = JSON.parse(run.stdout)
+  assert.equal(data.topics.find(topic => topic.name === '/map').samples, 1)
+  assert.equal(data.topics.find(topic => topic.name === '/map').validSamples, 0)
+  assert.equal(data.topics.find(topic => topic.name === '/scan').validSamples, 1)
+  assert.deepEqual(data.tfEdges, [{ parent: 'map', child: 'odom' }])
+})
+
+test('restoring an interrupted action does not leave history permanently running', () => {
+  const { recoverInterruptedAgentMessages } = require('../src/renderer/src/features/workspace/agentContext.ts')
+  const messages = [{ id: 'reply', role: 'assistant', content: 'result', applyState: 'applying', commandExecutions: { start: { status: 'running', output: 'started one module' }, build: { status: 'completed' } } }]
+  const restored = recoverInterruptedAgentMessages(messages)
+  assert.equal(restored[0].applyState, 'error')
+  assert.equal(restored[0].commandExecutions.start.status, 'failed')
+  assert.equal(restored[0].commandExecutions.start.output, 'started one module')
+  assert.equal(restored[0].commandExecutions.build.status, 'completed')
+  assert.equal(messages[0].commandExecutions.start.status, 'running')
+})
+
+test('tool loop sends actual evidence, deduplicates requests despite new IDs and never runs actions', async () => {
+  let calls = 0
+  const executed = []
+  const result = await resolveAgentContext({
+    initialContext: { modules: [], runtimeLogs: [] }, signal: new AbortController().signal,
+    executeTool: async tool => { executed.push(tool); return { id: tool.id, name: tool.name, status: 'ok', target: 'test', observedAt: new Date().toISOString(), data: '{"paths":["config/a.yaml"]}', truncated: false } },
+    requestPlan: async (context, finalize) => {
+      calls++
+      if (calls === 2) assert.equal(context.toolResults.length, 1)
+      return { provider: 'test', model: 'test', plan: { summary: 'result', explanation: 'explanation', requestedModules: [], requestedLogs: [], actionPlan: [], commands: finalize ? [{ operation: { name: 'modules.start' } }] : [], changes: [], createModule: null, toolRequests: [request('files.list', {})] } }
+    }
+  })
+  assert.equal(executed.length, 1)
+  assert.equal(calls, 3)
+  assert.deepEqual(plain(result.plan.commands), [])
+  assert.deepEqual(plain(result.plan.toolRequests), [])
+  assert.match(result.plan.explanation, /files.list: ok/)
+})
+
+test('backend and desktop share exactly the same tool validation contract', async () => {
+  assert.equal(await fs.readFile(path.resolve(__dirname, '../../lms-be/src/ai/agent-tools.ts'), 'utf8'), await fs.readFile(path.resolve(__dirname, '../src/shared/agentTools.ts'), 'utf8'))
+})
@@ -0,0 +1,87 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function harness(initialNow = 1000) {
+  let now = initialNow, state, effect, interval, cleared = 0
+  const windowEvents = new Map(), documentEvents = new Map()
+  class Clock extends Date { static now() { return now } }
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/components/AgentWorkDuration.tsx'), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText, {
+    exports, Date: Clock,
+    window: {
+      setInterval(callback, delay) { assert.equal(delay, 1000); interval = callback; return 7 },
+      clearInterval(id) { assert.equal(id, 7); interval = undefined; cleared++ },
+      addEventListener: (name, callback) => windowEvents.set(name, callback),
+      removeEventListener: name => windowEvents.delete(name)
+    },
+    document: {
+      addEventListener: (name, callback) => documentEvents.set(name, callback),
+      removeEventListener: name => documentEvents.delete(name)
+    },
+    require(name) {
+      if (name === '../i18n') return { t: (key, values) => key.replace(/\{\{seconds\}\}/g, values.seconds), useLocaleRender() {} }
+      if (name === 'react') return { ...React,
+        useState(initial) { state ??= typeof initial === 'function' ? initial() : initial; return [state, value => { state = value }] },
+        useEffect(callback) { effect = callback }
+      }
+      return require(name)
+    }
+  })
+  return {
+    render: props => renderToStaticMarkup(exports.AgentWorkDuration({ dark: true, ...props })),
+    mount: () => effect(), advance: ms => { now += ms }, tick: () => interval?.(),
+    visible: () => documentEvents.get('visibilitychange')?.(), focus: () => windowEvents.get('focus')?.(),
+    interval: () => interval, cleared: () => cleared,
+    listeners: () => windowEvents.size + documentEvents.size
+  }
+}
+
+test('running duration is based on start time, not the number of interval ticks', () => {
+  const h = harness()
+  assert.match(h.render({ startedAt: 1000 }), /0초 동안 작업 중입니다/)
+  const cleanup = h.mount()
+  h.advance(12_900)
+  h.tick()
+  assert.match(h.render({ startedAt: 1000 }), /12초 동안 작업 중입니다/)
+  h.advance(60_000)
+  h.visible()
+  assert.match(h.render({ startedAt: 1000 }), /72초 동안 작업 중입니다/)
+  h.advance(5_000)
+  h.focus()
+  assert.match(h.render({ startedAt: 1000 }), /77초 동안 작업 중입니다/)
+  assert.equal(h.listeners(), 2)
+  cleanup()
+  assert.equal(h.interval(), undefined)
+  assert.equal(h.listeners(), 0)
+  assert.equal(h.cleared(), 1)
+})
+
+test('returning to a remounted chat shows the full elapsed time immediately', () => {
+  const h = harness(74_000)
+  assert.match(h.render({ startedAt: 1000 }), /73초 동안 작업 중입니다/)
+})
+
+test('completed duration stays fixed and never starts a timer', () => {
+  const h = harness()
+  assert.match(h.render({ startedAt: 1000, durationMs: 20_900 }), /20초 동안 작업함/)
+  assert.equal(h.mount(), undefined)
+  h.advance(60_000)
+  h.tick()
+  assert.match(h.render({ durationMs: 20_900 }), /20초 동안 작업함/)
+  assert.equal(h.interval(), undefined)
+  assert.equal(h.listeners(), 0)
+  assert.match(h.render({ durationMs: 0 }), /0초 동안 작업함/)
+})
+
+test('legacy replies and invalid timing do not invent an elapsed duration', () => {
+  const h = harness()
+  for (const durationMs of [undefined, -1, NaN, Infinity]) assert.equal(h.render({ durationMs }), '')
+  assert.match(h.render({ startedAt: 2000 }), /0초 동안 작업 중입니다/)
+})
@@ -0,0 +1,77 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const ts = require('typescript')
+const vm = require('node:vm')
+const app = ts.createSourceFile('App.tsx', fs.readFileSync(require.resolve('../src/renderer/src/App.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+const declarations = new Map()
+function visit(node) {
+  if (ts.isVariableDeclaration(node) && ts.isIdentifier(node.name)) declarations.set(node.name.text, node.initializer?.getText(app))
+  ts.forEachChild(node, visit)
+}
+visit(app)
+const plain = value => JSON.parse(JSON.stringify(value))
+
+function harness(remoteWorkspace) {
+  const executions = []
+  const calls = []
+  const contexts = []
+  const events = []
+  const errors = []
+  const target = { host: '100.64.0.10', user: 'fixture', workspaceRoot: '/fixture/workspace' }
+  const live = [{ name: 'NAV2-MKMini', folderName: 'vehicle', state: 'running', parameters: ['sim_mode:=false', 'robot:=mkmini'] }]
+  const readTool = backend => async (...args) => { executions.push({ backend, args: plain(args) }); return { status: 'ok', data: '{"content":"remote source"}' } }
+  const exports = {}
+  const globals = {
+    exports, remoteWorkspace, availableModules: [{ ...live[0], state: 'stopped', parameters: ['sim_mode:=true'] }],
+    clonePathPreview: '/local/workspace', runtimeModules: [], agentActionControllerRef: { current: null }, agentApplying: false,
+    getRemoteWorkspaceTarget: () => target, applyModuleParameterOverrides: modules => modules,
+    validateAgentTool: request => request, AGENT_PRACTICE_PROFILES: [],
+    window: {
+      remoteWorkspace: { modules: { list: async () => { events.push('snapshot-read'); return { modules: live } } }, agent: { readTool: readTool('remote') } },
+      localWorkspace: { modules: { list: async () => { events.push('snapshot-read'); return { modules: live } } }, agent: { readTool: readTool('local') } }
+    },
+    requestAgentPlan: async (...args) => {
+      calls.push(args)
+      events.push('plan-start')
+      contexts.push(await args[3].loadInitialContext(new AbortController().signal))
+    },
+    onTitlebarNotice: (...args) => { errors.push(args) }, console: { error: () => {} },
+    loadAgentRequestedContext: async () => ({ modules: [], runtimeLogs: [] })
+  }
+  const names = ['collectAgentWorkspace', 'readAgentModules', 'executeWorkspaceAgentTool', 'submitAgentRequest']
+  vm.runInNewContext(ts.transpileModule(names.map(name => `const ${name} = ${declarations.get(name)}; exports.${name} = ${name}`).join('\n'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+  }).outputText, globals)
+  return { ...exports, executions, calls, contexts, events, errors }
+}
+
+for (const remote of [false, true]) {
+  test(`${remote ? 'remote' : 'local'}: enters the chat lifecycle immediately and refreshes state before the provider request`, async () => {
+    const h = harness(remote)
+    await h.submitAgentRequest('최대 속도 제한 코드 위치')
+    assert.deepEqual(h.errors, [])
+    assert.equal(h.calls.length, 1)
+    const [, initialModules, , options] = h.calls[0]
+    assert.deepEqual(plain(initialModules), [])
+    assert.deepEqual(h.events, ['plan-start', 'snapshot-read'])
+    const { modules } = h.contexts[0]
+    assert.equal(modules[0].state, 'running')
+    assert.deepEqual(plain(modules[0].parameters), ['sim_mode:=false', 'robot:=mkmini'])
+    assert.deepEqual(plain(modules[0].files), [])
+    assert.equal(options.environment, remote ? 'remote' : 'local')
+    assert.equal(options.workspaceTarget, remote ? 'ssh:100.64.0.10' : 'local-host')
+  })
+
+  test(`${remote ? 'remote' : 'local'}: source reads use only the connected workspace transport and module folder`, async () => {
+    const h = harness(remote)
+    const tool = { id: 'read-1', name: 'files.read', moduleName: 'NAV2-MKMini', args: { path: 'src/profiles.py', startLine: 10, lineCount: 20 } }
+    await h.executeWorkspaceAgentTool(tool)
+    assert.equal(h.executions.length, 1)
+    assert.equal(h.executions[0].backend, remote ? 'remote' : 'local')
+    const args = h.executions[0].args
+    assert.deepEqual(args[remote ? 1 : 0], tool)
+    assert.equal(args[2], 'vehicle')
+    assert.equal(remote ? args[0].host : args[1], remote ? '100.64.0.10' : '/local/workspace')
+  })
+}
@@ -0,0 +1,208 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function compile(source, overrides = {}, globals = {}) {
+  const exports = {}
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX
+  } }).outputText
+  vm.runInNewContext(code, { exports, require: name => overrides[name] ?? require(name), ...globals })
+  return exports
+}
+
+const widgets = compile(fs.readFileSync(require.resolve('../src/renderer/src/components/ChatWidgets.tsx'), 'utf8'), {
+  '../i18n': { t: key => key, useLocaleRender() {} }, './chatAttachments': {}, './ChatTextContextMenu': {}, './ChatImageAttachments': {}, './ChatCodeBlock': {}
+})
+const panelSource = ts.createSourceFile('WorkspaceQaPanel.tsx', fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/WorkspaceQaPanel.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+const declarations = panelSource.statements.filter(node => ts.isFunctionDeclaration(node) && ['AiMessages', 'AgentMessages', 'TeacherMessages'].includes(node.name?.text))
+const ProgressiveChatResponse = props => React.createElement('div', { 'data-reveal-start': props.message.revealStartedAt, 'data-collapsed': props.defaultCollapsed }, props.message.content)
+const ChatImageAttachments = props => React.createElement('div', { 'data-chat-image-attachments': props.variant }, props.images.map(image => React.createElement('img', { key: image.url, src: image.url, alt: image.name })))
+const AgentCodeReferences = () => null
+const { AgentWorkDuration } = compile(fs.readFileSync(require.resolve('../src/renderer/src/components/AgentWorkDuration.tsx'), 'utf8'), {
+  '../i18n': { t: (key, values = {}) => key.replace(/\{\{(\w+)\}\}/g, (_, name) => values[name] ?? ''), useLocaleRender() {} }
+})
+const { AgentProgressBubble } = compile(fs.readFileSync(require.resolve('../src/renderer/src/components/AgentProgressBubble.tsx'), 'utf8'), {
+  '../i18n': { t: (key, values = {}) => key.replace(/\{\{(\w+)\}\}/g, (_, name) => values[name] ?? ''), useLocaleRender() {} },
+  react: { ...React, useEffect() {}, useRef: () => ({ current: null }) },
+  './AgentWorkDuration': { AgentWorkDuration }
+})
+const messages = compile(declarations.map(node => `export ${node.getText(panelSource)}`).join('\n'), {}, {
+  t: key => key, useLocaleRender() {},
+  ChatResponseSkeleton: widgets.ChatResponseSkeleton,
+  ChatEmptyState: widgets.ChatEmptyState,
+  ProgressiveChatResponse,
+  ChatImageAttachments,
+  AgentCodeReferences,
+  AgentProgressBubble,
+  AgentWorkDuration,
+  MessageCopyButton: () => null,
+  agentMessageCopyText: message => message.content,
+  Bot: () => React.createElement('svg'), WandSparkles: () => React.createElement('svg')
+})
+
+test('existing code locations stay usable during model and command work but not file application', () => {
+  for (const applying of [false, true]) {
+    const onOpen = () => {}
+    const tree = messages.AgentMessages({
+      dark: true, enabled: true, statusLoading: false, pending: true, busy: true,
+      messages: [{ id: 'answer', role: 'assistant', content: '코드 위치', applyState: applying ? 'applying' : undefined, plan: { codeReferences: [{ id: 'code-1' }], changes: [], commands: [], actionPlan: [], createModule: null } }],
+      onOpenCodeReference: onOpen
+    })
+    let references
+    function visit(element) {
+      if (!React.isValidElement(element)) return
+      if (element.type === AgentCodeReferences) references = element
+      React.Children.toArray(element.props.children).forEach(visit)
+    }
+    visit(tree)
+    assert.ok(references)
+    assert.equal(references.props.busy, applying)
+    assert.equal(typeof references.props.onOpen, 'function')
+  }
+})
+
+test('agent image thumbnails are siblings below the user bubble rather than bubble contents', () => {
+  const tree = messages.AgentMessages({
+    dark: true, enabled: true, statusLoading: false, pending: false,
+    messages: [{ id: 'user', role: 'user', content: '이 화면을 확인해줘\n두 번째 줄', imageAttachments: [{ name: '스크린샷.png', url: 'https://files.test/image.png' }] }]
+  })
+  let row
+  function visit(element) {
+    if (!React.isValidElement(element)) return
+    const children = React.Children.toArray(element.props.children)
+    if (children.some(child => React.isValidElement(child) && child.props['data-agent-user-bubble'])) row = children
+    children.forEach(visit)
+  }
+  visit(tree)
+  assert.ok(row)
+  assert.equal(row[0].props.children, '이 화면을 확인해줘\n두 번째 줄')
+  assert.match(row[0].props.className, /whitespace-pre-wrap/)
+  assert.equal(row[1].type, ChatImageAttachments)
+  assert.equal(row[1].props.variant, 'sent')
+  assert.equal(row[1].props.images.length, 1)
+})
+
+for (const dark of [false, true]) {
+  for (const mode of ['AiMessages', 'AgentMessages']) {
+    test(`${mode} uses a three-line skeleton instead of a spinner (${dark ? 'dark' : 'light'})`, () => {
+      const html = renderToStaticMarkup(messages[mode]({ dark, enabled: true, statusLoading: false, pending: true, messages: [] }))
+      assert.match(html, /role="status"/)
+      assert.equal((html.match(/<span class="h-2 /g) ?? []).length, 3)
+      for (const width of ['w-full', 'w-[76%]', 'w-[52%]']) assert.ok(html.includes(width))
+      assert.doesNotMatch(html, /animate-spin/)
+      assert.match(html, /motion-reduce:animate-none/)
+    })
+  }
+}
+
+test('AI answer forwards reveal timing and collapse settings to the same presentation component', () => {
+  const html = renderToStaticMarkup(messages.AiMessages({
+    dark: true, pending: false, collapseSignal: 2,
+    messages: [{ id: 'answer', role: 'assistant', content: '전체 답변입니다.', revealStartedAt: 1234, keepExpanded: true }]
+  }))
+  assert.match(html, /data-reveal-start="1234"/)
+  assert.match(html, /data-collapsed="false"/)
+  assert.match(html, /전체 답변/)
+})
+
+for (const dark of [true, false]) {
+  test(`agent progress accumulates only during the request and is replaced by the final reply (${dark ? 'dark' : 'light'})`, () => {
+    const progressSteps = [
+      { id: 'analysis-0', kind: 'analysis', status: 'ok', round: 1, requests: 1 },
+      { id: 'tool-0-0', kind: 'tool', name: 'files.list', moduleName: 'Camera', status: 'ok', count: 3 },
+      { id: 'tool-1-0', kind: 'tool', name: 'files.read', moduleName: 'Camera', path: 'config/camera.yaml', status: 'missing' },
+      { id: 'tool-1-1', kind: 'tool', name: 'logs.read', moduleName: 'Camera', status: 'error' },
+      { id: 'tool-1-2', kind: 'tool', name: 'files.search', moduleName: 'Camera', status: 'partial', count: 2 }
+    ]
+    const props = { dark, enabled: true, statusLoading: false, pending: true, activity: '조회 결과 분석 중', progressSteps, messages: [] }
+    const html = renderToStaticMarkup(messages.AgentMessages(props))
+    assert.equal((html.match(/data-agent-progress="true"/g) ?? []).length, 1)
+    assert.match(html, /1차 분석 완료 · 추가 조회 1건/)
+    assert.match(html, /Camera · 파일 목록 · 조회 완료 · 3건/)
+    assert.match(html, /Camera · 파일 읽기 · config\/camera.yaml · 대상 없음/)
+    assert.match(html, /Camera · 로그 조회 · 조회 실패/)
+    assert.match(html, /Camera · 파일 검색 · 일부 결과 · 2건/)
+    assert.match(html, /조회 결과 분석 중/)
+    assert.equal((html.match(/agent-response-fade/g) ?? []).length, 5)
+    const final = renderToStaticMarkup(messages.AgentMessages({ ...props, pending: false, messages: [{ id: 'answer', role: 'assistant', content: '최종 답변입니다.', durationMs: 20_900 }] }))
+    assert.doesNotMatch(final, /data-agent-progress|config\/camera.yaml|진행 상황/)
+    assert.match(final, /최종 답변입니다/)
+    assert.match(final, /20초 동안 작업함/)
+    assert.ok(final.indexOf('20초 동안 작업함') < final.indexOf('최종 답변입니다'))
+  })
+}
+
+for (const dark of [false, true]) {
+  for (const [mode, expected] of [
+    ['AiMessages', /AI에게 질문할<br\/>내용을 입력하세요/],
+    ['AgentMessages', /현재 모듈의 코드 수정이나 새 모듈 생성을 요청하세요\.<br\/>변경 내용은 확인 후 직접 적용합니다\./],
+    ['TeacherMessages', /강사에게 문의할<br\/>내용을 입력하세요/]
+  ]) {
+    test(`empty ${mode} view uses the shared speech bubble (${dark ? 'dark' : 'light'})`, () => {
+      const html = renderToStaticMarkup(messages[mode]({ dark, enabled: true, pending: false, messages: [] }))
+      assert.match(html, expected)
+      assert.match(html, /rounded-lg border px-8 py-5/)
+      assert.match(html, /aria-hidden="true"[^>]*rotate-45 border-b border-r/)
+      assert.doesNotMatch(html, /<button|role="status"/)
+    })
+  }
+}
+
+function chatHarness(revealInView) {
+  const states = []
+  const refs = []
+  let stateIndex = 0
+  let refIndex = 0
+  let waits = 0
+  const content = '첫 번째 문단입니다.\n\n두 번째 문단입니다.\n\n마지막 문단입니다.'
+  const { useQaChat } = compile(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/useQaChat.ts'), 'utf8'), {
+    react: {
+      useEffect() {},
+      useState(initial) {
+        const index = stateIndex++
+        if (!(index in states)) states[index] = typeof initial === 'function' ? initial() : initial
+        return [states[index], value => { states[index] = typeof value === 'function' ? value(states[index]) : value }]
+      },
+      useRef(initial) { const index = refIndex++; return refs[index] ??= { current: initial } }
+    },
+    'socket.io-client': {}
+  }, {
+    URLSearchParams, AbortController, DOMException,
+    fetch: async () => ({ ok: true, json: async () => ({ threadId: 'thread', content, message: { id: 'answer', content, createdAt: '2026-10-19T03:00:00Z' } }) }),
+    window: { setTimeout(fn) { waits++; fn() } }
+  })
+  return {
+    render() {
+      stateIndex = 0; refIndex = 0
+      return useQaChat({ accessToken: 'test', courseId: 'course', weekNumber: 1, revealInView, getFreshAccessToken: async () => 'test', onTitlebarNotice() {} })
+    },
+    content, waits: () => waits
+  }
+}
+
+test('workspace AI stores the complete answer immediately and leaves animation to the view', async () => {
+  const harness = chatHarness(true)
+  await harness.render().sendQaMessage('조향 설정을 알려줘')
+  const state = harness.render()
+  const answer = state.visibleAiMessages.find(message => message.id === 'answer')
+  assert.equal(answer.content, harness.content)
+  assert.equal(typeof answer.revealStartedAt, 'number')
+  assert.equal(answer.keepExpanded, true)
+  assert.equal(state.aiPending, false)
+  assert.equal(state.aiTypingMessageId, null)
+  assert.equal(harness.waits(), 0)
+})
+
+test('the separate AI guide keeps its existing reveal mode unless explicitly opted in', async () => {
+  const harness = chatHarness(false)
+  await harness.render().sendQaMessage('질문')
+  const state = harness.render()
+  assert.equal(state.visibleAiMessages.find(message => message.id === 'answer').content, harness.content)
+  assert.ok(harness.waits() > 0)
+  assert.equal(state.aiTypingMessageId, null)
+})
@@ -0,0 +1,81 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const path = require('node:path')
+const ts = require('typescript')
+
+const source = ts.createSourceFile('index.ts', fs.readFileSync(path.join(__dirname, '../src/main/index.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+const names = ['buildFastDdsPeerConfig', 'parseCameraLanAddresses', 'cameraLanEnabled', 'rosNetworkEnabled', 'prepareRemoteRosNetworkConfig']
+const code = source.statements.filter(node => ts.isFunctionDeclaration(node) && names.includes(node.name?.text)).map(node => node.getText(source)).join('\n')
+function load(overrides = {}) {
+  const dependencies = {
+    parseRosDomainId: value => Number(value ?? 0),
+    readLocalTailscaleIpv4: async () => '100.64.0.10',
+    readRemoteTailscaleIpv4: async () => '100.64.0.20',
+    runSshOutput: async () => JSON.stringify([{ addr_info: [{ family: 'inet', scope: 'global', local: '192.168.1.20' }] }]),
+    runSsh: async () => {},
+    quoteShellSingle: value => "'" + value.replaceAll("'", "'\\''") + "'",
+    expandRemotePathVar: () => [],
+    encodeBase64: value => Buffer.from(value).toString('base64'),
+    ...overrides,
+  }
+  return new Function(...Object.keys(dependencies), ts.transpile(code, { target: ts.ScriptTarget.ES2022 }) + `;return {${names.join(',')}}`)(...Object.values(dependencies))
+}
+
+test('LAN discovery adds physical addresses and multicast while keeping Tailscale peers', () => {
+  const { buildFastDdsPeerConfig } = load()
+  const xml = buildFastDdsPeerConfig('100.64.0.10', '100.64.0.20', '77', ['192.168.1.20'])
+  const whitelist = xml.match(/<interfaceWhiteList>(.*?)<\/interfaceWhiteList>/s)[1]
+  for (const address of ['127.0.0.1', '100.64.0.20', '192.168.1.20']) assert.ok(whitelist.includes(address))
+  assert.ok(xml.includes('<address>100.64.0.10</address>'))
+  assert.ok(xml.includes('<address>239.255.0.1</address><port>26650</port>'))
+  assert.ok(xml.includes('<metatrafficMulticastLocatorList>'))
+  const original = buildFastDdsPeerConfig('100.64.0.10', '100.64.0.20', '77')
+  assert.ok(!original.includes('192.168.1.20'))
+  assert.ok(!original.includes('239.255.0.1'))
+})
+
+test('only the Yahboom camera opts in', () => {
+  const { cameraLanEnabled } = load()
+  assert.equal(cameraLanEnabled('[lms-nav2-yahboom-camera]yahboom_camera_v1.0.0_ws'), true)
+  for (const role of ['vehicle', 'agent', 'control', 'slam', 'planning']) {
+    assert.equal(cameraLanEnabled(`[lms-nav2-yahboom-${role}]yahboom_${role}_v1.0.0_ws`), false)
+  }
+  assert.equal(cameraLanEnabled('[lms-nav2-custom]camera_v1.0.0_ws'), false)
+})
+
+test('physical interface responses are parsed, validated and deduplicated', () => {
+  const { parseCameraLanAddresses } = load()
+  const output = JSON.stringify([{ addr_info: [
+    { family: 'inet', scope: 'global', local: '192.168.1.20' },
+    { family: 'inet', scope: 'global', local: '999.1.1.1' },
+    { family: 'inet6', scope: 'global', local: 'fe80::1' },
+  ] }])
+  assert.deepEqual(parseCameraLanAddresses(output + '\n' + output), ['192.168.1.20'])
+})
+
+test('camera config uses its own path and LAN works without ROS platform linking', async () => {
+  let script = ''
+  const api = load({
+    readLocalTailscaleIpv4: async () => { throw new Error('Must not require local Tailscale') },
+    readRemoteTailscaleIpv4: async () => { throw new Error('Must not require remote Tailscale') },
+    runSsh: async (_target, command) => { script = command },
+  })
+  assert.equal(await api.prepareRemoteRosNetworkConfig({}, '/runtime', { enabled: false }, '77'), null)
+  const result = await api.prepareRemoteRosNetworkConfig({}, '/runtime', { enabled: false }, '77', true)
+  assert.ok(result.endsWith('-camera-lan.xml'))
+  const encoded = script.match(/printf %s '([^']+)'/)[1]
+  const xml = Buffer.from(encoded, 'base64').toString()
+  assert.ok(xml.includes('192.168.1.20'))
+  assert.ok(xml.includes('239.255.0.1'))
+})
+
+test('linked camera retains both networks and does not overwrite restricted config', async () => {
+  const api = load()
+  const restricted = await api.prepareRemoteRosNetworkConfig({}, '/runtime', { enabled: true }, '77')
+  const camera = await api.prepareRemoteRosNetworkConfig({}, '/runtime', { enabled: true }, '77', true)
+  assert.notEqual(camera, restricted)
+  assert.ok(camera.includes('100-64-0-10'))
+  const noLan = load({ runSshOutput: async () => '' })
+  await assert.rejects(noLan.prepareRemoteRosNetworkConfig({}, '/runtime', { enabled: true }, '77', true), /IPv4/)
+})
@@ -0,0 +1,35 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const output = {}
+vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/components/chatAttachments.ts'), 'utf8'), {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: output, TextDecoder })
+const { readChatAttachments } = output
+const file = (name, content) => new File([content], name)
+
+test('reads source/config/log files and preserves Korean UTF-8 text', async () => {
+  const files = await readChatAttachments([file('control.py', '# 조향 설정'), file('config.yaml', 'robot: mkmini'), file('runtime.log', 'started')], [])
+  assert.equal(files[0].content, '# 조향 설정')
+  assert.equal(files[2].name, 'runtime.log')
+})
+test('rejects unsupported image/PDF files', async () => {
+  await assert.rejects(readChatAttachments([file('photo.png', 'image')], []), /현재 모델/)
+  await assert.rejects(readChatAttachments([file('guide.pdf', 'pdf')], []), /PDF/)
+})
+test('rejects more than five attachments including existing ones', async () => {
+  await assert.rejects(readChatAttachments([file('a.txt', 'a')], Array(5).fill({ name: 'b.txt', content: '' })), /최대 5개/)
+})
+test('rejects binary and non-UTF8 content even under a text extension', async () => {
+  await assert.rejects(readChatAttachments([file('a.txt', 'a\0b')], []), /바이너리/)
+  await assert.rejects(readChatAttachments([file('a.txt', new Uint8Array([255, 254]))], []), /UTF-8/)
+})
+test('rejects oversized files instead of silently truncating', async () => {
+  await assert.rejects(readChatAttachments([file('a.txt', 'a'.repeat(100_001))], []), /100KB/)
+  await assert.rejects(readChatAttachments([file('a.txt', 'a'.repeat(50_001))], []), /5만 자/)
+})
+test('rejects aggregate attachment context above 100000 characters', async () => {
+  await assert.rejects(readChatAttachments([file('a.txt', 'a'.repeat(50_000)), file('b.txt', 'a'.repeat(50_000))], []), /10만 자/)
+})
@@ -0,0 +1,207 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function compile(file, overrides = {}, globals = {}) {
+  const exports = {}
+  const source = fs.readFileSync(require.resolve(file), 'utf8')
+  const code = ts.transpileModule(source, {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText
+  vm.runInNewContext(code, { exports, require: name => overrides[name] ?? require(name), ...globals })
+  return exports
+}
+
+const i18n = { t: key => key, useLocaleRender() {} }
+const { ConfirmStatusModal } = compile('../src/renderer/src/components/AppStatusModals.tsx', { '../i18n': i18n })
+const QaInputBox = () => null
+const ChatTextContextMenu = () => null
+
+function elements(root, predicate) {
+  if (!React.isValidElement(root)) return []
+  return [...(predicate(root) ? [root] : []), ...React.Children.toArray(root.props.children).flatMap(child => elements(child, predicate))]
+}
+
+function setup(overrides = {}, browser = {}) {
+  const state = []
+  const effects = []
+  let index = 0
+  let cleared = 0
+  const modeChanges = []
+  const panel = compile('../src/renderer/src/features/workspace/WorkspaceQaPanel.tsx', {
+    '../../i18n': i18n,
+    '../../components/AppStatusModals': { ConfirmStatusModal },
+    '../../components/ProgressiveChatResponse': { ProgressiveChatResponse: () => null },
+    '../../components/ChatWidgets': { QaInputBox },
+    '../../components/ChatTextContextMenu': { ChatTextContextMenu },
+    '../../components/ChatImageAttachments': {},
+    '../../components/AgentProgressBubble': {},
+    '../../components/AgentWorkDuration': {},
+    '../../components/AgentCodeReferences': {},
+    '../../components/AgentModelSelector': { AgentModelSelector: () => null },
+    'react-dom': { createPortal: child => child },
+    react: {
+      ...React,
+      useEffect(effect) { effects.push(effect) },
+      useState(initial) {
+        const slot = index++
+        if (!(slot in state)) state[slot] = initial
+        return [state[slot], value => { state[slot] = value }]
+      }
+    }
+  }, { document: { body: {} }, window: { getSelection: () => null, ...browser } }).default
+  const props = {
+    dark: true, workspaceActive: true, qaMode: 'ai', agentEnabled: true, visibleAiMessages: [{ id: '1', content: 'hello' }],
+    visibleTeacherMessages: [], agentMessages: [], workspaceChatScrollRef: { current: null },
+    onModeChange(mode) { modeChanges.push(mode) },
+    onClearConversation() { cleared++ }, ...overrides
+  }
+  return {
+    render() { index = 0; effects.length = 0; return panel(props) },
+    cleared: () => cleared,
+    runEffects() { effects.forEach(effect => effect()) },
+    modeChanges
+  }
+}
+
+for (const agentProvider of ['A_COPILOT', 'QWEN', 'OPENAI', 'ANTHROPIC', 'GEMINI']) {
+  for (const qaMode of ['ai', 'agent', 'teacher']) {
+    test(`attachment controls follow the provider and chat mode (${agentProvider}, ${qaMode})`, () => {
+      const harness = setup({ qaMode, agentProvider })
+      const input = elements(harness.render(), node => node.type === QaInputBox)[0]
+      assert.equal(input.props.attachmentsEnabled, qaMode === 'agent' && agentProvider !== 'A_COPILOT')
+      assert.equal(typeof input.props.onClearConversation, 'function')
+    })
+  }
+}
+
+test('the workspace passes the current provider from agent status to the chat panel', () => {
+  const source = fs.readFileSync(require.resolve('../src/renderer/src/App.tsx'), 'utf8')
+  assert.match(source, /provider: agentProvider,[\s\S]*?\} = useAiAgent\(/)
+  assert.match(source, /<WorkspaceQaPanel[\s\S]*?agentProvider=\{agentProvider\}/)
+})
+
+for (const qaMode of ['ai', 'agent', 'teacher']) {
+  test(`${qaMode} history is deleted only after shared modal confirmation`, () => {
+    const harness = setup({ qaMode, agentMessages: [{ id: 'a', content: 'answer' }], visibleTeacherMessages: [{ id: 't', content: 'answer' }] })
+    const input = tree => elements(tree, node => node.type === QaInputBox)[0]
+    const modal = tree => elements(tree, node => node.type === ConfirmStatusModal)[0]
+    assert.equal(modal(harness.render()), undefined)
+    input(harness.render()).props.onClearConversation()
+    assert.equal(harness.cleared(), 0)
+    modal(harness.render()).props.onCancel()
+    assert.equal(modal(harness.render()), undefined)
+    assert.equal(harness.cleared(), 0)
+    input(harness.render()).props.onClearConversation()
+    modal(harness.render()).props.onConfirm()
+    assert.equal(harness.cleared(), 1)
+    assert.equal(modal(harness.render()), undefined)
+  })
+}
+
+test('context menu deletion also requests confirmation', () => {
+  const harness = setup()
+  const root = harness.render()
+  const area = elements(root, node => Boolean(node.props.onContextMenu))[0]
+  area.props.onContextMenu({ currentTarget: { contains: () => true }, preventDefault() {}, stopPropagation() {}, clientX: 10, clientY: 10 })
+  const menu = elements(harness.render(), node => node.type === ChatTextContextMenu)[0]
+  menu.props.onClear()
+  assert.equal(harness.cleared(), 0)
+  assert.equal(elements(harness.render(), node => node.type === ConfirmStatusModal).length, 1)
+})
+
+for (const [selected, inside] of [[false, true], [true, true], [true, false]]) {
+  test(`themed chat menu copies only a selection inside the chat (selected=${selected}, inside=${inside})`, async () => {
+    const node = {}
+    const harness = setup({}, {
+      getSelection: () => selected ? { anchorNode: node, focusNode: node, toString: () => '선택한 답변' } : null,
+      chatTextMenu: { show: async () => assert.fail('the themed menu must not open an OS menu') }
+    })
+    const area = elements(harness.render(), element => Boolean(element.props.onContextMenu))[0]
+    area.props.onContextMenu({
+      currentTarget: { contains: () => inside }, target: { closest: () => ({}) },
+      preventDefault() {}, stopPropagation() {}, clientX: 10, clientY: 10
+    })
+    await Promise.resolve()
+    const menu = elements(harness.render(), node => node.type === ChatTextContextMenu)[0]
+    assert.equal(menu.props.menu.kind, 'message')
+    assert.equal(Boolean(menu.props.menu.text), selected && inside)
+    assert.equal(menu.props.canClear, true)
+    assert.equal(harness.cleared(), 0)
+  })
+}
+
+test('themed menu deletion still goes through the shared confirmation dialog', async () => {
+  const harness = setup()
+  const area = elements(harness.render(), node => Boolean(node.props.onContextMenu))[0]
+  area.props.onContextMenu({ currentTarget: { contains: () => true }, preventDefault() {}, stopPropagation() {} })
+  await Promise.resolve()
+  const menu = elements(harness.render(), node => node.type === ChatTextContextMenu)[0]
+  menu.props.onClear()
+  assert.equal(harness.cleared(), 0)
+  const modal = elements(harness.render(), node => node.type === ConfirmStatusModal)[0]
+  assert.ok(modal)
+  modal.props.onConfirm()
+  assert.equal(harness.cleared(), 1)
+})
+
+for (const props of [{ inputBusy: true }, { qaMessagesLoading: true }, { visibleAiMessages: [] }]) {
+  test(`does not open deletion confirmation when disabled: ${JSON.stringify(props)}`, () => {
+    const harness = setup(props)
+    const input = elements(harness.render(), node => node.type === QaInputBox)[0]
+    assert.equal(input.props.clearDisabled, true)
+    input.props.onClearConversation()
+    assert.equal(elements(harness.render(), node => node.type === ConfirmStatusModal).length, 0)
+    assert.equal(harness.cleared(), 0)
+  })
+}
+
+for (const dark of [false, true]) {
+  test(`shared confirmation renders cancel left and delete right (${dark ? 'dark' : 'light'})`, () => {
+    const harness = setup({ dark })
+    elements(harness.render(), node => node.type === QaInputBox)[0].props.onClearConversation()
+    const modal = elements(harness.render(), node => node.type === ConfirmStatusModal)[0]
+    assert.equal(modal.props.dark, dark)
+    assert.match(modal.props.overlayClassName, /fixed.*z-\[180\]/)
+    const html = renderToStaticMarkup(modal)
+    assert.match(html, /취소<\/button><button[^>]*>삭제<\/button>/)
+    assert.match(html, /bg-\[#d14b4b\]/)
+  })
+}
+
+test('input no longer opens a native confirmation dialog', () => {
+  const source = fs.readFileSync(require.resolve('../src/renderer/src/components/ChatWidgets.tsx'), 'utf8')
+  assert.doesNotMatch(source, /window\.confirm/)
+  assert.match(source, /onClick=\{onClearConversation\}/)
+})
+
+for (const dark of [false, true]) {
+  for (const agentEnabled of [false, true]) {
+    test(`agent availability controls tab count and layout (${dark ? 'dark' : 'light'}, enabled=${agentEnabled})`, () => {
+      const harness = setup({ dark, agentEnabled })
+      const grids = elements(harness.render(), node => node.props.className?.includes('mt-3 grid'))
+      assert.equal(grids.length, 1)
+      const tabs = elements(grids[0], node => node.type === 'button')
+      assert.deepEqual(tabs.map(tab => tab.props.children[1].props.children), agentEnabled ? ['AI', '에이전트', '강사'] : ['AI', '강사'])
+      assert.ok(grids[0].props.className.includes(agentEnabled ? 'grid-cols-3' : 'grid-cols-2'))
+    })
+  }
+}
+
+test('returns to AI when the selected agent is disabled after status loading', () => {
+  const harness = setup({ qaMode: 'agent', agentEnabled: false, agentStatusLoading: false, minimized: true })
+  harness.render()
+  harness.runEffects()
+  assert.deepEqual(harness.modeChanges, ['ai'])
+})
+
+test('does not reset the selected agent while status is still loading', () => {
+  const harness = setup({ qaMode: 'agent', agentEnabled: false, agentStatusLoading: true, minimized: true })
+  harness.render()
+  harness.runEffects()
+  assert.deepEqual(harness.modeChanges, [])
+})
@@ -0,0 +1,81 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function compile(file, overrides = {}, globals = {}) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve(file), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText, { exports, require: name => overrides[name] ?? require(name), ...globals })
+  return exports
+}
+
+test('custom menu clipboard IPC validates the main frame and rechecks paste availability', () => {
+  let clipboard = ''
+  let pastes = 0
+  const frame = {}
+  const sender = { mainFrame: frame, isDestroyed: () => false, paste() { pastes++ } }
+  const event = { sender, senderFrame: frame }
+  const native = compile('../src/main/chatTextMenu.ts', {
+    electron: { BrowserWindow: { fromWebContents: () => ({ isDestroyed: () => false }) }, clipboard: { readText: () => clipboard, writeText: text => { clipboard = text } } }
+  })
+  assert.equal(native.readChatClipboardState(event).hasText, false)
+  assert.equal(native.performChatClipboardAction(event, { action: 'paste' }), false)
+  assert.equal(native.performChatClipboardAction(event, { action: 'copy', text: 'selected text' }), true)
+  assert.equal(clipboard, 'selected text')
+  assert.equal(native.readChatClipboardState(event).hasText, true)
+  assert.equal(native.performChatClipboardAction(event, { action: 'paste' }), true)
+  assert.equal(pastes, 1)
+  clipboard = ''
+  assert.equal(native.performChatClipboardAction(event, { action: 'paste' }), false)
+  assert.equal(pastes, 1)
+  event.senderFrame = {}
+  assert.equal(native.performChatClipboardAction(event, { action: 'copy', text: 'blocked' }), false)
+  assert.equal(native.readChatClipboardState(event).hasText, false)
+  event.senderFrame = frame
+  assert.equal(native.performChatClipboardAction(event, { action: 'copy', text: '' }), false)
+  assert.equal(native.performChatClipboardAction(event, { action: 'copy', text: 'x'.repeat(5_000_001) }), false)
+  assert.equal(native.performChatClipboardAction(event, { action: 'unknown' }), false)
+})
+
+function renderMenu({ dark, kind = 'message', text = '', hasText = false, readOnly = false }) {
+  const menu = { kind, x: 20, y: 30, text, input: { readOnly, disabled: false } }
+  let state = 0
+  const { ChatTextContextMenu } = compile('../src/renderer/src/components/ChatTextContextMenu.tsx', {
+    '../i18n': { t: key => key, useLocaleRender() {} },
+    'react-dom': { createPortal: child => child },
+    react: { ...React, useEffect() {}, useLayoutEffect() {}, useRef: initial => ({ current: initial }), useState() { return [state++ === 0 ? { menu, hasText } : { x: 20, y: 30 }, () => {}] } }
+  }, { document: { body: {} } })
+  return ChatTextContextMenu({ dark, menu, onClose() {}, onClear() {}, canClear: true })
+}
+
+for (const dark of [true, false]) {
+  test(`chat menu uses the terminal menu surface and item metrics (${dark ? 'dark' : 'light'})`, () => {
+    const tree = renderMenu({ dark, text: 'selected' })
+    const html = renderToStaticMarkup(tree)
+    assert.match(html, dark ? /bg-\[#252526\]/ : /bg-white/)
+    assert.match(html, dark ? /enabled:hover:bg-\[#37373d\]/ : /enabled:hover:bg-\[#eef1f7\]/)
+    assert.match(html, /rounded-md border py-1 text-\[12px\] font-medium/)
+    assert.match(html, /flex h-8 w-full cursor-pointer/)
+    assert.match(html, /role="menu"/)
+    assert.match(html, /role="menuitem"/)
+    assert.match(html, /대화내역 삭제/)
+    assert.doesNotMatch(html, /붙여넣기/)
+  })
+}
+
+for (const hasText of [true, false]) {
+  for (const readOnly of [true, false]) {
+    test(`paste disabled state follows clipboard and input editability (clipboard=${hasText}, readOnly=${readOnly})`, () => {
+      const tree = renderMenu({ dark: true, kind: 'input', hasText, readOnly })
+      const buttons = React.Children.toArray(tree.props.children).filter(child => child.type === 'button')
+      assert.equal(buttons[0].props.disabled, true)
+      assert.equal(buttons[1].props.disabled, !hasText || readOnly)
+      assert.doesNotMatch(renderToStaticMarkup(tree), /대화내역 삭제/)
+    })
+  }
+}
@@ -0,0 +1,118 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function setup() {
+  const api = {}
+  const revoked = []
+  let count = 0
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/components/chatAttachments.ts'), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+  }).outputText, {
+    exports: api, TextDecoder,
+    createImageBitmap: async file => {
+      if (file.invalid) throw Error('invalid')
+      return { width: file.width ?? 10, height: file.height ?? 10, close() {} }
+    },
+    URL: { createObjectURL: () => `blob:fixture-${++count}`, revokeObjectURL: url => revoked.push(url) }
+  })
+  return { api, read: (files, existing = []) => api.readChatAttachments(files, existing, { imagesEnabled: true }), revoked }
+}
+const image = (extra = {}) => ({ name: 'screen.png', size: 100, ...extra })
+
+test('image and text attachments coexist without counting image bytes as text context', async () => {
+  const h = setup()
+  const files = await h.read([image({ size: 5 * 1024 * 1024 }), { name: 'config.yaml', size: 10, arrayBuffer: async () => new TextEncoder().encode('robot: mini').buffer }])
+  assert.equal(files[0].kind, 'image')
+  assert.equal(files[0].previewUrl, 'blob:fixture-1')
+  assert.equal(files[1].content, 'robot: mini')
+})
+
+test('bounds image counts, byte sizes, decoded pixels and rejects malformed images', async () => {
+  const h = setup()
+  await assert.rejects(h.read([image({ size: 5 * 1024 * 1024 + 1 })]), /5MB/)
+  await assert.rejects(h.read([image({ width: 4001, height: 4001 })]), /1600만/)
+  await assert.rejects(h.read([image({ invalid: true })]), /읽지 못/)
+  await assert.rejects(h.read(Array.from({ length: 4 }, () => image())), /3장/)
+  assert.equal(h.revoked.length, 3)
+})
+
+test('a mixed batch failure revokes only newly created image previews', async () => {
+  const h = setup()
+  const existing = await h.read([image()])
+  await assert.rejects(h.read([image(), { name: 'file.pdf', size: 20 }], existing), /PDF/)
+  assert.deepEqual(h.revoked, ['blob:fixture-2'])
+  assert.equal(existing[0].previewUrl, 'blob:fixture-1')
+})
+
+test('restores cached multipart filenames while preserving valid Unicode and Latin-1 names', () => {
+  const { api } = setup()
+  const name = '스크린샷 2026-10-19 14-30-45.png'
+  assert.equal(api.displayAttachmentName(Buffer.from(name).toString('latin1')), name)
+  for (const value of [name, 'screen.png', 'caf\u00e9.png', '\uD83D\uDCF7.png']) assert.equal(api.displayAttachmentName(value), value)
+})
+
+function previewHarness() {
+  const { api } = setup()
+  const exports = {}
+  let preview = null
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/components/ChatImageAttachments.tsx'), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText, {
+    exports,
+    document: { body: {} },
+    require(name) {
+      if (name === 'react') return { ...React, useEffect() {}, useRef: () => ({ current: null }), useState: () => [preview, value => { preview = value }] }
+      if (name === 'react-dom') return { createPortal: child => child }
+      if (name === '../i18n') return { t: key => key, useLocaleRender() {} }
+      if (name === './chatAttachments') return api
+      return require(name)
+    }
+  })
+  const find = (node, predicate) => {
+    if (!React.isValidElement(node)) return null
+    if (predicate(node)) return node
+    return React.Children.toArray(node.props.children).map(child => find(child, predicate)).find(Boolean)
+  }
+  return { render: props => exports.ChatImageAttachments(props), find }
+}
+
+for (const dark of [true, false]) {
+  test(`draft combines thumbnail, truncated filename and removal in one bounded item (${dark ? 'dark' : 'light'})`, () => {
+    const h = previewHarness()
+    const name = '스크린샷-긴파일이름-'.repeat(12) + '.png'
+    let removed
+    const props = { images: [{ name, url: 'blob:fixture' }], dark, onRemove: image => { removed = image.url } }
+    const tree = h.render(props)
+    const item = h.find(tree, node => node.props['data-chat-image-draft'])
+    assert.ok(item)
+    assert.match(item.props.className, /w-56.*max-w-full/)
+    assert.ok(h.find(item, node => node.type === 'img'))
+    const label = h.find(item, node => node.type === 'span')
+    assert.equal(label.props.children, name)
+    assert.match(label.props.className, /truncate/)
+    const zoom = h.find(item, node => node.type === 'button' && node.props.title === name)
+    assert.equal(zoom.props.title, name)
+    h.find(item, node => node.type === 'button' && node.props['aria-label'] === `첨부 제거: ${name}`).props.onClick()
+    assert.equal(removed, 'blob:fixture')
+    const busyItem = h.find(h.render({ ...props, removeDisabled: true }), node => node.props['data-chat-image-draft'])
+    assert.equal(h.find(busyItem, node => node.type === 'button' && node.props['aria-label'] === `첨부 제거: ${name}`).props.disabled, true)
+  })
+}
+
+test('cached garbled names are restored in the thumbnail label and enlarged dialog', () => {
+  const h = previewHarness()
+  const name = '스크린샷 2026-10-19 14-30-45.png'
+  const props = { images: [{ name: Buffer.from(name).toString('latin1'), url: 'https://files.test/image.png' }], variant: 'sent' }
+  const tree = h.render(props)
+  assert.equal(h.find(tree, node => node.type === 'button').props.title, name)
+  assert.equal(h.find(tree, node => node.props['data-chat-image-draft']), undefined)
+  h.find(tree, node => node.type === 'button').props.onClick()
+  const html = renderToStaticMarkup(h.render(props))
+  assert.match(html, /<dialog[^>]*aria-label="스크린샷 2026-10-19 14-30-45.png"/)
+  assert.ok(html.includes(`>${name}</span>`))
+})
@@ -0,0 +1,137 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+
+function harness() {
+  let layoutEffects = []
+  let effects = []
+  let resizeCallback
+  let disconnected = false
+  const states = []
+  const refs = []
+  let stateIndex = 0
+  let refIndex = 0
+  const submissions = []
+  const input = {
+    style: {}, scrollHeight: 56,
+    getBoundingClientRect: () => ({ width: 300 })
+  }
+  const exports = {}
+  const source = fs.readFileSync(require.resolve('../src/renderer/src/components/ChatWidgets.tsx'), 'utf8')
+  vm.runInNewContext(ts.transpileModule(source, {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText, {
+    exports,
+    window: { getComputedStyle: () => ({ lineHeight: '20px', paddingTop: '10px', paddingBottom: '10px', borderTopWidth: '0px', borderBottomWidth: '0px', minHeight: '56px' }) },
+    ResizeObserver: class {
+      constructor(callback) { resizeCallback = callback }
+      observe(element) { assert.equal(element, input) }
+      disconnect() { disconnected = true }
+    },
+    require(name) {
+      if (name === '../i18n') return { t: key => key, useLocaleRender() {} }
+      if (name === './chatAttachments') return {}
+      if (name === './ChatTextContextMenu') return { ChatTextContextMenu: () => null }
+      if (name === './ChatImageAttachments') return { ChatImageAttachments: () => null }
+      if (name === './ChatCodeBlock') return {}
+      if (name === 'react') return {
+        ...React,
+        useState(initial) {
+          const index = stateIndex++
+          if (!(index in states)) states[index] = initial
+          return [states[index], value => { states[index] = value }]
+        },
+        useRef(initial) { return refs[refIndex++] ??= { current: initial } },
+        useEffect(callback) { effects.push(callback) },
+        useLayoutEffect(callback) { layoutEffects.push(callback) }
+      }
+      return require(name)
+    }
+  })
+  function find(node, type) {
+    if (!React.isValidElement(node)) return null
+    if (node.type === type) return node
+    return React.Children.toArray(node.props.children).map(child => find(child, type)).find(Boolean)
+  }
+  function render() {
+    stateIndex = 0
+    refIndex = 0
+    layoutEffects = []
+    effects = []
+    const tree = exports.QaInputBox.type({ dark: true, busy: false, disabled: false, onStop() {}, onSubmit: content => submissions.push(content) })
+    const textarea = find(tree, 'textarea')
+    textarea.props.ref.current = input
+    layoutEffects.forEach(callback => callback())
+    return textarea
+  }
+  return {
+    input, render, submissions,
+    mountEffects: () => effects.map(callback => callback()),
+    resize: width => resizeCallback([{ contentRect: { width } }]),
+    disconnected: () => disconnected
+  }
+}
+
+test('input grows to eight visible lines and scrolls only above the cap', () => {
+  const h = harness()
+  h.render()
+  assert.equal(h.input.style.height, '56px')
+  assert.equal(h.input.style.overflowY, 'hidden')
+  h.input.scrollHeight = 100
+  h.render()
+  assert.equal(h.input.style.height, '100px')
+  h.input.scrollHeight = 180
+  h.render()
+  assert.equal(h.input.style.height, '180px')
+  assert.equal(h.input.style.overflowY, 'hidden')
+  h.input.scrollHeight = 300
+  h.render()
+  assert.equal(h.input.style.height, '180px')
+  assert.equal(h.input.style.overflowY, 'auto')
+})
+
+test('deleting text and submitting restore the initial height', () => {
+  const h = harness()
+  let textarea = h.render()
+  textarea.props.onChange({ target: { value: 'question\nsecond line\nthird line' } })
+  h.input.scrollHeight = 80
+  textarea = h.render()
+  assert.equal(h.input.style.height, '80px')
+  let prevented = false
+  textarea.props.onKeyDown({ key: 'Enter', shiftKey: false, nativeEvent: {}, preventDefault() { prevented = true } })
+  assert.equal(prevented, true)
+  assert.equal(h.submissions.length, 1)
+  h.input.scrollHeight = 40
+  textarea = h.render()
+  assert.equal(textarea.props.value, '')
+  assert.equal(h.input.style.height, '56px')
+  assert.equal(h.input.style.overflowY, 'hidden')
+})
+
+test('Shift+Enter and IME composition do not submit', () => {
+  const h = harness()
+  let textarea = h.render()
+  textarea.props.onChange({ target: { value: 'question' } })
+  textarea = h.render()
+  const preventDefault = () => assert.fail('newline or composing Enter must not be intercepted')
+  textarea.props.onKeyDown({ key: 'Enter', shiftKey: true, nativeEvent: {}, preventDefault })
+  textarea.props.onKeyDown({ key: 'Enter', shiftKey: false, nativeEvent: { isComposing: true }, preventDefault })
+  assert.equal(h.submissions.length, 0)
+})
+
+test('panel width changes recalculate wrapped lines and observer disconnects on unmount', () => {
+  const h = harness()
+  h.render()
+  const cleanups = h.mountEffects()
+  h.input.scrollHeight = 120
+  h.resize(180)
+  assert.equal(h.input.style.height, '120px')
+  h.input.scrollHeight = 50
+  h.resize(400)
+  assert.equal(h.input.style.height, '56px')
+  cleanups.forEach(cleanup => cleanup?.())
+  assert.equal(h.disconnected(), true)
+})
@@ -0,0 +1,111 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+function compile(file, overrides = {}, globals = {}) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve(file), 'utf8'), { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX } }).outputText, {
+    exports, require: name => overrides[name] ?? require(name), clearTimeout, setTimeout, ...globals
+  })
+  return exports
+}
+const i18n = { t: key => key, useLocaleRender() {} }
+const block = compile('../src/renderer/src/components/ChatCodeBlock.tsx', { '../i18n': i18n })
+const { MarkdownMessage } = compile('../src/renderer/src/components/ChatWidgets.tsx', {
+  '../i18n': i18n, './ChatCodeBlock': block, './chatAttachments': {}, './ChatImageAttachments': {}, './ChatTextContextMenu': {}
+})
+const render = (content, dark = true, extra = {}) => renderToStaticMarkup(React.createElement(MarkdownMessage, { content, dark, ...extra }))
+
+for (const dark of [true, false]) {
+  test(`renders numbered/nested/task lists without losing the starting number (${dark})`, () => {
+    const html = render('3. 설정 확인\n   - 속도 제한\n   - 조향 제한\n4. 결과 확인\n\n- [x] 완료\n- [ ] 대기', dark)
+    assert.match(html, /<ol start="3" class="[^"]*list-decimal/)
+    assert.match(html, /<ul class="[^"]*list-disc/)
+    assert.match(html, /contains-task-list list-none/)
+    assert.match(html, /task-list-item list-none/)
+    assert.equal((html.match(/type="checkbox"/g) ?? []).length, 2)
+  })
+  test(`renders GFM tables with keyboard-scrollable framing and column alignment (${dark})`, () => {
+    const html = render('| 모듈 | 속도 |\n| --- | ---: |\n| Control | `0.3 m/s` |', dark)
+    assert.match(html, /data-chat-table/)
+    assert.match(html, /tabindex="0" role="region" aria-label="표"/)
+    assert.match(html, /overflow-x-auto/)
+    assert.match(html, /<table class="[^"]*table-auto/)
+    assert.match(html, /text-align:right/)
+    assert.match(html, /chat-inline-code/)
+  })
+  test(`renders fenced Python with language, token colors, copy control and preserved indentation (${dark})`, () => {
+    const html = render('```python\ndef speed():\n    return 0.3\n```', dark)
+    assert.match(html, /data-chat-code-block/)
+    assert.ok(html.includes(`data-code-theme="${dark ? 'dark' : 'light'}"`))
+    assert.match(html, />Python<\/span>/)
+    assert.match(html, /aria-label="코드 복사"/)
+    assert.match(html, /hljs-keyword/)
+    assert.match(html, /hljs-number/)
+    assert.match(html, /\n    <span/)
+    assert.match(html, /max-h-80 max-w-full overflow-auto/)
+    assert.match(html, /whitespace-pre font-mono/)
+    assert.doesNotMatch(html, /chat-inline-code/)
+  })
+}
+
+test('unlabelled and unknown languages remain code blocks rather than inline code', () => {
+  for (const language of ['', 'unknown-language']) {
+    const html = render('```' + language + '\n    unformatted <value>\n```')
+    assert.match(html, /data-chat-code-block/)
+    assert.ok(html.includes(language || '일반 텍스트'))
+    assert.ok(html.includes('    unformatted &lt;value&gt;'))
+    assert.doesNotMatch(html, /hljs-/)
+  }
+})
+
+test('HTML-looking code is rendered as escaped text, never live elements', () => {
+  const html = render('```html\n<script>window.injected = true</script>\n<img src=x onerror="window.injected=true">\n```')
+  assert.doesNotMatch(html, /<script\b|<img\b/)
+  assert.match(html, /&lt;/)
+  assert.match(html, /window.injected/)
+  const source = fs.readFileSync(require.resolve('../src/renderer/src/components/ChatCodeBlock.tsx'), 'utf8')
+  assert.doesNotMatch(source, /dangerouslySetInnerHTML/)
+})
+
+test('only newly revealed code and tables receive the fade class', () => {
+  const markdown = '설명\n\n```yaml\nspeed: 0.3\n```\n\n| 키 | 값 |\n| --- | --- |\n| speed | 0.3 |'
+  const html = render(markdown, true, { fadeFrom: markdown.indexOf('| 키') })
+  assert.equal((html.match(/agent-response-fade/g) ?? []).length, 1)
+  assert.match(html, /overflow-x-auto rounded-md agent-response-fade/)
+})
+
+test('oversized code skips tokenization but still preserves all content', () => {
+  const source = '# comment\n'.repeat(6000)
+  const html = renderToStaticMarkup(React.createElement(block.ChatCodeBlock, { source, language: 'python', dark: true }))
+  assert.doesNotMatch(html, /hljs-comment/)
+  assert.equal((html.match(/# comment/g) ?? []).length, 6000)
+})
+
+function elements(tree, predicate) {
+  if (!React.isValidElement(tree)) return []
+  return [...(predicate(tree) ? [tree] : []), ...React.Children.toArray(tree.props.children).flatMap(child => elements(child, predicate))]
+}
+for (const fails of [false, true]) test(`code copy preserves the full source and reports clipboard ${fails ? 'failure' : 'success'}`, async () => {
+  let state = 'idle', copied, timer
+  const api = compile('../src/renderer/src/components/ChatCodeBlock.tsx', {
+    '../i18n': i18n,
+    react: { ...React, useState: () => [state, value => { state = value }], useMemo: fn => fn(), useRef: () => ({ current: null }), useEffect() {} }
+  }, { navigator: { clipboard: { writeText: async text => { if (fails) throw Error('denied'); copied = text } } }, setTimeout: callback => { timer = callback; return 1 }, clearTimeout() {} })
+  const source = '\t# 한글 주석\n  speed = 0.3\n\n'
+  const renderBlock = () => api.ChatCodeBlock({ source, language: 'python', dark: true })
+  const button = elements(renderBlock(), element => element.type === 'button')[0]
+  let stopped = false
+  button.props.onClick({ stopPropagation() { stopped = true } })
+  await new Promise(resolve => setImmediate(resolve))
+  assert.equal(stopped, true)
+  assert.equal(state, fails ? 'error' : 'copied')
+  if (!fails) assert.equal(copied, source)
+  assert.equal(elements(renderBlock(), element => element.type === 'button')[0].props['aria-label'], fails ? '코드를 복사하지 못했습니다.' : '복사됨')
+  timer()
+  assert.equal(state, 'idle')
+})
@@ -0,0 +1,145 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+
+function compile(file, overrides = {}, globals = {}) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve(file), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+  }).outputText, { exports, require: name => overrides[name] ?? require(name), ...globals })
+  return exports
+}
+
+function nativeMenu() {
+  let template
+  let close
+  let clipboard = ''
+  let copies = 0
+  let pastes = 0
+  const frame = {}
+  const sender = { mainFrame: frame, isDestroyed: () => false, copy() { copies++ }, paste() { pastes++ } }
+  const event = { sender, senderFrame: frame }
+  const { showChatTextMenu } = compile('../src/main/chatTextMenu.ts', {
+    electron: {
+      BrowserWindow: { fromWebContents: () => ({ isDestroyed: () => false }) },
+      clipboard: { readText: () => clipboard },
+      Menu: { buildFromTemplate(items) {
+        template = items
+        return { popup(options) { close = options.callback } }
+      } }
+    }
+  })
+  return {
+    show: options => showChatTextMenu(event, options),
+    items: () => template,
+    close: () => close(),
+    setClipboard: text => { clipboard = text },
+    copies: () => copies, pastes: () => pastes, event
+  }
+}
+
+const labels = { copy: '복사', paste: '붙여넣기', clear: '대화내역 삭제' }
+
+for (const canCopy of [false, true]) {
+  test(`message copy is enabled only with a selection (selected=${canCopy})`, async () => {
+    const menu = nativeMenu()
+    const result = menu.show({ kind: 'message', canCopy, canClear: true, labels })
+    assert.equal(menu.items()[0].enabled, canCopy)
+    assert.equal(menu.items()[0].label, '복사')
+    assert.equal(menu.items().some(item => item.label === '붙여넣기'), false)
+    menu.items()[0].click()
+    assert.equal(await result, null)
+    assert.equal(menu.copies(), canCopy ? 1 : 0)
+  })
+}
+
+for (const clipboard of ['', '복사해 둔 내용']) {
+  test(`input paste availability is read from the OS clipboard (empty=${!clipboard})`, async () => {
+    const menu = nativeMenu()
+    menu.setClipboard(clipboard)
+    const result = menu.show({ kind: 'input', canCopy: false, canPaste: true, labels })
+    assert.equal(menu.items().length, 2)
+    assert.equal(menu.items()[0].enabled, false)
+    assert.equal(menu.items()[1].label, '붙여넣기')
+    assert.equal(menu.items()[1].enabled, Boolean(clipboard))
+    menu.items()[1].click()
+    await result
+    assert.equal(menu.pastes(), clipboard ? 1 : 0)
+  })
+}
+
+test('read-only input never allows paste, even with clipboard text', async () => {
+  const menu = nativeMenu()
+  menu.setClipboard('text')
+  const result = menu.show({ kind: 'input', canCopy: true, canPaste: false, labels })
+  assert.equal(menu.items()[1].enabled, false)
+  menu.items()[1].click()
+  await result
+  assert.equal(menu.pastes(), 0)
+})
+
+test('paste rechecks an emptied clipboard before editing the input', async () => {
+  const menu = nativeMenu()
+  menu.setClipboard('text')
+  const result = menu.show({ kind: 'input', canCopy: false, canPaste: true, labels })
+  assert.equal(menu.items()[1].enabled, true)
+  menu.setClipboard('')
+  menu.items()[1].click()
+  await result
+  assert.equal(menu.pastes(), 0)
+})
+
+test('delete selection returns a confirmation request rather than deleting data', async () => {
+  const menu = nativeMenu()
+  const result = menu.show({ kind: 'message', canCopy: false, canClear: true, labels })
+  menu.items().find(item => item.label === '대화내역 삭제').click()
+  assert.equal(await result, 'clear')
+})
+
+test('closing a menu without choosing an action does nothing', async () => {
+  const menu = nativeMenu()
+  const result = menu.show({ kind: 'message', canCopy: true, labels })
+  menu.close()
+  assert.equal(await result, null)
+  assert.equal(menu.copies(), 0)
+})
+
+test('untrusted frames and invalid menu targets cannot open a native menu', () => {
+  const menu = nativeMenu()
+  assert.equal(menu.show({ kind: 'unknown', canCopy: true, labels }), null)
+  menu.event.senderFrame = {}
+  assert.equal(menu.show({ kind: 'input', canCopy: true, labels }), null)
+})
+
+function elements(root, predicate) {
+  if (!React.isValidElement(root)) return []
+  return [...(predicate(root) ? [root] : []), ...React.Children.toArray(root.props.children).flatMap(child => elements(child, predicate))]
+}
+
+for (const selected of [false, true]) {
+  test(`textarea opens the themed menu with a selection snapshot (selected=${selected})`, async () => {
+    let options
+    let prevented = false
+    let stopped = false
+    const { QaInputBox } = compile('../src/renderer/src/components/ChatWidgets.tsx', {
+      '../i18n': { t: key => key, useLocaleRender() {} }, './chatAttachments': {}, './ChatTextContextMenu': { ChatTextContextMenu: () => null }, './ChatImageAttachments': { ChatImageAttachments: () => null }, './ChatCodeBlock': {},
+      react: { ...React, useState: initial => [initial, value => { if (value?.kind === 'input') options = value }], useEffect() {}, useLayoutEffect() {}, useRef: () => ({ current: null }) }
+    }, { window: { chatTextMenu: { show: async input => { options = input; return null } } } })
+    const tree = QaInputBox.type({ dark: true, busy: false, disabled: false, onStop() {}, onSubmit() {} })
+    const textarea = elements(tree, node => node.type === 'textarea')[0]
+    textarea.props.onContextMenu({
+      currentTarget: { value: 'abcdef', selectionStart: 2, selectionEnd: selected ? 5 : 2, disabled: false, readOnly: false },
+      preventDefault() { prevented = true }, stopPropagation() { stopped = true }
+    })
+    await Promise.resolve()
+    assert.equal(options.kind, 'input')
+    assert.equal(options.text, selected ? 'cde' : '')
+    assert.equal(options.input.disabled, false)
+    assert.equal(options.selectionStart, 2)
+    assert.equal(prevented, true)
+    assert.equal(stopped, true)
+  })
+}
@@ -0,0 +1,67 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+const source = fs.readFileSync(require.resolve('../src/renderer/src/components/AppStatusModals.tsx'), 'utf8')
+const compiled = ts.transpileModule(source, {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+}).outputText
+
+function loadModals() {
+  const exports = {}
+  vm.runInNewContext(compiled, {
+    exports,
+    require: name => name === '../i18n' ? { t: key => key, useLocaleRender() {} } : require(name)
+  })
+  return exports
+}
+
+function buttons(element) {
+  if (!React.isValidElement(element)) return []
+  if (element.type === 'button') return [element]
+  return React.Children.toArray(element.props.children).flatMap(buttons)
+}
+
+for (const dark of [false, true]) {
+  test(`extension action stays on the right in both dialogs (${dark ? 'dark' : 'light'})`, () => {
+    const { StatusNoticeModal, ControlExtensionConfirmModal } = loadModals()
+    let confirmed = 0
+    let extended = 0
+    const notice = StatusNoticeModal({
+      overlayClassName: 'overlay', dark, tone: 'clock', title: '제어 시간 안내', message: '제어 시간이 곧 종료됩니다.',
+      actionLabel: '연장', onAction: () => { extended++ }, onConfirm: () => { confirmed++ }
+    })
+    const noticeButtons = buttons(notice)
+    assert.deepEqual(noticeButtons.map(button => button.props.children), ['확인', '연장'])
+    assert.match(noticeButtons[1].props.className, /bg-\[#6f4df6\]/)
+    assert.doesNotMatch(noticeButtons[0].props.className, /bg-\[#6f4df6\]/)
+    noticeButtons[0].props.onClick()
+    noticeButtons[1].props.onClick()
+    assert.equal(confirmed, 1)
+    assert.equal(extended, 1)
+
+    const confirmation = ControlExtensionConfirmModal({ overlayClassName: 'overlay', dark, platformName: 'MK-mini', onCancel() {}, onConfirm() {} })
+    assert.deepEqual(buttons(confirmation).map(button => button.props.children), ['취소', '연장'])
+    assert.match(buttons(confirmation)[1].props.className, /bg-\[#6f4df6\]/)
+    assert.match(renderToStaticMarkup(confirmation), /취소<\/button><button[^>]*>연장<\/button>/)
+  })
+}
+
+test('notices without an extension action retain their single primary confirmation button', () => {
+  const { StatusNoticeModal } = loadModals()
+  const notice = StatusNoticeModal({ overlayClassName: 'overlay', dark: true, tone: 'warning', title: '안내', message: '메시지', onConfirm() {} })
+  assert.equal(buttons(notice).length, 1)
+  assert.equal(buttons(notice)[0].props.children, '확인')
+  assert.match(buttons(notice)[0].props.className, /bg-\[#6f4df6\]/)
+})
+
+test('the extension confirmation keeps the right button disabled while submitting', () => {
+  const { ControlExtensionConfirmModal } = loadModals()
+  const confirmation = ControlExtensionConfirmModal({ overlayClassName: 'overlay', dark: true, platformName: 'MK-mini', submitting: true, onCancel() {}, onConfirm() {} })
+  assert.deepEqual(buttons(confirmation).map(button => button.props.children), ['취소', '연장 중'])
+  assert.ok(buttons(confirmation).every(button => button.props.disabled))
+})
@@ -0,0 +1,30 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const path = require('node:path')
+const root = path.resolve(__dirname, '../src')
+const app = fs.readFileSync(path.join(root, 'renderer/src/App.tsx'), 'utf8')
+const view = fs.readFileSync(path.join(root, 'renderer/src/features/workspace/ModuleListView.tsx'), 'utf8')
+
+test('remote creation and Git import are enabled while raw folder import remains local', () => {
+  assert.match(app, /allowCustomModuleCreation=\{true\}/)
+  assert.match(app, /allowCustomModuleImport=\{true\}/)
+  assert.match(app, /remoteGitImport=\{remoteWorkspace \? \{ workspaceRoot: localVisualizationWorkspaceRoot, onImport: importGitModule \} : undefined\}/)
+  assert.match(view, /remoteGitImport \? <RemoteModuleImportDialog/)
+  assert.match(app, /const importCustomModule[\s\S]*?if \(remoteWorkspace\) throw new Error/)
+  const importButton = view.slice(view.indexOf('aria-label={t("모듈 불러오기")}'), view.indexOf('{deleteConfirmModule &&'))
+  assert.match(importButton, /disabled=\{!allowCustomModuleImport\}/)
+  assert.doesNotMatch(importButton, /allowCustomModuleCreation/)
+  assert.match(view, /allowCustomModuleImport && moduleImportDialogOpen/)
+})
+
+test('new module dialog requests images from the current workspace', () => {
+  assert.match(app, /loadDockerImages=\{\(\) => remoteWorkspace\s*\? window\.remoteWorkspace\.modules\.listDockerImages\(getRemoteWorkspaceTarget\(\)\)/)
+  const dialog = view.slice(view.indexOf('function ModuleAddDialog('), view.indexOf('function ModuleImportDialog('))
+  assert.match(dialog, /void loadDockerImages\(\)/)
+  assert.doesNotMatch(dialog, /window\.localWorkspace/)
+  const preload = fs.readFileSync(path.join(root, 'preload/index.ts'), 'utf8')
+  const main = fs.readFileSync(path.join(root, 'main/index.ts'), 'utf8')
+  assert.match(preload, /invoke\('remote-workspace:modules:docker-images', target\)/)
+  assert.match(main, /handle\('remote-workspace:modules:docker-images'/)
+})
@@ -0,0 +1,78 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const os = require('node:os')
+const path = require('node:path')
+const vm = require('node:vm')
+const ts = require('typescript')
+const exportsObject = {}
+const source = fs.readFileSync(path.resolve(__dirname, '../src/main/dailyLog.ts'), 'utf8')
+vm.runInNewContext(ts.transpileModule(source, {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+}).outputText, { exports: exportsObject, require })
+const { createDailyLog, redactLog } = exportsObject
+
+test('appends and rotates by local date, retaining unrelated files', (t) => {
+  const root = fs.mkdtempSync(path.join(os.tmpdir(), 'lms-log-test-'))
+  t.after(() => fs.rmSync(root, { recursive: true, force: true }))
+  fs.writeFileSync(path.join(root, 'renderer.log'), 'existing log')
+  let date = new Date(2026, 8, 29, 23, 59)
+  const log = createDailyLog([root], () => date)
+  log.write('test', 'first')
+  log.write('test', 'second')
+  const oldPath = log.path()
+  assert.match(oldPath, /lms-2026-09-29\.log$/)
+  assert.match(fs.readFileSync(oldPath, 'utf8'), /first[\s\S]*second/)
+  assert.equal(fs.statSync(oldPath).mode & 0o777, 0o600)
+  date = new Date(2026, 8, 30, 0, 1)
+  log.write('test', 'next day')
+  assert.match(log.path(), /lms-2026-09-30\.log$/)
+  assert.equal(fs.existsSync(oldPath), false)
+  assert.equal(fs.readFileSync(path.join(root, 'renderer.log'), 'utf8'), 'existing log')
+})
+
+test('falls back when the primary directory is unusable', (t) => {
+  const root = fs.mkdtempSync(path.join(os.tmpdir(), 'lms-log-test-'))
+  t.after(() => fs.rmSync(root, { recursive: true, force: true }))
+  const blocked = path.join(root, 'file')
+  fs.writeFileSync(blocked, '')
+  const log = createDailyLog([blocked, path.join(root, 'fallback')])
+  log.write('test', 'fallback')
+  assert.equal(path.dirname(log.path()), path.join(root, 'fallback'))
+  const unavailable = createDailyLog([blocked])
+  assert.doesNotThrow(() => unavailable.write('test', 'ignored'))
+  assert.equal(unavailable.path(), '')
+})
+
+test('redacts common authentication fields and credential URLs', () => {
+  const result = redactLog('https://oauth2:secret123@example.com/repo.git Bearer secret456 --handoff-token=secret789 ?password=secret000 {"accessToken":"secret111"} password=secret222')
+  for (const secret of ['secret123', 'secret456', 'secret789', 'secret000', 'secret111', 'secret222']) {
+    assert.equal(result.includes(secret), false)
+  }
+  assert.match(result, /example.com\/repo.git/)
+})
+
+test('bootstrap logs dependency loading failures before exiting', async () => {
+  const events = []
+  const bootstrap = fs.readFileSync(path.resolve(__dirname, '../src/main/bootstrap.ts'), 'utf8')
+  const code = ts.transpileModule(bootstrap, {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+  }).outputText
+  vm.runInNewContext(code, {
+    exports: {}, Error,
+    require: (name) => {
+      if (name === 'electron') return { app: { exit: (code) => events.push(['exit', code]) } }
+      if (name === './appLogging') {
+        events.push(['logger-ready'])
+        return { appLog: { write: (...args) => events.push(args) } }
+      }
+      if (name === './index') throw new Error('test native module failure')
+      throw new Error(`Unexpected dependency: ${name}`)
+    }
+  })
+  await new Promise((resolve) => setImmediate(resolve))
+  assert.equal(events[0][0], 'logger-ready')
+  assert.equal(events[1][0], 'startup-error')
+  assert.match(events[1][1], /test native module failure/)
+  assert.deepEqual(events[2], ['exit', 1])
+})
@@ -0,0 +1,61 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const path = require('node:path')
+const crypto = require('node:crypto')
+const postcss = require('postcss')
+
+const root = path.resolve(__dirname, '..')
+const source = fs.readFileSync(path.join(root, 'src/renderer/src/styles/nanumSquare.css'), 'utf8')
+const css = postcss.parse(source)
+const faces = []
+css.walkAtRules('font-face', rule => {
+  faces.push(Object.fromEntries(rule.nodes.filter(node => node.type === 'decl').map(node => [node.prop, node.value])))
+})
+
+function codepoints(range) {
+  const result = new Set()
+  let previous = -1
+  for (const entry of range.split(',')) {
+    const match = entry.trim().match(/^U\+([0-9A-F]+)(?:-([0-9A-F]+))?$/)
+    assert.ok(match, `Invalid unicode-range: ${entry}`)
+    const start = parseInt(match[1], 16)
+    const end = parseInt(match[2] ?? match[1], 16)
+    assert.ok(start > previous && end >= start && end <= 0x10ffff)
+    for (let code = start; code <= end; code++) result.add(code)
+    previous = end
+  }
+  return result
+}
+
+test('coverage is tied to the original bundled font bytes for all four weights', () => {
+  assert.equal(faces.length, 4)
+  assert.deepEqual(faces.map(face => face['font-weight']), ['300', '400', '700', '800'])
+  for (const face of faces) {
+    assert.equal(face['font-family'], "'NanumSquare'")
+    assert.equal(face['font-display'], 'swap')
+    const filename = face.src.match(/\/([^/]+\.woff2)'/)[1]
+    const hash = crypto.createHash('sha256').update(fs.readFileSync(path.join(root, 'src/renderer/public/assets/fonts', filename))).digest('hex')
+    assert.ok(source.includes(`${filename} sha256: ${hash}`), 'Regenerate coverage if a font changes')
+  }
+})
+
+for (const face of faces) {
+  test(`weight ${face['font-weight']} preserves visible Hangul and lets blank glyphs fall back`, () => {
+    const included = codepoints(face['unicode-range'])
+    assert.equal([...included].filter(code => code >= 0xac00 && code <= 0xd7a3).length, 2479)
+    for (const char of '가모한글학생SLAM0123 →') assert.ok(included.has(char.codePointAt(0)), `Keep ${char}`)
+    for (const char of ['몯', '힣', '\u2022']) assert.equal(included.has(char.codePointAt(0)), false, `Let ${char} use fallback`)
+    for (const code of [0x20, 0x3000, 0x3164]) assert.ok(included.has(code), 'Preserve intentional spacing')
+  })
+}
+
+test('UI keeps its original default font and native fallback without Neo', () => {
+  const entry = fs.readFileSync(path.join(root, 'src/renderer/src/index.css'), 'utf8')
+  assert.match(entry, /@import "\.\/styles\/nanumSquare\.css"/)
+  assert.match(entry, /font-family: 'NanumSquare', Inter, system-ui, sans-serif/)
+  assert.doesNotMatch(entry + source, /NanumSquareNeo/)
+  const directFaces = []
+  postcss.parse(entry).walkAtRules('font-face', rule => directFaces.push(rule))
+  assert.equal(directFaces.length, 0, 'Unrestricted duplicate faces would suppress fallback')
+})
@@ -0,0 +1,109 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs/promises')
+const path = require('node:path')
+const os = require('node:os')
+const vm = require('node:vm')
+const ts = require('typescript')
+const { execFile } = require('node:child_process')
+const { promisify } = require('node:util')
+const exec = promisify(execFile)
+const root = path.resolve(__dirname, '..')
+
+async function loadHelpers() {
+  const exports = {}
+  const code = ts.transpileModule(await fs.readFile(path.join(root, 'src/main/gitModuleImport.ts'), 'utf8'), { compilerOptions: { module: ts.ModuleKind.CommonJS } }).outputText
+  vm.runInNewContext(code, { exports, require, URL })
+  return exports
+}
+
+test('repository addresses strip credentials and reject local/helper protocols', async () => {
+  const api = await loadHelpers()
+  assert.equal(api.repositoryAddress('https://user:secret@example.com/team/module.git?token=secret'), 'https://example.com/team/module.git')
+  assert.equal(api.repositoryAddress('git@example.com:team/module.git'), 'ssh://git@example.com/team/module.git')
+  for (const url of ['file:///tmp/repo', 'ext::command', '/tmp/repo']) assert.throws(() => api.repositoryAddress(url))
+  assert.equal(api.remoteBranches('a'.repeat(40) + '\trefs/heads/main\ninvalid')[0].name, 'main')
+})
+
+test('local module discovery ignores malformed folders and rejects symlink escapes', async () => {
+  const api = await loadHelpers()
+  const dir = await fs.mkdtemp(path.join(os.tmpdir(), 'lms-git-list-'))
+  try {
+    const workspace = path.join(dir, 'workspace')
+    const folder = '[lms-nav2-custom]demo_v1.0.0_ws'
+    await fs.mkdir(path.join(workspace, folder), { recursive: true })
+    await fs.writeFile(path.join(workspace, folder, '.autonomy-studio-module.json'), JSON.stringify({ sourceType: 'CUSTOM', name: 'Demo', category: 'Control', packageName: 'demo', launchFile: 'demo.launch.py' }))
+    assert.equal((await api.listLocalGitModules(workspace))[0].name, 'Demo')
+    await fs.symlink(dir, path.join(workspace, '[lms-nav2-custom]escape_v1.0.0_ws'))
+    await assert.rejects(api.localGitModulePath(workspace, '[lms-nav2-custom]escape_v1.0.0_ws'), /outside/)
+    await assert.rejects(api.localGitModulePath(workspace, '../escape'), /Invalid/)
+    assert.equal((await api.listLocalGitModules(path.join(dir, 'missing'))).length, 0)
+  } finally { await fs.rm(dir, { recursive: true, force: true }) }
+})
+
+test('Git clone imports only the selected commit, refuses overwrite and cleans failed staging', async () => {
+  const dir = await fs.mkdtemp(path.join(os.tmpdir(), 'lms-git-import-'))
+  const repo = path.join(dir, 'source')
+  const workspace = path.join(dir, 'remote')
+  const folderName = '[lms-nav2-custom]demo_v1.0.0_ws'
+  const git = (...args) => exec('git', args, { cwd: repo })
+  try {
+    await fs.mkdir(path.join(repo, 'src/demo/launch'), { recursive: true })
+    await fs.writeFile(path.join(repo, 'src/demo/package.xml'), '<package><name>demo</name></package>')
+    await fs.writeFile(path.join(repo, 'src/demo/launch/demo.launch.py'), '# launch')
+    for (const file of ['build.sh', 'run.sh']) await fs.writeFile(path.join(repo, file), '#!/bin/bash\nexit 0\n')
+    await git('init', '-b', 'main')
+    await git('add', '.')
+    await git('-c', 'user.name=Test', '-c', 'user.email=test@example.com', 'commit', '-m', 'initial')
+    const commit = (await git('rev-parse', 'HEAD')).stdout.trim()
+    await fs.writeFile(path.join(repo, 'uncommitted.txt'), 'must not transfer')
+    let dirty = false
+    let pushed = true
+    let requestedCommit = commit
+    const index = await fs.readFile(path.join(root, 'src/main/index.ts'), 'utf8')
+    const fn = index.slice(index.indexOf('async function importRemoteGitModule('), index.indexOf('async function transferLocalWorkspaceModuleToRemote('))
+    const quote = value => "'" + value.replaceAll("'", "'\\''") + "'"
+    const context = {
+      URL, Buffer,
+      normalizeRemoteTarget: target => target,
+      validateCustomModuleScaffold: input => input,
+      inspectLocalGitModule: async () => ({ repository: 'https://example.com/module.git', dirty, pushed, branches: [{ name: 'main', commit: requestedCommit }] }),
+      remoteRepositoryUrl: () => 'file://' + repo,
+      withGitCredential: value => value,
+      customModuleConfigContent: input => JSON.stringify(input),
+      encodeBase64: value => Buffer.from(value).toString('base64'),
+      quoteShellSingle: quote,
+      expandRemotePathVar: () => [],
+      runSshOutput: async (_target, script) => (await exec('bash', ['-c', script], { timeout: 15000 })).stdout,
+    }
+    vm.runInNewContext(ts.transpileModule(fn, { compilerOptions: { target: ts.ScriptTarget.ES2022 } }).outputText, context)
+    const input = { sourceFolder: folderName, folderName, branch: 'main', commit, name: 'Remote demo', category: 'Control', packageName: 'demo', launchFile: 'demo.launch.py', dockerImage: 'vehicle:arm64' }
+    const run = () => context.importRemoteGitModule({ workspaceRoot: workspace }, repo, input)
+    dirty = true
+    await assert.rejects(run(), /커밋/)
+    dirty = false
+    pushed = false
+    await assert.rejects(run(), /푸시/)
+    pushed = true
+    assert.equal((await run()).ok, true)
+    const target = path.join(workspace, folderName)
+    assert.equal((await exec('git', ['rev-parse', 'HEAD'], { cwd: target })).stdout.trim(), commit)
+    await assert.rejects(fs.stat(path.join(target, 'uncommitted.txt')), { code: 'ENOENT' })
+    assert.equal(JSON.parse(await fs.readFile(path.join(target, '.autonomy-studio-module.json'), 'utf8')).dockerImage, 'vehicle:arm64')
+    await fs.writeFile(path.join(target, 'keep.txt'), 'keep')
+    await assert.rejects(run(), /복제에 실패/)
+    assert.equal(await fs.readFile(path.join(target, 'keep.txt'), 'utf8'), 'keep')
+    await fs.rm(target, { recursive: true })
+    requestedCommit = 'a'.repeat(40)
+    input.commit = requestedCommit
+    await assert.rejects(run(), /복제에 실패/)
+    assert.equal((await fs.readdir(workspace)).length, 0)
+    await fs.mkdir(path.join(repo, 'install'))
+    await fs.writeFile(path.join(repo, 'install/binary'), 'not portable')
+    await git('add', 'install')
+    await git('-c', 'user.name=Test', '-c', 'user.email=test@example.com', 'commit', '-m', 'bad artifacts')
+    input.commit = requestedCommit = (await git('rev-parse', 'HEAD')).stdout.trim()
+    await assert.rejects(run(), /복제에 실패/)
+    assert.equal((await fs.readdir(workspace)).length, 0)
+  } finally { await fs.rm(dir, { recursive: true, force: true }) }
+})
@@ -0,0 +1,111 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+const React = require('react')
+const { renderToStaticMarkup } = require('react-dom/server')
+
+const source = fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/WorkspaceGuidePanel.tsx'), 'utf8')
+const output = {}
+let videos = []
+vm.runInNewContext(ts.transpileModule(source, {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+}).outputText, {
+  exports: output,
+  require: name => name === '../../i18n' ? { t: key => key, useLocaleRender() {} }
+    : name === 'react' ? { ...React, useId: () => 'guide' } : require(name),
+  URL,
+  window: { learningVideo: { open: async url => { videos.push(url) } } }
+})
+
+function elements(root, predicate) {
+  if (!React.isValidElement(root)) return []
+  return [...(predicate(root) ? [root] : []), ...React.Children.toArray(root.props.children).flatMap(child => elements(child, predicate))]
+}
+
+function setup(overrides = {}) {
+  const toggled = []
+  const props = {
+    dark: true, workspaceActive: true, minimized: false, resourceMode: 'material',
+    materialItems: [{ title: 'SLAM', description: '센서 토픽과 TF 상태를 점검하고 지도를 생성합니다.', concepts: ['TF 점검', '지도 저장'], videoUrl: '' }],
+    activeMaterialIndex: 0, expandedMaterialIndexes: [0], topics: [], topicDetails: [], overview: '',
+    resources: [], downloadingResourceIds: [], onToggleMaterial: index => toggled.push(index), ...overrides
+  }
+  const tree = output.default(props)
+  const headers = elements(tree, node => node.type === 'button' && node.props['aria-controls'])
+  return { tree, headers, toggled }
+}
+
+for (const dark of [false, true]) {
+  test(`only the material header toggles the card (${dark ? 'dark' : 'light'})`, () => {
+    const { tree, headers, toggled } = setup({ dark })
+    assert.equal(headers.length, 1)
+    const header = headers[0]
+    assert.equal(header.props.type, 'button')
+    assert.equal(header.props['aria-expanded'], true)
+    assert.equal(header.props.disabled, false)
+    assert.doesNotMatch(header.props.className, /hover:bg/)
+    assert.match(header.props.className, /focus-visible:ring-2/)
+    const card = elements(tree, node => node.type === 'section' && React.Children.toArray(node.props.children).some(child => child.props?.['aria-controls'] === header.props['aria-controls']))[0]
+    assert.ok(card)
+    assert.equal(card.props.onClick, undefined)
+    assert.equal(card.props.onKeyDown, undefined)
+    assert.equal(card.props.role, undefined)
+    assert.equal(card.props.tabIndex, undefined)
+    header.props.onClick()
+    assert.deepEqual(toggled, [0])
+  })
+
+  test(`description is selectable outside the interactive header (${dark ? 'dark' : 'light'})`, () => {
+    const { tree, headers, toggled } = setup({ dark })
+    const contentId = headers[0].props['aria-controls']
+    const body = elements(tree, node => node.props.id === contentId)[0]
+    assert.match(body.props.className, /select-text/)
+    assert.equal(body.props.onClick, undefined)
+    assert.equal(elements(headers[0], node => node.props.id === contentId).length, 0)
+    assert.ok(renderToStaticMarkup(body).includes('센서 토픽과 TF 상태'))
+    assert.equal(elements(body, node => Boolean(node.props.onClick || node.props.onKeyDown)).length, 0)
+    assert.deepEqual(toggled, [])
+  })
+
+  test(`header padding and dimensions stay identical when toggled (${dark ? 'dark' : 'light'})`, () => {
+    const expanded = setup({ dark, expandedMaterialIndexes: [0] })
+    const collapsed = setup({ dark, expandedMaterialIndexes: [] })
+    for (const state of [expanded, collapsed]) {
+      const header = state.headers[0]
+      const card = elements(state.tree, node => node.type === 'section' && React.Children.toArray(node.props.children).some(child => child.props?.['aria-controls'] === header.props['aria-controls']))[0]
+      assert.match(card.props.className, /\bpx-3 pt-3\b/)
+      assert.doesNotMatch(card.props.className, /px-2\.5|pt-2\.5/)
+      assert.match(header.props.className, /\bflex h-6 w-full\b/)
+    }
+    assert.equal(expanded.headers[0].props.className, collapsed.headers[0].props.className)
+  })
+}
+
+test('future material remains disabled, while previous/current steps keep native keyboard buttons', () => {
+  const items = ['이전', '현재', '다음'].map(title => ({ title, description: '', videoUrl: '' }))
+  const { headers } = setup({ materialItems: items, activeMaterialIndex: 1, expandedMaterialIndexes: [1] })
+  assert.deepEqual(headers.map(header => header.props.disabled), [false, false, true])
+  assert.equal(headers[2].props.onClick, undefined)
+  for (const header of headers) {
+    assert.equal(header.props.type, 'button')
+    assert.equal(header.props.onKeyDown, undefined)
+  }
+  assert.ok(setup({ materialItems: items, allowFutureMaterialSteps: true }).headers.every(header => !header.props.disabled))
+})
+
+test('video playback is not nested in the collapse button and does not toggle the card', async () => {
+  videos = []
+  const { tree, headers, toggled } = setup({ materialItems: [{ title: 'SLAM', description: '설명', videoUrl: 'https://www.youtube.com/watch?v=test123' }] })
+  const video = elements(tree, node => node.type === 'button' && node.props.className?.includes('aspect-video'))[0]
+  assert.ok(video)
+  assert.equal(elements(headers[0], node => node === video).length, 0)
+  video.props.onClick({ stopPropagation() {} })
+  await Promise.resolve()
+  assert.deepEqual(videos, ['https://www.youtube.com/embed/test123'])
+  assert.deepEqual(toggled, [])
+  for (const button of elements(tree, node => node.type === 'button')) {
+    assert.equal(React.Children.toArray(button.props.children).flatMap(child => elements(child, node => node.type === 'button')).length, 0)
+  }
+})
@@ -0,0 +1,298 @@
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const path = require('node:path')
+const vm = require('node:vm')
+const { test } = require('node:test')
+const ts = require('typescript')
+const { createInstance } = require('i18next')
+
+const root = path.resolve(__dirname, '../src/renderer/src')
+const dictionary = JSON.parse(fs.readFileSync(path.join(root, 'i18n/en.json'), 'utf8'))
+
+test('only the default simulation description follows language; vehicle and custom text stay unchanged', () => {
+  const { api } = setup('ko')
+  const exports = {}
+  const source = fs.readFileSync(path.join(root, 'features/platforms/PlatformCards.tsx'), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022,
+    jsx: ts.JsxEmit.ReactJSX, esModuleInterop: true
+  } }).outputText
+  vm.runInNewContext(code, { exports, require: name => name === '../../i18n'
+    ? { ...api, useLocaleRender() {} } : require(name) })
+  const { createElement } = require('react')
+  const { renderToStaticMarkup } = require('react-dom/server')
+  const description = '내 PC에서 직접 개발 환경을 실행합니다.'
+  const platform = { id: 'local', platformKey: 'futuredrive-local-pc', title: '로컬 PC', description, state: 'ready' }
+  const render = value => renderToStaticMarkup(createElement(exports.PlatformOptionCard, {
+    platform: value, Icon: () => null, dotClassName: '', unavailable: false,
+    statusPending: false, displayStatus: '사용 가능', primaryAction: '연결',
+    actionDisabled: false, running: false, onAction() {}, onSettings() {}
+  }))
+  assert.ok(render(platform).includes(description))
+  api.setLanguage('en')
+  assert.ok(render(platform).includes('Run the development environment directly on this PC.'))
+  assert.ok(!render(platform).includes(description))
+  const vehicleDescription = '기초 SLAM 및 자율주행 실습 장비입니다.'
+  assert.ok(render({ ...platform, platformKey: 'mk-mini', description: vehicleDescription }).includes(vehicleDescription))
+  assert.ok(render({ ...platform, platformKey: 'mk-mini' }).includes(description))
+  assert.ok(render({ ...platform, description: '강사가 작성한 시뮬레이션 안내' }).includes('강사가 작성한 시뮬레이션 안내'))
+  assert.ok(render({ ...platform, description: '설정' }).includes('>설정</p>'))
+  api.setLanguage('ko')
+  assert.ok(render(platform).includes(description))
+  assert.equal(platform.description, description)
+})
+
+test('close studio modal translates the built-in Local PC title but preserves vehicle names', () => {
+  const source = fs.readFileSync(path.join(root, 'App.tsx'), 'utf8')
+  const expression = source.match(/platformTitle=\{(runningPlatformCloseTarget\.platformKey[^\n]+)\}/)?.[1]
+  assert.ok(expression)
+  for (const language of ['en', 'ko']) {
+    const { api } = setup(language)
+    const title = vm.runInNewContext(expression, {
+      runningPlatformCloseTarget: { platformKey: 'futuredrive-local-pc', title: '로컬 PC' }, t: api.t
+    })
+    assert.equal(title, language === 'en' ? 'Local PC' : '로컬 PC')
+    if (language === 'en') assert.equal(api.t('{{v0}} 개발 스튜디오를 종료할까요?', { v0: title }), 'Close the Local PC studio?')
+    assert.equal(vm.runInNewContext(expression, {
+      runningPlatformCloseTarget: { platformKey: 'vehicle', title: '교육용 차량' }, t: api.t
+    }), '교육용 차량')
+  }
+})
+
+test('session confirmation uses a localized platform display name', () => {
+  const source = fs.readFileSync(path.join(root, 'App.tsx'), 'utf8')
+  const expression = source.match(/const activePlatformDisplayName = ([\s\S]*?)\n  const sessionPlatformLabel/)[1]
+  for (const language of ['en', 'ko']) {
+    const { api } = setup(language)
+    const name = vm.runInNewContext(expression, {
+      workspacePlatform: null,
+      sessionPlatform: { platformKey: 'futuredrive-local-pc' },
+      activePlatformName: '로컬 PC', t: api.t
+    })
+    assert.equal(name, language === 'en' ? 'Local PC' : '로컬 PC')
+    if (language === 'en') assert.equal(api.t('{{v0}} 개발 스튜디오 연결만 종료합니다. 플랫폼 제어권은 반납되지 않습니다.', { v0: name }),
+      'Disconnect from the Local PC studio only. Platform control is retained.')
+    assert.equal(vm.runInNewContext(expression, {
+      workspacePlatform: { platformKey: 'vehicle' }, sessionPlatform: null,
+      activePlatformName: '교육용 차량', t: api.t
+    }), '교육용 차량')
+  }
+  assert.match(source, /<SessionConfirmModal[\s\S]*?platformName=\{activePlatformDisplayName\}/)
+})
+
+test('close and disconnect modals localize raw Local PC names at render time', () => {
+  const source = fs.readFileSync(path.join(root, 'components/AppStatusModals.tsx'), 'utf8')
+  for (const [key, variable] of [
+    ['{{v0}} 개발 스튜디오를 종료할까요?', 'platformTitle'],
+    ['{{v0}} 개발 스튜디오 연결만 종료합니다. 플랫폼 제어권은 반납되지 않습니다.', 'platformName']
+  ]) {
+    const line = source.split('\n').find(line => line.includes(key))
+    const expression = line.match(/v0: (.*?) \}/)[1]
+    for (const language of ['ko', 'en']) {
+      const { api } = setup(language)
+      const name = vm.runInNewContext(expression, { [variable]: '로컬 PC', t: api.t })
+      assert.equal(name, language === 'en' ? 'Local PC' : '로컬 PC')
+      if (language === 'en') assert.ok(!api.t(key, { v0: name }).includes('로컬'))
+      assert.equal(vm.runInNewContext(expression, { [variable]: 'Yahboom Micro #02', t: api.t }), 'Yahboom Micro #02')
+    }
+  }
+})
+
+test('all execution guide page titles have English translations', () => {
+  const source = fs.readFileSync(path.join(root, 'features/workspace/ModuleListView.tsx'), 'utf8')
+  const titles = [...source.matchAll(/environment: '([^']+)'/g)].map(match => match[1])
+  assert.equal(titles.length, 4)
+  for (const title of titles) assert.ok(dictionary[title], title)
+})
+
+test('visualization progress uses exact runtime translation keys', () => {
+  const { api } = setup('en')
+  assert.equal(api.t('맵 환경 준비 중'), 'Preparing map environment')
+  assert.equal(api.t('시작 중'), 'Starting')
+  assert.equal(api.t('종료 중'), 'Stopping')
+  const panel = fs.readFileSync(path.join(root, 'features/workspace/WorkspaceVisualizationPanel.tsx'), 'utf8')
+  assert.ok(panel.includes('busy ? t(statusMessage)'))
+})
+
+test('viewer translates before 3D initialization and accepts language only from its parent', () => {
+  const events = new Map()
+  const sent = []
+  const parent = { postMessage: message => sent.push(message) }
+  const label = { dataset: { i18n: '응답을 기다리는 중입니다.' }, textContent: '' }
+  const document = {
+    documentElement: {},
+    querySelectorAll: selector => selector === '[data-i18n]' ? [label] : []
+  }
+  const source = fs.readFileSync(path.join(root, '../public/slam-viewer/locale.js'), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, allowJs: true
+  } }).outputText
+  vm.runInNewContext(code, {
+    exports: {}, document,
+    localStorage: { getItem: () => 'ko' },
+    window: { parent, addEventListener: (type, listener) => events.set(type, listener) }
+  })
+  assert.equal(sent[0].type, 'lms:language:ready')
+  events.get('message')({ source: {}, data: { type: 'lms:language', language: 'en' } })
+  assert.equal(label.textContent, '응답을 기다리는 중입니다.')
+  events.get('message')({ source: parent, data: { type: 'lms:language', language: 'en' } })
+  assert.equal(label.textContent, 'Waiting for a response.')
+  events.get('message')({ source: parent, data: { type: 'lms:language', language: 'ko' } })
+  assert.equal(label.textContent, '응답을 기다리는 중입니다.')
+  const html = fs.readFileSync(path.join(root, '../public/slam-viewer/index.html'), 'utf8')
+  assert.ok(html.includes('<script type="module" src="./locale.js"></script>'))
+})
+
+function setup(savedLanguage, storageBlocked = false) {
+  const instance = createInstance()
+  const storage = new Map([['autonomy-studio.lms.language', savedLanguage]])
+  const events = new Map()
+  const document = { documentElement: { lang: '' } }
+  const exports = {}
+  const source = fs.readFileSync(path.join(root, 'i18n/index.ts'), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, esModuleInterop: true
+  } }).outputText
+  vm.runInNewContext(code, {
+    exports, document,
+    localStorage: {
+      getItem(key) { if (storageBlocked) throw Error('blocked'); return storage.get(key) },
+      setItem(key, value) { if (storageBlocked) throw Error('blocked'); storage.set(key, value) }
+    },
+    window: { addEventListener: (name, listener) => events.set(name, listener) },
+    require(name) {
+      if (name === 'i18next') return instance
+      if (name === './en.json') return dictionary
+      return require(name)
+    }
+  })
+  return { api: exports, storage, document, events }
+}
+
+test('Korean defaults, English persists, interpolation and fallback preserve user content', () => {
+  const { api, storage, document } = setup('invalid')
+  assert.equal(api.t('설정'), '설정')
+  assert.equal(document.documentElement.lang, 'ko')
+  api.setLanguage('en')
+  assert.equal(api.t('설정'), 'Settings')
+  assert.equal(api.t('{{week}}주차', { week: 3 }), 'Week 3')
+  assert.equal(api.t('강사가 작성한 강좌 제목'), '강사가 작성한 강좌 제목')
+  assert.equal(api.t('sim_mode:=false'), 'sim_mode:=false')
+  assert.equal(storage.get(api.LANGUAGE_STORAGE_KEY), 'en')
+  assert.equal(document.documentElement.lang, 'en')
+  api.setLanguage('ko')
+  assert.equal(api.t('{{week}}주차', { week: 3 }), '3주차')
+})
+
+test('restores preference and synchronizes other renderer windows', () => {
+  const { api, document, events } = setup('en')
+  assert.equal(api.t('설정'), 'Settings')
+  events.get('storage')({ key: api.LANGUAGE_STORAGE_KEY, newValue: 'ko' })
+  assert.equal(document.documentElement.lang, 'ko')
+})
+
+test('blocked storage does not prevent switching language', () => {
+  const { api } = setup(undefined, true)
+  api.setLanguage('en')
+  assert.equal(api.t('설정'), 'Settings')
+})
+
+test('language selector edits a draft without applying or persisting it', () => {
+  const { api, storage, document } = setup('ko')
+  const exports = {}
+  const source = fs.readFileSync(path.join(root, 'i18n/LanguageSelect.tsx'), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022,
+    jsx: ts.JsxEmit.ReactJSX, esModuleInterop: true
+  } }).outputText
+  vm.runInNewContext(code, { exports, require: name => name === './index' ? api : require(name) })
+  let draft = 'ko'
+  const element = exports.default({ dark: false, value: draft, onChange: value => { draft = value } })
+  const select = element.props.children.find(child => child.type === 'select')
+  select.props.onChange({ target: { value: 'en' } })
+  assert.equal(draft, 'en')
+  assert.equal(document.documentElement.lang, 'ko')
+  assert.equal(storage.get(api.LANGUAGE_STORAGE_KEY), 'ko')
+})
+
+test('built-in map labels follow language without changing map data or saved names', () => {
+  const { api } = setup('ko')
+  const exports = {}
+  const source = fs.readFileSync(path.join(root, 'features/workspace/WorldMapSelectorModal.tsx'), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022,
+    jsx: ts.JsxEmit.ReactJSX, esModuleInterop: true
+  } }).outputText
+  vm.runInNewContext(code, { exports, require: name => {
+    if (name === '../../i18n') return api
+    if (name === './studioTheme') return { useStudioTheme: () => 'dark' }
+    if (name.endsWith('.css')) return {}
+    return require(name)
+  } })
+  const map = exports.NAV2_MAP_OPTIONS[0]
+  assert.equal(exports.getMapDisplayName(map), '기본 월드')
+  api.setLanguage('en')
+  assert.equal(exports.getMapDisplayName(map), 'Default world')
+  assert.equal(exports.getMapDisplayName({ ...map, saved: true }), '기본 월드')
+  assert.equal(map.name, '기본 월드')
+  assert.equal(map.worldFile, 'turtlebot3_world.world')
+  assert.equal(api.t('새 2D 맵'), 'New 2D map')
+  assert.equal(api.t('새 3D 맵'), 'New 3D map')
+})
+
+test('translations preserve every interpolation placeholder', () => {
+  const placeholders = value => [...value.matchAll(/{{\s*([^}]+)\s*}}/g)].map(match => match[1]).sort()
+  for (const [key, value] of Object.entries(dictionary)) {
+    assert.ok(value.trim(), `Empty translation: ${key}`)
+    assert.deepEqual(placeholders(value), placeholders(key), key)
+  }
+})
+
+test('learning statistics translate API labels but preserve numeric values', () => {
+  const { api } = setup('ko')
+  const exports = {}
+  const source = fs.readFileSync(path.join(root, 'features/curriculum/LearningStatsCard.tsx'), 'utf8')
+  const code = ts.transpileModule(source, { compilerOptions: {
+    module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022,
+    jsx: ts.JsxEmit.ReactJSX, esModuleInterop: true
+  } }).outputText
+  vm.runInNewContext(code, { exports, require: name => name === '../../i18n'
+    ? { ...api, useLocaleRender() {} } : require(name) })
+  const stats = [
+    { key: 'weeks', label: '완료한 주차', value: '0/3', iconKey: 'check' },
+    { key: 'time', label: '학습 시간', value: '02:08', iconKey: 'clock' },
+    { key: 'commits', label: '커밋 수', value: '0', iconKey: 'trending' },
+    { key: 'score', label: '평균 점수', value: '0', iconKey: 'gauge' }
+  ]
+  const { createElement } = require('react')
+  const { renderToStaticMarkup } = require('react-dom/server')
+  const render = () => renderToStaticMarkup(createElement(exports.default, { stats }))
+  assert.ok(render().includes('완료한 주차'))
+  api.setLanguage('en')
+  const html = render()
+  for (const text of ['Completed weeks', 'Learning time', 'Commits', 'Average score', '0/3', '02:08']) {
+    assert.ok(html.includes(text), text)
+  }
+  for (const item of stats) assert.ok(!html.includes(item.label), item.label)
+  api.setLanguage('ko')
+  assert.ok(render().includes('평균 점수'))
+})
+
+test('all literal translation calls have an English entry', () => {
+  function check(dir) {
+    for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+      const file = path.join(dir, entry.name)
+      if (entry.isDirectory()) { check(file); continue }
+      if (!/\.tsx?$/.test(file)) continue
+      const source = ts.createSourceFile(file, fs.readFileSync(file, 'utf8'), ts.ScriptTarget.Latest, true)
+      function visit(node) {
+        if (ts.isCallExpression(node) && node.expression.getText(source) === 't' && node.arguments[0] && ts.isStringLiteral(node.arguments[0])) {
+          assert.ok(Object.hasOwn(dictionary, node.arguments[0].text), `${file}: ${node.arguments[0].text}`)
+        }
+        ts.forEachChild(node, visit)
+      }
+      visit(source)
+    }
+  }
+  check(root)
+})
@@ -0,0 +1,37 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+function setup() {
+  const data = new Map()
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(fs.readFileSync(require.resolve('../src/renderer/src/features/workspace/sourceSettings.ts'), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 },
+  }).outputText, {
+    exports,
+    require: () => ({ STUDIO_SOURCE_SETTINGS_STORAGE_KEY: 'test-settings' }),
+    window: { localStorage: { getItem: key => data.get(key) ?? null, setItem: (key, value) => data.set(key, value) } },
+  })
+  return exports
+}
+
+test('remote workspace reads local domain and linked platform by actual platform ID', () => {
+  const api = setup()
+  api.storeStudioSourceSettings('local-platform-uuid', { ...api.defaultStudioSourceSettings, rosDomainId: '75', rosLinkedPlatformId: 'yahboom-uuid' })
+  const result = api.readLocalStudioSourceSettings([
+    { id: 'yahboom-uuid', platformKey: 'yahboom', sourceSettings: { rosDomainId: '77' } },
+    { id: 'local-platform-uuid', platformKey: 'futuredrive-local-pc' },
+  ])
+  assert.equal(result.rosDomainId, '75')
+  assert.equal(result.rosLinkedPlatformId, 'yahboom-uuid')
+})
+
+test('local platform defaults and unlinked selection are preserved', () => {
+  const api = setup()
+  const platforms = [{ id: 'local-platform-uuid', platformKey: 'futuredrive-local-pc', sourceSettings: { rosDomainId: '76' } }]
+  assert.equal(api.readLocalStudioSourceSettings(platforms).rosDomainId, '76')
+  api.storeStudioSourceSettings('local-platform-uuid', { ...api.defaultStudioSourceSettings, rosDomainId: '75', rosLinkedPlatformId: null })
+  assert.equal(api.readLocalStudioSourceSettings(platforms).rosLinkedPlatformId, null)
+})
@@ -0,0 +1,86 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+const source = ts.createSourceFile('App.tsx', fs.readFileSync(require.resolve('../src/renderer/src/App.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+const names = ['isRemotePlatformStatusPending', 'filteredPlatformOptions', 'platformFilterCounts']
+const declarations = new Map()
+function visit(node) {
+  if (ts.isVariableDeclaration(node) && names.includes(node.name.getText(source))) {
+    declarations.set(node.name.getText(source), node.getText(source))
+  }
+  ts.forEachChild(node, visit)
+}
+visit(source)
+for (const name of names) assert.ok(declarations.has(name), `missing ${name}`)
+const filterScript = ts.transpileModule(`${names.map(name => `const ${declarations.get(name)}`).join('\n')}
+  result = { counts: platformFilterCounts, ids: filteredPlatformOptions.map(platform => platform.id) }`, {
+  compilerOptions: { target: ts.ScriptTarget.ES2022 }
+}).outputText
+const controlSource = fs.readFileSync(require.resolve('../src/renderer/src/features/platforms/platformControl.ts'), 'utf8')
+const control = {}
+vm.runInNewContext(ts.transpileModule(controlSource, { compilerOptions: { module: ts.ModuleKind.CommonJS } }).outputText, {
+  exports: control,
+  require: name => {
+    assert.equal(name, '../../config/appConfig')
+    return { LMS_API_BASE_URL: 'http://unused.invalid' }
+  }
+})
+
+function classify(platformOptions, checkedIds = ['mini'], platformFilter = 'all') {
+  const context = {
+    platformOptions, platformFilter,
+    checkedRemotePlatformStatusIds: new Set(checkedIds),
+    isPlatformUnavailable: control.isPlatformUnavailable
+  }
+  vm.runInNewContext(filterScript, context)
+  return JSON.parse(JSON.stringify(context.result))
+}
+
+const simulation = { id: 'sim', platformKey: 'futuredrive-local-pc', state: 'ready', status: '사용 가능', action: '시작' }
+const mini = { id: 'mini', platformKey: 'mkmini', state: 'ready', status: '사용 가능', action: '제어권 요청', connection: { headscaleOnline: true, agentHealthy: true } }
+
+test('disconnected ready platform counts as unavailable and appears only in that tab', () => {
+  const disconnected = { ...mini, status: '연결 끊김', connection: { headscaleOnline: false, agentHealthy: false } }
+  const platforms = [simulation, disconnected]
+  assert.deepEqual(classify(platforms), { counts: { all: 2, available: 1, unavailable: 1 }, ids: ['sim', 'mini'] })
+  assert.deepEqual(classify(platforms, ['mini'], 'available').ids, ['sim'])
+  assert.deepEqual(classify(platforms, ['mini'], 'unavailable').ids, ['mini'])
+})
+
+test('offline network, unhealthy agent and explicit unavailability all exclude ready platforms', () => {
+  for (const patch of [
+    { connection: { headscaleOnline: false, agentHealthy: true } },
+    { connection: { headscaleOnline: true, agentHealthy: false } },
+    { connection: undefined, status: '연결 끊김' },
+    { connection: undefined, status: '연결 불가' },
+    { connection: undefined, action: '연결 불가' }
+  ]) {
+    const platforms = [simulation, { ...mini, ...patch }]
+    assert.deepEqual(classify(platforms).counts, { all: 2, available: 1, unavailable: 1 })
+    assert.deepEqual(classify(platforms, ['mini'], 'unavailable').ids, ['mini'])
+  }
+})
+
+test('pending remote status remains in All without prematurely entering either availability tab', () => {
+  const platforms = [simulation, mini]
+  assert.deepEqual(classify(platforms, []).counts, { all: 2, available: 1, unavailable: 0 })
+  assert.deepEqual(classify(platforms, [], 'available').ids, ['sim'])
+  assert.deepEqual(classify(platforms, [], 'unavailable').ids, [])
+})
+
+test('reconnecting moves a platform back to available without changing All', () => {
+  assert.deepEqual(classify([simulation, mini]).counts, { all: 2, available: 2, unavailable: 0 })
+  assert.deepEqual(classify([simulation, mini], ['mini'], 'available').ids, ['sim', 'mini'])
+  assert.deepEqual(classify([simulation, mini], ['mini'], 'unavailable').ids, [])
+})
+
+test('locked, requested and reserved platform classifications are preserved', () => {
+  for (const state of ['locked', 'request', 'reserved']) {
+    const platforms = [simulation, { ...mini, state }]
+    assert.deepEqual(classify(platforms).counts, { all: 2, available: 1, unavailable: 1 })
+    assert.deepEqual(classify(platforms, ['mini'], 'unavailable').ids, ['mini'])
+  }
+})
@@ -0,0 +1,85 @@
+const assert = require('node:assert/strict')
+const { test } = require('node:test')
+const { readFileSync, mkdtempSync, writeFileSync, rmSync } = require('node:fs')
+const { tmpdir } = require('node:os')
+const { join } = require('node:path')
+const { spawn } = require('node:child_process')
+const vm = require('node:vm')
+const ts = require('typescript')
+
+const transpile = (source) => ts.transpileModule(source, {
+  compilerOptions: { target: ts.ScriptTarget.ES2022, module: ts.ModuleKind.CommonJS }
+}).outputText
+const helpers = { exports: {} }
+vm.runInNewContext(transpile(readFileSync(join(__dirname, '../src/main/remoteShell.ts'), 'utf8')), helpers)
+const { remoteShellCommand, remoteShellEnvironment } = helpers.exports
+const source = readFileSync(join(__dirname, '../src/main/index.ts'), 'utf8')
+const start = source.indexOf('async function runCommandOutput(')
+const end = source.indexOf('\nasync function runCommand(', start)
+const context = { spawn, process, setTimeout, clearTimeout, createModuleProgressParser: () => () => {} }
+vm.runInNewContext(transpile(source.slice(start, end)), context)
+const run = context.runCommandOutput
+
+test('SSH data output excludes locale warnings even when command succeeds', async () => {
+  const result = await run('/bin/bash', ['--noprofile', '--norc', '-c', 'printf %s "/tmp/module with spaces"'], undefined,
+    { LC_ALL: 'missing_TEST.UTF-8' }, 5000, 'stdout')
+  assert.equal(result, '/tmp/module with spaces')
+})
+
+test('failed commands retain stderr diagnostics and stdout', async () => {
+  await assert.rejects(run('/bin/sh', ['-c', 'printf context; printf "permission denied" >&2; exit 7'], undefined, undefined, 5000, 'stdout'),
+    error => error.message.includes('context') && error.message.includes('permission denied'))
+})
+
+test('non-SSH combined output stays compatible and explicit log merging works', async () => {
+  const command = 'printf output; printf diagnostic >&2'
+  const combined = await run('/bin/sh', ['-c', command])
+  assert.match(combined, /output/)
+  assert.match(combined, /diagnostic/)
+  const logs = await run('/bin/sh', ['-c', `{ ${command}; } 2>&1`], undefined, undefined, 5000, 'stdout')
+  assert.match(logs, /diagnostic/)
+})
+
+test('SSH environment neutralizes locale forwarding without losing other settings', () => {
+  const original = { LANG: 'ko_KR.UTF-8', LC_ALL: 'en_US.UTF-8', LC_CTYPE: 'bad', LANGUAGE: 'ko:en', PATH: '/bin', TERM: 'xterm-256color' }
+  const env = remoteShellEnvironment(original)
+  assert.equal(env.LANG, 'C')
+  assert.equal(env.LC_ALL, 'C')
+  assert.equal(env.LC_CTYPE, undefined)
+  assert.equal(env.LANGUAGE, undefined)
+  assert.equal(env.PATH, '/bin')
+  assert.equal(env.TERM, 'xterm-256color')
+  assert.equal(original.LC_CTYPE, 'bad')
+})
+
+test('remote wrapper preserves multiline commands, Unicode, quotes and exit status', async () => {
+  const command = `cat <<'END'
+/tmp/한글 module's folder
+END`
+  const result = await run('/bin/sh', ['-c', remoteShellCommand(command)], undefined, remoteShellEnvironment(process.env), 5000, 'stdout')
+  assert.equal(result, "/tmp/한글 module's folder\n")
+  await assert.rejects(run('/bin/sh', ['-c', remoteShellCommand('echo remote-failure >&2; exit 9')], undefined, undefined, 5000, 'stdout'), /remote-failure/)
+})
+
+test('locale selection prefers C UTF-8, supports other UTF-8 locales and falls back to C', async () => {
+  const dir = mkdtempSync(join(tmpdir(), 'lms-locale-test-'))
+  try {
+    for (const [locales, expected] of [['en_GB.utf8 C.utf8', 'C.utf8'], ['C en_GB.utf8', 'en_GB.utf8'], ['C POSIX', 'C']]) {
+      writeFileSync(join(dir, 'locale'), `#!/bin/sh\nprintf '%s\\n' ${locales}\n`, { mode: 0o755 })
+      const result = await run('/bin/sh', ['-c', remoteShellCommand('printf "%s|%s" "$LANG" "$LC_ALL"')], undefined,
+        { PATH: `${dir}:${process.env.PATH}`, LC_ALL: 'C' }, 5000, 'stdout')
+      assert.equal(result, `${expected}|${expected}`)
+    }
+  } finally { rmSync(dir, { recursive: true, force: true }) }
+})
+
+test('queued SSH, stats probes and remote PTY use normalization; container logs keep stderr', () => {
+  const ssh = source.slice(source.indexOf('async function runSshOutput('), source.indexOf('async function readRemoteDockerStatsOutput('))
+  assert.equal((ssh.match(/remoteShellCommand\(command\)/g) || []).length, 2)
+  assert.equal((ssh.match(/'stdout'/g) || []).length, 2)
+  const terminal = source.slice(source.indexOf("ipcMain.handle('remote-workspace:terminal:start'"), source.indexOf("ipcMain.handle('terminal-resize'"))
+  assert.match(terminal, /remoteShellCommand\(mode === 'container'/)
+  assert.match(terminal, /remoteShellEnvironment\(terminalEnvironment/)
+  assert.match(source, /target \? remoteShellCommand\(init\)/)
+  assert.match(source, /docker logs --timestamps --tail 300.*2>&1/)
+})
@@ -0,0 +1,87 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const path = require('node:path')
+const vm = require('node:vm')
+const ts = require('typescript')
+const exportsObject = {}
+const source = fs.readFileSync(path.resolve(__dirname, '../src/renderer/src/features/workspace/WorkspaceRosConnectionsView.tsx'), 'utf8')
+vm.runInNewContext(ts.transpileModule(source, {
+  compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+}).outputText, { exports: exportsObject, require: () => ({}) })
+const { rosGraphConnections } = exportsObject
+const endpoint = (node, type = 'sensor_msgs/msg/CompressedImage') => ({ node, type })
+
+test('shows image and custom topics without module definitions', () => {
+  const connections = rosGraphConnections({ topics: [
+    { name: '/camera/image/compressed', types: ['sensor_msgs/msg/CompressedImage'], publishers: [endpoint('/camera')], subscribers: [endpoint('/bridge')] },
+    { name: '/custom/new_topic', types: ['custom_msgs/msg/Value'], publishers: [], subscribers: [endpoint('/custom', 'custom_msgs/msg/Value')] },
+  ] })
+  assert.equal(connections.length, 2)
+  assert.equal(connections[0].topic.name, '/camera/image/compressed')
+  assert.equal(connections[0].topic.type, 'sensor_msgs/msg/CompressedImage')
+  assert.equal(connections[0].active, true)
+  assert.equal(connections[1].publishers.length, 0)
+  assert.equal(connections[1].active, false)
+})
+
+test('empty and failed queries never synthesize topics or nodes', () => {
+  assert.equal(rosGraphConnections({ topics: [] }).length, 0)
+  assert.equal(rosGraphConnections({ topics: [], message: 'SSH timeout' }).length, 0)
+})
+
+test('keeps discovered topics without endpoints and deduplicates node entries', () => {
+  const connections = rosGraphConnections({ topics: [
+    { name: '/z', types: [], publishers: [], subscribers: [] },
+    { name: '/a', types: ['sensor_msgs/msg/CompressedImage'], publishers: [endpoint('/camera'), endpoint('/camera')], subscribers: [] },
+  ] })
+  assert.equal(connections.length, 2)
+  assert.equal(connections[0].topic.name, '/a')
+  assert.equal(connections[0].publishers.length, 1)
+  assert.equal(connections[1].topic.name, '/z')
+  assert.equal(connections.every((connection) => !connection.active), true)
+})
+
+test('module selection and guessed topic mappings are removed from the view', () => {
+  assert.doesNotMatch(source, /selectedModuleKeys|moduleTopics|fallbackPublishers|fallbackSubscribers|onToggleModule|ListChecks|ListX/)
+})
+
+test('active toggle filters only topics, preserves totals and hides filtered details', () => {
+  const graph = { topics: [
+    { name: '/active', types: [], publishers: [endpoint('/pub')], subscribers: [endpoint('/sub')] },
+    { name: '/waiting', types: [], publishers: [endpoint('/pub')], subscribers: [] },
+  ] }
+  function render(activeOnly) {
+    const states = [graph, false, activeOnly, '/waiting', true, 320]
+    let index = 0
+    const api = {}
+    const jsx = (type, props, key) => ({ type, props, key })
+    vm.runInNewContext(ts.transpileModule(source, {
+      compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, jsx: ts.JsxEmit.ReactJSX }
+    }).outputText, { exports: api, require: (name) => {
+      if (name === 'react') return { useState: () => [states[index++], () => {}], useMemo: fn => fn(), useEffect: () => {} }
+      if (name === 'react/jsx-runtime') return { jsx, jsxs: jsx }
+      if (name === '../../i18n') return { t: value => value, useLocaleRender: () => {} }
+      return {}
+    } })
+    const tree = api.default({ dark: false, modules: [{ name: 'Running module', state: 'running' }], remoteWorkspace: false, rosDomainId: '77' })
+    const nodes = []
+    function visit(node) {
+      if (Array.isArray(node)) return node.forEach(visit)
+      if (!node || typeof node !== 'object') return
+      nodes.push(node)
+      visit(node.props?.children)
+    }
+    visit(tree)
+    return nodes
+  }
+  for (const activeOnly of [false, true]) {
+    const nodes = render(activeOnly)
+    assert.equal(nodes.filter(node => node.type === 'button' && node.key?.startsWith('/')).length, activeOnly ? 1 : 2)
+    const toggle = nodes.find(node => node.props?.title === '활성 연결만 보기')
+    assert.equal(toggle.props['aria-pressed'], activeOnly)
+    assert.equal(toggle.props.children.at(-1), 1)
+    assert.equal(nodes.find(node => node.type?.name === 'RuntimeLane').props.modules.length, 1)
+    assert.equal(nodes.some(node => node.type?.name === 'TopicDetailDrawer'), !activeOnly)
+  }
+})
@@ -0,0 +1,66 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs')
+const path = require('node:path')
+const vm = require('node:vm')
+const ts = require('typescript')
+const root = path.resolve(__dirname, '../src/renderer/src/features/workspace')
+
+function setup(saved, blocked = false) {
+  const storage = new Map([['autonomy-studio.lms.studio-theme', saved]])
+  const events = new Map()
+  const exports = {}
+  const code = ts.transpileModule(fs.readFileSync(path.join(root, 'studioTheme.ts'), 'utf8'), {
+    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 }
+  }).outputText
+  vm.runInNewContext(code, { exports,
+    require: () => ({ useSyncExternalStore: (_subscribe, snapshot) => snapshot() }),
+    localStorage: {
+      getItem(key) { if (blocked) throw Error('blocked'); return storage.get(key) },
+      setItem(key, value) { if (blocked) throw Error('blocked'); storage.set(key, value) }
+    },
+    window: { addEventListener: (type, listener) => events.set(type, listener) }
+  })
+  return { api: exports, storage, events }
+}
+
+test('theme defaults dark, persists light, and restores the preference', () => {
+  const { api, storage } = setup('invalid')
+  assert.equal(api.useStudioTheme(), 'dark')
+  api.setStudioTheme('light')
+  assert.equal(api.useStudioTheme(), 'light')
+  assert.equal(storage.get(api.STUDIO_THEME_KEY), 'light')
+  assert.equal(setup('light').api.useStudioTheme(), 'light')
+})
+test('theme remains usable when storage is blocked', () => {
+  const { api } = setup(null, true)
+  api.setStudioTheme('light')
+  assert.equal(api.useStudioTheme(), 'light')
+})
+test('theme synchronizes across windows without writing runtime settings', () => {
+  const { api, storage, events } = setup('dark')
+  storage.set(api.STUDIO_THEME_KEY, 'light')
+  events.get('storage')({ key: api.STUDIO_THEME_KEY })
+  assert.equal(api.useStudioTheme(), 'light')
+  storage.clear()
+  events.get('storage')({ key: null })
+  assert.equal(api.useStudioTheme(), 'dark')
+})
+
+test('module content scrollbar uses workspace colors without thinner scrollbar dimensions', () => {
+  const source = ts.createSourceFile('ModuleListView.tsx', fs.readFileSync(path.join(root, 'ModuleListView.tsx'), 'utf8'), ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX)
+  const scrollClasses = []
+  function visit(node) {
+    if (ts.isJsxAttribute(node) && node.name.getText(source) === 'className' && node.initializer && ts.isStringLiteral(node.initializer)) {
+      const classes = node.initializer.text.split(/\s+/)
+      if (classes.includes('overflow-x-auto')) scrollClasses.push(classes)
+    }
+    ts.forEachChild(node, visit)
+  }
+  visit(source)
+  assert.ok(scrollClasses.length > 0)
+  for (const classes of scrollClasses) {
+    assert.ok(classes.includes('module-content-scrollbar'))
+    assert.ok(!classes.includes('thin-x-scrollbar'))
+  }
+})
@@ -0,0 +1,78 @@
+const { test } = require('node:test')
+const assert = require('node:assert/strict')
+const fs = require('node:fs/promises')
+const path = require('node:path')
+const os = require('node:os')
+const vm = require('node:vm')
+const ts = require('typescript')
+const { execFile } = require('node:child_process')
+const { promisify } = require('node:util')
+const exec = promisify(execFile)
+const root = path.resolve(__dirname, '..')
+const placeholder = 'Binary or large file preview is not available.'
+const xml = '<?xml version="1.0"?>\n<model><name>mkmini_gazebo</name><description>주행 모델</description></model>\n'
+
+function compile(source, context = {}) {
+  const exports = {}
+  vm.runInNewContext(ts.transpileModule(source, { compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022 } }).outputText, { exports, require, Buffer, ...context })
+  return exports
+}
+
+async function fixture(run) {
+  const dir = await fs.mkdtemp(path.join(os.tmpdir(), 'lms-xml-editor-'))
+  try {
+    for (const name of ['model.config', 'model.sdf', 'simulation.world', 'MODEL.CONFIG']) await fs.writeFile(path.join(dir, name), xml)
+    await fs.writeFile(path.join(dir, 'large.config'), 'x'.repeat(1024 * 1024 + 1))
+    await fs.writeFile(path.join(dir, 'model.glb'), Buffer.from([0, 1, 2, 3]))
+    await run(dir)
+  } finally { await fs.rm(dir, { recursive: true, force: true }) }
+}
+
+test('local module and root collectors read small Gazebo XML files without changing binary and size exclusions', async () => {
+  const source = ts.createSourceFile('index.ts', await fs.readFile(path.join(root, 'src/main/index.ts'), 'utf8'), ts.ScriptTarget.Latest, true)
+  const functions = source.statements.filter(node => ts.isFunctionDeclaration(node) && ['collectModuleFiles', 'collectRootFiles'].includes(node.name?.text))
+  const pattern = source.statements.find(node => ts.isVariableStatement(node) && node.declarationList.declarations[0].name.getText(source) === 'textFilePattern')
+  assert.equal(functions.length, 2)
+  assert.ok(pattern)
+  await fixture(async dir => {
+    const api = compile([pattern.getText(source), ...functions.map(node => `export ${node.getText(source)}`)].join('\n'), {
+      readdir: fs.readdir, stat: fs.stat, readFile: fs.readFile,
+      resolve: path.resolve, basename: path.basename,
+      skippedCacheDirs: new Set(['.git', 'build', 'install', 'log', 'node_modules', 'docker']),
+      findModuleRoot: async () => dir,
+      toRendererModulePath: (name, file, base) => `modules/${name}/${path.relative(base, file)}`,
+      toRendererRootPath: (name, file, base) => `${name}/${path.relative(base, file)}`
+    })
+    for (const result of [await api.collectModuleFiles('NAV2-MKMini'), await api.collectRootFiles(dir, 'examples')]) {
+      const files = Object.fromEntries(Object.entries(result.files).map(([file, content]) => [path.basename(file), content]))
+      for (const name of ['model.config', 'model.sdf', 'simulation.world', 'MODEL.CONFIG']) assert.equal(files[name], xml)
+      for (const name of ['large.config', 'model.glb']) assert.equal(files[name], placeholder)
+    }
+  })
+})
+
+test('remote listing, content and search include Gazebo XML while preserving size, NUL and path protections', async () => {
+  const api = compile(await fs.readFile(path.join(root, 'src/main/remoteModuleFiles.ts'), 'utf8'))
+  await fixture(async dir => {
+    const request = async input => JSON.parse((await exec('bash', ['-c', api.remoteModuleFilesScript(dir, input)], { timeout: 10000 })).stdout)
+    const listing = await request({ action: 'list' })
+    assert.ok(listing.filePaths.includes('model.config'))
+    for (const file of ['model.config', 'model.sdf', 'simulation.world', 'MODEL.CONFIG']) assert.equal((await request({ action: 'content', path: file })).content, xml)
+    for (const file of ['large.config', 'model.glb']) assert.equal((await request({ action: 'content', path: file })).content, placeholder)
+    await fs.writeFile(path.join(dir, 'binary.config'), Buffer.from('text\0binary'))
+    assert.equal((await request({ action: 'content', path: 'binary.config' })).content, placeholder)
+    const matches = await request({ action: 'search', query: 'mkmini_gazebo' })
+    assert.deepEqual(matches.map(match => match.file).sort(), ['MODEL.CONFIG', 'model.config', 'model.sdf', 'simulation.world'].sort())
+    await assert.rejects(request({ action: 'content', path: '../outside.config' }), /Invalid module path/)
+    await fs.symlink(path.join(dir, '..'), path.join(dir, 'escape'))
+    await assert.rejects(request({ action: 'content', path: 'escape/outside.config' }), /Invalid module path/)
+  })
+})
+
+test('Gazebo model.config, SDF and world files use XML highlighting without treating arbitrary config formats as XML', async () => {
+  const api = compile(await fs.readFile(path.join(root, 'src/renderer/src/features/workspace/workspaceFiles.ts'), 'utf8'))
+  for (const file of ['model.config', 'models/mkmini/model.config', 'models/MODEL.CONFIG', 'model.sdf', 'simulation.world', 'WORLD.SDF', 'package.xml', 'robot.urdf', 'robot.xacro']) assert.equal(api.getEditorLanguage(file), 'xml', file)
+  assert.equal(api.getEditorLanguage('app.config'), 'plaintext')
+  assert.equal(api.getEditorLanguage('control.yaml'), 'yaml')
+  assert.equal(api.getEditorLanguage('model.glb'), 'plaintext')
+})
@@ -0,0 +1,137 @@
+import { createHash, randomUUID } from 'node:crypto'
+import { chmod, lstat, readdir, readFile, realpath, rename, unlink, writeFile } from 'node:fs/promises'
+import { dirname, join, relative, resolve, sep } from 'node:path'
+import { safeAgentPath, type AgentCheckedChange, type AgentToolRequest } from '../shared/agentTools'
+
+const textFile = /\.(c|cc|cpp|cxx|h|hh|hpp|hxx|py|js|jsx|ts|tsx|json|ya?ml|xml|md|txt|toml|ini|cfg|conf|sh|bash|launch|urdf|xacro|rviz|proto|cmake)$|^(Dockerfile|CMakeLists\.txt)$/i
+export const agentFileHash = (content: string): string => createHash('sha256').update(content, 'utf8').digest('hex')
+
+async function checkedPath(root: string, path: string, allowMissing = false): Promise<string> {
+  safeAgentPath(path)
+  const base = await realpath(root)
+  const absolute = resolve(base, path)
+  if (!absolute.startsWith(base + sep)) throw new Error('모듈 경로를 벗어날 수 없습니다.')
+  let current = base
+  const parts = relative(base, absolute).split(sep)
+  for (let i = 0; i < parts.length; i++) {
+    current = join(current, parts[i])
+    try {
+      const info = await lstat(current)
+      if (info.isSymbolicLink() || (i < parts.length - 1 && !info.isDirectory())) throw new Error('심볼릭 링크와 일반 파일이 아닌 경로는 사용할 수 없습니다.')
+    } catch (error) {
+      if (allowMissing && i === parts.length - 1 && (error as NodeJS.ErrnoException).code === 'ENOENT') return absolute
+      throw error
+    }
+  }
+  return absolute
+}
+
+async function readText(root: string, path: string): Promise<string> {
+  if (!textFile.test(path.split('/').pop() ?? '')) throw new Error('텍스트 소스 파일만 조회·수정할 수 있습니다.')
+  const absolute = await checkedPath(root, path)
+  const info = await lstat(absolute)
+  if (!info.isFile() || info.size > 1_048_576) throw new Error('일반 텍스트 파일(1MB 이하)만 조회할 수 있습니다.')
+  const text = await readFile(absolute, 'utf8')
+  if (text.includes('\0') || text.includes('\uFFFD')) throw new Error('UTF-8 텍스트 파일이 아닙니다.')
+  return text
+}
+
+export async function runAgentFileTool(root: string, request: AgentToolRequest): Promise<{ data: unknown; truncated: boolean }> {
+  const args = request.args ?? {}
+  if (request.name === 'files.read') {
+    const path = safeAgentPath(args.path)
+    try {
+      const content = await readText(root, path)
+      const lines = content.split('\n')
+      const startLine = args.startLine ?? 1
+      const ranged = args.startLine !== undefined || args.lineCount !== undefined || content.length > 40_000
+      const selection = ranged ? lines.slice(startLine - 1, startLine - 1 + (args.lineCount ?? 200)).join('\n') : content
+      const selected = selection.slice(0, 40_000)
+      const contentTruncated = selected.length < selection.length
+      const complete = startLine === 1 && selected === content
+      const endLine = Math.min(lines.length, startLine + selected.split('\n').length - 1 - Number(contentTruncated))
+      return { data: { path, exists: true, hash: agentFileHash(content), content: selected, complete, startLine, endLine, contentTruncated, totalLines: lines.length }, truncated: !complete }
+    } catch (error) {
+      if ((error as NodeJS.ErrnoException).code !== 'ENOENT') throw error
+      // A missing leaf in an existing directory is evidence for a new file.
+      await checkedPath(root, path, true)
+      return { data: { path, exists: false, hash: null, content: '', complete: true }, truncated: false }
+    }
+  }
+  const prefix = safeAgentPath(args.path, true)
+  if (prefix) await checkedPath(root, prefix)
+  const paths: string[] = []
+  const matches: Array<{ path: string; line: number; text: string }> = []
+  let visited = 0
+  let scanned = 0
+  let truncated = false
+  const visit = async (directory: string, depth: number): Promise<void> => {
+    if (depth > 10 || visited >= 5000 || paths.length >= 250 || matches.length >= 80 || scanned >= 4_000_000) { truncated = true; return }
+    const entries = (await readdir(directory, { withFileTypes: true })).sort((a, b) => a.name.localeCompare(b.name))
+    for (const entry of entries) {
+      const path = relative(root, join(directory, entry.name)).split(sep).join('/')
+      if (prefix && path !== prefix && !path.startsWith(prefix + '/') && !prefix.startsWith(path + '/')) continue
+      if (++visited > 5000 || paths.length >= 250 || matches.length >= 80 || scanned >= 4_000_000) { truncated = true; break }
+      try { safeAgentPath(path) } catch { continue }
+      if (entry.isSymbolicLink()) continue
+      if (entry.isDirectory()) { await visit(join(directory, entry.name), depth + 1); continue }
+      if (!entry.isFile() || !textFile.test(entry.name)) continue
+      if (prefix && path !== prefix && !path.startsWith(prefix + '/')) continue
+      if (request.name === 'files.list') { paths.push(path); continue }
+      let content: string
+      try { content = await readText(root, path) } catch { continue }
+      scanned += content.length
+      for (const [index, line] of content.split('\n').entries()) {
+        if (line.toLowerCase().includes(args.query!.toLowerCase())) {
+          matches.push({ path, line: index + 1, text: line.slice(0, 500) })
+          if (matches.length >= 80) { truncated = true; break }
+        }
+      }
+    }
+  }
+  await visit(root, 0)
+  return { data: request.name === 'files.list' ? { paths } : { query: args.query, matches }, truncated }
+}
+
+export async function applyAgentFiles(changes: Array<AgentCheckedChange & { root: string }>): Promise<void> {
+  if (!changes.length || changes.length > 24 || changes.reduce((n, c) => n + c.content.length, 0) > 1_000_000) throw new Error('변경 파일 용량을 확인하세요.')
+  const prepared: Array<{ path: string; temp: string; original: string | null; mode: number }> = []
+  const committed: typeof prepared = []
+  const seen = new Set<string>()
+  try {
+    for (const change of changes) {
+      if (change.expectedHash !== null && !/^[a-f0-9]{64}$/.test(change.expectedHash)) throw new Error('원본 파일 조회 정보가 없습니다. 다시 분석해주세요.')
+      if (!textFile.test(change.path.split('/').pop() ?? '')) throw new Error('텍스트 소스 파일만 수정할 수 있습니다.')
+      const path = await checkedPath(change.root, change.path, true)
+      if (seen.has(path)) throw new Error('중복된 변경 파일입니다.')
+      seen.add(path)
+      let original: string | null = null
+      let mode = 0o644
+      try { original = await readText(change.root, change.path); mode = (await lstat(path)).mode } catch (error) {
+        if ((error as NodeJS.ErrnoException).code !== 'ENOENT') throw error
+      }
+      if ((original === null ? null : agentFileHash(original)) !== change.expectedHash) throw new Error(`분석 이후 파일이 변경되었습니다: ${change.moduleName}/${change.path}. 다시 분석해주세요.`)
+      prepared.push({ path, original, mode, temp: join(dirname(path), `.lms-agent-${randomUUID()}.tmp`) })
+    }
+    for (const [index, file] of prepared.entries()) {
+      await writeFile(file.temp, changes[index].content, { encoding: 'utf8', mode: file.mode, flag: 'wx' })
+      await chmod(file.temp, file.mode & 0o777)
+    }
+    // Recheck the entire batch immediately before committing any file.
+    for (const file of prepared) {
+      let latest: string | null = null
+      try { latest = await readFile(file.path, 'utf8') } catch (error) { if ((error as NodeJS.ErrnoException).code !== 'ENOENT') throw error }
+      if (latest !== file.original) throw new Error('적용 직전 파일이 변경되었습니다. 다시 분석해주세요.')
+    }
+    for (const file of prepared) { await rename(file.temp, file.path); committed.push(file) }
+  } catch (error) {
+    const failures: string[] = []
+    for (const file of committed.reverse()) {
+      try { if (file.original === null) await unlink(file.path); else await writeFile(file.path, file.original, { mode: file.mode }) } catch { failures.push(file.path) }
+    }
+    if (failures.length) throw new Error(`일부 파일 복구에 실패했습니다: ${failures.join(', ')}. ${String(error)}`)
+    throw error
+  } finally {
+    await Promise.all(prepared.map(file => unlink(file.temp).catch(() => undefined)))
+  }
+}
@@ -0,0 +1,186 @@
+import type { AgentCheckedChange, AgentToolRequest } from '../shared/agentTools'
+
+export function agentRemoteFilesScript(input: { root: string; request: AgentToolRequest } | { changes: Array<AgentCheckedChange & { root: string }> }): string {
+  const encoded = Buffer.from(JSON.stringify(input)).toString('base64')
+  return `python3 - <<'LMS_AGENT_FILES'
+import sys
+sys.argv = ['lms-agent', '${encoded}']
+${agentRemoteFilesPython}
+LMS_AGENT_FILES`
+}
+
+export const agentRemoteFilesPython = String.raw`
+import base64, hashlib, json, os, re, stat, sys, tempfile
+args = json.loads(base64.b64decode(sys.argv[1]))
+blocked = {'node_modules', 'build', 'install', 'log', 'logs', '__pycache__', 'id_rsa', 'id_ed25519', 'credentials'}
+text_pattern = re.compile(r'\.(c|cc|cpp|cxx|h|hh|hpp|hxx|py|js|jsx|ts|tsx|json|ya?ml|xml|md|txt|toml|ini|cfg|conf|sh|bash|launch|urdf|xacro|rviz|proto|cmake)$|^(Dockerfile|CMakeLists\.txt)$', re.I)
+def safe(value):
+    if not isinstance(value, str) or not value or len(value) > 500 or value.startswith('/') or any(c in value for c in '\\\x00\r\n'):
+        raise ValueError('Invalid source path')
+    if any(not p or p.startswith('.') or p.lower() in blocked or re.search(r'\.(pem|key|p12|pfx)$', p, re.I) for p in value.split('/')):
+        raise ValueError('Private or excluded source path')
+    return value
+def checked(root, path, missing=False):
+    safe(path)
+    root = os.path.realpath(root)
+    current = root
+    parts = path.split('/')
+    for i, part in enumerate(parts):
+        current = os.path.join(current, part)
+        try:
+            info = os.lstat(current)
+            if stat.S_ISLNK(info.st_mode) or (i < len(parts)-1 and not stat.S_ISDIR(info.st_mode)):
+                raise ValueError('Symlink or non-directory source path')
+        except FileNotFoundError:
+            if not (missing and i == len(parts)-1):
+                raise
+    if os.path.commonpath([root, current]) != root:
+        raise ValueError('Source path escapes module')
+    return current
+def read(root, path):
+    if not text_pattern.search(os.path.basename(path)):
+        raise ValueError('Only text source files are supported')
+    absolute = checked(root, path)
+    info = os.lstat(absolute)
+    if not stat.S_ISREG(info.st_mode) or info.st_size > 1048576:
+        raise ValueError('Only regular source files up to 1 MB are supported')
+    with open(absolute, 'rb') as fp:
+        content = fp.read(1048577)
+    if len(content) > 1048576 or b'\x00' in content:
+        raise ValueError('Binary or oversized file')
+    return content.decode('utf-8')
+def digest(content):
+    return hashlib.sha256(content.encode('utf-8')).hexdigest()
+if 'changes' in args:
+    changes = args['changes']
+    if not changes or len(changes) > 24 or sum(len(c['content']) for c in changes) > 1000000:
+        raise ValueError('Invalid change batch size')
+    prepared, committed, seen = [], [], set()
+    try:
+        for c in changes:
+            path = checked(c['root'], c['path'], True)
+            if path in seen or not text_pattern.search(os.path.basename(path)):
+                raise ValueError('Duplicate or unsupported change file')
+            seen.add(path)
+            try:
+                original = read(c['root'], c['path'])
+                mode = stat.S_IMODE(os.stat(path).st_mode)
+            except FileNotFoundError:
+                original, mode = None, 0o644
+            if (None if original is None else digest(original)) != c.get('expectedHash', 'missing'):
+                raise ValueError('File changed after analysis: ' + c['moduleName'] + '/' + c['path'])
+            prepared.append({'path': path, 'original': original, 'mode': mode, 'content': c['content'], 'temp': None})
+        for p in prepared:
+            fd, p['temp'] = tempfile.mkstemp(prefix='.lms-agent-', dir=os.path.dirname(p['path']))
+            with os.fdopen(fd, 'w', encoding='utf-8', newline='') as fp:
+                fp.write(p['content'])
+            os.chmod(p['temp'], p['mode'])
+        for p in prepared:
+            try:
+                with open(p['path'], 'r', encoding='utf-8', newline='') as fp:
+                    latest = fp.read()
+            except FileNotFoundError:
+                latest = None
+            if latest != p['original']:
+                raise ValueError('File changed immediately before apply')
+        for p in prepared:
+            os.replace(p['temp'], p['path'])
+            committed.append(p)
+    except Exception as error:
+        failed = []
+        for p in reversed(committed):
+            try:
+                if p['original'] is None:
+                    os.unlink(p['path'])
+                else:
+                    with open(p['path'], 'w', encoding='utf-8', newline='') as fp:
+                        fp.write(p['original'])
+                    os.chmod(p['path'], p['mode'])
+            except Exception:
+                failed.append(p['path'])
+        if failed:
+            raise ValueError('Rollback failed: ' + ', '.join(failed)) from error
+        raise
+    finally:
+        for p in prepared:
+            if p['temp'] and os.path.exists(p['temp']):
+                os.unlink(p['temp'])
+    print(json.dumps({'ok': True}))
+else:
+    root = os.path.realpath(args['root'])
+    req = args['request']
+    options = req.get('args') or {}
+    name = req['name']
+    if name == 'files.read':
+        path = options['path']
+        try:
+            content = read(root, path)
+            lines = content.split('\n')
+            ranged = 'startLine' in options or 'lineCount' in options or len(content) > 40000
+            start = options.get('startLine', 1)
+            selection = '\n'.join(lines[start-1:start-1+options.get('lineCount', 200)]) if ranged else content
+            selected = selection[:40000]
+            content_truncated = len(selected) < len(selection)
+            complete = start == 1 and selected == content
+            partial = not complete
+            end = min(len(lines), start + len(selected.split('\n')) - 1 - int(content_truncated))
+            data = {'path': path, 'exists': True, 'hash': digest(content), 'content': selected, 'complete': complete, 'startLine': start, 'endLine': end, 'contentTruncated': content_truncated, 'totalLines': len(lines)}
+        except FileNotFoundError:
+            checked(root, path, True)
+            data, partial = {'path': path, 'exists': False, 'hash': None, 'content': '', 'complete': True}, False
+        print(json.dumps({'data': data, 'truncated': partial}, ensure_ascii=False))
+    else:
+        prefix = options.get('path', '')
+        if prefix:
+            checked(root, prefix)
+        paths, matches = [], []
+        visited, scanned, truncated = 0, 0, False
+        def fail(error):
+            raise error
+        for directory, dirs, files in os.walk(root, followlinks=False, onerror=fail):
+            depth = len(os.path.relpath(directory, root).split('/')) if directory != root else 0
+            kept = []
+            for d in sorted(dirs):
+                rel = os.path.relpath(os.path.join(directory, d), root)
+                if prefix and rel != prefix and not rel.startswith(prefix + '/') and not prefix.startswith(rel + '/'):
+                    continue
+                visited += 1
+                try:
+                    safe(rel)
+                    if not os.path.islink(os.path.join(directory, d)):
+                        kept.append(d)
+                except ValueError:
+                    pass
+            dirs[:] = kept if depth < 10 else []
+            for f in sorted(files):
+                path = os.path.relpath(os.path.join(directory, f), root)
+                if prefix and path != prefix and not path.startswith(prefix + '/'):
+                    continue
+                visited += 1
+                if visited > 5000 or len(paths) >= 250 or len(matches) >= 80 or scanned >= 4000000:
+                    truncated = True
+                    break
+                try:
+                    safe(path)
+                    if os.path.islink(os.path.join(directory, f)) or not text_pattern.search(f):
+                        continue
+                    if prefix and path != prefix and not path.startswith(prefix + '/'):
+                        continue
+                    if name == 'files.list':
+                        paths.append(path)
+                        continue
+                    content = read(root, path)
+                except (ValueError, OSError, UnicodeError):
+                    continue
+                scanned += len(content)
+                for number, line in enumerate(content.split('\n'), 1):
+                    if options['query'].lower() in line.lower():
+                        matches.append({'path': path, 'line': number, 'text': line[:500]})
+                        if len(matches) >= 80:
+                            truncated = True
+                            break
+            if truncated:
+                break
+        data = {'paths': paths} if name == 'files.list' else {'query': options['query'], 'matches': matches}
+        print(json.dumps({'data': data, 'truncated': truncated}, ensure_ascii=False))
+`
@@ -0,0 +1,79 @@
+import type { AgentToolRequest } from '../shared/agentTools'
+
+export const DEFAULT_AGENT_TOPICS = ['/raw/lidar', '/scan', '/lidar_filtered', '/cloud_map', '/odom', '/map', '/tf', '/tf_static']
+
+export function agentRosProbe(topics: string[] = DEFAULT_AGENT_TOPICS): string {
+  const encoded = Buffer.from(JSON.stringify(topics)).toString('base64')
+  return `python3 -c ${shellQuote(agentRosProbePython)} ${shellQuote(encoded)}`
+}
+export function shellQuote(value: string): string { return `'${value.replace(/'/g, `'"'"'`)}'` }
+
+export const agentRosProbePython = String.raw`
+import base64, json, sys, time
+import rclpy
+from rclpy.qos import QoSProfile, ReliabilityPolicy, DurabilityPolicy
+from rosidl_runtime_py.utilities import get_message
+rclpy.init(args=[])
+node = rclpy.create_node('lms_agent_readonly_probe_' + str(int(time.time() * 1000)))
+topics = json.loads(base64.b64decode(sys.argv[1]))
+samples, valid_samples, frames, edges, errors, subscriptions = {}, {}, {}, set(), {}, []
+try:
+    deadline = time.monotonic() + 1.5
+    while time.monotonic() < deadline:
+        rclpy.spin_once(node, timeout_sec=0.1)
+    graph = dict(node.get_topic_names_and_types())
+    def callback(topic):
+        def receive(message):
+            samples[topic] = samples.get(topic, 0) + 1
+            if hasattr(message, 'header') and message.header.frame_id:
+                frame_set = frames.setdefault(topic, set())
+                if len(frame_set) < 8:
+                    frame_set.add(message.header.frame_id)
+            valid = True
+            if hasattr(message, 'ranges'):
+                valid = len(message.ranges) > 0
+            elif hasattr(message, 'width') and hasattr(message, 'data'):
+                valid = message.width * message.height > 0 and len(message.data) > 0
+            elif hasattr(message, 'info') and hasattr(message, 'data'):
+                valid = message.info.width * message.info.height > 0 and len(message.data) > 0
+            if valid:
+                valid_samples[topic] = valid_samples.get(topic, 0) + 1
+            if topic in ('/tf', '/tf_static'):
+                for transform in message.transforms:
+                    if len(edges) < 200:
+                        edges.add((transform.header.frame_id, transform.child_frame_id))
+        return receive
+    for topic in topics:
+        if topic not in graph:
+            continue
+        try:
+            retained = any(info.qos_profile.durability == DurabilityPolicy.TRANSIENT_LOCAL for info in node.get_publishers_info_by_topic(topic))
+            qos = QoSProfile(depth=1, reliability=ReliabilityPolicy.BEST_EFFORT, durability=DurabilityPolicy.TRANSIENT_LOCAL if retained else DurabilityPolicy.VOLATILE)
+            subscriptions.append(node.create_subscription(get_message(graph[topic][0]), topic, callback(topic), qos))
+        except Exception as error:
+            errors[topic] = str(error)[:500]
+    deadline = time.monotonic() + 3.0
+    while time.monotonic() < deadline:
+        rclpy.spin_once(node, timeout_sec=0.1)
+    graph = dict(node.get_topic_names_and_types())
+    print(json.dumps({'nodes': node.get_node_names()[:200], 'topics': [{'name': t, 'types': graph.get(t, []), 'publishers': node.count_publishers(t), 'samples': samples.get(t, 0), 'validSamples': valid_samples.get(t, 0), 'frameIds': sorted(frames.get(t, [])), 'error': errors.get(t)} for t in topics], 'tfEdges': [{'parent': p, 'child': c} for p, c in sorted(edges)], 'observationSeconds': 3.0}))
+finally:
+    node.destroy_node()
+    rclpy.shutdown()
+`
+
+export async function inspectAgentRuntime(
+  request: AgentToolRequest,
+  host: (executable: string, args: string[]) => Promise<string>,
+  container: (command: string) => Promise<string>
+): Promise<unknown> {
+  if (request.name === 'network.inspect') {
+    const interfaces = JSON.parse(await host('ip', ['-j', 'address', 'show']))
+    const routes = JSON.parse(await host('ip', ['-j', 'route', 'show']))
+    let containerNetwork: unknown
+    try { containerNetwork = JSON.parse(await container('ip -j address show')) } catch (error) { containerNetwork = { error: String(error).slice(0, 500) } }
+    return { host: { interfaces, routes }, container: containerNetwork, note: '호스트는 해당 모듈이 설치된 로컬 또는 SSH 대상 장치입니다. 라이다·공유기 자체 설정은 조회하지 않았습니다.' }
+  }
+  if (request.name === 'ros.inspect') return JSON.parse(await container(agentRosProbe(request.args?.topics)))
+  throw new Error('지원하지 않는 런타임 조회입니다.')
+}
@@ -0,0 +1,29 @@
+import { app } from 'electron'
+import { dirname, join } from 'path'
+import { inspect } from 'util'
+import { createDailyLog } from './dailyLog'
+
+const fallback = app.getPath('logs')
+export const appLog = createDailyLog([
+  process.env.APPIMAGE
+    ? join(dirname(process.env.APPIMAGE), 'logs')
+    : app.isPackaged ? join(dirname(process.execPath), 'logs') : fallback,
+  fallback
+])
+
+for (const level of ['warn', 'error'] as const) {
+  const original = console[level].bind(console)
+  console[level] = (...args: unknown[]) => {
+    appLog.write(level, args.map((value) => typeof value === 'string' ? value : inspect(value, { depth: 4 })).join(' '))
+    original(...args)
+  }
+}
+
+// Monitor fatal exceptions without changing Node's normal termination behavior.
+process.on('uncaughtExceptionMonitor', (error, origin) => {
+  appLog.write(origin, error.stack ?? String(error))
+})
+process.on('warning', (warning) => appLog.write('warning', warning.stack ?? warning.message))
+process.on('exit', (code) => appLog.write('exit', `code=${code}`))
+app.on('child-process-gone', (_event, details) => appLog.write('child-process-gone', JSON.stringify(details)))
+appLog.write('startup', `version=${app.getVersion()} platform=${process.platform} arch=${process.arch} electron=${process.versions.electron} executable=${process.env.APPIMAGE || process.execPath}`)
@@ -0,0 +1,8 @@
+import { app } from 'electron'
+import { appLog } from './appLogging'
+
+// Load native dependencies only after the startup logger is ready.
+void import('./index').catch((error: unknown) => {
+  appLog.write('startup-error', error instanceof Error ? error.stack ?? error.message : String(error))
+  app.exit(1)
+})
@@ -15,9 +15,9 @@ const artifacts = [
  {
    image: jetsonBridgeImage,
    architecture: 'arm64',
-    url: `${root}/arm64/20260819-0659d4cf5578/slam-ros-bridge-jetson-orin.tar.zst`,
-    fileName: 'slam-ros-bridge-jetson-orin-0659d4cf5578.tar.zst',
-    checksumSha256: '0659d4cf5578c43bc9c25e4a4fc5d226ccd5b7bec43becfdff83b5390717114e',
+    url: `${root}/arm64/20261013-21acdf0cbdee/slam-ros-bridge-jetson-orin.tar.zst`,
+    fileName: 'slam-ros-bridge-jetson-orin-21acdf0cbdee.tar.zst',
+    checksumSha256: '21acdf0cbdee45d8b7b9dba78c3d321d67d8d7a2467511c4af0826e36ea0c74f',
    required: true,
  },
 ]
@@ -0,0 +1,61 @@
+import { BrowserWindow, clipboard, Menu } from 'electron'
+import type { IpcMainInvokeEvent, MenuItemConstructorOptions } from 'electron'
+import type { ChatClipboardAction, ChatTextMenuAction, ChatTextMenuOptions } from '../shared/chatTextMenu'
+
+function trustedChatFrame(event: IpcMainInvokeEvent): boolean {
+  if (event.sender.isDestroyed() || event.senderFrame !== event.sender.mainFrame) return false
+  const window = BrowserWindow.fromWebContents(event.sender)
+  return Boolean(window && !window.isDestroyed())
+}
+
+export function readChatClipboardState(event: IpcMainInvokeEvent): { hasText: boolean } {
+  return { hasText: trustedChatFrame(event) && clipboard.readText().length > 0 }
+}
+
+export function performChatClipboardAction(event: IpcMainInvokeEvent, input: ChatClipboardAction): boolean {
+  if (!trustedChatFrame(event) || !input) return false
+  if (input.action === 'copy' && typeof input.text === 'string' && input.text.length > 0 && input.text.length <= 5_000_000) {
+    clipboard.writeText(input.text)
+    return true
+  }
+  if (input.action === 'paste' && clipboard.readText().length > 0) {
+    event.sender.paste()
+    return true
+  }
+  return false
+}
+
+export function showChatTextMenu(event: IpcMainInvokeEvent, input: ChatTextMenuOptions): Promise<ChatTextMenuAction> | null {
+  if (!input || !['message', 'input'].includes(input.kind) || event.sender.isDestroyed() || event.senderFrame !== event.sender.mainFrame) return null
+  const window = BrowserWindow.fromWebContents(event.sender)
+  if (!window || window.isDestroyed()) return null
+  const label = (value: unknown, fallback: string): string => typeof value === 'string' && value.trim() ? value.slice(0, 80) : fallback
+
+  return new Promise((resolve) => {
+    const items: MenuItemConstructorOptions[] = [{
+      label: label(input.labels?.copy, 'Copy'),
+      enabled: input.canCopy === true,
+      click: () => {
+        if (!event.sender.isDestroyed() && input.canCopy === true) event.sender.copy()
+        resolve(null)
+      }
+    }]
+    if (input.kind === 'input') {
+      items.push({
+        label: label(input.labels?.paste, 'Paste'),
+        enabled: input.canPaste === true && clipboard.readText().length > 0,
+        click: () => {
+          if (!event.sender.isDestroyed() && input.canPaste === true && clipboard.readText().length > 0) event.sender.paste()
+          resolve(null)
+        }
+      })
+    } else if (input.canClear !== undefined) {
+      items.push({ type: 'separator' }, {
+        label: label(input.labels?.clear, 'Delete conversation'),
+        enabled: input.canClear === true,
+        click: () => resolve(input.canClear === true ? 'clear' : null)
+      })
+    }
+    Menu.buildFromTemplate(items).popup({ window, callback: () => resolve(null) })
+  })
+}
@@ -0,0 +1,51 @@
+import { appendFileSync, closeSync, mkdirSync, openSync, readdirSync, unlinkSync } from 'fs'
+import { join } from 'path'
+
+export function redactLog(value: string): string {
+  return value
+    .replace(/(https?:\/\/)[^\s/@]+@/gi, '$1[REDACTED]@')
+    .replace(/\bBearer\s+[^\s"',;]+/gi, 'Bearer [REDACTED]')
+    .replace(/((?:[?&]|--)(?:[^\s=&]*token|password|secret|code|key)=)[^\s&#"']+/gi, '$1[REDACTED]')
+    .replace(/(["']?(?:[\w-]*token|password|secret|authorization|api[_-]?key)["']?\s*[:=]\s*)(?:"[^"]*"|'[^']*'|[^\s,;}]+)/gi, '$1[REDACTED]')
+}
+
+function localDate(now: Date): string {
+  return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`
+}
+
+export function createDailyLog(directories: string[], now: () => Date = () => new Date()) {
+  let activePath = ''
+  let activeDay = ''
+
+  function selectFile(): string {
+    const day = localDate(now())
+    if (activePath && activeDay === day) return activePath
+    for (const directory of [...new Set(directories)]) {
+      try {
+        mkdirSync(directory, { recursive: true })
+        const path = join(directory, `lms-${day}.log`)
+        closeSync(openSync(path, 'a', 0o600))
+        activePath = path
+        activeDay = day
+        for (const name of readdirSync(directory)) {
+          if (/^lms-\d{4}-\d{2}-\d{2}\.log$/.test(name) && name < `lms-${day}.log`) {
+            try { unlinkSync(join(directory, name)) } catch { /* Retention must not block startup. */ }
+          }
+        }
+        return path
+      } catch { /* Try the user-writable fallback directory. */ }
+    }
+    return ''
+  }
+
+  return {
+    path: selectFile,
+    write(kind: string, message: string): void {
+      try {
+        const path = selectFile()
+        if (!path) return
+        appendFileSync(path, `[${now().toISOString()}] [${redactLog(kind)}] ${redactLog(message)}\n`, { mode: 0o600 })
+      } catch { /* Diagnostics must not interrupt the app. */ }
+    }
+  }
+}
@@ -0,0 +1,48 @@
+import { readdir, readFile, realpath } from 'fs/promises'
+import { resolve, sep } from 'path'
+import type { LocalGitModule } from '../shared/gitModuleImport'
+
+export async function localGitModulePath(root: string, folder: string): Promise<string> {
+  if (!/^\[lms-nav2-custom\][a-z][a-z0-9_]*_v[^/\\]+_ws$/.test(folder)) throw new Error('Invalid custom module folder')
+  const base = await realpath(root)
+  const target = await realpath(resolve(base, folder))
+  if (!target.startsWith(base + sep)) throw new Error('Module is outside the local workspace')
+  return target
+}
+
+export async function listLocalGitModules(root: string): Promise<LocalGitModule[]> {
+  const entries = await readdir(root, { withFileTypes: true }).catch((error: NodeJS.ErrnoException) => {
+    if (error.code === 'ENOENT') return []
+    throw error
+  })
+  const modules: LocalGitModule[] = []
+  for (const entry of entries) {
+    if (!entry.isDirectory() || !entry.name.startsWith('[lms-nav2-custom]')) continue
+    try {
+      const target = await localGitModulePath(root, entry.name)
+      const data = JSON.parse(await readFile(resolve(target, '.autonomy-studio-module.json'), 'utf8'))
+      if (data.sourceType !== 'CUSTOM' || !['name', 'category', 'packageName', 'launchFile'].every(key => typeof data[key] === 'string' && data[key])) continue
+      modules.push({ name: data.name, category: data.category, packageName: data.packageName, launchFile: data.launchFile, folderName: entry.name })
+    } catch { /* Ignore incomplete module folders. */ }
+  }
+  return modules.sort((a, b) => a.name.localeCompare(b.name))
+}
+
+export function repositoryAddress(value: string): string {
+  // Do not allow local paths, Git remote helpers, or credentials in the UI.
+  const normalized = /^git@[^:]+:.+/.test(value) ? value.replace(/^git@([^:]+):(.+)$/, 'ssh://git@$1/$2') : value
+  const url = new URL(normalized)
+  if (!['https:', 'http:', 'ssh:'].includes(url.protocol)) throw new Error('Unsupported Git repository protocol')
+  url.password = ''
+  if (url.protocol !== 'ssh:') url.username = ''
+  url.search = ''
+  url.hash = ''
+  return url.toString()
+}
+
+export function remoteBranches(output: string): Array<{ name: string; commit: string }> {
+  return output.split('\n').flatMap(line => {
+    const match = line.trim().match(/^([a-f0-9]{40,64})\s+refs\/heads\/(.+)$/)
+    return match ? [{ name: match[2], commit: match[1] }] : []
+  }).sort((a, b) => a.name.localeCompare(b.name))
+}
@@ -1,8 +1,17 @@
 import { app, BrowserWindow, dialog, Menu, globalShortcut, ipcMain, screen, shell } from 'electron'
+import { appLog } from './appLogging'
 import { checkDockerStatus } from './dockerStatus'
+import { performChatClipboardAction, readChatClipboardState, showChatTextMenu } from './chatTextMenu'
 import { cameraRuntimeArtifacts } from './cameraRuntime'
 import { remoteModuleFilesScript } from './remoteModuleFiles'
+import { applyAgentFiles, runAgentFileTool } from './agentFileTools'
+import { agentRemoteFilesScript } from './agentRemoteFiles'
+import { inspectAgentRuntime } from './agentRuntimeTools'
+import { validateAgentTool, type AgentCheckedChange, type AgentToolRequest, type AgentToolResult } from '../shared/agentTools'
 import { resolveContainerTerminal } from './containerTerminal'
+import { remoteShellCommand, remoteShellEnvironment } from './remoteShell'
+import { listLocalGitModules, localGitModulePath, remoteBranches, repositoryAddress } from './gitModuleImport'
+import type { GitModuleSource, GitModuleImportInput } from '../shared/gitModuleImport'
 import { yahboomDevicePreflight, yahboomModuleCases, yahboomRuntimeImage, yahboomRuntimeArtifacts, yahboomSimulation } from './yahboomRuntime'
 import { visualizationProgress, reportVisualizationProgress } from './visualizationProgress'
 import { moduleProgress, reportModuleProgress, createModuleProgressParser } from './moduleProgress'
@@ -11,7 +20,7 @@ import type { WebContents } from 'electron'
 import { spawn } from 'child_process'
 import * as pty from 'node-pty'
 import type { IPty } from 'node-pty'
-import { appendFileSync, createReadStream, createWriteStream, existsSync, mkdirSync } from 'fs'
+import { createReadStream, createWriteStream, existsSync } from 'fs'
 import { cp, mkdir, readdir, readFile, rename, rm, stat, writeFile } from 'fs/promises'
 import { homedir } from 'os'
 import { basename, dirname, join, relative, resolve } from 'path'
@@ -50,21 +59,12 @@ const rosBridgePort = 8765
 const exampleCodeRoot = resolve(homedir(), '다운로드', 'example-code')

 function writeRendererDiagnostic(kind: string, message: string): void {
-  try {
-    const logDirectory = app.getPath('logs')
-    mkdirSync(logDirectory, { recursive: true })
-    appendFileSync(
-      join(logDirectory, 'renderer.log'),
-      `[${new Date().toISOString()}] [${kind}] ${message}\n`,
-      'utf8',
-    )
-  } catch {
-    // Diagnostics must never interrupt the LMS window itself.
-  }
+  appLog.write(kind, message)
 }

 async function readAppDiagnostics(): Promise<{ path: string; content: string }> {
-  const logPath = join(app.getPath('logs'), 'renderer.log')
+  const logPath = appLog.path()
+  if (!logPath) return { path: '', content: '' }

  try {
    const content = await readFile(logPath, 'utf8')
@@ -78,7 +78,7 @@ async function readAppDiagnostics(): Promise<{ path: string; content: string }>
  }
 }
 const skippedCacheDirs = new Set(['.git', 'build', 'install', 'log', 'node_modules', 'docker'])
-const textFilePattern = /\.(c|cc|cpp|cxx|h|hpp|hh|py|xml|urdf|xacro|yaml|yml|json|txt|md|cmake|launch|sh|bash|toml|ini|cfg|rviz)$/i
+const textFilePattern = /\.(c|cc|cpp|cxx|h|hpp|hh|py|xml|urdf|xacro|sdf|world|config|yaml|yml|json|txt|md|cmake|launch|sh|bash|toml|ini|cfg|rviz)$/i
 const imageFilePattern = /\.(png|jpe?g|webp|gif|svg)$/i
 const maxImagePreviewBytes = 10 * 1024 * 1024
 const explicitModuleFolders: Record<string, string> = {
@@ -1280,6 +1280,82 @@ async function createRemoteCustomWorkspaceModule(
  return { ok: true, workspacePath: output.trim().split('\n')[0] || remotePathJoin(target.workspaceRoot, module.folderName) }
 }

+async function inspectLocalGitModule(workspaceRoot: string, folder: string): Promise<GitModuleSource> {
+  const workspace = expandUserPath(workspaceRoot)
+  if (!workspace) throw new Error('워크스페이스 경로가 설정되어 있지 않습니다.')
+  const root = await localGitModulePath(workspace, folder)
+  const git = (args: string[]) => runCommandOutput('git', args, root, { ...process.env, GIT_TERMINAL_PROMPT: '0' }, 15_000, 'stdout')
+  const top = (await git(['rev-parse', '--show-toplevel'])).trim()
+  if (resolve(top) !== root) throw new Error('모듈 자체의 Git 저장소가 필요합니다.')
+  const remote = await git(['remote', 'get-url', 'student']).catch(() => git(['remote', 'get-url', 'origin']))
+  const repository = repositoryAddress(remote.trim())
+  const currentBranch = (await git(['branch', '--show-current'])).trim()
+  const dirty = Boolean((await git(['status', '--porcelain'])).trim())
+  const head = (await git(['rev-parse', 'HEAD'])).trim()
+  let branches: GitModuleSource['branches']
+  try {
+    branches = remoteBranches(await git(['ls-remote', '--heads', withGitCredential(repository)]))
+  } catch { throw new Error('Git 저장소를 조회하지 못했습니다. 접근 권한과 네트워크를 확인하세요.') }
+  return { repository, currentBranch, branches, dirty, pushed: branches.some(branch => branch.name === currentBranch && branch.commit === head) }
+}
+
+async function importRemoteGitModule(targetInput: RemoteWorkspaceTarget, workspaceRoot: string, input: GitModuleImportInput & { folderName: string }): Promise<{ ok: boolean; workspacePath: string }> {
+  const target = normalizeRemoteTarget(targetInput)
+  const module = validateCustomModuleScaffold(input)
+  const source = await inspectLocalGitModule(workspaceRoot, input.sourceFolder)
+  if (source.dirty || !source.pushed) throw new Error('로컬 변경 사항을 커밋하고 푸시한 뒤 다시 시도하세요.')
+  const branch = source.branches.find(branch => branch.name === input.branch && branch.commit === input.commit)
+  if (!branch) throw new Error('브랜치가 변경되었습니다. 저장소 정보를 새로고침하세요.')
+  const repository = remoteRepositoryUrl(source.repository)
+  const authenticated = withGitCredential(repository)
+  const url = new URL(authenticated)
+  const authorization = ['http:', 'https:'].includes(url.protocol) && url.username
+    ? `Authorization: Basic ${Buffer.from(`${decodeURIComponent(url.username)}:${decodeURIComponent(url.password)}`).toString('base64')}` : ''
+  const config = encodeBase64(customModuleConfigContent(module))
+  // Stage the clone and publish only after validation. Never overwrite an existing workspace.
+  const script = [
+    'set -e',
+    `ROOT=${quoteShellSingle(target.workspaceRoot)}`,
+    ...expandRemotePathVar('ROOT'),
+    'mkdir -p "$ROOT"',
+    `TARGET="$ROOT/"${quoteShellSingle(module.folderName)}`,
+    'if [ -e "$TARGET" ] || [ -L "$TARGET" ]; then echo "Module folder already exists" >&2; exit 1; fi',
+    'STAGING=$(mktemp -d "$ROOT/.git-import-XXXXXXXX")',
+    'trap \'rm -rf -- "$STAGING"\' EXIT',
+    `AUTH=$(printf %s ${quoteShellSingle(encodeBase64(authorization))} | base64 -d)`,
+    'export GIT_TERMINAL_PROMPT=0',
+    `if ! GIT_CONFIG_COUNT=1 GIT_CONFIG_KEY_0=http.extraHeader GIT_CONFIG_VALUE_0="$AUTH" git clone --single-branch --branch ${quoteShellSingle(branch.name)} -- ${quoteShellSingle(repository)} "$STAGING/module" 2>"$STAGING/clone-error"; then echo "Git clone failed: check repository access from the platform" >&2; exit 1; fi`,
+    'unset AUTH',
+    `test "$(git -C "$STAGING/module" rev-parse HEAD)" = ${quoteShellSingle(branch.commit)} || { echo "Branch changed; refresh and retry" >&2; exit 1; }`,
+    `python3 - "$STAGING/module" ${quoteShellSingle(config)} <<'PY'`,
+    'import base64, json, os, subprocess, sys',
+    'root = sys.argv[1]',
+    'config = json.loads(base64.b64decode(sys.argv[2]))',
+    'paths = subprocess.check_output(["git", "-C", root, "ls-tree", "-r", "--name-only", "HEAD"]).decode().splitlines()',
+    'if any(set(path.split("/")) & {"build", "install", "log", "__pycache__"} for path in paths): raise SystemExit("Repository contains build artifacts; remove them before importing")',
+    'for path in paths:',
+    '    if os.path.islink(os.path.join(root, path)): raise SystemExit("Repository symlinks are not supported for module import")',
+    'package = config["packageName"]',
+    'candidates = [root, os.path.join(root, "src", package)]',
+    'if not any(os.path.isfile(os.path.join(p, "package.xml")) and os.path.isfile(os.path.join(p, "launch", config["launchFile"])) for p in candidates): raise SystemExit("Package or launch file is missing in the selected branch")',
+    'for script in ("build.sh", "run.sh"):',
+    '    if not os.path.isfile(os.path.join(root, script)): raise SystemExit("Module build.sh/run.sh is missing")',
+    '    os.chmod(os.path.join(root, script), 0o755)',
+    'with open(os.path.join(root, ".autonomy-studio-module.json"), "w") as fp: json.dump(config, fp, indent=2)',
+    'PY',
+    'mv -T -n "$STAGING/module" "$TARGET"',
+    'test ! -d "$STAGING/module" || { echo "Module folder already exists" >&2; exit 1; }',
+    'printf "%s" "$TARGET"',
+  ].join('\n')
+  try {
+    const workspacePath = (await runSshOutput(target, script, 120_000)).trim()
+    return { ok: true, workspacePath }
+  } catch {
+    // SSH failures can include the command (and its temporary authorization header).
+    throw new Error('Git 모듈 복제에 실패했습니다. 원격 저장소 접근, 기존 폴더, 소스 및 빌드 산출물 포함 여부를 확인하세요.')
+  }
+}
+
 async function transferLocalWorkspaceModuleToRemote(
  targetInput: RemoteWorkspaceTarget,
  sourceWorkspaceRoot: string | null | undefined,
@@ -1723,15 +1799,16 @@ function handleModuleOperation(channel: string, handler: Parameters<typeof ipcMa
  })
 }

-async function runCommandOutput(command: string, args: string[], cwd?: string, env?: NodeJS.ProcessEnv, timeoutMs = 120_000): Promise<string> {
+async function runCommandOutput(command: string, args: string[], cwd?: string, env?: NodeJS.ProcessEnv, timeoutMs = 120_000, outputMode: 'combined' | 'stdout' = 'combined', input?: string): Promise<string> {
  const readProgress = createModuleProgressParser()
  return new Promise<string>((resolvePromise, rejectPromise) => {
    let output = ''
+    let stdout = ''
    let terminated = false
    const child = spawn(command, args, {
      cwd,
      detached: process.platform !== 'win32',
-      stdio: ['ignore', 'pipe', 'pipe'],
+      stdio: [input === undefined ? 'ignore' : 'pipe', 'pipe', 'pipe'],
      env: {
        ...process.env,
        ...env,
@@ -1754,12 +1831,17 @@ async function runCommandOutput(command: string, args: string[], cwd?: string, e
      rejectPromise(new Error(`${command} ${args.join(' ')} timed out`))
    }, timeoutMs)

-    child.stdout.setEncoding('utf8')
-    child.stdout.on('data', (data: string) => {
+    if (input !== undefined) {
+      child.stdin?.on('error', () => { /* Process exit is reported by close/error. */ })
+      child.stdin?.end(input)
+    }
+    child.stdout?.setEncoding('utf8')
+    child.stdout?.on('data', (data: string) => {
+      stdout += data.toString()
      output += data.toString()
      readProgress(data.toString())
    })
-    child.stderr.on('data', (data: Buffer) => {
+    child.stderr?.on('data', (data: Buffer) => {
      output += data.toString()
    })
    child.on('error', (error) => {
@@ -1769,7 +1851,7 @@ async function runCommandOutput(command: string, args: string[], cwd?: string, e
    child.on('close', (code) => {
      clearTimeout(timeout)
      if (terminated) return
-      if (code === 0) resolvePromise(output)
+      if (code === 0) resolvePromise(outputMode === 'stdout' ? stdout : output)
      else rejectPromise(new Error(output.trim() || `${command} ${args.join(' ')} failed with exit code ${code ?? 'unknown'}`))
    })
  })
@@ -1779,9 +1861,11 @@ async function runCommand(command: string, args: string[], cwd?: string, env?: N
  await runCommandOutput(command, args, cwd, env, timeoutMs)
 }

-async function listLocalDockerImages(): Promise<{ images: string[]; message?: string }> {
+async function listWorkspaceDockerImages(target?: RemoteWorkspaceTarget): Promise<{ images: string[]; message?: string }> {
  try {
-    const output = await runCommandOutput('docker', ['image', 'ls', '--format', '{{json .}}'], undefined, undefined, 10_000)
+    const output = target
+      ? await runSshOutput(target, "docker image ls --format '{{json .}}'", 10_000)
+      : await runCommandOutput('docker', ['image', 'ls', '--format', '{{json .}}'], undefined, undefined, 10_000)
    const images = Array.from(new Set(output.split('\n').flatMap((line) => {
      if (!line.trim()) return []
      try {
@@ -1799,7 +1883,7 @@ async function listLocalDockerImages(): Promise<{ images: string[]; message?: st
  } catch (error) {
    return {
      images: [],
-      message: error instanceof Error ? error.message : '로컬 Docker 이미지를 불러오지 못했습니다.'
+      message: error instanceof Error ? error.message : 'Docker 이미지를 불러오지 못했습니다.'
    }
  }
 }
@@ -2135,15 +2219,16 @@ async function runSshOutput(target: RemoteWorkspaceTarget, command: string, time
        '-i',
        normalized.identityFile,
        `${normalized.user}@${normalized.host}`,
-        command
+        remoteShellCommand(command)
      ],
      undefined,
-      undefined,
-      timeoutMs
+      remoteShellEnvironment(process.env),
+      timeoutMs,
+      'stdout'
    ))
 }

-async function runUnqueuedSshOutput(target: RemoteWorkspaceTarget, command: string, timeoutMs: number): Promise<string> {
+async function runUnqueuedSshOutput(target: RemoteWorkspaceTarget, command: string, timeoutMs: number, input?: string): Promise<string> {
  const normalized = normalizeRemoteTarget(target)
  return runCommandOutput(
    'ssh',
@@ -2167,11 +2252,13 @@ async function runUnqueuedSshOutput(target: RemoteWorkspaceTarget, command: stri
      '-i',
      normalized.identityFile,
      `${normalized.user}@${normalized.host}`,
-      command,
+      remoteShellCommand(command),
    ],
    undefined,
-    undefined,
+    remoteShellEnvironment(process.env),
    timeoutMs,
+    'stdout',
+    input,
  )
 }

@@ -2385,9 +2472,12 @@ async function readRemoteVisualizationBridgeStatus(target: RemoteWorkspaceTarget
      'docker ps --format "{{.Names}}\\t{{.Status}}" 2>/dev/null || true',
      10_000,
    )
-    const nav2 = output.split('\n').find((line) => line.startsWith('nav2-ros-bridge\t'))
-    const autoware = output.split('\n').find((line) => line.startsWith('autoware-ros-bridge\t'))
+    const lines = output.split('\n')
+    const nav2 = lines.find((line) => line.startsWith('nav2-ros-bridge\t'))
+    const slam = lines.find((line) => line.startsWith('slam-ros-bridge\t'))
+    const autoware = lines.find((line) => line.startsWith('autoware-ros-bridge\t'))
    if (nav2) return { ok: true, running: true, stack: 'nav2' }
+    if (slam) return { ok: true, running: true, stack: 'slam' }
    if (autoware) return { ok: true, running: true, stack: 'autoware' }
    return { ok: true, running: false, stack: null }
  } catch (error) {
@@ -2395,6 +2485,18 @@ async function readRemoteVisualizationBridgeStatus(target: RemoteWorkspaceTarget
  }
 }

+const managedVisualizationBridgeEnvKeys = new Set([
+  'ROS_DOMAIN_ID',
+  'ROS_LOCALHOST_ONLY',
+  'FASTDDS_DEFAULT_PROFILES_FILE',
+  'FASTRTPS_DEFAULT_PROFILES_FILE',
+  'AUTONOMY_STUDIO_ROS_NETWORK',
+])
+
+function isManagedVisualizationBridgeEnvKey(key: string): boolean {
+  return managedVisualizationBridgeEnvKeys.has(key)
+}
+
 async function startRemoteVisualizationBridge(
  target: RemoteWorkspaceTarget,
  stackInput?: string | null,
@@ -2409,7 +2511,7 @@ async function startRemoteVisualizationBridge(
  const fastDdsConfigPath = await prepareRemoteRosNetworkConfig(normalized, '~/.autonomy-studio/runtime/nav2', rosNetwork, rosDomainId)
  const containerName = visualizationBridgeContainerName(stack)
  const bridgeEnvArgs = Object.entries(environmentProfile?.bridge?.env ?? {})
-    .filter(([key]) => /^[A-Z_][A-Z0-9_]*$/.test(key))
+    .filter(([key]) => /^[A-Z_][A-Z0-9_]*$/.test(key) && !isManagedVisualizationBridgeEnvKey(key))
    .map(([key, value]) => `-e ${quoteShellSingle(`${key}=${value}`)}`)
    .join(' ')
  let image = resolveVisualizationBridgeImage(stack, environmentProfile?.bridge, environmentProfile?.runtimeImages)
@@ -2461,6 +2563,23 @@ async function startRemoteVisualizationBridge(
    ].join('\n'), 900_000)
  }
  const command = bridgeContainerCommand(stack)
+  let bridgeContextRevision: string | null = null
+  if (stack !== 'autoware') {
+    const context = resolveResourceContextPath('resources/slam-ros-bridge')
+    if (!context) throw new Error('Bundled SLAM bridge source is missing')
+    const files = { 'bridge.py': await readFile(join(context, 'bridge.py'), 'utf8'), 'requirements.txt': await readFile(join(context, 'requirements.txt'), 'utf8') }
+    bridgeContextRevision = createHash('sha256').update(JSON.stringify(files)).digest('hex')
+    await runUnqueuedSshOutput(target, `python3 -c ${quoteShellSingle([
+      'import json, os, pathlib, sys',
+      'data = json.load(sys.stdin)',
+      'root = pathlib.Path.home() / ".autonomy-studio/runtime/bridges" / data["revision"]',
+      'root.mkdir(parents=True, exist_ok=True)',
+      'for name in ("bridge.py", "requirements.txt"):',
+      '    temporary = root / ("." + name + "." + str(os.getpid()) + ".tmp")',
+      '    temporary.write_text(data["files"][name], encoding="utf-8")',
+      '    temporary.replace(root / name)',
+    ].join('\n'))}`, 30_000, JSON.stringify({ revision: bridgeContextRevision, files }))
+  }

  reportVisualizationProgress('시각화 시작 중...')

@@ -2478,6 +2597,7 @@ async function startRemoteVisualizationBridge(
      'docker run -d --name "$CONTAINER" --net=host',
      '-v /dev/shm:/dev/shm',
      '-v "$ROOT:/workspace"',
+      ...(bridgeContextRevision ? [`-v "$HOME/.autonomy-studio/runtime/bridges/${bridgeContextRevision}:/app:ro"`] : []),
      ...(fastDdsConfigPath ? ['-v "$FASTDDS_CONFIG_PATH:/fastdds_profiles.xml:ro"', '-e FASTDDS_DEFAULT_PROFILES_FILE=/fastdds_profiles.xml', '-e FASTRTPS_DEFAULT_PROFILES_FILE=/fastdds_profiles.xml'] : []),
      '-e "ROS_DOMAIN_ID=$ROS_DOMAIN_ID"',
      '-e ROS_LOCALHOST_ONLY=0',
@@ -3945,7 +4065,9 @@ async function startVisualizationBridge(
        CMD_VEL_TOPIC: '/cmd_vel',
        NAVIGATE_TO_POSE_ACTION: '/navigate_to_pose'
      } : {})
-    Object.entries(bridgeEnv).forEach(([key, value]) => args.push('-e', `${key}=${value}`))
+    Object.entries(bridgeEnv).forEach(([key, value]) => {
+      if (!isManagedVisualizationBridgeEnvKey(key)) args.push('-e', `${key}=${value}`)
+    })
    if (usesSlamBridge) {
      args.push('-e', `PORT=${bridgePort}`)
    }
@@ -4137,21 +4259,20 @@ async function installRemoteWorkspaceModule(
    `STUDENT_REPO="$(printf %s ${quoteShellSingle(encodeBase64(studentRepositoryWithCredential))} | base64 -d)"`,
    `PREBUILT_JSON="$(printf %s ${quoteShellSingle(encodeBase64(prebuiltJson))} | base64 -d)"`,
    'mkdir -p "$ROOT"',
-    'if [ ! -d "$TARGET/.git" ]; then git clone "$TEMPLATE_REPO" "$TARGET"; fi',
-    'git -C "$TARGET" remote set-url origin "$TEMPLATE_REPO"',
-    'git -C "$TARGET" fetch origin --prune',
-    'CURRENT_STUDENT="$(git -C "$TARGET" remote get-url student 2>/dev/null || true)"',
-    'if [ "$CURRENT_STUDENT" != "$STUDENT_REPO" ]; then',
-    '  git -C "$TARGET" checkout -B main origin/main',
-    '  git -C "$TARGET" reset --hard origin/main',
-    '  git -C "$TARGET" clean -fdx',
-    '  git -C "$TARGET" remote remove student >/dev/null 2>&1 || true',
+    // An existing workspace owns its source, commits and build artifacts. Install
+    // retries (including changed repository credentials) must not overwrite it.
+    'if [ -e "$TARGET/.git" ]; then',
+    '  printf "OK\\t%s\\n" "$TARGET"',
+    '  exit 0',
+    'fi',
+    'git clone "$TEMPLATE_REPO" "$TARGET"',
+    'if [ -n "$STUDENT_REPO" ]; then',
    '  git -C "$TARGET" remote add student "$STUDENT_REPO"',
-    '  git -C "$TARGET" fetch student --prune || true',
+    '  git -C "$TARGET" fetch student --prune',
    '  if git -C "$TARGET" show-ref --verify --quiet refs/remotes/student/main; then',
-    '    git -C "$TARGET" checkout -B student-work student/main',
+    '    git -C "$TARGET" checkout -b student-work student/main',
    '  else',
-    '    git -C "$TARGET" checkout -B student-work origin/main',
+    '    git -C "$TARGET" checkout -b student-work origin/main',
    '    git -C "$TARGET" push student student-work:main',
    '  fi',
    'fi',
@@ -4340,7 +4461,7 @@ function parseRosDomainId(input?: string | null): number {
  return Number.isInteger(value) && value >= 0 && value <= 232 ? value : 0
 }

-function buildFastDdsPeerConfig(peerAddress: string, localAddress: string, rosDomainId?: string | null): string {
+function buildFastDdsPeerConfig(peerAddress: string, localAddress: string, rosDomainId?: string | null, lanAddresses: string[] = []): string {
  const domainId = parseRosDomainId(rosDomainId)
  const discoveryBasePort = 7400 + (250 * domainId)
  // Fast DDS can bind the default discovery port itself (d0), while other
@@ -4350,7 +4471,7 @@ function buildFastDdsPeerConfig(peerAddress: string, localAddress: string, rosDo
    discoveryBasePort,
    ...Array.from({ length: 121 }, (_, participantId) => discoveryBasePort + 10 + (2 * participantId))
  ]
-  const localAddresses = Array.from(new Set(['127.0.0.1', localAddress]))
+  const localAddresses = Array.from(new Set(['127.0.0.1', localAddress, ...lanAddresses]))
  const peerAddresses = Array.from(new Set(['127.0.0.1', peerAddress]))
  return [
    '<?xml version="1.0" encoding="UTF-8" ?>',
@@ -4374,6 +4495,11 @@ function buildFastDdsPeerConfig(peerAddress: string, localAddress: string, rosDo
    '        <transport_id>autonomy_studio_udp</transport_id>',
      '      </userTransports>',
      '      <builtin>',
+    ...(lanAddresses.length ? [
+      '        <metatrafficMulticastLocatorList>',
+      `          <locator><udpv4><address>239.255.0.1</address><port>${discoveryBasePort}</port></udpv4></locator>`,
+      '        </metatrafficMulticastLocatorList>',
+    ] : []),
      '        <metatrafficUnicastLocatorList>',
    ...localAddresses.flatMap((address) => [
      '          <locator>',
@@ -4385,6 +4511,9 @@ function buildFastDdsPeerConfig(peerAddress: string, localAddress: string, rosDo
    ]),
      '        </metatrafficUnicastLocatorList>',
      '        <initialPeersList>',
+    ...(lanAddresses.length ? [
+      `          <locator><udpv4><address>239.255.0.1</address><port>${discoveryBasePort}</port></udpv4></locator>`,
+    ] : []),
    ...peerAddresses.flatMap((address) => peers.flatMap((port) => [
      '          <locator>',
      '            <udpv4>',
@@ -4470,25 +4599,51 @@ async function prepareLocalRosNetworkConfig(
  return configPath
 }

+function parseCameraLanAddresses(output: string): string[] {
+  const interfaces = output.split('\n').filter((line) => line.trim()).flatMap((line) => JSON.parse(line))
+  return Array.from(new Set<string>(interfaces.flatMap((item) =>
+    (item.addr_info ?? [])
+      .filter((address: { family?: string; scope?: string; local?: string }) =>
+        address.family === 'inet' && address.scope === 'global'
+        && typeof address.local === 'string'
+        && /^(?:\d{1,3}\.){3}\d{1,3}$/.test(address.local)
+        && address.local.split('.').every((part) => Number(part) <= 255))
+      .map((address: { local: string }) => address.local),
+  )))
+}
+
+function cameraLanEnabled(folderName: string): boolean {
+  return /^\[lms-nav2-yahboom-camera\]yahboom_camera_v[^/]+_ws$/.test(folderName)
+}
+
 async function prepareRemoteRosNetworkConfig(
  target: RemoteWorkspaceTarget,
  runtimeRoot: string,
  network?: RosNetworkConfig | null,
  rosDomainId?: string | null,
+  allowCameraLan = false,
 ): Promise<string | null> {
-  if (!rosNetworkEnabled(network)) return null
+  if (!rosNetworkEnabled(network) && !allowCameraLan) return null

  const [peerAddress, localAddress] = await Promise.all([
-    readLocalTailscaleIpv4(),
-    readRemoteTailscaleIpv4(target),
+    rosNetworkEnabled(network) ? readLocalTailscaleIpv4() : Promise.resolve('127.0.0.1'),
+    rosNetworkEnabled(network) ? readRemoteTailscaleIpv4(target) : Promise.resolve('127.0.0.1'),
  ])
-  const configPath = `${runtimeRoot}/docker/fastdds-peer-${peerAddress.replace(/[^0-9]/g, '-')}-d${parseRosDomainId(rosDomainId)}.xml`
+  const lanAddresses = allowCameraLan ? parseCameraLanAddresses(await runSshOutput(target, [
+    'set -e',
+    'for interface in /sys/class/net/*; do',
+    '  [ -e "$interface/device" ] || continue',
+    '  ip -j -4 address show dev "${interface##*/}" up scope global',
+    'done',
+  ].join('\n'), 15_000)) : []
+  if (allowCameraLan && !lanAddresses.length) throw new Error('카메라 내부망 통신에 사용할 활성 Ethernet/Wi-Fi IPv4 주소가 없습니다.')
+  const configPath = `${runtimeRoot}/docker/fastdds-peer-${peerAddress.replace(/[^0-9]/g, '-')}-d${parseRosDomainId(rosDomainId)}${allowCameraLan ? '-camera-lan' : ''}.xml`
  await runSsh(target, [
    'set -e',
    `CONFIG_PATH=${quoteShellSingle(configPath)}`,
    ...expandRemotePathVar('CONFIG_PATH'),
    'mkdir -p "$(dirname \"$CONFIG_PATH\")"',
-    `printf %s ${quoteShellSingle(encodeBase64(buildFastDdsPeerConfig(peerAddress, localAddress, rosDomainId)))} | base64 -d > "$CONFIG_PATH"`,
+    `printf %s ${quoteShellSingle(encodeBase64(buildFastDdsPeerConfig(peerAddress, localAddress, rosDomainId, lanAddresses)))} | base64 -d > "$CONFIG_PATH"`,
  ].join('\n'), 15_000)
  return configPath
 }
@@ -4640,10 +4795,19 @@ function buildNav2DockerRunScript(): string {
    'test -f "$MODULE_ROOT/$MODULE_FOLDER/install/setup.bash" || { echo "Module is not built: $MODULE_FOLDER" >&2; exit 1; }',
    ...yahboomDevicePreflight(),
    'CAMERA_DEVICE=""',
+    'CAMERA_DEVICES=()',
    'if [[ "$MODULE_FOLDER" == *lms-nav2-camera-test* ]]; then',
    '  CAMERA_DEVICE=/dev/video0',
    '  for arg in "$@"; do case "$arg" in video_device:=*) CAMERA_DEVICE=${arg#video_device:=} ;; esac; done',
-    '  [[ "$CAMERA_DEVICE" =~ ^/dev/video[0-9]+$ ]] && [ -c "$CAMERA_DEVICE" ] || { echo "Camera device not found: $CAMERA_DEVICE" >&2; exit 1; }',
+    '  if [ "$CAMERA_DEVICE" = /dev ]; then',
+    '    CAMERA_DISCOVERY="$MODULE_ROOT/$MODULE_FOLDER/src/camera_test_pkg/camera_test_pkg/devices.py"',
+    '    test -f "$CAMERA_DISCOVERY" || { echo "Update and rebuild the camera module for automatic discovery" >&2; exit 1; }',
+    '    camera_devices=$(python3 "$CAMERA_DISCOVERY" /dev) || exit 1',
+    '    mapfile -t CAMERA_DEVICES <<< "$camera_devices"',
+    '  else CAMERA_DEVICES=("$CAMERA_DEVICE"); fi',
+    '  for camera_device in "${CAMERA_DEVICES[@]}"; do',
+    '    [[ "$camera_device" =~ ^/dev/video[0-9]+$ ]] && [ -c "$camera_device" ] || { echo "Camera device not found: $camera_device" >&2; exit 1; }',
+    '  done',
    'fi',
    'docker rm -f "$CONTAINER_NAME" >/dev/null 2>&1 || true',
    '',
@@ -4663,7 +4827,7 @@ function buildNav2DockerRunScript(): string {
    ')',
    'if [ -n "$YAHBOOM_DEVICE" ]; then args+=(--device "$YAHBOOM_DEVICE:$YAHBOOM_DEVICE"); fi',
    'if [ -n "$CAMERA_DEVICE" ]; then',
-    '  args+=(--device "$CAMERA_DEVICE:$CAMERA_DEVICE")',
+    '  for camera_device in "${CAMERA_DEVICES[@]}"; do args+=(--device "$camera_device:$camera_device"); done',
    '  for capture_device in /dev/capture-vi-channel*; do',
    '    if [ -c "$capture_device" ]; then args+=(--device "$capture_device:$capture_device"); fi',
    '  done',
@@ -5340,7 +5504,8 @@ async function startRemoteWorkspaceModule(
  const runtimeRoot = nav2Module
    ? await ensureRemoteNav2RuntimeAssets(target)
    : await ensureRemoteStudioRuntimeAssets(target)
-  const fastDdsConfigPath = await prepareRemoteRosNetworkConfig(target, runtimeRoot, rosNetwork, rosDomainId)
+  const allowCameraLan = cameraLanEnabled(targetFolderName)
+  const fastDdsConfigPath = await prepareRemoteRosNetworkConfig(target, runtimeRoot, rosNetwork, rosDomainId, allowCameraLan)
  await prepareRemoteRuntimeImages(target, targetFolderName.includes('lms-nav2-camera-test')
    ? (runtimeImages ?? []).filter((item) => item.image?.trim() === runtimeImage)
    : yahboomRuntimeArtifacts(targetFolderName, runtimeImage, runtimeImages))
@@ -5393,7 +5558,7 @@ async function startRemoteWorkspaceModule(
          ...expandRemotePathVar('ROOT'),
          `PARAMS=${quoteShellSingle(remoteRosParams)}`,
          `FASTDDS_CONFIG_PATH=${quoteShellSingle(fastDdsConfigPath ?? '')}`,
-          `ROS_LOCALHOST_ONLY=${rosNetworkEnabled(rosNetwork) ? '0' : '1'}`,
+          `ROS_LOCALHOST_ONLY=${rosNetworkEnabled(rosNetwork) || allowCameraLan ? '0' : '1'}`,
          ...expandRemotePathVar('FASTDDS_CONFIG_PATH'),
          'read -r -a EXTRA_ARGS <<< "$PARAMS"',
          'export FASTDDS_CONFIG_PATH',
@@ -5603,36 +5768,8 @@ async function resetRemoteWorkspaceSession(
  targetInput: RemoteWorkspaceTarget,
  modules: Array<{ moduleName: string; folderName?: string | null; templateRepositoryUrl?: string | null }>,
 ): Promise<{ ok: boolean; message: string }> {
-  try {
-    const target = normalizeRemoteTarget(targetInput)
-    await stopRemoteWorkspaceModules(target, modules).catch(() => ({ ok: false, message: '모듈 중지 실패' }))
-    const commands = [
-      'set -e',
-      `ROOT=${quoteShellSingle(target.workspaceRoot)}`,
-      ...expandRemotePathVar('ROOT'),
-    ]
-    for (const module of modules) {
-      const folderName = module.folderName?.trim()
-      const templateRepositoryUrl = module.templateRepositoryUrl?.trim()
-      if (!folderName || !templateRepositoryUrl) continue
-      const templateRepositoryWithCredential = withGitCredential(remoteRepositoryUrl(templateRepositoryUrl))
-      commands.push(
-        `MODULE="$ROOT/${folderName}"`,
-        'if [ -d "$MODULE/.git" ]; then',
-        '  git -C "$MODULE" remote remove student >/dev/null 2>&1 || true',
-        `  git -C "$MODULE" remote set-url origin ${quoteShellSingle(templateRepositoryWithCredential)}`,
-        '  git -C "$MODULE" fetch origin --prune',
-        '  git -C "$MODULE" checkout -B main origin/main',
-        '  git -C "$MODULE" reset --hard origin/main',
-        '  git -C "$MODULE" clean -fdx',
-        'fi',
-      )
-    }
-    await runSsh(target, commands.join('\n'), 180000)
-    return { ok: true, message: '템플릿 기준으로 초기화했습니다.' }
-  } catch (error) {
-    return { ok: false, message: error instanceof Error ? error.message : String(error) }
-  }
+  // Keep the legacy IPC contract without resetting student files or Git history.
+  return stopRemoteWorkspaceModules(targetInput, modules)
 }

 async function restartWorkspaceModule(
@@ -5704,13 +5841,298 @@ async function readRemoteWorkspaceModuleLogs(
  if (!existsOutput.trim()) return { ok: true, logs: '', message: '생성된 컨테이너가 없습니다.' }

  try {
-    const logs = await runSshOutput(target, `docker logs --timestamps --tail 300 ${quoteShellSingle(containerKey)}`, 10000)
+    const logs = await runSshOutput(target, `docker logs --timestamps --tail 300 ${quoteShellSingle(containerKey)} 2>&1`, 10000)
    return { ok: true, logs }
  } catch (error) {
    return { ok: false, logs: '', message: error instanceof Error ? error.message : String(error) }
  }
 }

+type AgentCommandResult = {
+  ok: boolean
+  output: string
+  exitCode: number | null
+  message?: string
+}
+
+const allowedAgentExecutables = new Set([
+  'bash', 'cat', 'cmake', 'colcon', 'find', 'git', 'grep', 'head', 'ls', 'make', 'ninja', 'node', 'npm', 'npx',
+  'pnpm', 'printenv', 'pwd', 'python', 'python3', 'pytest', 'rg', 'ros2', 'sed', 'sh', 'tail', 'which', 'yarn'
+])
+
+function validateAgentCommand(input: string): string {
+  const command = input.trim()
+  if (!command || command.length > 2000) throw new Error('명령 길이가 허용 범위를 벗어났습니다.')
+  if (/[\0\r\n`;{}<>]|\$\(|\.\.\//.test(command)) throw new Error('명령 치환, 경로 이탈 또는 리다이렉션은 허용되지 않습니다.')
+  if (/\b(?:sudo|su|shutdown|reboot|poweroff|halt|mkfs|fdisk|parted|mount|umount|passwd|useradd|userdel|chown)\b/i.test(command)) {
+    throw new Error('시스템 권한 또는 설정을 변경하는 명령은 허용되지 않습니다.')
+  }
+  if (/\brm\b|\b(?:curl|wget)\b[^|]*\|/i.test(command)) throw new Error('삭제 또는 원격 스크립트 실행 명령은 허용되지 않습니다.')
+  if (/(^|\s)(?:~\/(?:\.ssh|\.aws|\.config)|\/[^\s]*\/\.(?:ssh|aws)\/|\/etc\/|\/boot\/|\/proc\/|\/sys\/|\/dev\/|\.env(?:\s|$))/i.test(command)) {
+    throw new Error('시스템 또는 자격증명 경로에는 접근할 수 없습니다.')
+  }
+
+  const withoutAnd = command.replace(/&&|\|\|/g, '')
+  if (/[&]/.test(withoutAnd)) throw new Error('백그라운드 명령은 허용되지 않습니다.')
+  const segments = command.split(/&&|\|\||\|/).map((segment) => segment.trim()).filter(Boolean)
+  for (const segment of segments) {
+    const tokens = segment.split(/\s+/).filter(Boolean)
+    while (tokens[0] && /^[A-Za-z_][A-Za-z0-9_]*=/.test(tokens[0])) tokens.shift()
+    const executable = tokens[0]
+    if (!executable) throw new Error('실행할 명령을 확인할 수 없습니다.')
+    if (executable === 'source' || executable === '.') {
+      const sourcePath = tokens[1] ?? ''
+      if (!/^(?:\/opt\/ros\/[A-Za-z0-9._-]+\/setup\.bash|\.?\/?(?:install|build)\/setup\.bash)$/.test(sourcePath)) {
+        throw new Error('허용되지 않은 환경 설정 파일입니다.')
+      }
+      continue
+    }
+    if (executable.startsWith('./')) {
+      if (!/^\.\/[A-Za-z0-9_./-]+\.sh$/.test(executable)) throw new Error('모듈 내부의 셸 스크립트만 실행할 수 있습니다.')
+      continue
+    }
+    if (!allowedAgentExecutables.has(executable)) throw new Error(`허용되지 않은 실행 파일입니다: ${executable}`)
+    if (executable === 'bash' || executable === 'sh') {
+      const scriptPath = tokens[1] ?? ''
+      if (!/^(?:\.\/)?[A-Za-z0-9_./-]+\.sh$/.test(scriptPath)) {
+        throw new Error('bash와 sh는 모듈 내부의 셸 스크립트만 실행할 수 있습니다.')
+      }
+    }
+    if ((executable === 'python' || executable === 'python3') && tokens.some((token) => token === '-c')) {
+      throw new Error('인라인 Python 코드는 실행할 수 없습니다.')
+    }
+    if (executable === 'node' && tokens.some((token) => token === '-e' || token === '--eval')) {
+      throw new Error('인라인 Node.js 코드는 실행할 수 없습니다.')
+    }
+    if (executable === 'find' && tokens.some((token) => token === '-exec' || token === '-execdir' || token === '-delete')) {
+      throw new Error('find의 실행 및 삭제 옵션은 허용되지 않습니다.')
+    }
+    if (executable === 'sed' && tokens.some((token) => token === '-i' || token.startsWith('-i'))) {
+      throw new Error('명령을 통한 파일 직접 수정은 허용되지 않습니다.')
+    }
+    if (executable === 'git' && !/^(?:status|diff|log|show|rev-parse|branch)$/.test(tokens[1] ?? '')) {
+      throw new Error('Agent는 Git 조회 명령만 실행할 수 있습니다.')
+    }
+    if (executable === 'ros2' && !/^(?:topic|node|interface|doctor|pkg|run|launch)$/.test(tokens[1] ?? '')) {
+      throw new Error('허용되지 않은 ROS2 명령입니다.')
+    }
+    if (executable === 'ros2' && /\b(?:pub|call|send_goal)\b/.test(segment)) {
+      throw new Error('ROS2 발행 및 제어 명령은 Agent에서 실행할 수 없습니다.')
+    }
+  }
+  return command
+}
+
+function appendAgentCommandOutput(current: string, chunk: string): string {
+  const next = current + chunk
+  return next.length > 80_000 ? next.slice(-80_000) : next
+}
+
+function isAgentRos2Command(command: string): boolean {
+  return /(?:^|&&|\|\|?|;)\s*ros2\s+/.test(command)
+}
+
+function isAgentRos2RuntimeCommand(command: string): boolean {
+  return /(?:^|&&|\|\|?|;)\s*ros2\s+(?:run|launch)\b/.test(command)
+}
+
+function agentContainerCommandArgs(container: { id: string; cwd: string }, command: string, observeRuntime: boolean): string[] {
+  const init = [
+    'if [ -n "$ROS_DISTRO" ] && [ -f "/opt/ros/$ROS_DISTRO/setup.bash" ]; then source "/opt/ros/$ROS_DISTRO/setup.bash"; fi',
+    'if [ -f ./install/setup.bash ]; then source ./install/setup.bash; fi',
+    command
+  ].join('; ')
+  return [
+    'exec', '-w', container.cwd, container.id,
+    ...(observeRuntime ? ['timeout', '--signal=INT', '--kill-after=5s', '20s'] : []),
+    'bash', '--noprofile', '--norc', '-lc', init
+  ]
+}
+
+async function resolveLocalAgentContainer(moduleRoot: string, folderName?: string | null): Promise<{ id: string; cwd: string }> {
+  const info = parseModuleDockerInfo(folderName?.trim() || basename(moduleRoot))
+  if (!info || !isAllowedContainerName(info.containerKey)) throw new Error('모듈 컨테이너 정보를 확인할 수 없습니다.')
+  const inspect = await runCommandOutput('docker', ['inspect', info.containerKey], undefined, undefined, 10_000)
+  return resolveContainerTerminal(inspect, moduleRoot)
+}
+
+async function resolveRemoteAgentContainer(
+  target: ReturnType<typeof normalizeRemoteTarget>,
+  moduleRoot: string,
+  folderName?: string | null
+): Promise<{ id: string; cwd: string }> {
+  const info = parseModuleDockerInfo(folderName?.trim() || basename(moduleRoot))
+  if (!info || !isAllowedContainerName(info.containerKey)) throw new Error('모듈 컨테이너 정보를 확인할 수 없습니다.')
+  const inspect = await runSshOutput(target, `docker inspect ${quoteShellSingle(info.containerKey)}`, 10_000)
+  return resolveContainerTerminal(inspect, moduleRoot)
+}
+
+async function runLocalAgentCommand(moduleName: string, commandInput: string, workspaceRoot?: string | null, folderName?: string | null): Promise<AgentCommandResult> {
+  const command = validateAgentCommand(commandInput)
+  const moduleRoot = await findWorkspaceModuleRoot(moduleName, workspaceRoot, folderName)
+  if (!moduleRoot) throw new Error('설치된 모듈을 찾을 수 없습니다.')
+
+  const observeRuntime = isAgentRos2RuntimeCommand(command)
+  const container = isAgentRos2Command(command) ? await resolveLocalAgentContainer(moduleRoot, folderName) : null
+  const executable = container ? 'docker' : '/bin/bash'
+  const args = container
+    ? agentContainerCommandArgs(container, command, observeRuntime)
+    : ['--noprofile', '--norc', '-lc', command]
+
+  return new Promise<AgentCommandResult>((resolvePromise) => {
+    let output = ''
+    let timedOut = false
+    const child = spawn(executable, args, {
+      cwd: container ? undefined : moduleRoot,
+      detached: process.platform !== 'win32',
+      stdio: ['ignore', 'pipe', 'pipe'],
+      env: { ...process.env, GIT_TERMINAL_PROMPT: '0' }
+    })
+    const timeout = setTimeout(() => {
+      timedOut = true
+      if (process.platform !== 'win32' && child.pid) {
+        try { process.kill(-child.pid, 'SIGTERM') } catch { /* already exited */ }
+      } else child.kill('SIGTERM')
+    }, observeRuntime ? 30_000 : 120_000)
+    child.stdout.setEncoding('utf8')
+    child.stderr.setEncoding('utf8')
+    child.stdout.on('data', (data: string) => { output = appendAgentCommandOutput(output, data) })
+    child.stderr.on('data', (data: string) => { output = appendAgentCommandOutput(output, data) })
+    child.on('error', (error) => {
+      clearTimeout(timeout)
+      resolvePromise({ ok: false, output, exitCode: null, message: error.message })
+    })
+    child.on('close', (code) => {
+      clearTimeout(timeout)
+      const exitCode = typeof code === 'number' ? code : null
+      const observationCompleted = observeRuntime && exitCode === 124
+      if (observationCompleted) {
+        output = appendAgentCommandOutput(output, '\n[20초 동안 실행을 확인한 뒤 프로세스를 종료했습니다.]\n')
+      }
+      resolvePromise({
+        ok: !timedOut && (exitCode === 0 || observationCompleted),
+        output,
+        exitCode: observationCompleted ? 0 : exitCode,
+        message: timedOut ? `명령 실행 시간이 ${observeRuntime ? 30 : 120}초를 초과했습니다.` : undefined
+      })
+    })
+  })
+}
+
+async function runRemoteAgentCommand(targetInput: RemoteWorkspaceTarget, moduleName: string, commandInput: string, folderName?: string | null): Promise<AgentCommandResult> {
+  const command = validateAgentCommand(commandInput)
+  const resolved = await resolveRemoteGitModuleRoot(targetInput, moduleName, folderName)
+  const marker = '__AUTONOMY_AGENT_EXIT_CODE__:'
+  try {
+    const observeRuntime = isAgentRos2RuntimeCommand(command)
+    const container = isAgentRos2Command(command)
+      ? await resolveRemoteAgentContainer(resolved.target, resolved.moduleRoot, folderName)
+      : null
+    const invocation = container
+      ? ['docker', ...agentContainerCommandArgs(container, command, observeRuntime)].map(quoteShellSingle).join(' ')
+      : `bash --noprofile --norc -lc ${quoteShellSingle(command)}`
+    const rawOutput = await runSshOutput(resolved.target, [
+      `cd ${quoteShellSingle(resolved.moduleRoot)}`,
+      `${invocation} 2>&1`,
+      'CODE=$?',
+      `printf '\\n${marker}%s\\n' "$CODE"`,
+    ].join('; '), observeRuntime ? 35_000 : 130_000)
+    const markerIndex = rawOutput.lastIndexOf(marker)
+    const exitCode = markerIndex >= 0 ? Number.parseInt(rawOutput.slice(markerIndex + marker.length).trim(), 10) : null
+    const observationCompleted = observeRuntime && exitCode === 124
+    let output = appendAgentCommandOutput('', markerIndex >= 0 ? rawOutput.slice(0, markerIndex).trimEnd() : rawOutput)
+    if (observationCompleted) output = appendAgentCommandOutput(output, '\n[20초 동안 실행을 확인한 뒤 프로세스를 종료했습니다.]')
+    return {
+      ok: exitCode === 0 || observationCompleted,
+      output,
+      exitCode: observationCompleted ? 0 : exitCode,
+      message: markerIndex < 0 ? '원격 명령의 종료 코드를 확인하지 못했습니다.' : undefined
+    }
+  } catch (error) {
+    return { ok: false, output: '', exitCode: null, message: error instanceof Error ? error.message : String(error) }
+  }
+}
+
+function agentFolder(folderName?: string | null): string | undefined {
+  if (folderName == null) return undefined
+  if (!/^[A-Za-z0-9[\](). _-]{1,160}$/.test(folderName) || folderName === '.' || folderName === '..') throw new Error('모듈 폴더명이 올바르지 않습니다.')
+  return folderName
+}
+
+async function runWorkspaceAgentTool(input: AgentToolRequest, workspaceRoot?: string, folderName?: string, remote?: RemoteWorkspaceTarget): Promise<AgentToolResult> {
+  const request = validateAgentTool(input)
+  const target = remote ? `ssh:${normalizeRemoteTarget(remote).host}` : 'local-host'
+  const result: AgentToolResult = { id: request.id, name: request.name, moduleName: request.moduleName, status: 'ok', observedAt: new Date().toISOString(), target, data: '', truncated: false }
+  try {
+    const folder = agentFolder(folderName)
+    const resolved = remote ? await resolveRemoteGitModuleRoot(remote, request.moduleName!, folder) : null
+    const root = resolved?.moduleRoot ?? await findWorkspaceModuleRoot(request.moduleName!, workspaceRoot, folder)
+    if (!root) throw new Error('설치된 모듈을 찾을 수 없습니다.')
+    let payload: unknown
+    if (request.name.startsWith('files.')) {
+      const response = remote
+        ? JSON.parse(await runUnqueuedSshOutput(resolved!.target, agentRemoteFilesScript({ root, request }), 30_000))
+        : await runAgentFileTool(root, request)
+      payload = response.data
+      result.truncated = response.truncated
+    } else if (request.name === 'logs.read') {
+      const response = remote
+        ? await readRemoteWorkspaceModuleLogs(remote, request.moduleName!, folder)
+        : await readWorkspaceModuleLogs(request.moduleName!, workspaceRoot, folder)
+      payload = { ...response, logs: response.logs.slice(-20_000) }
+      if (!response.ok) result.status = 'error'
+      result.truncated = response.logs.length > 20_000
+    } else {
+      const host = (executable: string, args: string[]): Promise<string> => remote
+        ? runUnqueuedSshOutput(resolved!.target, [executable, ...args].map(quoteShellSingle).join(' '), 12_000)
+        : runCommandOutput(executable, args, undefined, undefined, 12_000, 'stdout')
+      const container = async (command: string): Promise<string> => {
+        const runtime = remote ? await resolveRemoteAgentContainer(resolved!.target, root, folder) : await resolveLocalAgentContainer(root, folder)
+        const args = agentContainerCommandArgs(runtime, command, false)
+        // Unlike free-form commands, these fixed probes always have a container-side deadline.
+        args.splice(4, 0, 'timeout', '--signal=INT', '--kill-after=2s', '10s')
+        return host('docker', args)
+      }
+      payload = await inspectAgentRuntime(request, host, container)
+      if (request.name === 'network.inspect' && (payload as { container?: { error?: string } }).container?.error) result.truncated = true
+      if (request.name === 'ros.inspect') result.target += ':module-container'
+    }
+    result.data = JSON.stringify(payload)
+    if (result.data.length > 60_000) {
+      result.data = JSON.stringify({ message: '조회 결과가 용량 한도를 초과했습니다. 파일 범위나 검색어를 좁혀주세요.', excerpt: result.data.slice(0, 20_000) })
+      result.truncated = true
+    }
+  } catch (error) {
+    result.status = 'error'
+    result.data = JSON.stringify({ error: (error instanceof Error ? error.message : String(error)).slice(-2000) })
+  }
+  return result
+}
+
+let agentFileApplyPending = false
+async function applyWorkspaceAgentFiles(changes: AgentCheckedChange[], workspaceRoot?: string, remote?: RemoteWorkspaceTarget): Promise<{ ok: boolean }> {
+  if (agentFileApplyPending) throw new Error('다른 파일 변경안을 적용 중입니다.')
+  agentFileApplyPending = true
+  try { return await applyWorkspaceAgentFilesOnce(changes, workspaceRoot, remote) }
+  finally { agentFileApplyPending = false }
+}
+
+async function applyWorkspaceAgentFilesOnce(changes: AgentCheckedChange[], workspaceRoot?: string, remote?: RemoteWorkspaceTarget): Promise<{ ok: boolean }> {
+  if (!Array.isArray(changes) || !changes.length || changes.length > 24) throw new Error('변경 파일 수를 확인하세요.')
+  const resolved: Array<AgentCheckedChange & { root: string }> = []
+  for (const change of changes) {
+    if (!change || typeof change.content !== 'string' || change.content.length > 200_000 || (change.expectedHash !== null && !/^[a-f0-9]{64}$/.test(change.expectedHash))) throw new Error('검증된 파일 변경안이 아닙니다.')
+    validateAgentTool({ id: 'apply-check', name: 'files.read', moduleName: change.moduleName, args: { path: change.path } })
+    const folder = agentFolder(change.folderName)
+    const root = remote ? (await resolveRemoteGitModuleRoot(remote, change.moduleName, folder)).moduleRoot : await findWorkspaceModuleRoot(change.moduleName, workspaceRoot, folder)
+    if (!root) throw new Error(`변경 대상 모듈이 설치되지 않았습니다: ${change.moduleName}`)
+    resolved.push({ ...change, root })
+  }
+  if (remote) await runUnqueuedSshOutput(remote, 'bash --noprofile --norc -s', 30_000, agentRemoteFilesScript({ changes: resolved }))
+  else await applyAgentFiles(resolved)
+  return { ok: true }
+}
+
 async function collectModuleFiles(moduleName: string, workspaceRoot?: string | null, folderName?: string | null): Promise<CachedModuleFiles> {
  const rootPath = await findModuleRoot(moduleName, workspaceRoot, folderName)
  if (!rootPath) return { root: null, absoluteRoot: null, files: {}, folders: [] }
@@ -5980,7 +6402,8 @@ async function containerTerminalCommand(moduleRoot: string, moduleName: string |
  const container = resolveContainerTerminal(output, moduleRoot)
  const shell = buildWorkspaceShellCommand(moduleName, container.cwd, cols, rows, false)
  const init = 'if [ -n "$ROS_DISTRO" ] && [ -f "/opt/ros/$ROS_DISTRO/setup.bash" ]; then source "/opt/ros/$ROS_DISTRO/setup.bash"; fi; if [ -f ./install/setup.bash ]; then source ./install/setup.bash; fi; exec ' + shell
-  return `exec docker exec -it -e TERM=xterm-256color -w ${quoteShellSingle(container.cwd)} ${quoteShellSingle(container.id)} /bin/bash --noprofile --norc -c ${quoteShellSingle(init)}`
+  const containerShell = target ? remoteShellCommand(init) : `/bin/bash --noprofile --norc -c ${quoteShellSingle(init)}`
+  return `exec docker exec -it -e TERM=xterm-256color -w ${quoteShellSingle(container.cwd)} ${quoteShellSingle(container.id)} ${containerShell}`
 }

 function registerTerminalHandlers(): void {
@@ -6079,14 +6502,15 @@ function registerTerminalHandlers(): void {
      '-i',
      target.identityFile,
      `${target.user}@${target.host}`,
-      mode === 'container'
+      remoteShellCommand(mode === 'container'
        ? await containerTerminalCommand(resolved.moduleRoot, moduleName, safeCols, safeRows, target)
-        : buildWorkspaceShellCommand(moduleName, resolved.moduleRoot, safeCols, safeRows, true)
+        : buildWorkspaceShellCommand(moduleName, resolved.moduleRoot, safeCols, safeRows, true))
    ], {
      name: 'xterm-256color',
      cols: safeCols,
      rows: safeRows,
-      env: terminalEnvironment(safeCols, safeRows)
+      env: Object.fromEntries(Object.entries(remoteShellEnvironment(terminalEnvironment(safeCols, safeRows)))
+        .filter((entry): entry is [string, string] => typeof entry[1] === 'string'))
    })

    attachTerminalProcess(event.sender, sessionId, terminalKey, proc)
@@ -6343,7 +6767,15 @@ function registerLocalWorkspaceHandlers(): void {
    closeSplashAndShowMain()
  })
  ipcMain.handle('local-workspace:modules:list', (_event, workspaceRoot?: string | null, courseModules?: CourseModuleInput[] | null) => collectAvailableModules(workspaceRoot, courseModules))
-  ipcMain.handle('local-workspace:modules:docker-images', () => listLocalDockerImages())
+  ipcMain.handle('local-workspace:modules:docker-images', () => listWorkspaceDockerImages())
+  ipcMain.handle('local-workspace:modules:git-sources', (_event, root: string) => {
+    const workspace = expandUserPath(root)
+    if (!workspace) throw new Error('워크스페이스 경로가 설정되어 있지 않습니다.')
+    return listLocalGitModules(workspace)
+  })
+  ipcMain.handle('local-workspace:modules:git-source', (_event, root: string, folder: string) => inspectLocalGitModule(root, folder))
+  ipcMain.handle('remote-workspace:modules:import-git', (_event, target: RemoteWorkspaceTarget, root: string, input: GitModuleImportInput & { folderName: string }) => importRemoteGitModule(target, root, input))
+  ipcMain.handle('remote-workspace:modules:docker-images', (_event, target: RemoteWorkspaceTarget) => listWorkspaceDockerImages(target))
  ipcMain.handle('local-workspace:docker:status', () => checkDockerStatus())
  ipcMain.handle('local-workspace:docker:guide', () => shell.openExternal('https://docs.docker.com/engine/install/'))
  ipcMain.handle('local-workspace:ros-graph', () => collectLocalRosGraph())
@@ -6365,6 +6797,26 @@ function registerLocalWorkspaceHandlers(): void {
  ipcMain.handle('local-workspace:modules:stop-running', () => stopRunningWorkspaceContainers())
  ipcMain.handle('local-workspace:modules:restart', (_event, moduleName: string, workspaceRoot?: string | null, folderName?: string | null, rosParams?: string | null, gpuEnabled?: boolean | null, rosDomainId?: string | null, runtimeImages?: RuntimeImageArtifact[] | null, rosNetwork?: RosNetworkConfig | null) => restartWorkspaceModule(moduleName, workspaceRoot, folderName, rosParams, gpuEnabled, rosDomainId, runtimeImages, rosNetwork))
  ipcMain.handle('local-workspace:modules:logs', (_event, moduleName: string, workspaceRoot?: string | null, folderName?: string | null) => readWorkspaceModuleLogs(moduleName, workspaceRoot, folderName))
+  ipcMain.handle('local-workspace:agent-command:run', (_event, moduleName: string, command: string, workspaceRoot?: string | null, folderName?: string | null) => runLocalAgentCommand(moduleName, command, workspaceRoot, folderName))
+  const checkAgentSender = (event: Electron.IpcMainInvokeEvent): void => {
+    if (event.sender !== mainWindow?.webContents || event.senderFrame !== event.sender.mainFrame) throw new Error('허용되지 않은 에이전트 요청입니다.')
+  }
+  ipcMain.handle('local-workspace:agent-tool:read', (event, request: AgentToolRequest, workspaceRoot?: string, folderName?: string) => {
+    checkAgentSender(event)
+    return runWorkspaceAgentTool(request, workspaceRoot, folderName)
+  })
+  ipcMain.handle('remote-workspace:agent-tool:read', (event, target: RemoteWorkspaceTarget, request: AgentToolRequest, folderName?: string) => {
+    checkAgentSender(event)
+    return runWorkspaceAgentTool(request, undefined, folderName, target)
+  })
+  ipcMain.handle('local-workspace:agent-files:apply', (event, changes: AgentCheckedChange[], workspaceRoot?: string) => {
+    checkAgentSender(event)
+    return applyWorkspaceAgentFiles(changes, workspaceRoot)
+  })
+  ipcMain.handle('remote-workspace:agent-files:apply', (event, target: RemoteWorkspaceTarget, changes: AgentCheckedChange[]) => {
+    checkAgentSender(event)
+    return applyWorkspaceAgentFiles(changes, undefined, target)
+  })
  ipcMain.handle('local-workspace:modules:update-parameters', (_event, moduleName: string, workspaceRoot?: string | null, folderName?: string | null, rosParams?: string) => updateWorkspaceModuleParameters(moduleName, workspaceRoot, folderName, rosParams))
  ipcMain.handle('local-workspace:nav2:set-simulator-pose', (_event, pose?: { x?: number; y?: number; yaw?: number } | null) => setNav2SimulatorPose(pose))
  ipcMain.handle('local-workspace:nav2:add-runtime-obstacle', (_event, obstacle?: Nav2RuntimeObstacle | null) => addNav2RuntimeObstacle(obstacle))
@@ -6429,6 +6881,7 @@ function registerLocalWorkspaceHandlers(): void {
  ipcMain.handle('remote-workspace:ros:reset-session', (_event, target: RemoteWorkspaceTarget) => resetRemoteRosSession(target))
  ipcMain.handle('remote-workspace:modules:restart', (_event, target: RemoteWorkspaceTarget, moduleName: string, folderName?: string | null, rosParams?: string | null, gpuEnabled?: boolean | null, rosDomainId?: string | null, runtimeImages?: RuntimeImageArtifact[] | null, rosNetwork?: RosNetworkConfig | null) => restartRemoteWorkspaceModule(target, moduleName, folderName, rosParams, gpuEnabled, rosDomainId, runtimeImages, rosNetwork))
  ipcMain.handle('remote-workspace:modules:logs', (_event, target: RemoteWorkspaceTarget, moduleName: string, folderName?: string | null) => readRemoteWorkspaceModuleLogs(target, moduleName, folderName))
+  ipcMain.handle('remote-workspace:agent-command:run', (_event, target: RemoteWorkspaceTarget, moduleName: string, command: string, folderName?: string | null) => runRemoteAgentCommand(target, moduleName, command, folderName))
  ipcMain.handle('remote-workspace:visualization:status', (_event, target: RemoteWorkspaceTarget) => readRemoteVisualizationBridgeStatus(target))
  ipcMain.handle('remote-workspace:visualization:start', (_event, target: RemoteWorkspaceTarget, stack?: string | null, rosDomainId?: string | null, environmentProfile?: EnvironmentProfileConfig | null, rosNetwork?: RosNetworkConfig | null, requestId?: string) => visualizationProgress.run((message) => { if (!_event.sender.isDestroyed()) _event.sender.send('visualization:progress', requestId, message) }, () => startRemoteVisualizationBridge(target, stack, rosDomainId, environmentProfile, rosNetwork)))
  ipcMain.handle('remote-workspace:visualization:stop', (_event, target: RemoteWorkspaceTarget) => stopRemoteVisualizationBridge(target))
@@ -6610,6 +7063,9 @@ app.whenReady().then(() => {
    return { opened: true }
  })
  ipcMain.handle('app-diagnostics:read', () => readAppDiagnostics())
+  ipcMain.handle('chat-text:context-menu', showChatTextMenu)
+  ipcMain.handle('chat-text:clipboard-state', readChatClipboardState)
+  ipcMain.handle('chat-text:clipboard-action', performChatClipboardAction)
  ipcMain.on('titlebar-close', (event) => BrowserWindow.fromWebContents(event.sender)?.close())
  ipcMain.on('app-quit', () => app.quit())
  ipcMain.handle('learning-video:open', (event, input: LearningVideoInput) => openLearningVideoWindow(BrowserWindow.fromWebContents(event.sender), input))
@@ -7,7 +7,7 @@ import base64, json, os, stat, sys
 args = json.loads(base64.b64decode(sys.argv[1]))
 root = os.path.realpath(args['root'])
 skip = {'.git', 'build', 'install', 'log', 'node_modules', 'docker'}
-extensions = {'.c', '.cc', '.cpp', '.cxx', '.h', '.hpp', '.hh', '.py', '.xml', '.urdf', '.xacro', '.yaml', '.yml', '.json', '.txt', '.md', '.cmake', '.launch', '.sh', '.bash', '.toml', '.ini', '.cfg', '.rviz'}
+extensions = {'.c', '.cc', '.cpp', '.cxx', '.h', '.hpp', '.hh', '.py', '.xml', '.urdf', '.xacro', '.sdf', '.world', '.config', '.yaml', '.yml', '.json', '.txt', '.md', '.cmake', '.launch', '.sh', '.bash', '.toml', '.ini', '.cfg', '.rviz'}
 placeholder = 'Binary or large file preview is not available.'
 def content(relative):
    if os.path.isabs(relative) or '..' in relative.split('/'):
@@ -0,0 +1,28 @@
+function quote(value: string): string {
+  return `'${value.replace(/'/g, `'"'"'`)}'`
+}
+
+// SSH may forward LANG/LC_* through the user's SendEnv configuration.
+// Undefined entries also remove inherited keys when merged by the command runner.
+export function remoteShellEnvironment(env: NodeJS.ProcessEnv): NodeJS.ProcessEnv {
+  const result = { ...env }
+  for (const key of Object.keys(result)) {
+    if (key === 'LANGUAGE' || key.startsWith('LC_')) result[key] = undefined
+  }
+  return { ...result, LANG: 'C', LC_ALL: 'C' }
+}
+
+export function remoteShellCommand(command: string): string {
+  const script = [
+    'selected_locale=C',
+    // Probe under C so an inherited, unavailable locale cannot break the probe.
+    'available_locales=$(locale -a 2>/dev/null) || available_locales=',
+    'for candidate in $available_locales; do',
+    '  case "$candidate" in C.utf8|C.UTF-8) selected_locale=$candidate; break ;;',
+    '    *utf8|*UTF-8|*utf-8) if [ "$selected_locale" = C ]; then selected_locale=$candidate; fi ;;',
+    '  esac',
+    'done',
+    `exec env LANG="$selected_locale" LC_ALL="$selected_locale" LANGUAGE=C /bin/bash --noprofile --norc -c ${quote(command)}`,
+  ].join('\n')
+  return `env LANG=C LC_ALL=C LANGUAGE=C /bin/sh -c ${quote(script)}`
+}
@@ -0,0 +1,116 @@
+import { strict as assert } from 'node:assert'
+import { mkdtempSync, mkdirSync, readFileSync, writeFileSync, rmSync } from 'node:fs'
+import { tmpdir } from 'node:os'
+import { join } from 'node:path'
+import { spawnSync } from 'node:child_process'
+import { test } from 'node:test'
+import ts from 'typescript'
+
+const source = ts.createSourceFile('index.ts', readFileSync(new URL('./index.ts', import.meta.url), 'utf8'), ts.ScriptTarget.Latest, true)
+function loadFunction(name: string, dependencies: Record<string, unknown>) {
+  const declaration = source.statements.find((item) => ts.isFunctionDeclaration(item) && item.name?.text === name)
+  assert.ok(declaration)
+  const code = ts.transpile(declaration.getText(source), { target: ts.ScriptTarget.ES2022 })
+  return new Function(...Object.keys(dependencies), `${code}; return ${name};`)(...Object.values(dependencies))
+}
+
+function command(executable: string, args: string[], cwd: string) {
+  const result = spawnSync(executable, args, {
+    cwd, encoding: 'utf8', timeout: 15000,
+    env: { ...process.env, GIT_AUTHOR_NAME: 'Test', GIT_AUTHOR_EMAIL: 'test@example.com', GIT_COMMITTER_NAME: 'Test', GIT_COMMITTER_EMAIL: 'test@example.com' },
+  })
+  assert.equal(result.status, 0, result.stderr || String(result.error))
+  return result.stdout.trim()
+}
+
+function fixture() {
+  const root = mkdtempSync(join(tmpdir(), 'lms-preserve-'))
+  const template = join(root, 'template')
+  mkdirSync(template)
+  command('git', ['init', '-b', 'main'], template)
+  writeFileSync(join(template, 'node.py'), 'template source\n')
+  writeFileSync(join(template, '.gitignore'), 'build/\ninstall/\nlog/\n')
+  command('git', ['add', '.'], template)
+  command('git', ['commit', '-m', 'template'], template)
+  const install = loadFunction('installRemoteWorkspaceModule', {
+    normalizeRemoteTarget: (target: unknown) => target,
+    remoteRepositoryUrl: (url: string) => url,
+    withGitCredential: (url: string) => url,
+    remotePathJoin: join,
+    safeArtifactFileName: () => 'unused.tar',
+    quoteShellSingle: (value: string) => "'" + value.replaceAll("'", "'\\''") + "'",
+    encodeBase64: (value: string) => Buffer.from(value).toString('base64'),
+    expandRemotePathVar: () => [],
+    runSsh: async (_target: unknown, script: string) => command('bash', ['-c', script], root),
+    parseModuleFolderName: () => ({ name: 'Test', category: 'Control' }),
+  })
+  const target = { workspaceRoot: join(root, 'workspace') }
+  return { root, template, target, install, modulePath: join(target.workspaceRoot, 'module') }
+}
+
+test('reinstall preserves saved source, local commits, untracked files and build outputs despite changed repository URLs', async () => {
+  const f = fixture()
+  try {
+    await f.install(f.target, 'Test', 'module', f.template)
+    writeFileSync(join(f.modulePath, 'node.py'), 'student commit\n')
+    command('git', ['add', 'node.py'], f.modulePath)
+    command('git', ['commit', '-m', 'student work'], f.modulePath)
+    const head = command('git', ['rev-parse', 'HEAD'], f.modulePath)
+    writeFileSync(join(f.modulePath, 'node.py'), 'saved but not committed\n')
+    writeFileSync(join(f.modulePath, 'new.py'), 'new student file\n')
+    for (const dir of ['build', 'install', 'log']) {
+      mkdirSync(join(f.modulePath, dir))
+      writeFileSync(join(f.modulePath, dir, 'keep'), dir)
+    }
+    const status = command('git', ['status', '--porcelain'], f.modulePath)
+    await f.install(f.target, 'Test', 'module', '/missing/new-template', '/missing/new-student', {
+      prebuiltArtifacts: [{ url: 'https://invalid.example/overwrite.tar', required: true }],
+    })
+    assert.equal(command('git', ['rev-parse', 'HEAD'], f.modulePath), head)
+    assert.equal(command('git', ['status', '--porcelain'], f.modulePath), status)
+    assert.equal(readFileSync(join(f.modulePath, 'node.py'), 'utf8'), 'saved but not committed\n')
+    assert.equal(readFileSync(join(f.modulePath, 'new.py'), 'utf8'), 'new student file\n')
+    for (const dir of ['build', 'install', 'log']) assert.equal(readFileSync(join(f.modulePath, dir, 'keep'), 'utf8'), dir)
+  } finally { rmSync(f.root, { recursive: true, force: true }) }
+})
+
+test('first install restores the student repository instead of replacing it with template source', async () => {
+  const f = fixture()
+  try {
+    const student = join(f.root, 'student')
+    command('git', ['clone', f.template, student], f.root)
+    writeFileSync(join(student, 'node.py'), 'submitted student work\n')
+    command('git', ['add', '.'], student)
+    command('git', ['commit', '-m', 'submission'], student)
+    await f.install(f.target, 'Test', 'module', f.template, student)
+    assert.equal(readFileSync(join(f.modulePath, 'node.py'), 'utf8'), 'submitted student work\n')
+    assert.equal(command('git', ['branch', '--show-current'], f.modulePath), 'student-work')
+  } finally { rmSync(f.root, { recursive: true, force: true }) }
+})
+
+test('first install initializes an empty student repository', async () => {
+  const f = fixture()
+  try {
+    const student = join(f.root, 'student.git')
+    command('git', ['init', '--bare', student], f.root)
+    await f.install(f.target, 'Test', 'module', f.template, student)
+    assert.equal(command('git', ['--git-dir', student, 'show', 'main:node.py'], f.root), 'template source')
+  } finally { rmSync(f.root, { recursive: true, force: true }) }
+})
+
+test('legacy session reset only stops modules and returns stop failures', async () => {
+  const target = { workspaceRoot: '/student/workspace' }
+  const modules = [{ moduleName: 'Test', folderName: 'module', templateRepositoryUrl: '/template' }]
+  const result = { ok: false, message: 'stop failed' }
+  let calls = 0
+  const reset = loadFunction('resetRemoteWorkspaceSession', {
+    stopRemoteWorkspaceModules: async (actualTarget: unknown, actualModules: unknown) => {
+      calls++
+      assert.equal(actualTarget, target)
+      assert.equal(actualModules, modules)
+      return result
+    },
+  })
+  assert.equal(await reset(target, modules), result)
+  assert.equal(calls, 1)
+})
@@ -117,6 +117,11 @@ console.info('[lms-preload] launcher auth resolved', {
 })

 contextBridge.exposeInMainWorld('electron', electronAPI)
+contextBridge.exposeInMainWorld('chatTextMenu', {
+  show: (options: import('../shared/chatTextMenu').ChatTextMenuOptions) => ipcRenderer.invoke('chat-text:context-menu', options),
+  readClipboardState: () => ipcRenderer.invoke('chat-text:clipboard-state'),
+  perform: (action: import('../shared/chatTextMenu').ChatClipboardAction) => ipcRenderer.invoke('chat-text:clipboard-action', action)
+})
 contextBridge.exposeInMainWorld('launcherAuth', launcherAuth)
 contextBridge.exposeInMainWorld('lmsBootSplash', {
  status: (message: string) => ipcRenderer.send('lms-boot-status', message),
@@ -215,9 +220,16 @@ contextBridge.exposeInMainWorld('localWorkspace', {
    rename: (moduleName: string, fromPath: string, toPath: string, workspaceRoot?: string, folderName?: string) => ipcRenderer.invoke('local-workspace:module-files:rename', moduleName, fromPath, toPath, workspaceRoot, folderName),
    delete: (moduleName: string, path: string, workspaceRoot?: string, folderName?: string) => ipcRenderer.invoke('local-workspace:module-files:delete', moduleName, path, workspaceRoot, folderName)
  },
+  agent: {
+    readTool: (request: import('../shared/agentTools').AgentToolRequest, workspaceRoot?: string, folderName?: string) => ipcRenderer.invoke('local-workspace:agent-tool:read', request, workspaceRoot, folderName),
+    applyFiles: (changes: import('../shared/agentTools').AgentCheckedChange[], workspaceRoot?: string) => ipcRenderer.invoke('local-workspace:agent-files:apply', changes, workspaceRoot),
+    runCommand: (moduleName: string, command: string, workspaceRoot?: string, folderName?: string) => ipcRenderer.invoke('local-workspace:agent-command:run', moduleName, command, workspaceRoot, folderName)
+  },
  modules: {
    list: (workspaceRoot?: string, modules?: Array<{ sortOrder?: number | null; category: string; name: string; folderName: string; templateRepositoryUrl?: string | null }>) => ipcRenderer.invoke('local-workspace:modules:list', workspaceRoot, modules),
    listDockerImages: () => ipcRenderer.invoke('local-workspace:modules:docker-images'),
+    listGitSources: (root: string) => ipcRenderer.invoke('local-workspace:modules:git-sources', root),
+    inspectGitSource: (root: string, folder: string) => ipcRenderer.invoke('local-workspace:modules:git-source', root, folder),
    install: (moduleName: string, workspaceRoot?: string, folderName?: string, templateRepositoryUrl?: string | null, studentRepositoryUrl?: string | null, options?: ModuleInstallOptions | null) => ipcRenderer.invoke('local-workspace:modules:install', moduleName, workspaceRoot, folderName, templateRepositoryUrl, studentRepositoryUrl, options),
    createCustom: (workspaceRoot: string | undefined, input: { name: string; category: string; folderName: string; dockerImage?: string | null; packageName: string; launchFile: string }) => ipcRenderer.invoke('local-workspace:modules:create-custom', workspaceRoot, input),
    selectImportSource: () => ipcRenderer.invoke('local-workspace:modules:select-import-source'),
@@ -298,6 +310,11 @@ contextBridge.exposeInMainWorld('remoteWorkspace', {
    rename: (target: RemoteWorkspaceTarget, moduleName: string, fromPath: string, toPath: string, folderName?: string) => ipcRenderer.invoke('remote-workspace:module-files:rename', target, moduleName, fromPath, toPath, folderName),
    delete: (target: RemoteWorkspaceTarget, moduleName: string, path: string, folderName?: string) => ipcRenderer.invoke('remote-workspace:module-files:delete', target, moduleName, path, folderName)
  },
+  agent: {
+    readTool: (target: RemoteWorkspaceTarget, request: import('../shared/agentTools').AgentToolRequest, folderName?: string) => ipcRenderer.invoke('remote-workspace:agent-tool:read', target, request, folderName),
+    applyFiles: (target: RemoteWorkspaceTarget, changes: import('../shared/agentTools').AgentCheckedChange[]) => ipcRenderer.invoke('remote-workspace:agent-files:apply', target, changes),
+    runCommand: (target: RemoteWorkspaceTarget, moduleName: string, command: string, folderName?: string) => ipcRenderer.invoke('remote-workspace:agent-command:run', target, moduleName, command, folderName)
+  },
  maps: {
    readArtifacts: (target: RemoteWorkspaceTarget, artifacts: SavedMapArtifactPath[]) => ipcRenderer.invoke('remote-workspace:maps:read-artifacts', target, artifacts),
    copyActiveRtabmapDatabaseToLocal: (target: RemoteWorkspaceTarget, localWorkspaceRoot: string | undefined, destinationPath: string) => ipcRenderer.invoke('remote-workspace:maps:copy-active-rtabmap-database', target, localWorkspaceRoot, destinationPath),
@@ -307,6 +324,8 @@ contextBridge.exposeInMainWorld('remoteWorkspace', {
  modules: {
    list: (target: RemoteWorkspaceTarget, modules?: Array<{ sortOrder?: number | null; category: string; name: string; folderName: string; templateRepositoryUrl?: string | null }>) => ipcRenderer.invoke('remote-workspace:modules:list', target, modules),
    install: (target: RemoteWorkspaceTarget, moduleName: string, folderName?: string, templateRepositoryUrl?: string | null, studentRepositoryUrl?: string | null, options?: ModuleInstallOptions | null) => ipcRenderer.invoke('remote-workspace:modules:install', target, moduleName, folderName, templateRepositoryUrl, studentRepositoryUrl, options),
+    listDockerImages: (target: RemoteWorkspaceTarget) => ipcRenderer.invoke('remote-workspace:modules:docker-images', target),
+    importGit: (target: RemoteWorkspaceTarget, root: string, input: import('../shared/gitModuleImport').GitModuleImportInput & { folderName: string }) => ipcRenderer.invoke('remote-workspace:modules:import-git', target, root, input),
    createCustom: (target: RemoteWorkspaceTarget, input: { name: string; category: string; folderName: string; dockerImage?: string | null; packageName: string; launchFile: string }) => ipcRenderer.invoke('remote-workspace:modules:create-custom', target, input),
    transfer: (target: RemoteWorkspaceTarget, sourceWorkspaceRoot: string | undefined, moduleName: string, folderName?: string) => ipcRenderer.invoke('remote-workspace:modules:transfer', target, sourceWorkspaceRoot, moduleName, folderName),
    start: (target: RemoteWorkspaceTarget, moduleName: string, folderName?: string, rosParams?: string, gpuEnabled?: boolean, rosDomainId?: string, runtimeImages?: RuntimeImageArtifact[] | null, rosNetwork?: RosNetworkConfig | null) => ipcRenderer.invoke('remote-workspace:modules:start', target, moduleName, folderName, rosParams, gpuEnabled, rosDomainId, runtimeImages, rosNetwork),
@@ -0,0 +1,113 @@
+export function createCameraPreview({ root, baseUrl, getState, onAvailable }) {
+  const cameras = new Map();
+  let enabled = false;
+  let timer = null;
+
+  function sources() {
+    const { state, receivedAt } = getState();
+    if (!enabled || Date.now() - receivedAt >= 3000) return [];
+    const list = Array.isArray(state?.cameras) ? state.cameras
+      : state?.topic_status?.camera_image?.available ? [{ id: 'legacy', name: 'Camera', available: true }] : [];
+    const seen = new Set();
+    return list.filter(item => {
+      if (!item?.available || !/^[a-zA-Z0-9_-]{1,64}$/.test(item.id) || seen.has(item.id)) return false;
+      seen.add(item.id);
+      return true;
+    }).slice(0, 8);
+  }
+
+  function clearFrame(camera) {
+    if (camera.url) URL.revokeObjectURL(camera.url);
+    camera.url = null;
+    camera.image.removeAttribute('src');
+  }
+
+  function remove(id, camera) {
+    cameras.delete(id);
+    camera.controller?.abort();
+    clearFrame(camera);
+    camera.element.remove();
+  }
+
+  async function frame(id, camera) {
+    if (camera.controller || Date.now() < camera.retryAt || document.hidden) return;
+    const controller = new AbortController();
+    camera.controller = controller;
+    const timeout = window.setTimeout(() => controller.abort(), 2000);
+    try {
+      const query = id === 'legacy' ? '' : `?camera_id=${encodeURIComponent(id)}`;
+      const response = await fetch(`${baseUrl}/camera-frame${query}`, { cache: 'no-store', signal: controller.signal });
+      if (!response.ok) throw new Error('Camera frame unavailable');
+      const blob = await response.blob();
+      if (controller.signal.aborted || document.hidden || cameras.get(id) !== camera || !sources().some(item => item.id === id)) return;
+      const previous = camera.url;
+      camera.url = URL.createObjectURL(blob);
+      camera.image.src = camera.url;
+      camera.retryAt = 0;
+      if (previous) URL.revokeObjectURL(previous);
+    } catch (_) {
+      if (cameras.get(id) === camera) {
+        camera.retryAt = Date.now() + 5000;
+        clearFrame(camera);
+      }
+    } finally {
+      window.clearTimeout(timeout);
+      if (camera.controller === controller) camera.controller = null;
+    }
+  }
+
+  function refresh() {
+    const live = sources();
+    const ids = new Set(live.map(item => item.id));
+    for (const [id, camera] of cameras) if (!ids.has(id)) remove(id, camera);
+    for (const item of live) {
+      let camera = cameras.get(item.id);
+      if (!camera) {
+        const element = document.createElement('div');
+        element.className = 'camera-preview-item';
+        element.dataset.cameraId = item.id;
+        const label = document.createElement('div');
+        label.className = 'camera-preview-label';
+        const image = document.createElement('img');
+        image.className = 'camera-preview-image';
+        element.append(label, image);
+        root.append(element);
+        camera = { element, label, image, url: null, controller: null, retryAt: 0 };
+        image.addEventListener('error', () => {
+          if (cameras.get(item.id) === camera) {
+            clearFrame(camera);
+            camera.retryAt = Date.now() + 5000;
+          }
+        });
+        cameras.set(item.id, camera);
+      }
+      camera.label.textContent = item.name || item.id;
+      camera.image.alt = item.name || item.id;
+      void frame(item.id, camera);
+    }
+    onAvailable(enabled && cameras.size > 0);
+  }
+
+  function visibilityChanged() {
+    if (document.hidden) for (const camera of cameras.values()) camera.controller?.abort();
+    else refresh();
+  }
+  document.addEventListener('visibilitychange', visibilityChanged);
+
+  function setEnabled(value) {
+    enabled = value;
+    if (timer) window.clearInterval(timer);
+    timer = null;
+    refresh();
+    if (enabled) timer = window.setInterval(refresh, 200);
+  }
+
+  return {
+    setEnabled,
+    refresh,
+    dispose() {
+      setEnabled(false);
+      document.removeEventListener('visibilitychange', visibilityChanged);
+    },
+  };
+}
@@ -24,11 +24,12 @@
 	    #miniMapToggle {
 	      position:absolute;
 	      right:16px;
-	      bottom:240px;
+	      bottom:calc(16px + 220px + 2px);
 	      z-index:11;
 	      min-height:28px;
 	      padding:0 10px;
 	      border:1px solid rgba(255,255,255,.22);
+      border-radius:6px 6px 0 0;
 	      background:rgba(17,24,39,.42);
 	      color:rgba(255,255,255,.88);
 	      font:12px sans-serif;
@@ -49,7 +50,7 @@
    #cameraPreviewWrap {
      position:absolute;
      left:16px;
-      top:16px;
+      top:60px;
      z-index:10;
      display:none;
      width:min(260px, calc(100vw - 32px));
@@ -58,15 +59,31 @@
      box-shadow:0 10px 26px rgba(0,0,0,.16);
    }
    #cameraPreviewWrap.is-visible { display:block; }
+    #cameraToggle { display:grid; place-items:center; width:34px; flex:0 0 34px; padding:0; }
    #cameraPreviewWrap.is-collapsed { background:transparent; border-color:transparent; box-shadow:none; }
-    #cameraPreview {
+    #cameraPreviewList {
+      max-height:min(60vh, 600px);
+      overflow-y:auto;
+      scrollbar-width:thin;
+      scrollbar-color:rgba(148,163,184,.65) transparent;
+    }
+    .camera-preview-item + .camera-preview-item { border-top:1px solid rgba(255,255,255,.18); }
+    .camera-preview-label {
+      padding:5px 8px;
+      overflow:hidden;
+      text-overflow:ellipsis;
+      white-space:nowrap;
+      color:rgba(255,255,255,.85);
+      font:11px sans-serif;
+    }
+    .camera-preview-image {
      display:block;
      width:100%;
      aspect-ratio:16 / 9;
      object-fit:contain;
      background:#111520;
    }
-    #cameraPreviewWrap.is-collapsed #cameraPreview { display:none; }
+    #cameraPreviewWrap.is-collapsed #cameraPreviewList { display:none; }
    #cameraPreviewToggle {
      position:absolute;
      left:0;
@@ -77,6 +94,7 @@
      place-items:center;
      padding:0;
      border:1px solid rgba(255,255,255,.22);
+      border-radius:0 0 6px 6px;
      background:rgba(17,24,39,.42);
      color:rgba(255,255,255,.9);
      font:11px sans-serif;
@@ -96,6 +114,9 @@
 	      display:flex;
 	      gap:7px;
 	      align-items:flex-start;
+	      max-width:calc(100% - 32px);
+	      flex-wrap:wrap;
+	      justify-content:flex-end;
 	    }
    #topLeftControls {
      position:absolute;
@@ -105,6 +126,7 @@
      display:none;
    }
    #keyGuide {
+      display:none;
 	      position:absolute;
 	      left:16px;
 	      bottom:16px;
@@ -123,7 +145,7 @@
    #rosTopicStatusWrap {
      position:absolute;
      left:16px;
-      bottom:54px;
+      bottom:16px;
      z-index:10;
      width:178px;
    }
@@ -146,6 +168,7 @@
      place-items:center;
      padding:0;
      border:1px solid rgba(255,255,255,.22);
+      border-radius:6px 6px 0 0;
      background:rgba(17,24,39,.42);
      color:rgba(255,255,255,.9);
      font:11px sans-serif;
@@ -241,12 +264,14 @@
 	    #downloadMap,
 	    #pathToggle,
 	    #sensorToggle,
+	    #cameraToggle,
 	    #poseToggle,
 	    #goalToggle,
 	    #obstacleToggle,
 	    #cameraPresetSelect {
 	      min-height:32px;
 	      border:1px solid rgba(255,255,255,.22);
+      border-radius:6px;
 	      background:rgba(17,24,39,.42);
 	      color:rgba(255,255,255,.88);
 	      font:12px sans-serif;
@@ -256,32 +281,47 @@
 	      box-shadow:0 10px 26px rgba(0,0,0,.16);
 	      transition:background .15s ease, border-color .15s ease, color .15s ease;
 	    }
-	    #downloadMap,
-	    #pathToggle,
-	    #sensorToggle,
-	    #poseToggle,
-	    #goalToggle,
-	    #obstacleToggle {
-	      padding:0 11px;
+    .viewer-icon-button {
+      display:grid;
+      place-items:center;
+      width:34px;
+      height:32px;
+      flex:0 0 34px;
+      padding:0;
    }
-	    #downloadMap {
-	      display:inline-flex;
-	      align-items:center;
-	      gap:6px;
+    .camera-preset-wrap {
+      position:relative;
+      width:34px;
+      height:32px;
+      flex:0 0 34px;
+    }
+    .camera-preset-wrap > svg {
+      position:absolute;
+      inset:0;
+      margin:auto;
+      color:rgba(255,255,255,.88);
+      pointer-events:none;
    }
 	    #cameraPresetSelect {
-	      min-width:86px;
-	      padding:0 24px 0 9px;
-	      outline:none;
+      width:100%;
+      height:100%;
+      padding:0;
+      color:transparent;
 	      appearance:none;
-	      background-image:linear-gradient(45deg, transparent 50%, rgba(255,255,255,.7) 50%), linear-gradient(135deg, rgba(255,255,255,.7) 50%, transparent 50%);
-	      background-position:calc(100% - 13px) 14px, calc(100% - 8px) 14px;
-	      background-size:5px 5px, 5px 5px;
-	      background-repeat:no-repeat;
+	    }
+    #cameraPresetSelect option {
+      color:rgba(255,255,255,.88);
+      background:#202020;
+    }
+    .viewer-icon-button:focus-visible,
+    #cameraPresetSelect:focus-visible {
+      outline:2px solid #93c5fd;
+      outline-offset:2px;
    }
 	    #downloadMap:hover,
 	    #pathToggle:hover,
 	    #sensorToggle:hover,
+	    #cameraToggle:hover,
 	    #poseToggle:hover,
 	    #goalToggle:hover,
 	    #obstacleToggle:hover,
@@ -290,6 +330,7 @@
 	      border-color:rgba(255,255,255,.34);
 	      color:#fff;
 	    }
+    #cameraPresetSelect:hover { color:transparent; }
 	    #downloadMap:disabled {
 	      opacity:.45;
 	      cursor:not-allowed;
@@ -307,6 +348,7 @@
 	      border-color:rgba(147,197,253,.55);
 	      color:#fff;
 	    }
+	    #cameraToggle.active,
 	    #sensorToggle.active {
 	      background:rgba(14,116,144,.62);
 	      border-color:rgba(103,232,249,.55);
@@ -367,60 +409,62 @@
    .nav2-slam #goalToggle, .nav2-slam #poseToggle { display:none; }
    .nav2-navigation #downloadWrap { display:none; }
    .nav2-navigation #topLeftControls { display:block; }
-    .nav2-navigation #keyGuide { display:none; }
-    .nav2-navigation #rosTopicStatusWrap { bottom:16px; }
    .real-runtime #topLeftControls { display:none; }
-    .real-runtime #keyGuide { display:none; }
-    .real-teleop:not(.editor-mode) #keyGuide { display:block; }
-    .real-teleop #rosTopicStatusWrap { bottom:50px; }
  </style>
 </head>
 <body>
 <div id="topLeftControls">
-  <button id="obstacleToggle" title="벽 배치" aria-label="벽 배치" aria-pressed="false">Wall</button>
+  <button id="obstacleToggle" class="viewer-icon-button" title="벽 배치" data-i18n-title="벽 배치" aria-label="벽 배치" data-i18n-aria-label="벽 배치" aria-pressed="false"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-brick-wall" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"/><path d="M12 9v6M16 15v6M16 3v6M3 15h18M3 9h18M8 15v6M8 3v6"/></svg></button>
 </div>
 <div id="topRightControls">
  <div id="downloadWrap">
-    <button id="downloadMap" title="맵 저장" aria-label="맵 저장" disabled><span>SAVE</span></button>
+    <button id="downloadMap" class="viewer-icon-button" title="맵 저장" data-i18n-title="맵 저장" aria-label="맵 저장" data-i18n-aria-label="맵 저장" disabled><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-save" aria-hidden="true"><path d="M15.2 3a2 2 0 0 1 1.4.6l3.8 3.8a2 2 0 0 1 .6 1.4V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z"/><path d="M17 21v-7a1 1 0 0 0-1-1H8a1 1 0 0 0-1 1v7M7 3v4a1 1 0 0 0 1 1h7"/></svg></button>
  </div>
-  <button id="pathToggle" title="로봇 경로 표시" aria-label="로봇 경로 표시">Path</button>
-  <button id="sensorToggle" title="센서 표시" aria-label="센서 표시" aria-pressed="false">Sensor</button>
-  <button id="poseToggle" title="초기 위치 지정" aria-label="초기 위치 지정">Pose</button>
-  <button id="goalToggle" title="목표 위치 지정" aria-label="목표 위치 지정">Goal</button>
-  <select id="cameraPresetSelect" title="카메라 시점" aria-label="카메라 시점">
+  <button id="pathToggle" class="viewer-icon-button" title="로봇 경로 표시" data-i18n-title="로봇 경로 표시" aria-label="로봇 경로 표시" data-i18n-aria-label="로봇 경로 표시"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-route" aria-hidden="true"><circle cx="6" cy="19" r="3"/><path d="M9 19h8.5a3.5 3.5 0 0 0 0-7h-11a3.5 3.5 0 0 1 0-7H15"/><circle cx="18" cy="5" r="3"/></svg></button>
+  <button id="sensorToggle" class="viewer-icon-button" title="센서 표시" data-i18n-title="센서 표시" aria-label="센서 표시" data-i18n-aria-label="센서 표시" aria-pressed="false"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-radar" aria-hidden="true"><path d="M19.07 4.93A10 10 0 0 0 6.99 3.34M4 6h.01M2.29 9.62A10 10 0 1 0 21.31 8.35M16.24 7.76A6 6 0 1 0 8.23 16.67M12 18h.01M17.99 11.66A6 6 0 0 1 15.77 16.67"/><circle cx="12" cy="12" r="2"/><path d="m13.41 10.59 5.66-5.66"/></svg></button>
+  <button id="cameraToggle" class="viewer-icon-button" type="button" title="카메라 영상 표시" data-i18n-title="카메라 영상 표시" aria-label="카메라 영상 표시" data-i18n-aria-label="카메라 영상 표시" aria-pressed="true" aria-controls="cameraPreviewWrap">
+    <!-- Lucide Camera icon. -->
+    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M13.997 4a2 2 0 0 1 1.76 1.05l.486.9A2 2 0 0 0 18.003 7H20a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h1.997a2 2 0 0 0 1.759-1.048l.489-.904A2 2 0 0 1 10.004 4z"/><circle cx="12" cy="13" r="3"/></svg>
+  </button>
+  <button id="poseToggle" class="viewer-icon-button" title="초기 위치 지정" data-i18n-title="초기 위치 지정" aria-label="초기 위치 지정" data-i18n-aria-label="초기 위치 지정"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-locate-fixed" aria-hidden="true"><path d="M2 12h3M19 12h3M12 2v3M12 19v3"/><circle cx="12" cy="12" r="7"/><circle cx="12" cy="12" r="3"/></svg></button>
+  <button id="goalToggle" class="viewer-icon-button" title="목표 위치 지정" data-i18n-title="목표 위치 지정" aria-label="목표 위치 지정" data-i18n-aria-label="목표 위치 지정"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-flag" aria-hidden="true"><path d="M4 22V4a1 1 0 0 1 .4-.8A6 6 0 0 1 8 2c3 0 5 2 7.333 2q2 0 3.067-.8A1 1 0 0 1 20 4v10a1 1 0 0 1-.4.8A6 6 0 0 1 16 16c-3 0-5-2-8-2a6 6 0 0 0-4 1.528"/></svg></button>
+  <div class="camera-preset-wrap">
+  <select id="cameraPresetSelect" title="카메라 시점" data-i18n-title="카메라 시점" aria-label="카메라 시점" data-i18n-aria-label="카메라 시점">
    <option value="default">Default</option>
    <option value="top">Top</option>
    <option value="follow">Follow</option>
  </select>
+  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-panels-top-left" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"/><path d="M3 9h18M9 21V9"/></svg>
+  </div>
 </div>
 	<canvas id="miniMap" width="260" height="220"></canvas>
-	<button id="miniMapToggle" title="미니맵 접기/펼치기" aria-label="미니맵 접기">▾</button>
+	<button id="miniMapToggle" title="미니맵 접기/펼치기" data-i18n-title="미니맵 접기/펼치기" aria-label="미니맵 접기" data-i18n-aria-label="미니맵 접기">▾</button>
 	<div id="cameraPreviewWrap">
-	  <button id="cameraPreviewToggle" type="button" title="카메라 화면 접기/펼치기" aria-label="카메라 화면 접기" aria-expanded="true"><span id="cameraPreviewChevron" aria-hidden="true">▾</span></button>
-	  <img id="cameraPreview" alt="실시간 카메라 화면" />
+	  <button id="cameraPreviewToggle" type="button" title="카메라 화면 접기/펼치기" data-i18n-title="카메라 화면 접기/펼치기" aria-label="카메라 화면 접기" data-i18n-aria-label="카메라 화면 접기" aria-expanded="true"><span id="cameraPreviewChevron" aria-hidden="true">▾</span></button>
+	  <div id="cameraPreviewList"></div>
 	</div>
 	<div id="keyGuide">
-	  <div>i 전진 · , 후진 · j/l 회전 · k 정지</div>
+	  <div data-i18n="i 전진 · , 후진 · j/l 회전 · k 정지">i 전진 · , 후진 · j/l 회전 · k 정지</div>
 	</div>
 	<div id="rosTopicStatusWrap">
-	  <button id="rosTopicStatusToggle" type="button" title="ROS 상태 접기/펼치기" aria-label="ROS 상태 접기" aria-expanded="true">
+	  <button id="rosTopicStatusToggle" type="button" title="ROS 상태 접기/펼치기" data-i18n-title="ROS 상태 접기/펼치기" aria-label="ROS 상태 접기" data-i18n-aria-label="ROS 상태 접기" aria-expanded="true">
 	    <span id="rosTopicStatusChevron" aria-hidden="true">▾</span>
 	  </button>
-	  <aside id="rosTopicStatus" aria-label="ROS 상태">
-	    <div id="rosTopicStatusTitle">ROS 상태</div>
+	  <aside id="rosTopicStatus" aria-label="ROS 상태" data-i18n-aria-label="ROS 상태">
+	    <div id="rosTopicStatusTitle" data-i18n="ROS 상태">ROS 상태</div>
 	    <div id="rosTopicStatusList"></div>
 	  </aside>
 	</div>
 	<div id="responseWaitOverlay" role="status" aria-live="polite">
 	  <div class="response-wait-dialog">
 	    <span class="response-wait-spinner" aria-hidden="true"></span>
-	    <span>응답을 기다리는 중입니다.</span>
+	    <span data-i18n="응답을 기다리는 중입니다.">응답을 기다리는 중입니다.</span>
 	  </div>
 	</div>
 	<div id="mapSaveOverlay" role="status" aria-live="polite" aria-hidden="true">
 	  <div class="response-wait-dialog">
 	    <span class="response-wait-spinner" aria-hidden="true"></span>
-	    <span>맵을 저장하고 있습니다.</span>
+	    <span data-i18n="맵을 저장하고 있습니다.">맵을 저장하고 있습니다.</span>
 	  </div>
 	</div>
 	<script type="importmap">
@@ -431,7 +475,11 @@
 	  }
 	}
 	</script>
+<script type="module" src="./locale.js"></script>
 <script type="module">
+import { t, setText } from './locale.js';
+import { createCameraPreview } from './camera-preview.js';
+
 import * as THREE from 'three';
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 import { TransformControls } from 'three/addons/controls/TransformControls.js';
@@ -470,8 +518,13 @@ const miniMap = document.getElementById('miniMap');
 const miniCtx = miniMap.getContext('2d');
 const miniMapToggle = document.getElementById('miniMapToggle');
 const cameraPreviewWrap = document.getElementById('cameraPreviewWrap');
-const cameraPreview = document.getElementById('cameraPreview');
+const cameraPreviewList = document.getElementById('cameraPreviewList');
 const cameraPreviewToggle = document.getElementById('cameraPreviewToggle');
+const cameraToggleButton = document.getElementById('cameraToggle');
+const topRightControls = document.getElementById('topRightControls');
+new ResizeObserver(() => {
+  cameraPreviewWrap.style.top = `${topRightControls.offsetTop + topRightControls.offsetHeight + 12}px`;
+}).observe(topRightControls);
 const responseWaitOverlay = document.getElementById('responseWaitOverlay');
 const mapSaveOverlay = document.getElementById('mapSaveOverlay');
 const downloadMapButton = document.getElementById('downloadMap');
@@ -501,7 +554,7 @@ const rosTopicStatusList = document.getElementById('rosTopicStatusList');
  if (REAL_TELEOP && !EDITOR_MODE) {
    document.body.classList.add('real-teleop');
    if (REAL_MKMINI_TELEOP) {
-      document.querySelector('#keyGuide div').textContent = 'i 전진 · , 후진 · j/l 주행 중 조향 · k 정지';
+      setText(document.querySelector('#keyGuide div'), 'i 전진 · , 후진 · j/l 주행 중 조향 · k 정지');
    }
  }
 	if (EDITOR_MODE) responseWaitOverlay?.classList.add('is-hidden');
@@ -554,7 +607,7 @@ function updateRosTopicStatus(topicStatus = {}) {
 rosTopicStatusToggle?.addEventListener('click', () => {
  const collapsed = rosTopicStatusWrap?.classList.toggle('is-collapsed') ?? false;
  rosTopicStatusToggle.setAttribute('aria-expanded', String(!collapsed));
-  rosTopicStatusToggle.setAttribute('aria-label', collapsed ? 'ROS 상태 펼치기' : 'ROS 상태 접기');
+  rosTopicStatusToggle.setAttribute('aria-label', collapsed ? t("ROS 상태 펼치기") : t("ROS 상태 접기"));
 });
 updateRosTopicStatus();

@@ -858,7 +911,7 @@ window.addEventListener('message', (event) => {
  pendingSimulatorPoseRequests.delete(payload.requestId);
  window.clearTimeout(request.timeout);
  if (payload.ok) request.resolve();
-  else request.reject(new Error(payload.message || '가제보 로봇 위치를 적용하지 못했습니다.'));
+  else request.reject(new Error(payload.message || t("가제보 로봇 위치를 적용하지 못했습니다.")));
 });

 let robotModel = null;
@@ -900,10 +953,7 @@ let pointCloudRefreshTimer = null;
 let savedMapPointCloudLoaded = false;
 let sensorPointCloudRequestInFlight = false;
 let sensorPointCloudRefreshTimer = null;
-let cameraFrameRequestInFlight = false;
-let cameraFrameRetryAt = 0;
-let cameraFrameRefreshTimer = null;
-let cameraFrameObjectUrl = null;
+let cameraPreviewEnabled = ENABLE_CAMERA_PREVIEW;
 let pathVisible = false;
 // SLAM always renders its live scan, including the forward beam. Navigation
 // keeps the sensor opt-in so a saved-map view starts cleanly.
@@ -965,8 +1015,8 @@ function syncGoalToggleAvailability() {
  goalToggleButton.disabled = goalDisabled;
  poseToggleButton.disabled = poseDisabled;
  poseToggleButton.title = poseDisabled
-    ? '주행 시뮬레이션에서는 초기 위치를 한 번만 설정할 수 있습니다.'
-    : '로봇 초기 위치 설정';
+    ? t("주행 시뮬레이션에서는 초기 위치를 한 번만 설정할 수 있습니다.")
+    : t("로봇 초기 위치 설정");
  if (goalDisabled) {
    navigationGoalMode = false;
    goalToggleButton.classList.remove('active');
@@ -2048,58 +2098,27 @@ async function refreshSensorPointCloud() {
  }
 }

-function setCameraPreviewAvailable(available) {
-  cameraPreviewWrap?.classList.toggle('is-visible', available);
-  if (available) return;
-  if (cameraFrameObjectUrl) {
-    URL.revokeObjectURL(cameraFrameObjectUrl);
-    cameraFrameObjectUrl = null;
-  }
-  if (cameraPreview) cameraPreview.removeAttribute('src');
-}
+const cameraPreviewController = createCameraPreview({
+  root: cameraPreviewList,
+  baseUrl: BACKEND_URL,
+  getState: () => ({ state: latestSlamState, receivedAt: latestSlamStateReceivedAt }),
+  onAvailable: available => cameraPreviewWrap.classList.toggle('is-visible', available),
+});

-function hasLiveCameraState() {
-  return latestSlamState?.topic_status?.camera_image?.available === true
-    && Date.now() - latestSlamStateReceivedAt < 3000;
-}
-
-async function refreshCameraFrame() {
-  if (!ENABLE_CAMERA_PREVIEW || cameraFrameRequestInFlight || document.hidden) return;
-  // Reuse websocket topic status instead of probing an absent camera with HTTP.
-  if (!hasLiveCameraState()) {
-    setCameraPreviewAvailable(false);
+function setCameraPreviewEnabled(enabled) {
+  cameraPreviewEnabled = ENABLE_CAMERA_PREVIEW && enabled;
+  cameraToggleButton.classList.toggle('active', cameraPreviewEnabled);
+  cameraToggleButton.setAttribute('aria-pressed', String(cameraPreviewEnabled));
+  cameraPreviewController.setEnabled(cameraPreviewEnabled);
+  if (!cameraPreviewEnabled) {
    return;
  }
-  if (Date.now() < cameraFrameRetryAt) return;
-  cameraFrameRequestInFlight = true;
-  try {
-    const response = await fetch(`${BACKEND_URL}/camera-frame`, { cache: 'no-store', signal: AbortSignal.timeout(2000) });
-    if (!response.ok) {
-      cameraFrameRetryAt = Date.now() + 5000;
-      setCameraPreviewAvailable(false);
-      return;
-    }
-    const frame = await response.blob();
-    if (!hasLiveCameraState() || document.hidden) {
-      setCameraPreviewAvailable(false);
-      return;
-    }
-    cameraFrameRetryAt = 0;
-    const nextUrl = URL.createObjectURL(frame);
-    const previousUrl = cameraFrameObjectUrl;
-    cameraFrameObjectUrl = nextUrl;
-    if (cameraPreview) cameraPreview.src = nextUrl;
-    if (previousUrl) URL.revokeObjectURL(previousUrl);
-  } catch (_) {
-    cameraFrameRetryAt = Date.now() + 5000;
-    setCameraPreviewAvailable(false);
-  } finally {
-    cameraFrameRequestInFlight = false;
-  }
+  cameraPreviewWrap.classList.remove('is-collapsed');
+  cameraPreviewToggle.setAttribute('aria-expanded', 'true');
+  cameraPreviewToggle.setAttribute('aria-label', t('카메라 화면 접기'));
 }

-cameraPreview?.addEventListener('load', () => setCameraPreviewAvailable(hasLiveCameraState()));
-cameraPreview?.addEventListener('error', () => setCameraPreviewAvailable(false));
+cameraToggleButton.addEventListener('click', () => setCameraPreviewEnabled(!cameraPreviewEnabled));

 function drawMiniMap(state) {
  pendingMiniMapState = state;
@@ -2264,8 +2283,8 @@ function drawMiniMapNow(state) {
  miniCtx.textBaseline = 'middle';
  miniCtx.fillText(
    SHOW_POINT_CLOUD && state?.point_cloud
-      ? '3D 포인트클라우드를 표시 중입니다.'
-      : '모듈을 연결해주세요.',
+      ? t("3D 포인트클라우드를 표시 중입니다.")
+      : t("모듈을 연결해주세요."),
    w / 2,
    h / 2,
  );
@@ -2592,10 +2611,10 @@ downloadMapButton.addEventListener('click', async () => {
      body: JSON.stringify({})
    });
    const payload = await response.json().catch(() => ({}));
-    if (!response.ok) throw new Error(payload.detail || payload.message || '맵 저장에 실패했습니다.');
+    if (!response.ok) throw new Error(payload.detail || payload.message || t("맵 저장에 실패했습니다."));
    window.parent.postMessage({ source: 'autonomy-slam-viewer', type: 'map-saved', map: payload.map }, '*');
  } catch (error) {
-    window.parent.postMessage({ source: 'autonomy-slam-viewer', type: 'map-save-failed', message: error instanceof Error ? error.message : '맵 저장에 실패했습니다.' }, '*');
+    window.parent.postMessage({ source: 'autonomy-slam-viewer', type: 'map-save-failed', message: error instanceof Error ? error.message : t("맵 저장에 실패했습니다.") }, '*');
  } finally {
    setMapSavePending(false);
    downloadMapButton.disabled = !latestMiniMapGrid?.data?.length;
@@ -2616,7 +2635,7 @@ sensorToggleButton.addEventListener('click', () => {
 cameraPreviewToggle?.addEventListener('click', () => {
  const collapsed = cameraPreviewWrap?.classList.toggle('is-collapsed') ?? false;
  cameraPreviewToggle.setAttribute('aria-expanded', String(!collapsed));
-  cameraPreviewToggle.setAttribute('aria-label', collapsed ? '카메라 화면 펼치기' : '카메라 화면 접기');
+  cameraPreviewToggle.setAttribute('aria-label', collapsed ? t("카메라 화면 펼치기") : t("카메라 화면 접기"));
 });

 goalToggleButton.addEventListener('click', () => {
@@ -2677,7 +2696,7 @@ obstacleToggleButton.addEventListener('click', () => {
 miniMapToggle.addEventListener('click', () => {
  const hidden = miniMap.classList.toggle('hidden');
  miniMapToggle.textContent = hidden ? '▴' : '▾';
-  miniMapToggle.setAttribute('aria-label', hidden ? '미니맵 펼치기' : '미니맵 접기');
+  miniMapToggle.setAttribute('aria-label', hidden ? t("미니맵 펼치기") : t("미니맵 접기"));
  focusViewer();
 });

@@ -2911,7 +2930,7 @@ async function sendNavigationGoal(goal) {
  const cancelResponse = await fetch(`${BACKEND_URL}/cancel_navigation`, { method:'POST' });
  if (!cancelResponse.ok) {
    const message = await cancelResponse.text().catch(() => '');
-    throw new Error(message || '기존 목표를 취소하지 못했습니다.');
+    throw new Error(message || t("기존 목표를 취소하지 못했습니다."));
  }
  navigationGoalId = null;
  placeNavigationGoalMarker(goal.x, goal.y, goal.yaw);
@@ -2934,7 +2953,7 @@ function moveLocalSimulatorToInitialPose(pose) {
  return new Promise((resolve, reject) => {
    const timeout = window.setTimeout(() => {
      pendingSimulatorPoseRequests.delete(requestId);
-      reject(new Error('가제보 로봇 위치 적용 시간이 초과되었습니다.'));
+      reject(new Error(t("가제보 로봇 위치 적용 시간이 초과되었습니다.")));
    }, 12_000);
    pendingSimulatorPoseRequests.set(requestId, { resolve, reject, timeout });
    window.parent.postMessage({
@@ -3132,6 +3151,9 @@ renderer.domElement.addEventListener('click', async (event) => {
 });

 function applySlamState(state) {
+  // Any valid state payload confirms that the bridge is responding. Missing
+  // ROS data is reported separately by the topic status indicators.
+  markVisualizationResponseReceived();
  latestSlamState = state;
  latestSlamStateReceivedAt = Date.now();
  resetNavigationPoseForNewSession(state);
@@ -3147,7 +3169,6 @@ function applySlamState(state) {
    clearNavigationGoalMarker();
    navigationGoalId = null;
  }
-  if (state?.pose || state?.pose_3d || state?.scan || state?.map || state?.point_cloud || state?.sensor_point_cloud) markVisualizationResponseReceived();
  if (NAV2_VIEW_MODE === 'navigation' && state?.tf?.map_to_odom) {
    navigationMapToOdom = state.tf.map_to_odom;
    updateNavigationMapTransform();
@@ -3226,17 +3247,13 @@ if (SHOW_SENSOR_POINT_CLOUD && navigationSensorVisible) {
  void refreshSensorPointCloud();
  sensorPointCloudRefreshTimer = window.setInterval(() => void refreshSensorPointCloud(), 750);
 }
-if (ENABLE_CAMERA_PREVIEW) {
-  void refreshCameraFrame();
-  cameraFrameRefreshTimer = window.setInterval(() => void refreshCameraFrame(), 200);
-}
+setCameraPreviewEnabled(ENABLE_CAMERA_PREVIEW);

 window.addEventListener('beforeunload', () => {
  if (pointCloudRefreshTimer) window.clearInterval(pointCloudRefreshTimer);
  if (sensorPointCloudRefreshTimer) window.clearInterval(sensorPointCloudRefreshTimer);
  if (miniMapRenderTimer) window.clearTimeout(miniMapRenderTimer);
-  if (cameraFrameRefreshTimer) window.clearInterval(cameraFrameRefreshTimer);
-  if (cameraFrameObjectUrl) URL.revokeObjectURL(cameraFrameObjectUrl);
+  cameraPreviewController.dispose();
 });

 function connectControlSocket() {
@@ -0,0 +1,73 @@
+const storageKey = 'autonomy-studio.lms.language';
+let language = 'ko';
+try { language = localStorage.getItem(storageKey) === 'en' ? 'en' : 'ko'; } catch {}
+
+const english = {
+  '벽 배치': 'Place walls',
+  '맵 저장': 'Save map',
+  '로봇 경로 표시': 'Show robot path',
+  '센서 표시': 'Show sensors',
+  '카메라 영상 표시': 'Show camera preview',
+  '초기 위치 지정': 'Set initial pose',
+  '목표 위치 지정': 'Set goal',
+  '카메라 시점': 'Camera view',
+  '미니맵 접기/펼치기': 'Toggle minimap',
+  '미니맵 접기': 'Collapse minimap',
+  '미니맵 펼치기': 'Expand minimap',
+  '카메라 화면 접기/펼치기': 'Toggle camera preview',
+  '카메라 화면 접기': 'Collapse camera preview',
+  '카메라 화면 펼치기': 'Expand camera preview',
+  '실시간 카메라 화면': 'Live camera preview',
+  'i 전진 · , 후진 · j/l 회전 · k 정지': 'i Forward · , Reverse · j/l Turn · k Stop',
+  'i 전진 · , 후진 · j/l 주행 중 조향 · k 정지': 'i Forward · , Reverse · j/l Steer while moving · k Stop',
+  'ROS 상태 접기/펼치기': 'Toggle ROS status',
+  'ROS 상태 접기': 'Collapse ROS status',
+  'ROS 상태 펼치기': 'Expand ROS status',
+  'ROS 상태': 'ROS status',
+  '응답을 기다리는 중입니다.': 'Waiting for a response.',
+  '맵을 저장하고 있습니다.': 'Saving the map.',
+  '가제보 로봇 위치를 적용하지 못했습니다.': 'Failed to set the Gazebo robot pose.',
+  '주행 시뮬레이션에서는 초기 위치를 한 번만 설정할 수 있습니다.': 'The initial pose can only be set once during navigation simulation.',
+  '로봇 초기 위치 설정': 'Set initial robot pose',
+  '3D 포인트클라우드를 표시 중입니다.': 'Displaying the 3D point cloud.',
+  '모듈을 연결해주세요.': 'Connect your modules.',
+  '맵 저장에 실패했습니다.': 'Failed to save the map.',
+  '기존 목표를 취소하지 못했습니다.': 'Failed to cancel the previous goal.',
+  '가제보 로봇 위치 적용 시간이 초과되었습니다.': 'Setting the Gazebo robot pose timed out.'
+};
+
+export function t(key) { return language === 'en' ? (english[key] ?? key) : key; }
+
+// Only explicitly marked viewer UI is translated. Topic names and telemetry stay intact.
+export function setText(element, key) {
+  element.dataset.i18n = key;
+  element.textContent = t(key);
+}
+
+function refresh() {
+  document.documentElement.lang = language;
+  document.querySelectorAll('[data-i18n]').forEach(element => {
+    element.textContent = t(element.dataset.i18n);
+  });
+  for (const attribute of ['title', 'aria-label', 'alt']) {
+    document.querySelectorAll(`[data-i18n-${attribute}]`).forEach(element => {
+      element.setAttribute(attribute, t(element.getAttribute(`data-i18n-${attribute}`)));
+    });
+  }
+}
+
+window.addEventListener('storage', event => {
+  if (event.key !== storageKey) return;
+  language = event.newValue === 'en' ? 'en' : 'ko';
+  refresh();
+});
+refresh();
+
+// Embedded viewers may not share storage with the app (for example file URLs).
+window.addEventListener('message', event => {
+  if (window.parent === window || event.source !== window.parent) return;
+  if (event.data?.type !== 'lms:language' || !['ko', 'en'].includes(event.data.language)) return;
+  language = event.data.language;
+  refresh();
+});
+if (window.parent !== window) window.parent.postMessage({ type: 'lms:language:ready' }, '*');
@@ -9,7 +9,7 @@
      width: 100%;
      height: 100%;
      overflow: hidden;
-      background: #07111f;
+      background: #ffffff;
      font-family: NanumSquare, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

@@ -17,7 +17,7 @@
      position: relative;
      width: 100vw;
      height: 100vh;
-      background: radial-gradient(circle at 50% 35%, #11243e 0%, #07111f 54%, #03070d 100%);
+      background: #ffffff;
      -webkit-app-region: drag;
    }

@@ -31,22 +31,53 @@
      -webkit-user-drag: none;
    }

-    .fallback-title {
+    .brand-logo {
      position: absolute;
-      top: 45%;
+      top: 116px;
+      left: calc(50% - 3px);
+      z-index: 1;
+      width: 80px;
+      height: 70px;
+      transform: translateX(-50%);
+      object-fit: contain;
+      user-select: none;
+      -webkit-user-drag: none;
+    }
+
+    .brand-copy {
+      position: absolute;
+      top: 187px;
      left: 50%;
-      transform: translate(-50%, -50%);
-      color: #4d5d76;
-      text-shadow: 0 1px 12px rgba(255, 255, 255, 0.28);
-      font-size: 28px;
-      font-weight: 800;
+      z-index: 1;
+      width: 290px;
+      transform: translateX(-50%);
+      text-align: center;
+    }
+
+    .brand-title {
+      color: #252d39;
+      font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+      font-size: 32px;
+      font-weight: 400;
+      line-height: 1;
      letter-spacing: 6px;
+      text-indent: 6px;
+    }
+
+    .brand-subtitle {
+      margin-top: 9px;
+      color: #7a8495;
+      font-size: 12px;
+      font-weight: 400;
+      line-height: 1.2;
+      letter-spacing: 0;
    }

    .loading {
      position: absolute;
      right: 26px;
      bottom: 20px;
+      z-index: 2;
      color: #64738a;
      text-shadow: 0 1px 10px rgba(255, 255, 255, 0.24);
      font-size: 12px;
@@ -58,6 +89,7 @@
      position: absolute;
      bottom: 20px;
      left: 20px;
+      z-index: 2;
      color: #7a8495;
      text-shadow: 0 1px 8px rgba(255, 255, 255, 0.2);
      font-size: 11px;
@@ -68,21 +100,35 @@
 </head>
 <body>
  <div class="splash">
-    <div class="fallback-title">LMS</div>
-    <img class="splash-image" id="splash-image" alt="" />
+    <img class="splash-image" src="./assets/splash.png" alt="" />
+    <img class="brand-logo" src="./assets/splash-logo.png" alt="" />
+    <div class="brand-copy">
+      <div class="brand-title">LMS</div>
+      <div class="brand-subtitle">Learning Management System</div>
+    </div>
    <div class="copyright">© 2026 Autonomy Studio. All rights reserved.</div>
    <div class="loading" id="loading-text">학습 환경 준비 중...</div>
  </div>

  <script>
-    document.getElementById('splash-image').src = './assets/splash.png'
-
    const el = document.getElementById('loading-text')
+    const translations = {
+      '학습 환경 준비 중...': 'Preparing your learning environment...',
+      '로그인 세션 확인 중...': 'Checking your session...',
+      '강좌 정보 불러오는 중...': 'Loading courses...',
+      '커리큘럼 및 플랫폼 정보 가져오는 중...': 'Loading curriculum and platforms...'
+    }
+    let language = 'ko'
+    try {
+      language = localStorage.getItem('autonomy-studio.lms.language') === 'en' ? 'en' : 'ko'
+    } catch {}
+    document.documentElement.lang = language
    window.setSplashStatus = (message) => {
      if (typeof message === 'string' && message.trim()) {
-        el.textContent = message
+        el.textContent = language === 'en' ? (translations[message] ?? message) : message
      }
    }
+    window.setSplashStatus(el.textContent)
  </script>
 </body>
 </html>
@@ -0,0 +1,33 @@
+import { FileCode2, Loader2 } from 'lucide-react'
+import { t, useLocaleRender } from '../i18n'
+import type { AgentCodeReference, AgentCodeReferenceState } from '../features/workspace/useAiAgent'
+
+export function AgentCodeReferences({ references, states, dark, busy, onOpen }: {
+  references: AgentCodeReference[]
+  states?: Record<string, AgentCodeReferenceState>
+  dark: boolean
+  busy?: boolean
+  onOpen?: (id: string) => void
+}): React.JSX.Element {
+  useLocaleRender()
+  return <div className="grid min-w-0 gap-3">
+    {references.map(reference => {
+      const state = states?.[reference.id]
+      const opening = state?.status === 'opening'
+      return <div key={reference.id} data-agent-code-reference={reference.id} className={['min-w-0 border-t pt-2', dark ? 'border-white/10' : 'border-[#ddd6fe]'].join(' ')}>
+        <div className="flex min-w-0 items-start gap-2">
+          <FileCode2 size={14} className="mt-0.5 shrink-0 text-[#8b5cf6]" />
+          <div className="min-w-0">
+            <p className="break-all font-bold">{reference.moduleName}/{reference.path}</p>
+            <p className={dark ? 'text-white/48' : 'text-[#64748b]'}>{t('{{start}}~{{end}}줄', { start: reference.startLine, end: reference.endLine })}</p>
+            <p className="mt-1 break-words">{reference.reason}</p>
+          </div>
+        </div>
+        {state?.error && <p role="alert" className="mt-2 break-words text-[11px] text-[#ef4444]">{t(state.error)}</p>}
+        <div className="mt-2 flex min-w-0 items-center justify-end gap-2">
+          <button type="button" disabled={busy || opening || !onOpen} onClick={() => onOpen?.(reference.id)} className="inline-flex h-8 min-w-0 cursor-pointer items-center justify-center gap-1.5 rounded-md bg-[#7c3aed] px-3 text-[11px] font-bold leading-none text-white hover:bg-[#6d28d9] disabled:cursor-not-allowed disabled:opacity-40">{opening ? <Loader2 size={13} className="shrink-0 animate-spin" /> : <FileCode2 size={13} className="shrink-0" />}<span className="relative top-px leading-none">{opening ? t('파일 여는 중...') : t('코드에서 보기')}</span></button>
+        </div>
+      </div>
+    })}
+  </div>
+}
@@ -0,0 +1,119 @@
+import { useEffect, useId, useLayoutEffect, useRef, useState } from 'react'
+import { createPortal } from 'react-dom'
+import { Bot, Check } from 'lucide-react'
+import { t } from '../i18n'
+import { agentModelLabel, type AgentModelOption } from '../features/workspace/agentModels'
+
+export function AgentModelSelector({ models, provider, disabled, dark, onChange }: {
+  models: AgentModelOption[]
+  provider: string | null
+  disabled: boolean
+  dark: boolean
+  onChange: (provider: string) => void
+}): React.JSX.Element {
+  const selected = models.find(model => model.provider === provider)
+  const blocked = disabled || models.length === 0
+  const [open, setOpen] = useState(false)
+  const [position, setPosition] = useState({ left: 8, bottom: 8, width: 280, maxHeight: 320 })
+  const buttonRef = useRef<HTMLButtonElement>(null)
+  const menuRef = useRef<HTMLDivElement>(null)
+  const menuId = useId()
+  const visible = open && !blocked
+  const close = (restoreFocus = false): void => {
+    setOpen(false)
+    if (restoreFocus) buttonRef.current?.focus({ preventScroll: true })
+  }
+
+  useEffect(() => {
+    if (blocked) setOpen(false)
+  }, [blocked])
+
+  useLayoutEffect(() => {
+    if (!visible || !buttonRef.current) return
+    const bounds = buttonRef.current.getBoundingClientRect()
+    const width = Math.min(320, window.innerWidth - 16)
+    setPosition({
+      left: Math.max(8, Math.min(bounds.left, window.innerWidth - width - 8)),
+      bottom: window.innerHeight - bounds.top + 6,
+      width,
+      maxHeight: Math.max(0, Math.min(320, bounds.top - 14))
+    })
+    const items = menuRef.current?.querySelectorAll<HTMLButtonElement>('[role="menuitemradio"]')
+    const index = Math.max(0, models.findIndex(model => model.provider === provider))
+    items?.[index]?.focus({ preventScroll: true })
+  }, [visible, models, provider])
+
+  useEffect(() => {
+    if (!visible) return
+    const outside = (event: Event): void => {
+      const target = event.target as Node
+      if (!menuRef.current?.contains(target) && !buttonRef.current?.contains(target)) setOpen(false)
+    }
+    const dismiss = (): void => setOpen(false)
+    window.addEventListener('pointerdown', outside, true)
+    window.addEventListener('contextmenu', outside)
+    window.addEventListener('scroll', outside, true)
+    window.addEventListener('resize', dismiss)
+    window.addEventListener('blur', dismiss)
+    return () => {
+      window.removeEventListener('pointerdown', outside, true)
+      window.removeEventListener('contextmenu', outside)
+      window.removeEventListener('scroll', outside, true)
+      window.removeEventListener('resize', dismiss)
+      window.removeEventListener('blur', dismiss)
+    }
+  }, [visible])
+
+  return (
+    <>
+      <button
+        ref={buttonRef}
+        type="button"
+        aria-label={t('에이전트 모델 선택')}
+        aria-haspopup="menu"
+        aria-expanded={visible}
+        aria-controls={visible ? menuId : undefined}
+        title={selected ? agentModelLabel(selected) : t('사용 가능한 모델 없음')}
+        disabled={blocked}
+        onClick={() => setOpen(current => !current)}
+        onKeyDown={event => {
+          if (event.key === 'ArrowUp' || event.key === 'ArrowDown') { event.preventDefault(); setOpen(true) }
+          else if (event.key === 'Escape') close()
+        }}
+        className={['grid size-7 shrink-0 cursor-pointer place-items-center rounded outline-none transition focus-visible:ring-1 focus-visible:ring-[#8b5cf6] disabled:cursor-default disabled:opacity-35',
+          dark ? 'text-white/60 hover:bg-white/10 hover:text-white/90' : 'text-[#64748b] hover:bg-[#eef1f7] hover:text-[#111520]',
+          visible ? dark ? 'bg-white/10 text-white/90' : 'bg-[#eef1f7] text-[#111520]' : ''].join(' ')}
+      >
+        <Bot size={15} aria-hidden="true" />
+      </button>
+      {visible && createPortal(
+        <div ref={menuRef} id={menuId} role="menu" aria-label={t('에이전트 모델 선택')}
+          className={['fixed z-[160] overflow-y-auto overscroll-contain rounded-md border py-1 text-[12px] font-medium shadow-[0_14px_32px_rgba(0,0,0,0.32)]',
+            dark ? 'border-white/10 bg-[#252526] text-white/80' : 'border-[#d8dee9] bg-white text-[#374151]'].join(' ')}
+          style={position}
+          onContextMenu={event => { event.preventDefault(); event.stopPropagation() }}
+          onKeyDown={event => {
+            if (event.key === 'Escape') { event.preventDefault(); event.stopPropagation(); close(true); return }
+            if (event.key === 'Tab') { close(true); return }
+            if (!['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) return
+            event.preventDefault()
+            const items = Array.from(menuRef.current?.querySelectorAll<HTMLButtonElement>('[role="menuitemradio"]') ?? [])
+            const current = items.indexOf(document.activeElement as HTMLButtonElement)
+            const next = event.key === 'Home' ? 0 : event.key === 'End' ? items.length - 1
+              : (current + (event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length
+            items[next]?.focus()
+          }}
+        >
+          {models.map(model => <button key={model.provider} type="button" role="menuitemradio" aria-checked={model.provider === provider}
+            title={agentModelLabel(model)} tabIndex={-1}
+            onClick={() => { if (!blocked) { onChange(model.provider); close(true) } }}
+            className={['flex h-8 w-full cursor-pointer items-center gap-2 px-3 text-left outline-none transition',
+              dark ? 'hover:bg-[#37373d] hover:text-white focus:bg-[#37373d] focus:text-white' : 'hover:bg-[#eef1f7] hover:text-[#111520] focus:bg-[#eef1f7] focus:text-[#111520]'].join(' ')}>
+            <Check size={13} className={['shrink-0', model.provider === provider ? '' : 'opacity-0'].join(' ')} aria-hidden="true" />
+            <span className="min-w-0 truncate">{agentModelLabel(model)}</span>
+          </button>)}
+        </div>, document.body
+      )}
+    </>
+  )
+}
@@ -0,0 +1,58 @@
+import { CheckCircle2, CircleAlert, XCircle } from 'lucide-react'
+import { useEffect, useRef } from 'react'
+import { t, useLocaleRender } from '../i18n'
+import type { AgentProgressStep } from '../features/workspace/agentContext'
+import { AgentWorkDuration } from './AgentWorkDuration'
+
+function stepLabel(step: AgentProgressStep): string {
+  if (step.kind === 'analysis') return [
+    t('{{round}}차 분석 완료', { round: step.round ?? 1 }),
+    step.requests ? t('추가 조회 {{count}}건', { count: step.requests }) : ''
+  ].filter(Boolean).join(' · ')
+  if (step.kind === 'image') return `${t('이미지 업로드 완료')} · ${step.name}`
+  const tools: Record<string, string> = {
+    'modules.list': t('모듈 목록'),
+    'files.list': t('파일 목록'),
+    'files.search': t('파일 검색'),
+    'files.read': t('파일 읽기'),
+    'logs.read': t('로그 조회'),
+    'network.inspect': t('네트워크 조회'),
+    'ros.inspect': t('ROS 상태 조회'),
+    'practice.inspect': t('실습 구성 조회')
+  }
+  const status = step.status === 'error' ? t('조회 실패') : step.status === 'partial' ? t('일부 결과') : step.status === 'empty' ? t('조회 결과 없음') : step.status === 'missing' ? t('대상 없음') : t('조회 완료')
+  return [
+    step.moduleName,
+    step.kind === 'files' ? t('소스 파일') : step.kind === 'logs' ? t('로그 조회') : tools[step.name ?? ''] ?? step.name,
+    step.path,
+    status,
+    step.count !== undefined ? t('{{count}}건', { count: step.count }) : ''
+  ].filter(Boolean).join(' · ')
+}
+
+export function AgentProgressBubble({ dark, steps, activity, startedAt }: { dark: boolean; steps: AgentProgressStep[]; activity?: string; startedAt?: number | null }): React.JSX.Element {
+  useLocaleRender()
+  const listRef = useRef<HTMLOListElement>(null)
+  useEffect(() => {
+    const list = listRef.current
+    if (list) list.scrollTop = list.scrollHeight
+  }, [steps.length])
+  return (
+    <div data-agent-progress="true" className={['min-w-0 flex-1 overflow-hidden rounded-lg border px-3 py-3 text-[12px] leading-relaxed', dark ? 'border-white/10 bg-[#303030] text-white/75' : 'border-[#c4b5fd] bg-[#faf7ff] text-[#334155]'].join(' ')}>
+      <AgentWorkDuration dark={dark} startedAt={startedAt} />
+      <p className="font-bold">{t('진행 상황')}</p>
+      {steps.length > 0 && <ol ref={listRef} role="log" aria-label={t('진행 상황')} aria-live="polite" aria-relevant="additions" className="thin-scrollbar mt-2 grid max-h-64 gap-2 overflow-y-auto">
+        {steps.map(step => <li key={step.id} data-agent-progress-step={step.kind} className="agent-response-fade flex min-w-0 items-start gap-2">
+          {step.status === 'error' ? <XCircle size={13} className="mt-0.5 shrink-0 text-[#ef4444]" /> : step.status !== 'ok' ? <CircleAlert size={13} className="mt-0.5 shrink-0 text-[#d97706]" /> : <CheckCircle2 size={13} className="mt-0.5 shrink-0 text-[#22c55e]" />}
+          <span className="min-w-0 whitespace-pre-wrap break-words [overflow-wrap:anywhere]">{stepLabel(step)}</span>
+        </li>)}
+      </ol>}
+      <p role="status" className={['mt-2 break-words text-[11px]', dark ? 'text-white/50' : 'text-[#64748b]'].join(' ')}>{activity ? t(activity) : t('요청 분석 중')}</p>
+      <div className="mt-3 grid w-[220px] max-w-full animate-pulse gap-2 motion-reduce:animate-none" aria-hidden="true">
+        <span className={['h-2 w-full rounded-sm', dark ? 'bg-white/18' : 'bg-[#c4b5fd]/65'].join(' ')} />
+        <span className={['h-2 w-[76%] rounded-sm', dark ? 'bg-white/14' : 'bg-[#c4b5fd]/50'].join(' ')} />
+        <span className={['h-2 w-[52%] rounded-sm', dark ? 'bg-white/10' : 'bg-[#c4b5fd]/40'].join(' ')} />
+      </div>
+    </div>
+  )
+}
@@ -0,0 +1,27 @@
+import { useEffect, useState } from 'react'
+import { t, useLocaleRender } from '../i18n'
+
+export function AgentWorkDuration({ startedAt, durationMs, dark }: { startedAt?: number | null; durationMs?: number; dark: boolean }): React.JSX.Element | null {
+  useLocaleRender()
+  const [now, setNow] = useState(Date.now)
+  const completed = typeof durationMs === 'number' && Number.isFinite(durationMs) && durationMs >= 0
+  const running = !completed && typeof startedAt === 'number' && Number.isFinite(startedAt)
+  useEffect(() => {
+    if (!running) return
+    const update = (): void => setNow(Date.now())
+    update()
+    const timer = window.setInterval(update, 1000)
+    document.addEventListener('visibilitychange', update)
+    window.addEventListener('focus', update)
+    return () => {
+      window.clearInterval(timer)
+      document.removeEventListener('visibilitychange', update)
+      window.removeEventListener('focus', update)
+    }
+  }, [running, startedAt])
+  if (!running && !completed) return null
+  const seconds = Math.floor(Math.max(0, completed ? durationMs : now - startedAt!) / 1000)
+  return <p data-agent-work-duration={completed ? 'completed' : 'running'} aria-live="off" className={['mb-2 text-left text-[11px] font-normal leading-relaxed tabular-nums', dark ? 'text-white/45' : 'text-[#64748b]'].join(' ')}>
+    {completed ? t('{{seconds}}초 동안 작업함', { seconds }) : t('{{seconds}}초 동안 작업 중입니다', { seconds })}
+  </p>
+}
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../i18n'
 import { AlertCircle, CheckCircle2, Clock3, LogOut, Power, Trash2 } from 'lucide-react'
 import type React from 'react'

@@ -33,7 +34,7 @@ function strongClass(dark: boolean): string {
 }

 function dimClass(dark: boolean): string {
-  return dark ? 'text-white/45' : 'text-[#727b8c]'
+  return dark ? 'text-white/45' : 'text-[#475569]'
 }

 function cancelButtonClass(dark: boolean): string {
@@ -73,30 +74,30 @@ export function StatusNoticeModal({
  onAction?: () => void
  onConfirm: () => void
 }): React.JSX.Element {
+  useLocaleRender()
+  const hasAction = Boolean(actionLabel && onAction)
  return (
    <div className={overlayClassName}>
      <section className={modalClass(dark)}>
        <div className={['flex items-center gap-2 border-b px-4 py-3', borderClass(dark)].join(' ')}>
          {toneIcon(tone)}
-          <strong className="text-[13px] font-bold">{title}</strong>
+          <strong className="text-[13px] font-bold">{t(title)}</strong>
        </div>
        <div className="p-4">
-          <p className={['text-[13px] font-semibold', strongClass(dark)].join(' ')}>{message}</p>
+          <p className={['text-[13px] font-semibold', strongClass(dark)].join(' ')}>{t(message)}</p>
          {children}
          {detail && (
            <p className={['mt-2 text-[12px] font-medium leading-relaxed', dimClass(dark)].join(' ')}>
-              {detail}
+              {t(detail)}
            </p>
          )}
          <div className="mt-4 flex justify-end gap-2">
+            <button type="button" onClick={onConfirm} className={hasAction ? cancelButtonClass(dark) : confirmButtonClass('primary')}>{t("확인")}</button>
            {actionLabel && onAction && (
-              <button type="button" onClick={onAction} className={cancelButtonClass(dark)}>
-                {actionLabel}
+              <button type="button" onClick={onAction} className={confirmButtonClass('primary')}>
+                {t(actionLabel)}
              </button>
            )}
-            <button type="button" onClick={onConfirm} className={confirmButtonClass('primary')}>
-              확인
-            </button>
          </div>
        </div>
      </section>
@@ -117,29 +118,28 @@ export function WeekSwitchBlockedModal({
  onCancel: () => void
  onConfirm: () => void
 }): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className={overlayClassName}>
      <section className={modalClass(dark, true)}>
        <div className={['flex items-center gap-2 border-b px-4 py-3', borderClass(dark)].join(' ')}>
          <AlertCircle size={15} className="text-[#f59e0b]" />
-          <strong className="text-[13px] font-bold">이미 실행 중인 스튜디오가 있습니다</strong>
+          <strong className="text-[13px] font-bold">{t("이미 실행 중인 스튜디오가 있습니다")}</strong>
        </div>
        <div className="p-4">
          {[
-            ['실행 중', runningLabel],
-            ['새로 시작', nextLabel]
+            [t("실행 중"), runningLabel],
+            [t("새로 시작"), nextLabel]
          ].map(([label, value], index) => (
            <div key={label} className={[index ? 'mt-2' : '', 'rounded-md border px-3 py-2', dark ? 'border-white/10 bg-white/5' : 'border-[#e5e8ef] bg-[#f8fafc]'].join(' ')}>
              <p className={['text-[11px] font-bold', dimClass(dark)].join(' ')}>{label}</p>
              <p className={['mt-1 text-[13px] font-bold', strongClass(dark)].join(' ')}>{value}</p>
            </div>
          ))}
-          <p className={['mt-3 text-[12px] font-medium leading-relaxed', dimClass(dark)].join(' ')}>
-            현재 실행 중인 개발 스튜디오를 종료한 뒤 선택한 주차를 새로 시작할 수 있습니다.
-          </p>
+          <p className={['mt-3 text-[12px] font-medium leading-relaxed', dimClass(dark)].join(' ')}>{t("현재 실행 중인 개발 스튜디오를 종료한 뒤 선택한 주차를 새로 시작할 수 있습니다.")}</p>
          <div className="mt-4 flex justify-end gap-2">
-            <button type="button" onClick={onCancel} className={cancelButtonClass(dark)}>취소</button>
-            <button type="button" onClick={onConfirm} className={confirmButtonClass('danger')}>종료하고 새로 시작</button>
+            <button type="button" onClick={onCancel} className={cancelButtonClass(dark)}>{t("취소")}</button>
+            <button type="button" onClick={onConfirm} className={confirmButtonClass('danger')}>{t("종료하고 새로 시작")}</button>
          </div>
        </div>
      </section>
@@ -158,15 +158,16 @@ export function RunningPlatformCloseModal({
  onCancel: () => void
  onConfirm: () => void
 }): React.JSX.Element {
+  useLocaleRender()
  return (
    <ConfirmStatusModal
      overlayClassName={overlayClassName}
      dark={dark}
      icon={<Power size={15} className="text-[#e87979]" />}
-      title="개발 스튜디오 종료"
-      message={`${platformTitle} 개발 스튜디오를 종료할까요?`}
-      detail="현재 열린 개발 스튜디오 세션만 종료합니다. 플랫폼 제어권은 반납되지 않습니다."
-      confirmLabel="종료"
+      title={t("개발 스튜디오 종료")}
+      message={t("{{v0}} 개발 스튜디오를 종료할까요?", { v0: platformTitle === '로컬 PC' ? t('로컬 PC') : platformTitle })}
+      detail={t("현재 열린 개발 스튜디오 세션만 종료합니다. 플랫폼 제어권은 반납되지 않습니다.")}
+      confirmLabel={t("확인")}
      onCancel={onCancel}
      onConfirm={onConfirm}
    />
@@ -186,18 +187,19 @@ export function SessionConfirmModal({
  onCancel: () => void
  onConfirm: () => void
 }): React.JSX.Element {
+  useLocaleRender()
  const release = action === 'release'
  return (
    <ConfirmStatusModal
      overlayClassName={overlayClassName}
      dark={dark}
      icon={release ? <Trash2 size={15} className="text-[#e87979]" /> : <LogOut size={15} className="text-[#e87979]" />}
-      title={release ? '반납' : '연결종료'}
-      message={release ? '제어권을 반납할까요?' : '연결을 종료할까요?'}
+      title={release ? t("반납") : t("연결종료")}
+      message={release ? t("제어권을 반납할까요?") : t("연결을 종료할까요?")}
      detail={release
-        ? `${platformName} 제어권을 반납하면 대기 중인 다음 수강생에게 제어권이 넘어갈 수 있습니다.`
-        : `${platformName} 개발 스튜디오 연결만 종료합니다. 플랫폼 제어권은 반납되지 않습니다.`}
-      confirmLabel={release ? '반납' : '연결종료'}
+        ? t("{{v0}} 제어권을 반납하면 대기 중인 다음 수강생에게 제어권이 넘어갈 수 있습니다.", { v0: platformName })
+        : t("{{v0}} 개발 스튜디오 연결만 종료합니다. 플랫폼 제어권은 반납되지 않습니다.", { v0: platformName === '로컬 PC' ? t('로컬 PC') : platformName })}
+      confirmLabel={release ? t("반납") : t("연결종료")}
      onCancel={onCancel}
      onConfirm={onConfirm}
    />
@@ -217,22 +219,23 @@ export function ModuleShutdownConfirmModal({
  onKeepRunning: () => void
  onStopModules: () => void
 }): React.JSX.Element {
+  useLocaleRender()
  const release = action === 'release'
  return (
    <ConfirmStatusModal
      overlayClassName={overlayClassName}
      dark={dark}
      icon={<AlertCircle size={15} className="text-[#f59e0b]" />}
-      title="실행 중인 모듈"
-      message={`${moduleNames.length}개의 모듈이 실행 중입니다. 모듈을 종료할까요?`}
+      title={t("실행 중인 모듈")}
+      message={t("{{v0}}개의 모듈이 실행 중입니다. 모듈을 종료할까요?", { v0: moduleNames.length })}
      detail={moduleNames.join(', ')}
-      cancelLabel="아니오"
-      confirmLabel="예"
+      cancelLabel={t("아니오")}
+      confirmLabel={t("예")}
      onCancel={onKeepRunning}
      onConfirm={onStopModules}
    >
      <p className={['mt-3 text-[11px] font-medium', dimClass(dark)].join(' ')}>
-        {release ? '아니오를 선택하면 모듈은 플랫폼에서 계속 실행됩니다.' : '아니오를 선택하면 연결 종료 후에도 모듈은 계속 실행됩니다.'}
+        {release ? t("아니오를 선택하면 모듈은 플랫폼에서 계속 실행됩니다.") : t("아니오를 선택하면 연결 종료 후에도 모듈은 계속 실행됩니다.")}
      </p>
    </ConfirmStatusModal>
  )
@@ -251,22 +254,21 @@ export function ControlExtensionConfirmModal({
  onCancel: () => void
  onConfirm: () => void
 }): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className={overlayClassName}>
      <section className={modalClass(dark)}>
        <div className={['flex items-center gap-2 border-b px-4 py-3', borderClass(dark)].join(' ')}>
          <Clock3 size={15} className="text-[#f59e0b]" />
-          <strong className="text-[13px] font-bold">제어 시간 연장</strong>
+          <strong className="text-[13px] font-bold">{t("제어 시간 연장")}</strong>
        </div>
        <div className="p-4">
-          <p className={['text-[13px] font-semibold', strongClass(dark)].join(' ')}>{platformName} 제어 시간을 연장할까요?</p>
-          <p className={['mt-2 text-[12px] font-medium leading-relaxed', dimClass(dark)].join(' ')}>
-            대기 중인 예약이 없을 때 현재 설정된 제어 시간만큼 한 번만 연장됩니다.
-          </p>
+          <p className={['text-[13px] font-semibold', strongClass(dark)].join(' ')}>{platformName}{t("제어 시간을 연장할까요?")}</p>
+          <p className={['mt-2 text-[12px] font-medium leading-relaxed', dimClass(dark)].join(' ')}>{t("대기 중인 예약이 없을 때 현재 설정된 제어 시간만큼 한 번만 연장됩니다.")}</p>
          <div className="mt-4 flex justify-end gap-2">
-            <button type="button" disabled={submitting} onClick={onCancel} className={cancelButtonClass(dark)}>취소</button>
+            <button type="button" disabled={submitting} onClick={onCancel} className={cancelButtonClass(dark)}>{t("취소")}</button>
            <button type="button" disabled={submitting} onClick={onConfirm} className={confirmButtonClass('primary')}>
-              {submitting ? '연장 중' : '연장'}
+              {submitting ? t("연장 중") : t("연장")}
            </button>
          </div>
        </div>
@@ -275,7 +277,7 @@ export function ControlExtensionConfirmModal({
  )
 }

-function ConfirmStatusModal({
+export function ConfirmStatusModal({
  overlayClassName,
  dark,
  icon,
@@ -298,22 +300,23 @@ function ConfirmStatusModal({
  onConfirm: () => void
  children?: React.ReactNode
 }): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className={overlayClassName}>
      <section className={modalClass(dark)}>
        <div className={['flex items-center gap-2 border-b px-4 py-3', borderClass(dark)].join(' ')}>
          {icon}
-          <strong className="text-[13px] font-bold">{title}</strong>
+          <strong className="text-[13px] font-bold">{t(title)}</strong>
        </div>
        <div className="p-4">
-          <p className={['text-[13px] font-semibold', strongClass(dark)].join(' ')}>{message}</p>
+          <p className={['text-[13px] font-semibold', strongClass(dark)].join(' ')}>{t(message)}</p>
          <p className={['mt-2 text-[12px] font-medium leading-relaxed', dimClass(dark)].join(' ')}>
-            {detail}
+            {t(detail)}
          </p>
          {children}
          <div className="mt-4 flex justify-end gap-2">
-            <button type="button" onClick={onCancel} className={cancelButtonClass(dark)}>{cancelLabel}</button>
-            <button type="button" onClick={onConfirm} className={confirmButtonClass('danger')}>{confirmLabel}</button>
+            <button type="button" onClick={onCancel} className={cancelButtonClass(dark)}>{t(cancelLabel)}</button>
+            <button type="button" onClick={onConfirm} className={confirmButtonClass('danger')}>{t(confirmLabel)}</button>
          </div>
        </div>
      </section>
@@ -0,0 +1,63 @@
+import { Check, Copy, FileCode2, X } from 'lucide-react'
+import { common, createLowlight } from 'lowlight'
+import type React from 'react'
+import { useEffect, useMemo, useRef, useState } from 'react'
+import { t, useLocaleRender } from '../i18n'
+
+const highlighter = createLowlight(common)
+const languageLabels: Record<string, string> = {
+  python: 'Python', py: 'Python', yaml: 'YAML', yml: 'YAML', json: 'JSON',
+  cpp: 'C++', 'c++': 'C++', c: 'C', javascript: 'JavaScript', js: 'JavaScript',
+  typescript: 'TypeScript', ts: 'TypeScript', bash: 'Bash', sh: 'Bash', shell: 'Shell',
+  xml: 'XML', html: 'HTML', css: 'CSS', sql: 'SQL', markdown: 'Markdown', md: 'Markdown',
+}
+type HighlightNode = ReturnType<typeof highlighter.highlight>['children'][number]
+
+function renderToken(node: HighlightNode, key: string): React.ReactNode {
+  if (node.type === 'text') return node.value
+  if (node.type !== 'element') return null
+  const classes = node.properties.className
+  return <span key={key} className={Array.isArray(classes) ? classes.join(' ') : undefined}>
+    {node.children.map((child, index) => renderToken(child, `${key}-${index}`))}
+  </span>
+}
+
+export function ChatCodeBlock({ source, language = '', dark, fadeClass = '' }: {
+  source: string
+  language?: string
+  dark: boolean
+  fadeClass?: string
+}): React.JSX.Element {
+  useLocaleRender()
+  const [copyState, setCopyState] = useState<'idle' | 'copied' | 'error'>('idle')
+  const timer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined)
+  useEffect(() => () => clearTimeout(timer.current), [])
+  useEffect(() => { setCopyState('idle'); clearTimeout(timer.current) }, [source])
+  const normalizedLanguage = language.toLowerCase()
+  const tokens = useMemo(() => {
+    if (source.length > 50_000 || !highlighter.registered(normalizedLanguage)) return source
+    try { return highlighter.highlight(normalizedLanguage, source).children.map((node, index) => renderToken(node, `${index}`)) }
+    catch { return source }
+  }, [source, normalizedLanguage])
+  const copy = async (): Promise<void> => {
+    try {
+      await navigator.clipboard.writeText(source)
+      setCopyState('copied')
+    } catch {
+      setCopyState('error')
+    }
+    clearTimeout(timer.current)
+    timer.current = setTimeout(() => setCopyState('idle'), 1800)
+  }
+  const copyLabel = copyState === 'copied' ? t('복사됨') : copyState === 'error' ? t('코드를 복사하지 못했습니다.') : t('코드 복사')
+  return <div data-chat-code-block data-code-theme={dark ? 'dark' : 'light'} className={['chat-code-block my-2 min-w-0 max-w-full overflow-hidden rounded-md border', dark ? 'border-white/12 bg-[#191919] text-[#dedede]' : 'border-[#d7dfeb] bg-[#f8fafc] text-[#253247]', fadeClass].join(' ')}>
+    <div className={['flex h-9 min-w-0 items-center justify-between gap-2 border-b px-2.5', dark ? 'border-white/10 bg-[#262626]' : 'border-[#e2e8f0] bg-[#eef2f7]'].join(' ')}>
+      <span title={language || undefined} className="flex min-w-0 items-center gap-1.5 text-[11px] font-bold"><FileCode2 size={13} className="shrink-0" /><span className="truncate">{languageLabels[normalizedLanguage] ?? (language ? language.slice(0, 40) : t('일반 텍스트'))}</span></span>
+      <button type="button" title={copyLabel} aria-label={copyLabel} onClick={event => { event.stopPropagation(); void copy() }} className={['grid h-7 w-7 shrink-0 cursor-pointer place-items-center rounded transition focus-visible:outline-2 focus-visible:outline-[#60a5fa]', copyState === 'error' ? 'text-[#ef4444]' : dark ? 'text-white/65 hover:bg-white/10 hover:text-white' : 'text-[#526079] hover:bg-[#dbe3ee] hover:text-[#182337]'].join(' ')}>{copyState === 'copied' ? <Check size={14} /> : copyState === 'error' ? <X size={14} /> : <Copy size={14} />}</button>
+      <span role="status" className="sr-only">{copyState === 'idle' ? '' : copyLabel}</span>
+    </div>
+    <pre tabIndex={0} aria-label={t('코드')} className="thin-scrollbar m-0 max-h-80 max-w-full overflow-auto p-3 text-[11px] leading-relaxed outline-offset-[-2px] [overflow-wrap:normal] [tab-size:4] [word-break:normal]">
+      <code className="block w-max min-w-full whitespace-pre font-mono font-normal [overflow-wrap:normal] [word-break:normal]">{tokens}</code>
+    </pre>
+  </div>
+}
@@ -0,0 +1,44 @@
+import { useEffect, useRef, useState } from 'react'
+import { createPortal } from 'react-dom'
+import { X } from 'lucide-react'
+import { t, useLocaleRender } from '../i18n'
+import { displayAttachmentName } from './chatAttachments'
+
+type ImageAttachment = { name: string; url: string }
+
+export function ChatImageAttachments({ images, variant = 'draft', dark = true, onRemove, removeDisabled = false }: {
+  images: ImageAttachment[]
+  variant?: 'draft' | 'sent'
+  dark?: boolean
+  onRemove?: (image: ImageAttachment) => void
+  removeDisabled?: boolean
+}): React.JSX.Element | null {
+  useLocaleRender()
+  const [preview, setPreview] = useState<ImageAttachment | null>(null)
+  const dialogRef = useRef<HTMLDialogElement>(null)
+  useEffect(() => {
+    if (preview) dialogRef.current?.showModal()
+    else dialogRef.current?.close()
+  }, [preview])
+  if (!images.length) return null
+  return <>
+    <div data-chat-image-attachments={variant} className={['flex min-w-0 flex-wrap gap-2', variant === 'sent' ? 'justify-end' : 'mt-2'].join(' ')}>
+      {images.map((source, index) => {
+        const image = { ...source, name: displayAttachmentName(source.name) }
+        return variant === 'draft' ? <div key={`${image.url}-${index}`} data-chat-image-draft="true" className={['flex h-16 w-56 min-w-0 max-w-full items-center gap-1 overflow-hidden rounded-md border p-1', dark ? 'border-white/10 bg-white/[0.03] text-white/70' : 'border-[#d8dee9] bg-[#f8f9fc] text-[#475569]'].join(' ')}>
+          <button type="button" title={image.name} aria-label={`${t('이미지 확대')}: ${image.name}`} onClick={() => setPreview(image)} className="flex h-full min-w-0 flex-1 cursor-zoom-in items-center gap-2 overflow-hidden text-left">
+            <img src={image.url} alt={image.name} loading="lazy" referrerPolicy="no-referrer" className="h-full w-14 shrink-0 rounded bg-black/10 object-contain" />
+            <span className="min-w-0 truncate text-[11px]">{image.name}</span>
+          </button>
+          {onRemove && <button type="button" disabled={removeDisabled} title={t('첨부 제거')} aria-label={`${t('첨부 제거')}: ${image.name}`} onClick={() => onRemove(image)} className={['grid size-6 shrink-0 cursor-pointer place-items-center rounded disabled:cursor-default disabled:opacity-40', dark ? 'hover:bg-white/10' : 'hover:bg-black/5'].join(' ')}><X size={12} /></button>}
+        </div> : <button type="button" key={`${image.url}-${index}`} title={image.name} aria-label={`${t('이미지 확대')}: ${image.name}`} onClick={() => setPreview(image)} className="h-16 w-20 shrink-0 cursor-zoom-in overflow-hidden rounded-md border border-current/20 bg-black/10">
+          <img src={image.url} alt={image.name} loading="lazy" referrerPolicy="no-referrer" className="h-full w-full object-contain" />
+        </button>
+      })}
+    </div>
+    {preview && createPortal(<dialog ref={dialogRef} aria-label={preview.name} onCancel={() => setPreview(null)} onClick={event => { if (event.target === event.currentTarget) setPreview(null) }} className="fixed inset-0 m-auto max-h-[90vh] max-w-[94vw] overflow-auto rounded-lg border border-white/15 bg-[#202020] p-3 text-white shadow-xl backdrop:bg-black/75">
+      <div className="mb-2 flex min-w-0 items-center justify-between gap-3"><span className="min-w-0 break-all text-[12px]">{preview.name}</span><button type="button" title={t('닫기')} aria-label={t('닫기')} onClick={() => setPreview(null)} className="grid size-8 shrink-0 cursor-pointer place-items-center rounded hover:bg-white/10"><X size={16} /></button></div>
+      <img src={preview.url} alt={preview.name} referrerPolicy="no-referrer" className="max-h-[78vh] max-w-full object-contain" />
+    </dialog>, document.body)}
+  </>
+}
@@ -0,0 +1,106 @@
+import { useEffect, useLayoutEffect, useRef, useState } from 'react'
+import { createPortal } from 'react-dom'
+import { ClipboardPaste, Copy, Trash2 } from 'lucide-react'
+import { t, useLocaleRender } from '../i18n'
+
+export type ChatTextContextMenuState = {
+  kind: 'message' | 'input'
+  x: number
+  y: number
+  text: string
+  input?: HTMLTextAreaElement
+  selectionStart?: number
+  selectionEnd?: number
+}
+
+export function ChatTextContextMenu({ dark, menu, canClear = false, onClose, onClear, onPasteText }: {
+  dark: boolean
+  menu: ChatTextContextMenuState | null
+  canClear?: boolean
+  onClose: () => void
+  onClear?: () => void
+  onPasteText?: (text: string, menu: ChatTextContextMenuState) => void
+}): React.JSX.Element | null {
+  useLocaleRender()
+  const menuRef = useRef<HTMLDivElement>(null)
+  const [clipboardState, setClipboardState] = useState<{ menu: ChatTextContextMenuState; hasText: boolean } | null>(null)
+  const [position, setPosition] = useState({ x: 0, y: 0 })
+  const closeRef = useRef(onClose)
+  closeRef.current = onClose
+
+  useLayoutEffect(() => {
+    if (!menu || !menuRef.current) return
+    const bounds = menuRef.current.getBoundingClientRect()
+    setPosition({ x: Math.max(8, Math.min(menu.x, window.innerWidth - bounds.width - 8)), y: Math.max(8, Math.min(menu.y, window.innerHeight - bounds.height - 8)) })
+  }, [menu])
+
+  useEffect(() => {
+    if (!menu) return
+    let disposed = false
+    if (menu.kind === 'input') {
+      const read = Promise.resolve().then(() => window.chatTextMenu?.readClipboardState
+        ? window.chatTextMenu.readClipboardState()
+        : navigator.clipboard.readText().then(text => ({ hasText: text.length > 0 })))
+      void read.then(state => { if (!disposed) setClipboardState({ menu, hasText: state.hasText }) })
+        .catch(() => { if (!disposed) setClipboardState({ menu, hasText: false }) })
+    }
+    const outside = (event: Event): void => {
+      if (!menuRef.current?.contains(event.target as Node)) closeRef.current()
+    }
+    const keydown = (event: KeyboardEvent): void => {
+      if (event.key === 'Escape') { event.preventDefault(); closeRef.current() }
+    }
+    const close = (): void => closeRef.current()
+    window.addEventListener('pointerdown', outside, true)
+    window.addEventListener('contextmenu', outside)
+    window.addEventListener('scroll', outside, true)
+    window.addEventListener('resize', close)
+    window.addEventListener('blur', close)
+    window.addEventListener('keydown', keydown)
+    return () => {
+      disposed = true
+      window.removeEventListener('pointerdown', outside, true)
+      window.removeEventListener('contextmenu', outside)
+      window.removeEventListener('scroll', outside, true)
+      window.removeEventListener('resize', close)
+      window.removeEventListener('blur', close)
+      window.removeEventListener('keydown', keydown)
+    }
+  }, [menu])
+
+  if (!menu) return null
+  const pasteEnabled = menu.kind === 'input' && !menu.input?.disabled && !menu.input?.readOnly && clipboardState?.menu === menu && clipboardState.hasText
+  const itemClass = ['flex h-8 w-full cursor-pointer items-center gap-2 px-3 text-left transition disabled:cursor-default disabled:opacity-35', dark ? 'enabled:hover:bg-[#37373d] enabled:hover:text-white' : 'enabled:hover:bg-[#eef1f7] enabled:hover:text-[#111520]'].join(' ')
+  const copy = async (): Promise<void> => {
+    if (!menu.text) return
+    onClose()
+    if (window.chatTextMenu?.perform) await window.chatTextMenu.perform({ action: 'copy', text: menu.text })
+    else await navigator.clipboard.writeText(menu.text)
+  }
+  const paste = async (): Promise<void> => {
+    if (!pasteEnabled || !menu.input?.isConnected || menu.input.disabled || menu.input.readOnly) return
+    const input = menu.input
+    input.focus({ preventScroll: true })
+    input.setSelectionRange(menu.selectionStart ?? input.selectionStart, menu.selectionEnd ?? input.selectionEnd)
+    onClose()
+    if (window.chatTextMenu?.perform) await window.chatTextMenu.perform({ action: 'paste' })
+    else {
+      const text = await navigator.clipboard.readText()
+      if (text) onPasteText?.(text, menu)
+    }
+  }
+  return createPortal(
+    <div ref={menuRef} role="menu" aria-label={t('질의응답')} className={[
+      'fixed z-[160] w-[160px] overflow-hidden rounded-md border py-1 text-[12px] font-medium shadow-[0_14px_32px_rgba(0,0,0,0.32)]',
+      dark ? 'border-white/10 bg-[#252526] text-white/80' : 'border-[#d8dee9] bg-white text-[#374151]'
+    ].join(' ')} style={{ left: position.x, top: position.y }} onMouseDown={event => event.preventDefault()} onContextMenu={event => { event.preventDefault(); event.stopPropagation() }}>
+      <button type="button" role="menuitem" disabled={!menu.text} onClick={() => void copy().catch(error => console.error('[chat] copy failed', error))} className={itemClass}><Copy size={13} />{t('복사')}</button>
+      {menu.kind === 'input' ? (
+        <button type="button" role="menuitem" disabled={!pasteEnabled} onClick={() => void paste().catch(error => console.error('[chat] paste failed', error))} className={itemClass}><ClipboardPaste size={13} />{t('붙여넣기')}</button>
+      ) : onClear ? <>
+        <div role="separator" className={['my-1 border-t', dark ? 'border-white/10' : 'border-[#d8dee9]'].join(' ')} />
+        <button type="button" role="menuitem" disabled={!canClear} onClick={() => { onClose(); onClear() }} className={itemClass}><Trash2 size={13} />{t('대화내역 삭제')}</button>
+      </> : null}
+    </div>, document.body
+  )
+}
@@ -1,8 +1,13 @@
-import { ChevronDown, Send, Square } from 'lucide-react'
+import { t, useLocaleRender } from '../i18n'
+import { ChevronDown, Paperclip, Send, Square, Trash2, X } from 'lucide-react'
 import type React from 'react'
-import { memo, useEffect, useState } from 'react'
+import { memo, useEffect, useLayoutEffect, useRef, useState } from 'react'
+import { CHAT_ATTACHMENT_ACCEPT, CHAT_IMAGE_ACCEPT, readChatAttachments, type ChatAttachment } from './chatAttachments'
+import { ChatImageAttachments } from './ChatImageAttachments'
+import { ChatCodeBlock } from './ChatCodeBlock'
 import ReactMarkdown from 'react-markdown'
 import remarkGfm from 'remark-gfm'
+import { ChatTextContextMenu, type ChatTextContextMenuState } from './ChatTextContextMenu'

 export function ChatAvatar({
  accessToken,
@@ -15,6 +20,7 @@ export function ChatAvatar({
  fallback: React.JSX.Element
  className: string
 }): React.JSX.Element {
+  useLocaleRender()
  const [avatarSource, setAvatarSource] = useState<string | null>(null)

  useEffect(() => {
@@ -56,22 +62,23 @@ export function ChatAvatar({
  )
 }

-export function MarkdownMessage({ content, dark }: { content: string; dark: boolean }): React.JSX.Element {
+export function MarkdownMessage({ content, dark, fadeFrom }: { content: string; dark: boolean; fadeFrom?: number }): React.JSX.Element {
+  useLocaleRender()
  const textColor = dark ? 'text-white/76' : 'text-[#4f596b]'
  const headingColor = dark ? 'text-white/92' : 'text-[#111827]'
  const mutedBorder = dark ? 'border-white/10' : 'border-[#d7dfeb]'
-  const codeBg = dark ? 'bg-[#171717] text-white/82' : 'bg-[#f1f5f9] text-[#334155]'
+  const fadeClass = (offset?: number): string => fadeFrom !== undefined && offset !== undefined && offset >= fadeFrom ? ' agent-response-fade' : ''

  return (
    <div className={`min-w-0 max-w-full overflow-hidden break-words text-[12px] leading-relaxed [overflow-wrap:anywhere] [word-break:break-word] ${textColor}`}>
      <ReactMarkdown
        remarkPlugins={[remarkGfm]}
        components={{
-          h1: ({ children }) => <h1 className={`mb-2 mt-1 break-words text-[15px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}`}>{children}</h1>,
-          h2: ({ children }) => <h2 className={`mb-2 mt-3 break-words text-[14px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}`}>{children}</h2>,
-          h3: ({ children }) => <h3 className={`mb-1.5 mt-3 break-words text-[13px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}`}>{children}</h3>,
-          h4: ({ children }) => <h4 className={`mb-1 mt-2.5 break-words text-[12px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}`}>{children}</h4>,
-          p: ({ children }) => <p className="my-1 max-w-full whitespace-pre-wrap break-words leading-relaxed [overflow-wrap:anywhere] [word-break:break-word]">{children}</p>,
+          h1: ({ children, node }) => <h1 className={`mb-2 mt-1 break-words text-[15px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}${fadeClass(node?.position?.start.offset)}`}>{children}</h1>,
+          h2: ({ children, node }) => <h2 className={`mb-2 mt-3 break-words text-[14px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}${fadeClass(node?.position?.start.offset)}`}>{children}</h2>,
+          h3: ({ children, node }) => <h3 className={`mb-1.5 mt-3 break-words text-[13px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}${fadeClass(node?.position?.start.offset)}`}>{children}</h3>,
+          h4: ({ children, node }) => <h4 className={`mb-1 mt-2.5 break-words text-[12px] font-black leading-snug [overflow-wrap:anywhere] ${headingColor}${fadeClass(node?.position?.start.offset)}`}>{children}</h4>,
+          p: ({ children, node }) => <p className={`my-1 max-w-full whitespace-pre-wrap break-words leading-relaxed [overflow-wrap:anywhere] [word-break:break-word]${fadeClass(node?.position?.start.offset)}`}>{children}</p>,
          strong: ({ children }) => <strong className={`font-black ${headingColor}`}>{children}</strong>,
          em: ({ children }) => <em className="italic">{children}</em>,
          a: ({ children, href }) => (
@@ -85,30 +92,37 @@ export function MarkdownMessage({ content, dark }: { content: string; dark: bool
              {children}
            </a>
          ),
-          ul: ({ children }) => <ul className="my-2 grid gap-1 pl-4">{children}</ul>,
-          ol: ({ children }) => <ol className="my-2 grid gap-1 pl-4">{children}</ol>,
-          li: ({ children }) => <li className="max-w-full break-words pl-1 leading-relaxed marker:font-bold [overflow-wrap:anywhere] [word-break:break-word]">{children}</li>,
-          blockquote: ({ children }) => (
-            <blockquote className={`my-2 border-l-2 pl-3 ${mutedBorder} ${dark ? 'text-white/58' : 'text-[#64748b]'}`}>
+          ul: ({ children, className }) => <ul className={`my-2 grid gap-1 pl-5 ${className?.includes('contains-task-list') ? 'contains-task-list list-none' : 'list-disc [&_ul]:list-[circle]'}`}>{children}</ul>,
+          ol: ({ children, start }) => <ol start={start} className="my-2 grid list-decimal gap-1 pl-5">{children}</ol>,
+          li: ({ children, node, className }) => <li className={`max-w-full break-words pl-1 leading-relaxed marker:font-bold [overflow-wrap:anywhere] [word-break:break-word] ${className?.includes('task-list-item') ? 'task-list-item list-none' : ''}${fadeClass(node?.position?.start.offset)}`}>{children}</li>,
+          blockquote: ({ children, node }) => (
+            <blockquote className={`my-2 border-l-2 pl-3 ${mutedBorder} ${dark ? 'text-white/58' : 'text-[#64748b]'}${fadeClass(node?.position?.start.offset)}`}>
              {children}
            </blockquote>
          ),
-          hr: () => <hr className={`my-3 ${mutedBorder}`} />,
-          pre: ({ children }) => <pre className={`my-2 max-w-full overflow-hidden whitespace-pre-wrap break-words rounded-md p-2 font-mono text-[11px] font-medium leading-relaxed [overflow-wrap:anywhere] ${codeBg}`}>{children}</pre>,
+          hr: ({ node }) => <hr className={`my-3 ${mutedBorder}${fadeClass(node?.position?.start.offset)}`} />,
+          pre: ({ children, node }) => {
+            const code = node?.children.find(child => child.type === 'element' && child.tagName === 'code')
+            if (code?.type !== 'element') return <pre className="my-2 max-w-full overflow-auto whitespace-pre font-mono text-[11px]">{children}</pre>
+            const source = code.children.map(child => child.type === 'text' ? child.value : '').join('')
+            const classes = code.properties.className
+            const language = Array.isArray(classes) ? String(classes.find(value => String(value).startsWith('language-')) ?? '').slice(9) : ''
+            return <ChatCodeBlock source={source} language={language} dark={dark} fadeClass={fadeClass(node?.position?.start.offset)} />
+          },
          code: ({ children, className }) => {
            if (className) {
              return <code className="whitespace-pre-wrap break-words font-mono [overflow-wrap:anywhere]">{children}</code>
            }
-            return <code className={`rounded px-1 py-0.5 font-mono text-[11px] ${dark ? 'bg-white/10 text-[#dbeafe]' : 'bg-[#eef2ff] text-[#1d4ed8]'}`}>{children}</code>
+            return <code className={`chat-inline-code rounded px-1 py-0.5 font-mono text-[11px] ${dark ? 'bg-white/10 text-[#dbeafe]' : 'bg-[#eef2ff] text-[#1d4ed8]'}`}>{children}</code>
          },
-          table: ({ children }) => (
-            <div className="my-2 max-w-full overflow-hidden">
-              <table className={`w-full table-fixed border-collapse text-left text-[11px] ${dark ? 'text-white/72' : 'text-[#475569]'}`}>{children}</table>
+          table: ({ children, node }) => (
+            <div data-chat-table tabIndex={0} role="region" aria-label={t('표')} className={`thin-x-scrollbar my-2 max-w-full overflow-x-auto rounded-md${fadeClass(node?.position?.start.offset)}`}>
+              <table className={`w-full table-auto border-collapse text-left text-[11px] ${dark ? 'text-white/72' : 'text-[#475569]'}`}>{children}</table>
            </div>
          ),
          thead: ({ children }) => <thead className={dark ? 'bg-white/8 text-white/86' : 'bg-[#eef2f7] text-[#1e293b]'}>{children}</thead>,
-          th: ({ children }) => <th className={`break-words border px-2 py-1.5 font-black [overflow-wrap:anywhere] ${mutedBorder}`}>{children}</th>,
-          td: ({ children }) => <td className={`break-words border px-2 py-1.5 align-top [overflow-wrap:anywhere] ${mutedBorder}`}>{children}</td>
+          th: ({ children, style }) => <th style={style} className={`min-w-[96px] max-w-[320px] break-words border px-2 py-1.5 font-black [overflow-wrap:anywhere] ${mutedBorder}`}>{children}</th>,
+          td: ({ children, style }) => <td style={style} className={`min-w-[96px] max-w-[320px] break-words border px-2 py-1.5 align-top [overflow-wrap:anywhere] ${mutedBorder}`}>{children}</td>
        }}
      >
        {content}
@@ -117,6 +131,33 @@ export function MarkdownMessage({ content, dark }: { content: string; dark: bool
  )
 }

+export function ChatEmptyState({ dark, children }: { dark: boolean; children: React.ReactNode }): React.JSX.Element {
+  return (
+    <div className={['flex h-full min-h-[160px] items-center justify-center text-center text-[12px] font-semibold leading-relaxed', dark ? 'text-white/45' : 'text-[#687284]'].join(' ')}>
+      <div className={['relative mx-4 min-w-0 max-w-full break-words rounded-lg border px-8 py-5', dark ? 'border-white/12 bg-[#272727]' : 'border-[#d8dee9] bg-[#f8fafc]'].join(' ')}>
+        <span>{children}</span>
+        <span aria-hidden="true" className={['absolute -bottom-[5px] left-7 size-2 rotate-45 border-b border-r', dark ? 'border-white/12 bg-[#272727]' : 'border-[#d8dee9] bg-[#f8fafc]'].join(' ')} />
+      </div>
+    </div>
+  )
+}
+
+export function ChatResponseSkeleton({ dark, label }: { dark: boolean; label: string }): React.JSX.Element {
+  return (
+    <div
+      role="status"
+      aria-label={label}
+      className={['w-[220px] max-w-[calc(100%-38px)] rounded-lg border px-3 py-3', dark ? 'border-white/10 bg-[#303030]' : 'border-[#c4b5fd] bg-[#faf7ff]'].join(' ')}
+    >
+      <div className="grid animate-pulse gap-2 motion-reduce:animate-none" aria-hidden="true">
+        <span className={['h-2 w-full rounded-sm', dark ? 'bg-white/18' : 'bg-[#c4b5fd]/65'].join(' ')} />
+        <span className={['h-2 w-[76%] rounded-sm', dark ? 'bg-white/14' : 'bg-[#c4b5fd]/50'].join(' ')} />
+        <span className={['h-2 w-[52%] rounded-sm', dark ? 'bg-white/10' : 'bg-[#c4b5fd]/40'].join(' ')} />
+      </div>
+    </div>
+  )
+}
+
 export function ExpandableMarkdownMessage({
  content,
  dark,
@@ -130,6 +171,7 @@ export function ExpandableMarkdownMessage({
  collapseSignal?: number
  defaultCollapsed?: boolean
 }): React.JSX.Element {
+  useLocaleRender()
  const [expanded, setExpanded] = useState(!defaultCollapsed)
  const lineCount = content.split('\n').length
  const collapsible = content.length > 700 || lineCount > 12
@@ -161,8 +203,9 @@ export function ExpandableMarkdownMessage({
        <div className={['relative z-10', collapsed ? '-mt-7' : 'mt-2'].join(' ')}>
          <button
            type="button"
-            aria-label={expanded ? '접기' : '자세히 보기'}
-            title={expanded ? '접기' : '자세히 보기'}
+            aria-label={expanded ? t("접기") : t("자세히 보기")}
+            aria-expanded={expanded}
+            title={expanded ? t("접기") : t("자세히 보기")}
            onClick={() => setExpanded((value) => !value)}
            className={['grid h-7 w-full cursor-pointer place-items-center rounded-md transition', dark ? 'text-white/55 hover:bg-white/8 hover:text-white/80' : 'text-[#64748b] hover:bg-[#e2e8f0]/70 hover:text-[#2563eb]'].join(' ')}
          >
@@ -183,6 +226,7 @@ export function ExpandablePlainMessage({
  collapseSignal?: number
  content: string
 }): React.JSX.Element {
+  useLocaleRender()
  const [expanded, setExpanded] = useState(false)
  const lineCount = content.split('\n').length
  const collapsible = content.length > 450 || lineCount > 8
@@ -216,8 +260,8 @@ export function ExpandablePlainMessage({
        <div className={['relative z-10', collapsed ? '-mt-6' : 'mt-2'].join(' ')}>
          <button
            type="button"
-            aria-label={expanded ? '접기' : '자세히 보기'}
-            title={expanded ? '접기' : '자세히 보기'}
+            aria-label={expanded ? t("접기") : t("자세히 보기")}
+            title={expanded ? t("접기") : t("자세히 보기")}
            onClick={() => setExpanded((value) => !value)}
            className="grid h-7 w-full cursor-pointer place-items-center rounded-md text-white/70 transition hover:bg-white/10 hover:text-white"
          >
@@ -229,11 +273,32 @@ export function ExpandablePlainMessage({
  )
 }

+function resizeQaInput(input: HTMLTextAreaElement): void {
+  const styles = window.getComputedStyle(input)
+  const lineHeight = Number.parseFloat(styles.lineHeight)
+  const padding = Number.parseFloat(styles.paddingTop) + Number.parseFloat(styles.paddingBottom)
+  const border = Number.parseFloat(styles.borderTopWidth) + Number.parseFloat(styles.borderBottomWidth)
+  const minHeight = Number.parseFloat(styles.minHeight)
+  const maxHeight = Math.ceil(lineHeight * 8 + padding + border)
+
+  input.style.height = 'auto'
+  input.style.overflowY = 'hidden'
+  const contentHeight = input.scrollHeight + border
+  input.style.maxHeight = `${maxHeight}px`
+  input.style.height = `${Math.min(Math.max(contentHeight, minHeight), maxHeight)}px`
+  input.style.overflowY = contentHeight > maxHeight ? 'auto' : 'hidden'
+}
+
 export const QaInputBox = memo(function QaInputBox({
  dark,
  busy,
  disabled,
  accent = 'blue',
+  attachmentsEnabled = false,
+  imagesEnabled = false,
+  onClearConversation,
+  clearDisabled = false,
+  footerAction,
  onStop,
  onSubmit
 }: {
@@ -241,44 +306,127 @@ export const QaInputBox = memo(function QaInputBox({
  busy: boolean
  disabled: boolean
  accent?: 'blue' | 'cyan'
+  attachmentsEnabled?: boolean
+  imagesEnabled?: boolean
+  onClearConversation?: () => void
+  clearDisabled?: boolean
+  footerAction?: React.ReactNode
  onStop: () => void
-  onSubmit: (content: string) => void
+  onSubmit: (content: string, attachments?: ChatAttachment[]) => void
 }): React.JSX.Element {
  const [draft, setDraft] = useState('')
-  const canSubmit = busy || (Boolean(draft.trim()) && !disabled)
+  const [attachments, setAttachments] = useState<ChatAttachment[]>([])
+  const [attachmentError, setAttachmentError] = useState<string | null>(null)
+  const [readingAttachments, setReadingAttachments] = useState(false)
+  const [contextMenu, setContextMenu] = useState<ChatTextContextMenuState | null>(null)
+  const fileInputRef = useRef<HTMLInputElement>(null)
+  const textareaRef = useRef<HTMLTextAreaElement>(null)
+  const attachmentReadRef = useRef(0)
+  const attachmentUrlsRef = useRef<string[]>([])
+  const canSubmit = busy || ((Boolean(draft.trim()) || attachments.some(file => file.kind === 'image')) && !disabled && !readingAttachments)
+
+  useEffect(() => {
+    const urls = attachments.flatMap(file => file.kind === 'image' ? [file.previewUrl] : [])
+    attachmentUrlsRef.current.filter(url => !urls.includes(url)).forEach(url => URL.revokeObjectURL(url))
+    attachmentUrlsRef.current = urls
+  }, [attachments])
+  useEffect(() => () => attachmentUrlsRef.current.forEach(url => URL.revokeObjectURL(url)), [])
+
+  const attachFiles = (files: File[]): void => {
+    if (!attachmentsEnabled || disabled || busy || readingAttachments || !files.length) return
+    const readId = ++attachmentReadRef.current
+    setReadingAttachments(true)
+    setAttachmentError(null)
+    void readChatAttachments(files, attachments, { imagesEnabled }).then(files => {
+      if (attachmentReadRef.current === readId) setAttachments(files)
+      else files.forEach(file => { if (file.kind === 'image' && !attachments.includes(file)) URL.revokeObjectURL(file.previewUrl) })
+    }).catch(error => {
+      if (attachmentReadRef.current === readId) setAttachmentError(error instanceof Error ? error.message : '파일을 읽지 못했습니다.')
+    }).finally(() => { if (attachmentReadRef.current === readId) setReadingAttachments(false) })
+  }
+
+  useLayoutEffect(() => {
+    if (textareaRef.current) resizeQaInput(textareaRef.current)
+  }, [draft])
+
+  useEffect(() => {
+    const input = textareaRef.current
+    if (!input) return
+    let width = input.getBoundingClientRect().width
+    const observer = new ResizeObserver(([entry]) => {
+      if (!entry || entry.contentRect.width === width) return
+      width = entry.contentRect.width
+      resizeQaInput(input)
+    })
+    observer.observe(input)
+    return () => observer.disconnect()
+  }, [])
+
+  useEffect(() => {
+    attachmentReadRef.current += 1
+    setReadingAttachments(false)
+    if (!attachmentsEnabled) {
+      setAttachments([])
+      setAttachmentError(null)
+      setReadingAttachments(false)
+    }
+    else if (!imagesEnabled) setAttachments(current => current.filter(file => file.kind !== 'image'))
+    return () => { attachmentReadRef.current += 1 }
+  }, [attachmentsEnabled, imagesEnabled])

  const submit = (): void => {
-    const content = draft.trim()
+    const content = draft.trim() || (attachments.some(file => file.kind === 'image') ? t('첨부 이미지를 분석해주세요.') : '')
    if (busy) {
      onStop()
      return
    }
-    if (!content || disabled) return
+    if (!content || disabled || readingAttachments) return
    setDraft('')
-    onSubmit(content)
+    onSubmit(content, attachmentsEnabled ? attachments : undefined)
+    setAttachments([])
+    setAttachmentError(null)
  }

  return (
-    <div className={['m-3 rounded-lg border p-2', dark ? 'border-white/10 bg-[#202020]' : 'border-[#d8dee9] bg-white'].join(' ')}>
+    <div className={['m-3 shrink-0 rounded-lg border p-2', dark ? 'border-white/10 bg-[#202020]' : 'border-[#d8dee9] bg-white'].join(' ')} onDragOver={event => { if (attachmentsEnabled && event.dataTransfer.types.includes('Files')) event.preventDefault() }} onDrop={event => { if (!attachmentsEnabled) return; event.preventDefault(); attachFiles(Array.from(event.dataTransfer.files)) }}>
      <div className={['flex min-h-[56px] items-stretch overflow-hidden rounded-md pl-3 text-[12px]', dark ? 'bg-[#252525]' : 'bg-[#f8f9fc]'].join(' ')}>
        <textarea
+          ref={textareaRef}
          rows={2}
+          spellCheck={false}
+          autoCorrect="off"
          value={draft}
          onChange={(event) => setDraft(event.target.value)}
+          onPaste={event => { if (attachmentsEnabled && event.clipboardData.files.length) { event.preventDefault(); attachFiles(Array.from(event.clipboardData.files)) } }}
+          onContextMenu={(event) => {
+            event.preventDefault()
+            event.stopPropagation()
+            const input = event.currentTarget
+            setContextMenu({
+              kind: 'input',
+              x: event.clientX,
+              y: event.clientY,
+              text: input.value.slice(input.selectionStart, input.selectionEnd),
+              input,
+              selectionStart: input.selectionStart,
+              selectionEnd: input.selectionEnd
+            })
+          }}
          onKeyDown={(event) => {
-            if (event.key === 'Enter' && !event.shiftKey) {
+            if (event.key === 'Enter' && !event.shiftKey && !event.nativeEvent.isComposing) {
              event.preventDefault()
              submit()
            }
          }}
-          placeholder="질문하세요..."
+          placeholder={t("질문하세요...")}
          className={[
-            'min-h-[56px] min-w-0 flex-1 resize-none bg-transparent py-2.5 pr-3 text-[12px] font-medium leading-relaxed outline-none placeholder:font-medium',
+            'box-border min-h-[56px] min-w-0 flex-1 self-start resize-none overflow-y-hidden bg-transparent py-2.5 pr-3 text-[12px] font-medium leading-relaxed outline-none placeholder:font-medium',
            dark ? 'text-white/80 placeholder:text-white/40' : 'text-[#111520] placeholder:text-[#727b8c]'
          ].join(' ')}
        />
        <button
          type="button"
+          aria-label={busy ? t('중지') : t('전송')}
          disabled={!canSubmit}
          onClick={busy ? onStop : submit}
          className={[
@@ -291,6 +439,43 @@ export const QaInputBox = memo(function QaInputBox({
          {busy ? <Square size={13} fill="currentColor" /> : <Send size={14} />}
        </button>
      </div>
+      <ChatTextContextMenu dark={dark} menu={contextMenu} onClose={() => setContextMenu(null)} onPasteText={(text, menu) => {
+        const start = menu.selectionStart ?? draft.length
+        const end = menu.selectionEnd ?? start
+        setDraft(current => current.slice(0, start) + text + current.slice(end))
+        window.requestAnimationFrame(() => textareaRef.current?.setSelectionRange(start + text.length, start + text.length))
+      }} />
+      {attachmentsEnabled && attachments.some(file => file.kind !== 'image') && (
+        <div className="flex flex-wrap gap-1.5 pt-2">
+          {attachments.map((file, index) => file.kind === 'image' ? null : (
+            <span key={`${file.name}-${index}`} className={['inline-flex min-w-0 max-w-full items-center gap-1 rounded border px-2 py-1 text-[11px]', dark ? 'border-white/10 text-white/70' : 'border-[#d8dee9] text-[#475569]'].join(' ')}>
+              <Paperclip size={12} className="shrink-0" />
+              <span className="min-w-0 truncate" title={file.name}>{file.name}</span>
+              <button type="button" disabled={busy || readingAttachments} title={t('첨부 제거')} aria-label={`${t('첨부 제거')}: ${file.name}`} onClick={() => setAttachments((current) => current.filter((_, item) => item !== index))} className="grid size-5 shrink-0 cursor-pointer place-items-center rounded hover:bg-white/10 disabled:cursor-default disabled:opacity-40"><X size={12} /></button>
+            </span>
+          ))}
+        </div>
+      )}
+      <ChatImageAttachments dark={dark} images={attachments.flatMap(file => file.kind === 'image' ? [{ name: file.name, url: file.previewUrl }] : [])} removeDisabled={busy || readingAttachments} onRemove={image => setAttachments(current => current.filter(file => file.kind !== 'image' || file.previewUrl !== image.url))} />
+      {attachmentError && <p role="alert" className="break-words pt-2 text-[11px] text-[#ef4444]">{t(attachmentError)}</p>}
+      {(attachmentsEnabled || onClearConversation || footerAction) && (
+        <div className={['flex h-9 min-w-0 items-center gap-1 pt-1', dark ? 'text-white/50' : 'text-[#64748b]'].join(' ')}>
+          {footerAction}
+          {attachmentsEnabled && (
+            <>
+              <input ref={fileInputRef} type="file" multiple accept={[CHAT_ATTACHMENT_ACCEPT, ...(imagesEnabled ? [CHAT_IMAGE_ACCEPT] : [])].join(',')} className="hidden" aria-label={t('파일 첨부')} onChange={(event) => {
+                const files = Array.from(event.currentTarget.files ?? [])
+                event.currentTarget.value = ''
+                attachFiles(files)
+              }} />
+              <button type="button" title={t('파일 첨부')} aria-label={t('파일 첨부')} disabled={disabled || busy || readingAttachments} onClick={() => fileInputRef.current?.click()} className="grid size-7 cursor-pointer place-items-center rounded transition hover:bg-white/10 disabled:cursor-default disabled:opacity-35"><Paperclip size={15} className={readingAttachments ? 'animate-pulse' : ''} /></button>
+            </>
+          )}
+          {onClearConversation && (
+            <button type="button" title={t('대화내역 삭제')} aria-label={t('대화내역 삭제')} disabled={clearDisabled || busy || readingAttachments} onClick={onClearConversation} className="grid size-7 cursor-pointer place-items-center rounded transition hover:bg-white/10 hover:text-[#ef4444] disabled:cursor-default disabled:opacity-35"><Trash2 size={15} /></button>
+          )}
+        </div>
+      )}
    </div>
  )
 })
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../i18n'
 import { Check, Copy, ExternalLink, RefreshCw, X } from 'lucide-react'
 import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
@@ -15,6 +16,7 @@ const messages = {
 }

 export default function DockerSetupNotice(): React.JSX.Element | null {
+  useLocaleRender()
  const [result, setResult] = useState<DockerResult | null>(null)
  const [dismissed, setDismissed] = useState(() => {
    try {
@@ -87,36 +89,35 @@ export default function DockerSetupNotice(): React.JSX.Element | null {
    <dialog ref={dialogRef} aria-labelledby="docker-setup-title" onCancel={() => setDismissed(true)}
      className="fixed inset-0 m-auto max-h-[calc(100dvh-32px)] w-[520px] max-w-[calc(100vw-32px)] overflow-y-auto rounded-lg border border-white/10 bg-[#252525] p-0 text-white shadow-2xl backdrop:bg-black/60">
      <header className="flex items-center justify-between border-b border-white/10 px-5 py-3">
-        <h2 id="docker-setup-title" className="text-[14px] font-bold">로컬 Docker 설정</h2>
-        <button type="button" autoFocus title="나중에" aria-label="나중에" onClick={() => setDismissed(true)} className="flex h-7 w-7 cursor-pointer items-center justify-center rounded hover:bg-white/10"><X size={16} /></button>
+        <h2 id="docker-setup-title" className="text-[14px] font-bold">{t("로컬 Docker 설정")}</h2>
+        <button type="button" autoFocus title={t("나중에")} aria-label={t("나중에")} onClick={() => setDismissed(true)} className="flex h-7 w-7 cursor-pointer items-center justify-center rounded hover:bg-white/10"><X size={16} /></button>
      </header>
      <div className="space-y-4 px-5 py-4 text-[13px] leading-relaxed">
-        <p className="font-semibold">{messages[result.status]}</p>
-        <p className="text-white/65">Docker 없이도 LMS와 원격 플랫폼을 사용할 수 있습니다. 로컬 모듈 빌드와 실행에는 Docker가 필요합니다.</p>
+        <p className="font-semibold">{t(messages[result.status])}</p>
+        <p className="text-white/65">{t("Docker 없이도 LMS와 원격 플랫폼을 사용할 수 있습니다. 로컬 모듈 빌드와 실행에는 Docker가 필요합니다.")}</p>
        {result.status === 'missing' ? (
-          <p>공식 설치 안내에서 운영체제를 선택해 Docker를 설치한 뒤 다시 확인해주세요. Ubuntu에서는 Docker Engine의 apt 저장소 설치 방법을 사용할 수 있습니다.</p>
+          <p>{t("공식 설치 안내에서 운영체제를 선택해 Docker를 설치한 뒤 다시 확인해주세요. Ubuntu에서는 Docker Engine의 apt 저장소 설치 방법을 사용할 수 있습니다.")}</p>
        ) : <>
-          {linux && result.status === 'permission' && <p>일반 Docker Engine 사용 시 아래 명령으로 권한을 추가한 뒤 OS에서 로그아웃하고 다시 로그인해주세요. Docker 그룹은 관리자 수준의 권한을 부여합니다. Rootless Docker나 별도 Docker 컨텍스트를 사용한다면 연결 설정부터 확인해주세요.</p>}
-          {linux && result.status === 'unavailable' && <p>일반 Docker Engine은 아래 명령으로 서비스를 시작할 수 있습니다. Docker Desktop이나 Rootless Docker 사용 시 해당 서비스를 실행하고 Docker 컨텍스트를 확인해주세요.</p>}
+          {linux && result.status === 'permission' && <p>{t("일반 Docker Engine 사용 시 아래 명령으로 권한을 추가한 뒤 OS에서 로그아웃하고 다시 로그인해주세요. Docker 그룹은 관리자 수준의 권한을 부여합니다. Rootless Docker나 별도 Docker 컨텍스트를 사용한다면 연결 설정부터 확인해주세요.")}</p>}
+          {linux && result.status === 'unavailable' && <p>{t("일반 Docker Engine은 아래 명령으로 서비스를 시작할 수 있습니다. Docker Desktop이나 Rootless Docker 사용 시 해당 서비스를 실행하고 Docker 컨텍스트를 확인해주세요.")}</p>}
          <div className="relative rounded-md bg-black/25 p-3 pr-12">
            <pre className="whitespace-pre-wrap break-all text-[12px]">{command}</pre>
-            <button type="button" title={copied ? '복사됨' : '명령어 복사'} aria-label={copied ? '복사됨' : '명령어 복사'}
+            <button type="button" title={copied ? t("복사됨") : t("명령어 복사")} aria-label={copied ? t("복사됨") : t("명령어 복사")}
              className="absolute right-2 top-2 flex h-8 w-8 cursor-pointer items-center justify-center rounded hover:bg-white/10"
-              onClick={() => { void navigator.clipboard.writeText(command).then(() => { setCopied(true); setActionError('') }).catch(() => setActionError('복사하지 못했습니다. 명령어를 직접 선택해 복사해주세요.')) }}>
+              onClick={() => { void navigator.clipboard.writeText(command).then(() => { setCopied(true); setActionError('') }).catch(() => setActionError(t("복사하지 못했습니다. 명령어를 직접 선택해 복사해주세요."))) }}>
              {copied ? <Check size={16} /> : <Copy size={16} />}
            </button>
          </div>
        </>}
        <button type="button" className="inline-flex cursor-pointer items-center gap-2 text-[#9dbdff] hover:underline"
-          onClick={() => { void window.localWorkspace.docker.openGuide().catch(() => setActionError('설치 안내: https://docs.docker.com/engine/install/')) }}>
-          <ExternalLink size={14} />Docker 공식 설치 안내
-        </button>
-        {actionError && <p role="status" className="break-words text-[#f2b86b]">{actionError}</p>}
+          onClick={() => { void window.localWorkspace.docker.openGuide().catch(() => setActionError(t("설치 안내: https://docs.docker.com/engine/install/"))) }}>
+          <ExternalLink size={14} />{t("Docker 공식 설치 안내")}</button>
+        {actionError && <p role="status" className="break-words text-[#f2b86b]">{t(actionError || '')}</p>}
      </div>
      <footer className="flex justify-end gap-2 border-t border-white/10 px-5 py-3">
-        <button type="button" onClick={() => setDismissed(true)} className="h-8 cursor-pointer rounded-md border border-white/20 px-3 text-[12px] hover:bg-white/10">나중에</button>
+        <button type="button" onClick={() => setDismissed(true)} className="h-8 cursor-pointer rounded-md border border-white/20 px-3 text-[12px] hover:bg-white/10">{t("나중에")}</button>
        <button type="button" disabled={busy} onClick={() => void retry()} className="flex h-8 cursor-pointer items-center gap-2 rounded-md bg-[#2563eb] px-3 text-[12px] disabled:cursor-wait disabled:opacity-50 hover:bg-[#1d4ed8]">
-          <RefreshCw size={14} className={busy ? 'animate-spin' : ''} />{busy ? '확인 중' : '다시 확인'}
+          <RefreshCw size={14} className={busy ? 'animate-spin' : ''} />{busy ? t("확인 중") : t("다시 확인")}
        </button>
      </footer>
    </dialog>, document.body,
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../i18n'
 import type React from 'react'

 type PlatformLoadingOverlayProps = {
@@ -11,14 +12,15 @@ export default function PlatformLoadingOverlay({
  description,
  className = 'absolute inset-0 z-[60]'
 }: PlatformLoadingOverlayProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className={`${className} grid place-items-center bg-[#080a10]/55 p-6 backdrop-blur-[1px]`}>
      <div className="w-[390px] rounded-xl border border-white/10 bg-[#171a22] px-9 py-8 text-center shadow-[0_20px_50px_rgba(8,10,16,0.35)]">
        <div className="py-2">
          <div className="mx-auto h-10 w-10 animate-spin rounded-full border-4 border-white/25 border-t-white" />
        </div>
-        <strong className="mt-5 block text-[16px] font-bold text-white">{title}</strong>
-        <p className="mt-3 text-[13px] font-medium leading-relaxed text-white/60">{description}</p>
+        <strong className="mt-5 block text-[16px] font-bold text-white">{t(title)}</strong>
+        <p className="mt-3 text-[13px] font-medium leading-relaxed text-white/60">{t(description)}</p>
      </div>
    </div>
  )
@@ -0,0 +1,80 @@
+import type React from 'react'
+import { useEffect, useMemo, useState } from 'react'
+import { ExpandableMarkdownMessage, MarkdownMessage } from './ChatWidgets'
+import { AGENT_REVEAL_INTERVAL, agentRevealFrame, createAgentRevealDocument } from './agentResponseReveal'
+
+type ResponseMessage = {
+  content: string
+  revealStartedAt?: number
+  plan?: { summary: string; explanation: string }
+  provider?: string
+  model?: string
+}
+
+export function ProgressiveChatResponse({ message, dark, children, footerAction, collapseOnSignal = false, collapseSignal = 0, defaultCollapsed = message.revealStartedAt === undefined }: {
+  message: ResponseMessage
+  dark: boolean
+  children?: React.ReactNode
+  footerAction?: React.ReactNode
+  collapseOnSignal?: boolean
+  collapseSignal?: number
+  defaultCollapsed?: boolean
+}): React.JSX.Element {
+  const content = message.plan?.explanation ?? message.content
+  const modelLabel = message.provider === 'A_COPILOT' ? 'A-Copilot' : [message.provider, message.model].filter(Boolean).join(' · ')
+  const document = useMemo(() => createAgentRevealDocument(content), [content])
+  const [now, setNow] = useState(Date.now)
+  const [reducedMotion, setReducedMotion] = useState(() => typeof window !== 'undefined' && window.matchMedia('(prefers-reduced-motion: reduce)').matches)
+  const frame = agentRevealFrame(document, message.revealStartedAt, now, reducedMotion)
+
+  useEffect(() => {
+    const media = window.matchMedia('(prefers-reduced-motion: reduce)')
+    const update = (): void => setReducedMotion(media.matches)
+    media.addEventListener('change', update)
+    return () => media.removeEventListener('change', update)
+  }, [])
+
+  useEffect(() => {
+    if (message.revealStartedAt === undefined || reducedMotion) return
+    let timer: ReturnType<typeof setTimeout> | undefined
+    const startedAt = message.revealStartedAt
+    const tick = (): void => {
+      const current = Date.now()
+      setNow(current)
+      const remaining = frame.duration - (current - startedAt)
+      if (remaining > 0) timer = setTimeout(tick, Math.min(AGENT_REVEAL_INTERVAL, remaining))
+    }
+    tick()
+    return () => clearTimeout(timer)
+  }, [frame.duration, message.revealStartedAt, reducedMotion])
+
+  return (
+    <div className="grid min-w-0 max-w-full gap-3" aria-busy={!frame.complete}>
+      <div className="min-w-0">
+        {message.plan && (
+          <div className={['font-black', frame.fadeFrom === 0 ? 'agent-response-fade' : ''].join(' ')}>
+            <MarkdownMessage content={message.plan.summary} dark={dark} />
+          </div>
+        )}
+        <div className={message.plan ? 'mt-1 min-w-0' : 'min-w-0'}>
+          {frame.complete && frame.fadeFrom === undefined ? (
+            <ExpandableMarkdownMessage
+              content={content}
+              dark={dark}
+              defaultCollapsed={defaultCollapsed}
+              collapseOnSignal={collapseOnSignal}
+              collapseSignal={collapseSignal}
+            />
+          ) : <MarkdownMessage content={frame.content} dark={dark} fadeFrom={frame.fadeFrom} />}
+        </div>
+      </div>
+      {frame.complete ? children : null}
+      {frame.complete && (modelLabel || footerAction) ? (
+        <div className="order-10 flex min-h-6 min-w-0 items-center justify-between gap-2">
+          <p title={modelLabel || undefined} className={['min-w-0 flex-1 truncate text-[10px]', dark ? 'text-white/35' : 'text-[#94a3b8]'].join(' ')}>{modelLabel}</p>
+          {footerAction}
+        </div>
+      ) : null}
+    </div>
+  )
+}
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../i18n'
 import { Activity, BookOpen, Bot, LayoutDashboard, Menu, Power } from 'lucide-react'
 import { useEffect, useRef, useState } from 'react'

@@ -36,6 +37,7 @@ export default function Sidebar({
  onDisconnectSession?: (sessionId?: string) => void
  onReleaseControl?: () => void
 }): React.JSX.Element {
+  useLocaleRender()
  const [sessionPopoverOpen, setSessionPopoverOpen] = useState(false)
  const sessionPopoverRef = useRef<HTMLDivElement>(null)
  const visibleRunningSessions = sessionStatus === 'running' && runningSessions.length ? runningSessions : []
@@ -110,7 +112,7 @@ export default function Sidebar({
                <Icon size={18} />
                {collapsed && (
                  <span className="pointer-events-none absolute left-[46px] top-1/2 z-50 hidden -translate-y-1/2 whitespace-nowrap rounded-md border border-white/10 bg-[#303030] px-2 py-1 text-[11px] font-semibold text-white/78 shadow-[0_10px_24px_rgba(0,0,0,0.24)] group-hover:block">
-                    {disabled ? '강좌 선택 후 이동 가능' : item.label}
+                    {disabled ? t("강좌 선택 후 이동 가능") : t(item.label)}
                  </span>
                )}
                <span
@@ -119,7 +121,7 @@ export default function Sidebar({
                  collapsed ? 'pointer-events-none w-0 opacity-0' : 'w-[132px] opacity-100 delay-100'
                ].join(' ')}
              >
-                {item.label}
+                {t(item.label)}
              </span>
            </button>
          )
@@ -148,13 +150,13 @@ export default function Sidebar({
                    {(session.startedAt || session.endsAt) && (
                      <span className="mt-1 block truncate text-[11px] text-white/38">
                        {[
-                          session.startedAt ? `시작 ${session.startedAt}` : null,
-                          session.endsAt ? `종료 ${session.endsAt}` : null
+                          session.startedAt ? t("시작 {{v0}}", { v0: session.startedAt }) : null,
+                          session.endsAt ? t("종료 {{v0}}", { v0: session.endsAt }) : null
                        ].filter(Boolean).join(' · ')}
                      </span>
                    )}
                    {session.runningModuleCount !== undefined && (
-                      <span className="mt-0.5 block truncate text-[11px] text-white/38">실행 중인 모듈 {session.runningModuleCount}개</span>
+                      <span className="mt-0.5 block truncate text-[11px] text-white/38">{t('실행 중인 모듈 {{count}}개', { count: session.runningModuleCount })}</span>
                    )}
                  </span>
                </button>
@@ -166,8 +168,8 @@ export default function Sidebar({
                      event.stopPropagation()
                      onDisconnectSession?.(session.id)
                    }}
-                    aria-label="세션 연결종료"
-                    title="연결종료"
+                    aria-label={t("세션 연결종료")}
+                    title={t("연결종료")}
                  >
                    <Power size={15} />
                  </button>
@@ -207,13 +209,13 @@ export default function Sidebar({
                      {(session.startedAt || session.endsAt) && (
                        <span className="mt-1 block truncate text-[11px] text-white/38">
                          {[
-                            session.startedAt ? `시작 ${session.startedAt}` : null,
-                            session.endsAt ? `종료 ${session.endsAt}` : null
+                            session.startedAt ? t("시작 {{v0}}", { v0: session.startedAt }) : null,
+                            session.endsAt ? t("종료 {{v0}}", { v0: session.endsAt }) : null
                          ].filter(Boolean).join(' · ')}
                        </span>
                      )}
                      {session.runningModuleCount !== undefined && (
-                        <span className="mt-0.5 block truncate text-[11px] text-white/38">실행 중인 모듈 {session.runningModuleCount}개</span>
+                        <span className="mt-0.5 block truncate text-[11px] text-white/38">{t('실행 중인 모듈 {{count}}개', { count: session.runningModuleCount })}</span>
                      )}
                    </span>
                  </button>
@@ -226,8 +228,8 @@ export default function Sidebar({
                        setSessionPopoverOpen(false)
                        onDisconnectSession?.(session.id)
                      }}
-                      aria-label="세션 연결종료"
-                      title="연결종료"
+                      aria-label={t("세션 연결종료")}
+                      title={t("연결종료")}
                    >
                      <Power size={15} />
                    </button>
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../i18n'
 import icon from '/assets/icon.png'
 import { Bell, BookOpen, Bug, Building2, CheckCheck, ChevronLeft, ChevronRight, Clipboard, HelpCircle, LogOut, Minus, RotateCw, ScrollText, Search, Square, Wrench, X } from 'lucide-react'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
@@ -127,6 +128,7 @@ const normalizeNotification = (notification: NotificationMessage): NotificationM
 })

 export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCourseSelection, transientNotice = null }: TitleBarProps): React.JSX.Element {
+  useLocaleRender()
  const [notificationOpen, setNotificationOpen] = useState(false)
  const [accountOpen, setAccountOpen] = useState(false)
  const [toolsOpen, setToolsOpen] = useState(false)
@@ -524,7 +526,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
  return (
    <>
      <header
-        className="relative z-[10020] flex h-[38px] shrink-0 items-center justify-between rounded-t-[18px] bg-[#111520] px-3 pl-5"
+        className="relative z-[10020] flex h-[38px] shrink-0 items-center justify-between bg-[#111520] px-3 pl-5"
        style={{ WebkitAppRegion: 'drag' } as React.CSSProperties}
        onContextMenuCapture={suppressTitlebarContextMenu}
        onContextMenu={suppressTitlebarContextMenu}
@@ -555,19 +557,19 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
          ].join(' ')}
        >
          <span className="block whitespace-nowrap px-3 text-[11px] font-bold">
-            {activeTransientNotice?.title}
+            {t(activeTransientNotice?.title ?? '')}
          </span>
        </div>
-        <Tooltip label="도움말">
+        <Tooltip label={t("도움말")}>
          <button type="button" aria-label="Help" onClick={onHelpClick} className={winButton}>
            <HelpCircle size={16} />
          </button>
        </Tooltip>
        <div className="relative" ref={toolsRef}>
-          <Tooltip label="도구 보기" disabled={toolsOpen}>
+          <Tooltip label={t("도구 보기")} disabled={toolsOpen}>
            <button
              type="button"
-              aria-label="도구 보기"
+              aria-label={t("도구 보기")}
              aria-expanded={toolsOpen}
              onClick={() => {
                setToolsOpen((current) => !current)
@@ -586,9 +588,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                className="flex w-full items-center gap-2 rounded-md px-2.5 py-2 text-left text-[12px] font-medium text-white/75 transition hover:bg-white/[0.08] hover:text-white"
                onClick={() => window.location.reload()}
              >
-                <RotateCw size={15} />
-                새로고침
-              </button>
+                <RotateCw size={15} />{t("새로고침")}</button>
              <button
                type="button"
                className="flex w-full items-center gap-2 rounded-md px-2.5 py-2 text-left text-[12px] font-medium text-white/75 transition hover:bg-white/[0.08] hover:text-white"
@@ -598,9 +598,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                  void loadAppLogs()
                }}
              >
-                <ScrollText size={15} />
-                앱 로그
-              </button>
+                <ScrollText size={15} />{t("앱 로그")}</button>
              <button
                type="button"
                className="flex w-full items-center gap-2 rounded-md px-2.5 py-2 text-left text-[12px] font-medium text-white/75 transition hover:bg-white/[0.08] hover:text-white"
@@ -611,14 +609,12 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                  }).catch((error) => console.error('[titlebar] open DevTools request failed:', error))
                }}
              >
-                <Bug size={15} />
-                개발자 도구
-              </button>
+                <Bug size={15} />{t("개발자 도구")}</button>
            </div>
          ) : null}
        </div>
        <div className="relative" ref={notificationRef}>
-          <Tooltip label="알림" disabled={notificationOpen}>
+          <Tooltip label={t("알림")} disabled={notificationOpen}>
            <button
              type="button"
              aria-label="Notifications"
@@ -635,10 +631,10 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
            <div className="absolute right-0 top-[34px] z-50 w-[360px] overflow-hidden rounded-xl border border-white/10 bg-[rgba(18,23,35,0.94)] text-white shadow-[0_22px_70px_rgba(0,0,0,0.48)] backdrop-blur-xl">
              <div className="border-b border-white/10 px-4 py-3">
                <div>
-                  <p className="text-[13px] font-bold text-white">알림</p>
+                  <p className="text-[13px] font-bold text-white">{t("알림")}</p>
                </div>
                <div className="mt-3 flex items-center justify-between gap-3">
-                  <span className="text-[11px] font-semibold text-white/45">안읽음 {unreadCount}건</span>
+                  <span className="text-[11px] font-semibold text-white/45">{t('안읽음 {{count}}건', { count: unreadCount })}</span>
                  <div className="flex items-center gap-2">
                    <button
                      type="button"
@@ -646,16 +642,12 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                      disabled={unreadCount === 0}
                      className="inline-flex h-7 cursor-pointer items-center gap-1.5 rounded-md border border-white/10 px-2.5 text-[11px] font-semibold text-white/65 transition-colors hover:bg-white/[0.06] hover:text-white disabled:cursor-default disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-white/65"
                    >
-                      <CheckCheck size={13} />
-                      모두 읽음
-                    </button>
+                      <CheckCheck size={13} />{t("모두 읽음")}</button>
                    <button
                      type="button"
                      onClick={handleOpenNotificationModal}
                      className="h-7 cursor-pointer rounded-md border border-[#3b7ffa]/30 bg-[#3b7ffa]/12 px-2.5 text-[11px] font-semibold text-[#9ec2ff] transition-colors hover:bg-[#3b7ffa]/20 hover:text-white"
-                    >
-                      전체 보기
-                    </button>
+                    >{t("전체 보기")}</button>
                  </div>
                </div>
              </div>
@@ -680,7 +672,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                              notification.read ? 'bg-white/[0.025] text-white/24' : 'bg-[#2563eb]/15 text-[#7db3ff]'
                            ].join(' ')}
                          >
-                            {notification.categoryLabel ?? notification.category}
+                            {t(notification.categoryLabel ?? notification.category)}
                          </span>
                        </div>
                        <span className={`shrink-0 text-[11px] font-semibold ${notification.read ? 'text-white/22' : 'text-white/45'}`}>
@@ -688,16 +680,16 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                        </span>
                      </div>
                      <p className={`text-[13px] leading-5 ${notification.read ? 'font-medium text-white/30' : 'font-bold text-white/90'}`}>
-                        {notification.title}
+                        {notification.id.startsWith('local-') ? t(notification.title) : notification.title}
                      </p>
                      <p className={`mt-1 text-[12px] font-medium leading-5 ${notification.read ? 'text-white/24' : 'text-white/58'}`}>
-                        {notification.body}
+                        {notification.id.startsWith('local-') ? t(notification.body) : notification.body}
                      </p>
                    </button>
                  ))
                ) : (
                  <div className="px-4 py-8 text-center">
-                    <p className="text-[13px] font-semibold text-white/50">표시할 알림이 없습니다.</p>
+                    <p className="text-[13px] font-semibold text-white/50">{t("표시할 알림이 없습니다.")}</p>
                  </div>
                )}
              </div>
@@ -763,18 +755,14 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                    onClick={handleOpenCourseSelection}
                    className="flex w-full cursor-pointer items-center gap-2 px-4 py-2.5 text-left text-[12px] text-white/62 transition-colors hover:bg-white/[0.06] hover:text-white"
                  >
-                    <BookOpen size={14} />
-                    강좌 선택
-                  </button>
+                    <BookOpen size={14} />{t("강좌 선택")}</button>
                ) : null}
                <button
                  type="button"
                  onClick={handleLogout}
                  className="flex w-full cursor-pointer items-center gap-2 px-4 py-2.5 text-left text-[12px] text-white/62 transition-colors hover:bg-white/[0.06] hover:text-white"
                >
-                  <LogOut size={14} />
-                  종료
-                </button>
+                  <LogOut size={14} />{t("종료")}</button>
              </div>
            </div>
          ) : null}
@@ -849,14 +837,14 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
          <section className="flex h-[540px] w-full max-w-[680px] flex-col overflow-hidden rounded-xl border border-[rgba(255,255,255,0.15)] bg-[rgba(14,18,28,0.88)] text-white shadow-[0_24px_80px_rgba(0,0,0,0.56),inset_0_1px_0_rgba(255,255,255,0.08)] backdrop-blur-2xl">
            <header className="flex h-[70px] shrink-0 items-center justify-between px-5">
              <div>
-                <h2 className="text-[16px] font-bold text-white/90">전체 알림</h2>
-                <p className="mt-1 text-[11px] font-medium text-white/42">알림은 최대 하루동안만 저장됩니다.</p>
+                <h2 className="text-[16px] font-bold text-white/90">{t("전체 알림")}</h2>
+                <p className="mt-1 text-[11px] font-medium text-white/42">{t("알림은 최대 하루동안만 저장됩니다.")}</p>
              </div>
              <button
                type="button"
                onClick={() => setNotificationModalOpen(false)}
                className="grid h-8 w-8 cursor-pointer place-items-center rounded-md text-white/55 transition-colors hover:bg-white/[0.06] hover:text-white"
-                aria-label="닫기"
+                aria-label={t("닫기")}
              >
                <X size={18} />
              </button>
@@ -869,7 +857,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                  <input
                    value={notificationQuery}
                    onChange={(event) => setNotificationQuery(event.target.value)}
-                    placeholder="알림 검색"
+                    placeholder={t("알림 검색")}
                    className="h-9 w-full rounded-md border border-white/10 bg-white/[0.045] pl-9 pr-3 text-[13px] font-medium text-white outline-none placeholder:text-white/28 transition-colors focus:border-[#3b7ffa]/55 focus:bg-white/[0.065]"
                  />
                </div>
@@ -879,9 +867,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                  disabled={unreadCount === 0}
                  className="inline-flex h-9 shrink-0 cursor-pointer items-center gap-1.5 rounded-md border border-white/10 px-3 text-[12px] font-semibold text-white/68 transition-colors hover:bg-white/[0.06] hover:text-white disabled:cursor-default disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-white/68"
                >
-                  <CheckCheck size={14} />
-                  모두 읽음
-                </button>
+                  <CheckCheck size={14} />{t("모두 읽음")}</button>
              </div>

              <div className="mt-3 flex items-center justify-between">
@@ -896,11 +882,11 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                      notificationTab === tab ? 'bg-[#3b7ffa]/22 text-[#b9d4ff]' : 'text-white/45 hover:bg-white/[0.05] hover:text-white/70'
                    ].join(' ')}
                  >
-                    {tab === 'unread' ? `안 읽음 ${sortedNotifications.filter((notification) => !notification.read).length}` : `읽음 ${sortedNotifications.filter((notification) => notification.read).length}`}
+                    {tab === 'unread' ? t("안 읽음 {{v0}}", { v0: sortedNotifications.filter((notification) => !notification.read).length }) : t("읽음 {{v0}}", { v0: sortedNotifications.filter((notification) => notification.read).length })}
                  </button>
                ))}
                </div>
-                <span className="text-[11px] font-semibold text-white/32">{filteredModalNotifications.length}건</span>
+                <span className="text-[11px] font-semibold text-white/32">{filteredModalNotifications.length}{t("건")}</span>
              </div>
            </div>

@@ -926,7 +912,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                              notification.read ? 'bg-white/[0.025] text-white/24' : 'bg-[#2563eb]/15 text-[#7db3ff]'
                            ].join(' ')}
                          >
-                            {notification.categoryLabel ?? notification.category}
+                            {t(notification.categoryLabel ?? notification.category)}
                          </span>
                        </div>
                        <span className={`shrink-0 text-[11px] font-semibold ${notification.read ? 'text-white/22' : 'text-white/45'}`}>
@@ -934,17 +920,17 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                        </span>
                      </div>
                      <h3 className={`text-[13px] leading-5 ${notification.read ? 'font-medium text-white/30' : 'font-bold text-white/90'}`}>
-                        {notification.title}
+                        {notification.id.startsWith('local-') ? t(notification.title) : notification.title}
                      </h3>
                      <p className={`mt-1 text-[12px] font-medium leading-5 ${notification.read ? 'text-white/24' : 'text-white/58'}`}>
-                        {notification.body}
+                        {notification.id.startsWith('local-') ? t(notification.body) : notification.body}
                      </p>
                    </button>
                  ))}
                </div>
              ) : (
                <div className="flex h-full items-center justify-center rounded-lg border border-white/10 bg-white/[0.025]">
-                  <p className="text-[13px] font-semibold text-white/48">표시할 알림이 없습니다.</p>
+                  <p className="text-[13px] font-semibold text-white/48">{t("표시할 알림이 없습니다.")}</p>
                </div>
              )}
            </div>
@@ -959,7 +945,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                  onClick={() => setNotificationPage((page) => Math.max(1, page - 1))}
                  disabled={notificationPage <= 1}
                  className="grid h-8 w-8 cursor-pointer place-items-center rounded-md border border-white/10 text-white/55 transition-colors hover:bg-white/[0.06] hover:text-white disabled:cursor-default disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-white/55"
-                  aria-label="이전 페이지"
+                  aria-label={t("이전 페이지")}
                >
                  <ChevronLeft size={16} />
                </button>
@@ -968,7 +954,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                  onClick={() => setNotificationPage((page) => Math.min(modalTotalPages, page + 1))}
                  disabled={notificationPage >= modalTotalPages}
                  className="grid h-8 w-8 cursor-pointer place-items-center rounded-md border border-white/10 text-white/55 transition-colors hover:bg-white/[0.06] hover:text-white disabled:cursor-default disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-white/55"
-                  aria-label="다음 페이지"
+                  aria-label={t("다음 페이지")}
                >
                  <ChevronRight size={16} />
                </button>
@@ -986,29 +972,27 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
          <section className="flex h-[min(680px,calc(100vh-100px))] w-[min(920px,calc(100vw-80px))] flex-col overflow-hidden rounded-lg border border-white/12 bg-[#171a21] shadow-[0_28px_90px_rgba(0,0,0,0.58)]">
            <header className="flex h-[52px] shrink-0 items-center justify-between border-b border-white/10 px-5">
              <div className="min-w-0">
-                <h2 className="text-[14px] font-bold text-white/92">앱 로그</h2>
-                <p className="mt-0.5 truncate text-[11px] font-medium text-white/42">{appLogPath || '로그 파일을 불러오는 중입니다.'}</p>
+                <h2 className="text-[14px] font-bold text-white/92">{t("앱 로그")}</h2>
+                <p className="mt-0.5 truncate text-[11px] font-medium text-white/42">{appLogPath || t("로그 파일을 불러오는 중입니다.")}</p>
              </div>
              <button
                type="button"
                onClick={() => setAppLogsOpen(false)}
                className="grid h-8 w-8 cursor-pointer place-items-center rounded-md text-white/55 transition-colors hover:bg-white/[0.06] hover:text-white"
-                aria-label="앱 로그 닫기"
+                aria-label={t("앱 로그 닫기")}
              >
                <X size={18} />
              </button>
            </header>
            <div className="min-h-0 flex-1 bg-[#101217] p-4">
              {appLogsLoading ? (
-                <div className="flex h-full items-center justify-center text-[13px] font-medium text-white/48">로그를 불러오는 중입니다.</div>
+                <div className="flex h-full items-center justify-center text-[13px] font-medium text-white/48">{t("로그를 불러오는 중입니다.")}</div>
              ) : appLogContent ? (
                <pre className="h-full overflow-auto whitespace-pre-wrap break-words rounded-md border border-white/[0.07] bg-black/20 p-3 font-mono text-[11px] leading-5 text-white/70">
                  {appLogDisplayContent}
                </pre>
              ) : (
-                <div className="flex h-full items-center justify-center rounded-md border border-dashed border-white/10 text-[13px] font-medium text-white/42">
-                  아직 기록된 앱 로그가 없습니다.
-                </div>
+                <div className="flex h-full items-center justify-center rounded-md border border-dashed border-white/10 text-[13px] font-medium text-white/42">{t("아직 기록된 앱 로그가 없습니다.")}</div>
              )}
            </div>
            <footer className="flex h-[58px] shrink-0 items-center justify-end gap-2 border-t border-white/10 px-5">
@@ -1019,7 +1003,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                className="flex h-8 cursor-pointer items-center gap-1.5 rounded-md border border-white/12 px-3 text-[12px] font-semibold text-white/65 transition hover:bg-white/[0.06] hover:text-white disabled:cursor-default disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-white/65"
              >
                <Clipboard size={14} />
-                {appLogsCopied ? '복사됨' : '복사'}
+                {appLogsCopied ? t("복사됨") : t("복사")}
              </button>
              <button
                type="button"
@@ -1027,9 +1011,7 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
                disabled={appLogsLoading}
                className="flex h-8 cursor-pointer items-center gap-1.5 rounded-md border border-white/12 px-3 text-[12px] font-semibold text-white/65 transition hover:bg-white/[0.06] hover:text-white disabled:cursor-default disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-white/65"
              >
-                <RotateCw size={14} className={appLogsLoading ? 'animate-spin' : ''} />
-                새로고침
-              </button>
+                <RotateCw size={14} className={appLogsLoading ? 'animate-spin' : ''} />{t("새로고침")}</button>
            </footer>
          </section>
        </div>
@@ -1052,23 +1034,19 @@ export default function TitleBar({ user, accessToken = '', onHelpClick, onOpenCo
              </button>
            </header>
            <div className="px-5 py-5">
-              <p className="text-[13px] leading-relaxed text-white/62">앱을 종료하시겠습니까?</p>
+              <p className="text-[13px] leading-relaxed text-white/62">{t("앱을 종료하시겠습니까?")}</p>
            </div>
            <footer className="flex h-[58px] items-center justify-end gap-2 px-5">
              <button
                type="button"
                onClick={() => setShowCloseConfirm(false)}
                className="cursor-pointer rounded-md border border-[rgba(255,255,255,0.12)] px-5 py-2 text-[12px] font-semibold text-white/62 transition-colors hover:bg-white/[0.06] hover:text-white"
-              >
-                취소
-              </button>
+              >{t("취소")}</button>
              <button
                type="button"
                onClick={handleConfirmClose}
                className="cursor-pointer rounded-md border border-red-400/35 bg-red-500/15 px-5 py-2 text-[12px] font-bold text-red-100 transition-colors hover:border-red-400/50 hover:bg-red-500/24"
-              >
-                종료
-              </button>
+              >{t("앱 종료")}</button>
            </footer>
          </div>
        </div>
@@ -0,0 +1,45 @@
+import { unified } from 'unified'
+import remarkParse from 'remark-parse'
+import remarkGfm from 'remark-gfm'
+
+const parser = unified().use(remarkParse).use(remarkGfm)
+export const AGENT_REVEAL_INTERVAL = 240
+export const AGENT_REVEAL_FADE_DURATION = 220
+
+export function createAgentRevealDocument(content: string) {
+  const tree = parser.parse(content)
+  const offsets: number[] = []
+  const definitions: string[] = []
+  for (const node of tree.children) {
+    if (node.type === 'definition' || node.type === 'footnoteDefinition') {
+      definitions.push(content.slice(node.position?.start.offset, node.position?.end.offset))
+      continue
+    }
+    const blocks = node.type === 'list' ? node.children : [node]
+    for (const block of blocks) {
+      if (block.position?.end.offset !== undefined) offsets.push(block.position.end.offset)
+    }
+  }
+  // Group unusually long answers without splitting Markdown blocks or list items.
+  const groupSize = Math.max(1, Math.ceil(offsets.length / 20))
+  const boundaries = offsets.filter((_, index) => (index + 1) % groupSize === 0 || index === offsets.length - 1)
+  if (boundaries.length) boundaries[boundaries.length - 1] = content.length
+  else boundaries.push(content.length)
+  return { content, boundaries, definitions: definitions.join('\n\n') }
+}
+
+export function agentRevealFrame(document: ReturnType<typeof createAgentRevealDocument>, startedAt: number | undefined, now: number, reducedMotion = false) {
+  const elapsed = startedAt === undefined ? Infinity : Math.max(0, now - startedAt)
+  const visible = reducedMotion ? document.boundaries.length : Math.min(document.boundaries.length, 1 + Math.floor(elapsed / AGENT_REVEAL_INTERVAL))
+  const complete = visible === document.boundaries.length
+  const end = document.boundaries[visible - 1]
+  const fadeFrom = !reducedMotion && elapsed < (visible - 1) * AGENT_REVEAL_INTERVAL + AGENT_REVEAL_FADE_DURATION
+    ? (visible > 1 ? document.boundaries[visible - 2] : 0)
+    : undefined
+  return {
+    content: complete ? document.content : document.content.slice(0, end) + (document.definitions ? `\n\n${document.definitions}` : ''),
+    fadeFrom,
+    complete,
+    duration: (document.boundaries.length - 1) * AGENT_REVEAL_INTERVAL + AGENT_REVEAL_FADE_DURATION
+  }
+}
@@ -0,0 +1,63 @@
+export type ChatTextAttachment = { name: string; content: string; kind?: 'text' }
+export type ChatImageDraft = { kind: 'image'; name: string; file: File; previewUrl: string }
+export type ChatAttachment = ChatTextAttachment | ChatImageDraft
+export type AgentImageReference = { token: string; name: string; mimeType: string; size: number; url: string }
+
+export const CHAT_IMAGE_ACCEPT = '.png,.jpg,.jpeg,.webp'
+
+export function displayAttachmentName(name: string): string {
+  // Older multipart uploads can leave Latin-1-decoded UTF-8 in cached image references.
+  if (!/^[\u0000-\u00ff]*$/.test(name)) return name
+  try {
+    return new TextDecoder('utf-8', { fatal: true }).decode(Uint8Array.from(name, character => character.charCodeAt(0)))
+  } catch {
+    return name
+  }
+}
+
+export const CHAT_ATTACHMENT_ACCEPT = '.txt,.log,.md,.json,.yaml,.yml,.xml,.py,.js,.jsx,.ts,.tsx,.c,.cc,.cpp,.h,.hpp,.sh,.bash,.cfg,.ini,.toml,.csv,.urdf,.xacro,.launch,.rviz,.cmake'
+
+export async function readChatAttachments(files: File[], existing: ChatAttachment[], options: { imagesEnabled?: boolean } = {}): Promise<ChatAttachment[]> {
+  if (files.length + existing.length > 5) throw new Error('파일은 최대 5개까지 첨부할 수 있습니다.')
+  const result = [...existing]
+  const createdUrls: string[] = []
+  try { for (const file of files) {
+    const name = file.name
+    const extension = `.${name.split('.').pop()?.toLowerCase()}`
+    if (CHAT_IMAGE_ACCEPT.split(',').includes(extension)) {
+      if (!options.imagesEnabled) throw new Error('현재 모델은 이미지 첨부를 지원하지 않습니다. Qwen 3.7 Plus·Flash 또는 3.8 Max·Flash를 선택해주세요.')
+      if (result.filter(item => item.kind === 'image').length >= 3) throw new Error('이미지는 최대 3장까지 첨부할 수 있습니다.')
+      if (name.length > 255 || !file.size || file.size > 5 * 1024 * 1024) throw new Error('이미지는 장당 5MB 이하여야 합니다.')
+      let bitmap: ImageBitmap
+      try { bitmap = await createImageBitmap(file) } catch { throw new Error('이미지 파일을 읽지 못했습니다.') }
+      const pixels = bitmap.width * bitmap.height
+      bitmap.close()
+      if (!pixels || pixels > 16_000_000) throw new Error('이미지는 1600만 픽셀 이하여야 합니다.')
+      const previewUrl = URL.createObjectURL(file)
+      createdUrls.push(previewUrl)
+      result.push({ kind: 'image', name, file, previewUrl })
+      continue
+    }
+    if (!CHAT_ATTACHMENT_ACCEPT.split(',').includes(extension) && !['dockerfile', 'cmakelists.txt'].includes(name.toLowerCase())) {
+      throw new Error('코드·설정·로그 또는 PNG·JPEG·WebP 이미지를 첨부해주세요. PDF는 지원하지 않습니다.')
+    }
+    if (name.length > 255 || file.size > 100_000) throw new Error('파일 이름은 255자, 파일 크기는 100KB 이하여야 합니다.')
+    let content: string
+    try {
+      content = new TextDecoder('utf-8', { fatal: true }).decode(await file.arrayBuffer())
+    } catch {
+      throw new Error('UTF-8 텍스트 파일만 첨부할 수 있습니다.')
+    }
+    if (content.includes('\0')) throw new Error('바이너리 파일은 첨부할 수 없습니다.')
+    if (content.length > 50_000) throw new Error('파일 하나의 내용은 5만 자 이하여야 합니다.')
+    result.push({ name, content })
+  }
+  if (result.reduce((sum, file) => sum + (file.kind === 'image' ? 0 : file.name.length + file.content.length), 0) > 100_000) {
+    throw new Error('첨부 파일의 전체 내용은 10만 자 이하여야 합니다.')
+  }
+  return result
+  } catch (error) {
+    createdUrls.forEach(url => URL.revokeObjectURL(url))
+    throw error
+  }
+}
@@ -67,6 +67,11 @@ interface Window {
    openDevTools: () => Promise<{ opened: boolean; message?: string }>
    close: () => void
  }
+  chatTextMenu?: {
+    show: (options: import('../../shared/chatTextMenu').ChatTextMenuOptions) => Promise<import('../../shared/chatTextMenu').ChatTextMenuAction>
+    readClipboardState: () => Promise<{ hasText: boolean }>
+    perform: (action: import('../../shared/chatTextMenu').ChatClipboardAction) => Promise<boolean>
+  }
  appDiagnostics?: {
    read: () => Promise<{ path: string; content: string }>
  }
@@ -91,6 +96,16 @@ interface Window {
    rename: (moduleName: string, fromPath: string, toPath: string, workspaceRoot?: string, folderName?: string) => Promise<{ ok: boolean }>
    delete: (moduleName: string, path: string, workspaceRoot?: string, folderName?: string) => Promise<{ ok: boolean }>
  }
+  agent: {
+    readTool: (request: import('../../shared/agentTools').AgentToolRequest, workspaceRoot?: string, folderName?: string) => Promise<import('../../shared/agentTools').AgentToolResult>
+    applyFiles: (changes: import('../../shared/agentTools').AgentCheckedChange[], workspaceRoot?: string) => Promise<{ ok: boolean }>
+    runCommand: (moduleName: string, command: string, workspaceRoot?: string, folderName?: string) => Promise<{
+      ok: boolean
+      output: string
+      exitCode: number | null
+      message?: string
+    }>
+  }
  modules: {
    list: (workspaceRoot?: string, modules?: Array<{ sortOrder?: number | null; category: string; name: string; folderName: string; templateRepositoryUrl?: string | null; sourceType?: string | null; prebuiltArtifacts?: ModulePrebuiltArtifact[] | null }>) => Promise<{
      cacheRoot: string
@@ -111,6 +126,8 @@ interface Window {
      }>
    }>
    listDockerImages: () => Promise<{ images: string[]; message?: string }>
+    listGitSources: (root: string) => Promise<import('../../shared/gitModuleImport').LocalGitModule[]>
+    inspectGitSource: (root: string, folder: string) => Promise<import('../../shared/gitModuleImport').GitModuleSource>
    install: (moduleName: string, workspaceRoot?: string, folderName?: string, templateRepositoryUrl?: string | null, studentRepositoryUrl?: string | null, options?: ModuleInstallOptions | null) => Promise<{
      ok: boolean
      module: {
@@ -265,6 +282,7 @@ interface Window {
      openGuide: () => Promise<void>
    }
    moduleFiles: Window['moduleFiles']
+    agent: Window['agent']
    modules: Window['modules']
    rosGraph: {
      snapshot: () => Promise<{
@@ -308,6 +326,11 @@ interface Window {
      rename: (target: RemoteWorkspaceTarget, moduleName: string, fromPath: string, toPath: string, folderName?: string) => ReturnType<Window['moduleFiles']['rename']>
      delete: (target: RemoteWorkspaceTarget, moduleName: string, path: string, folderName?: string) => ReturnType<Window['moduleFiles']['delete']>
    }
+    agent: {
+      readTool: (target: RemoteWorkspaceTarget, request: import('../../shared/agentTools').AgentToolRequest, folderName?: string) => Promise<import('../../shared/agentTools').AgentToolResult>
+      applyFiles: (target: RemoteWorkspaceTarget, changes: import('../../shared/agentTools').AgentCheckedChange[]) => Promise<{ ok: boolean }>
+      runCommand: (target: RemoteWorkspaceTarget, moduleName: string, command: string, folderName?: string) => ReturnType<Window['agent']['runCommand']>
+    }
    maps: {
      readArtifacts: (target: RemoteWorkspaceTarget, artifacts: SavedMapArtifactPath[]) => Promise<Array<{ name: SavedMapArtifactName; fileName: string; base64: string }>>
      copyActiveRtabmapDatabaseToLocal: (target: RemoteWorkspaceTarget, localWorkspaceRoot: string | undefined, destinationPath: string) => Promise<{ databasePath: string }>
@@ -333,6 +356,8 @@ interface Window {
          runtime: string
        }
      }>
+      listDockerImages: (target: RemoteWorkspaceTarget) => Promise<{ images: string[]; message?: string }>
+      importGit: (target: RemoteWorkspaceTarget, root: string, input: import('../../shared/gitModuleImport').GitModuleImportInput & { folderName: string }) => Promise<{ ok: boolean; workspacePath: string }>
      createCustom: (target: RemoteWorkspaceTarget, input: { name: string; category: string; folderName: string; dockerImage?: string | null; packageName: string; launchFile: string }) => Promise<{ ok: boolean; workspacePath: string }>
      transfer: (target: RemoteWorkspaceTarget, sourceWorkspaceRoot: string | undefined, moduleName: string, folderName?: string) => Promise<{ ok: boolean; workspacePath: string }>
      start: (target: RemoteWorkspaceTarget, moduleName: string, folderName?: string, rosParams?: string, gpuEnabled?: boolean, rosDomainId?: string, runtimeImages?: RuntimeImageArtifact[] | null, rosNetwork?: RosNetworkConfig | null) => Promise<{ ok: boolean; message: string }>
@@ -0,0 +1,150 @@
+[data-ai-guide-theme='light'] {
+  background: linear-gradient(110deg, #6548ff, #4776ff);
+  color: #202d43;
+}
+
+[data-ai-guide-theme='light'] > header {
+  background: linear-gradient(115deg, #8370ff, #607dff 55%, #57a6ff);
+  border-color: #8ea7ff;
+}
+
+[data-ai-guide-theme='light'] aside {
+  background: #f5f8ff;
+}
+
+[data-ai-guide-theme='light'] main {
+  background: #f5f8ff;
+}
+
+/* Keep these overrides inside the guide; shared chat widgets retain their own themes. */
+[data-ai-guide-theme='light'] :is(aside, main, section) [class*='text-white/'] {
+  color: #647497;
+}
+
+[data-ai-guide-theme='light'] :is(aside, main) :is(strong, h2)[class*='text-white/'] {
+  color: #203654;
+}
+
+[data-ai-guide-theme='light'] [class*='border-white/'] {
+  border-color: #b8c7e2;
+}
+
+[data-ai-guide-theme='light'] [class*='text-violet-'],
+[data-ai-guide-theme='light'] [class*='text-cyan-'] {
+  color: #2563eb;
+}
+
+[data-ai-guide-theme='light'] [class*='bg-cyan-400/'],
+[data-ai-guide-theme='light'] [class*='bg-violet-400/'] {
+  background: #edf1ff;
+  border-color: #bdcbed;
+}
+
+[data-ai-guide-theme='light'] aside [class*='bg-cyan-400/10'] {
+  background: linear-gradient(110deg, #6548ff, #4776ff);
+  color: #fff;
+}
+
+[data-ai-guide-theme='light'] aside [class*='bg-cyan-400/10'] [class*='text-white/'] {
+  color: #dce8fc;
+}
+
+[data-ai-guide-theme='light'] :is(aside, section) button[class*='hover:bg-white/']:hover {
+  background: #d6e2f5;
+  color: #153b7c;
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#1d2230]'] {
+  background: #faf8ff;
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#5b4aa8]'] {
+  background: linear-gradient(110deg, #6548ff, #4776ff);
+  box-shadow: 0 4px 12px rgb(37 99 235 / 12%);
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#10131b]/78'] {
+  background: rgb(248 250 255 / 82%);
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#252238]'],
+[data-ai-guide-theme='light'] section[class~='bg-[#1b2a42]'] {
+  background: #fff;
+  color: #203654;
+}
+
+[data-ai-guide-theme='light'] section[class~='bg-[#1b2a42]'] p.text-white {
+  color: #203654;
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#0e7490]'] {
+  background: linear-gradient(110deg, #6548ff, #4776ff);
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#0e7490]']:enabled:hover {
+  background: #1d4ed8;
+}
+
+[data-ai-guide-theme='light'] > header strong {
+  font-size: 15px;
+  color: #fff;
+}
+
+[data-ai-guide-theme='light'] > header button {
+  color: #fff;
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] > div {
+  padding: 18px 14px;
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] > div > div:first-child {
+  padding: 16px;
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] > div > button {
+  min-height: 44px;
+  margin-top: 18px;
+  border: 1px solid #b8c8e8;
+  color: #4056bb;
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#1d2230]'] {
+  border-color: #c2cfe6;
+  background: #faf8ff;
+  padding: 22px 24px;
+  box-shadow: 0 5px 18px rgb(49 81 170 / 5%);
+}
+
+[data-ai-guide-theme='light'] [class~='bg-[#5b4aa8]'] {
+  padding: 13px 18px;
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-questions'] > div:first-child {
+  margin: 0 14px;
+  padding: 0;
+  height: 46px;
+}
+
+[data-ai-guide-theme='light'] main .pointer-events-auto > div {
+  border-color: #b8c8e8;
+  box-shadow: 0 4px 16px rgb(49 81 170 / 6%);
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] button:not([title]):not([class*='bg-cyan-400/10']),
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] div.group:not([class*='bg-cyan-400/10']),
+[data-ai-guide-theme='light'] [data-help='ai-guide-questions'] button:not([class*='bg-cyan-400/10']) {
+  border: 1px solid #d5ddef;
+  background: #fff;
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] button:not([title]):not([class*='bg-cyan-400/10']):hover,
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] div.group:not([class*='bg-cyan-400/10']):hover,
+[data-ai-guide-theme='light'] [data-help='ai-guide-questions'] button:not([class*='bg-cyan-400/10']):hover {
+  background: #f2f5fb;
+}
+
+[data-ai-guide-theme='light'] [data-help='ai-guide-context'] div.group > button:first-child {
+  border: 0;
+  background: transparent;
+}
@@ -1,8 +1,11 @@
+import { t, useLocaleRender, dateLocale } from '../i18n'
 import { BookOpen, ChevronRight, Code2, LoaderCircle, MessageSquareText, Plus, Sparkles, Trash2, X } from 'lucide-react'
 import type React from 'react'
 import { useEffect, useRef, useState } from 'react'
 import { ExpandableMarkdownMessage, QaInputBox } from '../components/ChatWidgets'
 import type { QaChatMessage, QaChatThread } from './workspace/useQaChat'
+import { useStudioTheme } from './workspace/studioTheme'
+import './AiGuideView.css'

 type Props = {
  courseTitle: string | null; weekNumber: number | null; weekTitle: string | null
@@ -21,16 +24,18 @@ const quickQuestions = [
 const formatDate = (value?: string): string => {
  if (!value) return ''
  const date = new Date(value)
-  return Number.isNaN(date.getTime()) ? '' : new Intl.DateTimeFormat('ko-KR', { month: 'numeric', day: 'numeric' }).format(date)
+  return Number.isNaN(date.getTime()) ? '' : new Intl.DateTimeFormat(dateLocale(), { month: 'numeric', day: 'numeric' }).format(date)
 }

 const formatTime = (value?: string): string => {
  if (!value) return ''
  const date = new Date(value)
-  return Number.isNaN(date.getTime()) ? '' : new Intl.DateTimeFormat('ko-KR', { hour: '2-digit', minute: '2-digit' }).format(date)
+  return Number.isNaN(date.getTime()) ? '' : new Intl.DateTimeFormat(dateLocale(), { hour: '2-digit', minute: '2-digit' }).format(date)
 }

 export default function AiGuideView(props: Props): React.JSX.Element {
+  useLocaleRender()
+  const dark = useStudioTheme() === 'dark'
  const {
    courseTitle, weekNumber, weekTitle, messages, activeConversation, typingMessageId, history, selectedHistoryId, viewingHistory,
    loading, busy, disabled, onSubmit, onQuickSubmit, onStop, onClear, onSelectHistory, onDeleteHistory, onClose
@@ -74,26 +79,26 @@ export default function AiGuideView(props: Props): React.JSX.Element {
  }

  return (
-    <section className="relative flex h-full min-h-0 w-full flex-col overflow-hidden bg-[#10131b] text-white">
+    <section data-ai-guide-theme={dark ? 'dark' : 'light'} className="relative flex h-full min-h-0 w-full flex-col overflow-hidden bg-[#10131b] text-white">
      <header className="flex h-10 shrink-0 items-center justify-between border-b border-violet-200/15 bg-[#2a1d3f] px-3">
-        <strong className="truncate pl-4 text-[13px] font-bold text-white/90">AI 가이드</strong>
-        <button type="button" aria-label="닫기" title="닫기" onClick={onClose} className="grid size-7 cursor-pointer place-items-center rounded text-white/55 transition hover:bg-white/[0.08] hover:text-white"><X size={16} /></button>
+        <strong className="flex min-w-0 items-center gap-2 pl-2 text-[13px] font-bold text-white/90"><Sparkles size={16} className="shrink-0" /><span className="translate-y-px truncate">{t("AI 가이드")}</span></strong>
+        <button type="button" aria-label={t("닫기")} title={t("닫기")} onClick={onClose} className="grid size-7 cursor-pointer place-items-center rounded text-white/55 transition hover:bg-white/[0.08] hover:text-white"><X size={16} /></button>
      </header>
      <div className="flex min-h-0 flex-1">
        <aside data-help="ai-guide-context" className="flex w-[252px] shrink-0 flex-col border-r border-white/10 bg-[#191b2a]">
          <div className="thin-y-scrollbar min-h-0 flex-1 overflow-y-auto p-3">
            <div className="rounded-lg border border-cyan-300/18 bg-cyan-400/[0.07] px-3 pb-3 pt-2">
-              <span className="text-[10px] font-bold tracking-[0.08em] text-cyan-200">현재 학습</span>
+              <span className="text-[10px] font-bold tracking-[0.08em] text-cyan-200">{t("현재 학습")}</span>
              <strong className="mt-2 block text-[13px] leading-snug text-white/88">{contextLabel}</strong>
-              <p className="mt-1.5 text-[11px] leading-relaxed text-white/46">{courseTitle ?? '강좌를 선택하면 학습 내용에 맞춰 안내합니다.'}</p>
+              <p className="mt-1.5 text-[11px] leading-relaxed text-white/46">{courseTitle ?? t("강좌를 선택하면 학습 내용에 맞춰 안내합니다.")}</p>
            </div>
-            <button type="button" disabled={busy || disabled} onClick={onClear} className="group mt-3 flex min-h-10 w-full cursor-pointer items-center gap-2 rounded-md px-2 text-left text-[12px] font-semibold text-white/58 transition hover:bg-white/[0.07] hover:text-white disabled:cursor-not-allowed disabled:opacity-35"><Plus size={15} className="shrink-0 text-violet-300" /><span className="min-w-0 flex-1">새 채팅</span><ChevronRight size={14} className="shrink-0 opacity-0 transition group-hover:opacity-70" /></button>
-            <div className="mt-5"><span className="px-1 text-[10px] font-bold tracking-[0.08em] text-white/38">빠른 질문</span><div className="mt-2 grid gap-1">
-              {quickQuestions.map(({ Icon, label, prompt }) => <button key={label} type="button" disabled={disabled || busy || !weekNumber} onClick={() => onQuickSubmit(prompt)} className="group flex min-h-10 w-full cursor-pointer items-center gap-2 rounded-md px-2 text-left text-[12px] font-semibold text-white/58 transition hover:bg-white/[0.07] hover:text-white disabled:cursor-not-allowed disabled:opacity-35"><Icon size={15} className="shrink-0 text-violet-300" /><span className="min-w-0 flex-1">{label}</span><ChevronRight size={14} className="shrink-0 opacity-0 transition group-hover:opacity-70" /></button>)}
+            <button type="button" disabled={busy || disabled} onClick={onClear} className="group mt-3 flex min-h-10 w-full cursor-pointer items-center gap-2 rounded-md px-2 text-left text-[12px] font-semibold text-white/58 transition hover:bg-white/[0.07] hover:text-white disabled:cursor-not-allowed disabled:opacity-35"><Plus size={15} className="shrink-0 text-violet-300" /><span className="min-w-0 flex-1">{t("새 채팅")}</span><ChevronRight size={14} className="shrink-0 opacity-0 transition group-hover:opacity-70" /></button>
+            <div className="mt-5"><span className="px-1 text-[10px] font-bold tracking-[0.08em] text-white/38">{t("빠른 질문")}</span><div className="mt-2 grid gap-1">
+              {quickQuestions.map(({ Icon, label, prompt }) => <button key={label} type="button" disabled={disabled || busy || !weekNumber} onClick={() => onQuickSubmit(prompt)} className="group flex min-h-10 w-full cursor-pointer items-center gap-2 rounded-md px-2 text-left text-[12px] font-semibold text-white/58 transition hover:bg-white/[0.07] hover:text-white disabled:cursor-not-allowed disabled:opacity-35"><Icon size={15} className="shrink-0 text-violet-300" /><span className="min-w-0 flex-1">{t(label)}</span><ChevronRight size={14} className="shrink-0 opacity-0 transition group-hover:opacity-70" /></button>)}
            </div></div>
-            <div className="mt-6 border-t border-white/[0.08] pt-4"><span className="px-1 text-[10px] font-bold tracking-[0.08em] text-white/38">최근 채팅</span><div className="mt-2 grid gap-1">
-              {activeConversation ? <button type="button" onClick={() => selectConversation(null)} className={['min-w-0 cursor-pointer rounded-md px-2 py-2 text-left transition', !viewingHistory ? 'bg-cyan-400/10 text-cyan-100/85' : 'text-white/48 hover:bg-white/[0.06] hover:text-white/75'].join(' ')}><span className="block truncate text-[11px] font-semibold">{activeConversation.title || '새 채팅'}</span><span className="mt-0.5 block text-[10px] text-white/32">현재 채팅</span></button> : null}
-              {history.map((thread) => <div key={thread.id} className={['group flex min-w-0 items-center rounded-md transition', selectedHistoryId === thread.id ? 'bg-cyan-400/10 text-cyan-100/85' : 'text-white/48 hover:bg-white/[0.06] hover:text-white/75'].join(' ')}><button type="button" onClick={() => selectConversation(thread.id)} className="min-w-0 flex-1 cursor-pointer px-2 py-2 text-left"><span className="block truncate text-[11px] font-semibold">{thread.title || '이전 채팅'}</span><span className="mt-0.5 block text-[10px] text-white/32">{formatDate(thread.lastMessageAt)}</span></button><button type="button" title="채팅 삭제" aria-label="채팅 삭제" onClick={() => setDeleteConfirmThread(thread)} className="mr-1.5 grid size-6 shrink-0 cursor-pointer place-items-center rounded text-white/30 opacity-0 transition hover:bg-white/[0.08] hover:text-[#f87171] group-hover:opacity-100"><Trash2 size={13} /></button></div>)}
+            <div className="mt-6 border-t border-white/[0.08] pt-4"><span className="px-1 text-[10px] font-bold tracking-[0.08em] text-white/38">{t("최근 채팅")}</span><div className="mt-2 grid gap-1">
+              {activeConversation ? <button type="button" onClick={() => selectConversation(null)} className={['min-w-0 cursor-pointer rounded-md px-2 py-2 text-left transition', !viewingHistory ? 'bg-cyan-400/10 text-cyan-100/85' : 'text-white/48 hover:bg-white/[0.06] hover:text-white/75'].join(' ')}><span className="block truncate text-[11px] font-semibold">{activeConversation.title || t("새 채팅")}</span><span className="mt-0.5 block text-[10px] text-white/32">{t("현재 채팅")}</span></button> : null}
+              {history.map((thread) => <div key={thread.id} className={['group flex min-w-0 items-center rounded-md transition', selectedHistoryId === thread.id ? 'bg-cyan-400/10 text-cyan-100/85' : 'text-white/48 hover:bg-white/[0.06] hover:text-white/75'].join(' ')}><button type="button" onClick={() => selectConversation(thread.id)} className="min-w-0 flex-1 cursor-pointer px-2 py-2 text-left"><span className="block truncate text-[11px] font-semibold">{thread.title || t("이전 채팅")}</span><span className="mt-0.5 block text-[10px] text-white/32">{formatDate(thread.lastMessageAt)}</span></button><button type="button" title={t("채팅 삭제")} aria-label={t("채팅 삭제")} onClick={() => setDeleteConfirmThread(thread)} className="mr-1.5 grid size-6 shrink-0 cursor-pointer place-items-center rounded text-white/30 opacity-0 transition hover:bg-white/[0.08] hover:text-[#f87171] group-hover:opacity-100"><Trash2 size={13} /></button></div>)}
            </div></div>
          </div>
        </aside>
@@ -102,18 +107,18 @@ export default function AiGuideView(props: Props): React.JSX.Element {
            const target = event.currentTarget
            followConversationRef.current = target.scrollHeight - target.scrollTop - target.clientHeight < 96
          }} className="thin-y-scrollbar min-h-0 flex-1 overflow-y-auto px-6 pb-32 pt-7">
-            {loading ? <div className="grid h-full min-h-[300px] place-items-center text-[12px] font-semibold text-white/40"><span className="flex items-center gap-2"><LoaderCircle size={15} className="animate-spin" /> 이전 채팅을 불러오는 중</span></div> : disabled ? <div className="grid h-full min-h-[300px] place-items-center text-center"><div><span className="mx-auto grid size-10 place-items-center rounded-lg bg-white/[0.06] text-white/42"><MessageSquareText size={19} /></span><strong className="mt-3 block text-[14px] text-white/75">AI 가이드를 준비하고 있습니다</strong></div></div> : <div className="mx-auto flex w-full max-w-[860px] flex-col gap-5">
-              {messages.length === 0 && <div className="py-9 text-center"><span className="mx-auto grid size-11 place-items-center rounded-xl border border-violet-300/25 bg-violet-400/10 text-violet-200"><Sparkles size={20} /></span><h2 className="mt-4 text-[16px] font-bold text-white/86">무엇이 궁금한가요?</h2><p className="mt-1 text-[12px] text-white/42">개념, 실습 순서, 오류 원인처럼 학습에 필요한 내용을 질문하세요.</p></div>}
-              {messages.map((message) => <article key={message.id} ref={message.role === 'user' ? (node) => { questionRefs.current[message.id] = node } : undefined} className={message.role === 'user' ? 'flex w-full justify-end' : 'w-full'}><div className={message.role === 'user' ? 'max-w-[78%] rounded-xl rounded-br-sm bg-[#5b4aa8] px-3.5 py-2.5 text-[12px] font-medium leading-relaxed text-white shadow-[0_8px_20px_rgba(63,49,139,0.28)]' : 'w-full rounded-xl rounded-tl-sm border border-white/10 bg-[#1d2230] px-4 py-3'}>{message.role === 'user' ? <p className="whitespace-pre-wrap">{message.content}</p> : <><>{(message.isTyping || message.id === typingMessageId) && <span className="mb-2 flex items-center gap-1.5 text-[11px] font-semibold text-violet-200"><LoaderCircle size={13} className="animate-spin" /> 생각 중</span>}</><ExpandableMarkdownMessage content={message.content || '응답을 작성하고 있습니다.'} dark defaultCollapsed={!message.keepExpanded && message.id !== latestAssistantMessageId} /></>}</div>{message.status === 'CANCELED' && <p className="mt-1 text-[10px] font-medium text-white/32">응답이 중단됨</p>}</article>)}
-              {busy && <article className="w-full"><div className="inline-flex items-center gap-2 rounded-xl rounded-tl-sm border border-white/10 bg-[#1d2230] px-4 py-3 text-[12px] font-semibold text-violet-200"><LoaderCircle size={15} className="animate-spin" /> 생각 중</div></article>}
+            {loading ? <div className="grid h-full min-h-[300px] place-items-center text-[12px] font-semibold text-white/40"><span className="flex items-center gap-2"><LoaderCircle size={15} className="animate-spin" />{t("이전 채팅을 불러오는 중")}</span></div> : disabled ? <div className="grid h-full min-h-[300px] place-items-center text-center"><div><span className="mx-auto grid size-10 place-items-center rounded-lg bg-white/[0.06] text-white/42"><MessageSquareText size={19} /></span><strong className="mt-3 block text-[14px] text-white/75">{t("AI 가이드를 준비하고 있습니다")}</strong></div></div> : <div className="mx-auto flex w-full max-w-[860px] flex-col gap-5">
+              {messages.length === 0 && <div className="py-9 text-center"><span className="mx-auto grid size-11 place-items-center rounded-xl border border-violet-300/25 bg-violet-400/10 text-violet-200"><Sparkles size={20} /></span><h2 className="mt-4 text-[16px] font-bold text-white/86">{t("무엇이 궁금한가요?")}</h2><p className="mt-1 text-[12px] text-white/42">{t("개념, 실습 순서, 오류 원인처럼 학습에 필요한 내용을 질문하세요.")}</p></div>}
+              {messages.map((message) => <article key={message.id} ref={message.role === 'user' ? (node) => { questionRefs.current[message.id] = node } : undefined} className={message.role === 'user' ? 'flex w-full justify-end' : 'w-full'}><div className={message.role === 'user' ? 'max-w-[78%] rounded-xl rounded-br-sm bg-[#5b4aa8] px-3.5 py-2.5 text-[12px] font-medium leading-relaxed text-white shadow-[0_8px_20px_rgba(63,49,139,0.28)]' : 'w-full rounded-xl rounded-tl-sm border border-white/10 bg-[#1d2230] px-4 py-3'}>{message.role === 'user' ? <p className="whitespace-pre-wrap">{message.content}</p> : <><>{(message.isTyping || message.id === typingMessageId) && <span className="mb-2 flex items-center gap-1.5 text-[11px] font-semibold text-violet-200"><LoaderCircle size={13} className="animate-spin" />{t("생각 중")}</span>}</><ExpandableMarkdownMessage content={message.content || t("응답을 작성하고 있습니다.")} dark={dark} defaultCollapsed={!message.keepExpanded && message.id !== latestAssistantMessageId} /></>}</div>{message.status === 'CANCELED' && <p className="mt-1 text-[10px] font-medium text-white/32">{t("응답이 중단됨")}</p>}</article>)}
+              {busy && <article className="w-full"><div className="inline-flex items-center gap-2 rounded-xl rounded-tl-sm border border-white/10 bg-[#1d2230] px-4 py-3 text-[12px] font-semibold text-violet-200"><LoaderCircle size={15} className="animate-spin" />{t("생각 중")}</div></article>}
            </div>}
          </div>
-          <div className="pointer-events-none absolute inset-x-0 bottom-3 z-10 px-6"><div className="pointer-events-auto mx-auto max-w-[900px]"><QaInputBox dark accent="cyan" busy={busy} disabled={disabled || viewingHistory || switchingConversation} onStop={onStop} onSubmit={onSubmit} /></div></div>
-          {switchingConversation && <div className="absolute inset-0 z-20 grid place-items-center bg-[#10131b]/78 backdrop-blur-[2px]"><span className="flex items-center gap-2 rounded-lg border border-white/10 bg-[#252238] px-4 py-3 text-[12px] font-semibold text-white/76"><LoaderCircle size={15} className="animate-spin text-violet-200" /> 채팅 불러오는 중</span></div>}
+          <div className="pointer-events-none absolute inset-x-0 bottom-3 z-10 px-6"><div className="pointer-events-auto mx-auto max-w-[900px]"><QaInputBox dark={dark} accent="cyan" busy={busy} disabled={disabled || viewingHistory || switchingConversation} onStop={onStop} onSubmit={onSubmit} /></div></div>
+          {switchingConversation && <div className="absolute inset-0 z-20 grid place-items-center bg-[#10131b]/78 backdrop-blur-[2px]"><span className="flex items-center gap-2 rounded-lg border border-white/10 bg-[#252238] px-4 py-3 text-[12px] font-semibold text-white/76"><LoaderCircle size={15} className="animate-spin text-violet-200" />{t("채팅 불러오는 중")}</span></div>}
        </main>
-        <aside data-help="ai-guide-questions" className="flex w-[232px] shrink-0 flex-col border-l border-white/10 bg-[#191b2a]"><div className="flex h-10 shrink-0 items-center border-b border-white/10 px-3"><span className="text-[11px] font-bold text-white/44">질문 목록</span></div><div className="thin-y-scrollbar min-h-0 flex-1 overflow-y-auto p-2">{questionMessages.length ? <div className="grid gap-1">{questionMessages.map((message) => <button key={message.id} type="button" onClick={() => { setSelectedQuestionId(message.id); questionRefs.current[message.id]?.scrollIntoView({ behavior: 'smooth', block: 'center' }) }} className={['w-full min-w-0 cursor-pointer overflow-hidden rounded-md px-2.5 py-2 text-left transition', selectedQuestionId === message.id ? 'bg-cyan-400/10 text-cyan-100/85' : 'text-white/52 hover:bg-white/[0.06] hover:text-white/78'].join(' ')}><span className="flex w-full min-w-0 items-start gap-2"><span className="min-w-0 flex-1 truncate text-[11px] font-medium leading-relaxed">{message.content}</span><time className="shrink-0 pt-0.5 text-[10px] font-medium text-white/32">{formatTime(message.createdAt)}</time></span></button>)}</div> : <div className="grid min-h-[160px] place-items-center px-3 text-center text-[11px] leading-relaxed text-white/34">질문을 보내면 이곳에 표시됩니다.</div>}</div></aside>
+        <aside data-help="ai-guide-questions" className="flex w-[232px] shrink-0 flex-col border-l border-white/10 bg-[#191b2a]"><div className="flex h-10 shrink-0 items-center border-b border-white/10 px-3"><span className="text-[11px] font-bold text-white/44">{t("질문 목록")}</span></div><div className="thin-y-scrollbar min-h-0 flex-1 overflow-y-auto p-2">{questionMessages.length ? <div className="grid gap-1">{questionMessages.map((message) => <button key={message.id} type="button" onClick={() => { setSelectedQuestionId(message.id); questionRefs.current[message.id]?.scrollIntoView({ behavior: 'smooth', block: 'center' }) }} className={['w-full min-w-0 cursor-pointer overflow-hidden rounded-md px-2.5 py-2 text-left transition', selectedQuestionId === message.id ? 'bg-cyan-400/10 text-cyan-100/85' : 'text-white/52 hover:bg-white/[0.06] hover:text-white/78'].join(' ')}><span className="flex w-full min-w-0 items-start gap-2"><span className="min-w-0 flex-1 truncate text-[11px] font-medium leading-relaxed">{message.content}</span><time className="shrink-0 pt-0.5 text-[10px] font-medium text-white/32">{formatTime(message.createdAt)}</time></span></button>)}</div> : <div className="grid min-h-[160px] place-items-center px-3 text-center text-[11px] leading-relaxed text-white/34">{t("질문을 보내면 이곳에 표시됩니다.")}</div>}</div></aside>
      </div>
-      {deleteConfirmThread && <div className="absolute inset-0 z-50 grid place-items-center bg-black/36"><section className="w-[360px] overflow-hidden rounded-lg border border-white/10 bg-[#1b2a42] text-white shadow-[0_24px_70px_rgba(0,0,0,0.42)]"><div className="flex items-center gap-2 border-b border-white/10 px-4 py-3"><Trash2 size={15} className="text-[#e87979]" /><strong className="text-[13px] font-bold">채팅 삭제</strong></div><div className="p-4"><p className="text-[13px] font-semibold text-white">이 채팅 내역을 삭제할까요?</p><p className="mt-2 truncate text-[12px] font-medium text-white/52">{deleteConfirmThread.title || '이전 채팅'}</p><p className="mt-2 text-[12px] font-medium leading-relaxed text-white/45">삭제한 채팅과 답변은 복구할 수 없습니다.</p><div className="mt-4 flex justify-end gap-2"><button type="button" onClick={() => setDeleteConfirmThread(null)} className="h-8 cursor-pointer rounded-md border border-white/12 px-3 text-[12px] font-bold text-white/62 transition hover:bg-white/8 hover:text-white">취소</button><button type="button" onClick={() => { onDeleteHistory(deleteConfirmThread.id); setDeleteConfirmThread(null) }} className="h-8 cursor-pointer rounded-md bg-[#d14b4b] px-3 text-[12px] font-bold text-white transition hover:bg-[#bd3838]">삭제</button></div></div></section></div>}
+      {deleteConfirmThread && <div className="absolute inset-0 z-50 grid place-items-center bg-black/36"><section className="w-[360px] overflow-hidden rounded-lg border border-white/10 bg-[#1b2a42] text-white shadow-[0_24px_70px_rgba(0,0,0,0.42)]"><div className="flex items-center gap-2 border-b border-white/10 px-4 py-3"><Trash2 size={15} className="text-[#e87979]" /><strong className="text-[13px] font-bold">{t("채팅 삭제")}</strong></div><div className="p-4"><p className="text-[13px] font-semibold text-white">{t("이 채팅 내역을 삭제할까요?")}</p><p className="mt-2 truncate text-[12px] font-medium text-white/52">{deleteConfirmThread.title || t("이전 채팅")}</p><p className="mt-2 text-[12px] font-medium leading-relaxed text-white/45">{t("삭제한 채팅과 답변은 복구할 수 없습니다.")}</p><div className="mt-4 flex justify-end gap-2"><button type="button" onClick={() => setDeleteConfirmThread(null)} className="h-8 cursor-pointer rounded-md border border-white/12 px-3 text-[12px] font-bold text-white/62 transition hover:bg-white/8 hover:text-white">{t("취소")}</button><button type="button" onClick={() => { onDeleteHistory(deleteConfirmThread.id); setDeleteConfirmThread(null) }} className="h-8 cursor-pointer rounded-md bg-[#d14b4b] px-3 text-[12px] font-bold text-white transition hover:bg-[#bd3838]">{t("삭제")}</button></div></div></section></div>}
    </section>
  )
 }
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { CheckCircle2, LoaderCircle, Search, Sparkles, UserPlus } from 'lucide-react'
 import { useEffect, useState } from 'react'
 import type React from 'react'
@@ -41,6 +42,7 @@ export default function CourseSelectionScreen({
  onEnrollCourse,
  onBack,
 }: CourseSelectionScreenProps): React.JSX.Element {
+  useLocaleRender()
  const [query, setQuery] = useState('')
  const [searchResults, setSearchResults] = useState<CourseCatalogOption[]>([])
  const [searching, setSearching] = useState(false)
@@ -105,17 +107,15 @@ export default function CourseSelectionScreen({
      <div className="w-full rounded-xl border border-[#d5dbea] bg-white p-6 shadow-[0_18px_42px_rgba(20,27,44,0.12)]">
        <div className="flex items-start justify-between gap-4">
          <div className="min-w-0">
-            <h1 className="text-[24px] font-black text-[#111520]">강좌 선택</h1>
-            <p className="mt-2 text-[13px] font-semibold text-[#64748b]">수강 중인 강좌를 선택하거나 새 강좌를 검색해 수강 신청하세요.</p>
+            <h1 className="text-[24px] font-black text-[#111520]">{t("강좌 선택")}</h1>
+            <p className="mt-2 text-[13px] font-semibold text-[#64748b]">{t("수강 중인 강좌를 선택하거나 새 강좌를 검색해 수강 신청하세요.")}</p>
          </div>
          {hasSelectedCourse ? (
            <button
              type="button"
              onClick={onBack}
              className="shrink-0 cursor-pointer border-0 bg-transparent px-0 py-1 text-[13px] font-black text-[#6f4df6] transition hover:text-[#4f35c8]"
-            >
-              뒤로가기
-            </button>
+            >{t("뒤로가기")}</button>
          ) : null}
        </div>

@@ -125,7 +125,7 @@ export default function CourseSelectionScreen({
            <input
              value={query}
              onChange={(event) => setQuery(event.target.value)}
-              placeholder="강좌명 또는 강사명 검색"
+              placeholder={t("강좌명 또는 강사명 검색")}
              className="h-12 w-full rounded-lg border border-[#cfd8e6] bg-[#fbfcff] pl-11 pr-4 text-[14px] font-semibold text-[#172033] outline-none transition focus:border-[#6f4df6] focus:bg-white focus:ring-2 focus:ring-[#6f4df6]/15"
            />
          </label>
@@ -134,8 +134,7 @@ export default function CourseSelectionScreen({
            <div className="mt-3">
              {searching ? (
                <div className="flex items-center justify-center gap-2 rounded-lg border border-dashed border-[#dce3ee] px-5 py-8 text-[13px] font-bold text-[#64748b]">
-                  <LoaderCircle size={17} className="animate-spin" /> 검색 중입니다.
-                </div>
+                  <LoaderCircle size={17} className="animate-spin" />{t("검색 중입니다.")}</div>
              ) : searchResults.length ? (
                <div className="grid gap-2">
                  {searchResults.map((course) => {
@@ -161,7 +160,7 @@ export default function CourseSelectionScreen({
                            <p className="mt-1 truncate text-[12px] font-bold text-[#64748b]">{teacherLabel(course)}</p>
                          </div>
                          {course.enrolled ? (
-                            <span className="shrink-0 rounded-md bg-[#edf7f2] px-2 py-1 text-[11px] font-black text-[#16845b]">수강 중</span>
+                            <span className="shrink-0 rounded-md bg-[#edf7f2] px-2 py-1 text-[11px] font-black text-[#16845b]">{t("수강 중")}</span>
                          ) : selected ? <CheckCircle2 size={18} className="shrink-0 text-[#6f4df6]" /> : null}
                        </div>
                      </button>
@@ -169,9 +168,9 @@ export default function CourseSelectionScreen({
                  })}
                </div>
              ) : (
-                <div className="rounded-lg border border-dashed border-[#dce3ee] px-5 py-8 text-center text-[13px] font-bold text-[#64748b]">검색 결과가 없습니다.</div>
+                <div className="rounded-lg border border-dashed border-[#dce3ee] px-5 py-8 text-center text-[13px] font-bold text-[#64748b]">{t("검색 결과가 없습니다.")}</div>
              )}
-              {searchError ? <p className="mt-2 text-[12px] font-bold text-[#d74d54]">{searchError}</p> : null}
+              {searchError ? <p className="mt-2 text-[12px] font-bold text-[#d74d54]">{t(searchError || '')}</p> : null}
              {selectedCatalogCourse ? (
                <div className="mt-3 flex justify-end">
                  <button
@@ -180,9 +179,7 @@ export default function CourseSelectionScreen({
                    disabled={enrolling}
                    className="inline-flex h-10 items-center gap-2 rounded-md bg-[#6f4df6] px-4 text-[13px] font-black text-white transition hover:bg-[#5f42d7] disabled:cursor-wait disabled:opacity-60"
                  >
-                    {enrolling ? <LoaderCircle size={16} className="animate-spin" /> : <UserPlus size={16} />}
-                    수강 신청
-                  </button>
+                    {enrolling ? <LoaderCircle size={16} className="animate-spin" /> : <UserPlus size={16} />}{t("수강 신청")}</button>
                </div>
              ) : null}
            </div>
@@ -190,7 +187,7 @@ export default function CourseSelectionScreen({
        </div>

        <div className="mt-6 border-t border-[#edf0f5] pt-5">
-          <p className="text-[12px] font-black text-[#64748b]">수강 중인 강좌</p>
+          <p className="text-[12px] font-black text-[#64748b]">{t("수강 중인 강좌")}</p>
          <div className="mt-3 grid gap-3">
            {courses.length ? courses.map((course) => {
              const selected = course.id === selectedCourseId
@@ -219,14 +216,14 @@ export default function CourseSelectionScreen({
                </button>
              )
            }) : (
-              <div className="rounded-lg border border-dashed border-[#dce3ee] px-5 py-10 text-center text-[13px] font-bold text-[#64748b]">수강 중인 강좌가 없습니다. 위에서 강좌를 검색해 신청하세요.</div>
+              <div className="rounded-lg border border-dashed border-[#dce3ee] px-5 py-10 text-center text-[13px] font-bold text-[#64748b]">{t("수강 중인 강좌가 없습니다. 위에서 강좌를 검색해 신청하세요.")}</div>
            )}
          </div>
        </div>

        {trialCourse ? (
          <div className="mt-6 border-t border-[#edf0f5] pt-5">
-            <p className="text-[12px] font-black text-[#64748b]">둘러보기</p>
+            <p className="text-[12px] font-black text-[#64748b]">{t("둘러보기")}</p>
            <button
              type="button"
              onClick={() => onSelectCourse(trialCourse.id)}
@@ -246,9 +243,7 @@ export default function CourseSelectionScreen({
                  <p className="mt-1 truncate text-[12px] font-bold text-[#64748b]">{trialCourse.teacher?.primaryOrganizationName ?? trialCourse.organizationName ?? 'Autonomy Studio'}</p>
                </div>
                <span className="inline-flex shrink-0 items-center gap-1 rounded-full border border-[#ded4ff] bg-[#f4f0ff] px-2.5 py-1 text-[11px] font-black text-[#6944d8]">
-                  <Sparkles size={12} strokeWidth={2.5} />
-                  체험
-                </span>
+                  <Sparkles size={12} strokeWidth={2.5} />{t("체험")}</span>
              </div>
            </button>
          </div>
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { CheckCircle2, FileText } from 'lucide-react'
 import type React from 'react'
 import { useState } from 'react'
@@ -33,24 +34,25 @@ export default function CurriculumDetailPanel({
  allowLearningStepSelection = false,
  onSelectLearningStep
 }: CurriculumDetailPanelProps): React.JSX.Element {
+  useLocaleRender()
  const [failedImageUrl, setFailedImageUrl] = useState<string | null>(null)
  const imageUrl = week.detail.coverImage?.downloadUrl
  const hasCover = Boolean(imageUrl && failedImageUrl !== imageUrl)
  return (
    <div data-help="curriculum-detail" className="min-w-0 px-7 pb-7 pt-5">
-      <h2 className="text-[18px] font-bold leading-tight">상세정보</h2>
+      <h2 className="text-[18px] font-bold leading-tight">{t("상세정보")}</h2>
      <div className="mt-5 min-h-[548px] pb-6">
        {selected ? (
          <>
            <section className={`relative overflow-hidden rounded-lg border border-[#dde2ec] shadow-[0_10px_24px_rgba(20,27,44,0.05)] ${hasCover ? 'bg-white' : 'bg-[#fbfcff] p-5'}`}>
              <div>
                <div className={hasCover ? 'px-5 pb-3 pt-5' : undefined}>
-                  <h3 className="text-[13px] font-semibold text-[#5f6878]">{week.week}주차 개요</h3>
+                  <h3 className="text-[13px] font-semibold text-[#5f6878]">{t('{{week}}주차 개요', { week: week.week })}</h3>
                  <h3 className="mt-1 text-[22px] font-bold leading-tight text-[#111520]">{week.title}</h3>
                </div>
                {hasCover && (
                  <div className="relative h-[240px] overflow-hidden">
-                    <img key={imageUrl} src={imageUrl} alt={`${week.week}주차 대표이미지`}
+                    <img key={imageUrl} src={imageUrl} alt={t("{{v0}}주차 대표이미지", { v0: week.week })}
                      className="block h-full w-full object-cover object-center"
                      onError={() => setFailedImageUrl(imageUrl ?? null)} />
                    <div aria-hidden="true" className="pointer-events-none absolute inset-0"
@@ -87,7 +89,7 @@ export default function CurriculumDetailPanel({
                    <div className="flex items-center gap-2.5">
                      <span className={`grid h-7 w-7 shrink-0 place-items-center rounded-md text-[12px] font-bold ${active ? 'bg-[#714ef6] text-white' : 'bg-[#ede9ff] text-[#714ef6]'}`}>{index + 1}</span>
                      <h3 className="min-w-0 text-[15px] font-bold text-[#111520]">{topic}</h3>
-                      {active ? <span className="rounded bg-[#ede9ff] px-2 py-1 text-[11px] font-bold text-[#714ef6]">진행중</span> : null}
+                      {active ? <span className="rounded bg-[#ede9ff] px-2 py-1 text-[11px] font-bold text-[#714ef6]">{t("진행중")}</span> : null}
                    </div>
                    <p className="mt-1 pl-[38px] text-[14px] font-medium leading-[1.5] text-[#4f596b]">
                      {week.detail.topicDetails[index]}
@@ -100,9 +102,7 @@ export default function CurriculumDetailPanel({
            {Boolean(week.detail.practiceContents?.length) && (
              <section className="mt-4 rounded-lg border border-[#dde2ec] bg-white p-4 shadow-[0_10px_22px_rgba(20,27,44,0.04)]">
                <h3 className="flex items-center gap-2 text-[14px] font-bold text-[#111520]">
-                  <FileText size={15} className="text-[#714ef6]" />
-                  실습 내용
-                </h3>
+                  <FileText size={15} className="text-[#714ef6]" />{t("실습 내용")}</h3>
                <div className="mt-3 grid">
                  {week.detail.practiceContents?.map((item, index) => (
                    <div key={item.title} className="flex gap-3 rounded-lg bg-[#f8f9fc] p-3">
@@ -119,17 +119,15 @@ export default function CurriculumDetailPanel({

            <section className="mt-4 rounded-lg border border-[#d9d7ce] bg-[#f7f5ef] p-4">
              <h3 className="flex items-center gap-2 text-[14px] font-bold text-[#111520]">
-                <CheckCircle2 size={15} className="text-[#7a6a2e]" />
-                제출 기준
-              </h3>
+                <CheckCircle2 size={15} className="text-[#7a6a2e]" />{t("제출 기준")}</h3>
              <p className="mt-2 text-[14px] font-medium leading-relaxed text-[#4f596b]">{week.detail.deliverable}</p>
            </section>
          </>
        ) : (
          <div className="grid min-h-[548px] place-items-center rounded-lg border border-dashed border-[#d9deea] bg-[#fbfcff] px-6 text-center">
            <div>
-              <strong className="block text-[15px] font-bold text-[#111520]">표시할 상세정보가 없습니다.</strong>
-              <p className="mt-2 text-[13px] font-medium text-[#687284]">강의에 등록된 주차별 커리큘럼을 불러오지 못했거나 아직 등록된 데이터가 없습니다.</p>
+              <strong className="block text-[15px] font-bold text-[#111520]">{t("표시할 상세정보가 없습니다.")}</strong>
+              <p className="mt-2 text-[13px] font-medium text-[#687284]">{t("강의에 등록된 주차별 커리큘럼을 불러오지 못했거나 아직 등록된 데이터가 없습니다.")}</p>
            </div>
          </div>
        )}
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import type React from 'react'
 import CurriculumDetailPanel from './CurriculumDetailPanel'
 import LearningInfoCard from './LearningInfoCard'
@@ -56,6 +57,7 @@ export default function CurriculumHomeScreen<Week extends CurriculumHomeWeek>({
  onStartStudio,
  onOpenMaterials
 }: CurriculumHomeScreenProps<Week>): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className="relative mx-auto grid max-w-[1360px] grid-cols-[minmax(0,1fr)_260px] gap-[24px] px-1">
      <div className="min-w-0">
@@ -63,14 +65,14 @@ export default function CurriculumHomeScreen<Week extends CurriculumHomeWeek>({
          <div className="absolute inset-0 bg-black/20" />
          <div className="relative z-[1] max-w-[390px]">
            <span className="mb-2 inline-block text-[14px] font-bold text-[#ffb85f]">Autonomy Studio</span>
-            <h1 className="max-w-[360px] text-[30px] font-bold uppercase leading-[1.04] text-white">커리큘럼</h1>
-            <p className="mt-2 max-w-[310px] text-[13px] leading-relaxed text-white/75">단계별 자율주행 알고리즘 학습 과정</p>
+            <h1 className="max-w-[360px] text-[30px] font-bold uppercase leading-[1.04] text-white">{t("커리큘럼")}</h1>
+            <p className="mt-2 max-w-[310px] text-[13px] leading-relaxed text-white/75">{t("단계별 자율주행 알고리즘 학습 과정")}</p>
          </div>
        </div>
        <section className="grid min-h-[680px] grid-cols-[300px_minmax(0,1fr)] overflow-hidden rounded-xl border border-[#d5dbea] bg-white shadow-[0_18px_42px_rgba(20,27,44,0.12)]">
-          <div className="border-r border-[#e4e7f0] bg-[#f6f3ff] p-5">
+          <div className="border-r border-[#e4e7f0] bg-white p-5">
            <div>
-              <h3 className="text-[19px] font-bold">주차별 커리큘럼</h3>
+              <h3 className="text-[19px] font-bold">{t("주차별 커리큘럼")}</h3>
              <p className="mt-1 text-[11px] font-medium text-[#5f6878]">{curriculumSummary}</p>
            </div>
            <div data-help="curriculum-weeks" className="mt-8 grid gap-2.5">
@@ -85,9 +87,7 @@ export default function CurriculumHomeScreen<Week extends CurriculumHomeWeek>({
                  />
                ))
              ) : (
-                <div className="rounded-lg border border-[#e2e6ef] bg-white/70 px-4 py-6 text-center text-[13px] font-semibold text-[#687284]">
-                  등록된 커리큘럼이 없습니다.
-                </div>
+                <div className="rounded-lg border border-[#e2e6ef] bg-white/70 px-4 py-6 text-center text-[13px] font-semibold text-[#687284]">{t("등록된 커리큘럼이 없습니다.")}</div>
              )}
            </div>
          </div>
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { X } from 'lucide-react'
 import type React from 'react'

@@ -10,6 +11,7 @@ export default function InstructorStudioNoticeModal({
  sidebarCollapsed,
  onClose
 }: InstructorStudioNoticeModalProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <div
      className={[
@@ -20,12 +22,12 @@ export default function InstructorStudioNoticeModal({
      <section className="w-full max-w-[430px] overflow-hidden rounded-xl border border-[#dfe3ed] bg-white shadow-[0_28px_80px_rgba(8,10,16,0.30)]">
        <header className="flex items-start justify-between gap-4 border-b border-[#e5e8ef] px-6 pb-4 pt-5">
          <div>
-            <span className="text-[12px] font-medium text-[#6f4df6]">개발 스튜디오</span>
-            <h2 className="mt-1 text-[21px] font-bold leading-tight text-[#111520]">강사 계정은 이용할 수 없습니다</h2>
+            <span className="text-[12px] font-medium text-[#6f4df6]">{t("개발 스튜디오")}</span>
+            <h2 className="mt-1 text-[21px] font-bold leading-tight text-[#111520]">{t("강사 계정은 이용할 수 없습니다")}</h2>
          </div>
          <button
            type="button"
-            aria-label="닫기"
+            aria-label={t("닫기")}
            onClick={onClose}
            className="grid h-8 w-8 shrink-0 cursor-pointer place-items-center rounded-md text-[#697386] transition hover:bg-[#f0f2f7] hover:text-[#111520]"
          >
@@ -34,16 +36,12 @@ export default function InstructorStudioNoticeModal({
        </header>

        <div className="px-6 py-5">
-          <p className="text-[14px] font-medium leading-relaxed text-[#4f596b]">
-            개발 스튜디오는 수강생 실습용 화면입니다. 강사 계정은 강사포털에서 수강생 관리, 채팅, 학습 진행 현황을 확인해 주세요.
-          </p>
+          <p className="text-[14px] font-medium leading-relaxed text-[#4f596b]">{t("개발 스튜디오는 수강생 실습용 화면입니다. 강사 계정은 강사포털에서 수강생 관리, 채팅, 학습 진행 현황을 확인해 주세요.")}</p>
          <button
            type="button"
            onClick={onClose}
            className="mt-5 flex h-10 w-full cursor-pointer items-center justify-center rounded-md bg-[#714ef6] text-[14px] font-bold text-white transition hover:bg-[#6040df]"
-          >
-            확인
-          </button>
+          >{t("확인")}</button>
        </div>
      </section>
    </div>
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { BookOpen, Car, Clock3, FileText, Play } from 'lucide-react'
 import type React from 'react'

@@ -24,15 +25,14 @@ export default function LearningInfoCard({
  onStartStudio,
  onOpenMaterials
 }: LearningInfoCardProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <article className="rounded-lg bg-white p-4">
      <span className="flex items-center gap-1.5 text-[11px] font-semibold text-[#626b7a]">
-        <BookOpen size={13} className="text-[#714ef6]" />
-        학습 정보
-      </span>
+        <BookOpen size={13} className="text-[#714ef6]" />{t("학습 정보")}</span>
      <div className="mt-1.5 flex items-start justify-between gap-2.5">
        <div className="min-w-0">
-          <strong className="block truncate text-[18px] font-bold">{week.week}주차</strong>
+          <strong className="block truncate text-[18px] font-bold">{t('{{week}}주차', { week: week.week })}</strong>
          <span className="mt-1 block text-[12px] font-medium leading-snug text-[#4f596b]">{week.title}</span>
        </div>
        <em
@@ -41,12 +41,12 @@ export default function LearningInfoCard({
            week.tags[1] === '완료' ? 'bg-[#2fbda0]/15 text-[#178c78]' : 'bg-[#6f4df6]/15 text-[#6f4df6]'
          ].join(' ')}
        >
-          {week.tags[1] ?? '미등록'}
+          {t(week.tags[1] ?? '미등록')}
        </em>
      </div>

      <div className="mt-4">
-        <span className="block text-[12px] font-medium text-[#505b70]">진행률</span>
+        <span className="block text-[12px] font-medium text-[#505b70]">{t("진행률")}</span>
        <div className="mt-1 flex items-center gap-2.5">
          <span className="w-9 shrink-0 text-right text-[13px] font-bold">{week.progress}%</span>
          <div className="h-1.5 flex-1 overflow-hidden rounded-full bg-[#d7dae3]">
@@ -57,8 +57,8 @@ export default function LearningInfoCard({

      <div className="my-[17px] overflow-hidden rounded-lg border border-[#dfe3ed] bg-[#fbfcff] py-1">
        {[
-          { label: '플랫폼', value: week.tags[0] ?? '-', Icon: Car },
-          { label: '예상 학습 시간', value: week.duration, Icon: Clock3 }
+          { label: t("플랫폼"), value: week.tags[0] ?? '-', Icon: Car },
+          { label: t("예상 학습 시간"), value: week.duration, Icon: Clock3 }
        ].map(({ label, value, Icon }) => (
          <div
            key={label}
@@ -84,30 +84,26 @@ export default function LearningInfoCard({
        disabled={studioDisabled}
        onClick={onStartStudio}
        className={[
-          'flex h-[39px] w-full items-center justify-center gap-2 rounded-md border-0 text-[14px] font-bold transition-all duration-150 ease-out',
+          'flex h-[39px] w-full items-center justify-center gap-2 rounded-md border-0 text-[14px] font-bold leading-none transition-all duration-150 ease-out',
          studioDisabled
            ? 'cursor-not-allowed bg-[#d8dce5] text-[#8a91a0]'
            : 'cursor-pointer bg-[#714ef6] text-white shadow-[0_8px_18px_rgba(113,78,246,0.20)] hover:-translate-y-px hover:bg-[#6040df] hover:shadow-[0_10px_20px_rgba(113,78,246,0.26)] active:translate-y-0 active:shadow-[0_6px_14px_rgba(113,78,246,0.18)]'
        ].join(' ')}
      >
-        <Play size={15} fill="currentColor" strokeWidth={2.4} />
-        개발 스튜디오 시작
-      </button>
+        <Play size={15} fill="currentColor" strokeWidth={2.4} />{t("개발 스튜디오 시작")}</button>
      <button
        type="button"
        data-help="curriculum-materials"
        disabled={!hasMaterials}
        onClick={onOpenMaterials}
        className={[
-          'mt-2.5 flex h-[39px] w-full items-center justify-center gap-2 rounded-md border text-[14px] font-bold transition-all duration-150 ease-out',
+          'mt-2.5 flex h-[39px] w-full items-center justify-center gap-2 rounded-md border text-[14px] font-bold leading-none transition-all duration-150 ease-out',
          hasMaterials
            ? 'cursor-pointer border-[#714ef6] bg-white text-[#714ef6] hover:-translate-y-px hover:bg-[#f5f2ff] hover:shadow-[0_8px_16px_rgba(113,78,246,0.13)] active:translate-y-0 active:shadow-none'
            : 'cursor-not-allowed border-[#d8dce5] bg-[#f3f4f7] text-[#9aa1af]'
        ].join(' ')}
      >
-        <FileText size={15} strokeWidth={2.4} />
-        강의 자료
-      </button>
+        <FileText size={15} strokeWidth={2.4} />{t("강의 자료")}</button>
    </article>
  )
 }
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { CheckCircle2, Clock3, Gauge, TrendingUp } from 'lucide-react'
 import type { LucideIcon } from 'lucide-react'
 import type React from 'react'
@@ -22,22 +23,21 @@ type LearningStatsCardProps = {
 }

 export default function LearningStatsCard({ guideMode = false, stats }: LearningStatsCardProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <section className="rounded-lg border border-[#d6dce8] bg-white/95 p-4 shadow-[0_16px_36px_rgba(20,27,44,0.10)]">
      <div>
        <div>
-          <strong className="block font-bold">{guideMode ? '체험 강좌' : '내 학습 현황'}</strong>
+          <strong className="block font-bold">{guideMode ? t("체험 강좌") : t("내 학습 현황")}</strong>
          <span className="mt-1 block text-[12px] font-medium text-[#5f6878]">
-            {guideMode ? '배정 전 사용법 안내 과정' : '전체 진행 상황 및 통계'}
+            {guideMode ? t("배정 전 사용법 안내 과정") : t("전체 진행 상황 및 통계")}
          </span>
        </div>
      </div>

      <div className="mt-4 overflow-hidden rounded-lg border border-[#dfe3ed] bg-[#fbfcff] shadow-[0_10px_24px_rgba(20,27,44,0.06)]">
        {guideMode ? (
-          <div className="px-4 py-5 text-[12px] font-medium leading-relaxed text-[#5f6878]">
-            이 강좌는 Autonomy Studio LMS 사용법을 확인하기 위한 공통 안내입니다. 실제 학습 시간, 커밋 수, 제출 현황은 강사가 배정한 강좌에서부터 집계됩니다.
-          </div>
+          <div className="px-4 py-5 text-[12px] font-medium leading-relaxed text-[#5f6878]">{t("이 강좌는 Autonomy Studio LMS 사용법을 확인하기 위한 공통 안내입니다. 실제 학습 시간, 커밋 수, 제출 현황은 강사가 배정한 강좌에서부터 집계됩니다.")}</div>
        ) : stats.length ? (
          stats.map(({ value, label, iconKey }, index) => {
            const Icon = STAT_ICONS[iconKey] ?? Gauge
@@ -53,16 +53,14 @@ export default function LearningStatsCard({ guideMode = false, stats }: Learning
                  <span className="grid h-8 w-8 shrink-0 place-items-center rounded-full bg-[#e9e3ff] text-[#5b48c9]">
                    <Icon size={15} strokeWidth={2.4} />
                  </span>
-                  <span className="truncate text-[12px] font-medium text-[#4f596b]">{label}</span>
+                  <span className="truncate text-[12px] font-medium text-[#4f596b]">{t(label)}</span>
                </div>
                <strong className="shrink-0 text-right text-[15px] font-bold text-[#151827]">{value}</strong>
              </div>
            )
          })
        ) : (
-          <div className="px-4 py-6 text-center text-[12px] font-semibold text-[#687284]">
-            학습 현황 데이터가 없습니다.
-          </div>
+          <div className="px-4 py-6 text-center text-[12px] font-semibold text-[#687284]">{t("학습 현황 데이터가 없습니다.")}</div>
        )}
      </div>
    </section>
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { Download, FileText, X } from 'lucide-react'
 import type React from 'react'

@@ -9,7 +10,6 @@ type DownloadResource = {
 }

 type MaterialsModalProps<Resource extends DownloadResource> = {
-  sidebarCollapsed: boolean
  week: {
    week: number
    title: string
@@ -22,7 +22,6 @@ type MaterialsModalProps<Resource extends DownloadResource> = {
 }

 export default function MaterialsModal<Resource extends DownloadResource>({
-  sidebarCollapsed,
  week,
  resources,
  downloadingResourceIds,
@@ -30,23 +29,21 @@ export default function MaterialsModal<Resource extends DownloadResource>({
  onClose,
  onDownload
 }: MaterialsModalProps<Resource>): React.JSX.Element {
+  useLocaleRender()
  return (
    <div
-      className={[
-        'fixed bottom-0 right-0 top-[38px] z-[70] grid place-items-center bg-[#080a10]/40 p-6 backdrop-blur-[3px]',
-        sidebarCollapsed ? 'left-[68px]' : 'left-[240px]'
-      ].join(' ')}
+      className="fixed bottom-0 left-0 right-0 top-[38px] z-[70] grid place-items-center bg-[#080a10]/40 p-6 backdrop-blur-[3px]"
    >
      <section className="flex max-h-[620px] w-full max-w-[560px] flex-col overflow-hidden rounded-xl border border-[#dfe3ed] bg-white shadow-[0_28px_80px_rgba(8,10,16,0.30)]">
        <header className="flex items-start justify-between gap-4 border-b border-[#e5e8ef] px-6 pb-4 pt-5">
          <div className="min-w-0">
-            <span className="text-[12px] font-medium text-[#6f4df6]">{week.week}주차</span>
-            <h2 className="mt-1 text-[22px] font-bold leading-tight text-[#111520]">강의 자료</h2>
+            <span className="text-[12px] font-medium text-[#6f4df6]">{t('{{week}}주차', { week: week.week })}</span>
+            <h2 className="mt-1 text-[22px] font-bold leading-tight text-[#111520]">{t("강의 자료")}</h2>
            <p className="mt-2 truncate text-[13px] font-medium text-[#5f6878]">{week.title}</p>
          </div>
          <button
            type="button"
-            aria-label="닫기"
+            aria-label={t("닫기")}
            onClick={onClose}
            className="grid h-8 w-8 shrink-0 cursor-pointer place-items-center rounded-md text-[#697386] transition hover:bg-[#f0f2f7] hover:text-[#111520]"
          >
@@ -80,7 +77,7 @@ export default function MaterialsModal<Resource extends DownloadResource>({
                    className="flex h-9 shrink-0 cursor-pointer items-center justify-center gap-1.5 rounded-md border border-[#714ef6] bg-[#714ef6] px-3 text-[12px] font-bold text-white transition hover:bg-[#6040df] disabled:cursor-not-allowed disabled:opacity-60"
                  >
                    <Download size={14} />
-                    {downloading ? '다운로드 중' : '다운로드'}
+                    {downloading ? t("다운로드 중") : t("다운로드")}
                  </button>
                </article>
              )
@@ -22,6 +22,7 @@ export default function WeekCard<Week extends WeekCardWeek>({
  selected = false,
  onSelect
 }: WeekCardProps<Week>): React.JSX.Element {
+  useLocaleRender()
  const locked = week.state === 'locked'
  const isDone = week.state === 'done'
  const isCurrent = week.state === 'current'
@@ -87,7 +88,7 @@ export default function WeekCard<Week extends WeekCardWeek>({
                    : 'bg-[#e7edf5] text-[#506178]'
              ].join(' ')}
            >
-              {tag}
+              {index === 1 ? t(tag) : tag}
            </span>
          ))}
        </div>
@@ -104,3 +105,4 @@ export default function WeekCard<Week extends WeekCardWeek>({
    </button>
  )
 }
+import { t, useLocaleRender } from '../../i18n'
@@ -1,6 +1,18 @@
 import type { DriveStep } from 'driver.js'
+import { t } from '../../i18n'

-export function getContextHelpSteps({
+export function getContextHelpSteps(options: Parameters<typeof buildContextHelpSteps>[0]): DriveStep[] {
+  return buildContextHelpSteps(options).map(step => ({
+    ...step,
+    popover: step.popover ? {
+      ...step.popover,
+      title: step.popover.title ? t(step.popover.title) : undefined,
+      description: step.popover.description ? t(step.popover.description) : undefined
+    } : undefined
+  }))
+}
+
+function buildContextHelpSteps({
  platformModalOpen,
  localPcLayoutOpen,
  aiGuideOpen
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { AlertCircle, CheckCircle2, Link2, LoaderCircle, Lock, Power, Settings } from 'lucide-react'
 import type { LucideIcon } from 'lucide-react'
 import type React from 'react'
@@ -22,6 +23,7 @@ export function RunningPlatformCard({
  onOpen,
  onClose
 }: RunningPlatformCardProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <article className="flex items-center gap-4 rounded-lg border border-[#dfe3ed] bg-white p-4 shadow-[0_10px_24px_rgba(20,27,44,0.06)]">
      <div className="relative grid h-12 w-12 shrink-0 place-items-center rounded-lg bg-[#ede9ff] text-[#714ef6]">
@@ -29,7 +31,7 @@ export function RunningPlatformCard({
        <span className={['absolute right-2.5 top-2.5 h-2 w-2 rounded-full ring-2 ring-white', dotClassName].join(' ')} />
      </div>
      <div className="min-w-0 flex-1">
-        <h3 className="truncate text-[15px] font-bold text-[#111520]">{platform.title}</h3>
+        <h3 className="truncate text-[15px] font-bold text-[#111520]">{platform.platformKey === 'futuredrive-local-pc' ? t('시뮬레이션') : platform.title}</h3>
        <p className="mt-1 text-[12px] font-medium text-[#5f6878]">{weekTitle}</p>
      </div>
      <div className="grid shrink-0 gap-2">
@@ -38,18 +40,14 @@ export function RunningPlatformCard({
          onClick={onOpen}
          className="flex h-9 min-w-[86px] cursor-pointer items-center justify-center gap-1.5 rounded-md border border-[#714ef6] bg-[#714ef6] px-3 text-[12px] font-bold text-white transition hover:bg-[#6040df]"
        >
-          <Link2 size={14} />
-          연결
-        </button>
+          <Link2 size={14} />{t("연결")}</button>
        <button
          type="button"
          disabled={disabled}
          onClick={onClose}
          className="flex h-8 min-w-[86px] cursor-pointer items-center justify-center gap-1.5 rounded-md border border-[#e58b8b] bg-white px-3 text-[12px] font-bold text-[#c24141] shadow-[0_1px_2px_rgba(20,27,44,0.08),inset_0_1px_0_rgba(255,255,255,0.70)] transition hover:border-[#d95f5f] hover:bg-[#fff7f7] hover:text-[#b91c1c] disabled:cursor-not-allowed disabled:border-[#c9d0dc] disabled:bg-[#f3f4f7] disabled:text-[#8a91a0]"
        >
-          <Power size={14} />
-          종료
-        </button>
+          <Power size={14} />{t("종료")}</button>
      </div>
    </article>
  )
@@ -82,6 +80,7 @@ export function PlatformOptionCard({
  onAction,
  onSettings
 }: PlatformOptionCardProps): React.JSX.Element {
+  useLocaleRender()
  const ready = platform.state === 'ready'
  const reserved = platform.state === 'reserved'
  const locked = platform.state === 'locked'
@@ -104,9 +103,13 @@ export function PlatformOptionCard({

      <div className="min-w-0 flex-1">
        <div className="flex items-center gap-2">
-          <h3 className="truncate text-[15px] font-bold text-[#111520]">{platform.title}</h3>
+          <h3 className="truncate text-[15px] font-bold text-[#111520]">{platform.platformKey === 'futuredrive-local-pc' ? t('시뮬레이션') : platform.title}</h3>
        </div>
-        <p className="mt-1 text-[12px] font-medium text-[#5f6878]">{platform.description}</p>
+        <p className="mt-1 text-[12px] font-medium text-[#5f6878]">
+          {platform.platformKey === 'futuredrive-local-pc' && platform.description === '내 PC에서 직접 개발 환경을 실행합니다.'
+            ? t('내 PC에서 직접 개발 환경을 실행합니다.')
+            : platform.description}
+        </p>
        <div className="mt-2 flex items-center gap-1.5 text-[11px] font-bold text-[#5f6878]">
          {statusPending
            ? <LoaderCircle size={13} className="animate-spin text-[#7a879a]" />
@@ -117,7 +120,7 @@ export function PlatformOptionCard({
                : locked
                  ? <Lock size={13} className="text-[#7a8090]" />
                  : <AlertCircle size={13} className="text-[#c58a1d]" />}
-          {displayStatus}
+          {t(displayStatus)}
        </div>
      </div>

@@ -138,16 +141,14 @@ export function PlatformOptionCard({
          ].join(' ')}
        >
          {running ? null : <Link2 size={14} />}
-          {running ? '실행중' : primaryAction}
+          {running ? t("실행중") : t(primaryAction)}
        </button>
        <button
          type="button"
          onClick={onSettings}
-          className="flex h-8 w-[86px] cursor-pointer items-center justify-center gap-1.5 rounded-md border border-[#94a3b8] bg-white px-3 text-[12px] font-bold text-[#4f596b] shadow-[0_1px_2px_rgba(20,27,44,0.08),inset_0_1px_0_rgba(255,255,255,0.70)] transition hover:border-[#64748b] hover:bg-[#f8f9fc] hover:text-[#111520]"
+          className="flex h-8 min-w-[86px] cursor-pointer items-center justify-center gap-1.5 rounded-md border border-[#94a3b8] bg-white px-3 text-[12px] font-bold text-[#4f596b] shadow-[0_1px_2px_rgba(20,27,44,0.08),inset_0_1px_0_rgba(255,255,255,0.70)] transition hover:border-[#64748b] hover:bg-[#f8f9fc] hover:text-[#111520]"
        >
-          <Settings size={14} />
-          설정
-        </button>
+          <Settings className="shrink-0" size={14} />{t("설정")}</button>
      </div>
    </article>
  )
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import type React from 'react'

 export type PlatformFilter = 'all' | 'available' | 'unavailable'
@@ -19,6 +20,7 @@ export default function PlatformFilterTabs({
  counts,
  onChange
 }: PlatformFilterTabsProps): React.JSX.Element {
+  useLocaleRender()
  const tabs: PlatformFilterTab[] = [
    { id: 'all', label: '전체', count: counts.all },
    { id: 'available', label: '사용가능', count: counts.available },
@@ -41,7 +43,7 @@ export default function PlatformFilterTabs({
              : 'border-[#d7dde8] bg-white text-[#4f596b] hover:bg-[#f8f9fc] hover:text-[#111520]'
          ].join(' ')}
        >
-          {tab.label} ({tab.count})
+          {t(tab.label)} ({tab.count})
        </button>
      ))}
    </div>
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { ChevronLeft, X } from 'lucide-react'
 import type React from 'react'
 import PlatformLoadingOverlay from '../../components/PlatformLoadingOverlay'
@@ -23,6 +24,7 @@ export default function PlatformSelectModal({
  onClose,
  children
 }: PlatformSelectModalProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className="fixed bottom-0 left-0 right-0 top-[38px] z-50 grid place-items-center bg-[#080a10]/35 p-6 backdrop-blur-[2px]">
      <section className="flex h-[min(660px,calc(100vh-86px))] w-full max-w-[560px] flex-col overflow-hidden rounded-xl border border-[#dfe3ed] bg-white shadow-[0_28px_80px_rgba(8,10,16,0.28)]">
@@ -33,24 +35,24 @@ export default function PlatformSelectModal({
              {mode === 'settings' && (
                <button
                  type="button"
-                  aria-label="플랫폼 선택으로 돌아가기"
+                  aria-label={t("플랫폼 선택으로 돌아가기")}
                  onClick={onBack}
                  className="grid h-7 w-7 cursor-pointer place-items-center rounded-md text-[#697386] transition hover:bg-[#f0f2f7] hover:text-[#111520]"
                >
                  <ChevronLeft size={18} />
                </button>
              )}
-              {mode === 'settings' ? '플랫폼 설정' : '플랫폼 선택'}
+              {mode === 'settings' ? t("플랫폼 설정") : t("플랫폼 선택")}
            </h2>
            <p className="mt-2 text-[13px] font-medium text-[#5f6878]">
              {mode === 'settings'
-                ? '플랫폼별 개발 환경 설정을 관리하세요.'
-                : '실습을 진행할 플랫폼을 선택하고 제어권을 요청하세요.'}
+                ? t("플랫폼별 개발 환경 설정을 관리하세요.")
+                : t("실습을 진행할 플랫폼을 선택하고 제어권을 요청하세요.")}
            </p>
          </div>
          <button
            type="button"
-            aria-label="닫기"
+            aria-label={t("닫기")}
            onClick={onClose}
            className="grid h-8 w-8 shrink-0 cursor-pointer place-items-center rounded-md text-[#697386] transition hover:bg-[#f0f2f7] hover:text-[#111520]"
          >
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import { CarFront, Laptop, Monitor } from 'lucide-react'
 import type { LucideIcon } from 'lucide-react'
 import type React from 'react'
@@ -46,11 +47,12 @@ export default function PlatformSelectionPanel({
  onPlatformAction,
  onOpenSettings
 }: PlatformSelectionPanelProps): React.JSX.Element {
+  useLocaleRender()
  return (
    <div className={['h-full min-h-0 w-1/2 shrink-0 overflow-y-auto px-6 pb-5 pt-3 pr-5 transition-opacity duration-300', mode === 'settings' ? 'opacity-0' : 'opacity-100'].join(' ')}>
      {runningPlatforms.length > 0 && (
        <div className="mb-4 pr-1">
-          <p className="mb-2 text-[12px] font-black text-[#2563eb]">실행중인 플랫폼</p>
+          <p className="mb-2 text-[12px] font-black text-[#2563eb]">{t("실행중인 플랫폼")}</p>
          <div className="grid gap-3">
            {runningPlatforms.map((platform) => {
              const Icon = PLATFORM_ICONS[platform.iconKey] ?? Monitor
@@ -89,12 +91,12 @@ export default function PlatformSelectionPanel({
          const actionDisabled = statusPending || locked || unavailable
          const runningInSelectionList = runningPlatforms.some((runningPlatform) => runningPlatform.id === platform.id)
          const displayStatus = statusPending
-            ? '확인 중'
-            : unavailable && !status.includes('연결 끊김') && !status.includes('연결 불가')
-            ? '연결 끊김'
+            ? t("확인 중")
+            : unavailable && !status.includes(t("연결 끊김")) && !status.includes(t("연결 불가"))
+            ? t("연결 끊김")
            : status
          const hasControl = platform.control?.status === 'ACTIVE'
-          const primaryAction = statusPending ? '확인 중' : hasControl ? '연결' : action
+          const primaryAction = statusPending ? t("확인 중") : hasControl ? t("연결") : action
          const platformActionDisabled = runningInSelectionList || actionDisabled

          return (
@@ -119,8 +121,8 @@ export default function PlatformSelectionPanel({
        }) : (
          <div className="grid min-h-[220px] place-items-center rounded-lg border border-dashed border-[#d9deea] bg-[#fbfcff] px-6 text-center">
            <div>
-              <strong className="block text-[15px] font-bold text-[#111520]">사용 가능한 플랫폼 데이터가 없습니다.</strong>
-              <p className="mt-2 text-[13px] font-medium text-[#687284]">강의에 배정된 플랫폼을 불러오지 못했거나 아직 등록된 데이터가 없습니다.</p>
+              <strong className="block text-[15px] font-bold text-[#111520]">{t("사용 가능한 플랫폼 데이터가 없습니다.")}</strong>
+              <p className="mt-2 text-[13px] font-medium text-[#687284]">{t("강의에 배정된 플랫폼을 불러오지 못했거나 아직 등록된 데이터가 없습니다.")}</p>
            </div>
          </div>
        )}
@@ -1,3 +1,4 @@
+import { t, useLocaleRender } from '../../i18n'
 import type React from 'react'
 import { StudioSettingsField, StudioSettingsSwitch } from '../workspace/StudioSettingsControls'
 import type { PlatformOption, StudioSourceSettings } from './types'
@@ -25,28 +26,25 @@ export default function PlatformSettingsPanel({
  onClose,
  onSave
 }: PlatformSettingsPanelProps): React.JSX.Element {
+  useLocaleRender()
  const localPc = target?.platformKey === 'futuredrive-local-pc'

  return (
    <div className="h-full overflow-y-auto pr-1">
      <div className="mb-5 border-b border-[#e5e8ef] pb-3">
-        <h3 className="text-[15px] font-black text-[#4f596b]">{target?.title ?? '플랫폼'}</h3>
+        <h3 className="text-[15px] font-black text-[#4f596b]">{target?.title ?? t("플랫폼")}</h3>
      </div>
      <div className="rounded-lg border border-[#dfe3ed] bg-[#fbfcff] p-4">
        {!localPc ? (
          <div>
-            <p className="text-[13px] font-black text-[#111520]">공용 플랫폼 환경</p>
-            <p className="mt-2 text-[12px] font-semibold leading-relaxed text-[#5f6878]">
-              원격 플랫폼의 워크스페이스, 저장소, GPU 설정은 강사/관리자 플랫폼 설정을 사용합니다.
-            </p>
-            <div className="mt-4 rounded-md bg-white px-3 py-2 text-[12px] font-semibold text-[#4f596b]">
-              실행 방식: 세션 단위 임시 런타임
-            </div>
+            <p className="text-[13px] font-black text-[#111520]">{t("공용 플랫폼 환경")}</p>
+            <p className="mt-2 text-[12px] font-semibold leading-relaxed text-[#5f6878]">{t("원격 플랫폼의 워크스페이스, 저장소, GPU 설정은 강사/관리자 플랫폼 설정을 사용합니다.")}</p>
+            <div className="mt-4 rounded-md bg-white px-3 py-2 text-[12px] font-semibold text-[#4f596b]">{t("실행 방식: 세션 단위 임시 런타임")}</div>
            {canResetRosSession && (
              <div className="mt-4 flex items-center justify-between gap-4 rounded-md border border-[#dfe3ed] bg-white px-3 py-3">
                <div>
-                  <p className="text-[12px] font-black text-[#273142]">ROS 연결 초기화</p>
-                  <p className="mt-1 text-[11px] font-medium leading-relaxed text-[#697386]">실행 중인 모듈과 이전 피어 설정을 정리합니다.</p>
+                  <p className="text-[12px] font-black text-[#273142]">{t("ROS 연결 초기화")}</p>
+                  <p className="mt-1 text-[11px] font-medium leading-relaxed text-[#697386]">{t("실행 중인 모듈과 이전 피어 설정을 정리합니다.")}</p>
                </div>
                <button
                  type="button"
@@ -59,7 +57,7 @@ export default function PlatformSettingsPanel({
                      : 'cursor-pointer border-[#d7dde8] bg-white text-[#4f596b] hover:border-[#2563eb] hover:text-[#2563eb]'
                  ].join(' ')}
                >
-                  {resettingRosSession ? '초기화 중' : '초기화'}
+                  {resettingRosSession ? t("초기화 중") : t("초기화")}
                </button>
              </div>
            )}
@@ -67,7 +65,7 @@ export default function PlatformSettingsPanel({
        ) : (
          <>
            <StudioSettingsField
-              label="사용자 워크스페이스 루트"
+              label={t("사용자 워크스페이스 루트")}
              value={draft.workspaceRoot}
              onChange={(value) => onDraftChange((settings) => ({ ...settings, workspaceRoot: value }))}
              dark={false}
@@ -82,15 +80,15 @@ export default function PlatformSettingsPanel({
            </div>
            <div className="mt-4">
              <StudioSettingsSwitch
-                label="GPU 가속"
-                description="ON이면 Docker 실행 시 NVIDIA GPU를 사용합니다."
+                label={t("GPU 가속")}
+                description={t("모듈 Docker 실행 시 NVIDIA GPU를 사용합니다.")}
                checked={draft.gpuEnabled}
                onChange={(checked) => onDraftChange((settings) => ({ ...settings, gpuEnabled: checked }))}
                dark={false}
              />
            </div>
            <div className="mt-4 rounded-lg border border-[#e1e6ef] bg-white p-4">
-              <p className="text-[12px] font-black text-[#4f596b]">저장소</p>
+              <p className="text-[12px] font-black text-[#4f596b]">{t("저장소")}</p>
              <div className="mt-3 rounded-md bg-[#f8fafc] px-3 py-2 font-mono text-[12px] text-[#4f596b]">
                clone path: {clonePath}
              </div>
@@ -104,16 +102,14 @@ export default function PlatformSettingsPanel({
          onClick={onClose}
          className="h-9 cursor-pointer rounded-md border border-[#d7dde8] bg-white px-4 text-[12px] font-bold text-[#4f596b] transition hover:bg-[#f8f9fc] hover:text-[#111520]"
        >
-          {!localPc ? '확인' : '취소'}
+          {!localPc ? t("확인") : t("취소")}
        </button>
        {localPc && (
          <button
            type="button"
            onClick={onSave}
            className="h-9 cursor-pointer rounded-md border border-[#2563eb] bg-[#2563eb] px-4 text-[12px] font-bold text-white transition hover:bg-[#1d4ed8]"
-          >
-            저장
-          </button>
+          >{t("저장")}</button>
        )}
      </div>
    </div>
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
chyoo	017093077f	feat: preserve compact agent context and bump to 1.2.25	2026-10-29 10:39:20 +09:00
chyoo	af6dc560ea	fix: show agent messages before workspace lookup and bump to 1.2.24	2026-10-20 12:57:12 +09:00
chyoo	065de83ffd	fix: open agent model picker above chat attachment controls	2026-10-20 11:45:12 +09:00
chyoo	a8dd23675a	feat: improve agent model selection and remote source analysis; bump to 1.2.23	2026-10-20 11:36:28 +09:00
chyoo	cb5872c326	chore: bump version to 1.2.22	2026-10-20 10:21:10 +09:00
chyoo	af54e875df	feat: support multiple camera previews and concurrent agent code navigation	2026-10-20 10:10:48 +09:00
chyoo	c17763f59d	chore: bump version to 1.2.21	2026-10-19 17:29:40 +09:00
chyoo	00a83ce4ac	fix: simplify code navigation and support Gazebo XML files Remove redundant code-view cancellation and align button labels. Restore module scrollbar thickness while preserving workspace colors, and support config, SDF and world text files locally and remotely.	2026-10-19 17:29:02 +09:00
chyoo	b7870cffa2	chore: release 1.2.20 with rounded viewer collapse controls	2026-10-19 17:09:51 +09:00
chyoo	8b501266ff	feat: improve agent responses and workspace UI Add live agent progress, elapsed timing, verified code navigation and rich Markdown rendering. Preserve NanumSquare styling with missing glyph fallback, fix platform availability filtering and unify workspace scrollbar and visualization controls.	2026-10-19 17:06:18 +09:00
chyoo	af21fa0510	fix: hide agent file attachments for A-Copilot	2026-10-19 14:50:08 +09:00
chyoo	7cfd466350	chore: bump LMS app version to 1.2.19	2026-10-19 14:47:48 +09:00
chyoo	4321d944b5	fix: refine agent image attachments and restore Korean filenames	2026-10-19 14:47:21 +09:00
chyoo	234c9ad467	fix: localize simulation description and display A-Copilot in v1.2.18	2026-10-19 14:13:39 +09:00
chyoo	6512f5fa04	feat: add agent image attachments and bump version to 1.2.17	2026-10-19 13:34:06 +09:00
chyoo	7b32668e1d	feat: improve chat input, themed menus and agent proposal cancellation	2026-10-19 13:12:04 +09:00
chyoo	105342fbf3	chore: bump app version to 1.2.16	2026-10-19 11:37:32 +09:00
chyoo	cc589fd8cf	feat: add structured agent tools and improve workspace chat UX	2026-10-19 11:30:23 +09:00
chyoo	098af30fa7	fix(chat): hide agent tab when course agent is disabled	2026-10-16 11:18:09 +09:00
chyoo	280b000496	chore: bump app version to 1.2.15	2026-10-16 11:15:28 +09:00
chyoo	4bdc5af620	feat(chat): add agent attachments and shared conversation confirmation	2026-10-16 11:14:01 +09:00
chyoo	ef260c8fb4	Merge codex/ai-agent into develop for v1.2.14	2026-10-15 14:55:08 +09:00
chyoo	1c0d861051	feat(ai): improve agent workflows and persistence for v1.2.14	2026-10-15 14:39:01 +09:00
chyoo	832420f8f9	version up!	2026-10-14 15:16:46 +09:00
chyoo	53518d1114	version up!	2026-10-14 15:15:28 +09:00
chyoo	654fc722f9	feat: add reviewable workspace AI agent	2026-10-14 14:25:46 +09:00
chyoo	cf8d81348d	chore: bump LMS version to 1.2.8	2026-10-14 14:06:44 +09:00
chyoo	db9201fd05	feat: add camera preview toggle to visualization	2026-10-14 14:06:44 +09:00
chyoo	c9cceb4c01	fix: preserve remote workspace changes across sessions	2026-10-14 14:06:44 +09:00
chyoo	debb38a29b	fix: detect remote SLAM bridge and clear loading state on response	2026-10-13 15:08:12 +09:00
chyoo	b0a4c2b1e6	fix: use actual local platform ID to resolve linked ROS settings	2026-09-30 17:06:26 +09:00
chyoo	08f74575c2	feat: support simultaneous Tailscale and LAN communication for Yahboom cameras	2026-09-30 15:37:17 +09:00
chyoo	9387ade537	hot fix	2026-09-29 16:53:49 +09:00
chyoo	6b4ab4365e	hot fix	2026-09-29 16:53:20 +09:00
chyoo	a7fe81e658	version up!	2026-09-29 16:43:21 +09:00
chyoo	fb8c15dfd3	feat: add daily logging and improve workspace UI and ROS status	2026-09-29 16:42:34 +09:00
chyoo	0a15102f8c	version up!	2026-09-29 13:27:46 +09:00
chyoo	d44180db67	feat: add Korean-English localization and light theme Localize studio, curriculum, visualization and loading interfaces. Add persistent language and theme settings, refine module loading states, and normalize remote shell locales.	2026-09-29 13:27:11 +09:00
chyoo	4125f71792	fix: center studio warning and course materials modals	2026-09-28 08:57:50 +09:00