tokenbill-mcp 1.0.0

package/README.md

@@ -0,0 +1,114 @@
+# Tokenbill (토큰빌) — AI API 비용 대시보드
+
+OpenAI·Anthropic API 사용 비용과 토큰을 한 화면에서 추적하는 서비스.
+FastAPI + SQLite + 바닐라 JS 프론트엔드(단일 HTML).
+
+## 실행 방법
+
+```bash
+pip install -r requirements.txt
+cp .env.example .env          # SECRET_KEY를 긴 랜덤 문자열로 변경
+export $(cat .env | xargs)    # 또는 환경변수로 직접 설정
+uvicorn app.main:app --reload
+```
+
+http://localhost:8000 접속 → 회원가입 → 프로바이더 키 등록.
+
+- **체험(데모)**: 키에 `demo` 로 시작하는 아무 값이나 넣으면 가짜 사용 데이터가 생성됩니다.
+- **실제 연동**: OpenAI는 조직 **Admin 키**(`sk-admin-…`, platform.openai.com → Organization → Admin Keys),
+  Anthropic도 **Admin 키**(`sk-ant-admin-…`, console.anthropic.com → Settings → Admin Keys)가 필요합니다.
+  일반 API 키로는 사용량 조회가 안 됩니다.
+- Google AI는 Cloud Billing 연동이 필요해서 MVP에서는 미지원(데모만 가능).
+- **다중 조직**: 프로바이더당 키를 여러 개(조직별 이름 붙여서) 등록할 수 있고,
+  대시보드에서 조직별 이번 달 비용이 나뉘어 보입니다. 차트·합계는 전체 조직 합산 기준.
+- **프로젝트 드릴다운**: 조직 행을 클릭하면 프로젝트(OpenAI Project / Anthropic
+  Workspace) 단위로 펼쳐지고, 프로젝트마다 모델별 비용·토큰이 표시됩니다.
+- **구글 로그인** (선택): `GOOGLE_CLIENT_ID` 환경변수를 설정하면 로그인 화면에
+  "Google로 계속하기" 버튼이 나타납니다. Google Cloud Console에서 OAuth 클라이언트
+  ID(웹)를 만들고, 승인된 JavaScript 출처에 서비스 도메인(https)을 등록해야 합니다.
+  도메인 없이 공인 IP로는 Google 정책상 동작하지 않습니다.
+
+API 문서: http://localhost:8000/docs (FastAPI 자동 생성)
+
+## 구조
+
+```
+app/
+  main.py                 # FastAPI 앱, 라우트, 스케줄러(매일 03시 KST 자동 수집)
+  models.py               # User / ProviderKey / UsageDaily (날짜×프로바이더×모델 요약)
+  security.py             # JWT 인증, bcrypt 해시, API 키 Fernet 암호화
+  collector.py            # 수집 오케스트레이션, 수동 갱신 쿨다운(10분)
+  providers/
+    collectors.py         # OpenAI/Anthropic usage API 호출 + 데모 생성기
+    prices.py             # 모델별 단가표 (비용 = 토큰 × 단가 근사)
+static/index.html         # 프론트엔드 (로그인 + 대시보드)
+```
+
+## 설계 메모
+
+- **저장 최소화**: 원본 로그는 프로바이더에 두고, "날짜 × 프로바이더 × 모델 × 비용/토큰"
+  요약 행만 보관. 사용자당 하루 수십 행 수준.
+- **갱신 정책**: 매일 1회 자동(APScheduler) + "지금 갱신" 수동(10분 쿨다운).
+  프로바이더 과금 데이터 자체가 지연 반영이라 실시간성은 목표가 아님.
+- **비용 계산**: 금액은 프로바이더 **cost API 실측값** 기준.
+  usage API(토큰·모델별)로 분해를 만들고, 모델별 근사 비용을 cost API의 일 총액에 맞게
+  비례 보정한다 → 합계는 항상 실제 청구 금액과 일치. cost API 호출이 실패하면
+  `prices.py` 단가표 근사값으로 폴백. 단가표는 "싼 모델 절약 시뮬레이션" 등에 계속 사용
+  (자동 수집으로 대체 예정 — LiteLLM의 model_prices JSON 참고).
+- **키 보안**: API 키는 SECRET_KEY에서 유도한 Fernet 키로 암호화 저장, 화면에는 마스킹만 노출.
+
+## 배포 — 실제 운영 구성 (EC2 + Docker + GitHub Actions)
+
+현재 운영: AWS EC2(Ubuntu 24.04, `ubuntu@52.79.213.236`)에서 **docker**로 실행.
+`main`에 푸시하면 GitHub Actions([build.yml](.github/workflows/build.yml))가
+이미지를 빌드해 `ghcr.io/jonghoon5922/tokenbill:latest`로 올린다 — 서버에서 빌드하지 않는다.
+
+- SECRET_KEY: 서버의 `~/.tokenbill-secret` 파일에 보관 (한 줄)
+- DB: `tokenbill-data` 도커 볼륨 → 컨테이너 `/data/tokenbill.db` (재배포해도 유지)
+
+### 새 버전 배포 절차
+
+```bash
+# 0) (스키마 변경이 있는 배포면) DB 백업
+docker cp tokenbill:/data /home/ubuntu/tokenbill-data-backup-$(date +%Y%m%d)
+
+# 1) GitHub Actions 빌드 완료 확인 후 pull
+docker pull ghcr.io/jonghoon5922/tokenbill:latest
+
+# 2) 컨테이너 교체 (볼륨·시크릿 유지)
+docker stop tokenbill && docker rm tokenbill
+docker run -d --name tokenbill -p 8000:8000 -v tokenbill-data:/data \
+  -e SECRET_KEY="$(cat ~/.tokenbill-secret)" --restart unless-stopped \
+  ghcr.io/jonghoon5922/tokenbill:latest
+
+# 3) 확인
+docker logs --tail 30 tokenbill
+curl -s -o /dev/null -w "%{http_code}\n" http://localhost:8000/
+```
+
+롤백: `ghcr.io/jonghoon5922/tokenbill:<커밋 SHA>` 태그로 같은 절차 반복 + 백업 복원.
+
+주의: `SECRET_KEY`는 한 번 정하면 **바꾸지 말 것** — 이 키로 프로바이더 API 키를
+암호화하므로, 바뀌면 저장된 키를 복호화할 수 없다.
+
+### 첫 서버 세팅 (참고)
+
+```bash
+openssl rand -hex 32 > ~/.tokenbill-secret && chmod 600 ~/.tokenbill-secret
+docker volume create tokenbill-data
+# 이후 위 "컨테이너 교체" 절차의 run 명령과 동일
+```
+
+### HTTPS
+
+외부 공개 시 앞단에 Caddy나 nginx를 두는 것을 권장.
+Caddy면 `Caddyfile`에 `내도메인.com { reverse_proxy localhost:8000 }` 두 줄로 끝.
+
+사용자가 늘면 `DATABASE_URL` 환경변수로 Postgres 전환 가능 (드라이버 추가 필요).
+
+## 다음 단계 아이디어
+
+- 예산 초과 시 이메일/텔레그램 알림 (스케줄러에서 체크)
+- 프로바이더 cost API 연동으로 정확한 청구 금액 표시
+- "한 단계 싼 모델로 바꾸면 월 $X 절약" 시뮬레이션
+- Google (Cloud Billing), 기타 프로바이더 추가

