ltcai 3.0.1 → 3.1.0

package/scripts/take_screenshots.js

@@ -0,0 +1,69 @@
+/**
+ * Lattice AI — automated screenshot capture
+ * Usage: SESSION_TOKEN=xxx node scripts/take_screenshots.js
+ */
+let playwright;
+try { playwright = require('playwright'); } catch(e) {
+  playwright = require('/tmp/node_modules/playwright');
+}
+const { chromium } = playwright;
+const path = require('path');
+const fs   = require('fs');
+
+const BASE  = 'http://localhost:4825';
+const OUT   = path.join(__dirname, '..', 'docs', 'images');
+const TOKEN = process.env.SESSION_TOKEN || '';
+fs.mkdirSync(OUT, { recursive: true });
+
+const PAGES = [
+  { name: 'chat',  url: `${BASE}/`,      wait: 3500 },
+  { name: 'admin', url: `${BASE}/admin`, wait: 3000 },
+  { name: 'graph', url: `${BASE}/graph`, wait: 3500 },
+];
+
+(async () => {
+  const browser = await chromium.launch({ headless: true });
+  const ctx = await browser.newContext({
+    viewport: { width: 1440, height: 900 },
+    deviceScaleFactor: 2,
+  });
+
+  // Inject session cookie so we skip the login page
+  if (TOKEN) {
+    await ctx.addCookies([{
+      name: 'session_token',
+      value: TOKEN,
+      domain: 'localhost',
+      path: '/',
+      httpOnly: true,
+      secure: false,
+    }]);
+    console.log('🍪 Session cookie injected');
+  }
+
+  for (const pg of PAGES) {
+    const page = await ctx.newPage();
+    console.log(`📸 ${pg.name} → ${pg.url}`);
+    try {
+      await page.goto(pg.url, { waitUntil: 'networkidle', timeout: 20000 });
+      await page.waitForTimeout(pg.wait);
+
+      // Dismiss any open modals
+      await page.evaluate(() => {
+        document.querySelectorAll('.modal-backdrop, [data-bs-backdrop], dialog[open]')
+          .forEach(el => { el.style.display = 'none'; });
+      });
+
+      const outPath = path.join(OUT, `screenshot-${pg.name}.png`);
+      await page.screenshot({ path: outPath, fullPage: false });
+      console.log(`  ✅ → ${outPath}`);
+    } catch (e) {
+      console.error(`  ❌ ${pg.name}: ${e.message}`);
+    } finally {
+      await page.close();
+    }
+  }
+
+  await browser.close();
+  console.log('\n✅ Done!');
+})();

package/scripts/validate_release_artifacts.py

