ltcai 2.2.1 → 2.2.7

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ltcai",
-  "version": "2.2.1",
-  "description": "Lattice AI Workspace OS for local-first graph, memory, agent, workflow, and skill operations",
+  "version": "2.2.7",
+  "description": "Local-first AI workspace for knowledge graphs, AI pipelines, and multi-agent coding workflows.",
   "homepage": "https://github.com/TaeSooPark-PTS/LatticeAI#readme",
   "repository": {
     "type": "git",
@@ -20,6 +20,8 @@
     "build": "npm run build:python",
     "build:python": "python3 -m build",
     "check:python": "python3 -m py_compile ltcai_cli.py server.py latticeai/server_app.py latticeai/api/chat.py latticeai/api/computer_use.py latticeai/api/deps.py latticeai/api/garden.py latticeai/api/local_files.py latticeai/api/permissions.py latticeai/api/setup.py latticeai/api/static_routes.py latticeai/api/tools.py latticeai/api/plugins.py latticeai/api/workflow_designer.py latticeai/api/agents.py latticeai/api/realtime.py latticeai/api/marketplace.py latticeai/services/app_context.py latticeai/services/model_runtime.py latticeai/services/model_catalog.py latticeai/services/model_recommendation.py latticeai/services/tool_dispatch.py latticeai/services/upload_service.py latticeai/core/tool_registry.py latticeai/core/enterprise.py latticeai/core/enterprise_admin.py latticeai/core/agent_prompts.py latticeai/core/workspace_os.py latticeai/core/plugins.py latticeai/core/marketplace.py latticeai/core/workflow_engine.py latticeai/core/multi_agent.py latticeai/core/realtime.py knowledge_graph.py knowledge_graph_api.py local_knowledge_api.py llm_router.py p_reinforce.py telegram_bot.py tools.py codex_telegram_bot.py",
+    "lint": "node --check static/scripts/account.js && node --check static/scripts/admin.js && node --check static/scripts/chat.js && node --check static/scripts/graph.js && node --check static/scripts/platform.js && node --check static/scripts/ux.js && node --check static/scripts/workspace.js && node --check tests/visual/mock_server.cjs",
+    "typecheck": "cd vscode-extension && npm run build",
     "test": "python3 -m pytest tests/ -v",
     "test:unit": "python3 -m pytest tests/unit/ -v",
     "test:integration": "python3 -m pytest tests/integration/ -v",
@@ -39,11 +41,14 @@
   },
   "keywords": [
     "ltcai",
-    "ai-assistant",
+    "ai-workspace",
+    "ai-pipeline",
+    "knowledge-graph",
     "llm",
     "mlx",
     "local-ai",
-    "agent",
+    "multi-agent",
+    "workflow",
     "mcp",
     "rag",
     "vscode"
@@ -77,9 +82,9 @@
     "static/workflows.html",
     "static/agents.html",
     "static/activity.html",
+    "static/favicon.ico",
     "static/manifest.json",
     "static/sw.js",
-    "static/lattice-reference.css",
     "static/workspace.css",
     "static/platform.css",
     "static/scripts/",

package/static/account.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content">
     <title>Lattice AI</title>
-    <script src="/static/scripts/ux.js?v=2.2.1"></script>
+    <script src="/static/scripts/ux.js?v=2.2.7"></script>
     <link rel="manifest" href="/manifest.json">
     <meta name="theme-color" content="#f3ecff">
     <meta name="apple-mobile-web-app-capable" content="yes">
@@ -14,8 +14,13 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/tabler-icons.min.css">
-    <link rel="stylesheet" href="/static/lattice-reference.css?v=0.3.3">
-    <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.1">
+    <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/base.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/account.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/admin.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/graph.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/chat.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.7">
 </head>
 <body class="lattice-ref-auth">
     <div class="orb orb-1"></div>
@@ -105,6 +110,6 @@
         <a href="#" onclick="return false;" id="privacy-link">개인정보 처리방침</a>
     </footer>
 
-    <script src="/static/scripts/account.js?v=0.3.3"></script>
+    <script src="/static/scripts/account.js?v=2.2.7"></script>
 </body>
 </html>

package/static/activity.html

@@ -4,10 +4,10 @@
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content" />
   <title>Realtime Activity — Lattice AI</title>
-  <script src="/static/scripts/ux.js?v=2.2.1"></script>
-  <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.1" />
-  <link rel="stylesheet" href="/static/platform.css?v=2.2.1" />
-  <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.1" />
+  <script src="/static/scripts/ux.js?v=2.2.7"></script>
+  <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.7" />
+  <link rel="stylesheet" href="/static/platform.css?v=2.2.7" />
+  <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.7" />
 </head>
 <body>
   <main>

package/static/admin.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content">
     <title>Lattice AI Admin</title>
-    <script src="/static/scripts/ux.js?v=2.2.1"></script>
+    <script src="/static/scripts/ux.js?v=2.2.7"></script>
     <link rel="manifest" href="/manifest.json">
     <meta name="theme-color" content="#f3ecff">
     <meta name="apple-mobile-web-app-capable" content="yes">
@@ -15,8 +15,13 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/tabler-icons.min.css">
-    <link rel="stylesheet" href="/static/lattice-reference.css?v=0.3.3">
-    <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.1">
+    <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/base.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/account.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/admin.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/graph.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/chat.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.7">
     <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
 </head>
 

package/static/agents.html

@@ -4,10 +4,10 @@
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content" />
   <title>Multi-Agent Runtime — Lattice AI</title>
-  <script src="/static/scripts/ux.js?v=2.2.1"></script>
-  <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.1" />
-  <link rel="stylesheet" href="/static/platform.css?v=2.2.1" />
-  <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.1" />
+  <script src="/static/scripts/ux.js?v=2.2.7"></script>
+  <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.7" />
+  <link rel="stylesheet" href="/static/platform.css?v=2.2.7" />
+  <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.7" />
 </head>
 <body>
   <main>

package/static/chat.html

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content">
     <title>Lattice AI — All-in-One Multimodal Workspace</title>
-    <script src="/static/scripts/ux.js?v=2.2.1"></script>
+    <script src="/static/scripts/ux.js?v=2.2.7"></script>
 
     <!-- PWA -->
     <link rel="manifest" href="/manifest.json">
@@ -24,8 +24,13 @@
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
 
     <!-- ── Setup Wizard Styles ──────────────────────────────────────────── -->
-    <link rel="stylesheet" href="/static/lattice-reference.css?v=0.3.3">
-    <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.1">
+    <link rel="stylesheet" href="/static/css/tokens.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/base.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/account.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/admin.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/graph.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/reference/chat.css?v=2.2.7">
+    <link rel="stylesheet" href="/static/css/responsive.css?v=2.2.7">
 </head>
 
 <body class="lattice-ref-chat">
@@ -414,7 +419,7 @@
                 <!-- Planning -->
                 <div class="pipeline-phase-row">
                     <div class="pipeline-phase-label">
-                        <span class="pipeline-phase-badge" style="background:rgba(99,102,241,0.15);color:#818cf8">📋 Planning</span>
+                        <span class="pipeline-phase-badge" style="background:rgba(99,102,241,0.15);color:var(--accent)">📋 Planning</span>
                         <span style="color:var(--muted);font-size:11px">계획 수립 · 유저와 함께 검토</span>
                     </div>
                     <select id="pipeline-planning-select" class="pipeline-select">
@@ -425,7 +430,7 @@
                 <!-- Executing -->
                 <div class="pipeline-phase-row">
                     <div class="pipeline-phase-label">
-                        <span class="pipeline-phase-badge" style="background:rgba(34,197,94,0.12);color:#4ade80">⚙️ Executing</span>
+                        <span class="pipeline-phase-badge" style="background:rgba(34,197,94,0.12);color:var(--success)">⚙️ Executing</span>
                         <span style="color:var(--muted);font-size:11px">코드 작성 · 파일 생성 · 툴 호출</span>
                     </div>
                     <select id="pipeline-executing-select" class="pipeline-select">
@@ -436,7 +441,7 @@
                 <!-- Reviewing -->
                 <div class="pipeline-phase-row">
                     <div class="pipeline-phase-label">
-                        <span class="pipeline-phase-badge" style="background:rgba(251,146,60,0.12);color:#fb923c">🔍 Reviewing</span>
+                        <span class="pipeline-phase-badge" style="background:rgba(251,146,60,0.12);color:var(--warning)">🔍 Reviewing</span>
                         <span style="color:var(--muted);font-size:11px">결과 검증 · 최종 답변 생성</span>
                     </div>
                     <select id="pipeline-reviewing-select" class="pipeline-select">
@@ -501,7 +506,7 @@
                     <button class="admin-action" onclick="sendFileToChat()" style="flex:1;background:rgba(111,66,232,0.12);border-color:rgba(111,66,232,0.28)">
                         <i class="ti ti-send"></i> AI에게 보내기
                     </button>
-                    <button class="status-btn" onclick="closeFileEditor();document.getElementById('local-browser-overlay').style.display='flex'" style="flex:1">
+                    <button class="status-btn" onclick="closeFileEditor();showModalLayer('local-browser-overlay')" style="flex:1">
                         <i class="ti ti-arrow-left"></i> 탐색기로
                     </button>
                 </div>
@@ -736,7 +741,7 @@
                         <div id="cu-screenshot-meta" style="font-size:11px;color:var(--faint);text-align:center"></div>
                     </div>
                     <!-- Controls panel -->
-                    <div style="width:280px;padding:14px;display:flex;flex-direction:column;gap:12px;overflow-y:auto">
+                    <div class="cu-controls-panel" style="padding:14px;display:flex;flex-direction:column;gap:12px;overflow-y:auto">
                         <!-- Agent task input -->
                         <div>
                             <div style="font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px">AI 자동 작업</div>
@@ -774,7 +779,7 @@
                             <div id="cu-log" style="flex:1;background:var(--surface-3);border:1px solid var(--border);border-radius:8px;padding:8px;font-size:11px;font-family:monospace;color:var(--muted);overflow-y:auto;max-height:200px;min-height:80px"></div>
                         </div>
                         <!-- Permission note -->
-                        <div style="background:rgba(240,168,50,.07);border:1px solid rgba(240,168,50,.2);border-radius:8px;padding:9px 11px;font-size:11px;color:rgba(240,168,50,.85)">
+                        <div style="background:rgba(240,168,50,.07);border:1px solid rgba(240,168,50,.2);border-radius:8px;padding:9px 11px;font-size:11px;color:var(--warning)">
                             <i class="ti ti-alert-triangle"></i> macOS 손쉬운 사용 권한 필요<br>
                             <span style="opacity:.7">시스템 설정 → 개인 정보 보호 → 손쉬운 사용</span>
                         </div>
@@ -833,7 +838,7 @@
     </div>
 
 
-    <script src="/static/scripts/chat.js?v=0.3.4"></script>
+    <script src="/static/scripts/chat.js?v=2.2.7"></script>
 </body>
 
 </html>

package/static/css/reference/account.css

@@ -0,0 +1,303 @@
+/* Lattice AI — account / auth page (account.html, body.lattice-ref-auth). Token-native. */
+/* ============================================================
+   ACCOUNT / AUTH PAGE  (account.html)
+   Light lavender theme — unified with chat/graph/admin pages.
+   ============================================================ */
+
+        * { box-sizing: border-box; margin: 0; padding: 0; }
+        html, body.lattice-ref-auth { height: 100%; }
+        body.lattice-ref-auth {
+            font-family: Inter, -apple-system, BlinkMacSystemFont, sans-serif;
+            color: var(--text);
+            background: var(--app-bg);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            min-height: 100vh;
+            padding: 24px;
+            overflow: hidden;
+            position: relative;
+        }
+
+        body::before {
+            content: '';
+            position: fixed;
+            inset: 0;
+            background:
+                radial-gradient(circle, rgba(123,109,255,0.28) 1px, transparent 1.8px),
+                linear-gradient(rgba(123,109,255,0.08) 1px, transparent 1px),
+                linear-gradient(90deg, rgba(123,109,255,0.06) 1px, transparent 1px);
+            background-size: 82px 82px, 46px 46px, 46px 46px;
+            background-position: 16px 18px, 0 0, 0 0;
+            mask-image: linear-gradient(180deg, rgba(0,0,0,0.18), rgba(0,0,0,0.02));
+            pointer-events: none;
+        }
+
+        body::after {
+            content: '';
+            position: fixed;
+            inset: 0;
+            background:
+                radial-gradient(ellipse at 8% 78%, rgba(142,111,255,0.24), transparent 34%),
+                linear-gradient(115deg, transparent 0 35%, rgba(111,75,246,0.09) 35.2%, transparent 35.6% 100%);
+            pointer-events: none;
+        }
+
+        .orb {
+            display: none;
+        }
+
+        .login-shell {
+            width: min(920px, 100%);
+            display: grid;
+            grid-template-columns: minmax(280px, 400px) minmax(220px, 1fr);
+            align-items: center;
+            gap: 46px;
+            position: relative;
+            z-index: 1;
+        }
+
+        .brand-preview {
+            min-height: 360px;
+            border-radius: 34px;
+            background:
+                radial-gradient(circle at 54% 45%, rgba(111,75,246,0.24), transparent 18%),
+                linear-gradient(145deg, rgba(255,255,255,0.68), rgba(244,239,255,0.32));
+            border: 1px solid rgba(111,75,246,0.12);
+            box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
+            position: relative;
+            overflow: hidden;
+        }
+        .brand-preview::before {
+            content: '';
+            position: absolute;
+            inset: auto -12% 0 -8%;
+            height: 46%;
+            background: linear-gradient(135deg, rgba(111,75,246,0.24), rgba(255,255,255,0.12));
+            clip-path: polygon(0 62%, 18% 42%, 36% 54%, 55% 26%, 76% 44%, 100% 20%, 100% 100%, 0 100%);
+            filter: blur(1px);
+        }
+        .preview-node {
+            position: absolute;
+            width: 52px;
+            height: 52px;
+            border-radius: 17px;
+            background: var(--surface-2);
+            border: 1px solid rgba(111,75,246,0.18);
+            box-shadow: 0 18px 40px rgba(111,75,246,0.16);
+        }
+        .preview-node::after {
+            content: '';
+            position: absolute;
+            inset: 14px;
+            border-radius: 10px;
+            background: linear-gradient(135deg, #6f4bf6, #9f8cff);
+        }
+        .preview-node.n1 { top: 52px; left: 58px; }
+        .preview-node.n2 { top: 112px; right: 64px; }
+        .preview-node.n3 { left: 120px; bottom: 92px; }
+        .preview-node.n4 { right: 120px; bottom: 58px; }
+        .preview-line {
+            position: absolute;
+            height: 2px;
+            width: 150px;
+            background: linear-gradient(90deg, transparent, rgba(111,75,246,0.45), transparent);
+            transform-origin: left center;
+        }
+        .preview-line.l1 { top: 108px; left: 112px; transform: rotate(18deg); }
+        .preview-line.l2 { top: 186px; left: 176px; transform: rotate(112deg); }
+        .preview-line.l3 { bottom: 112px; left: 172px; transform: rotate(-13deg); }
+
+        .card {
+            width: min(400px, 100%);
+            background: var(--card);
+            border: 1px solid rgba(111,75,246,0.13);
+            border-radius: 14px;
+            padding: 38px 34px;
+            box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,0.9);
+            position: relative;
+            z-index: 1;
+            backdrop-filter: blur(28px);
+        }
+
+        .card::before {
+            content: '';
+            position: absolute;
+            top: 0; left: 50%;
+            transform: translateX(-50%);
+            width: 55%; height: 1px;
+            background: linear-gradient(90deg, transparent, rgba(111,75,246,0.65), rgba(123,109,255,0.45), transparent);
+        }
+
+        .logo {
+            width: 54px; height: 54px;
+            background: linear-gradient(135deg, #6f4bf6 0%, #8d7aff 100%);
+            border-radius: 10px;
+            display: flex; align-items: center; justify-content: center;
+            font-size: 26px; color: #fff;
+            margin: 0 auto 18px;
+            box-shadow: 0 16px 34px rgba(111,75,246,0.28);
+        }
+
+        .title {
+            text-align: center;
+            font-size: 23px;
+            font-weight: 800;
+            margin-bottom: 6px;
+            background: linear-gradient(135deg, #1f2140 35%, #6f4bf6 82%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+        }
+
+        .subtitle {
+            text-align: center;
+            color: var(--muted);
+            font-size: 12.5px;
+            margin-bottom: 26px;
+            line-height: 1.5;
+        }
+
+        .input {
+            width: 100%;
+            padding: 12px 14px;
+            margin-bottom: 10px;
+            background: var(--surface);
+            border: 1px solid rgba(111,75,246,0.16);
+            color: var(--text);
+            border-radius: 8px;
+            outline: none;
+            font-size: 14px;
+            font-family: inherit;
+            transition: border-color .15s, box-shadow .15s;
+        }
+        .input:focus {
+            border-color: rgba(111,75,246,0.52);
+            box-shadow: 0 0 0 4px rgba(111,75,246,0.10);
+        }
+        .input::placeholder { color: var(--faint); }
+
+        .submit {
+            width: 100%;
+            padding: 13px;
+            background: linear-gradient(135deg, #6f4bf6, #7b6dff);
+            color: #fff;
+            border: none;
+            border-radius: 8px;
+            cursor: pointer;
+            font-weight: 800;
+            font-size: 14px;
+            font-family: inherit;
+            box-shadow: 0 14px 30px rgba(111,75,246,0.24);
+            transition: all .18s;
+            margin-top: 4px;
+        }
+        .submit:hover {
+            background: linear-gradient(135deg, #5f3ee6, #705fff);
+            box-shadow: 0 18px 38px rgba(111,75,246,0.30);
+            transform: translateY(-1px);
+        }
+        .submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
+
+        .switch {
+            margin-top: 18px;
+            text-align: center;
+            font-size: 12.5px;
+            color: var(--faint);
+        }
+        .switch a { color: #6f4bf6; text-decoration: none; font-weight: 700; }
+        .switch a:hover { text-decoration: underline; }
+
+        .sso-divider {
+            display: flex; align-items: center; gap: 10px;
+            margin: 14px 0 10px;
+            color: var(--faint); font-size: 11.5px;
+        }
+        .sso-divider::before, .sso-divider::after {
+            content: ''; flex: 1;
+            height: 1px; background: rgba(111,75,246,0.12);
+        }
+        .sso-btn {
+            width: 100%;
+            padding: 12px;
+            background: var(--surface-2);
+            border: 1px solid rgba(111,75,246,0.15);
+            color: var(--text);
+            border-radius: 8px;
+            cursor: pointer;
+            font-weight: 600;
+            font-size: 13.5px;
+            font-family: inherit;
+            display: flex; align-items: center; justify-content: center; gap: 8px;
+            transition: all .18s;
+        }
+        .sso-btn:hover {
+            background: var(--surface);
+            border-color: rgba(111,75,246,0.34);
+        }
+
+        .msg {
+            font-size: 12px;
+            min-height: 18px;
+            margin-bottom: 6px;
+            text-align: center;
+            color: #d44f5c;
+        }
+        .msg.ok { color: var(--success); }
+
+        /* Lang picker */
+        .lang-wrap {
+            position: absolute;
+            top: 12px;
+            right: 12px;
+            z-index: 10;
+        }
+        .lang-btn {
+            background: var(--surface-2);
+            border: 1px solid rgba(111,75,246,0.18);
+            color: var(--text);
+            border-radius: 8px;
+            padding: 7px 12px;
+            font-size: 13px;
+            font-family: inherit;
+            cursor: pointer;
+            transition: background .15s;
+            box-shadow: 0 10px 28px rgba(86,70,160,0.12);
+        }
+        .lang-btn:hover { background: rgba(111,75,246,0.08); }
+        .lang-menu {
+            display: none;
+            position: absolute;
+            top: calc(100% + 6px);
+            right: 0;
+            background: var(--surface-elevated);
+            border: 1px solid rgba(111,75,246,0.15);
+            border-radius: 8px;
+            padding: 4px;
+            min-width: 130px;
+            box-shadow: 0 18px 44px rgba(86,70,160,0.16);
+        }
+        .lang-menu.open { display: block; }
+        .lang-opt {
+            padding: 7px 10px;
+            border-radius: 7px;
+            cursor: pointer;
+            font-size: 13px;
+            color: var(--muted);
+        }
+        .lang-opt:hover { background: rgba(111,75,246,0.07); color: var(--text); }
+        .lang-opt.active { color: var(--accent); font-weight: 700; }
+
+        @media (max-width: 760px) {
+            .login-shell { display: block; }
+            .brand-preview { display: none; }
+        }
+
+:root[data-lt-theme="dark"] body.lattice-ref-auth .title,
+:root[data-lt-theme="dark"] body.lattice-ref-auth #register-section .title {
+    background: none;
+    -webkit-background-clip: border-box;
+    background-clip: border-box;
+    -webkit-text-fill-color: currentColor;
+    color: var(--text);
+}