package/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "tokenbill-mcp",
+  "version": "1.0.0",
+  "description": "Tokenbill MCP — Claude Code·Codex·Gemini CLI 구독 토큰을 tokenbill.my 리더보드에 자동 집계하고, 로컬 대화 뷰어(--viewer)를 제공합니다. Auto-uploads your AI subscription token usage to the tokenbill.my leaderboard, with a local transcript viewer.",
+  "bin": {
+    "tokenbill-mcp": "./uploader/index.js"
+  },
+  "files": [
+    "uploader/"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Jonghoon5922/tokenbill.git"
+  },
+  "homepage": "https://tokenbill.my",
+  "keywords": ["mcp", "claude-code", "codex-cli", "gemini-cli", "cursor", "tokens", "leaderboard", "usage"],
+  "engines": { "node": ">=18" },
+  "license": "MIT"
+}

package/uploader/index.js

@@ -0,0 +1,291 @@
+#!/usr/bin/env node
+/**
+ * Tokenbill MCP 업로더
+ *
+ * - 시작 시 로컬 AI 사용 로그(~/.claude, ~/.codex)를 스캔해 tokenbill.my로 업로드
+ * - MCP(stdio) 서버로 동작: sync_usage(수동 동기화), my_rank(내 순위 조회) 도구 제공
+ *
+ * 등록 예:
+ *   claude mcp add tokenbill -- npx -y tokenbill-mcp@latest --token tbu_...
+ *   codex mcp add tokenbill -- npx -y tokenbill-mcp@latest --token tbu_...
+ */
+"use strict";
+const fs = require("fs");
+const path = require("path");
+const os = require("os");
+const https = require("https");
+const http = require("http");
+const readline = require("readline");
+
+// ── 설정 ────────────────────────────────────────────────────
+function arg(name) {
+  const i = process.argv.indexOf(name);
+  return i >= 0 ? process.argv[i + 1] : undefined;
+}
+const TOKEN = arg("--token") || process.env.TOKENBILL_TOKEN || "";
+const SERVER = (arg("--server") || process.env.TOKENBILL_SERVER || "https://tokenbill.my").replace(/\/$/, "");
+const LOOKBACK_DAYS = 60;
+
+// ── 로컬 뷰어 모드 (--viewer): 업로드·MCP 없이 대화 열람 웹 UI만 실행 ──
+if (process.argv.includes("--viewer")) {
+  require("./viewer").start(Number(arg("--port")) || 8377);
+  return;
+}
+
+function log(msg) { process.stderr.write(`[tokenbill] ${msg}\n`); }
+
+// ── HTTP ────────────────────────────────────────────────────
+function request(method, urlPath, body) {
+  return new Promise((resolve, reject) => {
+    const url = new URL(SERVER + urlPath);
+    const mod = url.protocol === "http:" ? http : https;
+    const data = body ? JSON.stringify(body) : null;
+    const req = mod.request(url, {
+      method,
+      headers: {
+        "Content-Type": "application/json",
+        "X-Upload-Token": TOKEN,
+        ...(data ? { "Content-Length": Buffer.byteLength(data) } : {}),
+      },
+      timeout: 30000,
+    }, (res) => {
+      let buf = "";
+      res.on("data", (c) => (buf += c));
+      res.on("end", () => {
+        try { resolve({ status: res.statusCode, json: JSON.parse(buf || "{}") }); }
+        catch { resolve({ status: res.statusCode, json: {} }); }
+      });
+    });
+    req.on("error", reject);
+    req.on("timeout", () => req.destroy(new Error("timeout")));
+    if (data) req.write(data);
+    req.end();
+  });
+}
+
+// ── 로그 스캔 공통 ──────────────────────────────────────────
+function* walkFiles(dir, ext) {
+  let entries;
+  try { entries = fs.readdirSync(dir, { withFileTypes: true }); } catch { return; }
+  for (const e of entries) {
+    const p = path.join(dir, e.name);
+    if (e.isDirectory()) yield* walkFiles(p, ext);
+    else if (e.isFile() && e.name.endsWith(ext)) yield p;
+  }
+}
+function cutoffDay() {
+  const d = new Date(Date.now() - LOOKBACK_DAYS * 86400000);
+  return d.toISOString().slice(0, 10);
+}
+function addRow(agg, day, model, inTok, outTok) {
+  if (!day || day < cutoffDay()) return;
+  const k = `${day}|${model}`;
+  const a = agg.get(k) || { day, model, input_tokens: 0, output_tokens: 0 };
+  a.input_tokens += inTok;
+  a.output_tokens += outTok;
+  agg.set(k, a);
+}
+
+// ── Claude Code (~/.claude/projects/**/*.jsonl) ─────────────
+function collectClaudeCode() {
+  const agg = new Map();
+  const seen = new Set();
+  const base = path.join(os.homedir(), ".claude", "projects");
+  for (const file of walkFiles(base, ".jsonl")) {
+    let lines;
+    try { lines = fs.readFileSync(file, "utf8").split("\n"); } catch { continue; }
+    for (const line of lines) {
+      if (!line.includes('"usage"')) continue;
+      let e;
+      try { e = JSON.parse(line); } catch { continue; }
+      const u = e && e.message && e.message.usage;
+      if (e.type !== "assistant" || !u || !e.timestamp) continue;
+      const model = (e.message.model || "claude").slice(0, 128);
+      if (model.includes("synthetic")) continue;
+      const dedup = `${e.message.id || ""}:${e.requestId || e.uuid || ""}`;
+      if (dedup !== ":" && seen.has(dedup)) continue;
+      seen.add(dedup);
+      const inTok = (u.input_tokens || 0) + (u.cache_creation_input_tokens || 0) + (u.cache_read_input_tokens || 0);
+      addRow(agg, e.timestamp.slice(0, 10), model, inTok, u.output_tokens || 0);
+    }
+  }
+  return [...agg.values()];
+}
+
+// ── Codex CLI (~/.codex/sessions/**/*.jsonl) — 형식이 자주 바뀌어 최선 노력 ──
+function collectCodex() {
+  const agg = new Map();
+  const base = path.join(os.homedir(), ".codex", "sessions");
+  for (const file of walkFiles(base, ".jsonl")) {
+    let lines;
+    try { lines = fs.readFileSync(file, "utf8").split("\n"); } catch { continue; }
+    let model = "codex";
+    let prev = null; // total 누적치를 주는 형식 대응: 직전 총계와의 차이를 사용
+    for (const line of lines) {
+      if (!line.trim()) continue;
+      let e;
+      try { e = JSON.parse(line); } catch { continue; }
+      const p = e.payload || e;
+      if (p && p.type === "turn_context" && p.model) model = String(p.model).slice(0, 128);
+      const info = p && p.info;
+      const usage = (info && (info.last_token_usage || info.total_token_usage)) ||
+                    (p && p.type === "token_count" && p.usage) || null;
+      if (!usage) continue;
+      const day = (e.timestamp || e.ts || "").slice(0, 10);
+      let inTok = (usage.input_tokens || 0) + (usage.cached_input_tokens || 0);
+      let outTok = usage.output_tokens || 0;
+      if (info && info.total_token_usage && !info.last_token_usage) {
+        // 누적 총계 형식이면 직전 값과의 증가분만 반영
+        const t = info.total_token_usage;
+        const cur = { i: (t.input_tokens || 0) + (t.cached_input_tokens || 0), o: t.output_tokens || 0 };
+        inTok = Math.max(0, cur.i - (prev ? prev.i : 0));
+        outTok = Math.max(0, cur.o - (prev ? prev.o : 0));
+        prev = cur;
+      }
+      if (inTok || outTok) addRow(agg, day, model, inTok, outTok);
+    }
+  }
+  return [...agg.values()];
+}
+
+// ── Gemini CLI (~/.gemini/tmp/**/*.json|.jsonl) ─────────────
+function geminiTokens(t) {
+  if (!t || typeof t !== "object") return null;
+  const n = (keys) => { for (const k of keys) { const v = t[k]; if (typeof v === "number" && v > 0) return Math.floor(v); } return 0; };
+  const input = n(["input", "prompt", "input_tokens", "prompt_tokens"]);       // cached 포함값
+  const output = n(["output", "candidates", "output_tokens", "candidates_tokens"]);
+  const extra = n(["thoughts", "reasoning", "thoughts_tokens", "reasoning_tokens"]) + n(["tool", "tool_tokens"]);
+  if (!input && !output && !extra) return null;
+  return { input, output: output + extra };
+}
+function collectGemini() {
+  const agg = new Map();
+  const base = path.join(os.homedir(), ".gemini", "tmp");
+  const handleMsg = (msg, fallbackDay, fallbackModel) => {
+    if (!msg || msg.type !== "gemini") return;
+    const tok = geminiTokens(msg.tokens);
+    if (!tok) return;
+    const day = (msg.timestamp || "").slice(0, 10) || fallbackDay;
+    const model = String(msg.model || fallbackModel || "gemini").slice(0, 128);
+    addRow(agg, day, model, tok.input, tok.output);
+  };
+  for (const ext of [".json", ".jsonl"]) {
+    for (const file of walkFiles(base, ext)) {
+      let content;
+      try { content = fs.readFileSync(file, "utf8"); } catch { continue; }
+      let fallbackDay = "";
+      try { fallbackDay = fs.statSync(file).mtime.toISOString().slice(0, 10); } catch {}
+      if (ext === ".json") {
+        let rec;
+        try { rec = JSON.parse(content); } catch { continue; }
+        const day = ((rec.startTime || rec.lastUpdated || "").slice(0, 10)) || fallbackDay;
+        if (Array.isArray(rec.messages)) rec.messages.forEach((m) => handleMsg(m, day, rec.model));
+        else handleMsg(rec, day, rec.model);
+      } else {
+        for (const line of content.split("\n")) {
+          if (!line.includes('"tokens"')) continue;
+          try { handleMsg(JSON.parse(line), fallbackDay); } catch {}
+        }
+      }
+    }
+  }
+  return [...agg.values()];
+}
+
+// ── 계정 식별 (소스별 로컬 설정에서 이메일 읽기) ────────────
+function claudeAccountEmail() {
+  try {
+    const j = JSON.parse(fs.readFileSync(path.join(os.homedir(), ".claude.json"), "utf8"));
+    return (j.oauthAccount && j.oauthAccount.emailAddress) || null;
+  } catch { return null; }
+}
+function geminiAccountEmail() {
+  try {
+    const j = JSON.parse(fs.readFileSync(path.join(os.homedir(), ".gemini", "google_accounts.json"), "utf8"));
+    return j.active || (Array.isArray(j.accounts) && j.accounts[0]) || null;
+  } catch { return null; }
+}
+const ACCOUNT_OF = { "claude-code": claudeAccountEmail, "codex": () => null, "gemini": geminiAccountEmail };
+
+// ── 업로드 ──────────────────────────────────────────────────
+async function syncAll() {
+  if (!TOKEN) return "업로드 토큰이 없습니다 — --token 또는 TOKENBILL_TOKEN을 설정하세요.";
+  const sources = [
+    ["claude-code", collectClaudeCode],
+    ["codex", collectCodex],
+    ["gemini", collectGemini],
+  ];
+  const results = [];
+  for (const [source, collect] of sources) {
+    let rows = [];
+    try { rows = collect(); } catch (e) { results.push(`${source}: 스캔 실패 (${e.message})`); continue; }
+    if (!rows.length) { results.push(`${source}: 사용 기록 없음`); continue; }
+    let account = null;
+    try { account = ACCOUNT_OF[source] ? ACCOUNT_OF[source]() : null; } catch {}
+    try {
+      const r = await request("POST", "/api/usage/import", { source, account, rows: rows.slice(0, 2000) });
+      results.push(r.status === 200
+        ? `${source}: ${r.json.rows}일×모델 업로드 (${r.json.from}~${r.json.to})`
+        : `${source}: 업로드 실패 (HTTP ${r.status}${r.json.detail ? " — " + r.json.detail : ""})`);
+    } catch (e) { results.push(`${source}: 업로드 실패 (${e.message})`); }
+  }
+  return results.join("\n");
+}
+
+async function myRank() {
+  try {
+    const r = await request("GET", "/api/uploader/me");
+    if (r.status !== 200) return `조회 실패 (HTTP ${r.status}${r.json.detail ? " — " + r.json.detail : ""})`;
+    const m = r.json;
+    const next = m.tier.next ? `다음 티어 '${m.tier.next.name}'까지 ${(m.tier.next.at - m.tokens).toLocaleString()} tok` : "최고 티어!";
+    return `${m.tier.emoji} ${m.nickname} — ${m.tier.name}\n이번 달 ${m.tokens.toLocaleString()} tok · $${m.cost_usd} · ${m.rank}위/${m.total_users}명\n${next}\nhttps://tokenbill.my`;
+  } catch (e) { return `조회 실패 (${e.message})`; }
+}
+
+// ── MCP (stdio, 개행 구분 JSON-RPC) ────────────────────────
+const TOOLS = [
+  { name: "sync_usage", description: "로컬 AI 사용 로그(Claude Code·Codex·Gemini CLI)를 스캔해 Tokenbill에 지금 업로드합니다.", inputSchema: { type: "object", properties: {} } },
+  { name: "my_rank", description: "Tokenbill 토큰 리더보드에서 내 이번 달 순위·티어·사용량을 조회합니다.", inputSchema: { type: "object", properties: {} } },
+];
+
+function reply(id, result) { process.stdout.write(JSON.stringify({ jsonrpc: "2.0", id, result }) + "\n"); }
+function replyErr(id, code, message) { process.stdout.write(JSON.stringify({ jsonrpc: "2.0", id, error: { code, message } }) + "\n"); }
+
+async function handle(msg) {
+  const { id, method, params } = msg;
+  if (method === "initialize") {
+    return reply(id, {
+      protocolVersion: (params && params.protocolVersion) || "2024-11-05",
+      capabilities: { tools: {} },
+      serverInfo: { name: "tokenbill", version: "0.1.0" },
+    });
+  }
+  if (method === "notifications/initialized" || (method && method.startsWith("notifications/"))) return;
+  if (method === "ping") return reply(id, {});
+  if (method === "tools/list") return reply(id, { tools: TOOLS });
+  if (method === "tools/call") {
+    const name = params && params.name;
+    let text;
+    if (name === "sync_usage") text = await syncAll();
+    else if (name === "my_rank") text = await myRank();
+    else return replyErr(id, -32602, `unknown tool: ${name}`);
+    return reply(id, { content: [{ type: "text", text }] });
+  }
+  if (id !== undefined) return replyErr(id, -32601, `method not found: ${method}`);
+}
+
+// 시작 시 1회 자동 업로드 (백그라운드)
+syncAll().then((r) => log("자동 동기화:\n" + r)).catch((e) => log("동기화 오류: " + e.message));
+
+// MCP로 떠 있는 동안 로컬 뷰어도 함께 서빙 — tokenbill.my의 '대화 뷰어' 버튼이 이 주소를 연다.
+// 127.0.0.1 전용이며 이미 다른 인스턴스가 포트를 쓰면 조용히 넘어간다.
+try { require("./viewer").start(8377, { openBrowser: false, silent: true }); } catch (e) { log("뷰어 자동 실행 생략: " + e.message); }
+
+const rl = readline.createInterface({ input: process.stdin, terminal: false });
+rl.on("line", (line) => {
+  if (!line.trim()) return;
+  let msg;
+  try { msg = JSON.parse(line); } catch { return; }
+  handle(msg).catch((e) => { if (msg.id !== undefined) replyErr(msg.id, -32603, e.message); });
+});
+rl.on("close", () => process.exit(0));