@@ -0,0 +1,167 @@
+#!/usr/bin/env python3
+"""Validate release artifacts for a single, explicit version.
+
+The release workflow must never upload ``dist/*`` with a glob: that bundles
+*every* historical build and risks shipping a stale version. This validator is
+the guard rail. It checks that exactly the expected 1.1.0-style artifacts exist
+for the requested version, that no version string is mismatched, and (best
+effort) that the VSIX actually contains the compiled extension entrypoint.
+
+Usage:
+    python scripts/validate_release_artifacts.py 1.1.0
+    python scripts/validate_release_artifacts.py 1.1.0 --require-vsix
+    python scripts/validate_release_artifacts.py 1.1.0 --dist dist --json
+
+Exit code is non-zero on any failure so CI can fail fast.
+"""
+
+from __future__ import annotations
+
+import argparse
+import json
+import re
+import sys
+import zipfile
+from pathlib import Path
+from typing import Dict, List, Optional
+
+SEMVER_RE = re.compile(r"^\d+\.\d+\.\d+([.-][0-9A-Za-z.]+)?$")
+
+
+def _expected_names(version: str) -> Dict[str, str]:
+    return {
+        "wheel": f"ltcai-{version}-py3-none-any.whl",
+        "sdist": f"ltcai-{version}.tar.gz",
+        "vsix": f"ltcai-{version}.vsix",
+    }
+
+
+def _vsix_has_entrypoint(path: Path) -> bool:
+    """True if the VSIX contains the compiled extension entrypoint."""
+    try:
+        with zipfile.ZipFile(path) as zf:
+            names = zf.namelist()
+    except (zipfile.BadZipFile, OSError):
+        return False
+    return any(name.endswith("extension/out/extension.js") for name in names)
+
+
+def _vsix_version(path: Path) -> Optional[str]:
+    try:
+        with zipfile.ZipFile(path) as zf:
+            for name in zf.namelist():
+                if name.endswith("extension/package.json"):
+                    data = json.loads(zf.read(name).decode("utf-8"))
+                    return str(data.get("version") or "")
+    except Exception:
+        return None
+    return None
+
+
+def validate(
+    version: str,
+    dist_dir: Path,
+    *,
+    require_vsix: bool,
+    require_tgz: bool,
+) -> Dict[str, object]:
+    errors: List[str] = []
+    warnings: List[str] = []
+    found: Dict[str, object] = {}
+
+    if not SEMVER_RE.match(version):
+        errors.append(f"version '{version}' is not a valid semantic version")
+
+    if not dist_dir.is_dir():
+        errors.append(f"dist directory not found: {dist_dir}")
+        return {"version": version, "ok": False, "errors": errors, "warnings": warnings, "found": found}
+
+    expected = _expected_names(version)
+
+    # Required Python artifacts.
+    for key in ("wheel", "sdist"):
+        artifact = dist_dir / expected[key]
+        if artifact.is_file():
+            found[key] = str(artifact)
+        else:
+            errors.append(f"missing {key}: {artifact.name}")
+
+    # VSIX: required only when asked, but validate contents when present.
+    vsix = dist_dir / expected["vsix"]
+    if vsix.is_file():
+        found["vsix"] = str(vsix)
+        if not _vsix_has_entrypoint(vsix):
+            errors.append(f"{vsix.name} is missing extension/out/extension.js (compile step skipped?)")
+        vsix_ver = _vsix_version(vsix)
+        if vsix_ver and vsix_ver != version:
+            errors.append(f"{vsix.name} internal version '{vsix_ver}' != expected '{version}'")
+    elif require_vsix:
+        errors.append(f"missing vsix: {vsix.name}")
+
+    # npm pack tarball lives at repo root, not dist/.
+    if require_tgz:
+        tgz = dist_dir.parent / f"ltcai-{version}.tgz"
+        if tgz.is_file():
+            found["tgz"] = str(tgz)
+        else:
+            warnings.append(f"npm tarball not found: {tgz.name} (run `npm pack`)")
+
+    # Guard against stale-version mixing: warn loudly about other-version builds
+    # so a `dist/*` glob upload is obviously unsafe.
+    other_versions = set()
+    for item in dist_dir.glob("ltcai-*"):
+        # Capture just the semver core (e.g. 1.1.0), not packaging suffixes
+        # like -py3-none-any.whl / .tar.gz / .vsix.
+        m = re.match(r"ltcai-(\d+\.\d+\.\d+)(?:[-.]|$)", item.name)
+        if m and m.group(1) != version:
+            other_versions.add(m.group(1))
+    if other_versions:
+        warnings.append(
+            "dist/ also contains other versions "
+            f"{sorted(other_versions)} — NEVER upload with a `dist/*` glob; "
+            f"upload only the explicit {version} filenames."
+        )
+
+    return {
+        "version": version,
+        "ok": not errors,
+        "errors": errors,
+        "warnings": warnings,
+        "found": found,
+        "expected": expected,
+    }
+
+
+def main(argv: Optional[List[str]] = None) -> int:
+    parser = argparse.ArgumentParser(description=__doc__, formatter_class=argparse.RawDescriptionHelpFormatter)
+    parser.add_argument("version", help="exact version to validate, e.g. 1.1.0")
+    parser.add_argument("--dist", default="dist", help="dist directory (default: dist)")
+    parser.add_argument("--require-vsix", action="store_true", help="fail if the VSIX is absent")
+    parser.add_argument("--require-tgz", action="store_true", help="check for npm pack tarball at repo root")
+    parser.add_argument("--json", action="store_true", help="emit machine-readable JSON")
+    args = parser.parse_args(argv)
+
+    result = validate(
+        args.version,
+        Path(args.dist),
+        require_vsix=args.require_vsix,
+        require_tgz=args.require_tgz,
+    )
+
+    if args.json:
+        print(json.dumps(result, indent=2))
+    else:
+        status = "OK" if result["ok"] else "FAILED"
+        print(f"Release artifact validation for v{result['version']}: {status}")
+        for key, path in result["found"].items():
+            print(f"  found {key}: {Path(path).name}")
+        for warning in result["warnings"]:
+            print(f"  WARN: {warning}")
+        for error in result["errors"]:
+            print(f"  ERROR: {error}")
+
+    return 0 if result["ok"] else 1
+
+
+if __name__ == "__main__":
+    raise SystemExit(main())

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=3.0.0"></script>
+    <script src="/static/scripts/ux.js"></script>
     <link rel="manifest" href="/manifest.json">
     <meta name="theme-color" content="#f3ecff">
     <meta name="apple-mobile-web-app-capable" content="yes">
