ltcai 0.1.1 → 0.1.3

package/static/{indexd.html → chat.html}

@@ -335,6 +335,8 @@
             background: rgba(29,42,60,0.82);
             backdrop-filter: blur(20px);
             -webkit-backdrop-filter: blur(20px);
+            position: relative;
+            z-index: 50;
         }
 
         .header-left, .header-pills {
@@ -407,7 +409,7 @@
             background: rgba(255,255,255,0.04);
         }
 
-        .pw-modal-overlay {
+        .acct-modal-overlay {
             display: none;
             position: fixed;
             inset: 0;
@@ -417,20 +419,31 @@
             align-items: center;
             justify-content: center;
         }
-        .pw-modal-overlay.open { display: flex; }
-        .pw-modal {
+        .acct-modal-overlay.open { display: flex; }
+        .acct-modal {
             background: var(--surface, #1e293b);
             border: 1px solid rgba(255,255,255,0.08);
             border-radius: 16px;
-            padding: 28px;
             width: 100%;
-            max-width: 360px;
+            max-width: 380px;
             display: flex;
             flex-direction: column;
-            gap: 16px;
             box-shadow: 0 20px 60px rgba(0,0,0,0.5);
+            overflow: hidden;
         }
-        .pw-modal h3 { font-size: 15px; font-weight: 600; margin: 0; }
+        .acct-tabs {
+            display: flex;
+            border-bottom: 1px solid rgba(255,255,255,0.07);
+        }
+        .acct-tab {
+            flex: 1; padding: 14px; font-size: 13px; font-weight: 500;
+            background: none; border: none; color: var(--muted); cursor: pointer;
+            transition: all .15s; border-bottom: 2px solid transparent;
+        }
+        .acct-tab.active { color: var(--text, #f8fafc); border-bottom-color: var(--accent, #6366f1); }
+        .acct-body { padding: 24px; display: flex; flex-direction: column; gap: 14px; }
+        .acct-tab-panel { display: none; flex-direction: column; gap: 14px; }
+        .acct-tab-panel.active { display: flex; }
         .pw-field { display: flex; flex-direction: column; gap: 5px; }
         .pw-field label { font-size: 11px; color: var(--muted); }
         .pw-field input {
@@ -457,6 +470,41 @@
         .pw-msg.error { color: #f87171; }
         .pw-msg.success { color: #4ade80; }
 
+        .lang-picker { position: relative; }
+        .lang-picker-menu {
+            display: none;
+            position: absolute;
+            top: calc(100% + 6px);
+            right: 0;
+            background: #1e293b;
+            border: 1px solid rgba(255,255,255,0.1);
+            border-radius: 10px;
+            overflow: hidden;
+            box-shadow: 0 8px 24px rgba(0,0,0,0.4);
+            z-index: 200;
+            min-width: 90px;
+        }
+        .lang-picker-menu.open { display: block; }
+        .lang-option {
+            display: flex; align-items: center; gap: 8px;
+            padding: 9px 14px; font-size: 13px; cursor: pointer;
+            color: var(--muted); transition: background .12s;
+        }
+        .lang-option:hover { background: rgba(255,255,255,0.06); color: var(--text, #f8fafc); }
+        .lang-option.active { color: var(--accent, #6366f1); font-weight: 600; }
+
+        .auth-lang-picker {
+            position: absolute; top: 20px; right: 20px;
+        }
+        .auth-lang-btn {
+            background: rgba(255,255,255,0.07);
+            border: 1px solid rgba(255,255,255,0.12);
+            color: #94a3b8; font-size: 12px; padding: 5px 10px;
+            border-radius: 8px; cursor: pointer; transition: all .15s;
+        }
+        .auth-lang-btn:hover { background: rgba(255,255,255,0.12); color: #f8fafc; }
+        .auth-lang-picker .lang-picker-menu { top: calc(100% + 6px); right: 0; }
+
         .messages-viewport {
             flex: 1;
             overflow-y: auto;
@@ -2761,34 +2809,6 @@
     </div>
     <div class="bg-grid"></div>
 
-    <div id="auth-overlay" class="auth-overlay">
-        <div class="auth-orb auth-orb-1"></div>
-        <div class="auth-orb auth-orb-2"></div>
-        <div class="auth-card">
-            <div id="login-form">
-                <div class="auth-logo"><i class="ti ti-brain"></i></div>
-                <h2 class="auth-title">Lattice AI</h2>
-                <p class="auth-subtitle">Local AI Workspace — Apple Silicon</p>
-                <input class="auth-input" type="email" id="login-email" placeholder="이메일 주소">
-                <input class="auth-input" type="password" id="login-pw" placeholder="비밀번호">
-                <button class="auth-submit" onclick="handleLogin()">로그인</button>
-                <p class="auth-switch">계정이 없으신가요?
-                    <a href="#" onclick="toggleAuth(true)">회원가입</a></p>
-            </div>
-            <div id="register-form" style="display: none;">
-                <div class="auth-logo"><i class="ti ti-user-plus"></i></div>
-                <h2 class="auth-title">계정 만들기</h2>
-                <p class="auth-subtitle">Lattice AI 워크스페이스에 참여하세요</p>
-                <input class="auth-input" type="email" id="reg-email" placeholder="이메일 주소">
-                <input class="auth-input" type="password" id="reg-pw" placeholder="비밀번호">
-                <input class="auth-input" type="text" id="reg-name" placeholder="이름">
-                <input class="auth-input" type="text" id="reg-nickname" placeholder="별명">
-                <button class="auth-submit" onclick="handleRegister()">가입하기</button>
-                <p class="auth-switch">이미 계정이 있나요?
-                    <a href="#" onclick="toggleAuth(false)">로그인</a></p>
-            </div>
-        </div>
-    </div>
 
     <div class="app-layout">
         <!-- Sidebar -->
@@ -2811,9 +2831,9 @@
                 <!-- History items -->
             </div>
             <div class="sidebar-footer">
-                <button id="admin-btn" class="admin-btn" onclick="openAdminPanel()"><i class="ti ti-shield-lock"></i> 관리자 대시보드</button>
-                <button class="status-btn" onclick="openStatusPanel()"><i class="ti ti-info-circle"></i> 내 상태 보기</button>
-                <button id="setup-wizard-btn" class="setup-wizard-sidebar-btn" onclick="openSetupWizard()"><i class="ti ti-sparkles"></i> 자동 설정</button>
+                <button id="admin-btn" class="admin-btn" onclick="openAdminPanel()"><i class="ti ti-shield-lock"></i> <span data-i18n="admin_dashboard">관리자 대시보드</span></button>
+                <button class="status-btn" onclick="openStatusPanel()"><i class="ti ti-info-circle"></i> <span data-i18n="my_status">내 상태 보기</span></button>
+                <button id="setup-wizard-btn" class="setup-wizard-sidebar-btn" onclick="openSetupWizard()"><i class="ti ti-sparkles"></i> <span data-i18n="auto_setup">자동 설정</span></button>
                 <button id="new-chat-btn" class="new-chat-btn"><i class="ti ti-plus"></i> New Chat</button>
             </div>
         </aside>
@@ -2832,30 +2852,59 @@
                 </div>
                 <div class="header-pills">
                     <div class="status-pill"><i class="ti ti-device-desktop"></i> Local</div>
-                    <button onclick="openPwModal()" class="logout-btn" title="비밀번호 변경"><i class="ti ti-user"></i></button>
-                    <button onclick="logout()" class="logout-btn">로그아웃</button>
+                    <div class="lang-picker" id="header-lang-picker">
+                        <button class="logout-btn" id="lang-btn" onclick="toggleLangMenu('header-lang-picker')" title="Language">🌐</button>
+                        <div class="lang-picker-menu" id="header-lang-picker-menu">
+                            <div class="lang-option" id="header-lang-ko" onclick="setLang('ko')">🇰🇷 한국어</div>
+                            <div class="lang-option" id="header-lang-en" onclick="setLang('en')">🇺🇸 English</div>
+                        </div>
+                    </div>
+                    <button onclick="openAcctModal()" class="logout-btn" title="계정 설정"><i class="ti ti-user"></i></button>
+                    <button onclick="logout()" class="logout-btn" data-i18n="logout">로그아웃</button>
                 </div>
             </header>
 
-            <div class="pw-modal-overlay" id="pw-modal-overlay">
-                <div class="pw-modal">
-                    <h3>🔐 비밀번호 변경</h3>
-                    <div class="pw-field">
-                        <label>현재 비밀번호</label>
-                        <input type="password" id="pw-cur" placeholder="현재 비밀번호">
+            <div class="acct-modal-overlay" id="acct-modal-overlay">
+                <div class="acct-modal">
+                    <div class="acct-tabs">
+                        <button class="acct-tab active" id="tab-profile" onclick="switchAcctTab('profile')" data-i18n="tab_profile">프로필</button>
+                        <button class="acct-tab" id="tab-password" onclick="switchAcctTab('password')" data-i18n="tab_password">비밀번호</button>
                     </div>
-                    <div class="pw-field">
-                        <label>새 비밀번호</label>
-                        <input type="password" id="pw-new" placeholder="새 비밀번호 (4자 이상)">
-                    </div>
-                    <div class="pw-field">
-                        <label>새 비밀번호 확인</label>
-                        <input type="password" id="pw-new2" placeholder="새 비밀번호 재입력">
-                    </div>
-                    <div class="pw-msg" id="pw-msg"></div>
-                    <div class="pw-actions">
-                        <button class="pw-cancel" onclick="closePwModal()">취소</button>
-                        <button class="pw-submit" id="pw-submit-btn" onclick="submitPwChange()">변경</button>
+                    <div class="acct-body">
+                        <div class="acct-tab-panel active" id="panel-profile">
+                            <div class="pw-field">
+                                <label data-i18n="label_name">이름</label>
+                                <input type="text" id="profile-name" placeholder="이름" data-i18n-ph="ph_name">
+                            </div>
+                            <div class="pw-field">
+                                <label data-i18n="label_nickname">닉네임</label>
+                                <input type="text" id="profile-nickname" placeholder="닉네임" data-i18n-ph="ph_nickname">
+                            </div>
+                            <div class="pw-msg" id="profile-msg"></div>
+                            <div class="pw-actions">
+                                <button class="pw-cancel" onclick="closeAcctModal()" data-i18n="btn_cancel">취소</button>
+                                <button class="pw-submit" id="profile-submit-btn" onclick="submitProfileChange()" data-i18n="btn_save">저장</button>
+                            </div>
+                        </div>
+                        <div class="acct-tab-panel" id="panel-password">
+                            <div class="pw-field">
+                                <label data-i18n="label_cur_pw">현재 비밀번호</label>
+                                <input type="password" id="pw-cur" placeholder="현재 비밀번호" data-i18n-ph="ph_cur_pw">
+                            </div>
+                            <div class="pw-field">
+                                <label data-i18n="label_new_pw">새 비밀번호</label>
+                                <input type="password" id="pw-new" placeholder="새 비밀번호 (4자 이상)" data-i18n-ph="ph_new_pw">
+                            </div>
+                            <div class="pw-field">
+                                <label data-i18n="label_new_pw2">새 비밀번호 확인</label>
+                                <input type="password" id="pw-new2" placeholder="새 비밀번호 재입력" data-i18n-ph="ph_new_pw2">
+                            </div>
+                            <div class="pw-msg" id="pw-msg"></div>
+                            <div class="pw-actions">
+                                <button class="pw-cancel" onclick="closeAcctModal()" data-i18n="btn_cancel">취소</button>
+                                <button class="pw-submit" id="pw-submit-btn" onclick="submitPwChange()" data-i18n="btn_change">변경</button>
+                            </div>
+                        </div>
                     </div>
                 </div>
             </div>
@@ -2872,16 +2921,16 @@
                 <div class="ops-card interactive" onclick="openVpcPanel()">
                     <div>
                         <div class="ops-label">PRIVATE VPC</div>
-                        <div id="ops-vpc" class="ops-value">설정 안 됨</div>
-                        <div id="ops-vpc-meta" class="ops-meta">클릭하여 VPC 연결 설정</div>
+                        <div id="ops-vpc" class="ops-value" data-i18n="vpc_not_set">설정 안 됨</div>
+                        <div id="ops-vpc-meta" class="ops-meta" data-i18n="vpc_click_to_set">클릭하여 VPC 연결 설정</div>
                     </div>
                     <div class="ops-icon"><i class="ti ti-cloud-lock"></i></div>
                 </div>
                 <div class="ops-card interactive" onclick="openAdminPanel()">
                     <div>
                         <div class="ops-label">SECURITY</div>
-                        <div class="ops-value">민감정보 감시</div>
-                        <div id="security-admin-meta" class="ops-meta">관리자 대시보드 접근</div>
+                        <div class="ops-value" data-i18n="security_monitor">민감정보 감시</div>
+                        <div id="security-admin-meta" class="ops-meta" data-i18n="admin_dashboard_access">관리자 대시보드 접근</div>
                     </div>
                     <div class="ops-icon"><i class="ti ti-shield-check"></i></div>
                 </div>
@@ -2890,12 +2939,12 @@
             <div class="messages-viewport" id="chat-viewport">
                 <div class="empty-state" id="empty-state">
                     <div style="width:64px;height:64px;background:linear-gradient(135deg,rgba(34,211,160,0.18),rgba(129,140,248,0.12));border:1px solid rgba(34,211,160,0.18);border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--accent);margin:0 auto 18px;box-shadow:0 0 32px rgba(34,211,160,0.14)"><i class="ti ti-sparkles"></i></div>
-                    <h1>무엇을 만들까요?</h1>
-                    <p>로컬 모델, 이미지 분석, 코드 생성, 프라이빗 VPC — 모든 걸 한 화면에서 이어가세요.</p>
+                    <h1 data-i18n="empty_title">무엇을 만들까요?</h1>
+                    <p data-i18n="empty_sub">로컬 모델, 이미지 분석, 코드 생성, 프라이빗 VPC — 모든 걸 한 화면에서 이어가세요.</p>
                     <div class="empty-grid">
-                        <div class="empty-chip" onclick="document.getElementById('user-input').value='보고서 초안을 만들어줘';document.getElementById('user-input').focus()"><span class="empty-chip-icon"><i class="ti ti-file-text"></i></span>파일 생성 · 코드 초안</div>
-                        <div class="empty-chip" onclick="document.getElementById('user-input').value='VPC 보안 구성을 점검해줘';document.getElementById('user-input').focus()"><span class="empty-chip-icon"><i class="ti ti-shield-check"></i></span>VPC 보안 구성 점검</div>
-                        <div class="empty-chip" onclick="document.getElementById('user-input').value='이 내용을 지식베이스에 정리해줘';document.getElementById('user-input').focus()"><span class="empty-chip-icon"><i class="ti ti-brain"></i></span>로컬 지식 정리</div>
+                        <div class="empty-chip" id="chip-file" onclick="document.getElementById('user-input').value=t('chip_file_prompt');document.getElementById('user-input').focus()"><span class="empty-chip-icon"><i class="ti ti-file-text"></i></span><span data-i18n="chip_file">파일 생성 · 코드 초안</span></div>
+                        <div class="empty-chip" id="chip-vpc" onclick="document.getElementById('user-input').value=t('chip_vpc_prompt');document.getElementById('user-input').focus()"><span class="empty-chip-icon"><i class="ti ti-shield-check"></i></span><span data-i18n="chip_vpc">VPC 보안 구성 점검</span></div>
+                        <div class="empty-chip" id="chip-kb" onclick="document.getElementById('user-input').value=t('chip_kb_prompt');document.getElementById('user-input').focus()"><span class="empty-chip-icon"><i class="ti ti-brain"></i></span><span data-i18n="chip_kb">로컬 지식 정리</span></div>
                     </div>
                 </div>
             </div>
@@ -2918,16 +2967,16 @@
                             <i class="ti ti-paperclip" style="font-size: 20px;"></i>
                             <input type="file" id="doc-input" accept=".pdf,.docx,.xlsx,.pptx,.txt,.md,.csv" hidden onchange="attachDocument(this)">
                         </label>
-                        <textarea id="user-input" placeholder="Lattice AI에게 작업을 지시하세요..." rows="1"></textarea>
+                        <textarea id="user-input" placeholder="Lattice AI에게 작업을 지시하세요..." rows="1" data-i18n-ph="ph_input"></textarea>
                         <button class="send-btn" id="send-btn"><i class="ti ti-send"></i></button>
                     </div>
                     <div class="file-toolbar">
-                        <span class="file-toolbar-label">파일 만들기</span>
+                        <span class="file-toolbar-label" data-i18n="create_file">파일 만들기</span>
                         <button class="file-type-btn" onclick="openFileCreate('docx')"><i class="ti ti-file-word"></i> DOCX</button>
                         <button class="file-type-btn" onclick="openFileCreate('xlsx')"><i class="ti ti-file-spreadsheet"></i> XLSX</button>
                         <button class="file-type-btn" onclick="openFileCreate('pptx')"><i class="ti ti-presentation"></i> PPTX</button>
                         <button class="file-type-btn" onclick="openFileCreate('pdf')"><i class="ti ti-file-type-pdf"></i> PDF</button>
-                        <button class="file-type-btn" onclick="openLocalBrowser()"><i class="ti ti-folder-open"></i> 로컬 파일</button>
+                        <button class="file-type-btn" onclick="openLocalBrowser()"><i class="ti ti-folder-open"></i> <span data-i18n="local_files">로컬 파일</span></button>
                     </div>
                 </div>
             </div>
@@ -2938,8 +2987,8 @@
         <section class="model-panel">
             <div class="model-panel-header">
                 <div>
-                    <h2>모델 스위처</h2>
-                    <p style="color: var(--muted); font-size: 12px; margin-top: 4px;">실행 엔진을 설치하고, 엔진에 맞는 local/cloud LLM을 선택합니다.</p>
+                    <h2 data-i18n="model_switcher">모델 스위처</h2>
+                    <p style="color: var(--muted); font-size: 12px; margin-top: 4px;" data-i18n="model_switcher_sub">실행 엔진을 설치하고, 엔진에 맞는 local/cloud LLM을 선택합니다.</p>
                 </div>
                 <button class="admin-close" onclick="closeModelPanel()"><i class="ti ti-x"></i></button>
             </div>
@@ -2951,12 +3000,12 @@
     <div id="perm-overlay" class="perm-overlay" style="display:none">
         <div class="perm-dialog">
             <div class="perm-icon"><i class="ti ti-shield-lock"></i></div>
-            <div class="perm-title" id="perm-title">파일 접근 요청</div>
+            <div class="perm-title" id="perm-title" data-i18n="perm_title">파일 접근 요청</div>
             <div class="perm-path" id="perm-path"></div>
             <div class="perm-desc" id="perm-desc"></div>
             <div class="perm-actions">
-                <button class="perm-deny-btn" onclick="resolvePermission(false)">거부</button>
-                <button class="perm-allow-btn" onclick="resolvePermission(true)">허용</button>
+                <button class="perm-deny-btn" onclick="resolvePermission(false)" data-i18n="btn_deny">거부</button>
+                <button class="perm-allow-btn" onclick="resolvePermission(true)" data-i18n="btn_allow">허용</button>
             </div>
         </div>
     </div>
@@ -3267,7 +3316,6 @@
             if (typeof acquireVsCodeApi === 'function') {
                 vscode = acquireVsCodeApi();
                 console.log("VS Code API Acquired");
-                document.getElementById('auth-overlay').style.display = 'none'; // VS Code에서는 로그인 건너뜀
             }
         } catch (e) { /* Not in VS Code */ }
 
@@ -3279,79 +3327,205 @@
             }
         });
 
-        function toggleAuth(showRegister) {
-            document.getElementById('login-form').style.display = showRegister ? 'none' : 'block';
-            document.getElementById('register-form').style.display = showRegister ? 'block' : 'none';
-        }
+        async function logout() {
+            try { await apiFetch('/logout', { method: 'POST' }); } catch (_) {}
+            localStorage.removeItem('ltcai_user_email');
+            localStorage.removeItem('ltcai_user_nickname');
+            localStorage.removeItem('ltcai_is_admin');
+            window.location.href = '/account';
+        }
+
+        const I18N = {
+            ko: {
+                // 인증
+                login_title: 'Lattice AI', login_sub: 'Local AI Workspace — Apple Silicon',
+                ph_email: '이메일 주소', ph_password: '비밀번호', btn_login: '로그인',
+                no_account: '계정이 없으신가요?', go_register: '회원가입',
+                register_title: '계정 만들기', register_sub: 'Lattice AI 워크스페이스에 참여하세요',
+                ph_new_pw: '비밀번호 (4자 이상)', ph_pw_confirm: '비밀번호 확인',
+                ph_fullname: '이름', ph_nick: '닉네임',
+                btn_register: '가입하기', have_account: '이미 계정이 있나요?', go_login: '로그인',
+                // 헤더 / 사이드바
+                logout: '로그아웃', admin_dashboard: '관리자 대시보드',
+                my_status: '내 상태 보기', auto_setup: '자동 설정',
+                // 계정 모달
+                tab_profile: '프로필', tab_password: '비밀번호',
+                label_name: '이름', label_nickname: '닉네임',
+                label_cur_pw: '현재 비밀번호', label_new_pw: '새 비밀번호', label_new_pw2: '새 비밀번호 확인',
+                ph_name: '이름', ph_nickname: '닉네임', ph_cur_pw: '현재 비밀번호',
+                ph_new_pw2: '새 비밀번호 재입력',
+                btn_save: '저장', btn_change: '변경', btn_cancel: '취소',
+                // ops 스트립
+                vpc_not_set: '설정 안 됨', vpc_click_to_set: '클릭하여 VPC 연결 설정',
+                security_monitor: '민감정보 감시', admin_dashboard_access: '관리자 대시보드 접근', admin_has_rights: '관리자 권한 있음',
+                // 빈 화면
+                empty_title: '무엇을 만들까요?',
+                empty_sub: '로컬 모델, 이미지 분석, 코드 생성, 프라이빗 VPC — 모든 걸 한 화면에서 이어가세요.',
+                chip_file: '파일 생성 · 코드 초안', chip_vpc: 'VPC 보안 구성 점검', chip_kb: '로컬 지식 정리',
+                chip_file_prompt: '보고서 초안을 만들어줘',
+                chip_vpc_prompt: 'VPC 보안 구성을 점검해줘',
+                chip_kb_prompt: '이 내용을 지식베이스에 정리해줘',
+                // 입력창
+                ph_input: 'Lattice AI에게 작업을 지시하세요...',
+                // 파일 툴바
+                create_file: '파일 만들기', local_files: '로컬 파일',
+                // 패널 제목
+                model_switcher: '모델 스위처',
+                model_switcher_sub: '실행 엔진을 설치하고, 엔진에 맞는 local/cloud LLM을 선택합니다.',
+                // 권한 다이얼로그
+                perm_title: '파일 접근 요청', btn_deny: '거부', btn_allow: '허용',
+            },
+            en: {
+                // Auth
+                login_title: 'Lattice AI', login_sub: 'Local AI Workspace — Apple Silicon',
+                ph_email: 'Email address', ph_password: 'Password', btn_login: 'Log in',
+                no_account: "Don't have an account?", go_register: 'Sign up',
+                register_title: 'Create Account', register_sub: 'Join the Lattice AI workspace',
+                ph_new_pw: 'Password (min. 4 chars)', ph_pw_confirm: 'Confirm password',
+                ph_fullname: 'Full name', ph_nick: 'Nickname',
+                btn_register: 'Sign up', have_account: 'Already have an account?', go_login: 'Log in',
+                // Header / Sidebar
+                logout: 'Logout', admin_dashboard: 'Admin Dashboard',
+                my_status: 'My Status', auto_setup: 'Auto Setup',
+                // Account modal
+                tab_profile: 'Profile', tab_password: 'Password',
+                label_name: 'Name', label_nickname: 'Nickname',
+                label_cur_pw: 'Current Password', label_new_pw: 'New Password', label_new_pw2: 'Confirm New Password',
+                ph_name: 'Name', ph_nickname: 'Nickname', ph_cur_pw: 'Current password',
+                ph_new_pw2: 'Confirm new password',
+                btn_save: 'Save', btn_change: 'Change', btn_cancel: 'Cancel',
+                // Ops strip
+                vpc_not_set: 'Not configured', vpc_click_to_set: 'Click to set up VPC',
+                security_monitor: 'Sensitive data monitor', admin_dashboard_access: 'Admin dashboard access', admin_has_rights: 'Has admin rights',
+                // Empty state
+                empty_title: 'What would you like to build?',
+                empty_sub: 'Local models, image analysis, code generation, private VPC — all in one workspace.',
+                chip_file: 'Create file · Code draft', chip_vpc: 'Review VPC security', chip_kb: 'Organize knowledge',
+                chip_file_prompt: 'Draft a report for me',
+                chip_vpc_prompt: 'Review my VPC security configuration',
+                chip_kb_prompt: 'Organize this into my knowledge base',
+                // Input
+                ph_input: 'Ask Lattice AI anything...',
+                // File toolbar
+                create_file: 'Create file', local_files: 'Local files',
+                // Panel titles
+                model_switcher: 'Model Switcher',
+                model_switcher_sub: 'Install a runtime engine and select a local/cloud LLM.',
+                // Permission dialog
+                perm_title: 'File Access Request', btn_deny: 'Deny', btn_allow: 'Allow',
+            }
+        };
+        let currentLang = localStorage.getItem('ltcai_lang') || 'ko';
 
-        async function handleRegister() {
-            const email = document.getElementById('reg-email').value;
-            const password = document.getElementById('reg-pw').value;
-            const name = document.getElementById('reg-name').value;
-            const nickname = document.getElementById('reg-nickname').value;
-            const res = await apiFetch('/register', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ email, password, name, nickname })
-            });
-            if (res.ok) { alert("가입 완료! 로그인 해주세요."); toggleAuth(false); }
-            else { alert("가입 실패: " + (await res.json()).detail); }
-        }
+        function t(key) { return (I18N[currentLang] || I18N.ko)[key] || key; }
 
-        async function handleLogin() {
-            const email = document.getElementById('login-email').value;
-            const password = document.getElementById('login-pw').value;
-            const res = await apiFetch('/login', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ email, password })
+        function applyI18n() {
+            document.querySelectorAll('[data-i18n]').forEach(el => {
+                el.textContent = t(el.dataset.i18n);
             });
-            if (res.ok) {
-                const data = await res.json();
-                currentUserNickname = data.nickname;
-                currentUserEmail = data.email;
-                localStorage.setItem('ltcai_user_email', currentUserEmail);
-                localStorage.setItem('ltcai_user_nickname', currentUserNickname);
-                localStorage.setItem('ltcai_is_admin', data.is_admin ? 'true' : 'false');
-                isAdmin = Boolean(data.is_admin);
-                document.getElementById('user-nickname-display').innerText = currentUserNickname;
-                const av = document.getElementById('user-avatar-initial');
-                if (av) av.textContent = (currentUserNickname || 'G')[0].toUpperCase();
-                document.getElementById('admin-btn').style.display = 'flex';
-                document.getElementById('security-admin-meta').textContent = isAdmin ? '관리자 권한 있음' : '관리자 대시보드 접근';
-                document.getElementById('auth-overlay').style.display = 'none';
-                loadVpcStatus();
-                restoreCurrentConversation().then(() => {
-                    if (!chatViewport.querySelector('.message')) {
-                        addMessage('ai', `반갑습니다, <b>${currentUserNickname}</b>님!`);
-                    }
+            document.querySelectorAll('[data-i18n-ph]').forEach(el => {
+                el.placeholder = t(el.dataset.i18nPh);
+            });
+            // 언어 선택기 active 표시 업데이트
+            ['auth', 'header'].forEach(prefix => {
+                ['ko', 'en'].forEach(lang => {
+                    const el = document.getElementById(`${prefix}-lang-${lang}`);
+                    if (el) el.classList.toggle('active', lang === currentLang);
                 });
-            } else { alert("로그인 실패!"); }
+            });
+            const authBtn = document.getElementById('auth-lang-btn');
+            if (authBtn) authBtn.textContent = `🌐 ${currentLang === 'ko' ? '한국어' : 'English'}`;
         }
 
-        function logout() {
-            localStorage.removeItem('ltcai_user_email');
-            localStorage.removeItem('ltcai_user_nickname');
-            localStorage.removeItem('ltcai_is_admin');
-            location.reload();
+        function toggleLangMenu(pickerId) {
+            const menu = document.getElementById(`${pickerId}-menu`);
+            if (!menu) return;
+            const isOpen = menu.classList.contains('open');
+            document.querySelectorAll('.lang-picker-menu').forEach(m => m.classList.remove('open'));
+            if (!isOpen) menu.classList.add('open');
         }
 
-        function openPwModal() {
-            document.getElementById('pw-cur').value = '';
-            document.getElementById('pw-new').value = '';
-            document.getElementById('pw-new2').value = '';
-            const msg = document.getElementById('pw-msg');
-            msg.textContent = '';
-            msg.className = 'pw-msg';
-            document.getElementById('pw-modal-overlay').classList.add('open');
+        function setLang(lang) {
+            currentLang = lang;
+            localStorage.setItem('ltcai_lang', lang);
+            document.querySelectorAll('.lang-picker-menu').forEach(m => m.classList.remove('open'));
+            applyI18n();
         }
-        function closePwModal() {
-            document.getElementById('pw-modal-overlay').classList.remove('open');
+
+        document.addEventListener('click', (e) => {
+            if (!e.target.closest('.lang-picker')) {
+                document.querySelectorAll('.lang-picker-menu').forEach(m => m.classList.remove('open'));
+            }
+        });
+
+        function switchAcctTab(tab) {
+            ['profile', 'password'].forEach(t => {
+                document.getElementById(`tab-${t}`).classList.toggle('active', t === tab);
+                document.getElementById(`panel-${t}`).classList.toggle('active', t === tab);
+            });
+        }
+        async function openAcctModal() {
+            ['profile-msg', 'pw-msg'].forEach(id => {
+                const el = document.getElementById(id);
+                el.textContent = ''; el.className = 'pw-msg';
+            });
+            ['pw-cur', 'pw-new', 'pw-new2'].forEach(id => document.getElementById(id).value = '');
+            switchAcctTab('profile');
+            try {
+                const res = await fetch('/account/profile');
+                if (res.ok) {
+                    const data = await res.json();
+                    document.getElementById('profile-name').value = data.name || '';
+                    document.getElementById('profile-nickname').value = data.nickname || '';
+                }
+            } catch {}
+            document.getElementById('acct-modal-overlay').classList.add('open');
+        }
+        function closeAcctModal() {
+            document.getElementById('acct-modal-overlay').classList.remove('open');
         }
         document.addEventListener('click', (e) => {
-            const overlay = document.getElementById('pw-modal-overlay');
-            if (e.target === overlay) closePwModal();
+            const overlay = document.getElementById('acct-modal-overlay');
+            if (e.target === overlay) closeAcctModal();
         });
+        async function submitProfileChange() {
+            const name = document.getElementById('profile-name').value.trim();
+            const nickname = document.getElementById('profile-nickname').value.trim();
+            const msg = document.getElementById('profile-msg');
+            const btn = document.getElementById('profile-submit-btn');
+            if (!name || !nickname) {
+                msg.textContent = '이름과 닉네임을 입력해주세요.';
+                msg.className = 'pw-msg error';
+                return;
+            }
+            btn.disabled = true; btn.textContent = '저장 중...';
+            try {
+                const res = await fetch('/account/profile', {
+                    method: 'PATCH',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ name, nickname })
+                });
+                const data = await res.json();
+                if (res.ok) {
+                    currentUserNickname = data.nickname;
+                    localStorage.setItem('ltcai_user_nickname', data.nickname);
+                    document.getElementById('user-nickname-display').innerText = data.nickname;
+                    const av = document.getElementById('user-avatar-initial');
+                    if (av) av.textContent = (data.nickname || 'G')[0].toUpperCase();
+                    msg.textContent = '✅ 프로필이 변경되었습니다.';
+                    msg.className = 'pw-msg success';
+                    setTimeout(closeAcctModal, 1500);
+                } else {
+                    msg.textContent = data.detail || '저장 실패';
+                    msg.className = 'pw-msg error';
+                }
+            } catch {
+                msg.textContent = '서버 연결 실패';
+                msg.className = 'pw-msg error';
+            } finally {
+                btn.disabled = false; btn.textContent = '저장';
+            }
+        }
         async function submitPwChange() {
             const cur = document.getElementById('pw-cur').value;
             const nw = document.getElementById('pw-new').value;
@@ -3373,8 +3547,7 @@
                 msg.className = 'pw-msg error';
                 return;
             }
-            btn.disabled = true;
-            btn.textContent = '변경 중...';
+            btn.disabled = true; btn.textContent = '변경 중...';
             try {
                 const res = await fetch('/account/change-password', {
                     method: 'POST',
@@ -3385,7 +3558,7 @@
                 if (res.ok) {
                     msg.textContent = '✅ 비밀번호가 변경되었습니다.';
                     msg.className = 'pw-msg success';
-                    setTimeout(closePwModal, 1500);
+                    setTimeout(closeAcctModal, 1500);
                 } else {
                     msg.textContent = data.detail || '변경 실패';
                     msg.className = 'pw-msg error';
@@ -3394,8 +3567,7 @@
                 msg.textContent = '서버 연결 실패';
                 msg.className = 'pw-msg error';
             } finally {
-                btn.disabled = false;
-                btn.textContent = '변경';
+                btn.disabled = false; btn.textContent = '변경';
             }
         }
 
@@ -3775,9 +3947,27 @@
         }
 
         async function openAdminPanel() {
+            if (!isAdmin) {
+                showToast(currentLang === 'ko' ? '관리자 권한이 없습니다.' : 'Admin access required.');
+                return;
+            }
             window.location.href = '/admin';
         }
 
+        function showToast(msg) {
+            let t = document.getElementById('ltcai-toast');
+            if (!t) {
+                t = document.createElement('div');
+                t.id = 'ltcai-toast';
+                t.style.cssText = 'position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:#1e2330;color:#f8fafc;border:1px solid rgba(255,255,255,0.12);border-radius:10px;padding:10px 18px;font-size:13px;font-weight:600;z-index:9999;box-shadow:0 8px 24px rgba(0,0,0,0.4);pointer-events:none;transition:opacity .2s;';
+                document.body.appendChild(t);
+            }
+            t.textContent = msg;
+            t.style.opacity = '1';
+            clearTimeout(t._timer);
+            t._timer = setTimeout(() => { t.style.opacity = '0'; }, 2200);
+        }
+
         function closeAdminPanel() {
             document.getElementById('admin-overlay').style.display = 'none';
         }
@@ -5269,6 +5459,33 @@
         window.addEventListener('focus', tryClipboardReadFallback);
 
         document.getElementById('new-chat-btn').onclick = startNewChat;
+        applyI18n();
+
+        // Session check — redirect to /account if not logged in
+        (async function restoreSession() {
+            try {
+                const res = await apiFetch('/account/profile');
+                if (res.ok) {
+                    const data = await res.json();
+                    currentUserEmail = data.email;
+                    currentUserNickname = data.nickname || data.name || data.email;
+                    isAdmin = Boolean(data.is_admin);
+                    localStorage.setItem('ltcai_user_email', currentUserEmail);
+                    localStorage.setItem('ltcai_user_nickname', currentUserNickname);
+                    localStorage.setItem('ltcai_is_admin', isAdmin ? 'true' : 'false');
+                    document.getElementById('user-nickname-display').innerText = currentUserNickname;
+                    const av = document.getElementById('user-avatar-initial');
+                    if (av) av.textContent = (currentUserNickname || 'G')[0].toUpperCase();
+                    document.getElementById('admin-btn').style.display = 'flex';
+                    document.getElementById('security-admin-meta').textContent = isAdmin ? t('admin_has_rights') : t('admin_dashboard_access');
+                } else {
+                    window.location.href = '/account';
+                }
+            } catch (_) {
+                window.location.href = '/account';
+            }
+        })();
+
         loadModelStatus();
         loadVpcStatus();
         restoreCurrentConversation();