package/uploader/viewer.js

@@ -0,0 +1,550 @@
+/**
+ * Tokenbill 로컬 대화 뷰어
+ *
+ * `npx -y tokenbill-mcp@latest --viewer` 로 실행하면 127.0.0.1 전용 웹 뷰어가 뜬다.
+ * Claude Code·Codex·Gemini CLI의 로컬 로그를 읽어 세션별 대화(입력/출력/도구 호출)를 보여준다.
+ * 어떤 데이터도 외부로 전송하지 않는다 — 전부 이 PC 안에서만 읽고 표시한다.
+ */
+"use strict";
+const fs = require("fs");
+const path = require("path");
+const os = require("os");
+const http = require("http");
+
+const BASES = {
+  "claude-code": path.join(os.homedir(), ".claude", "projects"),
+  "codex": path.join(os.homedir(), ".codex", "sessions"),
+  "gemini": path.join(os.homedir(), ".gemini", "tmp"),
+};
+
+function* walkFiles(dir, exts) {
+  let entries;
+  try { entries = fs.readdirSync(dir, { withFileTypes: true }); } catch { return; }
+  for (const e of entries) {
+    const p = path.join(dir, e.name);
+    if (e.isDirectory()) yield* walkFiles(p, exts);
+    else if (e.isFile() && exts.some((x) => e.name.endsWith(x))) yield p;
+  }
+}
+
+// 경로 검증 — 허용된 로그 디렉터리 밖 파일은 절대 열지 않는다
+function allowedFile(file) {
+  const r = path.resolve(file);
+  return Object.values(BASES).some((b) => r.startsWith(path.resolve(b) + path.sep));
+}
+
+// ── Claude Code 파서 ────────────────────────────────────────
+function claudeProjectName(file) {
+  // ~/.claude/projects/<경로를-대시로-인코딩한-폴더>/<세션>.jsonl → 마지막 경로 조각만 표시
+  const folder = path.basename(path.dirname(file));
+  const parts = folder.split("-").filter(Boolean);
+  return parts.length ? parts[parts.length - 1] : folder;
+}
+function claudeText(content) {
+  if (typeof content === "string") return content;
+  if (!Array.isArray(content)) return "";
+  return content.filter((b) => b && b.type === "text").map((b) => b.text).join("\n");
+}
+function parseClaudeSession(file, full) {
+  let lines;
+  try { lines = fs.readFileSync(file, "utf8").split("\n"); } catch { return null; }
+  const s = { source: "claude-code", file, project: claudeProjectName(file),
+              start: "", end: "", msgs: 0, tokens: 0, title: "", model: "", entries: [] };
+  const seen = new Set();
+  for (const line of lines) {
+    if (!line.trim()) continue;
+    let e;
+    try { e = JSON.parse(line); } catch { continue; }
+    if (e.timestamp) { if (!s.start) s.start = e.timestamp; s.end = e.timestamp; }
+    if (e.cwd && !s.cwdSeen) { s.project = path.basename(e.cwd) || s.project; s.cwdSeen = true; }
+    if (e.type === "user" && e.message && !e.isMeta) {
+      const c = e.message.content;
+      const isToolResult = Array.isArray(c) && c.some((b) => b && b.type === "tool_result");
+      const text = claudeText(c);
+      if (isToolResult) {
+        if (full && text) s.entries.push({ role: "tool_result", time: e.timestamp, text: text.slice(0, 4000) });
+        continue;
+      }
+      if (!text || text.startsWith("<command-name>") || text.startsWith("<local-command")) continue;
+      s.msgs++;
+      if (!s.title) s.title = text.slice(0, 80).replace(/\s+/g, " ");
+      if (full) s.entries.push({ role: "user", time: e.timestamp, text });
+    } else if (e.type === "assistant" && e.message) {
+      const m = e.message;
+      const dedup = `${m.id || ""}:${e.requestId || e.uuid || ""}`;
+      const dup = dedup !== ":" && seen.has(dedup);
+      if (!dup) seen.add(dedup);
+      const u = m.usage;
+      if (u && !dup) {
+        s.tokens += (u.input_tokens || 0) + (u.cache_creation_input_tokens || 0) +
+                    (u.cache_read_input_tokens || 0) + (u.output_tokens || 0);
+      }
+      if (m.model && !m.model.includes("synthetic")) s.model = m.model;
+      if (full && Array.isArray(m.content)) {
+        for (const b of m.content) {
+          if (!b) continue;
+          if (b.type === "text" && b.text) s.entries.push({ role: "assistant", time: e.timestamp, model: m.model, text: b.text });
+          else if (b.type === "thinking" && b.thinking) s.entries.push({ role: "thinking", time: e.timestamp, text: b.thinking.slice(0, 4000) });
+          else if (b.type === "tool_use") s.entries.push({ role: "tool_use", time: e.timestamp, tool: b.name,
+            text: JSON.stringify(b.input || {}, null, 1).slice(0, 2000) });
+        }
+      }
+    }
+  }
+  return s.msgs || s.tokens ? s : null;
+}
+
+// ── Codex 파서 (형식이 자주 바뀌어 최선 노력) ───────────────
+function codexText(c) {
+  if (typeof c === "string") return c;
+  if (!Array.isArray(c)) return "";
+  return c.map((b) => (b && (b.text || b.content)) || "").filter(Boolean).join("\n");
+}
+function parseCodexSession(file, full) {
+  let lines;
+  try { lines = fs.readFileSync(file, "utf8").split("\n"); } catch { return null; }
+  const s = { source: "codex", file, project: "", start: "", end: "", msgs: 0, tokens: 0, title: "", model: "codex", entries: [] };
+  let prev = null;
+  for (const line of lines) {
+    if (!line.trim()) continue;
+    let e;
+    try { e = JSON.parse(line); } catch { continue; }
+    const ts = e.timestamp || e.ts || "";
+    if (ts) { if (!s.start) s.start = ts; s.end = ts; }
+    const p = e.payload || e;
+    if (p.type === "turn_context") { if (p.model) s.model = String(p.model); if (p.cwd) s.project = path.basename(p.cwd); }
+    if (p.type === "session_meta" && p.cwd) s.project = path.basename(p.cwd);
+    // 대화: response_item(message) / user_message / agent_message 형식 모두 시도
+    let role = null, text = "";
+    if (p.type === "message" && p.role) { role = p.role; text = codexText(p.content); }
+    else if (p.type === "response_item" && p.payload && p.payload.type === "message") { role = p.payload.role; text = codexText(p.payload.content); }
+    else if (p.type === "user_message") { role = "user"; text = p.message || codexText(p.content); }
+    else if (p.type === "agent_message") { role = "assistant"; text = p.message || codexText(p.content); }
+    if (role && text && !text.startsWith("<user_instructions>") && !text.startsWith("<environment_context>")) {
+      if (role === "user") { s.msgs++; if (!s.title) s.title = text.slice(0, 80).replace(/\s+/g, " "); }
+      if (full) s.entries.push({ role: role === "user" ? "user" : "assistant", time: ts, model: s.model, text });
+    }
+    const info = p.info;
+    const usage = (info && (info.last_token_usage || info.total_token_usage)) || (p.type === "token_count" && p.usage) || null;
+    if (usage) {
+      let inTok = (usage.input_tokens || 0) + (usage.cached_input_tokens || 0);
+      let outTok = usage.output_tokens || 0;
+      if (info && info.total_token_usage && !info.last_token_usage) {
+        const t = info.total_token_usage;
+        const cur = { i: (t.input_tokens || 0) + (t.cached_input_tokens || 0), o: t.output_tokens || 0 };
+        inTok = Math.max(0, cur.i - (prev ? prev.i : 0));
+        outTok = Math.max(0, cur.o - (prev ? prev.o : 0));
+        prev = cur;
+      }
+      s.tokens += inTok + outTok;
+    }
+  }
+  return s.msgs || s.tokens ? s : null;
+}
+
+// ── Gemini 파서 ─────────────────────────────────────────────
+function parseGeminiSession(file, full) {
+  let content;
+  try { content = fs.readFileSync(file, "utf8"); } catch { return null; }
+  let rec;
+  try { rec = JSON.parse(content); } catch { return null; }
+  if (!Array.isArray(rec.messages)) return null;
+  const s = { source: "gemini", file, project: rec.projectHash ? rec.projectHash.slice(0, 8) : "",
+              start: rec.startTime || "", end: rec.lastUpdated || "", msgs: 0, tokens: 0, title: "",
+              model: rec.model || "gemini", entries: [] };
+  for (const m of rec.messages) {
+    if (!m) continue;
+    const text = typeof m.content === "string" ? m.content : (m.text || "");
+    if (m.type === "user") {
+      s.msgs++;
+      if (!s.title && text) s.title = text.slice(0, 80).replace(/\s+/g, " ");
+      if (full && text) s.entries.push({ role: "user", time: m.timestamp || "", text });
+    } else if (m.type === "gemini") {
+      if (m.tokens) {
+        const t = m.tokens;
+        s.tokens += (t.input || t.prompt || 0) + (t.output || t.candidates || 0) + (t.thoughts || 0) + (t.tool || 0);
+      }
+      if (full && text) s.entries.push({ role: "assistant", time: m.timestamp || "", model: m.model || s.model, text });
+    }
+  }
+  return s.msgs || s.tokens ? s : null;
+}
+
+// ── Cursor 파서 (SQLite — Node 22.5+ 내장 node:sqlite 필요, 없으면 조용히 생략) ──
+let nodeSqlite = null;
+try { nodeSqlite = require("node:sqlite"); } catch {}
+function cursorDbPath() {
+  if (process.env.TOKENBILL_CURSOR_DB) return process.env.TOKENBILL_CURSOR_DB;  // 테스트용 오버라이드
+  if (process.platform === "win32") return path.join(process.env.APPDATA || "", "Cursor", "User", "globalStorage", "state.vscdb");
+  if (process.platform === "darwin") return path.join(os.homedir(), "Library", "Application Support", "Cursor", "User", "globalStorage", "state.vscdb");
+  return path.join(os.homedir(), ".config", "Cursor", "User", "globalStorage", "state.vscdb");
+}
+function cursorOpen() {
+  const p = cursorDbPath();
+  if (!nodeSqlite || !fs.existsSync(p)) return null;
+  try { return new nodeSqlite.DatabaseSync(p, { readOnly: true }); }
+  catch {
+    // Cursor 실행 중 잠금 대비 — 임시 복사본으로 열기
+    try {
+      const tmp = path.join(os.tmpdir(), "tokenbill-cursor.vscdb");
+      fs.copyFileSync(p, tmp);
+      try { fs.copyFileSync(p + "-wal", tmp + "-wal"); } catch {}
+      return new nodeSqlite.DatabaseSync(tmp, { readOnly: true });
+    } catch { return null; }
+  }
+}
+function cursorIso(ms) { return typeof ms === "number" && ms > 0 ? new Date(ms).toISOString() : ""; }
+function cursorSessions(full, onlyId) {
+  const db = cursorOpen();
+  if (!db) return [];
+  const out = [];
+  let rows = [];
+  try { rows = db.prepare("SELECT key, value FROM cursorDiskKV WHERE key LIKE 'composerData:%'").all(); } catch {}
+  let bubbleStmt = null;
+  try { bubbleStmt = db.prepare("SELECT value FROM cursorDiskKV WHERE key = ?"); } catch {}
+  for (const r of rows) {
+    let c;
+    try { c = JSON.parse(r.value); } catch { continue; }
+    const id = c.composerId || String(r.key).slice("composerData:".length);
+    if (onlyId && id !== onlyId) continue;
+    const s = { source: "cursor", file: "cursor:" + id, project: "", start: cursorIso(c.createdAt),
+                end: cursorIso(c.lastUpdatedAt || c.createdAt), msgs: 0, tokens: 0,
+                title: (c.name || "").slice(0, 80), model: "cursor", entries: [] };
+    // 구형: conversation 배열에 버블 인라인 / 신형: 헤더만 있고 버블은 bubbleId:* 키로 분리 저장
+    let bubbles = Array.isArray(c.conversation) ? c.conversation : [];
+    const headers = Array.isArray(c.fullConversationHeadersOnly) ? c.fullConversationHeadersOnly : [];
+    if (!bubbles.length && headers.length && bubbleStmt && (full || !s.title)) {
+      for (const h of headers) {
+        try {
+          const row = bubbleStmt.get("bubbleId:" + id + ":" + h.bubbleId);
+          if (row) { const b = JSON.parse(row.value); if (b.type === undefined) b.type = h.type; bubbles.push(b); }
+        } catch {}
+        if (!full && bubbles.length >= 3) break;  // 목록에서는 제목 추출용으로 앞부분만
+      }
+    }
+    for (const b of bubbles) {
+      if (!b) continue;
+      const text = typeof b.text === "string" ? b.text : "";
+      const tc = b.tokenCount;
+      if (tc) s.tokens += (tc.inputTokens || 0) + (tc.outputTokens || 0);
+      if (b.type === 1) {
+        s.msgs++;
+        if (!s.title && text) s.title = text.slice(0, 80).replace(/\s+/g, " ");
+        if (full && text) s.entries.push({ role: "user", time: cursorIso(b.createdAt) || s.start, text });
+      } else if (b.type === 2 && full && text) {
+        s.entries.push({ role: "assistant", time: cursorIso(b.createdAt) || s.start, model: (b.modelType || "cursor"), text });
+      }
+    }
+    if (!s.msgs && headers.length) s.msgs = headers.filter((h) => h && h.type === 1).length;
+    if (s.msgs) out.push(s);
+  }
+  try { db.close(); } catch {}
+  return out;
+}
+function cursorMeta(s) {
+  return { source: s.source, file: s.file, project: s.project, start: s.start, end: s.end,
+           msgs: s.msgs, tokens: s.tokens, title: s.title, model: s.model };
+}
+
+const PARSERS = { "claude-code": parseClaudeSession, "codex": parseCodexSession, "gemini": parseGeminiSession };
+const EXTS = { "claude-code": [".jsonl"], "codex": [".jsonl"], "gemini": [".json"] };
+
+// 목록은 파일 mtime 기준으로 캐시 (대화 열람은 항상 새로 읽음)
+const listCache = new Map();
+function sessionMeta(source, file) {
+  let mtime = 0;
+  try { mtime = fs.statSync(file).mtimeMs; } catch { return null; }
+  const c = listCache.get(file);
+  if (c && c.mtime === mtime) return c.meta;
+  const s = PARSERS[source](file, false);
+  const meta = s ? { source: s.source, file: s.file, project: s.project, start: s.start, end: s.end,
+                     msgs: s.msgs, tokens: s.tokens, title: s.title, model: s.model } : null;
+  listCache.set(file, { mtime, meta });
+  return meta;
+}
+function listSessions() {
+  const out = [];
+  for (const source of Object.keys(BASES)) {
+    for (const file of walkFiles(BASES[source], EXTS[source])) {
+      const m = sessionMeta(source, file);
+      if (m && m.msgs > 0) out.push(m);
+    }
+  }
+  try { cursorSessions(false).forEach((s) => out.push(cursorMeta(s))); } catch {}
+  out.sort((a, b) => (b.start || "").localeCompare(a.start || ""));
+  return out.slice(0, 500);
+}
+function grepSession(s, q, hits) {
+  for (const e of s.entries) {
+    if ((e.role !== "user" && e.role !== "assistant") || !e.text) continue;
+    const idx = e.text.toLowerCase().indexOf(q);
+    if (idx < 0) continue;
+    hits.push({ source: s.source, file: s.file, project: s.project, start: s.start, role: e.role, time: e.time,
+                snippet: e.text.slice(Math.max(0, idx - 60), idx + q.length + 120).replace(/\s+/g, " ") });
+    if (hits.length >= 50) return;
+  }
+}
+function searchSessions(q) {
+  q = q.toLowerCase();
+  const hits = [];
+  for (const source of Object.keys(BASES)) {
+    for (const file of walkFiles(BASES[source], EXTS[source])) {
+      if (hits.length >= 50) return hits;
+      const s = PARSERS[source](file, true);
+      if (s) grepSession(s, q, hits);
+    }
+  }
+  try {
+    for (const s of cursorSessions(true)) {
+      if (hits.length >= 50) break;
+      grepSession(s, q, hits);
+    }
+  } catch {}
+  return hits;
+}
+
+// ── HTML (인라인 단일 페이지 — 렌더링은 클라이언트 DOM API로만, innerHTML 미사용) ──
+const PAGE = `<!DOCTYPE html><html lang="ko"><head><meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Tokenbill 로컬 뷰어</title>
+<style>
+:root{--page:#f9f9f7;--surface:#fcfcfb;--ink:#0b0b0b;--ink2:#52514e;--muted:#898781;--grid:#e1e0d9;
+--border:rgba(11,11,11,.1);--accent:#2a78d6;--accent-ink:#1c5cab;--chip:#f0efec;
+--cc:#8a63d2;--codex:#66707d;--gem:#2a78d6}
+@media(prefers-color-scheme:dark){:root{--page:#0d0d0d;--surface:#1a1a19;--ink:#fff;--ink2:#c3c2b7;
+--muted:#898781;--grid:#2c2c2a;--border:rgba(255,255,255,.1);--accent:#3987e5;--accent-ink:#86b6ef;--chip:#262624}}
+*{box-sizing:border-box;margin:0}
+body{background:var(--page);color:var(--ink);font-family:"IBM Plex Sans KR","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;line-height:1.5;height:100vh;display:flex;flex-direction:column}
+header{padding:12px 18px 10px;border-bottom:1px solid var(--grid);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
+header h1{font-size:1.05rem;font-weight:700}header h1 b{color:var(--accent)}
+header .note{font-size:.72rem;color:var(--muted)}
+#q{margin-left:auto;width:300px;max-width:100%;padding:7px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:.84rem}
+#filters{display:flex;gap:8px;padding:9px 18px;border-bottom:1px solid var(--grid);align-items:center;flex-wrap:wrap}
+.chip{display:inline-flex;align-items:center;padding:4px 12px;border-radius:999px;border:1px solid var(--border);background:var(--surface);cursor:pointer;font:inherit;font-size:.75rem;color:var(--ink2)}
+.chip:hover{background:var(--chip)}
+.chip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
+.chip .dot2{width:8px;height:8px;border-radius:2px;margin-right:6px}
+.chip.on .dot2{background:#fff!important}
+#filters select{padding:5px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:.75rem;max-width:220px}
+#sum{margin-left:auto;font-size:.73rem;color:var(--muted);font-variant-numeric:tabular-nums}
+main{flex:1;display:flex;min-height:0}
+#side{width:360px;flex:none;border-right:1px solid var(--grid);overflow-y:auto;padding:8px;background:var(--page)}
+.sess{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border-radius:9px;border:1px solid var(--border);border-left:3px solid var(--grid);cursor:pointer;margin-bottom:5px;background:var(--surface)}
+.sess:hover{background:var(--chip)}.sess.on{background:color-mix(in srgb,var(--accent) 10%,var(--surface));border-color:color-mix(in srgb,var(--accent) 40%,var(--border))}
+.sess .body{flex:1;min-width:0}
+.sess .t{font-size:.8rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.sess .m{font-size:.68rem;color:var(--muted);display:flex;gap:6px;margin-top:3px;align-items:center;flex-wrap:wrap}
+.sess .proj{background:var(--chip);border-radius:5px;padding:0 6px;color:var(--ink2);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.sess .tok{font-size:.73rem;font-weight:700;color:var(--accent-ink);white-space:nowrap;font-variant-numeric:tabular-nums;padding-top:2px}
+.src{display:inline-block;padding:0 6px;border-radius:999px;color:#fff;font-size:.64rem;font-weight:600;line-height:1.5;white-space:nowrap;flex:none}
+#view{flex:1;overflow-y:auto;padding:20px 26px}
+.msg{max-width:860px;margin:0 auto 14px}
+.msg .hd{font-size:.7rem;color:var(--muted);margin-bottom:3px;display:flex;gap:10px}
+.msg .bd{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:11px 14px;font-size:.85rem;white-space:pre-wrap;word-break:break-word}
+.msg.user .bd{border-left:3px solid var(--accent)}
+.msg.tool .bd,.msg.think .bd{font-size:.74rem;color:var(--ink2);font-family:ui-monospace,Consolas,monospace;background:var(--chip)}
+.msg details summary{cursor:pointer;font-size:.72rem;color:var(--muted)}
+.empty{color:var(--muted);text-align:center;padding:60px 20px;font-size:.88rem}
+.sumcard{max-width:860px;margin:0 auto 18px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:12px 16px;display:flex;gap:6px 16px;align-items:center;flex-wrap:wrap;font-size:.78rem;color:var(--ink2)}
+.sumcard b{color:var(--ink)}
+.sumcard .bigtok{margin-left:auto;font-size:.95rem;font-weight:700;color:var(--accent-ink);font-variant-numeric:tabular-nums}
+@media(max-width:760px){#side{width:220px}}
+</style></head><body>
+<header><h1>Token<b>bill</b> 로컬 뷰어</h1>
+<span class="note">이 PC의 로그만 읽습니다 — 아무것도 업로드되지 않아요</span>
+<input id="q" placeholder="대화 내용 검색 (Enter)"></header>
+<div id="filters">
+  <span id="chips"></span>
+  <select id="projSel"><option value="">모든 프로젝트</option></select>
+  <select id="perSel">
+    <option value="">전체 기간</option><option value="today">오늘</option>
+    <option value="7d">최근 7일</option><option value="30d">최근 30일</option>
+    <option value="month">이번 달</option><option value="prev">지난 달</option>
+  </select>
+  <span id="sum"></span>
+</div>
+<main><div id="side"></div><div id="view"><p class="empty">왼쪽에서 세션을 선택하세요</p></div></main>
+<script>
+(function(){
+"use strict";
+var SRC={"claude-code":["Claude Code","var(--cc)"],"codex":["Codex","var(--codex)"],"gemini":["Gemini","var(--gem)"],"cursor":["Cursor","#4f8f6b"]};
+var ROLE={user:"나",assistant:"AI",tool_use:"도구 호출",tool_result:"도구 결과",thinking:"생각"};
+function el(tag,cls,text){var e=document.createElement(tag);if(cls)e.className=cls;if(text!==undefined)e.textContent=text;return e}
+function fmtTok(n){return n>=1e9?(n/1e9).toFixed(1)+"B":n>=1e6?(n/1e6).toFixed(1)+"M":n>=1e3?Math.round(n/1e3)+"K":String(n)}
+function dt(s){return s?s.slice(0,16).replace("T"," "):""}
+function pad(n){return String(n).length<2?"0"+n:String(n)}
+function isoD(d){return d.getFullYear()+"-"+pad(d.getMonth()+1)+"-"+pad(d.getDate())}
+function srcBadge(s){var b=el("span","src",SRC[s]?SRC[s][0]:s);b.style.background=SRC[s]?SRC[s][1]:"var(--accent)";return b}
+var side=document.getElementById("side"),view=document.getElementById("view");
+var chips=document.getElementById("chips"),projSel=document.getElementById("projSel"),
+    perSel=document.getElementById("perSel"),sum=document.getElementById("sum"),qIn=document.getElementById("q");
+var ALL=[],F={src:"",proj:"",per:""};
+
+// ── 필터 (검색 결과에도 동일하게 적용) ──
+function inPeriod(startIso){
+  if(!F.per)return true;
+  var st=(startIso||"").slice(0,10);if(!st)return false;
+  var now=new Date();
+  if(F.per==="today")return st===isoD(now);
+  if(F.per==="7d")return st>=isoD(new Date(now.getFullYear(),now.getMonth(),now.getDate()-6));
+  if(F.per==="30d")return st>=isoD(new Date(now.getFullYear(),now.getMonth(),now.getDate()-29));
+  if(F.per==="month")return st.slice(0,7)===isoD(now).slice(0,7);
+  if(F.per==="prev")return st.slice(0,7)===isoD(new Date(now.getFullYear(),now.getMonth()-1,1)).slice(0,7);
+  return true}
+function passes(x){return(!F.src||x.source===F.src)&&(!F.proj||x.project===F.proj)&&inPeriod(x.time||x.start)}
+function refresh(){var q=qIn.value.trim();if(q)runSearch(q);else renderList()}
+
+function renderChips(){
+  chips.textContent="";
+  var present=[];ALL.forEach(function(s){if(present.indexOf(s.source)<0)present.push(s.source)});
+  function chip(label,val,color){
+    var b=el("button","chip"+(F.src===val?" on":""));
+    if(color){var d=el("span","dot2");d.style.background=color;b.appendChild(d)}
+    b.appendChild(document.createTextNode(label));
+    b.addEventListener("click",function(){F.src=val;renderChips();refresh()});
+    chips.appendChild(b)}
+  chip("전체","",null);
+  present.forEach(function(p){chip(SRC[p]?SRC[p][0]:p,p,SRC[p]?SRC[p][1]:"var(--accent)")})}
+function renderProjects(){
+  var cnt={};ALL.forEach(function(s){if(s.project)cnt[s.project]=(cnt[s.project]||0)+1});
+  while(projSel.options.length>1)projSel.remove(1);
+  Object.keys(cnt).sort().forEach(function(p){projSel.appendChild(new Option(p+" ("+cnt[p]+")",p))})}
+
+function sessCard(s,titleText,metaExtra){
+  var d=el("div","sess");
+  d.style.borderLeftColor=SRC[s.source]?SRC[s.source][1]:"var(--accent)";
+  var body=el("div","body");
+  body.appendChild(el("div","t",titleText));
+  var m=el("div","m");m.appendChild(srcBadge(s.source));
+  if(s.project)m.appendChild(el("span","proj",s.project));
+  m.appendChild(el("span","",metaExtra));
+  body.appendChild(m);d.appendChild(body);
+  if(s.tokens!==undefined)d.appendChild(el("span","tok",fmtTok(s.tokens)));
+  d.addEventListener("click",function(){
+    Array.prototype.forEach.call(side.children,function(c){c.classList.remove("on")});
+    d.classList.add("on");loadSession(s)});
+  return d}
+
+function renderList(){
+  var list=ALL.filter(passes);
+  var tot=0;list.forEach(function(s){tot+=s.tokens});
+  sum.textContent=list.length+"개 세션 · "+fmtTok(tot)+" tok";
+  side.textContent="";
+  if(!list.length){side.appendChild(el("p","empty","조건에 맞는 세션이 없습니다"));return}
+  list.forEach(function(s){side.appendChild(sessCard(s,s.title||"(제목 없음)",dt(s.start)+" · "+s.msgs+"건"))})}
+
+function runSearch(q){
+  side.textContent="";side.appendChild(el("p","empty","검색 중…"));
+  fetch("/api/search?q="+encodeURIComponent(q)).then(function(r){return r.json()}).then(function(hits){
+    hits=hits.filter(passes);
+    sum.textContent="검색 "+hits.length+"건";
+    side.textContent="";
+    if(!hits.length){side.appendChild(el("p","empty","조건에 맞는 검색 결과가 없습니다"));return}
+    hits.forEach(function(h){side.appendChild(sessCard(h,"…"+h.snippet+"…",dt(h.time||h.start)))})})
+  .catch(function(){side.textContent="";side.appendChild(el("p","empty","검색 실패"))})}
+
+function loadList(){
+  fetch("/api/sessions").then(function(r){return r.json()}).then(function(list){
+    ALL=list;renderChips();renderProjects();renderList()})
+  .catch(function(){side.textContent="";side.appendChild(el("p","empty","목록을 불러오지 못했습니다"))})}
+
+function loadSession(s){
+  view.textContent="";view.appendChild(el("p","empty","불러오는 중…"));
+  fetch("/api/session?file="+encodeURIComponent(s.file)).then(function(r){return r.json()}).then(function(d){
+    view.textContent="";
+    var sc=el("div","sumcard");sc.appendChild(srcBadge(d.source));
+    if(d.project){var b1=el("span");b1.appendChild(el("b","",d.project));sc.appendChild(b1)}
+    sc.appendChild(el("span","",dt(d.start)+" ~ "+dt(d.end).slice(11)));
+    if(d.model)sc.appendChild(el("span","",d.model));
+    sc.appendChild(el("span","bigtok",fmtTok(d.tokens)+" tok"));
+    view.appendChild(sc);
+    d.entries.forEach(function(e){
+      var role=e.role==="tool_use"||e.role==="tool_result"?"tool":e.role==="thinking"?"think":e.role;
+      var m=el("div","msg "+role);
+      if(e.role==="tool_use"||e.role==="tool_result"||e.role==="thinking"){
+        var det=el("details");var summ=el("summary","",ROLE[e.role]+(e.tool?" — "+e.tool:"")+"  ("+dt(e.time).slice(11)+")");
+        det.appendChild(summ);var bd=el("div","bd",e.text);det.appendChild(bd);m.appendChild(det)}
+      else{var hd=el("div","hd");hd.appendChild(el("span","",ROLE[e.role]||e.role));
+        if(e.model)hd.appendChild(el("span","",e.model));hd.appendChild(el("span","",dt(e.time)));
+        m.appendChild(hd);m.appendChild(el("div","bd",e.text))}
+      view.appendChild(m)});
+    view.scrollTop=0})
+  .catch(function(){view.textContent="";view.appendChild(el("p","empty","세션을 불러오지 못했습니다"))})}
+
+projSel.addEventListener("change",function(){F.proj=this.value;refresh()});
+perSel.addEventListener("change",function(){F.per=this.value;refresh()});
+qIn.addEventListener("keydown",function(ev){if(ev.key==="Enter")refresh()});
+loadList();
+})();
+</script></body></html>`;
+
+function json(res, obj) {
+  res.writeHead(200, { "Content-Type": "application/json; charset=utf-8" });
+  res.end(JSON.stringify(obj));
+}
+
+function start(port, opts) {
+  port = port || 8377;
+  opts = opts || {};
+  const server = http.createServer((req, res) => {
+    const u = new URL(req.url, "http://127.0.0.1");
+    // DNS 리바인딩 방지 — 로컬 호스트명이 아닌 Host 헤더는 거부
+    const hostHdr = String(req.headers.host || "");
+    if (!/^(127\.0\.0\.1|localhost|\[::1\])(:\d+)?$/.test(hostHdr)) { res.writeHead(403); return res.end("forbidden"); }
+    try {
+      if (req.method === "OPTIONS") {
+        // 공개 사이트 → 로컬 주소 fetch에 필요한 PNA/CORS preflight 응답
+        res.writeHead(204, {
+          "Access-Control-Allow-Origin": "*",
+          "Access-Control-Allow-Methods": "GET, OPTIONS",
+          "Access-Control-Allow-Headers": "*",
+          "Access-Control-Allow-Private-Network": "true",
+        });
+        return res.end();
+      }
+      if (u.pathname === "/api/ping") {
+        // 포탈(tokenbill.my)의 '뷰어 실행 중' 감지용 — 민감 정보 없음이라 CORS 허용
+        res.writeHead(200, { "Content-Type": "application/json", "Access-Control-Allow-Origin": "*" });
+        return res.end('{"ok":true,"app":"tokenbill-viewer"}');
+      }
+      if (u.pathname === "/") {
+        res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+        return res.end(PAGE);
+      }
+      if (u.pathname === "/api/sessions") return json(res, listSessions());
+      if (u.pathname === "/api/session") {
+        const file = u.searchParams.get("file") || "";
+        if (/^cursor:[A-Za-z0-9-]{1,64}$/.test(file)) {
+          return json(res, cursorSessions(true, file.slice(7))[0] || { entries: [] });
+        }
+        if (!allowedFile(file)) { res.writeHead(403); return res.end("forbidden"); }
+        const source = Object.keys(BASES).find((s) => path.resolve(file).startsWith(path.resolve(BASES[s]) + path.sep));
+        const s = PARSERS[source](file, true);
+        return json(res, s || { entries: [] });
+      }
+      if (u.pathname === "/api/search") {
+        const q = (u.searchParams.get("q") || "").trim();
+        return json(res, q.length >= 2 ? searchSessions(q) : []);
+      }
+      res.writeHead(404); res.end("not found");
+    } catch (e) {
+      res.writeHead(500); res.end(String(e.message || e));
+    }
+  });
+  server.listen(port, "127.0.0.1", () => {
+    const url = `http://127.0.0.1:${port}`;
+    process.stderr.write(`[tokenbill] 로컬 뷰어 실행 중: ${url}\n`);
+    process.stderr.write(`[tokenbill] 이 PC의 로그만 읽으며, 어떤 데이터도 외부로 전송하지 않습니다.\n`);
+    if (opts.openBrowser !== false) {
+      const opener = process.platform === "win32" ? `start "" "${url}"` : process.platform === "darwin" ? `open "${url}"` : `xdg-open "${url}"`;
+      try { require("child_process").exec(opener); } catch {}
+    }
+  });
+  server.on("error", (e) => {
+    if (opts.silent) { process.stderr.write(`[tokenbill] 뷰어 자동 실행 생략: ${e.message}\n`); return; }
+    process.stderr.write(`[tokenbill] 뷰어 시작 실패: ${e.message} (다른 포트: --port 8378)\n`);
+    process.exit(1);
+  });
+}
+
+module.exports = { start };