@@ -14,13 +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/css/tokens.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/base.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/account.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/admin.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/graph.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/chat.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/responsive.css?v=3.0.0">
+    <link rel="stylesheet" href="/static/css/tokens.css">
+    <link rel="stylesheet" href="/static/css/reference/base.css">
+    <link rel="stylesheet" href="/static/css/reference/account.css">
+    <link rel="stylesheet" href="/static/css/reference/admin.css">
+    <link rel="stylesheet" href="/static/css/reference/graph.css">
+    <link rel="stylesheet" href="/static/css/reference/chat.css">
+    <link rel="stylesheet" href="/static/css/responsive.css">
 </head>
 <body class="lattice-ref-auth">
     <div class="orb orb-1"></div>
@@ -110,6 +110,6 @@
         <a href="#" onclick="return false;" id="privacy-link">개인정보 처리방침</a>
     </footer>
 
-    <script src="/static/scripts/account.js?v=3.0.0"></script>
+    <script src="/static/scripts/account.js"></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=3.0.0"></script>
-  <link rel="stylesheet" href="/static/css/tokens.css?v=3.0.0" />
-  <link rel="stylesheet" href="/static/platform.css?v=3.0.0" />
-  <link rel="stylesheet" href="/static/css/responsive.css?v=3.0.0" />
+  <script src="/static/scripts/ux.js"></script>
+  <link rel="stylesheet" href="/static/css/tokens.css" />
+  <link rel="stylesheet" href="/static/platform.css" />
+  <link rel="stylesheet" href="/static/css/responsive.css" />
 </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=3.0.0"></script>
+    <script src="/static/scripts/ux.js"></script>
     <link rel="manifest" href="/manifest.json">
     <meta name="theme-color" content="#f3ecff">
     <meta name="apple-mobile-web-app-capable" content="yes">
@@ -15,13 +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/css/tokens.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/base.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/account.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/admin.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/graph.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/chat.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/responsive.css?v=3.0.0">
+    <link rel="stylesheet" href="/static/css/tokens.css">
+    <link rel="stylesheet" href="/static/css/reference/base.css">
+    <link rel="stylesheet" href="/static/css/reference/account.css">
+    <link rel="stylesheet" href="/static/css/reference/admin.css">
+    <link rel="stylesheet" href="/static/css/reference/graph.css">
+    <link rel="stylesheet" href="/static/css/reference/chat.css">
+    <link rel="stylesheet" href="/static/css/responsive.css">
     <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=3.0.0"></script>
-  <link rel="stylesheet" href="/static/css/tokens.css?v=3.0.0" />
-  <link rel="stylesheet" href="/static/platform.css?v=3.0.0" />
-  <link rel="stylesheet" href="/static/css/responsive.css?v=3.0.0" />
+  <script src="/static/scripts/ux.js"></script>
+  <link rel="stylesheet" href="/static/css/tokens.css" />
+  <link rel="stylesheet" href="/static/platform.css" />
+  <link rel="stylesheet" href="/static/css/responsive.css" />
 </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=3.0.0"></script>
+    <script src="/static/scripts/ux.js"></script>
 
     <!-- PWA -->
     <link rel="manifest" href="/manifest.json">
@@ -24,13 +24,13 @@
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
 
     <!-- ── Setup Wizard Styles ──────────────────────────────────────────── -->
-    <link rel="stylesheet" href="/static/css/tokens.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/base.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/account.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/admin.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/graph.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/reference/chat.css?v=3.0.0">
-    <link rel="stylesheet" href="/static/css/responsive.css?v=3.0.0">
+    <link rel="stylesheet" href="/static/css/tokens.css">
+    <link rel="stylesheet" href="/static/css/reference/base.css">
+    <link rel="stylesheet" href="/static/css/reference/account.css">
+    <link rel="stylesheet" href="/static/css/reference/admin.css">
+    <link rel="stylesheet" href="/static/css/reference/graph.css">
+    <link rel="stylesheet" href="/static/css/reference/chat.css">
+    <link rel="stylesheet" href="/static/css/responsive.css">
 </head>
 
 <body class="lattice-ref-chat">
