From da1c60458b0d28e84739475491a3f2d61ed8eff8 Mon Sep 17 00:00:00 2001
From: Elvis Claros Castro <elvis@claros.ar>
Date: Sun, 16 Aug 2026 19:56:31 -0300
Subject: =?UTF-8?q?Estado=20inicial:=20el=20explorador=20como=20script=20?=
 =?UTF-8?q?=C3=BAnico?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Punto de partida antes de preparar el repo para publicarlo: el CLI en un
solo archivo, el template y el build.sh que los pega.

Los datos generados (data.json, sesiones.html) quedan fuera desde el primer
commit: son transcripciones completas de conversaciones privadas.

Claude-Session: https://claude.ai/code/session_01RmtZ9qBemrc9TncwVTG6ED
---
 .gitignore      |  20 ++
 build.sh        |  47 +++
 claude-sesiones | 775 +++++++++++++++++++++++++++++++++++++++++++++
 template.html   | 951 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 1793 insertions(+)
 create mode 100644 .gitignore
 create mode 100755 build.sh
 create mode 100755 claude-sesiones
 create mode 100644 template.html

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..7bc8854
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,20 @@
+# Salida del propio comando: son transcripciones completas de tus chats.
+# Nunca las commitees.
+sesiones.html
+data.json
+*.html
+!claude_sesiones/template.html
+
+# Python
+__pycache__/
+*.py[cod]
+build/
+dist/
+*.egg-info/
+.venv/
+venv/
+
+# Editores / SO
+.DS_Store
+.idea/
+.vscode/
diff --git a/build.sh b/build.sh
new file mode 100755
index 0000000..264c529
--- /dev/null
+++ b/build.sh
@@ -0,0 +1,47 @@
+#!/usr/bin/env bash
+# Genera sesiones.html a partir de los logs en ~/.claude/projects/
+#
+#   ./build.sh            genera sesiones.html
+#   ./build.sh --open     genera y abre en el navegador
+#
+# El HTML que sale es autocontenido: los datos y las transcripciones van
+# embebidos adentro, no necesita red ni servidor. Se abre con doble clic.
+
+set -euo pipefail
+
+cd "$(dirname "$0")"
+
+# El CLI es la única implementación del parseo; el HTML consume su --json.
+./claude-sesiones --json > data.json
+
+python3 - <<'PY'
+import json
+
+template = open("template.html").read()
+raw = open("data.json").read()
+
+# El payload vive dentro de un <script type="application/json">, que el parser
+# de HTML corta en el primer "</script". Escapamos "</" como "<\/" — es un
+# escape válido de JSON, así que JSON.parse lo devuelve intacto.
+payload = raw.replace("</", "<\\/")
+
+# Ojo: no se puede verificar buscando __DATA__ en la salida. Estas mismas
+# sesiones incluyen conversaciones sobre este script, así que el payload
+# contiene el marcador como texto. Validamos el template antes de sustituir.
+if template.count("__DATA__") != 1:
+    raise SystemExit("error: el template debe tener exactamente un __DATA__")
+
+html = template.replace("__DATA__", payload)
+
+open("sesiones.html", "w").write(html)
+
+s = json.loads(raw)
+print(f"{len(s)} sesiones · "
+      f"{len({x['p'] for x in s})} proyectos · "
+      f"{sum(x['u'] for x in s)} mensajes · "
+      f"{sum(len(x['c']) for x in s)} bloques de transcripción → sesiones.html")
+PY
+
+if [[ "${1:-}" == "--open" ]]; then
+  xdg-open sesiones.html >/dev/null 2>&1 &
+fi
diff --git a/claude-sesiones b/claude-sesiones
new file mode 100755
index 0000000..4127a68
--- /dev/null
+++ b/claude-sesiones
@@ -0,0 +1,775 @@
+#!/usr/bin/env python3
+"""Explorador de sesiones de Claude Code para la terminal.
+
+Claude Code guarda una conversación por archivo en
+~/.claude/projects/<ruta-del-proyecto-codificada>/<uuid>.jsonl
+
+    claude-sesiones                     tabla de todas las sesiones
+    claude-sesiones docker              filtra por título, ruta o rama
+    claude-sesiones -s 3                lee el chat nº 3 de la tabla
+    claude-sesiones -s 5d10f1ee         lo mismo, por prefijo de UUID
+    claude-sesiones -g "port already"   busca dentro de las conversaciones
+    claude-sesiones -r 3                imprime el comando para reanudarla
+    claude-sesiones --json              vuelca todo en JSON (lo usa build.sh)
+
+Sin dependencias: solo la biblioteca estándar.
+"""
+
+import argparse
+import glob
+import json
+import os
+import re
+import shutil
+import subprocess
+import sys
+import textwrap
+import time
+from datetime import datetime, timezone
+
+PROJ_ROOT = os.path.join(os.path.expanduser("~"), ".claude", "projects")
+CACHE = os.path.join(
+    os.environ.get("XDG_CACHE_HOME", os.path.expanduser("~/.cache")),
+    "claude-sesiones", "cache.json",
+)
+
+# ─────────────────────────── parseo de los .jsonl ───────────────────────────
+
+TAG_RE = re.compile(r"<[^>]+>")
+REMINDER_RE = re.compile(r"<system-reminder>.*?</system-reminder>", re.S)
+
+# Un mensaje que empieza con alguno de estos no es texto del usuario: es un
+# bloque que genera la propia CLI al ejecutar un comando local.
+SKIP_PREFIXES = (
+    "<local-command-caveat", "<command-name", "<command-message",
+    "<command-args", "<local-command-stdout", "<system-reminder",
+)
+
+TITLE_MAX = 160
+TOOL_ARG_MAX = 140
+
+# Para cada herramienta, el parámetro que mejor resume qué hizo.
+TOOL_KEY = {
+    "Bash": "command", "Read": "file_path", "Edit": "file_path",
+    "Write": "file_path", "NotebookEdit": "notebook_path", "Glob": "pattern",
+    "Grep": "pattern", "WebFetch": "url", "WebSearch": "query",
+    "Task": "description", "Agent": "description", "Skill": "skill",
+}
+
+
+def clean_text(s):
+    """Devuelve texto de usuario legible, o None si es ruido del harness."""
+    if not isinstance(s, str):
+        return None
+    s = s.strip()
+    if not s or s.startswith(SKIP_PREFIXES):
+        return None
+    s = REMINDER_RE.sub(" ", s)
+    s = TAG_RE.sub(" ", s)
+    s = re.sub(r"\s+", " ", s).strip()
+    return s if len(s) >= 3 else None
+
+
+def tool_summary(block):
+    """Una línea del estilo 'Bash: git status' para una llamada a herramienta."""
+    name = block.get("name") or "tool"
+    args = block.get("input") or {}
+    if not isinstance(args, dict):
+        return name
+    val = args.get(TOOL_KEY.get(name, ""))
+    if val is None:
+        val = next((v for v in args.values() if isinstance(v, str)), None)
+    if not isinstance(val, str):
+        return name
+    val = re.sub(r"\s+", " ", val).strip()
+    if len(val) > TOOL_ARG_MAX:
+        val = val[:TOOL_ARG_MAX] + "…"
+    return f"{name}: {val}" if val else name
+
+
+def blocks_of(message):
+    content = message.get("content")
+    if isinstance(content, str):
+        return [{"type": "text", "text": content}]
+    return content if isinstance(content, list) else []
+
+
+def parse_ts(ts):
+    if not ts:
+        return None
+    try:
+        return datetime.fromisoformat(ts.replace("Z", "+00:00"))
+    except ValueError:
+        return None
+
+
+def read_session(path):
+    session_id = os.path.basename(path)[:-6]  # sin .jsonl
+    first_ts = last_ts = cwd = git_branch = version = None
+    ai_title = fallback_title = None
+    user_msgs = assistant_msgs = 0
+    convo = []
+
+    with open(path, "r", errors="ignore") as f:
+        for line in f:
+            line = line.strip()
+            if not line:
+                continue
+            try:
+                obj = json.loads(line)
+            except json.JSONDecodeError:
+                continue  # línea truncada por una sesión que sigue escribiendo
+
+            kind = obj.get("type")
+
+            if kind == "ai-title":
+                if obj.get("aiTitle"):
+                    ai_title = obj["aiTitle"]  # nos quedamos con el más reciente
+                continue
+
+            ts = obj.get("timestamp")
+            if ts:
+                if first_ts is None:
+                    first_ts = ts
+                last_ts = ts
+            if cwd is None and obj.get("cwd"):
+                cwd = obj["cwd"]
+            if git_branch is None and obj.get("gitBranch"):
+                git_branch = obj["gitBranch"]
+            if obj.get("version"):
+                version = obj["version"]
+
+            if kind not in ("user", "assistant") or obj.get("isSidechain"):
+                continue
+
+            if kind == "user":
+                if obj.get("isMeta"):
+                    continue
+                for b in blocks_of(obj.get("message", {})):
+                    if not isinstance(b, dict):
+                        continue
+                    if b.get("type") == "text":
+                        text = clean_text(b.get("text"))
+                        if text:
+                            user_msgs += 1
+                            if fallback_title is None:
+                                fallback_title = text[:TITLE_MAX]
+                            convo.append({"r": "u", "x": text})
+                    elif b.get("type") == "image":
+                        convo.append({"r": "u", "x": "[imagen adjunta]"})
+            else:
+                counted = False
+                for b in blocks_of(obj.get("message", {})):
+                    if not isinstance(b, dict):
+                        continue
+                    if b.get("type") == "text":
+                        text = (b.get("text") or "").strip()
+                        if text:
+                            convo.append({"r": "a", "x": text})
+                            counted = True
+                    elif b.get("type") == "tool_use":
+                        convo.append({"r": "t", "x": tool_summary(b)})
+                if counted:
+                    assistant_msgs += 1
+
+    st = os.stat(path)
+    ft, lt = parse_ts(first_ts), parse_ts(last_ts)
+
+    # Un único mensaje enorme y ninguna ida y vuelta es la firma de un
+    # `claude -p` con algo piped por stdin (p. ej. un git diff para redactar el
+    # mensaje de commit), no de una conversación.
+    noninteractive = (
+        user_msgs == 1 and not ai_title and bool(convo)
+        and len(convo[0]["x"]) > 1500
+    )
+
+    return {
+        "id": session_id,
+        "project_dir": os.path.basename(os.path.dirname(path)),
+        "p": cwd,
+        "b": git_branch,
+        "t": ai_title or fallback_title,
+        "ai": bool(ai_title),
+        "n": noninteractive,
+        "e": not convo,
+        "f": first_ts,
+        "l": last_ts,
+        "d": round((lt - ft).total_seconds() / 60) if ft and lt else None,
+        "u": user_msgs,
+        "a": assistant_msgs,
+        "k": round(st.st_size / 1024, 1),
+        "v": version,
+        "c": convo,
+        "mtime": datetime.fromtimestamp(st.st_mtime, tz=timezone.utc).isoformat(),
+    }
+
+
+def load_sessions(use_cache=True):
+    """Parsea todas las sesiones, reusando del caché las que no cambiaron."""
+    paths = sorted(glob.glob(os.path.join(PROJ_ROOT, "*", "*.jsonl")))
+
+    cache = {}
+    if use_cache:
+        try:
+            with open(CACHE) as f:
+                cache = json.load(f)
+        except (OSError, json.JSONDecodeError):
+            cache = {}
+
+    sessions, fresh = [], {}
+    for path in paths:
+        try:
+            st = os.stat(path)
+        except OSError:
+            continue
+        stamp = f"{st.st_mtime_ns}:{st.st_size}"
+        hit = cache.get(path)
+        if hit and hit.get("stamp") == stamp:
+            rec = hit["rec"]
+        else:
+            try:
+                rec = read_session(path)
+            except OSError:
+                continue
+        fresh[path] = {"stamp": stamp, "rec": rec}
+        sessions.append(rec)
+
+    if use_cache and fresh != cache:
+        try:
+            os.makedirs(os.path.dirname(CACHE), exist_ok=True)
+            tmp = CACHE + ".tmp"
+            with open(tmp, "w") as f:
+                json.dump(fresh, f, ensure_ascii=False, separators=(",", ":"))
+            os.replace(tmp, CACHE)
+        except OSError:
+            pass  # el caché es una optimización, no una condición de uso
+
+    # Algunas sesiones (un /resume cancelado) nunca registran cwd. El nombre del
+    # directorio no se puede invertir de forma fiable porque "/" y "." se
+    # codifican los dos como "-", así que tomamos la ruta prestada de otra
+    # sesión del mismo proyecto y lo dejamos marcado.
+    known = {}
+    for s in sessions:
+        if s["p"]:
+            known.setdefault(s["project_dir"], s["p"])
+
+    for s in sessions:
+        s["i"] = not s["p"]
+        if not s["p"]:
+            s["p"] = known.get(s["project_dir"], s["project_dir"])
+        if not s["l"]:
+            s["l"] = s["mtime"]
+        if not s["f"]:
+            s["f"] = s["mtime"]
+
+    sessions.sort(key=lambda s: s["l"], reverse=True)
+    return sessions
+
+
+# ──────────────────────────────── presentación ────────────────────────────────
+
+MES = ["ene", "feb", "mar", "abr", "may", "jun",
+       "jul", "ago", "sep", "oct", "nov", "dic"]
+
+
+class Style:
+    """Códigos ANSI, o cadenas vacías si la salida no es una terminal."""
+
+    def __init__(self, enabled):
+        self.on = enabled
+
+    def __getattr__(self, name):
+        codes = {
+            "reset": "0", "bold": "1", "dim": "2", "italic": "3",
+            "amber": "38;5;179", "copper": "38;5;173", "grey": "38;5;245",
+            "faint": "38;5;240", "ink": "38;5;252", "blue": "38;5;110",
+        }
+        if name not in codes:
+            raise AttributeError(name)
+        return f"\x1b[{codes[name]}m" if self.on else ""
+
+
+def visible_len(s):
+    return len(re.sub(r"\x1b\[[0-9;]*m", "", s))
+
+
+def clip(s, width):
+    """Recorta a `width` columnas, con … si no entra."""
+    s = s.replace("\n", " ")
+    if len(s) <= width:
+        return s
+    return s[: max(0, width - 1)] + "…"
+
+
+def fmt_date(iso):
+    d = parse_ts(iso).astimezone()
+    return f"{d.day:02d} {MES[d.month - 1]}"
+
+
+def fmt_time(iso):
+    return parse_ts(iso).astimezone().strftime("%H:%M")
+
+
+def fmt_rel(iso, now):
+    n = (now - parse_ts(iso)).total_seconds() / 86400
+    if n < 1:
+        return "hoy"
+    if n < 2:
+        return "ayer"
+    if n < 7:
+        return f"hace {int(n)}d"
+    if n < 30:
+        return f"hace {int(n // 7)}sem"
+    return f"hace {int(n // 30)}mes"
+
+
+def plural(n, singular, plural_):
+    return f"{n} {singular if n == 1 else plural_}"
+
+
+def fmt_dur(m):
+    if m is None:
+        return "—"
+    if m < 1:
+        return "<1m"
+    if m < 60:
+        return f"{m}m"
+    h, r = divmod(m, 60)
+    return f"{h}h{r:02d}" if r else f"{h}h"
+
+
+def stripe(iso, now, st):
+    """Barra de antigüedad, del ámbar vivo al gris."""
+    n = (now - parse_ts(iso)).total_seconds() / 86400
+    if not st.on:
+        return "|"
+    if n < 2:
+        return f"\x1b[38;5;214m▌{st.reset}"
+    if n < 7:
+        return f"\x1b[38;5;179m▌{st.reset}"
+    if n < 14:
+        return f"\x1b[38;5;137m▌{st.reset}"
+    return f"\x1b[38;5;239m▌{st.reset}"
+
+
+def print_table(sessions, st, now, out):
+    width = shutil.get_terminal_size((100, 24)).columns
+    show_path = width >= 92
+    show_dur = width >= 74
+
+    # columnas fijas: idx(3) barra(1) fecha(6) rel(9) msgs(4) dur(6) id(8) + gaps
+    fixed = 3 + 1 + 6 + 9 + 4 + (6 if show_dur else 0) + 8
+    gaps = 7 if show_dur else 6
+    flex = max(24, width - fixed - gaps)
+    w_title = int(flex * 0.58) if show_path else flex
+    w_path = flex - w_title - 1 if show_path else 0
+
+    head = [
+        f"{'#':>3}", " ",
+        f"{st.faint}{'SESIÓN':<{w_title}}{st.reset}",
+    ]
+    if show_path:
+        head.append(f"{st.faint}{'RUTA':<{w_path}}{st.reset}")
+    head.append(f"{st.faint}{'FECHA':<6} {'CUÁNDO':<9}{st.reset}")
+    head.append(f"{st.faint}{'MSG':>4}{st.reset}")
+    if show_dur:
+        head.append(f"{st.faint}{'DUR':>6}{st.reset}")
+    head.append(f"{st.faint}{'ID':<8}{st.reset}")
+    print(" ".join(head), file=out)
+
+    for i, s in enumerate(sessions, 1):
+        title = s["t"] or "sesión abierta sin mensajes"
+        tcolor = st.dim + st.italic if s["e"] else (st.ink if s["ai"] else "")
+        tags = ""
+        if s["e"]:
+            tags = f" {st.faint}[vacía]{st.reset}"
+        elif s["n"]:
+            tags = f" {st.faint}[auto]{st.reset}"
+
+        avail = w_title - visible_len(tags)
+        cells = [
+            f"{st.faint}{i:>3}{st.reset}",
+            stripe(s["l"], now, st),
+            f"{tcolor}{clip(title, avail):<{avail}}{st.reset}{tags}",
+        ]
+        if show_path:
+            cells.append(f"{st.grey}{clip(s['p'], w_path):<{w_path}}{st.reset}")
+        cells.append(
+            f"{fmt_date(s['l']):<6} {st.faint}{fmt_rel(s['l'], now):<9}{st.reset}"
+        )
+        cells.append(f"{s['u'] or '—':>4}")
+        if show_dur:
+            cells.append(f"{st.grey}{fmt_dur(s['d']):>6}{st.reset}")
+        cells.append(f"{st.faint}{s['id'][:8]}{st.reset}")
+        print(" ".join(cells), file=out)
+
+
+def strip_md(text):
+    """Markdown mínimo para la terminal: saca ** y marcadores de título."""
+    text = re.sub(r"^#{1,6}\s+", "", text, flags=re.M)
+    return re.sub(r"\*\*([^*\n]+)\*\*", r"\1", text)
+
+
+def render_block(text, st, width, code_color):
+    """Formatea un mensaje respetando las cercas de código."""
+    lines = []
+    in_code = False
+    for raw in text.split("\n"):
+        if raw.lstrip().startswith("```"):
+            in_code = not in_code
+            continue
+        if in_code:
+            lines.append(f"  {code_color}{raw}{st.reset}")
+        elif not raw.strip():
+            lines.append("")
+        else:
+            wrapped = textwrap.wrap(
+                strip_md(raw), width=width,
+                break_long_words=False, break_on_hyphens=False,
+            )
+            lines.extend("  " + w for w in (wrapped or [""]))
+    return lines
+
+
+def print_chat(s, st, now, out, show_tools=True):
+    width = min(shutil.get_terminal_size((100, 24)).columns, 100)
+    body = width - 2
+
+    print(f"{st.amber}{st.bold}{s['t'] or 'Sesión sin título'}{st.reset}", file=out)
+    meta = (f"{s['p']}  ·  {fmt_date(s['l'])} {fmt_time(s['l'])}  ·  "
+            f"{s['u']} tuyos / {s['a']} de Claude  ·  {fmt_dur(s['d'])}")
+    print(f"{st.faint}{meta}{st.reset}", file=out)
+    print(f"{st.faint}cd {s['p']} && claude --resume {s['id']}{st.reset}", file=out)
+    print(f"{st.faint}{'─' * min(width, 80)}{st.reset}\n", file=out)
+
+    if not s["c"]:
+        print(f"{st.dim}Esta sesión no tiene mensajes.{st.reset}", file=out)
+        return
+
+    first = True
+    for m in s["c"]:
+        if m["r"] == "t":
+            if show_tools:
+                print(f"  {st.faint}⚒ {clip(m['x'], body - 4)}{st.reset}", file=out)
+                first = False
+            continue
+
+        # La separación va antes de cada turno: así una tanda de herramientas
+        # queda pegada al mensaje que la lanzó y separada del siguiente.
+        if not first:
+            print(file=out)
+        first = False
+
+        who = "vos" if m["r"] == "u" else "claude"
+        color = st.amber if m["r"] == "u" else st.blue
+        print(f"{color}{who}{st.reset}", file=out)
+        for line in render_block(m["x"], st, body, st.grey):
+            print(line, file=out)
+
+
+def pager(text):
+    """Manda el texto a $PAGER si hay terminal; si no, a stdout."""
+    if not sys.stdout.isatty():
+        sys.stdout.write(text)
+        return
+    cmd = os.environ.get("PAGER", "less")
+    args = [cmd, "-R", "-F", "-X"] if os.path.basename(cmd) == "less" else [cmd]
+    try:
+        p = subprocess.Popen(args, stdin=subprocess.PIPE)
+        p.communicate(text.encode())
+    except (OSError, BrokenPipeError):
+        sys.stdout.write(text)
+
+
+# ──────────────────────────────── filtros ────────────────────────────────
+
+def pick(sessions, ref):
+    """Resuelve un índice de la tabla (1-based) o un prefijo de UUID."""
+    if ref.isdigit():
+        i = int(ref)
+        if 1 <= i <= len(sessions):
+            return sessions[i - 1]
+        sys.exit(f"error: el índice {i} está fuera de rango (hay {len(sessions)})")
+
+    hits = [s for s in sessions if s["id"].startswith(ref.lower())]
+    if len(hits) == 1:
+        return hits[0]
+    if not hits:
+        sys.exit(f"error: ninguna sesión empieza con '{ref}'")
+    sys.exit(f"error: '{ref}' es ambiguo, coincide con {len(hits)} sesiones")
+
+
+def apply_filters(sessions, args):
+    out = sessions
+
+    if args.project:
+        needle = os.path.expanduser(args.project).rstrip("/").lower()
+        out = [s for s in out if needle in s["p"].lower()]
+
+    if args.grep:
+        needle = args.grep.lower()
+        out = [s for s in out
+               if any(needle in m["x"].lower() for m in s["c"])]
+
+    if args.query:
+        needle = " ".join(args.query).lower()
+        out = [s for s in out
+               if needle in (s["t"] or "").lower()
+               or needle in s["p"].lower()
+               or needle in (s["b"] or "").lower()
+               or s["id"].startswith(needle)]
+
+    if args.hide_empty:
+        out = [s for s in out if not s["e"]]
+
+    return out
+
+
+# ──────────────────────────────── borrado ────────────────────────────────
+
+def session_path(s):
+    """Ruta del .jsonl. El nombre del archivo es el UUID y el del directorio
+    padre es lo que ya guardamos en project_dir, así que es reconstruible."""
+    return os.path.join(PROJ_ROOT, s["project_dir"], s["id"] + ".jsonl")
+
+
+def confirm(question):
+    """Pregunta s/N. Sin terminal no hay confirmación posible: devuelve False."""
+    try:
+        tty = open("/dev/tty")
+    except OSError:
+        return False
+    try:
+        sys.stderr.write(question)
+        sys.stderr.flush()
+        return tty.readline().strip().lower() in ("s", "si", "sí", "y", "yes")
+    except (OSError, KeyboardInterrupt):
+        return False
+    finally:
+        tty.close()
+
+
+def drop_from_cache(paths):
+    """Saca del caché las sesiones borradas para que no reaparezcan."""
+    try:
+        with open(CACHE) as f:
+            cache = json.load(f)
+    except (OSError, json.JSONDecodeError):
+        return
+    for p in paths:
+        cache.pop(p, None)
+    try:
+        tmp = CACHE + ".tmp"
+        with open(tmp, "w") as f:
+            json.dump(cache, f, ensure_ascii=False, separators=(",", ":"))
+        os.replace(tmp, CACHE)
+    except OSError:
+        pass
+
+
+def delete_sessions(targets, args, st, now):
+    """Manda a la papelera (o borra) las sesiones dadas. Devuelve el código de salida."""
+    if not targets:
+        print("No hay sesiones que borrar con ese criterio.", file=sys.stderr)
+        return 0
+
+    print(f"{st.bold}Se van a borrar "
+          f"{plural(len(targets), 'sesión', 'sesiones')}:{st.reset}\n")
+
+    total_kb = 0
+    recent = []
+    for s in targets:
+        path = session_path(s)
+        total_kb += s["k"]
+        title = s["t"] or "sesión abierta sin mensajes"
+        flag = ""
+        try:
+            if time.time() - os.stat(path).st_mtime < 300:
+                recent.append(s)
+                flag = f" {st.copper}← modificada hace menos de 5 min{st.reset}"
+        except OSError:
+            flag = f" {st.copper}← ya no existe{st.reset}"
+        print(f"  {st.faint}{s['id'][:8]}{st.reset} {clip(title, 52):<52} "
+              f"{st.grey}{clip(s['p'], 34):<34}{st.reset} "
+              f"{fmt_date(s['l'])} {st.faint}{s['k']:>7.1f} KB{st.reset}{flag}")
+
+    size = (f"{total_kb / 1024:.1f} MB" if total_kb >= 1024
+            else f"{total_kb:.1f} KB")
+    print(f"\n{st.faint}{size} en total{st.reset}")
+
+    if recent:
+        verbo = "se escribió" if len(recent) == 1 else "se escribieron"
+        print(f"\n{st.copper}Ojo: {len(recent)} de estas {verbo} hace menos de "
+              f"5 minutos. Si es una sesión abierta ahora mismo, Claude Code la "
+              f"sigue usando y va a volver a escribirla al cerrarse.{st.reset}")
+
+    if args.dry_run:
+        print(f"\n{st.faint}--dry-run: no se tocó nada.{st.reset}")
+        return 0
+
+    if not args.yes:
+        print(f"\n{st.copper}Esto no se puede deshacer.{st.reset}")
+        if not confirm("¿Confirmás? [s/N] "):
+            print("Cancelado.", file=sys.stderr)
+            return 1
+
+    done, failed, paths = 0, 0, []
+    for s in targets:
+        path = session_path(s)
+        try:
+            os.remove(path)
+            paths.append(path)
+            done += 1
+        except OSError as e:
+            print(f"error: {s['id'][:8]}: {e}", file=sys.stderr)
+            failed += 1
+
+    drop_from_cache(paths)
+
+    print(f"\n{plural(done, 'sesión borrada', 'sesiones borradas')}.")
+    return 1 if failed else 0
+
+
+def main():
+    ap = argparse.ArgumentParser(
+        prog="claude-sesiones",
+        description="Explorador de sesiones de Claude Code para la terminal.",
+        formatter_class=argparse.RawDescriptionHelpFormatter,
+        epilog=textwrap.dedent("""\
+            ejemplos:
+              claude-sesiones                     tabla de todas las sesiones
+              claude-sesiones docker              filtra por título, ruta o rama
+              claude-sesiones -s 3                lee el chat nº 3 de la tabla
+              claude-sesiones -s 5d10f1ee         lo mismo, por prefijo de UUID
+              claude-sesiones -g "port already"   busca dentro de las conversaciones
+              claude-sesiones -r 3                comando para reanudar la nº 3
+              eval "$(claude-sesiones -r 3)"      reanudarla directamente
+
+            el nº es la posición en la tabla que estás viendo, así que si filtraste
+            hay que repetir el filtro para leer esa fila:
+
+              claude-sesiones docker              muestra 3 resultados
+              claude-sesiones docker -s 2         lee el 2º de esos tres
+
+            borrado (irreversible; pregunta antes, salvo con -y):
+              claude-sesiones --delete-empty --dry-run   qué borraría
+              claude-sesiones --delete-empty             borra las vacías
+              claude-sesiones -D 101 -D e0a4300e         borra sesiones puntuales
+              claude-sesiones -p /tmp --delete-empty     solo las vacías de ese proyecto
+        """),
+    )
+    ap.add_argument("query", nargs="*", help="texto a buscar en título, ruta o rama")
+    ap.add_argument("-s", "--show", metavar="REF",
+                    help="muestra el chat: índice de la tabla o prefijo de UUID")
+    ap.add_argument("-r", "--resume", metavar="REF",
+                    help="imprime el comando para reanudar esa sesión")
+    ap.add_argument("-g", "--grep", metavar="TEXTO",
+                    help="filtra por contenido de las conversaciones")
+    ap.add_argument("-p", "--project", metavar="RUTA",
+                    help="filtra por ruta del proyecto")
+    ap.add_argument("-n", "--limit", type=int, metavar="N",
+                    help="muestra solo las N más recientes")
+    ap.add_argument("-E", "--hide-empty", action="store_true",
+                    help="oculta las sesiones sin mensajes")
+    ap.add_argument("--no-tools", action="store_true",
+                    help="en el chat, oculta las llamadas a herramientas")
+    ap.add_argument("--no-pager", action="store_true",
+                    help="no usa $PAGER para el chat")
+    ap.add_argument("--no-color", action="store_true", help="salida sin color")
+    ap.add_argument("--json", action="store_true",
+                    help="vuelca todas las sesiones en JSON")
+
+    borrar = ap.add_argument_group("borrado")
+    borrar.add_argument("-D", "--delete", metavar="REF", nargs="+",
+                        help="borra esas sesiones (índice o prefijo de UUID)")
+    borrar.add_argument("--delete-empty", action="store_true",
+                        help="borra todas las sesiones sin mensajes")
+    borrar.add_argument("-y", "--yes", action="store_true",
+                        help="no pregunta antes de borrar")
+    borrar.add_argument("--dry-run", action="store_true",
+                        help="muestra qué se borraría y no toca nada")
+    ap.add_argument("--no-cache", action="store_true",
+                    help="ignora el caché y re-parsea todo")
+    args = ap.parse_args()
+
+    if not os.path.isdir(PROJ_ROOT):
+        sys.exit(f"error: no existe {PROJ_ROOT} — ¿usaste Claude Code en esta máquina?")
+
+    sessions = load_sessions(use_cache=not args.no_cache)
+    if not sessions:
+        sys.exit("No hay ninguna sesión registrada todavía.")
+
+    if args.json:
+        for s in sessions:
+            s.pop("project_dir", None)
+            s.pop("mtime", None)
+        json.dump(sessions, sys.stdout, ensure_ascii=False, separators=(",", ":"))
+        return
+
+    color = sys.stdout.isatty() and not args.no_color and not os.environ.get("NO_COLOR")
+    st = Style(color)
+    now = max(parse_ts(s["l"]) for s in sessions)
+
+    if args.delete or args.delete_empty:
+        pool = apply_filters(sessions, args)
+        if args.delete_empty:
+            targets = [s for s in pool if s["e"]]
+            if args.delete:
+                seen = {s["id"] for s in targets}
+                targets += [s for s in (pick(pool, r) for r in args.delete)
+                            if s["id"] not in seen]
+        else:
+            # dedup preservando el orden en que se pidieron
+            targets, seen = [], set()
+            for ref in args.delete:
+                s = pick(pool, ref)
+                if s["id"] not in seen:
+                    seen.add(s["id"])
+                    targets.append(s)
+        sys.exit(delete_sessions(targets, args, st, now))
+
+    if args.resume:
+        s = pick(apply_filters(sessions, args), args.resume)
+        print(f"cd {s['p']} && claude --resume {s['id']}")
+        return
+
+    if args.show:
+        s = pick(apply_filters(sessions, args), args.show)
+        buf = []
+
+        class Buf:
+            def write(self, x):
+                buf.append(x)
+
+        print_chat(s, st, now, Buf(), show_tools=not args.no_tools)
+        text = "".join(buf)
+        if args.no_pager:
+            sys.stdout.write(text)
+        else:
+            pager(text)
+        return
+
+    shown = apply_filters(sessions, args)
+    if not shown:
+        sys.exit("Ninguna sesión coincide con ese filtro.")
+    if args.limit:
+        shown = shown[: args.limit]
+
+    print_table(shown, st, now, sys.stdout)
+
+    total, projects = len(sessions), len({s["p"] for s in sessions})
+    tail = (f"{len(shown)} de {total} sesiones" if len(shown) != total
+            else f"{plural(total, 'sesión', 'sesiones')} · "
+                 f"{plural(projects, 'proyecto', 'proyectos')}")
+    print(f"\n{st.faint}{tail} · -s <nº> para leer una{st.reset}")
+
+
+if __name__ == "__main__":
+    try:
+        main()
+    except (BrokenPipeError, KeyboardInterrupt):
+        try:
+            sys.stdout.close()
+        except Exception:
+            pass
+        sys.exit(130)
diff --git a/template.html b/template.html
new file mode 100644
index 0000000..8a7e4cb
--- /dev/null
+++ b/template.html
@@ -0,0 +1,951 @@
+<title>Sesiones de Claude Code</title>
+<style>
+  :root {
+    --ground:   #EDEEF2;
+    --surface:  #FFFFFF;
+    --raised:   #F6F7F9;
+    --ink:      #14161C;
+    --ink-soft: #3D4250;
+    --muted:    #6A6F7E;
+    --faint:    #9AA0AE;
+    --line:     #DCDEE5;
+    --line-soft:#E7E9EE;
+    --amber:    #A85A16;
+    --amber-lo: #C98A47;
+    --amber-bg: rgba(168, 90, 22, 0.09);
+    --scrim:    rgba(20, 22, 28, .38);
+    --shadow:   0 1px 2px rgba(20, 22, 28, .06), 0 8px 24px -12px rgba(20, 22, 28, .18);
+    --shadow-lg:0 24px 70px -20px rgba(20, 22, 28, .45);
+    --focus:    #2C6FD1;
+
+    --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+    --mono: ui-monospace, "JetBrains Mono", "SFMono-Regular", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
+  }
+
+  @media (prefers-color-scheme: dark) {
+    :root {
+      --ground:   #0E1015;
+      --surface:  #171A21;
+      --raised:   #1D212A;
+      --ink:      #DFE2EA;
+      --ink-soft: #B4BAC7;
+      --muted:    #878DA0;
+      --faint:    #666C7D;
+      --line:     #262A34;
+      --line-soft:#1F232C;
+      --amber:    #E29A4A;
+      --amber-lo: #8A6435;
+      --amber-bg: rgba(226, 154, 74, 0.11);
+      --scrim:    rgba(0, 0, 0, .62);
+      --shadow:   0 1px 2px rgba(0,0,0,.4), 0 8px 24px -12px rgba(0,0,0,.7);
+      --shadow-lg:0 24px 70px -20px rgba(0,0,0,.85);
+      --focus:    #6BA5F0;
+    }
+  }
+
+  :root[data-theme="light"] {
+    --ground:   #EDEEF2;
+    --surface:  #FFFFFF;
+    --raised:   #F6F7F9;
+    --ink:      #14161C;
+    --ink-soft: #3D4250;
+    --muted:    #6A6F7E;
+    --faint:    #9AA0AE;
+    --line:     #DCDEE5;
+    --line-soft:#E7E9EE;
+    --amber:    #A85A16;
+    --amber-lo: #C98A47;
+    --amber-bg: rgba(168, 90, 22, 0.09);
+    --scrim:    rgba(20, 22, 28, .38);
+    --shadow:   0 1px 2px rgba(20, 22, 28, .06), 0 8px 24px -12px rgba(20, 22, 28, .18);
+    --shadow-lg:0 24px 70px -20px rgba(20, 22, 28, .45);
+    --focus:    #2C6FD1;
+  }
+
+  :root[data-theme="dark"] {
+    --ground:   #0E1015;
+    --surface:  #171A21;
+    --raised:   #1D212A;
+    --ink:      #DFE2EA;
+    --ink-soft: #B4BAC7;
+    --muted:    #878DA0;
+    --faint:    #666C7D;
+    --line:     #262A34;
+    --line-soft:#1F232C;
+    --amber:    #E29A4A;
+    --amber-lo: #8A6435;
+    --amber-bg: rgba(226, 154, 74, 0.11);
+    --scrim:    rgba(0, 0, 0, .62);
+    --shadow:   0 1px 2px rgba(0,0,0,.4), 0 8px 24px -12px rgba(0,0,0,.7);
+    --shadow-lg:0 24px 70px -20px rgba(0,0,0,.85);
+    --focus:    #6BA5F0;
+  }
+
+  * { box-sizing: border-box; }
+
+  body {
+    margin: 0;
+    background: var(--ground);
+    color: var(--ink);
+    font-family: var(--sans);
+    font-size: 15px;
+    line-height: 1.5;
+    -webkit-font-smoothing: antialiased;
+  }
+  body.locked { overflow: hidden; }
+
+  .wrap { max-width: 1180px; margin: 0 auto; padding: 40px 24px 96px; }
+
+  /* ---------- masthead ---------- */
+
+  .masthead { display: flex; flex-direction: column; gap: 8px; margin-bottom: 28px; }
+
+  .eyebrow {
+    font-family: var(--mono);
+    font-size: 11px;
+    letter-spacing: .14em;
+    text-transform: uppercase;
+    color: var(--amber);
+  }
+
+  h1 {
+    margin: 0;
+    font-size: clamp(28px, 4.5vw, 40px);
+    line-height: 1.1;
+    letter-spacing: -.022em;
+    font-weight: 620;
+    text-wrap: balance;
+  }
+
+  .lede { margin: 0; max-width: 64ch; color: var(--muted); font-size: 15px; }
+  .lede code, .foot code {
+    font-family: var(--mono);
+    font-size: .88em;
+    background: var(--amber-bg);
+    color: var(--amber);
+    padding: 1px 5px;
+    border-radius: 4px;
+  }
+
+  /* ---------- stats ---------- */
+
+  .stats {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
+    gap: 1px;
+    background: var(--line);
+    border: 1px solid var(--line);
+    border-radius: 10px;
+    overflow: hidden;
+    margin-bottom: 24px;
+  }
+  .stat { background: var(--surface); padding: 14px 16px 16px; }
+  .stat-k {
+    display: block;
+    font-family: var(--mono);
+    font-size: 10px;
+    letter-spacing: .13em;
+    text-transform: uppercase;
+    color: var(--faint);
+    margin-bottom: 5px;
+  }
+  .stat-v {
+    font-family: var(--mono);
+    font-size: 22px;
+    font-variant-numeric: tabular-nums;
+    letter-spacing: -.02em;
+    color: var(--ink);
+  }
+  .stat-v small { font-size: 12px; color: var(--muted); letter-spacing: 0; }
+
+  /* ---------- toolbar ---------- */
+
+  .toolbar {
+    position: sticky;
+    top: 0;
+    z-index: 20;
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    align-items: center;
+    padding: 12px 0;
+    background: linear-gradient(var(--ground) 76%, transparent);
+  }
+
+  .field { position: relative; flex: 1 1 240px; min-width: 180px; }
+  .field svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--faint); pointer-events: none; }
+
+  input[type="search"], select {
+    width: 100%;
+    font: inherit;
+    font-size: 14px;
+    color: var(--ink);
+    background: var(--surface);
+    border: 1px solid var(--line);
+    border-radius: 8px;
+    padding: 9px 12px;
+    appearance: none;
+  }
+  input[type="search"] { padding-left: 34px; font-family: var(--mono); font-size: 13px; }
+  input[type="search"]::-webkit-search-cancel-button { filter: grayscale(1) opacity(.5); }
+
+  select {
+    flex: 0 1 auto;
+    width: auto;
+    max-width: 300px;
+    padding-right: 30px;
+    font-family: var(--mono);
+    font-size: 12.5px;
+    background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
+    background-position: calc(100% - 16px) calc(50% + 1px), calc(100% - 11px) calc(50% + 1px);
+    background-size: 5px 5px, 5px 5px;
+    background-repeat: no-repeat;
+  }
+
+  .toggle {
+    display: inline-flex;
+    align-items: center;
+    gap: 7px;
+    font-family: var(--mono);
+    font-size: 12px;
+    color: var(--muted);
+    background: var(--surface);
+    border: 1px solid var(--line);
+    border-radius: 8px;
+    padding: 9px 12px;
+    cursor: pointer;
+    user-select: none;
+    white-space: nowrap;
+  }
+  .toggle input { accent-color: var(--amber); margin: 0; }
+  .toggle:hover { color: var(--ink); }
+  .toggle:has(input:checked) { color: var(--amber); border-color: var(--amber-lo); background: var(--amber-bg); }
+
+  :is(input, select, button, .toggle, .row[tabindex]):focus-visible {
+    outline: 2px solid var(--focus);
+    outline-offset: 1px;
+  }
+
+  /* ---------- tabla ---------- */
+
+  .grid { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--surface); box-shadow: var(--shadow); }
+
+  .row {
+    display: grid;
+    grid-template-columns: 3px 1fr 108px 58px 66px 128px;
+    align-items: center;
+    gap: 0 14px;
+    border-bottom: 1px solid var(--line-soft);
+  }
+  .row:last-child { border-bottom: 0; }
+  .row.clickable { cursor: pointer; }
+  .row.clickable:hover { background: var(--raised); }
+
+  .head {
+    position: sticky;
+    top: 62px;
+    z-index: 10;
+    background: var(--raised);
+    border-bottom: 1px solid var(--line);
+  }
+  .head span, .head button {
+    font-family: var(--mono);
+    font-size: 10px;
+    letter-spacing: .12em;
+    text-transform: uppercase;
+    color: var(--faint);
+    padding: 9px 0;
+    background: none;
+    border: 0;
+    text-align: left;
+    cursor: default;
+  }
+  .head button { cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
+  .head button:hover { color: var(--ink); }
+  .head button[aria-sort] { color: var(--amber); }
+  .head button .car { opacity: 0; }
+  .head button[aria-sort] .car { opacity: 1; }
+  .head .num { justify-content: flex-end; text-align: right; }
+  .head .pad-l { padding-left: 14px; }
+  .head .pad-r { padding-right: 16px; }
+
+  .r-body { padding: 11px 0 12px; min-width: 0; }
+
+  .stripe { align-self: stretch; background: var(--stripe, transparent); }
+
+  .title {
+    margin: 0 0 3px;
+    font-size: 14px;
+    line-height: 1.42;
+    color: var(--ink);
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+  mark { background: var(--amber-bg); color: var(--amber); border-radius: 3px; padding: 0 1px; }
+
+  .meta {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 4px 8px;
+    font-family: var(--mono);
+    font-size: 11.5px;
+    color: var(--muted);
+    min-width: 0;
+  }
+  .path { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
+
+  .chip {
+    font-size: 10px;
+    letter-spacing: .06em;
+    text-transform: uppercase;
+    padding: 1px 5px;
+    border-radius: 3px;
+    border: 1px solid var(--line);
+    color: var(--faint);
+    white-space: nowrap;
+  }
+  .chip-branch { color: var(--muted); }
+  .chip-empty, .chip-auto { color: var(--amber); border-color: var(--amber-lo); background: var(--amber-bg); }
+
+  .snippet {
+    margin: 5px 0 0;
+    font-family: var(--mono);
+    font-size: 11.5px;
+    line-height: 1.5;
+    color: var(--muted);
+    border-left: 2px solid var(--amber-lo);
+    padding-left: 9px;
+  }
+
+  .cell-n {
+    font-family: var(--mono);
+    font-size: 12px;
+    font-variant-numeric: tabular-nums;
+    color: var(--ink-soft);
+    text-align: right;
+    padding: 11px 0 12px;
+  }
+  .cell-date { font-family: var(--mono); font-size: 12px; font-variant-numeric: tabular-nums; color: var(--ink-soft); padding: 11px 0 12px; }
+  .cell-date small { display: block; color: var(--faint); font-size: 10.5px; letter-spacing: .04em; }
+  .dim { color: var(--faint); }
+
+  .cell-act { padding: 9px 16px 9px 0; display: flex; justify-content: flex-end; }
+
+  .copy {
+    font-family: var(--mono);
+    font-size: 11px;
+    color: var(--muted);
+    background: var(--raised);
+    border: 1px solid var(--line);
+    border-radius: 6px;
+    padding: 6px 9px;
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    white-space: nowrap;
+    transition: color .12s, border-color .12s, background .12s;
+  }
+  .copy:hover, .copy.done { color: var(--amber); border-color: var(--amber-lo); background: var(--amber-bg); }
+
+  .empty-row .title { color: var(--muted); font-style: italic; }
+
+  .none { padding: 48px 20px; text-align: center; color: var(--muted); font-family: var(--mono); font-size: 13px; }
+  .count { font-family: var(--mono); font-size: 11.5px; color: var(--faint); padding: 10px 2px 0; letter-spacing: .04em; }
+
+  /* ---------- lector ---------- */
+
+  .scrim {
+    position: fixed;
+    inset: 0;
+    background: var(--scrim);
+    opacity: 0;
+    pointer-events: none;
+    transition: opacity .2s;
+    z-index: 40;
+  }
+  .scrim.open { opacity: 1; pointer-events: auto; }
+
+  .reader {
+    position: fixed;
+    top: 0;
+    right: 0;
+    height: 100%;
+    width: min(920px, 100%);
+    display: flex;
+    flex-direction: column;
+    background: var(--ground);
+    border-left: 1px solid var(--line);
+    box-shadow: var(--shadow-lg);
+    transform: translateX(100%);
+    transition: transform .24s cubic-bezier(.4, 0, .2, 1);
+    z-index: 41;
+    visibility: hidden;
+  }
+  .reader.open { transform: none; visibility: visible; }
+
+  .reader-head {
+    display: flex;
+    align-items: flex-start;
+    gap: 14px;
+    padding: 18px 20px 15px;
+    border-bottom: 1px solid var(--line);
+    background: var(--surface);
+  }
+  .reader-head h2 {
+    margin: 0 0 6px;
+    font-size: 17px;
+    line-height: 1.3;
+    letter-spacing: -.012em;
+    font-weight: 600;
+    text-wrap: balance;
+  }
+  .rh-text { flex: 1; min-width: 0; }
+  .rh-acts { display: flex; gap: 7px; flex-shrink: 0; }
+
+  .xbtn {
+    background: var(--raised);
+    border: 1px solid var(--line);
+    border-radius: 6px;
+    color: var(--muted);
+    cursor: pointer;
+    padding: 7px 9px;
+    display: inline-flex;
+    align-items: center;
+    transition: color .12s, border-color .12s, background .12s;
+  }
+  .xbtn:hover { color: var(--ink); }
+  .xbtn.done { color: var(--amber); border-color: var(--amber-lo); background: var(--amber-bg); }
+
+  .transcript {
+    flex: 1;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+    padding: 20px 20px 64px;
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .turn { display: flex; flex-direction: column; gap: 5px; }
+  .who {
+    font-family: var(--mono);
+    font-size: 10px;
+    letter-spacing: .13em;
+    text-transform: uppercase;
+    color: var(--faint);
+  }
+  .turn-u .who { color: var(--amber); }
+
+  .bubble {
+    border-radius: 8px;
+    padding: 11px 14px;
+    font-size: 14.5px;
+    line-height: 1.62;
+    white-space: pre-wrap;
+    overflow-wrap: anywhere;
+    border: 1px solid var(--line-soft);
+    background: var(--surface);
+    color: var(--ink-soft);
+  }
+  .turn-u .bubble { background: var(--amber-bg); border-color: var(--amber-lo); color: var(--ink); }
+
+  .bubble pre {
+    margin: 9px 0;
+    padding: 10px 12px;
+    background: var(--ground);
+    border: 1px solid var(--line);
+    border-radius: 6px;
+    overflow-x: auto;
+    font-family: var(--mono);
+    font-size: 12.5px;
+    line-height: 1.55;
+    white-space: pre;
+    color: var(--ink);
+  }
+  .bubble code {
+    font-family: var(--mono);
+    font-size: .87em;
+    background: var(--raised);
+    border: 1px solid var(--line-soft);
+    border-radius: 4px;
+    padding: 1px 4px;
+  }
+  .bubble strong { color: var(--ink); font-weight: 600; }
+  .bubble .h {
+    display: block;
+    margin: 4px 0 -2px;
+    font-size: .95em;
+    font-weight: 620;
+    letter-spacing: -.008em;
+    color: var(--ink);
+  }
+  .bubble pre code { background: none; border: 0; padding: 0; font-size: inherit; }
+
+  .tool {
+    font-family: var(--mono);
+    font-size: 11.5px;
+    color: var(--muted);
+    display: flex;
+    align-items: baseline;
+    gap: 8px;
+    padding: 3px 0 3px 12px;
+    border-left: 2px solid var(--line);
+    overflow-wrap: anywhere;
+  }
+  .tool b { color: var(--amber); font-weight: 500; flex-shrink: 0; }
+
+  .reader-empty { color: var(--muted); font-family: var(--mono); font-size: 13px; text-align: center; padding: 60px 20px; }
+
+  /* ---------- toast ---------- */
+
+  .toast {
+    position: fixed;
+    left: 50%;
+    bottom: 26px;
+    transform: translate(-50%, 14px);
+    background: var(--ink);
+    color: var(--ground);
+    font-family: var(--mono);
+    font-size: 12px;
+    padding: 9px 14px;
+    border-radius: 7px;
+    box-shadow: var(--shadow);
+    opacity: 0;
+    pointer-events: none;
+    transition: opacity .16s, transform .16s;
+    z-index: 60;
+    max-width: min(90vw, 560px);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .toast.show { opacity: 1; transform: translate(-50%, 0); }
+
+  .legend {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px 16px;
+    align-items: center;
+    margin-top: 18px;
+    font-family: var(--mono);
+    font-size: 11px;
+    color: var(--faint);
+  }
+  .legend i { display: inline-block; width: 16px; height: 3px; border-radius: 2px; margin-right: 6px; vertical-align: middle; }
+
+  .foot {
+    margin-top: 26px;
+    padding-top: 18px;
+    border-top: 1px solid var(--line);
+    color: var(--muted);
+    font-size: 13px;
+    max-width: 68ch;
+  }
+  .foot p { margin: 0 0 8px; }
+
+  @media (max-width: 860px) {
+    .wrap { padding: 28px 14px 72px; }
+    .row { grid-template-columns: 3px 1fr auto; gap: 0 12px; }
+    .head { display: none; }
+    .r-body { padding: 12px 0 4px; grid-column: 2 / -1; }
+    .cell-date { grid-column: 2; padding: 0 0 10px; }
+    .cell-n { display: none; }
+    .cell-act { grid-column: 3; grid-row: 2; padding: 0 12px 10px 0; }
+    select { max-width: 100%; flex: 1 1 100%; }
+    .reader { width: 100%; border-left: 0; }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    * { transition: none !important; }
+  }
+</style>
+
+<div class="wrap">
+  <header class="masthead">
+    <span class="eyebrow">~/.claude/projects</span>
+    <h1>Tus sesiones de Claude Code</h1>
+    <p class="lede">Cada conversación queda en un <code>.jsonl</code> local. Hacé clic en cualquier fila para leerla, o copiá el comando para retomarla — el <code>--resume</code> solo encuentra la sesión desde su directorio original, así que el botón copia el <code>cd</code> también.</p>
+  </header>
+
+  <div class="stats" id="stats"></div>
+
+  <div class="toolbar">
+    <div class="field">
+      <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6"><circle cx="7" cy="7" r="4.5"/><path d="M10.5 10.5 14 14"/></svg>
+      <input type="search" id="q" placeholder="buscar título, ruta o uuid…" autocomplete="off" spellcheck="false" aria-label="Buscar sesiones">
+    </div>
+    <select id="proj" aria-label="Filtrar por proyecto"></select>
+    <label class="toggle"><input type="checkbox" id="deep"> buscar dentro del chat</label>
+    <label class="toggle"><input type="checkbox" id="hideEmpty"> ocultar vacías</label>
+  </div>
+
+  <div class="grid" role="table" aria-label="Sesiones de Claude Code">
+    <div class="row head" role="row">
+      <span></span>
+      <button type="button" data-sort="t" class="pad-l">Sesión <span class="car">▾</span></button>
+      <button type="button" data-sort="l">Fecha <span class="car">▾</span></button>
+      <button type="button" data-sort="u" class="num">Msgs <span class="car">▾</span></button>
+      <button type="button" data-sort="d" class="num">Dur. <span class="car">▾</span></button>
+      <span class="pad-r" style="text-align:right">Reanudar</span>
+    </div>
+    <div id="rows"></div>
+  </div>
+
+  <p class="count" id="count"></p>
+
+  <div class="legend">
+    <span>Franja izquierda = antigüedad:</span>
+    <span><i style="background:var(--amber)"></i>hoy / ayer</span>
+    <span><i style="background:var(--amber);opacity:.55"></i>última semana</span>
+    <span><i style="background:var(--amber);opacity:.26"></i>dos semanas</span>
+    <span><i style="background:var(--line)"></i>más viejo</span>
+  </div>
+
+  <div class="foot">
+    <p>Los títulos los genera Claude durante la sesión. Cuando falta, cae al primer mensaje tuyo — y ahí se nota, porque arranca en minúscula o suena a pregunta suelta.</p>
+    <p><b>Vacía</b> es una sesión que se abrió pero nunca recibió un mensaje: un <code>/resume</code> cancelado, un <code>/login</code>. <b>No interactiva</b> es un <code>claude -p</code> con algo piped por stdin — típicamente un <code>git diff</code> para redactar el mensaje de commit, no un chat.</p>
+    <p>La transcripción trae el texto de la conversación y una línea por herramienta usada, pero no lo que esas herramientas devolvieron: son el 95 % del volumen en disco.</p>
+    <p id="snap"></p>
+  </div>
+</div>
+
+<div class="scrim" id="scrim"></div>
+
+<aside class="reader" id="reader" role="dialog" aria-modal="true" aria-labelledby="rTitle" tabindex="-1">
+  <div class="reader-head">
+    <div class="rh-text">
+      <h2 id="rTitle"></h2>
+      <div class="meta" id="rMeta"></div>
+    </div>
+    <div class="rh-acts">
+      <button type="button" class="xbtn" id="rCopy" title="Copiar comando para reanudar" aria-label="Copiar comando para reanudar">
+        <svg width="13" height="13" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5"><rect x="5.5" y="5.5" width="8" height="9" rx="1.5"/><path d="M10.5 3.5H3a.5.5 0 0 0-.5.5v8"/></svg>
+      </button>
+      <button type="button" class="xbtn" id="rClose" title="Cerrar (Esc)" aria-label="Cerrar">
+        <svg width="13" height="13" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.6"><path d="m4 4 8 8M12 4l-8 8"/></svg>
+      </button>
+    </div>
+  </div>
+  <div class="transcript" id="rBody"></div>
+</aside>
+
+<div class="toast" id="toast" role="status" aria-live="polite"></div>
+
+<script id="payload" type="application/json">__DATA__</script>
+<script>
+const DATA = JSON.parse(document.getElementById('payload').textContent);
+// Instantánea = la actividad más reciente de los datos, para que "hoy" siga siendo
+// cierto respecto de cuándo se leyeron los logs y no del reloj de quien mira.
+const NOW = new Date(Math.max(...DATA.map(d => +new Date(d.l))));
+const BY_ID = new Map(DATA.map(d => [d.id, d]));
+
+const $ = s => document.querySelector(s);
+const rowsEl = $('#rows'), qEl = $('#q'), projEl = $('#proj'), deepEl = $('#deep'),
+      emptyEl = $('#hideEmpty'), countEl = $('#count'), toastEl = $('#toast'),
+      readerEl = $('#reader'), scrimEl = $('#scrim'), bodyEl = $('#rBody');
+
+let sortKey = 'l', sortDir = -1, openId = null, lastFocus = null;
+
+/* ---------- formato ---------- */
+
+const DAY = 864e5;
+const MES = ['ene','feb','mar','abr','may','jun','jul','ago','sep','oct','nov','dic'];
+const pad = n => String(n).padStart(2, '0');
+
+const daysAgo = iso => (NOW - new Date(iso)) / DAY;
+const fmtDate = iso => { const d = new Date(iso); return `${pad(d.getDate())} ${MES[d.getMonth()]}`; };
+const fmtTime = iso => { const d = new Date(iso); return `${pad(d.getHours())}:${pad(d.getMinutes())}`; };
+
+function fmtRel(iso) {
+  const n = daysAgo(iso);
+  if (n < 1) return 'hoy';
+  if (n < 2) return 'ayer';
+  if (n < 7) return `hace ${Math.floor(n)} d`;
+  if (n < 30) return `hace ${Math.floor(n / 7)} sem`;
+  return `hace ${Math.floor(n / 30)} mes`;
+}
+function fmtDur(m) {
+  if (m == null) return '—';
+  if (m < 1) return '<1m';
+  if (m < 60) return m + 'm';
+  const h = Math.floor(m / 60), r = m % 60;
+  return r ? `${h}h${pad(r)}` : `${h}h`;
+}
+function stripeFor(iso) {
+  const n = daysAgo(iso);
+  if (n < 2)  return 'var(--amber)';
+  if (n < 7)  return 'color-mix(in srgb, var(--amber) 55%, transparent)';
+  if (n < 14) return 'color-mix(in srgb, var(--amber) 26%, transparent)';
+  return 'var(--line)';
+}
+
+const esc = s => String(s).replace(/[&<>"]/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;'}[c]));
+
+function mark(text, q) {
+  const s = esc(text);
+  if (!q) return s;
+  const i = s.toLowerCase().indexOf(q.toLowerCase());
+  if (i < 0) return s;
+  return s.slice(0, i) + '<mark>' + s.slice(i, i + q.length) + '</mark>' + s.slice(i + q.length);
+}
+
+// Markdown mínimo: código, negritas y títulos. Los saltos los resuelve pre-wrap.
+// El código se guarda aparte antes de tocar negritas, para que un ** dentro de
+// un bloque de código quede tal cual.
+function renderBody(text) {
+  const stash = [];
+  // Tras esc() no queda ningún "<" crudo en el texto: todos son &lt;. Por eso un
+  // marcador con "<" no puede colisionar con el contenido del mensaje.
+  const keep = html => `<K${stash.push(html) - 1}>`;
+
+  let out = esc(text);
+  out = out.replace(/```[a-zA-Z0-9_+-]*\n?([\s\S]*?)```/g,
+    (_, code) => keep(`<pre>${code.replace(/\n+$/, '')}</pre>`));
+  out = out.replace(/`([^`\n]+)`/g, (_, code) => keep(`<code>${code}</code>`));
+  out = out.replace(/^#{1,6}\s+(.+)$/gm, '<b class="h">$1</b>');
+  out = out.replace(/\*\*([^*\n]+)\*\*/g, '<strong>$1</strong>');
+
+  return out.replace(/<K(\d+)>/g, (_, i) => stash[i]);
+}
+
+/* ---------- cabecera ---------- */
+
+(function stats() {
+  const msgs = DATA.reduce((a, d) => a + d.u, 0);
+  const mb = DATA.reduce((a, d) => a + d.k, 0) / 1024;
+  const ds = DATA.map(d => new Date(d.l)).sort((a, b) => a - b);
+  const f = ds[0], l = ds[ds.length - 1];
+  $('#stats').innerHTML = [
+    ['sesiones', DATA.length, ''],
+    ['proyectos', new Set(DATA.map(d => d.p)).size, ''],
+    ['tus mensajes', msgs, ''],
+    ['en disco', mb.toFixed(1), ' MB'],
+    ['período', `${pad(f.getDate())} ${MES[f.getMonth()]} – ${pad(l.getDate())} ${MES[l.getMonth()]}`, ''],
+  ].map(([k, v, s]) => `<div class="stat"><span class="stat-k">${k}</span><span class="stat-v">${v}${s ? `<small>${s}</small>` : ''}</span></div>`).join('');
+})();
+
+(function projects() {
+  const counts = {};
+  DATA.forEach(d => counts[d.p] = (counts[d.p] || 0) + 1);
+  projEl.innerHTML = `<option value="">todos los proyectos (${DATA.length})</option>` +
+    Object.entries(counts).sort((a, b) => b[1] - a[1] || a[0].localeCompare(b[0]))
+      .map(([p, n]) => `<option value="${esc(p)}">${esc(p)} · ${n}</option>`).join('');
+})();
+
+/* ---------- lista ---------- */
+
+function convoText(d) {
+  if (d._flat === undefined) d._flat = d.c.map(m => m.x).join('\n').toLowerCase();
+  return d._flat;
+}
+
+function snippetFor(d, q) {
+  for (const m of d.c) {
+    const i = m.x.toLowerCase().indexOf(q);
+    if (i < 0) continue;
+    const from = Math.max(0, i - 55);
+    const raw = m.x.slice(from, i + q.length + 75).replace(/\s+/g, ' ');
+    return (from ? '…' : '') + raw + '…';
+  }
+  return null;
+}
+
+function current() {
+  const q = qEl.value.trim().toLowerCase();
+  const proj = projEl.value;
+  const deep = deepEl.checked;
+
+  const list = DATA.filter(d => {
+    if (proj && d.p !== proj) return false;
+    if (emptyEl.checked && d.e) return false;
+    if (!q) return true;
+    if ((d.t || '').toLowerCase().includes(q) || d.p.toLowerCase().includes(q)
+        || d.id.toLowerCase().includes(q) || (d.b || '').toLowerCase().includes(q)) return true;
+    return deep && convoText(d).includes(q);
+  });
+
+  const k = sortKey;
+  list.sort((a, b) => {
+    if (k === 't') {
+      const av = (a.t || '~').toLowerCase(), bv = (b.t || '~').toLowerCase();
+      return av < bv ? -sortDir : av > bv ? sortDir : 0;
+    }
+    const av = k === 'l' ? new Date(a.l) : (a[k] ?? -1);
+    const bv = k === 'l' ? new Date(b.l) : (b[k] ?? -1);
+    return (av - bv) * sortDir;
+  });
+  return list;
+}
+
+function render() {
+  const list = current();
+  const q = qEl.value.trim();
+  const ql = q.toLowerCase();
+
+  if (!list.length) {
+    rowsEl.innerHTML = `<div class="none">Ninguna sesión coincide con ese filtro.</div>`;
+    countEl.textContent = '';
+    return;
+  }
+
+  rowsEl.innerHTML = list.map(d => {
+    const inMeta = q && ((d.t || '').toLowerCase().includes(ql) || d.p.toLowerCase().includes(ql));
+    const snip = q && deepEl.checked && !inMeta ? snippetFor(d, ql) : null;
+    const chips = [
+      d.e ? '<span class="chip chip-empty">vacía</span>' : '',
+      d.n ? '<span class="chip chip-auto">no interactiva</span>' : '',
+      d.b && d.b !== 'HEAD' ? `<span class="chip chip-branch">${esc(d.b)}</span>` : '',
+      d.i ? '<span class="chip" title="Ruta deducida de otras sesiones del mismo proyecto">ruta inferida</span>' : '',
+    ].join('');
+
+    return `
+    <div class="row${d.e ? ' empty-row' : ' clickable'}" role="row" data-id="${d.id}"${d.e ? '' : ' tabindex="0"'}>
+      <div class="stripe" style="--stripe:${stripeFor(d.l)}"></div>
+      <div class="r-body">
+        <p class="title">${d.t ? mark(d.t, q) : 'sesión abierta sin mensajes'}</p>
+        <div class="meta"><span class="path" title="${esc(d.p)}">${mark(d.p, q)}</span>${chips}</div>
+        ${snip ? `<p class="snippet">${mark(snip, q)}</p>` : ''}
+      </div>
+      <div class="cell-date">${fmtDate(d.l)}<small>${fmtRel(d.l)} · ${fmtTime(d.l)}</small></div>
+      <div class="cell-n${d.u ? '' : ' dim'}">${d.u || '—'}</div>
+      <div class="cell-n${d.d ? '' : ' dim'}">${fmtDur(d.d)}</div>
+      <div class="cell-act">
+        <button type="button" class="copy" data-copy="${d.id}" title="cd ${esc(d.p)} &amp;&amp; claude --resume ${d.id}">
+          <svg width="11" height="11" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5"><rect x="5.5" y="5.5" width="8" height="9" rx="1.5"/><path d="M10.5 3.5H3a.5.5 0 0 0-.5.5v8"/></svg>
+          <span>${d.id.slice(0, 8)}</span>
+        </button>
+      </div>
+    </div>`;
+  }).join('');
+
+  countEl.textContent = list.length === DATA.length
+    ? `${DATA.length} sesiones · clic en una fila para leerla`
+    : `${list.length} de ${DATA.length} sesiones`;
+}
+
+/* ---------- lector ---------- */
+
+const WHO = { u: 'vos', a: 'claude' };
+
+function openReader(id) {
+  const d = BY_ID.get(id);
+  if (!d || d.e) return;
+  openId = id;
+  lastFocus = document.activeElement;
+
+  $('#rTitle').textContent = d.t || 'Sesión sin título';
+  $('#rMeta').innerHTML = [
+    `<span class="path">${esc(d.p)}</span>`,
+    `<span>${fmtDate(d.l)} · ${fmtTime(d.l)}</span>`,
+    `<span>${d.u} tuyos / ${d.a} de Claude</span>`,
+    `<span>${fmtDur(d.d)}</span>`,
+    `<span class="chip">${d.id.slice(0, 8)}</span>`,
+  ].join('');
+
+  bodyEl.innerHTML = d.c.length
+    ? d.c.map(m => m.r === 't'
+        ? `<div class="tool"><b>⚒</b><span>${esc(m.x)}</span></div>`
+        : `<div class="turn turn-${m.r}"><span class="who">${WHO[m.r]}</span><div class="bubble">${renderBody(m.x)}</div></div>`
+      ).join('')
+    : `<p class="reader-empty">Esta sesión no tiene mensajes.</p>`;
+
+  bodyEl.scrollTop = 0;
+  scrimEl.classList.add('open');
+  readerEl.classList.add('open');
+  document.body.classList.add('locked');
+  readerEl.focus();
+}
+
+function closeReader() {
+  if (!openId) return;
+  openId = null;
+  scrimEl.classList.remove('open');
+  readerEl.classList.remove('open');
+  document.body.classList.remove('locked');
+  if (lastFocus && document.contains(lastFocus)) lastFocus.focus();
+}
+
+/* ---------- copiar ---------- */
+
+const cmdFor = d => `cd ${d.p} && claude --resume ${d.id}`;
+
+function copyText(text) {
+  if (navigator.clipboard && window.isSecureContext) return navigator.clipboard.writeText(text);
+  return new Promise((res, rej) => {
+    const ta = document.createElement('textarea');
+    ta.value = text;
+    ta.style.cssText = 'position:fixed;opacity:0;top:0;left:0';
+    document.body.appendChild(ta);
+    ta.select();
+    try { document.execCommand('copy') ? res() : rej(); }
+    catch (e) { rej(e); }
+    finally { ta.remove(); }
+  });
+}
+
+let toastTimer;
+function toast(msg) {
+  toastEl.textContent = msg;
+  toastEl.classList.add('show');
+  clearTimeout(toastTimer);
+  toastTimer = setTimeout(() => toastEl.classList.remove('show'), 2600);
+}
+
+function copyFor(d, btn) {
+  if (!d) return;
+  copyText(cmdFor(d)).then(() => {
+    if (btn) { btn.classList.add('done'); setTimeout(() => btn.classList.remove('done'), 1400); }
+    toast('Copiado: ' + cmdFor(d));
+  }).catch(() => toast('No se pudo copiar — el comando está en el tooltip'));
+}
+
+/* ---------- eventos ---------- */
+
+rowsEl.addEventListener('click', e => {
+  const copyBtn = e.target.closest('[data-copy]');
+  if (copyBtn) {
+    e.stopPropagation();
+    copyFor(BY_ID.get(copyBtn.dataset.copy), copyBtn);
+    return;
+  }
+  const row = e.target.closest('.row.clickable');
+  if (row) openReader(row.dataset.id);
+});
+
+rowsEl.addEventListener('keydown', e => {
+  if (e.key !== 'Enter' && e.key !== ' ') return;
+  const row = e.target.closest('.row.clickable');
+  if (!row || e.target.closest('[data-copy]')) return;
+  e.preventDefault();
+  openReader(row.dataset.id);
+});
+
+$('#rClose').addEventListener('click', closeReader);
+scrimEl.addEventListener('click', closeReader);
+$('#rCopy').addEventListener('click', e => copyFor(BY_ID.get(openId), e.currentTarget));
+
+document.addEventListener('keydown', e => { if (e.key === 'Escape') closeReader(); });
+
+document.querySelectorAll('[data-sort]').forEach(btn => {
+  btn.addEventListener('click', () => {
+    const k = btn.dataset.sort;
+    if (sortKey === k) sortDir = -sortDir;
+    else { sortKey = k; sortDir = k === 't' ? 1 : -1; }
+    document.querySelectorAll('[data-sort]').forEach(b => b.removeAttribute('aria-sort'));
+    btn.setAttribute('aria-sort', sortDir === 1 ? 'ascending' : 'descending');
+    btn.querySelector('.car').textContent = sortDir === 1 ? '▴' : '▾';
+    render();
+  });
+});
+document.querySelector('[data-sort="l"]').setAttribute('aria-sort', 'descending');
+
+$('#snap').textContent = `Instantánea leída el ${pad(NOW.getDate())} ${MES[NOW.getMonth()]} ${NOW.getFullYear()} a las ${fmtTime(NOW.toISOString())}. Las fechas relativas son respecto de ese momento; volvé a correr build.sh para actualizarla.`;
+
+[qEl, projEl, deepEl, emptyEl].forEach(el => el.addEventListener(el === qEl ? 'input' : 'change', render));
+
+render();
+</script>
-- 
cgit v1.2.3