@@ -838,7 +838,7 @@
     </div>
 
 
-    <script src="/static/scripts/chat.js?v=3.0.0"></script>
+    <script src="/static/scripts/chat.js"></script>
 </body>
 
 </html>

package/static/css/tokens.5a595671.css

@@ -0,0 +1,260 @@
+/* ============================================================================
+ * Lattice AI — Design Tokens (Single Source of Truth)  v3.1.0
+ *
+ * 이 파일이 색·면·테두리·그림자·포커스의 단일 출처다.
+ *   :root                      → 라이트 테마 값
+ *   :root[data-lt-theme="dark"] → 동일 토큰명의 다크 값
+ *   @media (prefers-color-scheme: dark) → 사용자가 명시 선택 안 했을 때 OS 추종
+ *
+ * 컴포넌트 CSS 는 항상 var(--token) 만 사용한다. 따라서 이 파일의 값만 바꾸면
+ * 전체 UI 가 자연스럽게 전환된다. (컴포넌트별 다크 오버라이드 / !important 금지)
+ *
+ * 토큰 카테고리(요청 범위): background · surface · card · sidebar · modal · table ·
+ *   graph · text · muted-text · border · accent · success · warning · danger ·
+ *   input · overlay · shadow · focus-ring
+ * ========================================================================== */
+
+:root {
+  color-scheme: light;
+
+  /* ── Brand raw scale (불변, 테마 무관 기준점) ───────────────────────────── */
+  --lt-color-primary-100: #dbeafe;
+  --lt-color-primary-200: #bfdbfe;
+  --lt-color-primary-400: #60a5fa;
+  --lt-color-primary-600: #2563eb;
+  --lt-color-primary-800: #1e3a8a;
+  --lt-color-ink-900: #111827;
+  --lt-color-accent-cyan:  #0891b2;
+  --lt-color-accent-green: #0f9f8f;
+  --lt-color-accent-amber: #b7791f;
+  --lt-color-accent-pink:  #b83280;
+
+  /* ╔══════════════════════════════════════════════════════════════════════╗
+     ║  SEMANTIC TOKENS — LIGHT (neutral workspace palette)                 ║
+     ╚══════════════════════════════════════════════════════════════════════╝ */
+
+  /* background / surfaces */
+  --bg:          #f6f8f7;
+  --bg-soft:     #eef3f2;
+  --surface:     #ffffff;
+  --surface-2:   #f0f5f4;
+  --surface-3:   #e4ecea;
+  --surface-muted: #edf3f2;
+  --surface-elevated: rgba(255, 255, 255, 0.94);
+  --card:        rgba(255, 255, 255, 0.92);
+  --sidebar:     rgba(255, 255, 255, 0.94);
+  --modal:       rgba(255, 255, 255, 0.98);
+  --table:       rgba(255, 255, 255, 0.78);
+  --input:       rgba(255, 255, 255, 0.86);
+  --overlay:     rgba(15, 23, 42, 0.44);
+  --overlay-scrim: var(--overlay);
+  --app-bg:
+    linear-gradient(180deg, #f8faf9 0%, #eef4f2 54%, #f7faf9 100%);
+
+  /* text */
+  --text:        #24223d;
+  --muted:       #475569;   /* muted-text */
+  --faint:       #70818f;
+  --text-muted:  var(--muted);
+
+  /* border / line */
+  --border:        rgba(15, 23, 42, 0.12);
+  --border-strong: rgba(15, 23, 42, 0.22);
+  --line:          rgba(15, 23, 42, 0.10);
+  --line-strong:   rgba(15, 23, 42, 0.18);
+
+  /* accent */
+  --accent:       #2563eb;
+  --accent-2:     #0f9f8f;
+  --accent-3:     #b7791f;
+  --accent-pink:  #b83280;
+  --accent-soft:  rgba(37, 99, 235, 0.10);
+  --accent-deep:  #1d4ed8;
+
+  /* status */
+  --success: #0f8f6d;
+  --warning: #a16207;
+  --danger:  #c2410c;
+
+  /* graph */
+  --graph-bg:   #f8faf9;
+  --graph-grid: rgba(12, 92, 115, 0.08);
+  --graph-pill: rgba(255, 255, 255, 0.92);
+
+  /* shadow */
+  --shadow:    0 18px 50px rgba(15, 23, 42, 0.10);
+  --shadow-sm: 0 8px 22px rgba(15, 23, 42, 0.08);
+
+  /* focus ring */
+  --focus-ring: rgba(37, 99, 235, 0.55);
+
+  /* ── 구조 토큰(색 아님) ─────────────────────────────────────────────── */
+  --radius:    14px;
+  --radius-sm: 8px;
+  --content-width: 900px;
+
+  /* ── 레거시/별칭 — 코드가 참조하는 모든 변수를 의미 토큰으로 매핑 ──────── */
+  --ink:        var(--text);
+  --blue:       var(--accent);
+  --green:      var(--success);
+  --amber:      var(--warning);
+  --red:        var(--danger);
+  --pink:       var(--accent-pink);
+  --ok:         var(--success);
+  --warn:       var(--warning);
+  --err:        var(--danger);
+  --panel:      var(--surface);
+  --panel-2:    var(--surface-2);
+  --panel-3:    var(--surface-3);
+  --panel-strong: var(--surface);
+  --glow-green: 0 0 34px rgba(15, 159, 143, 0.14);
+  --glow-blue:  0 0 34px rgba(37, 99, 235, 0.14);
+  /* PPT reference 스킨 별칭 */
+  --ref-purple:   var(--accent);
+  --ref-purple-2: var(--accent-2);
+  --ref-indigo:   #2563eb;
+  --ref-ink:      var(--text);
+  --ref-muted:    var(--muted);
+  --ref-faint:    var(--faint);
+  --ref-line:     var(--border);
+  --ref-soft:     var(--surface);
+  --ref-card:     var(--card);
+  --ref-shadow:   var(--shadow);
+
+  /* ── --lt-* 별칭 (workspace.css / platform.css 가 참조) — LIGHT ──────────
+     순환참조를 피하려 구체값으로 둔다(소비자가 --bg 등을 --lt-* 로 재정의해도 안전). */
+  --lt-bg:        #f6f8f7;
+  --lt-surface:   #ffffff;
+  --lt-surface-2: #f0f5f4;
+  --lt-input:     rgba(255, 255, 255, 0.86);
+  --lt-ink:       #24223d;
+  --lt-ink-soft:  #475569;
+  --lt-muted:     #70818f;
+  --lt-line:      rgba(15, 23, 42, 0.12);
+  --lt-accent:    #2563eb;
+  --lt-accent-2:  #0f9f8f;
+  --lt-shadow-md: 0 18px 50px rgba(15, 23, 42, 0.10);
+
+  /* ── 모션 / 타이포 ─────────────────────────────────────────────────── */
+  --lt-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+/* ╔════════════════════════════════════════════════════════════════════════╗
+   ║  SEMANTIC TOKENS — DARK (값만 교체, 같은 토큰명)                          ║
+   ╚════════════════════════════════════════════════════════════════════════╝ */
+:root[data-lt-theme="dark"] {
+  color-scheme: dark;
+
+  --bg:          #101418;
+  --bg-soft:     #151b20;
+  --surface:     #1b2328;
+  --surface-2:   #202b31;
+  --surface-3:   #29363d;
+  --surface-muted: #151d22;
+  --surface-elevated: #253139;
+  --card:        rgba(255, 255, 255, 0.055);
+  --sidebar:     #11191d;
+  --modal:       rgba(27, 35, 40, 0.98);
+  --table:       rgba(255, 255, 255, 0.045);
+  --input:       rgba(255, 255, 255, 0.065);
+  --overlay:     rgba(0, 0, 0, 0.64);
+  --overlay-scrim: var(--overlay);
+  --app-bg:
+    linear-gradient(180deg, #101418 0%, #151d22 54%, #101418 100%);
+
+  --text:        #edf3f2;
+  --muted:       #b8c5c2;
+  --faint:       #849894;
+  --text-muted:  var(--muted);
+
+  --border:        rgba(196, 213, 208, 0.18);
+  --border-strong: rgba(196, 213, 208, 0.30);
+  --line:          rgba(196, 213, 208, 0.14);
+  --line-strong:   rgba(196, 213, 208, 0.24);
+
+  --accent:       #0284c7;
+  --accent-2:     #0f766e;
+  --accent-3:     #facc15;
+  --accent-pink:  #f0abfc;
+  --accent-soft:  rgba(2, 132, 199, 0.20);
+  --accent-deep:  #0369a1;
+
+  --success: #34d399;
+  --warning: #fbbf24;
+  --danger:  #fb923c;
+
+  --graph-bg:   #0f1518;
+  --graph-grid: rgba(94, 234, 212, 0.08);
+  --graph-pill: rgba(27, 35, 40, 0.92);
+
+  --shadow:    0 18px 54px rgba(0, 0, 0, 0.50);
+  --shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.42);
+
+  --focus-ring: rgba(125, 211, 252, 0.70);
+
+  --lt-bg:        #101418;
+  --lt-surface:   #1b2328;
+  --lt-surface-2: #202b31;
+  --lt-input:     rgba(255, 255, 255, 0.065);
+  --lt-ink:       #edf3f2;
+  --lt-ink-soft:  #b8c5c2;
+  --lt-muted:     #849894;
+  --lt-line:      rgba(196, 213, 208, 0.18);
+  --lt-accent:    #0284c7;
+  --lt-accent-2:  #0f766e;
+  --lt-shadow-md: 0 18px 54px rgba(0, 0, 0, 0.50);
+
+  --ref-indigo: #93c5fd;
+  --glow-green: 0 0 34px rgba(94, 234, 212, 0.18);
+  --glow-blue:  0 0 34px rgba(125, 211, 252, 0.18);
+}
+
+/* OS 다크 추종 — 사용자가 명시적으로 라이트를 고르지 않은 경우에만 */
+@media (prefers-color-scheme: dark) {
+  :root:not([data-lt-theme="light"]):not([data-lt-theme="dark"]) {
+    color-scheme: dark;
+    --bg: #101418; --bg-soft: #151b20;
+    --surface: #1b2328; --surface-2: #202b31; --surface-3: #29363d;
+    --surface-muted: #151d22; --surface-elevated: #253139;
+    --card: rgba(255,255,255,0.055); --sidebar: #11191d;
+    --modal: rgba(27,35,40,0.98); --table: rgba(255,255,255,0.045);
+    --input: rgba(255,255,255,0.065); --overlay: rgba(0,0,0,0.64); --overlay-scrim: var(--overlay);
+    --app-bg:
+      linear-gradient(180deg, #101418 0%, #151d22 54%, #101418 100%);
+    --text: #edf3f2; --muted: #b8c5c2; --faint: #849894; --text-muted: var(--muted);
+    --border: rgba(196,213,208,0.18); --border-strong: rgba(196,213,208,0.30);
+    --line: rgba(196,213,208,0.14); --line-strong: rgba(196,213,208,0.24);
+    --accent: #0284c7; --accent-2: #0f766e; --accent-3: #facc15;
+    --accent-pink: #f0abfc; --accent-soft: rgba(2,132,199,0.20); --accent-deep: #0369a1;
+    --success: #34d399; --warning: #fbbf24; --danger: #fb923c;
+    --graph-bg: #0f1518; --graph-grid: rgba(94,234,212,0.08); --graph-pill: rgba(27,35,40,0.92);
+    --shadow: 0 18px 54px rgba(0,0,0,0.50); --shadow-sm: 0 8px 24px rgba(0,0,0,0.42);
+    --focus-ring: rgba(125,211,252,0.70);
+    --lt-bg: #101418; --lt-surface: #1b2328; --lt-surface-2: #202b31; --lt-input: rgba(255,255,255,0.065);
+    --lt-ink: #edf3f2; --lt-ink-soft: #b8c5c2; --lt-muted: #849894;
+    --lt-line: rgba(196,213,208,0.18); --lt-accent: #0284c7; --lt-accent-2: #0f766e;
+    --lt-shadow-md: 0 18px 54px rgba(0,0,0,0.50);
+  }
+}
+
+/* ── 전역 폴리시 ───────────────────────────────────────────────────────── */
+::selection { background: var(--accent-soft); color: var(--text); }
+
+:focus-visible {
+  outline: 2px solid var(--focus-ring);
+  outline-offset: 2px;
+}
+
+::-webkit-scrollbar { width: 6px; height: 6px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb { background: var(--accent-soft); border-radius: 99px; }
+::-webkit-scrollbar-thumb:hover { background: var(--border-strong); }
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after {
+    animation-duration: 0.001ms;
+    animation-iteration-count: 1;
+    transition-duration: 0.001ms;
+    scroll-behavior: auto;
+  }
+}

package/static/css/tokens.css

@@ -1,5 +1,5 @@
 /* ============================================================================
- * Lattice AI — Design Tokens (Single Source of Truth)  v3.0.0
+ * Lattice AI — Design Tokens (Single Source of Truth)  v3.1.0
  *
  * 이 파일이 색·면·테두리·그림자·포커스의 단일 출처다.
  *   :root                      → 라이트 테마 값