From 44a72ca4ba1a61864383bfa65c2782e0ef3c3466 Mon Sep 17 00:00:00 2001
From: Alexandre Vazquez <alexandre.vazquez@gmail.com>
Date: Tue, 22 Jul 2025 19:02:44 +0200
Subject: [PATCH 1/5] backend: pass parameter XML via files

---
 backend/src/main.go | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/backend/src/main.go b/backend/src/main.go
index f1b19ecf..0a76bf73 100644
--- a/backend/src/main.go
+++ b/backend/src/main.go
@@ -189,9 +189,19 @@ func main() {
 			"-xsl:"+xsltPath,
 			"-o:"+outputPath,
 		)
+
+		idx := 0
 		for k, v := range req.Parameters {
-			cmdArgs = append(cmdArgs, fmt.Sprintf("%s=%s", k, v))
+			paramFile := filepath.Join(tmpDir, fmt.Sprintf("param_%d", idx))
+			if err := os.WriteFile(paramFile, []byte(v), 0644); err != nil {
+				log.Printf("write parameter %s failed: %v", k, err)
+				c.JSON(http.StatusInternalServerError, gin.H{"error": "cannot write parameter"})
+				return
+			}
+			cmdArgs = append(cmdArgs, fmt.Sprintf("%s=@%s", k, paramFile))
+			idx++
 		}
+
 		if err := os.WriteFile(argsPath, []byte(strings.Join(cmdArgs, "\n")), 0644); err != nil {
 			log.Printf("write args file failed: %v", err)
 			c.JSON(http.StatusInternalServerError, gin.H{"error": "cannot write args"})

From d76c80011c749ac93f76274653a80a82c0aac9de Mon Sep 17 00:00:00 2001
From: Alexandre Vazquez <alexandre.vazquez@gmail.com>
Date: Sun, 27 Jul 2025 16:54:01 +0200
Subject: [PATCH 2/5] Expand Saxon extension functions

---
 README.md                                     |   7 +
 backend/Dockerfile                            |  13 +-
 .../xsltplayground/ext/CustomFunctions.java   | 385 ++++++++++++++++++
 3 files changed, 404 insertions(+), 1 deletion(-)
 create mode 100644 backend/ext/com/xsltplayground/ext/CustomFunctions.java

diff --git a/README.md b/README.md
index 2f7f1a0b..f0cb053b 100644
--- a/README.md
+++ b/README.md
@@ -67,6 +67,13 @@ By default it listens on port `8000` as configured in `backend/app.config`.
 The same file sets `saxon_classpath` so the Java process can load Saxon and
 its dependencies from `/opt/saxon/*`.
 
+The backend image also builds a small jar with custom Saxon extension
+functions. It gets copied to `/opt/saxon/custom-functions.jar` during the
+Docker build. You can call these from XSLT using the namespace
+`xmlns:tib="java:com.xsltplayground.ext.CustomFunctions"`. The jar exposes
+many helper functions such as `tib:uuid()`, `tib:timestamp()` and
+`tib:addToDate()`.
+
 ### Environment
 
 When `VITE_GO_PRO=true` the backend stores transformation history and
diff --git a/backend/Dockerfile b/backend/Dockerfile
index 45398568..8c133962 100644
--- a/backend/Dockerfile
+++ b/backend/Dockerfile
@@ -2,7 +2,7 @@
 FROM golang:1.23-alpine AS builder
 
 # Instalar dependencias necesarias
-RUN apk add --no-cache git
+RUN apk add --no-cache git openjdk17
 
 # Establecer directorio de trabajo
 WORKDIR /app/src
@@ -18,6 +18,14 @@ RUN go mod init xslt-playground && \
     go mod tidy && \
     go build -o server .
 
+# Build extension functions jar
+WORKDIR /app/ext
+COPY ext/ .
+RUN javac com/xsltplayground/ext/CustomFunctions.java && \
+    jar cf custom-functions.jar com/xsltplayground/ext/CustomFunctions.class
+
+WORKDIR /app/src
+
 # Etapa final (runtime)
 FROM alpine:latest
 
@@ -36,6 +44,9 @@ RUN mkdir -p /opt/saxon && \
     curl -L -o /opt/saxon/saxon-he.jar https://repo1.maven.org/maven2/net/sf/saxon/Saxon-HE/11.6/Saxon-HE-11.6.jar && \
     curl -L -o /opt/saxon/xmlresolver.jar https://repo1.maven.org/maven2/org/xmlresolver/xmlresolver/4.5.0/xmlresolver-4.5.0.jar
 
+# Extension functions jar
+COPY --from=builder /app/ext/custom-functions.jar /opt/saxon/
+
 
 # Exponer el puerto por defecto y ejecutar el binario
 EXPOSE 8000
diff --git a/backend/ext/com/xsltplayground/ext/CustomFunctions.java b/backend/ext/com/xsltplayground/ext/CustomFunctions.java
new file mode 100644
index 00000000..af716f8c
--- /dev/null
+++ b/backend/ext/com/xsltplayground/ext/CustomFunctions.java
@@ -0,0 +1,385 @@
+package com.xsltplayground.ext;
+
+import java.math.BigDecimal;
+import java.math.RoundingMode;
+import java.nio.charset.Charset;
+import java.time.*;
+import java.time.format.DateTimeFormatter;
+import java.util.Base64;
+import java.util.Random;
+import java.util.UUID;
+import javax.xml.transform.OutputKeys;
+import javax.xml.transform.Transformer;
+import javax.xml.transform.TransformerFactory;
+import javax.xml.transform.dom.DOMSource;
+import javax.xml.transform.stream.StreamResult;
+import org.w3c.dom.Node;
+
+public class CustomFunctions {
+    public static String uuid() {
+        return UUID.randomUUID().toString();
+    }
+
+    public static long timestamp() {
+        return System.currentTimeMillis();
+    }
+
+    public static String addToDate(String date, int years, int months, int days) {
+        LocalDate d = LocalDate.parse(date);
+        d = d.plusYears(years).plusMonths(months).plusDays(days);
+        return d.toString();
+    }
+
+    public static String trim(String s) {
+        return s == null ? "" : s.trim();
+    }
+
+    public static String addToDateTime(String dt, int y, int m, int d, int h, int min, int s) {
+        LocalDateTime t = LocalDateTime.parse(dt);
+        t = t.plusYears(y).plusMonths(m).plusDays(d).plusHours(h).plusMinutes(min).plusSeconds(s);
+        return t.toString();
+    }
+
+    public static String addToTime(String time, int h, int m, int s) {
+        LocalTime t = LocalTime.parse(time);
+        t = t.plusHours(h).plusMinutes(m).plusSeconds(s);
+        return t.toString();
+    }
+
+    public static int base64Length(String b64) {
+        byte[] data = Base64.getDecoder().decode(b64);
+        return data.length;
+    }
+
+    public static String base64ToHex(String b64) {
+        byte[] data = Base64.getDecoder().decode(b64);
+        StringBuilder sb = new StringBuilder();
+        for (byte by : data) {
+            sb.append(String.format("%02x", by));
+        }
+        return sb.toString();
+    }
+
+    public static String base64ToString(String b64, String encoding) throws Exception {
+        if (encoding == null || encoding.isEmpty()) {
+            encoding = "UTF-8";
+        }
+        byte[] data = Base64.getDecoder().decode(b64);
+        return new String(data, Charset.forName(encoding));
+    }
+
+    public static int compareDate(String d1, String d2) {
+        LocalDate a = LocalDate.parse(d1);
+        LocalDate b = LocalDate.parse(d2);
+        return a.compareTo(b);
+    }
+
+    public static int compareDateTime(String dt1, String dt2) {
+        LocalDateTime a = LocalDateTime.parse(dt1);
+        LocalDateTime b = LocalDateTime.parse(dt2);
+        return a.compareTo(b);
+    }
+
+    public static int compareTime(String t1, String t2) {
+        LocalTime a = LocalTime.parse(t1);
+        LocalTime b = LocalTime.parse(t2);
+        return a.compareTo(b);
+    }
+
+    public static String concatBase64(String... parts) {
+        int total = 0;
+        byte[][] data = new byte[parts.length][];
+        for (int i = 0; i < parts.length; i++) {
+            data[i] = Base64.getDecoder().decode(parts[i]);
+            total += data[i].length;
+        }
+        byte[] out = new byte[total];
+        int pos = 0;
+        for (byte[] arr : data) {
+            System.arraycopy(arr, 0, out, pos, arr.length);
+            pos += arr.length;
+        }
+        return Base64.getEncoder().encodeToString(out);
+    }
+
+    public static String concatSequence(String... values) {
+        StringBuilder sb = new StringBuilder();
+        for (String s : values) {
+            if (s != null)
+                sb.append(s);
+        }
+        return sb.toString();
+    }
+
+    public static String concatSequenceFormat(String[] values, String sep, Boolean excludeEmpty) {
+        if (sep == null) sep = "";
+        boolean skipEmpty = excludeEmpty != null && excludeEmpty.booleanValue();
+        StringBuilder sb = new StringBuilder();
+        for (int i = 0; i < values.length; i++) {
+            String v = values[i];
+            if (skipEmpty && (v == null || v.isEmpty())) {
+                continue;
+            }
+            if (sb.length() > 0) sb.append(sep);
+            if (v != null) sb.append(v);
+        }
+        return sb.toString();
+    }
+
+    public static String createDate(int y, int m, int d) {
+        LocalDate ld = LocalDate.of(y, m, d);
+        return ld.toString();
+    }
+
+    public static String createDateTime(int y, int m, int d, int h, int min, int s, Integer ms) {
+        LocalDateTime t = LocalDateTime.of(y, m, d, h, min, s, ms == null ? 0 : ms * 1_000_000);
+        return t.toString();
+    }
+
+    public static String createDateTimeTimezone(int y, int m, int d, int h, int min, int s, int ms, int offH, int offM) {
+        ZoneOffset off = ZoneOffset.ofHoursMinutes(offH, offM);
+        OffsetDateTime odt = OffsetDateTime.of(y, m, d, h, min, s, ms * 1_000_000, off);
+        return odt.toString();
+    }
+
+    public static String createTime(int h, int m, int s, Integer ms) {
+        LocalTime t = LocalTime.of(h, m, s, ms == null ? 0 : ms * 1_000_000);
+        return t.toString();
+    }
+
+    public static String currentDateTimeTimezone(int offH, int offM) {
+        ZoneOffset off = ZoneOffset.ofHoursMinutes(offH, offM);
+        OffsetDateTime odt = OffsetDateTime.now(off);
+        return odt.toString();
+    }
+
+    public static String getCenturyFromDate(String date) {
+        int year = LocalDate.parse(date).getYear();
+        return Integer.toString(year / 100);
+    }
+
+    public static String getCenturyFromDateTime(String dt) {
+        int year = LocalDateTime.parse(dt).getYear();
+        return Integer.toString(year / 100);
+    }
+
+    public static String headBase64(String b64, int len) {
+        byte[] data = Base64.getDecoder().decode(b64);
+        if (len < 0 || len > data.length) len = data.length;
+        byte[] sub = new byte[len];
+        System.arraycopy(data, 0, sub, 0, len);
+        return Base64.getEncoder().encodeToString(sub);
+    }
+
+    public static int hexLength(String hex) {
+        return hex.length() / 2;
+    }
+
+    public static String hexToBase64(String hex) {
+        byte[] data = new byte[hex.length() / 2];
+        for (int i = 0; i < data.length; i++) {
+            int idx = i * 2;
+            data[i] = (byte) Integer.parseInt(hex.substring(idx, idx + 2), 16);
+        }
+        return Base64.getEncoder().encodeToString(data);
+    }
+
+    public static String hexToString(String hex, String encoding) throws Exception {
+        if (encoding == null || encoding.isEmpty()) {
+            encoding = "UTF-8";
+        }
+        byte[] data = new byte[hex.length() / 2];
+        for (int i = 0; i < data.length; i++) {
+            int idx = i * 2;
+            data[i] = (byte) Integer.parseInt(hex.substring(idx, idx + 2), 16);
+        }
+        return new String(data, Charset.forName(encoding));
+    }
+
+    public static String ifAbsent(String value, String def) {
+        if (value == null || value.isEmpty()) {
+            return def;
+        }
+        return value;
+    }
+
+    public static int indexOf(String s, String t) {
+        return s.indexOf(t) + 1;
+    }
+
+    public static int lastIndexOf(String s, String t) {
+        return s.lastIndexOf(t) + 1;
+    }
+
+    public static String left(String s, int len) {
+        if (len <= 0) return "";
+        if (len >= s.length()) return s;
+        return s.substring(0, len);
+    }
+
+    public static String pad(String s, int length, String padChar) {
+        if (padChar == null || padChar.isEmpty()) padChar = " ";
+        if (s.length() >= length) return s;
+        StringBuilder sb = new StringBuilder(s);
+        while (sb.length() < length) {
+            sb.append(padChar.charAt(0));
+        }
+        return sb.toString();
+    }
+
+    public static String padAndLimit(String s, int length, String padChar) throws Exception {
+        if (padChar == null || padChar.isEmpty()) padChar = " ";
+        if (s.length() > length) throw new Exception("too long");
+        StringBuilder sb = new StringBuilder(s);
+        while (sb.length() < length) {
+            sb.append(padChar.charAt(0));
+        }
+        return sb.toString();
+    }
+
+    public static String padBase64(String b64, String filler, int length) {
+        byte[] a = Base64.getDecoder().decode(b64);
+        byte[] f = Base64.getDecoder().decode(filler);
+        if (a.length >= length) return b64;
+        byte[] out = new byte[length];
+        System.arraycopy(a, 0, out, 0, a.length);
+        int pos = a.length;
+        while (pos < length) {
+            int copy = Math.min(f.length, length - pos);
+            System.arraycopy(f, 0, out, pos, copy);
+            pos += copy;
+        }
+        return Base64.getEncoder().encodeToString(out);
+    }
+
+    public static String padFront(String s, int length, String padChar) {
+        if (padChar == null || padChar.isEmpty()) padChar = " ";
+        if (s.length() >= length) return s;
+        StringBuilder sb = new StringBuilder();
+        while (sb.length() < length - s.length()) {
+            sb.append(padChar.charAt(0));
+        }
+        sb.append(s);
+        return sb.toString();
+    }
+
+    public static String parseDate(String format, String text) {
+        DateTimeFormatter f = DateTimeFormatter.ofPattern(format);
+        LocalDate d = LocalDate.parse(text, f);
+        return d.toString();
+    }
+
+    public static String parseDateTime(String format, String text) {
+        DateTimeFormatter f = DateTimeFormatter.ofPattern(format);
+        LocalDateTime t = LocalDateTime.parse(text, f);
+        return t.atOffset(ZoneOffset.systemDefault().getRules().getOffset(t)).toString();
+    }
+
+    public static String parseTime(String format, String text) {
+        DateTimeFormatter f = DateTimeFormatter.ofPattern(format);
+        LocalTime t = LocalTime.parse(text, f);
+        return t.toString();
+    }
+
+    public static int random(int min, int max) {
+        return new Random().nextInt((max - min) + 1) + min;
+    }
+
+    public static String renderXml(Node node, Boolean omit, Boolean indent) throws Exception {
+        TransformerFactory tf = TransformerFactory.newInstance();
+        Transformer t = tf.newTransformer();
+        if (omit != null && omit.booleanValue()) {
+            t.setOutputProperty(OutputKeys.OMIT_XML_DECLARATION, "yes");
+        }
+        if (indent != null && indent.booleanValue()) {
+            t.setOutputProperty(OutputKeys.INDENT, "yes");
+        }
+        java.io.StringWriter sw = new java.io.StringWriter();
+        t.transform(new DOMSource(node), new StreamResult(sw));
+        return sw.toString();
+    }
+
+    public static String right(String s, int len) {
+        if (len <= 0) return "";
+        if (len >= s.length()) return s;
+        return s.substring(s.length() - len);
+    }
+
+    public static double roundFraction(double num, int digits) {
+        BigDecimal bd = BigDecimal.valueOf(num);
+        bd = bd.setScale(digits, RoundingMode.HALF_UP);
+        return bd.doubleValue();
+    }
+
+    public static String stringRoundFraction(double num, int digits) {
+        BigDecimal bd = BigDecimal.valueOf(num);
+        bd = bd.setScale(digits, RoundingMode.HALF_UP);
+        return bd.toPlainString();
+    }
+
+    public static String stringToBase64(String s, String encoding) throws Exception {
+        if (encoding == null || encoding.isEmpty()) encoding = "UTF-8";
+        byte[] data = s.getBytes(Charset.forName(encoding));
+        return Base64.getEncoder().encodeToString(data);
+    }
+
+    public static String stringToHex(String s, String encoding) throws Exception {
+        if (encoding == null || encoding.isEmpty()) encoding = "UTF-8";
+        byte[] data = s.getBytes(Charset.forName(encoding));
+        StringBuilder sb = new StringBuilder();
+        for (byte b : data) sb.append(String.format("%02X", b));
+        return sb.toString();
+    }
+
+    public static String substringAfterLast(String s, String after) {
+        int idx = s.lastIndexOf(after);
+        if (idx == -1) return "";
+        return s.substring(idx + after.length());
+    }
+
+    public static String substringBase64(String b64, int start, Integer length) {
+        byte[] data = Base64.getDecoder().decode(b64);
+        int s = Math.max(0, start - 1);
+        int len = length == null ? data.length - s : Math.min(length, data.length - s);
+        byte[] out = new byte[len];
+        System.arraycopy(data, s, out, 0, len);
+        return Base64.getEncoder().encodeToString(out);
+    }
+
+    public static String substringBeforeLast(String s, String before) {
+        int idx = s.lastIndexOf(before);
+        if (idx == -1) return "";
+        return s.substring(0, idx);
+    }
+
+    public static String translateTimezone(String dt, String zone) {
+        OffsetDateTime odt = OffsetDateTime.parse(dt);
+        ZoneOffset off = ZoneOffset.of(zone);
+        return odt.withOffsetSameInstant(off).toString();
+    }
+
+    public static String trimBase64(String b64, int begin, Integer end) {
+        byte[] data = Base64.getDecoder().decode(b64);
+        int start = Math.min(begin, data.length);
+        int endLen = end == null ? 0 : end;
+        int len = data.length - start - endLen;
+        if (len < 0) len = 0;
+        byte[] out = new byte[len];
+        System.arraycopy(data, start, out, 0, len);
+        return Base64.getEncoder().encodeToString(out);
+    }
+
+    public static boolean validateDateTime(String format, String text) {
+        try {
+            DateTimeFormatter f = DateTimeFormatter.ofPattern(format);
+            LocalDateTime.parse(text, f);
+            return true;
+        } catch (Exception e) {
+            return false;
+        }
+    }
+
+    public static boolean xor(boolean a, boolean b) {
+        return a ^ b;
+    }
+}

From f91b12624d64caae116ad0df4d7b77c054853cd8 Mon Sep 17 00:00:00 2001
From: Alexandre <alexandre.vazquez@gmail.com>
Date: Tue, 5 Aug 2025 08:58:07 +0200
Subject: [PATCH 3/5] heuristics check

---
 backend/src/main.go | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/backend/src/main.go b/backend/src/main.go
index 0a76bf73..c4ca3de6 100644
--- a/backend/src/main.go
+++ b/backend/src/main.go
@@ -198,7 +198,13 @@ func main() {
 				c.JSON(http.StatusInternalServerError, gin.H{"error": "cannot write parameter"})
 				return
 			}
-			cmdArgs = append(cmdArgs, fmt.Sprintf("%s=@%s", k, paramFile))
+			// Heuristic check: if value looks like XML (starts with '<' and ends with '>'), treat it as file-based
+			trimmed := strings.TrimSpace(v)
+			if strings.HasPrefix(trimmed, "&lt;") || strings.HasPrefix(trimmed, "<") {
+				cmdArgs = append(cmdArgs, fmt.Sprintf("+%s=%s", k, paramFile))
+			} else {
+				cmdArgs = append(cmdArgs, fmt.Sprintf("%s=%s", k, v))
+			}
 			idx++
 		}
 

From 39d6767ac5375e9f75aef5e6789d46f6da146052 Mon Sep 17 00:00:00 2001
From: Alexandre <alexandre.vazquez@gmail.com>
Date: Tue, 23 Sep 2025 16:09:29 +0200
Subject: [PATCH 4/5] +1

---
 backend/Dockerfile                            |   8 +-
 backend/ext/com/xsltplayground/Runner.java    | 200 +++++++++++++++
 .../xsltplayground/ext/CustomFunctions.java   | 229 ++++++++++++++++++
 backend/src/main.go                           |  80 +++++-
 frontend/src/App.jsx                          | 228 +++++++++++++----
 frontend/src/style.css                        |  80 ++++++
 6 files changed, 773 insertions(+), 52 deletions(-)
 create mode 100644 backend/ext/com/xsltplayground/Runner.java

diff --git a/backend/Dockerfile b/backend/Dockerfile
index 8c133962..c8c7e99a 100644
--- a/backend/Dockerfile
+++ b/backend/Dockerfile
@@ -2,7 +2,7 @@
 FROM golang:1.23-alpine AS builder
 
 # Instalar dependencias necesarias
-RUN apk add --no-cache git openjdk17
+RUN apk add --no-cache git openjdk17 curl
 
 # Establecer directorio de trabajo
 WORKDIR /app/src
@@ -21,8 +21,10 @@ RUN go mod init xslt-playground && \
 # Build extension functions jar
 WORKDIR /app/ext
 COPY ext/ .
-RUN javac com/xsltplayground/ext/CustomFunctions.java && \
-    jar cf custom-functions.jar com/xsltplayground/ext/CustomFunctions.class
+RUN mkdir -p /tmp/saxon && \
+    curl -L -o /tmp/saxon/saxon-he.jar https://repo1.maven.org/maven2/net/sf/saxon/Saxon-HE/11.6/Saxon-HE-11.6.jar && \
+    javac -cp /tmp/saxon/saxon-he.jar com/xsltplayground/ext/CustomFunctions.java com/xsltplayground/Runner.java && \
+    jar cf custom-functions.jar com
 
 WORKDIR /app/src
 
diff --git a/backend/ext/com/xsltplayground/Runner.java b/backend/ext/com/xsltplayground/Runner.java
new file mode 100644
index 00000000..2f26b508
--- /dev/null
+++ b/backend/ext/com/xsltplayground/Runner.java
@@ -0,0 +1,200 @@
+package com.xsltplayground;
+
+import com.xsltplayground.ext.CustomFunctions;
+import net.sf.saxon.s9api.*;
+
+import javax.xml.transform.Source;
+import javax.xml.transform.stream.StreamSource;
+import java.io.File;
+import java.nio.file.Files;
+import java.util.LinkedHashMap;
+import java.util.Map;
+
+public class Runner {
+    public static void main(String[] args) {
+        try {
+            Map<String, String> rawParams = new LinkedHashMap<>();
+            Map<String, String> fileParams = new LinkedHashMap<>();
+            String sourcePath = null;
+            String xslPath = null;
+            String outPath = null;
+            boolean trace = false;
+            boolean cliTrace = false; // -T flag (parsed but not used directly)
+            String traceOutPath = null;
+
+            for (String a : args) {
+                if (a.startsWith("-s:")) {
+                    sourcePath = a.substring(3);
+                } else if (a.startsWith("-xsl:")) {
+                    xslPath = a.substring(5);
+                } else if (a.startsWith("-o:")) {
+                    outPath = a.substring(3);
+                } else if (a.startsWith("+")) {
+                    // +name=/path/to/file (file-based param, typically XML)
+                    int eq = a.indexOf('=');
+                    if (eq > 1) {
+                        String name = a.substring(1, eq);
+                        String path = a.substring(eq + 1);
+                        fileParams.put(name, path);
+                    }
+                } else if (a.equals("-trace")) {
+                    trace = true;
+                } else if (a.equals("-T")) {
+                    cliTrace = true;
+                } else if (a.startsWith("-traceout:")) {
+                    traceOutPath = a.substring("-traceout:".length());
+                } else if (a.contains("=")) {
+                    int eq = a.indexOf('=');
+                    String name = a.substring(0, eq);
+                    String val = a.substring(eq + 1);
+                    rawParams.put(name, val);
+                }
+            }
+
+            if (xslPath == null || outPath == null) {
+                System.err.println("Missing -xsl: or -o: arguments");
+                System.exit(2);
+            }
+
+            Processor proc = new Processor(false);
+            CustomFunctions.registerAll(proc);
+
+            XsltCompiler compiler = proc.newXsltCompiler();
+            XsltExecutable exec;
+            if (trace) {
+                // Transform the stylesheet to inject xsl:message after each xsl:variable.
+                // Messages are written in a block form so backend can capture multiline XML:
+                // TRACE_VAR_START|name \n [serialized value or string value] \n TRACE_VAR_END
+                Processor iproc = new Processor(false);
+                XsltCompiler icomp = iproc.newXsltCompiler();
+                String instrumenter =
+                        "<xsl:stylesheet version=\"2.0\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
+                        "  <xsl:output method=\"xml\"/>" +
+                        "  <xsl:strip-space elements=\"*\"/>" +
+                        "  <xsl:template match=\"@*|node()\">" +
+                        "    <xsl:copy>" +
+                        "      <xsl:apply-templates select=\"@*|node()\"/>" +
+                        "    </xsl:copy>" +
+                        "  </xsl:template>" +
+                        // Instrument top-level variables
+                        "  <xsl:template match=\"/xsl:stylesheet/xsl:variable | /xsl:transform/xsl:variable\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
+                        "    <xsl:copy>" +
+                        "      <xsl:apply-templates select=\"@*|node()\"/>" +
+                        "    </xsl:copy>" +
+                        "    <xsl:message>" +
+                        "      <xsl:text>TRACE_VAR_START|</xsl:text>" +
+                        "      <xsl:value-of select=\"@name\"/>" +
+                        "      <xsl:text>&#10;</xsl:text>" +
+                        "      <xsl:element name=\"xsl:copy-of\" namespace=\"http://www.w3.org/1999/XSL/Transform\">" +
+                        "        <xsl:attribute name=\"select\">$<xsl:value-of select=\"@name\"/></xsl:attribute>" +
+                        "      </xsl:element>" +
+                        "      <xsl:text>&#10;TRACE_VAR_END</xsl:text>" +
+                        "    </xsl:message>" +
+                        "  </xsl:template>" +
+                        // Instrument non-top-level variables
+                        "  <xsl:template match=\"xsl:variable\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
+                        "    <xsl:copy>" +
+                        "      <xsl:apply-templates select=\"@*|node()\"/>" +
+                        "    </xsl:copy>" +
+                        "    <xsl:message>" +
+                        "      <xsl:text>TRACE_VAR_START|</xsl:text>" +
+                        "      <xsl:value-of select=\"@name\"/>" +
+                        "      <xsl:text>&#10;</xsl:text>" +
+                        "      <xsl:element name=\"xsl:copy-of\" namespace=\"http://www.w3.org/1999/XSL/Transform\">" +
+                        "        <xsl:attribute name=\"select\">$<xsl:value-of select=\"@name\"/></xsl:attribute>" +
+                        "      </xsl:element>" +
+                        "      <xsl:text>&#10;TRACE_VAR_END</xsl:text>" +
+                        "    </xsl:message>" +
+                        "  </xsl:template>" +
+                        "</xsl:stylesheet>";
+
+                XsltExecutable instExec = icomp.compile(new StreamSource(new java.io.StringReader(instrumenter)));
+                XsltTransformer instTr = instExec.load();
+                XdmNode styleDoc = iproc.newDocumentBuilder().build(new StreamSource(new File(xslPath)));
+                instTr.setInitialContextNode(styleDoc);
+                java.io.StringWriter sw = new java.io.StringWriter();
+                Serializer out = iproc.newSerializer(sw);
+                instTr.setDestination(out);
+                instTr.transform();
+                String instrumented = sw.toString();
+                exec = compiler.compile(new StreamSource(new java.io.StringReader(instrumented)));
+            } else {
+                exec = compiler.compile(new StreamSource(new File(xslPath)));
+            }
+            XsltTransformer transformer = exec.load();
+
+            // If a trace output path is provided, tee System.err to that file so that
+            // xsl:message (and other diagnostics) also land in the trace file.
+            java.io.PrintStream originalErr = System.err;
+            java.io.FileOutputStream traceFos = null;
+            java.io.PrintStream tracePs = null;
+            java.io.PrintStream teeErr = null;
+            if (traceOutPath != null && !traceOutPath.isEmpty()) {
+                try {
+                    traceFos = new java.io.FileOutputStream(new File(traceOutPath), true);
+                    tracePs = new java.io.PrintStream(traceFos, true, "UTF-8");
+                    final java.io.PrintStream err1 = originalErr;
+                    final java.io.PrintStream err2 = tracePs;
+                    java.io.OutputStream tee = new java.io.OutputStream() {
+                        @Override public void write(int b) throws java.io.IOException { err1.write(b); err2.write(b); }
+                        @Override public void write(byte[] b) throws java.io.IOException { err1.write(b); err2.write(b); }
+                        @Override public void write(byte[] b, int off, int len) throws java.io.IOException { err1.write(b, off, len); err2.write(b, off, len); }
+                        @Override public void flush() throws java.io.IOException { err1.flush(); err2.flush(); }
+                        @Override public void close() throws java.io.IOException { err2.close(); err1.flush(); }
+                    };
+                    teeErr = new java.io.PrintStream(tee, true, "UTF-8");
+                    System.setErr(teeErr);
+                } catch (Exception e) {
+                    // If we fail to set up the trace file, continue without it
+                    e.printStackTrace(originalErr);
+                }
+            }
+
+            if (sourcePath != null && !sourcePath.isEmpty()) {
+                Source src = new StreamSource(new File(sourcePath));
+                XdmNode doc = proc.newDocumentBuilder().build(src);
+                transformer.setInitialContextNode(doc);
+            }
+
+            // Parameters as strings
+            for (Map.Entry<String, String> e : rawParams.entrySet()) {
+                transformer.setParameter(new QName(e.getKey()), new XdmAtomicValue(e.getValue()));
+            }
+            // File parameters (parse as XML if it looks like XML; else pass as string)
+            for (Map.Entry<String, String> e : fileParams.entrySet()) {
+                String name = e.getKey();
+                String path = e.getValue();
+                String content = new String(Files.readAllBytes(new File(path).toPath()))
+                        .trim();
+                if (content.startsWith("<")) {
+                    XdmNode node = proc.newDocumentBuilder().build(new StreamSource(new File(path)));
+                    transformer.setParameter(new QName(name), node);
+                } else {
+                    transformer.setParameter(new QName(name), new XdmAtomicValue(content));
+                }
+            }
+
+            Serializer ser = proc.newSerializer(new File(outPath));
+            transformer.setDestination(ser);
+            try {
+                transformer.transform();
+            } finally {
+                // Restore System.err and close the trace stream if used
+                if (teeErr != null) {
+                    System.setErr(originalErr);
+                    try { teeErr.flush(); } catch (Exception ignored) {}
+                }
+                if (tracePs != null) {
+                    try { tracePs.flush(); } catch (Exception ignored) {}
+                    try { tracePs.close(); } catch (Exception ignored) {}
+                }
+                if (traceFos != null) {
+                    try { traceFos.close(); } catch (Exception ignored) {}
+                }
+            }
+        } catch (Exception e) {
+            e.printStackTrace(System.err);
+            System.exit(1);
+        }
+    }
+}
diff --git a/backend/ext/com/xsltplayground/ext/CustomFunctions.java b/backend/ext/com/xsltplayground/ext/CustomFunctions.java
index af716f8c..202442ae 100644
--- a/backend/ext/com/xsltplayground/ext/CustomFunctions.java
+++ b/backend/ext/com/xsltplayground/ext/CustomFunctions.java
@@ -382,4 +382,233 @@ public class CustomFunctions {
     public static boolean xor(boolean a, boolean b) {
         return a ^ b;
     }
+
+    // ---------------------------------------------------------------------
+    // Saxon HE integration
+    // ---------------------------------------------------------------------
+    // Saxon-HE doesn't support reflexive java: calls. To keep XSLT unchanged
+    // (e.g., xmlns:java="java:com.xsltplayground.ext.CustomFunctions" and
+    // java:uuid()), register integrated extension functions programmatically.
+    // Call CustomFunctions.registerAll(processor) once during initialization.
+
+    public static void registerAll(net.sf.saxon.s9api.Processor processor) {
+        final String namespace = "java:" + CustomFunctions.class.getName();
+
+        java.lang.reflect.Method[] methods = CustomFunctions.class.getDeclaredMethods();
+        for (java.lang.reflect.Method m : methods) {
+            int mods = m.getModifiers();
+            if (!java.lang.reflect.Modifier.isStatic(mods) || !java.lang.reflect.Modifier.isPublic(mods)) {
+                continue;
+            }
+            if (m.getName().equals("registerAll")) {
+                continue;
+            }
+
+            String camel = m.getName();
+            String kebab = camelToKebab(camel);
+
+            if (m.isVarArgs()) {
+                int fixed = m.getParameterCount() - 1;
+                int maxVarargs = 8;
+                for (int extra = 0; extra <= maxVarargs; extra++) {
+                    int arity = fixed + (extra == 0 ? 1 : extra);
+                    processor.registerExtensionFunction(new SaxonDynamicFunction(namespace, camel, m, arity));
+                    if (!kebab.equals(camel)) {
+                        processor.registerExtensionFunction(new SaxonDynamicFunction(namespace, kebab, m, arity));
+                    }
+                }
+            } else {
+                int arity = m.getParameterCount();
+                processor.registerExtensionFunction(new SaxonDynamicFunction(namespace, camel, m, arity));
+                if (!kebab.equals(camel)) {
+                    processor.registerExtensionFunction(new SaxonDynamicFunction(namespace, kebab, m, arity));
+                }
+            }
+        }
+
+        // Back-compat alias: support XSLT calls named "parse-dateTime"
+        // in addition to the canonical kebab-case "parse-date-time".
+        try {
+            java.lang.reflect.Method pdt = CustomFunctions.class.getDeclaredMethod("parseDateTime", String.class, String.class);
+            processor.registerExtensionFunction(new SaxonDynamicFunction(namespace, "parse-dateTime", pdt, 2));
+        } catch (NoSuchMethodException ignore) {
+        }
+    }
+
+    private static String camelToKebab(String s) {
+        StringBuilder sb = new StringBuilder();
+        for (int i = 0; i < s.length(); i++) {
+            char c = s.charAt(i);
+            if (Character.isUpperCase(c)) {
+                if (i > 0) sb.append('-');
+                sb.append(Character.toLowerCase(c));
+            } else {
+                sb.append(c);
+            }
+        }
+        return sb.toString();
+    }
+
+    private static final class SaxonDynamicFunction implements net.sf.saxon.s9api.ExtensionFunction {
+        private final String namespace;
+        private final String localName;
+        private final java.lang.reflect.Method method;
+        private final int arity;
+
+        SaxonDynamicFunction(String namespace, String localName, java.lang.reflect.Method method, int arity) {
+            this.namespace = namespace;
+            this.localName = localName;
+            this.method = method;
+            this.arity = arity;
+        }
+
+        @Override
+        public net.sf.saxon.s9api.QName getName() {
+            return new net.sf.saxon.s9api.QName(namespace, localName);
+        }
+
+        @Override
+        public net.sf.saxon.s9api.SequenceType[] getArgumentTypes() {
+            net.sf.saxon.s9api.SequenceType any = net.sf.saxon.s9api.SequenceType
+                    .makeSequenceType(net.sf.saxon.s9api.ItemType.ANY_ITEM,
+                            net.sf.saxon.s9api.OccurrenceIndicator.ZERO_OR_MORE);
+            net.sf.saxon.s9api.SequenceType[] arr = new net.sf.saxon.s9api.SequenceType[arity];
+            for (int i = 0; i < arity; i++) arr[i] = any;
+            return arr;
+        }
+
+        @Override
+        public net.sf.saxon.s9api.SequenceType getResultType() {
+            // Be permissive on result typing as well
+            return net.sf.saxon.s9api.SequenceType
+                    .makeSequenceType(net.sf.saxon.s9api.ItemType.ANY_ITEM,
+                            net.sf.saxon.s9api.OccurrenceIndicator.ZERO_OR_MORE);
+        }
+
+        @Override
+        public net.sf.saxon.s9api.XdmValue call(net.sf.saxon.s9api.XdmValue[] arguments) throws net.sf.saxon.s9api.SaxonApiException {
+            try {
+                Object[] args = buildJavaArgs(arguments);
+                Object result = method.invoke(null, args);
+                return toXdmValue(result);
+            } catch (java.lang.reflect.InvocationTargetException ite) {
+                Throwable cause = ite.getTargetException() != null ? ite.getTargetException() : ite;
+                throw new net.sf.saxon.s9api.SaxonApiException("Error in extension function '" + method.getName() + "': " + cause.getMessage(), cause);
+            } catch (Exception e) {
+                throw new net.sf.saxon.s9api.SaxonApiException("Failed to invoke extension function '" + method.getName() + "'", e);
+            }
+        }
+
+        private Object[] buildJavaArgs(net.sf.saxon.s9api.XdmValue[] arguments) throws Exception {
+            Class<?>[] params = method.getParameterTypes();
+            boolean isVarArgs = method.isVarArgs();
+
+            if (!isVarArgs) {
+                Object[] out = new Object[params.length];
+                for (int i = 0; i < params.length; i++) {
+                    out[i] = fromXdm(arguments[i], params[i]);
+                }
+                return out;
+            } else {
+                int fixed = params.length - 1;
+                Object[] out = new Object[params.length];
+                for (int i = 0; i < fixed; i++) {
+                    out[i] = fromXdm(arguments[i], params[i]);
+                }
+                // Collect remaining args into the varargs array
+                Class<?> comp = params[params.length - 1].getComponentType();
+                int varCount = Math.max(0, arguments.length - fixed);
+                Object varArray = java.lang.reflect.Array.newInstance(comp, varCount);
+                for (int i = 0; i < varCount; i++) {
+                    Object v = fromXdm(arguments[fixed + i], comp);
+                    java.lang.reflect.Array.set(varArray, i, v);
+                }
+                out[out.length - 1] = varArray;
+                return out;
+            }
+        }
+
+        // Type mapping helpers removed; using ANY_SEQUENCE for resilience across versions.
+
+        private static net.sf.saxon.s9api.XdmValue toXdmValue(Object result) {
+            if (result == null) return net.sf.saxon.s9api.XdmEmptySequence.getInstance();
+            if (result instanceof net.sf.saxon.s9api.XdmValue) return (net.sf.saxon.s9api.XdmValue) result;
+            if (result instanceof String) return new net.sf.saxon.s9api.XdmAtomicValue((String) result);
+            if (result instanceof Integer) return new net.sf.saxon.s9api.XdmAtomicValue(((Integer) result).longValue());
+            if (result instanceof Long) return new net.sf.saxon.s9api.XdmAtomicValue(((Long) result).longValue());
+            if (result instanceof Double) return new net.sf.saxon.s9api.XdmAtomicValue(((Double) result).doubleValue());
+            if (result instanceof Boolean) return new net.sf.saxon.s9api.XdmAtomicValue(((Boolean) result).booleanValue());
+            if (result instanceof org.w3c.dom.Node) {
+                // Serialize DOM node to string for portability
+                try {
+                    javax.xml.transform.TransformerFactory tf = javax.xml.transform.TransformerFactory.newInstance();
+                    javax.xml.transform.Transformer t = tf.newTransformer();
+                    java.io.StringWriter sw = new java.io.StringWriter();
+                    t.transform(new javax.xml.transform.dom.DOMSource((org.w3c.dom.Node) result), new javax.xml.transform.stream.StreamResult(sw));
+                    return new net.sf.saxon.s9api.XdmAtomicValue(sw.toString());
+                } catch (Exception e) {
+                    return new net.sf.saxon.s9api.XdmAtomicValue("");
+                }
+            }
+            // Generic fallback to string
+            return new net.sf.saxon.s9api.XdmAtomicValue(String.valueOf(result));
+        }
+
+        private static Object fromXdm(net.sf.saxon.s9api.XdmValue value, Class<?> target) throws Exception {
+            if (target == String.class) {
+                if (value == null || value.size() == 0) return "";
+                for (net.sf.saxon.s9api.XdmItem it : value) { return it.getStringValue(); }
+                return "";
+            }
+            if (target == int.class || target == Integer.class) {
+                if (value == null || value.size() == 0) return (target == Integer.class ? null : 0);
+                String s = ""; for (net.sf.saxon.s9api.XdmItem it : value) { s = it.getStringValue(); break; }
+                return Integer.parseInt(s);
+            }
+            if (target == long.class || target == Long.class) {
+                if (value == null || value.size() == 0) return (target == Long.class ? null : 0L);
+                String s = ""; for (net.sf.saxon.s9api.XdmItem it : value) { s = it.getStringValue(); break; }
+                return Long.parseLong(s);
+            }
+            if (target == double.class || target == Double.class) {
+                if (value == null || value.size() == 0) return (target == Double.class ? null : 0d);
+                String s = ""; for (net.sf.saxon.s9api.XdmItem it : value) { s = it.getStringValue(); break; }
+                return Double.parseDouble(s);
+            }
+            if (target == boolean.class || target == Boolean.class) {
+                if (value == null || value.size() == 0) return (target == Boolean.class ? null : false);
+                String s = ""; for (net.sf.saxon.s9api.XdmItem it : value) { s = it.getStringValue(); break; }
+                return Boolean.parseBoolean(s);
+            }
+            if (target == org.w3c.dom.Node.class) {
+                if (value == null || value.size() == 0) return null;
+                if (value instanceof net.sf.saxon.s9api.XdmNode) {
+                    javax.xml.transform.Source src = ((net.sf.saxon.s9api.XdmNode) value).asSource();
+                    javax.xml.transform.TransformerFactory tf = javax.xml.transform.TransformerFactory.newInstance();
+                    javax.xml.transform.Transformer tr = tf.newTransformer();
+                    javax.xml.transform.dom.DOMResult res = new javax.xml.transform.dom.DOMResult();
+                    tr.transform(src, res);
+                    return res.getNode();
+                }
+                // Fallback: try to parse string as XML
+                String xml = ""; for (net.sf.saxon.s9api.XdmItem it : value) { xml = it.getStringValue(); break; }
+                javax.xml.parsers.DocumentBuilderFactory dbf = javax.xml.parsers.DocumentBuilderFactory.newInstance();
+                dbf.setNamespaceAware(true);
+                return dbf.newDocumentBuilder().parse(new org.xml.sax.InputSource(new java.io.StringReader(xml)));
+            }
+            if (target.isArray() && target.getComponentType() == String.class) {
+                // Expect a sequence of strings in a single argument
+                if (value == null || value.size() == 0) return new String[0];
+                java.util.List<String> items = new java.util.ArrayList<>();
+                for (net.sf.saxon.s9api.XdmItem it : value) {
+                    items.add(it.getStringValue());
+                }
+                return items.toArray(new String[0]);
+            }
+            // Default to string conversion
+            if (value == null || value.size() == 0) return null;
+            for (net.sf.saxon.s9api.XdmItem it : value) { return it.getStringValue(); }
+            return null;
+        }
+    }
 }
diff --git a/backend/src/main.go b/backend/src/main.go
index c4ca3de6..a2fa0587 100644
--- a/backend/src/main.go
+++ b/backend/src/main.go
@@ -28,11 +28,19 @@ type TransformRequest struct {
 	XSLT       string            `json:"xslt"`
 	Version    string            `json:"version"`
 	Parameters map[string]string `json:"parameters"`
+	Trace      bool              `json:"trace"`
 }
 
 type TransformResponse struct {
-	Result     string `json:"result"`
-	DurationMs int64  `json:"duration_ms"`
+	Result     string       `json:"result"`
+	DurationMs int64        `json:"duration_ms"`
+	Trace      []TraceEntry `json:"trace,omitempty"`
+	TraceText  string       `json:"trace_text,omitempty"`
+}
+
+type TraceEntry struct {
+	Name  string `json:"name"`
+	Value string `json:"value"`
 }
 
 type AppConfig struct {
@@ -184,12 +192,25 @@ func main() {
 		cmdArgs = append(cmdArgs,
 			"-cp",
 			config.SaxonClasspath,
-			"net.sf.saxon.Transform",
+			"com.xsltplayground.Runner",
 			"-s:"+inputPath,
 			"-xsl:"+xsltPath,
 			"-o:"+outputPath,
 		)
 
+		var tracePath string
+		if req.Trace {
+			// Enable Runner instrumentation and capture trace output
+			cmdArgs = append(cmdArgs, "-trace")
+			// Provide a trace output file to capture Saxon messages
+			tracePath = filepath.Join(tmpDir, "trace.log")
+			cmdArgs = append(cmdArgs, "-traceout:"+tracePath)
+			// Also enable Saxon CLI tracing flag for richer diagnostics
+			cmdArgs = append(cmdArgs, "-T")
+		}
+
+		log.Printf("+++++++++++++ msg %s", strings.Join(cmdArgs, "\n"))
+
 		idx := 0
 		for k, v := range req.Parameters {
 			paramFile := filepath.Join(tmpDir, fmt.Sprintf("param_%d", idx))
@@ -214,6 +235,8 @@ func main() {
 			return
 		}
 
+		log.Printf("+++++++++++++ msg %s", strings.Join(cmdArgs, "\n"))
+
 		cmd := exec.Command("java", "@"+argsPath)
 		var stderr bytes.Buffer
 		cmd.Stderr = &stderr
@@ -246,7 +269,56 @@ func main() {
 
 		duration := time.Since(start).Milliseconds()
 		log.Printf("transformation done in %dms", duration)
-		c.JSON(http.StatusOK, TransformResponse{Result: string(result), DurationMs: duration})
+
+        var traceEntries []TraceEntry
+        var traceText string
+        if req.Trace {
+            // Load trace text from file (preferred) or stderr
+            if tracePath != "" {
+                if data, err := os.ReadFile(tracePath); err == nil {
+                    traceText = string(data)
+                }
+            }
+            if traceText == "" {
+                traceText = stderr.String()
+            }
+
+            // Parse block-based variable traces and legacy single-line ones
+            lines := strings.Split(traceText, "\n")
+            capturing := false
+            var currName string
+            var buf []string
+            for _, l := range lines {
+                if strings.HasPrefix(l, "TRACE_VAR_START|") {
+                    capturing = true
+                    currName = strings.TrimPrefix(l, "TRACE_VAR_START|")
+                    buf = nil
+                    continue
+                }
+                if strings.HasPrefix(l, "TRACE_VAR_END") {
+                    if capturing {
+                        value := strings.Join(buf, "\n")
+                        traceEntries = append(traceEntries, TraceEntry{Name: currName, Value: value})
+                    }
+                    capturing = false
+                    currName = ""
+                    buf = nil
+                    continue
+                }
+                if capturing {
+                    buf = append(buf, l)
+                    continue
+                }
+                if strings.HasPrefix(l, "TRACE_VAR|") {
+                    parts := strings.SplitN(l, "|", 3)
+                    if len(parts) == 3 {
+                        traceEntries = append(traceEntries, TraceEntry{Name: parts[1], Value: parts[2]})
+                    }
+                }
+            }
+        }
+
+        c.JSON(http.StatusOK, TransformResponse{Result: string(result), DurationMs: duration, Trace: traceEntries, TraceText: traceText})
 	})
 
 	r.GET("/", func(c *gin.Context) {
diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 33d3a552..3a66054b 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -15,6 +15,31 @@ import Buymeacoffee from "./BuyMeACoffee";
 const PARAM_START = "<!--PARAMS_START-->";
 const PARAM_END = "<!--PARAMS_END-->";
 
+function parseErrorLines(txt) {
+  if (!txt) return [];
+  const starts = [];
+  const regex = /(^|\r?\n)(Warning|Error)\b/g; // tokens at start or after newline
+  let m;
+  while ((m = regex.exec(txt)) !== null) {
+    const start = m.index + (m[1] ? m[1].length : 0);
+    starts.push(start);
+  }
+  if (starts.length === 0) {
+    return [txt.trim()].filter(Boolean);
+  }
+  const lines = [];
+  // Any leading text before the first token as its own entry
+  const leading = txt.slice(0, starts[0]).trim();
+  if (leading) lines.push(leading);
+  for (let i = 0; i < starts.length; i++) {
+    const s = starts[i];
+    const e = i + 1 < starts.length ? starts[i + 1] : txt.length;
+    const chunk = txt.slice(s, e).trim();
+    if (chunk) lines.push(chunk);
+  }
+  return lines;
+}
+
 function stripParamBlock(text) {
   const start = text.indexOf(PARAM_START);
   const end = text.indexOf(PARAM_END);
@@ -117,23 +142,33 @@ function defaultTab() {
 }
 
 export default function App() {
-  const [tabs, setTabs] = useState(() => {
-    if (goPro) {
-      try {
-        const stored = sessionStorage.getItem("tabs");
-        if (stored) return JSON.parse(stored);
-      } catch {}
-    }
-    return [defaultTab()];
-  });
-  const [active, setActive] = useState(() => tabs[0].id);
+  // Load persisted workspace from localStorage (if present)
+  let initialTabs = [defaultTab()];
+  try {
+    const stored = localStorage.getItem("tabs");
+    if (stored) initialTabs = JSON.parse(stored);
+  } catch {}
+  let initialActive = initialTabs[0]?.id;
+  try {
+    const sAct = localStorage.getItem("active");
+    if (sAct) initialActive = JSON.parse(sAct);
+  } catch {}
+
+  const [tabs, setTabs] = useState(initialTabs);
+  const [active, setActive] = useState(initialActive);
   const [editorFocused, setEditorFocused] = useState(false);
   const [result, setResult] = useState("");
   const [error, setError] = useState("");
+  const [errorLines, setErrorLines] = useState([]);
   const [duration, setDuration] = useState(null);
   const [user, setUser] = useState(null);
   const [auth, setAuth] = useState(null);
   const resultEditorRef = useRef(null);
+  const [traceEnabled, setTraceEnabled] = useState(() => {
+    try { return JSON.parse(localStorage.getItem("traceEnabled") || "false"); } catch { return false; }
+  });
+  const [traceEntries, setTraceEntries] = useState([]);
+  const [traceCollapsed, setTraceCollapsed] = useState(false);
 
   const backendBase = (env.VITE_BACKEND_URL || "").replace(/\/$/, "");
   console.log("Using this URL as backendURL:", backendBase);
@@ -143,12 +178,17 @@ export default function App() {
     ga4react.initialize().catch(err => console.error(err));
  }, []);
 
+  // Persist workspace on change
   useEffect(() => {
-    if (goPro) {
-      sessionStorage.setItem("tabs", JSON.stringify(tabs));
-    }
-    
-  }, [tabs]);
+    try {
+      localStorage.setItem("tabs", JSON.stringify(tabs));
+      localStorage.setItem("active", JSON.stringify(active));
+    } catch {}
+  }, [tabs, active]);
+
+  useEffect(() => {
+    try { localStorage.setItem("traceEnabled", JSON.stringify(traceEnabled)); } catch {}
+  }, [traceEnabled]);
 
   useEffect(() => {
     if (!goPro) return;
@@ -203,23 +243,44 @@ export default function App() {
           xslt: xsltText,
           version: ver,
           parameters: paramObj,
+          trace: traceEnabled,
         }),
       });
       if (!res.ok) {
-        const txt = await res.text();
+        let txt = "";
+        try {
+          // Prefer JSON to decode escaped newlines (\n)
+          const j = await res.json();
+          if (j && typeof j.error === "string") {
+            txt = j.error;
+          } else {
+            txt = JSON.stringify(j);
+          }
+        } catch {
+          // Fallback to raw text
+          txt = await res.text();
+        }
+        const lines = parseErrorLines(txt || res.statusText || "");
         setError(txt || res.statusText);
+        setErrorLines(lines);
         setDuration(null);
         setResult("");
+        setTraceEntries([]);
         return;
       }
       const data = await res.json();
       setResult(data.result);
       setDuration(data.duration_ms);
       setError("");
+      setErrorLines([]);
+      setTraceEntries(traceEnabled ? (data.trace || []) : []);
     } catch (e) {
-      setError(String(e));
+      const txt = String(e);
+      setError(txt);
+      setErrorLines(parseErrorLines(txt));
       setResult("");
       setDuration(null);
+      setTraceEntries([]);
     }
   }, 500);
 
@@ -229,7 +290,7 @@ export default function App() {
       activeTab.version,
       activeTab.params,
     );
-  }, [activeTab]);
+  }, [activeTab, traceEnabled]);
 
   useEffect(() => {
     syncParams();
@@ -339,6 +400,26 @@ export default function App() {
           <strong>xsltplayground.com</strong>
         </div>
         <div style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}>
+          <button
+            className="icon-button"
+            title="Clear workspace"
+            onClick={() => {
+              if (window.confirm("¿Limpiar el workspace? Se perderán los cambios no guardados.")) {
+                const nt = { ...defaultTab(), params: [] };
+                setTabs([nt]);
+                setActive(nt.id);
+                setResult("");
+                setError("");
+                setErrorLines([]);
+                try {
+                  localStorage.removeItem("tabs");
+                  localStorage.removeItem("active");
+                } catch {}
+              }
+            }}
+          >
+            🧹
+          </button>
           {goPro && auth && (
             <div>
               {user ? (
@@ -450,6 +531,10 @@ export default function App() {
               <option value="1.0">XSLT 1.0</option>
               <option value="2.0">XSLT 2.0</option>
             </select>
+            <label style={{ display: "inline-flex", alignItems: "center", gap: "0.25rem", marginLeft: "0.5rem" }}>
+              <input type="checkbox" checked={traceEnabled} onChange={(e) => setTraceEnabled(e.target.checked)} />
+              Trace
+            </label>
             <div className="right-actions">
               <label className="icon-button file-label">
                 📤
@@ -483,40 +568,93 @@ export default function App() {
               </button>
             </div>
           </div>
-          <Editor
-            height="100%"
-            language="xml"
-            wrapperProps={{
-              onDragOver: (e) => e.preventDefault(),
-              onDrop: (e) =>
-                handleDrop(e, (t) =>
+          <div className="editor-split">
+            <div className="xslt-editor-wrap">
+              <Editor
+                height="100%"
+                language="xml"
+                wrapperProps={{
+                  onDragOver: (e) => e.preventDefault(),
+                  onDrop: (e) =>
+                    handleDrop(e, (t) =>
+                      setTabs((tabs) =>
+                        tabs.map((tab) =>
+                          tab.id === active ? { ...tab, xslt: stripParamBlock(t), params: addParams(t,tab) } : tab,
+                        ),
+                      ),
+                    ),
+                }}
+                value={editorFocused ? activeTab.xslt : injectParamBlock(activeTab.xslt, activeTab.params)}
+                onChange={(v) =>
                   setTabs((tabs) =>
                     tabs.map((tab) =>
-                      tab.id === active ? { ...tab, xslt: stripParamBlock(t), params: addParams(t,tab) } : tab,
+                      tab.id === active ? { ...tab, xslt: stripParamBlock(v || ""), params: addParams(v,tab) } : tab,
                     ),
-                  ),
-                ),
-            }}
-            value={editorFocused ? activeTab.xslt : injectParamBlock(activeTab.xslt, activeTab.params)}
-            onChange={(v) =>
-              setTabs((tabs) =>
-                tabs.map((tab) =>
-                  tab.id === active ? { ...tab, xslt: stripParamBlock(v || ""), params: addParams(v,tab) } : tab,
-                ),
-              )
-            }
-            onFocus={() => setEditorFocused(true)}
-            onBlur={() => {
-              setEditorFocused(false);
-              syncParams();
-            }}
-            options={{ minimap: { enabled: false }, automaticLayout: true }}
-          />
+                  )
+                }
+                onFocus={() => setEditorFocused(true)}
+                onBlur={() => {
+                  setEditorFocused(false);
+                  syncParams();
+                }}
+                options={{ minimap: { enabled: false }, automaticLayout: true }}
+              />
+            </div>
+            {traceEnabled && (
+              <div className="trace-panel" style={{ width: traceCollapsed ? '2rem' : '30%' }}>
+                <div className="trace-header" style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+                  <button
+                    className="icon-button"
+                    title={traceCollapsed ? 'Show trace' : 'Hide trace'}
+                    onClick={() => setTraceCollapsed(v => !v)}
+                    aria-label={traceCollapsed ? 'Show trace panel' : 'Hide trace panel'}
+                  >
+                    {traceCollapsed ? '▶' : '▼'}
+                  </button>
+                  {!traceCollapsed && (
+                    <span style={{ fontWeight: 'bold' }}>
+                      Trace Variables {traceEntries.length ? `(${traceEntries.length})` : ''}
+                    </span>
+                  )}
+                </div>
+                {!traceCollapsed && (
+                  <table className="trace-table">
+                    <tbody>
+                      {traceEntries.map((t, i) => (
+                        <tr key={i}>
+                          <td className="trace-name">{t.name}</td>
+                          <td className="trace-value">{t.value}</td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                )}
+              </div>
+            )}
+          </div>
         </div>
       </div>
       <div className="result" style={{ position: "relative" }}>
         {error ? (
-          <div className="error-box">{error}</div>
+          <div className="error-box">
+            {errorLines && errorLines.length > 0 ? (
+              <table className="error-table">
+                <tbody>
+                  {errorLines.map((l, i) => (
+                    <tr key={i} className="error-row">
+                      <td className="error-icon" aria-hidden>🚨</td>
+                      <td className="error-text">{l}</td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            ) : (
+              <div className="error-line">
+                <span className="error-icon" aria-hidden>🚨</span>
+                <span className="error-text">{error}</span>
+              </div>
+            )}
+          </div>
         ) : (
           duration !== null && (
             <div className="success-box">Success in {duration} ms</div>
diff --git a/frontend/src/style.css b/frontend/src/style.css
index 07cb82a9..7a5418f8 100644
--- a/frontend/src/style.css
+++ b/frontend/src/style.css
@@ -59,6 +59,38 @@ body,
   background: #fee;
   color: #900;
   padding: 0.5rem;
+  border: 1px solid #f3c2c2;
+  border-left: 4px solid #d00;
+  max-height: 30vh; /* limit height */
+  overflow: auto;   /* enable scroll when needed */
+}
+
+/* Tabular error list */
+.error-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.error-row {
+  vertical-align: top;
+}
+
+.error-icon {
+  width: 1.75rem;
+  text-align: center;
+  padding-right: 0.25rem;
+  color: #d00;
+}
+
+.error-text {
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.error-line {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.25rem;
 }
 
 .success-box {
@@ -120,6 +152,54 @@ body,
   min-height: 0;
 }
 
+.editor-split {
+  display: flex;
+  gap: 0.5rem;
+  flex: 1 1 auto;
+  min-height: 0;
+}
+
+.xslt-editor-wrap {
+  flex: 1 1 auto;
+  min-width: 0; /* allow editor to shrink */
+}
+
+.trace-panel {
+  width: 30%;
+  background: #fff;
+  border: 1px solid #ddd;
+  overflow: auto;
+}
+
+.trace-header {
+  padding: 0.25rem 0.5rem;
+  border-bottom: 1px solid #eee;
+  font-weight: bold;
+  background: #fafafa;
+}
+
+.trace-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.trace-name {
+  width: 30%;
+  vertical-align: top;
+  padding: 0.25rem;
+  font-family: monospace;
+  color: #333;
+  border-right: 1px solid #f0f0f0;
+}
+
+.trace-value {
+  vertical-align: top;
+  padding: 0.25rem;
+  white-space: pre-wrap;
+  word-break: break-word;
+  font-family: monospace;
+}
+
 
 .result {
   height: 40vh;

From de28a305df466cd6043d554273eef18f0390d181 Mon Sep 17 00:00:00 2001
From: Alexandre <alexandre.vazquez@gmail.com>
Date: Sat, 15 Nov 2025 22:26:25 +0100
Subject: [PATCH 5/5] version 0.2.0

---
 .gitignore                                    |    1 +
 .vscode/settings.json                         |    3 +
 CHANGELOG.md                                  |   13 +
 Makefile                                      |   19 +-
 README.md                                     |   14 +-
 backend/Dockerfile                            |   10 +-
 backend/ext/com/xsltplayground/Runner.java    | 2010 ++++++++++++++++-
 .../xsltplayground/ext/CustomFunctions.java   |    8 +-
 backend/src/main.go                           |  106 +-
 backend/src/main_test.go                      |   94 +
 docker-compose.local.yml                      |    1 +
 frontend/entrypoint.sh                        |   25 +-
 frontend/index.html                           |    1 +
 frontend/package-lock.json                    | 1461 +++++++++++-
 frontend/package.json                         |   11 +-
 frontend/public/favicon.ico                   |  Bin 0 -> 4286 bytes
 frontend/src/App.jsx                          | 1556 ++++++++++---
 frontend/src/App.test.jsx                     |   53 +
 frontend/src/BuyMeACoffee.jsx                 |   31 -
 frontend/src/components/BuyMeACoffee.jsx      |   42 +
 .../src/components/DataPipelineHeader.jsx     |   31 +
 .../components/DataPipelineHeader.test.jsx    |   36 +
 frontend/src/components/FeedbackWidget.jsx    |  249 ++
 frontend/src/components/TabsNav.jsx           |   64 +
 frontend/src/components/TabsNav.test.jsx      |   54 +
 frontend/src/logo.svg                         |   30 +-
 frontend/src/setupTests.js                    |    1 +
 frontend/src/style.css                        |  805 ++++++-
 frontend/vite.config.js                       |   12 +
 29 files changed, 6201 insertions(+), 540 deletions(-)
 create mode 100644 .vscode/settings.json
 create mode 100644 CHANGELOG.md
 create mode 100644 backend/src/main_test.go
 create mode 100644 frontend/public/favicon.ico
 create mode 100644 frontend/src/App.test.jsx
 delete mode 100644 frontend/src/BuyMeACoffee.jsx
 create mode 100644 frontend/src/components/BuyMeACoffee.jsx
 create mode 100644 frontend/src/components/DataPipelineHeader.jsx
 create mode 100644 frontend/src/components/DataPipelineHeader.test.jsx
 create mode 100644 frontend/src/components/FeedbackWidget.jsx
 create mode 100644 frontend/src/components/TabsNav.jsx
 create mode 100644 frontend/src/components/TabsNav.test.jsx
 create mode 100644 frontend/src/setupTests.js

diff --git a/.gitignore b/.gitignore
index cda135de..41229b5d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -196,5 +196,6 @@ cython_debug/
 frontend/node_modules
 frontend/dist
 backend/server
+backend/src/.gocache
 /config/credentials.json
 credentials.json
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 00000000..082b1943
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "makefile.configureOnOpen": false
+}
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
new file mode 100644
index 00000000..a343a669
--- /dev/null
+++ b/CHANGELOG.md
@@ -0,0 +1,13 @@
+# Changelog
+
+## v0.2.0
+
+- Expand the transformation up to three independent workspaces, persist each workspace state, and add import/export controls for sharing setups.
+- Surface the GitHub Pages news/blog link directly in the app header and show the running UI version with a deep link to this changelog.
+- Introduce workspace JSON export/import plus per-workspace trace, error and result retention.
+- New look & feel to provide a better experience 
+
+
+## v0.1.0
+
+- Initial release.
diff --git a/Makefile b/Makefile
index 29ec1171..c906780b 100644
--- a/Makefile
+++ b/Makefile
@@ -4,16 +4,24 @@ BACKEND_IMAGE=xslt-playground-backend
 FRONTEND_IMAGE=xslt-playground-frontend
 
 
-.PHONY: all backend-build frontend-build backend-image frontend-image compose-up compose-down
+.PHONY: all backend-build frontend-build backend-image frontend-image compose-up compose-down clean backend-test frontend-test test
 
-all: backend-build frontend-build backend-image frontend-image compose-up
+all: backend-test frontend-test backend-build frontend-build backend-image frontend-image compose-up
 
 backend-build:
 	cd $(BACKEND_DIR)/src && go mod tidy && go build -o ../server
 
+backend-test:
+	cd $(BACKEND_DIR)/src && GOCACHE=$$(pwd)/.gocache go test ./...
+
 frontend-build:
 	cd $(FRONTEND_DIR) && npm install && npm run build
 
+frontend-test:
+	cd $(FRONTEND_DIR) && npm install && npm run test
+
+test: backend-test frontend-test
+
 backend-image:
 	docker build --platform linux/amd64 -t $(BACKEND_IMAGE) $(BACKEND_DIR)
 		docker tag $(BACKEND_IMAGE):latest  ghcr.io/alexandrev/$(BACKEND_IMAGE):latest
@@ -27,3 +35,10 @@ compose-up:
 
 compose-down:
 	docker compose -f docker-compose.local.yml down
+
+clean:
+	-docker compose -f docker-compose.local.yml down --remove-orphans --rmi local
+	@if docker image inspect $(BACKEND_IMAGE):latest >/dev/null 2>&1; then docker image rm -f $(BACKEND_IMAGE):latest; fi
+	@if docker image inspect $(FRONTEND_IMAGE):latest >/dev/null 2>&1; then docker image rm -f $(FRONTEND_IMAGE):latest; fi
+	@if docker image inspect ghcr.io/alexandrev/$(BACKEND_IMAGE):latest >/dev/null 2>&1; then docker image rm -f ghcr.io/alexandrev/$(BACKEND_IMAGE):latest; fi
+	@if docker image inspect ghcr.io/alexandrev/$(FRONTEND_IMAGE):latest >/dev/null 2>&1; then docker image rm -f ghcr.io/alexandrev/$(FRONTEND_IMAGE):latest; fi
diff --git a/README.md b/README.md
index f0cb053b..9f43091a 100644
--- a/README.md
+++ b/README.md
@@ -2,6 +2,11 @@
 
 Your Lab for XSLT Transformation.
 
+## News & Releases
+
+- Follow updates on the GitHub Pages blog: [alexandrev.github.io/xslt-lab](https://alexandrev.github.io/xslt-lab/).
+- Review detailed changes in [CHANGELOG.md](https://github.com/alexandrev/xslt-lab/blob/main/CHANGELOG.md).
+
 ## Frontend
 
 The React/Vite frontend lives in `frontend/`. Use `npm install` inside that folder and run:
@@ -25,11 +30,15 @@ containerized version the URL is now read at **runtime** from environment
 variables so you can configure it directly in the pod.
 
 When `VITE_GO_PRO=true` the UI exposes additional features like Google
-authentication and multiple transformation tabs. For authentication you must
+authentication. For authentication you must
 provide Firebase configuration via `VITE_FIREBASE_CONFIG` containing the JSON
 object used by `initializeApp`.
 Set `VITE_GA_ID` to enable Google Analytics tracking.
 
+The playground keeps up to three independent workspaces (tabs). Each workspace
+persists its own inputs, trace output, errors and results, and you can export or
+import them as JSON files to share setups easily.
+
 ### Docker
 
 To build a container with the compiled frontend run:
@@ -70,7 +79,7 @@ its dependencies from `/opt/saxon/*`.
 The backend image also builds a small jar with custom Saxon extension
 functions. It gets copied to `/opt/saxon/custom-functions.jar` during the
 Docker build. You can call these from XSLT using the namespace
-`xmlns:tib="java:com.xsltplayground.ext.CustomFunctions"`. The jar exposes
+`xmlns:tib="http://www.tibco.com/bw/xslt/custom-functions"`. The jar exposes
 many helper functions such as `tib:uuid()`, `tib:timestamp()` and
 `tib:addToDate()`.
 
@@ -148,4 +157,3 @@ helm install xslt charts/xslt-playground
 # helm install xslt charts/xslt-playground --set firebase.enabled=false
 # helm install xslt charts/xslt-playground --set storage.enabled=false
 ```
-
diff --git a/backend/Dockerfile b/backend/Dockerfile
index c8c7e99a..88d84a3e 100644
--- a/backend/Dockerfile
+++ b/backend/Dockerfile
@@ -10,19 +10,15 @@ WORKDIR /app/src
 # Copiar los archivos
 COPY src/ .
 
-RUN rm -rf go.mod go.sum
-
 # Compilar el binario estático
-RUN go mod init xslt-playground && \
-    go get github.com/gin-gonic/gin && \
-    go mod tidy && \
+RUN go mod tidy && \
     go build -o server .
 
 # Build extension functions jar
 WORKDIR /app/ext
 COPY ext/ .
 RUN mkdir -p /tmp/saxon && \
-    curl -L -o /tmp/saxon/saxon-he.jar https://repo1.maven.org/maven2/net/sf/saxon/Saxon-HE/11.6/Saxon-HE-11.6.jar && \
+    curl -L -o /tmp/saxon/saxon-he.jar https://repo1.maven.org/maven2/net/sf/saxon/Saxon-HE/12.5/Saxon-HE-12.5.jar && \
     javac -cp /tmp/saxon/saxon-he.jar com/xsltplayground/ext/CustomFunctions.java com/xsltplayground/Runner.java && \
     jar cf custom-functions.jar com
 
@@ -43,7 +39,7 @@ COPY app.config .
 
 # Crear carpeta para Saxon y descargarlo
 RUN mkdir -p /opt/saxon && \
-    curl -L -o /opt/saxon/saxon-he.jar https://repo1.maven.org/maven2/net/sf/saxon/Saxon-HE/11.6/Saxon-HE-11.6.jar && \
+    curl -L -o /opt/saxon/saxon-he.jar https://repo1.maven.org/maven2/net/sf/saxon/Saxon-HE/12.5/Saxon-HE-12.5.jar && \
     curl -L -o /opt/saxon/xmlresolver.jar https://repo1.maven.org/maven2/org/xmlresolver/xmlresolver/4.5.0/xmlresolver-4.5.0.jar
 
 # Extension functions jar
diff --git a/backend/ext/com/xsltplayground/Runner.java b/backend/ext/com/xsltplayground/Runner.java
index 2f26b508..61f2d430 100644
--- a/backend/ext/com/xsltplayground/Runner.java
+++ b/backend/ext/com/xsltplayground/Runner.java
@@ -1,16 +1,71 @@
 package com.xsltplayground;
 
 import com.xsltplayground.ext.CustomFunctions;
+import net.sf.saxon.Controller;
+import net.sf.saxon.lib.ErrorReporter;
+import net.sf.saxon.om.GroundedValue;
+import net.sf.saxon.om.Item;
+import net.sf.saxon.om.NodeInfo;
+import net.sf.saxon.om.Sequence;
+import net.sf.saxon.om.SequenceIterator;
+import net.sf.saxon.om.StandardNames;
+import net.sf.saxon.om.StructuredQName;
 import net.sf.saxon.s9api.*;
+import net.sf.saxon.lib.FeatureKeys;
+import net.sf.saxon.s9api.QName;
+import net.sf.saxon.s9api.XmlProcessingError;
+import net.sf.saxon.value.EmptySequence;
+import net.sf.saxon.value.SequenceExtent;
 
 import javax.xml.transform.Source;
 import javax.xml.transform.stream.StreamSource;
 import java.io.File;
+import java.io.PrintStream;
+import java.io.StringWriter;
+import java.lang.reflect.InvocationHandler;
+import java.lang.reflect.Method;
+import java.lang.reflect.Proxy;
 import java.nio.file.Files;
+import java.util.ArrayDeque;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.Deque;
 import java.util.LinkedHashMap;
+import java.util.LinkedHashSet;
+import java.util.List;
 import java.util.Map;
+import java.util.Set;
+import java.util.IdentityHashMap;
+import java.util.concurrent.ConcurrentHashMap;
 
 public class Runner {
+    private static final boolean TRACE_DEBUG =
+            Boolean.parseBoolean(System.getProperty("xslt.trace.debug", "false")) ||
+                    "true".equalsIgnoreCase(System.getenv("XSLT_TRACE_DEBUG"));
+
+    private static final Set<Integer> loggedMapIds = ConcurrentHashMap.newKeySet();
+
+    private static void diag(String message) {
+        if (TRACE_DEBUG && message != null) {
+            System.err.println("TRACE_DIAG: " + message);
+        }
+    }
+
+    private static Set<Object> newIdentitySet() {
+        return Collections.newSetFromMap(new IdentityHashMap<>());
+    }
+
+    private static String preview(String value) {
+        if (value == null) {
+            return "null";
+        }
+        String singleLine = value.replace('\n', ' ').replace('\r', ' ');
+        if (singleLine.length() > 180) {
+            return singleLine.substring(0, 177) + "...";
+        }
+        return singleLine;
+    }
+
     public static void main(String[] args) {
         try {
             Map<String, String> rawParams = new LinkedHashMap<>();
@@ -57,69 +112,37 @@ public class Runner {
             }
 
             Processor proc = new Processor(false);
+            if (trace) {
+                proc.setConfigurationProperty(FeatureKeys.OPTIMIZATION_LEVEL, "0");
+            }
             CustomFunctions.registerAll(proc);
 
             XsltCompiler compiler = proc.newXsltCompiler();
-            XsltExecutable exec;
+            boolean instrumentationEnabled = false;
             if (trace) {
-                // Transform the stylesheet to inject xsl:message after each xsl:variable.
-                // Messages are written in a block form so backend can capture multiline XML:
-                // TRACE_VAR_START|name \n [serialized value or string value] \n TRACE_VAR_END
-                Processor iproc = new Processor(false);
-                XsltCompiler icomp = iproc.newXsltCompiler();
-                String instrumenter =
-                        "<xsl:stylesheet version=\"2.0\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
-                        "  <xsl:output method=\"xml\"/>" +
-                        "  <xsl:strip-space elements=\"*\"/>" +
-                        "  <xsl:template match=\"@*|node()\">" +
-                        "    <xsl:copy>" +
-                        "      <xsl:apply-templates select=\"@*|node()\"/>" +
-                        "    </xsl:copy>" +
-                        "  </xsl:template>" +
-                        // Instrument top-level variables
-                        "  <xsl:template match=\"/xsl:stylesheet/xsl:variable | /xsl:transform/xsl:variable\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
-                        "    <xsl:copy>" +
-                        "      <xsl:apply-templates select=\"@*|node()\"/>" +
-                        "    </xsl:copy>" +
-                        "    <xsl:message>" +
-                        "      <xsl:text>TRACE_VAR_START|</xsl:text>" +
-                        "      <xsl:value-of select=\"@name\"/>" +
-                        "      <xsl:text>&#10;</xsl:text>" +
-                        "      <xsl:element name=\"xsl:copy-of\" namespace=\"http://www.w3.org/1999/XSL/Transform\">" +
-                        "        <xsl:attribute name=\"select\">$<xsl:value-of select=\"@name\"/></xsl:attribute>" +
-                        "      </xsl:element>" +
-                        "      <xsl:text>&#10;TRACE_VAR_END</xsl:text>" +
-                        "    </xsl:message>" +
-                        "  </xsl:template>" +
-                        // Instrument non-top-level variables
-                        "  <xsl:template match=\"xsl:variable\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
-                        "    <xsl:copy>" +
-                        "      <xsl:apply-templates select=\"@*|node()\"/>" +
-                        "    </xsl:copy>" +
-                        "    <xsl:message>" +
-                        "      <xsl:text>TRACE_VAR_START|</xsl:text>" +
-                        "      <xsl:value-of select=\"@name\"/>" +
-                        "      <xsl:text>&#10;</xsl:text>" +
-                        "      <xsl:element name=\"xsl:copy-of\" namespace=\"http://www.w3.org/1999/XSL/Transform\">" +
-                        "        <xsl:attribute name=\"select\">$<xsl:value-of select=\"@name\"/></xsl:attribute>" +
-                        "      </xsl:element>" +
-                        "      <xsl:text>&#10;TRACE_VAR_END</xsl:text>" +
-                        "    </xsl:message>" +
-                        "  </xsl:template>" +
-                        "</xsl:stylesheet>";
+                ErrorReporter baseReporter = compiler.getErrorReporter();
+                compiler.setErrorReporter(new DeduplicatingErrorReporter(baseReporter));
+                instrumentationEnabled = enableCompileWithTracing(compiler);
+                if (TRACE_DEBUG) {
+                    System.err.println("TRACE_DEBUG instrumentation requested, enableCompileWithTracing=" + instrumentationEnabled);
+                }
+            }
 
-                XsltExecutable instExec = icomp.compile(new StreamSource(new java.io.StringReader(instrumenter)));
-                XsltTransformer instTr = instExec.load();
-                XdmNode styleDoc = iproc.newDocumentBuilder().build(new StreamSource(new File(xslPath)));
-                instTr.setInitialContextNode(styleDoc);
-                java.io.StringWriter sw = new java.io.StringWriter();
-                Serializer out = iproc.newSerializer(sw);
-                instTr.setDestination(out);
-                instTr.transform();
-                String instrumented = sw.toString();
-                exec = compiler.compile(new StreamSource(new java.io.StringReader(instrumented)));
-            } else {
+            XsltExecutable exec;
+            try {
                 exec = compiler.compile(new StreamSource(new File(xslPath)));
+            } catch (SaxonApiException e) {
+                if (trace && instrumentationEnabled) {
+                    System.err.println("Warning: trace instrumentation failed; recompiling without tracing. " + e.getMessage());
+                    instrumentationEnabled = false;
+                    compiler = proc.newXsltCompiler();
+                    exec = compiler.compile(new StreamSource(new File(xslPath)));
+                    if (TRACE_DEBUG) {
+                        System.err.println("TRACE_DEBUG recompilation without instrumentation");
+                    }
+                } else {
+                    throw e;
+                }
             }
             XsltTransformer transformer = exec.load();
 
@@ -150,6 +173,14 @@ public class Runner {
                 }
             }
 
+            boolean traceActive = trace && instrumentationEnabled;
+            if (TRACE_DEBUG) {
+                System.err.println("TRACE_DEBUG traceActive=" + traceActive);
+            }
+            if (traceActive) {
+                attachTraceListener(proc, transformer, System.err);
+            }
+
             if (sourcePath != null && !sourcePath.isEmpty()) {
                 Source src = new StreamSource(new File(sourcePath));
                 XdmNode doc = proc.newDocumentBuilder().build(src);
@@ -197,4 +228,1869 @@ public class Runner {
             System.exit(1);
         }
     }
+
+    private static boolean enableCompileWithTracing(XsltCompiler compiler) {
+        try {
+            compiler.setCompileWithTracing(true);
+            return true;
+        } catch (Throwable primary) {
+            try {
+                Method m = compiler.getClass().getMethod("setCompileWithTracing", boolean.class);
+                m.setAccessible(true);
+                m.invoke(compiler, true);
+                return true;
+            } catch (Exception ignored) {
+                return false;
+            }
+        }
+    }
+
+    private static final class DeduplicatingErrorReporter implements ErrorReporter {
+        private final ErrorReporter downstream;
+        private final Set<String> seen = ConcurrentHashMap.newKeySet();
+
+        DeduplicatingErrorReporter(ErrorReporter downstream) {
+            this.downstream = downstream;
+        }
+
+        @Override
+        public void report(XmlProcessingError error) {
+            if (error == null) {
+                return;
+            }
+            if (error.isWarning()) {
+                if (shouldSuppress(error)) {
+                    return;
+                }
+                String key = buildKey(error);
+                if (!seen.add(key)) {
+                    return;
+                }
+            }
+            if (downstream != null) {
+                downstream.report(error);
+            } else if (error.getMessage() != null) {
+                System.err.println(error.getMessage());
+            }
+        }
+
+        private boolean shouldSuppress(XmlProcessingError error) {
+            QName code = error.getErrorCode();
+            String local = code != null ? code.getLocalName() : null;
+            return "SXWN9026".equals(local);
+        }
+
+        private String buildKey(XmlProcessingError error) {
+            StringBuilder sb = new StringBuilder();
+            QName code = error.getErrorCode();
+            if (code != null) {
+                sb.append(code.toString());
+            }
+            sb.append('|');
+            if (error.getLocation() != null) {
+                sb.append(error.getLocation().toString());
+            }
+            sb.append('|');
+            String message = error.getMessage();
+            if (message != null) {
+                sb.append(message);
+            }
+            return sb.toString();
+        }
+    }
+
+    private static void attachTraceListener(Processor processor, XsltTransformer transformer, PrintStream sink) {
+        try {
+            Controller controller = transformer.getUnderlyingController();
+            if (controller == null) {
+                return;
+            }
+            ClassLoader loader = controller.getClass().getClassLoader();
+            Class<?> traceListenerClass = Class.forName("net.sf.saxon.lib.TraceListener", false, loader);
+            InvocationHandler handler = new VariableTraceListenerProxy(processor, transformer, sink);
+            Object listener = Proxy.newProxyInstance(loader, new Class<?>[]{traceListenerClass}, handler);
+
+            if (!invokeTraceHook(controller, "addTraceListener", traceListenerClass, listener)) {
+                invokeTraceHook(controller, "setTraceListener", traceListenerClass, listener);
+            }
+        } catch (Throwable ignored) {
+            // If tracing cannot be attached we simply carry on without trace output.
+        }
+    }
+
+    private static boolean invokeTraceHook(Controller controller, String methodName, Class<?> listenerClass, Object listener) {
+        try {
+            Method m = controller.getClass().getMethod(methodName, listenerClass);
+            m.setAccessible(true);
+            m.invoke(controller, listener);
+            return true;
+        } catch (Exception ignored) {
+            return false;
+        }
+    }
+
+    private static final class VariableTraceListenerProxy implements InvocationHandler {
+        private final Processor processor;
+        private final PrintStream out;
+        private final XsltTransformer transformer;
+        private final Deque<Frame> stack = new ArrayDeque<>();
+        private int debugCounter = 0;
+
+        VariableTraceListenerProxy(Processor processor, XsltTransformer transformer, PrintStream out) {
+            this.processor = processor;
+            this.transformer = transformer;
+            this.out = out;
+        }
+
+        @Override
+        public Object invoke(Object proxy, Method method, Object[] args) {
+            String name = method.getName();
+            if ("close".equals(name)) {
+                stack.clear();
+                return null;
+            }
+            if ("enter".equals(name)) {
+                Object info = args != null && args.length > 0 ? args[0] : null;
+                Object properties = args != null && args.length > 1 ? args[1] : null;
+                Object context = args != null && args.length > 2 ? args[2] : null;
+                debugEvent("enter", info);
+                handleEnter(info, properties, context);
+                return null;
+            }
+            if ("leave".equals(name)) {
+                Object info = args != null && args.length > 0 ? args[0] : null;
+                Object properties = args != null && args.length > 1 ? args[1] : null;
+                Object context = args != null && args.length > 2 ? args[2] : null;
+                debugEvent("leave", info);
+                handleLeave(info, properties, context);
+                return null;
+            }
+            if ("open".equals(name) || "startCurrentItem".equals(name) || "endCurrentItem".equals(name)) {
+                return null;
+            }
+            return null;
+        }
+
+        private void handleEnter(Object instructionInfo, Object properties, Object context) {
+            if (!isVariable(instructionInfo)) {
+                return;
+            }
+            Frame frame = new Frame();
+            frame.instruction = instructionInfo;
+            frame.name = getVariableName(instructionInfo);
+            frame.context = context;
+            frame.properties = properties;
+            stack.push(frame);
+            printDebug("enter", frame.name);
+        }
+
+        private void handleLeave(Object instructionInfo, Object properties, Object context) {
+            if (!isVariable(instructionInfo)) {
+                return;
+            }
+            Frame frame = stack.isEmpty() ? null : stack.pop();
+            if (frame == null) {
+                frame = new Frame();
+                frame.instruction = instructionInfo;
+            }
+            if (frame.name == null) {
+                frame.name = getVariableName(instructionInfo);
+            }
+            Object effectiveProperties = properties != null ? properties : frame.properties;
+            if (context == null) {
+                context = frame.context;
+            }
+            if (context == null && effectiveProperties instanceof Map) {
+                context = extractContextFromProperties((Map<?, ?>) effectiveProperties);
+            }
+            if (context != null) {
+                Runner.diag("handleLeave context class=" + context.getClass().getName());
+            } else {
+                Runner.diag("handleLeave context is null");
+            }
+            if (effectiveProperties instanceof Map) {
+                logContextMap((Map<?, ?>) effectiveProperties);
+            }
+            StructuredQName name = frame.name;
+            if (name == null) {
+                return;
+            }
+
+            TraceCapture capture = extractTraceValue(instructionInfo, context, effectiveProperties, name);
+            String displayValue = capture.sequence != null ? formatSequence(capture.sequence) : null;
+            if ((displayValue == null || displayValue.isEmpty()) && capture.fallback != null) {
+                displayValue = capture.fallback;
+            }
+            if (displayValue == null) {
+                displayValue = "";
+            }
+
+            Runner.diag("emit variable " + name.getDisplayName() + " value length=" + displayValue.length());
+
+            out.println("TRACE_VAR_START|" + name.getDisplayName());
+            if (!displayValue.isEmpty()) {
+                out.println(displayValue);
+            }
+            out.println("TRACE_VAR_END");
+            printDebug("leave", name);
+        }
+
+        private TraceCapture extractTraceValue(Object instructionInfo, Object context, Object properties, StructuredQName name) {
+            TraceCapture capture = new TraceCapture();
+            String displayName = name != null ? name.getDisplayName() : "(unknown)";
+            Object candidate = firstCandidate(instructionInfo);
+            if (candidate != null) {
+                TraceCapture candidateCapture = captureFromResult(candidate, context);
+                if (candidateCapture.sequence != null) {
+                    Runner.diag("firstCandidate sequence for " + displayName + " via " + candidate.getClass().getName());
+                    capture.sequence = materialize(candidateCapture.sequence);
+                    return capture;
+                }
+                if (candidateCapture.fallback != null) {
+                    Runner.diag("firstCandidate fallback for " + displayName + " = " + preview(candidateCapture.fallback));
+                    capture.fallback = candidateCapture.fallback;
+                }
+            }
+
+            Integer slot = extractSlot(instructionInfo);
+            if (slot != null) {
+                Sequence seq = evaluateSlot(context, slot.intValue());
+                if (seq != null) {
+                    Runner.diag("evaluateSlot(" + slot + ") sequence for " + displayName);
+                    capture.sequence = materialize(seq);
+                    return capture;
+                } else {
+                    Runner.diag("evaluateSlot(" + slot + ") returned null for " + displayName);
+                }
+            }
+
+            if (name != null) {
+                TraceCapture paramCapture = captureParameterValue(name);
+                if (paramCapture.sequence != null) {
+                    Runner.diag("transformer parameter hit for " + name.getDisplayName());
+                    capture.sequence = materialize(paramCapture.sequence);
+                    return capture;
+                }
+                if (capture.fallback == null && paramCapture.fallback != null) {
+                    Runner.diag("transformer parameter fallback for " + name.getDisplayName() + " = " + preview(paramCapture.fallback));
+                    capture.fallback = paramCapture.fallback;
+                }
+                TraceCapture byName = evaluateByName(context, properties, name);
+                if (byName.sequence != null) {
+                    Runner.diag("evaluateByName sequence for " + displayName);
+                    capture.sequence = materialize(byName.sequence);
+                    return capture;
+                }
+                if (capture.fallback == null && byName.fallback != null) {
+                    Runner.diag("evaluateByName fallback for " + displayName + " = " + preview(byName.fallback));
+                    capture.fallback = byName.fallback;
+                }
+                TraceCapture controllerCapture = evaluateFromController(name, context);
+                if (controllerCapture.sequence != null) {
+                    Runner.diag("controller lookup sequence for " + displayName);
+                    capture.sequence = materialize(controllerCapture.sequence);
+                    return capture;
+                }
+                if (capture.fallback == null && controllerCapture.fallback != null) {
+                    Runner.diag("controller lookup fallback for " + displayName + " = " + preview(controllerCapture.fallback));
+                    capture.fallback = controllerCapture.fallback;
+                }
+            }
+
+            Object binding = extractBinding(instructionInfo);
+            if (binding != null) {
+                TraceCapture fromBinding = evaluateBinding(context, binding, newIdentitySet());
+                if (fromBinding.sequence != null) {
+                    Runner.diag("evaluateBinding sequence for " + displayName + " using " + binding.getClass().getName());
+                    capture.sequence = materialize(fromBinding.sequence);
+                    return capture;
+                }
+                if (fromBinding.fallback != null) {
+                    Runner.diag("evaluateBinding fallback for " + displayName + " = " + preview(fromBinding.fallback));
+                }
+                mergeCapture(capture, fromBinding);
+            }
+
+            TraceCapture direct = evaluateDirect(instructionInfo, context);
+            if (direct.sequence != null) {
+                Runner.diag("evaluateDirect sequence for " + displayName);
+                capture.sequence = materialize(direct.sequence);
+                return capture;
+            }
+            if (capture.fallback == null && direct.fallback != null) {
+                Runner.diag("evaluateDirect fallback for " + displayName + " = " + preview(direct.fallback));
+                capture.fallback = direct.fallback;
+            }
+
+            if (capture.sequence == null && capture.fallback == null && candidate != null) {
+                capture.fallback = candidate.toString();
+                Runner.diag("final fallback uses candidate.toString for " + displayName + " = " + preview(capture.fallback));
+            }
+            Runner.diag("capture result for " + displayName + " -> sequence="
+                    + (capture.sequence != null) + " fallback="
+                    + (capture.fallback != null ? preview(capture.fallback) : "null"));
+            return capture;
+        }
+
+        private TraceCapture evaluateDirect(Object instructionInfo, Object context) {
+            TraceCapture capture = new TraceCapture();
+            if (instructionInfo == null) {
+                return capture;
+            }
+
+            Sequence evaluatorSeq = evaluateEvaluatorObject(getProperty(instructionInfo, "evaluator"), context);
+            if (evaluatorSeq != null) {
+                capture.sequence = evaluatorSeq;
+                return capture;
+            }
+
+            Sequence getterSeq = evaluateEvaluatorObject(invoke(instructionInfo, "getEvaluator"), context);
+            if (getterSeq != null) {
+                capture.sequence = getterSeq;
+                return capture;
+            }
+
+            Object[] params = context != null ? new Object[]{context} : new Object[0];
+            String[] methodNames = new String[]{
+                    "iterate",
+                    "evaluateVariable",
+                    "evaluateLocalVariable",
+                    "evaluate",
+                    "getSelectValue",
+                    "getSelectExpression"
+            };
+            for (String name : methodNames) {
+                Object result = invoke(instructionInfo, name, params);
+                if (result == null && context != null) {
+                    result = invoke(instructionInfo, name);
+                }
+                Sequence seq = toSequence(result);
+                if (seq != null) {
+                    capture.sequence = seq;
+                    return capture;
+                }
+                if (result instanceof SequenceIterator) {
+                    Sequence materialized = materializeIterator((SequenceIterator) result);
+                    if (materialized != null) {
+                        capture.sequence = materialized;
+                        return capture;
+                    }
+                }
+                if (result instanceof Item) {
+                    capture.fallback = formatItem((Item) result);
+                    return capture;
+                }
+                Sequence evalSeq = evaluateEvaluatorObject(result, context);
+                if (evalSeq != null) {
+                    capture.sequence = evalSeq;
+                    return capture;
+                }
+            }
+
+            Object single = invoke(instructionInfo, "evaluateItem", params);
+            if (single == null && context != null) {
+                single = invoke(instructionInfo, "evaluateItem");
+            }
+            if (single instanceof Item) {
+                Item item = (Item) single;
+                Sequence seq = toSequence(item);
+                if (seq != null) {
+                    capture.sequence = seq;
+                    return capture;
+                }
+                capture.fallback = formatItem(item);
+                return capture;
+            }
+
+            return capture;
+        }
+
+        private Sequence evaluateEvaluatorObject(Object evaluator, Object context) {
+            if (evaluator == null) {
+                return null;
+            }
+            Object[] params = context != null ? new Object[]{context} : new Object[0];
+            Object evaluated = invoke(evaluator, "evaluate", params);
+            Sequence seq = toSequence(evaluated);
+            if (seq != null) {
+                return seq;
+            }
+            evaluated = invoke(evaluator, "materialize", params);
+            seq = toSequence(evaluated);
+            if (seq != null) {
+                return seq;
+            }
+            Object iterator = invoke(evaluator, "iterate", params);
+            if (iterator instanceof SequenceIterator) {
+                return materializeIterator((SequenceIterator) iterator);
+            }
+            if (iterator != null) {
+                seq = toSequence(iterator);
+                if (seq != null) {
+                    return seq;
+                }
+            }
+            return null;
+        }
+
+        private Sequence evaluateSlot(Object context, int slot) {
+            Object current = context;
+            Object value = invoke(current, "evaluateLocalVariable", slot);
+            if (value == null) {
+                value = invoke(current, "getLocalVariable", slot);
+            }
+            if (value == null) {
+                value = invoke(current, "getStackFrameValue", slot);
+            }
+            if (value == null) {
+                Object controller = invoke(current, "getController");
+                if (controller != null) {
+                    value = invoke(controller, "evaluateLocalVariable", slot);
+                    if (value == null) {
+                        value = invoke(controller, "getLocalVariable", slot);
+                    }
+                }
+            }
+            return toSequence(value);
+        }
+
+        private TraceCapture evaluateByName(Object context, Object properties, StructuredQName name) {
+            TraceCapture aggregate = new TraceCapture();
+            if (context == null || name == null) {
+                // Continue scanning property targets even if context is null
+                if (!(properties instanceof Map)) {
+                    return aggregate;
+                }
+            }
+            Object[] variants = nameVariants(name);
+            Object[] targets = contextTargets(context, properties);
+            String[] methodNames = new String[]{
+                    "evaluateVariable",
+                    "evaluateGlobalVariable",
+                    "getVariable",
+                    "getGlobalVariable",
+                    "getGlobalVariableValue",
+                    "getXPathVariable",
+                    "obtainVariable",
+                    "resolveVariable",
+                    "getParameter",
+                    "get"
+            };
+            for (Object target : targets) {
+                if (target == null) {
+                    continue;
+                }
+                Runner.diag("evaluateByName inspecting target " + target.getClass().getName() + " for " + name.getDisplayName());
+                for (String method : methodNames) {
+                    for (Object variant : variants) {
+                        Object result = invoke(target, method, variant);
+                        TraceCapture candidate = captureFromResult(result, context);
+                        if (candidate.sequence != null) {
+                            return candidate;
+                        }
+                        mergeCapture(aggregate, candidate);
+                    }
+                }
+                TraceCapture fromCollections = captureFromParameterCollections(target, name, context);
+                if (fromCollections.sequence != null) {
+                    Runner.diag("evaluateByName collections hit sequence for " + name.getDisplayName());
+                    return fromCollections;
+                }
+                if (fromCollections.fallback != null) {
+                    Runner.diag("evaluateByName collections fallback for " + name.getDisplayName() + " = " + preview(fromCollections.fallback));
+                }
+                mergeCapture(aggregate, fromCollections);
+            }
+            return aggregate;
+        }
+
+        private Object extractBinding(Object instructionInfo) {
+            if (instructionInfo == null) {
+                return null;
+            }
+            String[] methodNames = new String[]{
+                    "getBinding",
+                    "getVariableBinding",
+                    "getBindingInformation",
+                    "getBindingNode",
+                    "getBindingObject"
+            };
+            for (String method : methodNames) {
+                Object binding = invoke(instructionInfo, method);
+                if (binding != null) {
+                    return binding;
+                }
+            }
+            Object prop = getProperty(instructionInfo, "binding");
+            if (prop != null) {
+                return prop;
+            }
+            return null;
+        }
+
+        private TraceCapture evaluateBinding(Object context, Object binding, Set<Object> seen) {
+            TraceCapture aggregate = new TraceCapture();
+            if (binding == null) {
+                return aggregate;
+            }
+            if (seen != null && !seen.add(binding)) {
+                Runner.diag("evaluateBinding already visited " + binding.getClass().getName());
+                return aggregate;
+            }
+            Runner.diag("evaluateBinding inspecting " + binding.getClass().getName());
+            Object controller = context != null ? invoke(context, "getController") : null;
+            if (controller == null) {
+                controller = invoke(binding, "getController");
+            }
+            if (controller == null && transformer != null) {
+                controller = transformer.getUnderlyingController();
+            }
+            if (controller != null) {
+                Runner.diag("evaluateBinding using controller " + controller.getClass().getName());
+            } else {
+                Runner.diag("evaluateBinding no controller available for binding " + binding.getClass().getName());
+            }
+            Object packageData = invoke(binding, "getPackageData");
+            Object bindery = null;
+            if (controller != null) {
+                if (packageData == null) {
+                    Object executable = invoke(controller, "getExecutable");
+                    packageData = executable != null ? invoke(executable, "getTopLevelPackage") : null;
+                }
+                if (packageData != null) {
+                    bindery = invoke(controller, "getBindery", packageData);
+                }
+                if (bindery == null) {
+                    bindery = invoke(controller, "getBindery");
+                }
+            }
+            if (bindery != null) {
+                TraceCapture fromBindery = captureFromResult(invoke(bindery, "getGlobalVariableValue", binding), context, seen);
+                if (fromBindery.sequence != null) {
+                    Runner.diag("evaluateBinding bindery provided sequence for " + binding.getClass().getName());
+                    return fromBindery;
+                }
+                if (fromBindery.fallback != null) {
+                    Runner.diag("evaluateBinding bindery fallback " + preview(fromBindery.fallback));
+                }
+                mergeCapture(aggregate, fromBindery);
+            }
+            if (controller != null) {
+                TraceCapture fromController = captureFromResult(invoke(controller, "evaluateGlobalVariable", binding), context, seen);
+                if (fromController.sequence != null) {
+                    Runner.diag("evaluateBinding controller provided sequence for " + binding.getClass().getName());
+                    return fromController;
+                }
+                if (fromController.fallback != null) {
+                    Runner.diag("evaluateBinding controller fallback " + preview(fromController.fallback));
+                }
+                mergeCapture(aggregate, fromController);
+            }
+            TraceCapture bindingValue = captureFromResult(invoke(binding, "getValue"), context, seen);
+            if (bindingValue.sequence != null) {
+                Runner.diag("evaluateBinding direct getValue sequence for " + binding.getClass().getName());
+                return bindingValue;
+            }
+            if (bindingValue.fallback != null) {
+                Runner.diag("evaluateBinding getValue fallback " + preview(bindingValue.fallback));
+            }
+            mergeCapture(aggregate, bindingValue);
+
+            String[] methodNames = new String[]{
+                    "evaluate",
+                    "evaluateVariable",
+                    "evaluateLocalVariable",
+                    "getSelectValue",
+                    "call",
+                    "value"
+            };
+            for (String method : methodNames) {
+                if (context != null) {
+                    TraceCapture candidate = captureFromResult(invoke(binding, method, context), context, seen);
+                    if (candidate.sequence != null) {
+                        return candidate;
+                    }
+                    mergeCapture(aggregate, candidate);
+                }
+                TraceCapture candidate = captureFromResult(invoke(binding, method), context, seen);
+                if (candidate.sequence != null) {
+                    return candidate;
+                }
+                mergeCapture(aggregate, candidate);
+            }
+            return aggregate;
+        }
+
+        private Object[] contextTargets(Object context, Object properties) {
+            LinkedHashSet<Object> targets = new LinkedHashSet<>();
+            if (context != null) {
+                targets.add(context);
+                Object controller = invoke(context, "getController");
+                if (controller != null) {
+                    targets.add(controller);
+                    Object executable = invoke(controller, "getExecutable");
+                    Object packageData = executable != null ? invoke(executable, "getTopLevelPackage") : null;
+                    Object bindery = null;
+                    if (packageData != null) {
+                        bindery = invoke(controller, "getBindery", packageData);
+                    }
+                    if (bindery == null) {
+                        bindery = invoke(controller, "getBindery");
+                    }
+                    if (bindery != null) {
+                        targets.add(bindery);
+                    }
+                }
+                Object major = invoke(context, "getMajorContext");
+                if (major != null) {
+                    targets.add(major);
+                }
+                Object stackFrame = invoke(context, "getStackFrame");
+                if (stackFrame != null) {
+                    targets.add(stackFrame);
+                }
+                Object localParams = invoke(context, "getLocalParameters");
+                if (localParams != null) {
+                    targets.add(localParams);
+                }
+            }
+            if (properties instanceof Map) {
+                Map<?, ?> map = (Map<?, ?>) properties;
+                for (Object value : map.values()) {
+                    if (value != null) {
+                        targets.add(value);
+                    }
+                }
+            }
+            if (transformer != null) {
+                Object controller = transformer.getUnderlyingController();
+                if (controller != null) {
+                    targets.add(controller);
+                }
+            }
+            return targets.toArray();
+        }
+
+        private Object[] nameVariants(StructuredQName name) {
+            if (name == null) {
+                return new Object[0];
+            }
+            LinkedHashSet<Object> variants = new LinkedHashSet<>();
+            variants.add(name);
+            String uri = name.getURI();
+            String local = name.getLocalPart();
+            String prefix = name.getPrefix();
+            if (uri == null) {
+                uri = "";
+            }
+            if (local == null) {
+                local = "";
+            }
+            try {
+                variants.add(new net.sf.saxon.s9api.QName(prefix == null ? "" : prefix, uri, local));
+            } catch (Exception ignored) {
+                // ignore
+            }
+            try {
+                variants.add(new javax.xml.namespace.QName(uri, local));
+            } catch (Exception ignored) {
+                // ignore
+            }
+            if (!uri.isEmpty()) {
+                variants.add("{" + uri + "}" + local);
+                variants.add("Q{" + uri + "}" + local);
+            }
+            String display = name.getDisplayName();
+            if (display != null && !display.isEmpty()) {
+                variants.add(display);
+            }
+            if (prefix != null && !prefix.isEmpty() && !local.isEmpty()) {
+                variants.add(prefix + ":" + local);
+            }
+            if (!local.isEmpty()) {
+                variants.add(local);
+            }
+            return variants.toArray();
+        }
+
+        private TraceCapture captureFromParameterCollections(Object target, StructuredQName name, Object context) {
+            TraceCapture aggregate = new TraceCapture();
+            if (target == null || name == null) {
+                return aggregate;
+            }
+            Object[] variants = nameVariants(name);
+            Object[] collections = new Object[]{
+                    target instanceof Map ? target : null,
+                    invoke(target, "getParameters"),
+                    invoke(target, "getLocalParameters"),
+                    invoke(target, "getGlobalParameters")
+            };
+            for (Object collection : collections) {
+                if (collection == null) {
+                    continue;
+                }
+                if (collection instanceof Map) {
+                    Map<?, ?> map = (Map<?, ?>) collection;
+                    logMapSample(map);
+                    Object introspectedValue = lookupMapValue(map, name, variants);
+                    boolean introspectedConsumed = false;
+                    for (Object variant : variants) {
+                        Runner.diag("captureFromParameterCollections map lookup variant=" + variant + " class=" + map.getClass().getName());
+                        Object value = map.get(variant);
+                        if (value != null) {
+                            Runner.diag("captureFromParameterCollections map hit class=" + value.getClass().getName());
+                        } else {
+                            Runner.diag("captureFromParameterCollections map hit null for variant=" + variant);
+                        }
+                        TraceCapture candidate = captureFromResult(value, context);
+                        if (candidate.sequence != null) {
+                            return candidate;
+                        }
+                        mergeCapture(aggregate, candidate);
+                        if (value == null && variant instanceof CharSequence) {
+                            Object alt = map.get(variant.toString());
+                            if (alt != null) {
+                                Runner.diag("captureFromParameterCollections map alt hit class=" + alt.getClass().getName());
+                            } else {
+                                Runner.diag("captureFromParameterCollections map alt hit null");
+                            }
+                            candidate = captureFromResult(alt, context);
+                            if (candidate.sequence != null) {
+                                return candidate;
+                            }
+                            mergeCapture(aggregate, candidate);
+                        }
+                        if (value == null && !introspectedConsumed && introspectedValue != null) {
+                            Runner.diag("captureFromParameterCollections introspection hit class=" + introspectedValue.getClass().getName());
+                            TraceCapture introspectedCapture = captureFromResult(introspectedValue, context);
+                            if (introspectedCapture.sequence != null) {
+                                return introspectedCapture;
+                            }
+                            mergeCapture(aggregate, introspectedCapture);
+                            introspectedConsumed = true;
+                        }
+                    }
+                } else {
+                    for (Object variant : variants) {
+                        Object value = invoke(collection, "get", variant);
+                        Runner.diag("captureFromParameterCollections accessor lookup variant=" + variant + " target=" + collection.getClass().getName());
+                        if (value != null) {
+                            Runner.diag("captureFromParameterCollections accessor hit class=" + value.getClass().getName());
+                        } else {
+                            Runner.diag("captureFromParameterCollections accessor hit null");
+                        }
+                        TraceCapture candidate = captureFromResult(value, context);
+                        if (candidate.sequence != null) {
+                            return candidate;
+                        }
+                        mergeCapture(aggregate, candidate);
+                    }
+                }
+            }
+            return aggregate;
+        }
+
+        private TraceCapture captureFromResult(Object result, Object context) {
+            return captureFromResult(result, context, newIdentitySet());
+        }
+
+        private TraceCapture captureFromResult(Object result, Object context, Set<Object> seen) {
+            TraceCapture capture = new TraceCapture();
+            if (result == null) {
+                return capture;
+            }
+            if (result instanceof TraceCapture) {
+                TraceCapture existing = (TraceCapture) result;
+                capture.sequence = existing.sequence;
+                capture.fallback = existing.fallback;
+                Runner.diag("captureFromResult reused TraceCapture sequence=" + (capture.sequence != null));
+                return capture;
+            }
+            Sequence seq = evaluateObjectValue(result, context);
+            if (seq != null) {
+                Runner.diag("captureFromResult materialized sequence from " + result.getClass().getName());
+                capture.sequence = seq;
+                return capture;
+            }
+            if (isInstanceOf(result, "net.sf.saxon.s9api.XdmValue")) {
+                Object underlying = invoke(result, "getUnderlyingValue");
+                Sequence underlyingSeq = evaluateObjectValue(underlying, context, 0, seen != null ? seen : newIdentitySet());
+                if (underlyingSeq != null) {
+                    Runner.diag("captureFromResult unwrapped XdmValue to sequence for " + result.getClass().getName());
+                    capture.sequence = underlyingSeq;
+                    return capture;
+                }
+                capture.fallback = result.toString();
+                Runner.diag("captureFromResult fallback from XdmValue " + preview(capture.fallback));
+                return capture;
+            }
+            if (isBinding(result)) {
+                Runner.diag("captureFromResult evaluating Binding instance " + result.getClass().getName());
+                TraceCapture bindingCapture = evaluateBinding(context, result, seen != null ? seen : newIdentitySet());
+                mergeCapture(capture, bindingCapture);
+                return capture;
+            }
+            if (result instanceof Item) {
+                capture.fallback = formatItem((Item) result);
+                Runner.diag("captureFromResult formatted Item fallback " + preview(capture.fallback));
+                return capture;
+            }
+            if (result instanceof Iterable) {
+                Sequence seqFromIterable = sequenceFromIterable((Iterable<?>) result);
+                if (seqFromIterable != null) {
+                    Runner.diag("captureFromResult built sequence from Iterable " + result.getClass().getName());
+                    capture.sequence = seqFromIterable;
+                    return capture;
+                }
+                StringBuilder sb = new StringBuilder();
+                boolean first = true;
+                for (Object o : (Iterable<?>) result) {
+                    TraceCapture nested = captureFromResult(o, context);
+                    String val = nested.sequence != null ? formatSequence(nested.sequence) : nested.fallback;
+                    if (val == null || val.isEmpty()) {
+                        continue;
+                    }
+                    if (!first) {
+                        sb.append('\n');
+                    }
+                    first = false;
+                    sb.append(val);
+                }
+                capture.fallback = sb.toString();
+                Runner.diag("captureFromResult fallback aggregated Iterable " + preview(capture.fallback));
+                return capture;
+            }
+            if (result != null && result.getClass().isArray()) {
+                Sequence seqFromArray = sequenceFromArray(result);
+                if (seqFromArray != null) {
+                    Runner.diag("captureFromResult built sequence from array " + result.getClass().getName());
+                    capture.sequence = seqFromArray;
+                    return capture;
+                }
+            }
+            capture.fallback = result.toString();
+            Runner.diag("captureFromResult generic fallback " + preview(capture.fallback));
+            return capture;
+        }
+
+        private final Set<String> loggedParameterNames = ConcurrentHashMap.newKeySet();
+
+        private void logContextMap(Map<?, ?> map) {
+            if (!TRACE_DEBUG || map == null) {
+                return;
+            }
+            int id = System.identityHashCode(map);
+            if (!loggedMapIds.add(id)) {
+                return;
+            }
+            StringBuilder sb = new StringBuilder();
+            int count = 0;
+            int size = map.size();
+            for (Map.Entry<?, ?> entry : map.entrySet()) {
+                if (count++ >= 6) {
+                    break;
+                }
+                Object key = entry.getKey();
+                Object value = entry.getValue();
+                sb.append(describeKey(key)).append('=');
+                if (value == null) {
+                    sb.append("null");
+                } else {
+                    sb.append(value.getClass().getName());
+                    if (value instanceof CharSequence) {
+                        sb.append("(\"").append(preview(value.toString())).append("\")");
+                    }
+                    if (value instanceof Map) {
+                        sb.append("[map]");
+                    }
+                }
+                sb.append("; ");
+            }
+            Runner.diag("context map size=" + size + " entries=" + sb);
+        }
+
+        private Object extractContextFromProperties(Map<?, ?> map) {
+            return extractContextFromProperties(map, newIdentitySet());
+        }
+
+        private Object extractContextFromProperties(Map<?, ?> map, Set<Object> seen) {
+            if (map == null) {
+                return null;
+            }
+            if (seen != null && !seen.add(map)) {
+                return null;
+            }
+            Object[] candidateKeys = new Object[]{
+                    "context",
+                    "xpathContext",
+                    "XPathContext",
+                    "majorContext",
+                    "contextObject"
+            };
+            for (Object key : candidateKeys) {
+                Object value = map.get(key);
+                if (isXPathContext(value)) {
+                    return value;
+                }
+            }
+            for (Object value : map.values()) {
+                if (isXPathContext(value)) {
+                    return value;
+                }
+                if (value instanceof Map) {
+                    Object nested = extractContextFromProperties((Map<?, ?>) value, seen);
+                    if (isXPathContext(nested)) {
+                        return nested;
+                    }
+                }
+            }
+            return null;
+        }
+
+        private boolean isXPathContext(Object value) {
+            return isInstanceOf(value, "net.sf.saxon.expr.XPathContext");
+        }
+
+        private TraceCapture captureParameterValue(StructuredQName name) {
+            TraceCapture capture = new TraceCapture();
+            if (transformer == null || name == null) {
+                return capture;
+            }
+            try {
+                net.sf.saxon.s9api.QName qName = new net.sf.saxon.s9api.QName(
+                        name.getPrefix() == null ? "" : name.getPrefix(),
+                        name.getURI() == null ? "" : name.getURI(),
+                        name.getLocalPart());
+                XdmValue paramValue = transformer.getParameter(qName);
+                if (paramValue != null) {
+                    Runner.diag("captureParameterValue transformer hit " + qName.getClarkName());
+                    return captureFromResult(paramValue, null);
+                }
+            } catch (Exception e) {
+                Runner.diag("captureParameterValue error: " + e.getMessage());
+            }
+            return capture;
+        }
+
+        private TraceCapture evaluateFromController(StructuredQName name, Object context) {
+            TraceCapture aggregate = new TraceCapture();
+            if (transformer == null || name == null) {
+                return aggregate;
+            }
+            Object controller = transformer.getUnderlyingController();
+            if (controller == null) {
+                return aggregate;
+            }
+            Runner.diag("evaluateFromController using controller=" + controller.getClass().getName());
+            Object executable = invoke(controller, "getExecutable");
+            Object packageData = executable != null ? invoke(executable, "getTopLevelPackage") : null;
+            Object bindery = null;
+            if (packageData != null) {
+                bindery = invoke(controller, "getBindery", packageData);
+            }
+            if (bindery == null) {
+                bindery = invoke(controller, "getBindery");
+            }
+
+            Object effectiveContext = context;
+            if (effectiveContext == null) {
+                effectiveContext = invoke(controller, "newXPathContext");
+            }
+
+            if (packageData != null) {
+                Object globalList = invoke(packageData, "getGlobalVariableList");
+                if (globalList instanceof Iterable) {
+                    for (Object varObj : (Iterable<?>) globalList) {
+                        if (varObj == null) {
+                            continue;
+                        }
+                        StructuredQName varName = toStructuredQName(invoke(varObj, "getVariableQName"));
+                        if (varName == null) {
+                            varName = toStructuredQName(invoke(varObj, "getObjectName"));
+                        }
+                        if (varName == null || !varName.equals(name)) {
+                            continue;
+                        }
+                        Runner.diag("evaluateFromController matched global variable class=" + varObj.getClass().getName());
+                        if (bindery != null) {
+                            TraceCapture byValue = captureFromResult(invoke(bindery, "getGlobalVariableValue", varObj), effectiveContext);
+                            if (byValue.sequence != null) {
+                                Runner.diag("bindery getGlobalVariableValue match for " + name.getDisplayName());
+                                return byValue;
+                            }
+                            mergeCapture(aggregate, byValue);
+
+                            Object slotObj = invoke(varObj, "getBinderySlotNumber");
+                            if (slotObj instanceof Number) {
+                                int slot = ((Number) slotObj).intValue();
+                                TraceCapture bySlot = captureFromResult(invoke(bindery, "getGlobalVariable", slot), effectiveContext);
+                                if (bySlot.sequence != null) {
+                                    Runner.diag("bindery getGlobalVariable slot=" + slot + " match for " + name.getDisplayName());
+                                    return bySlot;
+                                }
+                                mergeCapture(aggregate, bySlot);
+                            }
+                        }
+                        TraceCapture evaluated = captureFromResult(invoke(varObj, "evaluateVariable", effectiveContext), effectiveContext);
+                        if (evaluated.sequence != null) {
+                            Runner.diag("evaluateFromController evaluateVariable hit for " + name.getDisplayName());
+                            return evaluated;
+                        }
+                        mergeCapture(aggregate, evaluated);
+                    }
+                }
+            }
+
+            if (executable != null) {
+                Object paramMap = invoke(executable, "getGlobalParameters");
+                if (paramMap instanceof Map) {
+                    Map<?, ?> map = (Map<?, ?>) paramMap;
+                    Object candidate = map.get(name);
+                    if (candidate == null) {
+                        candidate = map.get(name.getStructuredQName());
+                    }
+                    if (candidate == null) {
+                        candidate = map.get(name.getDisplayName());
+                    }
+                    if (candidate != null) {
+                        Runner.diag("evaluateFromController global parameter class=" + candidate.getClass().getName());
+                        TraceCapture fromParam = evaluateBinding(effectiveContext, candidate, newIdentitySet());
+                        if (fromParam.sequence != null) {
+                            return fromParam;
+                        }
+                        mergeCapture(aggregate, fromParam);
+                    }
+                }
+            }
+
+            return aggregate;
+        }
+
+        private void logMapSample(Map<?, ?> map) {
+            if (!TRACE_DEBUG || map == null) {
+                return;
+            }
+            int id = System.identityHashCode(map);
+            if (!loggedMapIds.add(id)) {
+                return;
+            }
+            StringBuilder sb = new StringBuilder();
+            int count = 0;
+            for (Map.Entry<?, ?> entry : map.entrySet()) {
+                if (count++ >= 5) {
+                    break;
+                }
+                Object key = entry.getKey();
+                Object value = entry.getValue();
+                sb.append(describeKey(key));
+                sb.append(" -> ");
+                sb.append(value != null ? value.getClass().getName() : "null");
+                if (value instanceof Map) {
+                    sb.append("[map]");
+                }
+                sb.append("; ");
+            }
+            Runner.diag("captureFromParameterCollections map sample size=" + map.size() + " keys=" + sb);
+        }
+
+        private String describeKey(Object key) {
+            if (key == null) {
+                return "null";
+            }
+            StructuredQName q = toStructuredQName(key);
+            if (q != null) {
+                return "QName(" + q.getDisplayName() + ")";
+            }
+            return key.getClass().getName() + '(' + key.toString() + ')';
+        }
+
+        private Object lookupMapValue(Map<?, ?> map, StructuredQName name, Object[] variants) {
+            if (map == null || name == null) {
+                return null;
+            }
+            for (Map.Entry<?, ?> entry : map.entrySet()) {
+                Object key = entry.getKey();
+                if (matchesKey(key, name, variants)) {
+                    Runner.diag("lookupMapValue matched key " + describeKey(key));
+                    return entry.getValue();
+                }
+            }
+            return null;
+        }
+
+        private boolean matchesKey(Object key, StructuredQName target, Object[] variants) {
+            if (key == null) {
+                return false;
+            }
+            StructuredQName keyQName = toStructuredQName(key);
+            if (keyQName != null) {
+                if (keyQName.equals(target)) {
+                    return true;
+                }
+                String keyDisplay = keyQName.getDisplayName();
+                if (matchesVariantString(keyDisplay, variants, target)) {
+                    return true;
+                }
+            }
+            if (matchesVariantString(key.toString(), variants, target)) {
+                return true;
+            }
+            Object extracted = extractNameProperty(key);
+            if (extracted instanceof StructuredQName) {
+                StructuredQName eq = (StructuredQName) extracted;
+                return eq.equals(target) || matchesVariantString(eq.getDisplayName(), variants, target);
+            }
+            if (extracted instanceof javax.xml.namespace.QName) {
+                StructuredQName converted = toStructuredQName(extracted);
+                if (converted != null) {
+                    return converted.equals(target) || matchesVariantString(converted.getDisplayName(), variants, target);
+                }
+            }
+            if (extracted instanceof CharSequence) {
+                return matchesVariantString(extracted.toString(), variants, target);
+            }
+            return false;
+        }
+
+        private boolean matchesVariantString(String candidate, Object[] variants, StructuredQName target) {
+            if (candidate == null) {
+                return false;
+            }
+            String trimmed = candidate.trim();
+            if (trimmed.isEmpty()) {
+                return false;
+            }
+            if (target != null) {
+                String display = target.getDisplayName();
+                if (display != null && trimmed.equals(display)) {
+                    return true;
+                }
+                String uri = target.getURI() == null ? "" : target.getURI();
+                String local = target.getLocalPart() == null ? "" : target.getLocalPart();
+                String expanded = "{" + uri + "}" + local;
+                String saxonExpanded = "Q{" + uri + "}" + local;
+                if (trimmed.equals(expanded) || trimmed.equals(saxonExpanded)) {
+                    return true;
+                }
+                if (target.getPrefix() != null && !target.getPrefix().isEmpty()) {
+                    String prefixed = target.getPrefix() + ':' + local;
+                    if (trimmed.equals(prefixed)) {
+                        return true;
+                    }
+                }
+                if (trimmed.equals(local)) {
+                    return true;
+                }
+            }
+            if (variants != null) {
+                for (Object variant : variants) {
+                    if (variant == null) {
+                        continue;
+                    }
+                    if (trimmed.equals(variant.toString())) {
+                        return true;
+                    }
+                }
+            }
+            return false;
+        }
+
+        private Object extractNameProperty(Object key) {
+            if (key == null) {
+                return null;
+            }
+            String[] props = new String[]{
+                    "variableQName",
+                    "objectName",
+                    "name",
+                    "qName",
+                    "displayName"
+            };
+            for (String prop : props) {
+                Object value = getProperty(key, prop);
+                if (value != null) {
+                    return value;
+                }
+            }
+            String[] methods = new String[]{
+                    "getVariableQName",
+                    "getObjectName",
+                    "getVariableName",
+                    "getQName",
+                    "getDisplayName",
+                    "getStructuredQName"
+            };
+            for (String method : methods) {
+                Object value = invoke(key, method);
+                if (value != null) {
+                    return value;
+                }
+            }
+            return null;
+        }
+
+        private StructuredQName toStructuredQName(Object value) {
+            if (value == null) {
+                return null;
+            }
+            if (value instanceof StructuredQName) {
+                return (StructuredQName) value;
+            }
+            if (value instanceof javax.xml.namespace.QName) {
+                javax.xml.namespace.QName q = (javax.xml.namespace.QName) value;
+                return new StructuredQName(q.getPrefix() == null ? "" : q.getPrefix(),
+                        q.getNamespaceURI() == null ? "" : q.getNamespaceURI(),
+                        q.getLocalPart());
+            }
+            if (value instanceof net.sf.saxon.s9api.QName) {
+                net.sf.saxon.s9api.QName q = (net.sf.saxon.s9api.QName) value;
+                return new StructuredQName(q.getPrefix(), q.getNamespaceURI(), q.getLocalName());
+            }
+            Object extracted = extractNameProperty(value);
+            if (extracted != null && extracted != value) {
+                return toStructuredQName(extracted);
+            }
+            return null;
+        }
+
+        private void mergeCapture(TraceCapture base, TraceCapture candidate) {
+            if (base == null || candidate == null) {
+                return;
+            }
+            if (base.sequence == null && candidate.sequence != null) {
+                base.sequence = candidate.sequence;
+            }
+            if (base.fallback == null && candidate.fallback != null) {
+                base.fallback = candidate.fallback;
+            }
+        }
+
+        private Sequence evaluateObjectValue(Object value, Object context) {
+            Set<Object> seen = Collections.newSetFromMap(new IdentityHashMap<>());
+            return evaluateObjectValue(value, context, 0, seen);
+        }
+
+        private Sequence evaluateObjectValue(Object value, Object context, int depth, Set<Object> seen) {
+            if (value == null || depth > 6) {
+                return null;
+            }
+            if (seen != null && !seen.add(value)) {
+                return null;
+            }
+            Runner.diag("evaluateObjectValue depth=" + depth + " type=" + value.getClass().getName());
+            Sequence seq = toSequence(value);
+            if (seq != null) {
+                Runner.diag("evaluateObjectValue toSequence success " + value.getClass().getName());
+                return materialize(seq);
+            }
+            if (value instanceof SequenceIterator) {
+                Runner.diag("evaluateObjectValue materialize SequenceIterator " + value.getClass().getName());
+                return materializeIterator((SequenceIterator) value);
+            }
+            if (value instanceof Item) {
+                Runner.diag("evaluateObjectValue wrap single Item " + value.getClass().getName());
+                return materializeItem((Item) value);
+            }
+            if (isExpression(value)) {
+                Sequence exprSeq = evaluateExpressionValue(value, context, depth + 1, seen);
+                if (exprSeq != null) {
+                    Runner.diag("evaluateObjectValue expression produced sequence " + value.getClass().getName());
+                    return exprSeq;
+                }
+            }
+            if (isInstanceOf(value, "net.sf.saxon.s9api.XdmValue")) {
+                Object underlying = invoke(value, "getUnderlyingValue");
+                Sequence underlyingSeq = evaluateObjectValue(underlying, context, depth + 1, seen);
+                if (underlyingSeq != null) {
+                    return underlyingSeq;
+                }
+            }
+            String[] methodNames = new String[]{
+                    "materialize",
+                    "evaluate",
+                    "iterate",
+                    "getValue",
+                    "value",
+                    "call",
+                    "apply",
+                    "asSequence",
+                    "asAtomic",
+                    "reduce",
+                    "expand",
+                    "snapshot",
+                    "makeSequence"
+            };
+            for (String name : methodNames) {
+                Sequence viaContext = invokeAndMaterialize(value, name, context, depth, seen);
+                if (viaContext != null) {
+                    return viaContext;
+                }
+                Sequence viaEmpty = invokeAndMaterialize(value, name, null, depth, seen);
+                if (viaEmpty != null) {
+                    return viaEmpty;
+                }
+            }
+            if (value instanceof Iterable) {
+                Sequence seqFromIterable = sequenceFromIterable((Iterable<?>) value);
+                if (seqFromIterable != null) {
+                    return seqFromIterable;
+                }
+            }
+            if (value != null && value.getClass().isArray()) {
+                Sequence seqFromArray = sequenceFromArray(value);
+                if (seqFromArray != null) {
+                    return seqFromArray;
+                }
+            }
+            return null;
+        }
+
+        private Sequence invokeAndMaterialize(Object target, String methodName, Object context, int depth, Set<Object> seen) {
+            if (target == null) {
+                return null;
+            }
+            Object result;
+            if (context != null) {
+                result = invoke(target, methodName, context);
+                if (result != null) {
+                    Runner.diag("invokeAndMaterialize " + target.getClass().getName() + "." + methodName + " -> " + result.getClass().getName());
+                }
+                Sequence seq = evaluateObjectValue(result, context, depth + 1, seen);
+                if (seq != null) {
+                    return seq;
+                }
+            }
+            result = invoke(target, methodName);
+            if (result != null) {
+                Runner.diag("invokeAndMaterialize " + target.getClass().getName() + "." + methodName + "() -> " + result.getClass().getName());
+            }
+            return evaluateObjectValue(result, context, depth + 1, seen);
+        }
+
+        private Sequence materializeItem(Item item) {
+            if (item == null) {
+                return null;
+            }
+            try {
+                List<Item> items = new ArrayList<>();
+                items.add(item);
+                return SequenceExtent.makeSequenceExtent(items);
+            } catch (Exception ignored) {
+                return null;
+            }
+        }
+
+        private Sequence sequenceFromIterable(Iterable<?> iterable) {
+            if (iterable == null) {
+                return null;
+            }
+            List<Item> items = new ArrayList<>();
+            for (Object element : iterable) {
+                if (element instanceof Item) {
+                    items.add((Item) element);
+                }
+            }
+            if (!items.isEmpty()) {
+                try {
+                    return SequenceExtent.makeSequenceExtent(items);
+                } catch (Exception ignored) {
+                    return null;
+                }
+            }
+            return null;
+        }
+
+        private Sequence sequenceFromArray(Object array) {
+            if (array == null || !array.getClass().isArray()) {
+                return null;
+            }
+            int len = java.lang.reflect.Array.getLength(array);
+            List<Item> items = new ArrayList<>(len);
+            for (int i = 0; i < len; i++) {
+                Object element = java.lang.reflect.Array.get(array, i);
+                if (element instanceof Item) {
+                    items.add((Item) element);
+                }
+            }
+            if (!items.isEmpty()) {
+                try {
+                    return SequenceExtent.makeSequenceExtent(items);
+                } catch (Exception ignored) {
+                }
+            }
+            return null;
+        }
+
+        private boolean isExpression(Object value) {
+            return isInstanceOf(value, "net.sf.saxon.expr.Expression");
+        }
+
+        private boolean isBinding(Object value) {
+            return isInstanceOf(value, "net.sf.saxon.expr.parser.Binding") ||
+                    isInstanceOf(value, "net.sf.saxon.expr.instruct.BindingReference");
+        }
+
+        private Sequence evaluateExpressionValue(Object expression, Object context, int depth, Set<Object> seen) {
+            if (expression == null) {
+                return null;
+            }
+            Object[] params = context != null ? new Object[]{context} : new Object[0];
+            Object iterateResult = invoke(expression, "iterate", params);
+            Sequence seq = evaluateObjectValue(iterateResult, context, depth + 1, seen);
+            if (seq != null) {
+                Runner.diag("evaluateExpressionValue iterate produced sequence for " + expression.getClass().getName());
+                return seq;
+            }
+            if (context != null) {
+                iterateResult = invoke(expression, "iterate");
+                seq = evaluateObjectValue(iterateResult, context, depth + 1, seen);
+                if (seq != null) {
+                    Runner.diag("evaluateExpressionValue iterate() produced sequence for " + expression.getClass().getName());
+                    return seq;
+                }
+            }
+            String[] methodNames = new String[]{
+                    "evaluateItem",
+                    "evaluateVariable",
+                    "evaluateLocalVariable",
+                    "evaluate",
+                    "call",
+                    "process",
+                    "deliver"
+            };
+            for (String name : methodNames) {
+                Object result = context != null ? invoke(expression, name, context) : null;
+                seq = evaluateObjectValue(result, context, depth + 1, seen);
+                if (seq != null) {
+                    Runner.diag("evaluateExpressionValue " + name + "(context) produced sequence for " + expression.getClass().getName());
+                    return seq;
+                }
+                if (context != null) {
+                    result = invoke(expression, name);
+                    seq = evaluateObjectValue(result, context, depth + 1, seen);
+                    if (seq != null) {
+                        Runner.diag("evaluateExpressionValue " + name + "() produced sequence for " + expression.getClass().getName());
+                        return seq;
+                    }
+                }
+            }
+            return null;
+        }
+
+        private boolean isInstanceOf(Object value, String className) {
+            if (value == null || className == null) {
+                return false;
+            }
+            try {
+                Class<?> cls = Class.forName(className);
+                return cls.isInstance(value);
+            } catch (Exception ignored) {
+                return false;
+            }
+        }
+
+        private Object invoke(Object target, String methodName, Object... params) {
+            if (target == null) {
+                return null;
+            }
+            try {
+                Class<?>[] types = new Class<?>[params.length];
+                for (int i = 0; i < params.length; i++) {
+                    Object p = params[i];
+                    types[i] = p != null && p.getClass() == Integer.class ? int.class : (p == null ? Object.class : p.getClass());
+                }
+                Method m = findMethod(target.getClass(), methodName, types);
+                if (m == null && params.length == 1 && params[0] instanceof Integer) {
+                    m = findMethod(target.getClass(), methodName, new Class<?>[]{int.class});
+                }
+                if (m == null) {
+                    return null;
+                }
+                m.setAccessible(true);
+                return m.invoke(target, params);
+            } catch (Exception e) {
+                return null;
+            }
+        }
+
+        private Method findMethod(Class<?> type, String name, Class<?>[] parameterTypes) {
+            try {
+                return type.getMethod(name, parameterTypes);
+            } catch (Exception ignored) {
+                // fall through to compatibility search
+            }
+            Method[] methods = type.getMethods();
+            for (Method m : methods) {
+                if (!m.getName().equals(name) || m.getParameterCount() != parameterTypes.length) {
+                    continue;
+                }
+                Class<?>[] targetParams = m.getParameterTypes();
+                boolean compatible = true;
+                for (int i = 0; i < targetParams.length; i++) {
+                    Class<?> requested = parameterTypes[i];
+                    if (!isAssignable(targetParams[i], requested)) {
+                        compatible = false;
+                        break;
+                    }
+                }
+                if (compatible) {
+                    return m;
+                }
+            }
+            return null;
+        }
+
+        private boolean isAssignable(Class<?> targetType, Class<?> requestedType) {
+            if (targetType == null) {
+                return false;
+            }
+            if (requestedType == null || requestedType == Object.class) {
+                return true;
+            }
+            if (targetType.isPrimitive()) {
+                targetType = primitiveToWrapper(targetType);
+            }
+            if (requestedType.isPrimitive()) {
+                requestedType = primitiveToWrapper(requestedType);
+            }
+            if (targetType == null) {
+                return false;
+            }
+            if (requestedType == null) {
+                return true;
+            }
+            return targetType.isAssignableFrom(requestedType);
+        }
+
+        private Class<?> primitiveToWrapper(Class<?> primitive) {
+            if (primitive == null) {
+                return null;
+            }
+            if (!primitive.isPrimitive()) {
+                return primitive;
+            }
+            if (primitive == boolean.class) return Boolean.class;
+            if (primitive == byte.class) return Byte.class;
+            if (primitive == short.class) return Short.class;
+            if (primitive == char.class) return Character.class;
+            if (primitive == int.class) return Integer.class;
+            if (primitive == long.class) return Long.class;
+            if (primitive == float.class) return Float.class;
+            if (primitive == double.class) return Double.class;
+            return primitive;
+        }
+
+        private Object firstCandidate(Object instructionInfo) {
+            String[] keys = new String[]{"value", "result", "variableValue", "actualValue", "selectValue", "sequence", "selectExpression", "containedValue"};
+            for (String key : keys) {
+                Object val = getProperty(instructionInfo, key);
+                if (val != null) {
+                    return val;
+                }
+            }
+            return null;
+        }
+
+        private Integer extractSlot(Object instructionInfo) {
+            String[] keys = new String[]{"slot", "slot-number", "slotNumber", "slotIndex"};
+            for (String key : keys) {
+                Object val = getProperty(instructionInfo, key);
+                if (val instanceof Number) {
+                    return ((Number) val).intValue();
+                }
+            }
+            try {
+                Method m = instructionInfo.getClass().getMethod("getSlotNumber");
+                Object result = m.invoke(instructionInfo);
+                if (result instanceof Number) {
+                    return ((Number) result).intValue();
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            return null;
+        }
+
+        private Object getProperty(Object instructionInfo, String key) {
+            if (instructionInfo == null) {
+                return null;
+            }
+            try {
+                Method m = instructionInfo.getClass().getMethod("getProperty", String.class);
+                return m.invoke(instructionInfo, key);
+            } catch (Exception ignored) {
+                return null;
+            }
+        }
+
+        private boolean isVariable(Object instructionInfo) {
+            if (instructionInfo == null) {
+                return false;
+            }
+            Integer construct = getConstructType(instructionInfo);
+            if (construct != null) {
+                if (construct == StandardNames.XSL_VARIABLE ||
+                        construct == StandardNames.XSL_PARAM ||
+                        construct == StandardNames.XSL_WITH_PARAM) {
+                    return true;
+                }
+            }
+            StructuredQName name = getVariableName(instructionInfo);
+            if (name != null) {
+                return true;
+            }
+            String className = instructionInfo.getClass().getName();
+            if (className != null) {
+                if (className.contains(".LetExpression") ||
+                        className.contains(".GlobalVariable") ||
+                        className.contains(".GlobalParameter") ||
+                        className.contains(".LocalVariable") ||
+                        className.contains(".Assignation")) {
+                    return true;
+                }
+            }
+            return false;
+        }
+
+        private Integer getConstructType(Object instructionInfo) {
+            if (instructionInfo == null) {
+                return null;
+            }
+            try {
+                Method m = instructionInfo.getClass().getMethod("getConstructType");
+                Object val = m.invoke(instructionInfo);
+                if (val instanceof Number) {
+                    return ((Number) val).intValue();
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            return null;
+        }
+
+        private StructuredQName getVariableName(Object instructionInfo) {
+            if (instructionInfo == null) {
+                return null;
+            }
+            try {
+                Method m = instructionInfo.getClass().getMethod("getObjectName");
+                Object result = m.invoke(instructionInfo);
+                if (result instanceof StructuredQName) {
+                    return (StructuredQName) result;
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            try {
+                Method m = instructionInfo.getClass().getMethod("getVariableQName");
+                Object result = m.invoke(instructionInfo);
+                if (result instanceof StructuredQName) {
+                    return (StructuredQName) result;
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            try {
+                Method m = instructionInfo.getClass().getMethod("getVariableName");
+                Object result = m.invoke(instructionInfo);
+                if (result instanceof StructuredQName) {
+                    return (StructuredQName) result;
+                }
+                if (result instanceof String) {
+                    return new StructuredQName("", "", (String) result);
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            Object prop = getProperty(instructionInfo, "name");
+            if (prop instanceof StructuredQName) {
+                return (StructuredQName) prop;
+            }
+            if (prop instanceof String) {
+                return new StructuredQName("", "", (String) prop);
+            }
+            return null;
+        }
+
+        private Sequence toSequence(Object value) {
+            if (value == null) {
+                return null;
+            }
+            if (value instanceof Sequence) {
+                return (Sequence) value;
+            }
+            if (value instanceof GroundedValue) {
+                return (GroundedValue) value;
+            }
+            return null;
+        }
+
+        private Sequence materialize(Sequence sequence) {
+            if (sequence instanceof GroundedValue) {
+                return sequence;
+            }
+            try {
+                Method m = sequence.getClass().getMethod("materialize");
+                Object result = m.invoke(sequence);
+                if (result instanceof Sequence) {
+                    return (Sequence) result;
+                }
+                if (result instanceof GroundedValue) {
+                    return (GroundedValue) result;
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            return sequence;
+        }
+
+        private Sequence materializeIterator(SequenceIterator iterator) {
+            if (iterator == null) {
+                return null;
+            }
+            List<Item> items = new ArrayList<>();
+            try {
+                while (true) {
+                    Item item = iterator.next();
+                    if (item == null) {
+                        break;
+                    }
+                    items.add(item);
+                }
+            } catch (Exception ignored) {
+                return null;
+            } finally {
+                try {
+                    iterator.close();
+                } catch (Exception ignored) {
+                    // ignore
+                }
+            }
+            try {
+                return SequenceExtent.makeSequenceExtent(items);
+            } catch (Exception ignored) {
+                return null;
+            }
+        }
+
+        private GroundedValue toGroundedValue(Sequence sequence) {
+            if (sequence instanceof GroundedValue) {
+                return (GroundedValue) sequence;
+            }
+            try {
+                Class<?> tool = Class.forName("net.sf.saxon.om.SequenceTool");
+                Method m = tool.getMethod("toGroundedValue", Sequence.class);
+                Object result = m.invoke(null, sequence);
+                if (result instanceof GroundedValue) {
+                    return (GroundedValue) result;
+                }
+            } catch (Exception ignored) {
+                // ignore
+            }
+            return null;
+        }
+
+        private String formatSequence(Sequence sequence) {
+            if (sequence == null) {
+                return "";
+            }
+            try {
+                Sequence materialized = materialize(sequence);
+                GroundedValue grounded = toGroundedValue(materialized);
+                if (grounded == null) {
+                    return materialized.toString();
+                }
+                if (grounded == EmptySequence.getInstance()) {
+                    return "";
+                }
+                XdmValue xdmValue = XdmValue.wrap(grounded);
+                if (!xdmValue.iterator().hasNext()) {
+                    return "";
+                }
+                StringBuilder sb = new StringBuilder();
+                boolean first = true;
+                for (XdmItem item : xdmValue) {
+                    if (!first) {
+                        sb.append('\n');
+                    }
+                    first = false;
+                    if (item instanceof XdmNode) {
+                        StringWriter buffer = new StringWriter();
+                        Serializer serializer = processor.newSerializer(buffer);
+                        serializer.serializeNode((XdmNode) item);
+                        serializer.close();
+                        sb.append(buffer.toString());
+                    } else {
+                        sb.append(safeItemString(item));
+                    }
+                }
+                return sb.toString();
+            } catch (SaxonApiException e) {
+                return "(error: " + e.getMessage() + ")";
+            }
+        }
+
+        private String safeItemString(XdmItem item) {
+            if (item == null) {
+                return "";
+            }
+            if (item instanceof XdmNode) {
+                return item.toString();
+            }
+            try {
+                return item.getStringValue();
+            } catch (IllegalStateException | UnsupportedOperationException e) {
+                return item.toString();
+            }
+        }
+
+        private void printDebug(String phase, StructuredQName name) {
+            if (!TRACE_DEBUG || name == null) {
+                return;
+            }
+            out.println("TRACE_DEBUG phase=" + phase + " variable=" + name.getDisplayName());
+        }
+
+        private void debugEvent(String phase, Object instructionInfo) {
+            if (!TRACE_DEBUG) {
+                return;
+            }
+            if (debugCounter++ > 50) {
+                return;
+            }
+            StructuredQName name = getVariableName(instructionInfo);
+            Integer construct = getConstructType(instructionInfo);
+            out.println("TRACE_DEBUG raw_event phase=" + phase + " construct=" + construct + " name=" + (name != null ? name.getDisplayName() : "null") + " class=" + (instructionInfo != null ? instructionInfo.getClass().getName() : "null"));
+        }
+
+        private String formatItem(Item item) {
+            if (item == null) {
+                return "";
+            }
+            if (item instanceof NodeInfo) {
+                try {
+                    StringWriter buffer = new StringWriter();
+                    Serializer serializer = processor.newSerializer(buffer);
+                    serializer.serializeXdmValue(XdmValue.wrap((NodeInfo) item));
+                    serializer.close();
+                    return buffer.toString();
+                } catch (SaxonApiException e) {
+                    return item.getStringValue();
+                }
+            }
+            return item.getStringValue();
+        }
+
+        private static final class Frame {
+            StructuredQName name;
+            Object instruction;
+            Object context;
+            Object properties;
+        }
+
+        private static final class TraceCapture {
+            Sequence sequence;
+            String fallback;
+        }
+    }
 }
diff --git a/backend/ext/com/xsltplayground/ext/CustomFunctions.java b/backend/ext/com/xsltplayground/ext/CustomFunctions.java
index 202442ae..021eaaf8 100644
--- a/backend/ext/com/xsltplayground/ext/CustomFunctions.java
+++ b/backend/ext/com/xsltplayground/ext/CustomFunctions.java
@@ -16,6 +16,8 @@ import javax.xml.transform.stream.StreamResult;
 import org.w3c.dom.Node;
 
 public class CustomFunctions {
+    private static final String NAMESPACE_URI = "http://www.tibco.com/bw/xslt/custom-functions";
+
     public static String uuid() {
         return UUID.randomUUID().toString();
     }
@@ -387,12 +389,12 @@ public class CustomFunctions {
     // Saxon HE integration
     // ---------------------------------------------------------------------
     // Saxon-HE doesn't support reflexive java: calls. To keep XSLT unchanged
-    // (e.g., xmlns:java="java:com.xsltplayground.ext.CustomFunctions" and
-    // java:uuid()), register integrated extension functions programmatically.
+    // (e.g., xmlns:tib="http://www.tibco.com/bw/xslt/custom-functions" and
+    // tib:uuid()), register integrated extension functions programmatically.
     // Call CustomFunctions.registerAll(processor) once during initialization.
 
     public static void registerAll(net.sf.saxon.s9api.Processor processor) {
-        final String namespace = "java:" + CustomFunctions.class.getName();
+        final String namespace = NAMESPACE_URI;
 
         java.lang.reflect.Method[] methods = CustomFunctions.class.getDeclaredMethods();
         for (java.lang.reflect.Method m : methods) {
diff --git a/backend/src/main.go b/backend/src/main.go
index a2fa0587..a2d5b99b 100644
--- a/backend/src/main.go
+++ b/backend/src/main.go
@@ -270,55 +270,67 @@ func main() {
 		duration := time.Since(start).Milliseconds()
 		log.Printf("transformation done in %dms", duration)
 
-        var traceEntries []TraceEntry
-        var traceText string
-        if req.Trace {
-            // Load trace text from file (preferred) or stderr
-            if tracePath != "" {
-                if data, err := os.ReadFile(tracePath); err == nil {
-                    traceText = string(data)
-                }
-            }
-            if traceText == "" {
-                traceText = stderr.String()
-            }
+		var traceEntries []TraceEntry
+		var traceText string
+		if req.Trace {
+			// Load trace text from file (preferred) or stderr
+			if tracePath != "" {
+				if data, err := os.ReadFile(tracePath); err == nil {
+					traceText = string(data)
+					log.Printf("trace file %s size=%d bytes", tracePath, len(traceText))
+				} else {
+					log.Printf("trace read error: %v", err)
+				}
+			}
+			if traceText == "" {
+				traceText = stderr.String()
+				if traceText != "" {
+					log.Printf("trace fallback from stderr size=%d bytes", len(traceText))
+				}
+			}
 
-            // Parse block-based variable traces and legacy single-line ones
-            lines := strings.Split(traceText, "\n")
-            capturing := false
-            var currName string
-            var buf []string
-            for _, l := range lines {
-                if strings.HasPrefix(l, "TRACE_VAR_START|") {
-                    capturing = true
-                    currName = strings.TrimPrefix(l, "TRACE_VAR_START|")
-                    buf = nil
-                    continue
-                }
-                if strings.HasPrefix(l, "TRACE_VAR_END") {
-                    if capturing {
-                        value := strings.Join(buf, "\n")
-                        traceEntries = append(traceEntries, TraceEntry{Name: currName, Value: value})
-                    }
-                    capturing = false
-                    currName = ""
-                    buf = nil
-                    continue
-                }
-                if capturing {
-                    buf = append(buf, l)
-                    continue
-                }
-                if strings.HasPrefix(l, "TRACE_VAR|") {
-                    parts := strings.SplitN(l, "|", 3)
-                    if len(parts) == 3 {
-                        traceEntries = append(traceEntries, TraceEntry{Name: parts[1], Value: parts[2]})
-                    }
-                }
-            }
-        }
+			// Parse block-based variable traces and legacy single-line ones
+			lines := strings.Split(traceText, "\n")
+			filtered := make([]string, 0, len(lines))
+			capturing := false
+			var currName string
+			var buf []string
+			for _, l := range lines {
+				if strings.HasPrefix(l, "TRACE_DEBUG") {
+					continue
+				}
+				filtered = append(filtered, l)
+				if strings.HasPrefix(l, "TRACE_VAR_START|") {
+					capturing = true
+					currName = strings.TrimPrefix(l, "TRACE_VAR_START|")
+					buf = nil
+					continue
+				}
+				if strings.HasPrefix(l, "TRACE_VAR_END") {
+					if capturing {
+						value := strings.Join(buf, "\n")
+						traceEntries = append(traceEntries, TraceEntry{Name: currName, Value: value})
+					}
+					capturing = false
+					currName = ""
+					buf = nil
+					continue
+				}
+				if capturing {
+					buf = append(buf, l)
+					continue
+				}
+				if strings.HasPrefix(l, "TRACE_VAR|") {
+					parts := strings.SplitN(l, "|", 3)
+					if len(parts) == 3 {
+						traceEntries = append(traceEntries, TraceEntry{Name: parts[1], Value: parts[2]})
+					}
+				}
+			}
+			traceText = strings.Join(filtered, "\n")
+		}
 
-        c.JSON(http.StatusOK, TransformResponse{Result: string(result), DurationMs: duration, Trace: traceEntries, TraceText: traceText})
+		c.JSON(http.StatusOK, TransformResponse{Result: string(result), DurationMs: duration, Trace: traceEntries, TraceText: traceText})
 	})
 
 	r.GET("/", func(c *gin.Context) {
diff --git a/backend/src/main_test.go b/backend/src/main_test.go
new file mode 100644
index 00000000..f0d4e323
--- /dev/null
+++ b/backend/src/main_test.go
@@ -0,0 +1,94 @@
+package main
+
+import (
+	"net/http"
+	"net/http/httptest"
+	"os"
+	"path/filepath"
+	"testing"
+
+	"github.com/gin-gonic/gin"
+)
+
+func TestLoadConfigAppliesEnvOverrides(t *testing.T) {
+	t.Setenv("DATABASE_URL", "postgres://env")
+	t.Setenv("GOOGLE_APPLICATION_CREDENTIALS", "/tmp/creds.json")
+	t.Setenv("SAXON_CLASSPATH", "env-classpath")
+
+	dir := t.TempDir()
+	cfgPath := filepath.Join(dir, "app.config")
+	payload := `{
+		"port": "3000",
+		"saxon_classpath": "classpath",
+		"database_url": "postgres://file",
+		"firebase_credentials": "/tmp/file-creds.json"
+	}`
+	if err := os.WriteFile(cfgPath, []byte(payload), 0644); err != nil {
+		t.Fatalf("write config: %v", err)
+	}
+
+	cfg, err := loadConfig(cfgPath)
+	if err != nil {
+		t.Fatalf("loadConfig returned error: %v", err)
+	}
+
+	if cfg.DatabaseURL != "postgres://env" {
+		t.Fatalf("expected env database url, got %s", cfg.DatabaseURL)
+	}
+	if cfg.FirebaseCredentials != "/tmp/creds.json" {
+		t.Fatalf("expected env firebase creds, got %s", cfg.FirebaseCredentials)
+	}
+	if cfg.SaxonClasspath != "env-classpath" {
+		t.Fatalf("expected env saxon classpath, got %s", cfg.SaxonClasspath)
+	}
+}
+
+func TestCorsMiddlewareSetsHeaders(t *testing.T) {
+	gin.SetMode(gin.TestMode)
+	router := gin.New()
+	router.Use(corsMiddleware())
+	router.GET("/test", func(c *gin.Context) {
+		c.String(http.StatusOK, "ok")
+	})
+
+	req := httptest.NewRequest(http.MethodGet, "/test", nil)
+	rec := httptest.NewRecorder()
+	router.ServeHTTP(rec, req)
+
+	if rec.Code != http.StatusOK {
+		t.Fatalf("expected status 200, got %d", rec.Code)
+	}
+	headers := rec.Result().Header
+	if headers.Get("Access-Control-Allow-Origin") != "*" {
+		t.Fatalf("missing CORS origin header")
+	}
+	if headers.Get("Access-Control-Allow-Methods") == "" {
+		t.Fatalf("missing CORS methods header")
+	}
+	if headers.Get("Access-Control-Allow-Headers") == "" {
+		t.Fatalf("missing CORS headers header")
+	}
+}
+
+func TestCorsMiddlewareHandlesOptionsRequests(t *testing.T) {
+	gin.SetMode(gin.TestMode)
+	router := gin.New()
+	router.Use(corsMiddleware())
+
+	handlerCalled := false
+	router.Any("/test", func(c *gin.Context) {
+		handlerCalled = true
+		c.Status(http.StatusOK)
+	})
+
+	req := httptest.NewRequest(http.MethodOptions, "/test", nil)
+	rec := httptest.NewRecorder()
+	router.ServeHTTP(rec, req)
+
+	if rec.Code != http.StatusNoContent {
+		t.Fatalf("expected status 204, got %d", rec.Code)
+	}
+	if handlerCalled {
+		t.Fatalf("handler should not be called for OPTIONS requests")
+	}
+}
diff --git a/docker-compose.local.yml b/docker-compose.local.yml
index d4f8e4a9..782648d9 100644
--- a/docker-compose.local.yml
+++ b/docker-compose.local.yml
@@ -4,6 +4,7 @@ services:
     build: ./backend
     environment:
       VITE_GO_PRO: "false"
+      XSLT_TRACE_DEBUG: "true"
     ports:
       - "8000:8000"
   frontend:
diff --git a/frontend/entrypoint.sh b/frontend/entrypoint.sh
index e6cd981c..cb7666cc 100755
--- a/frontend/entrypoint.sh
+++ b/frontend/entrypoint.sh
@@ -1,14 +1,27 @@
 #!/bin/sh
 set -e
+
+escape_js_string() {
+  # Escape backslashes, double quotes and newlines so runtime env stays valid JS
+  printf '%s' "$1" | sed ':a;N;$!ba;s/\\/\\\\/g;s/\n/\\n/g;s/"/\\"/g'
+}
+
+BACKEND_URL_ESC=$(escape_js_string "${VITE_BACKEND_URL}")
+GO_PRO_ESC=$(escape_js_string "${VITE_GO_PRO}")
+ADSENSE_CLIENT_ESC=$(escape_js_string "${VITE_ADSENSE_CLIENT}")
+ADSENSE_SLOT_ESC=$(escape_js_string "${VITE_ADSENSE_SLOT}")
+FIREBASE_CONFIG_ESC=$(escape_js_string "${VITE_FIREBASE_CONFIG}")
+GA_ID_ESC=$(escape_js_string "${VITE_GA_ID}")
+
 # Write runtime environment variables for the frontend
 cat <<EOF >/usr/share/nginx/html/env.js
 window.env = {
-  VITE_BACKEND_URL: "${VITE_BACKEND_URL}",
-  VITE_GO_PRO: "${VITE_GO_PRO}",
-  VITE_ADSENSE_CLIENT: "${VITE_ADSENSE_CLIENT}",
-  VITE_ADSENSE_SLOT: "${VITE_ADSENSE_SLOT}",
-  VITE_FIREBASE_CONFIG: "${VITE_FIREBASE_CONFIG}",
-  VITE_GA_ID: "${VITE_GA_ID}"
+  VITE_BACKEND_URL: "${BACKEND_URL_ESC}",
+  VITE_GO_PRO: "${GO_PRO_ESC}",
+  VITE_ADSENSE_CLIENT: "${ADSENSE_CLIENT_ESC}",
+  VITE_ADSENSE_SLOT: "${ADSENSE_SLOT_ESC}",
+  VITE_FIREBASE_CONFIG: "${FIREBASE_CONFIG_ESC}",
+  VITE_GA_ID: "${GA_ID_ESC}"
 };
 EOF
 
diff --git a/frontend/index.html b/frontend/index.html
index f0255334..91c509ec 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -21,6 +21,7 @@
     <meta property="og:url" content="https://xsltplayground.com/" />
     <meta property="og:image" content="/logo.svg" />
     <link rel="canonical" href="https://xsltplayground.com/" />
+    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
     <script type="module" src="/env.js"></script>
       <script>
         if (window.env && window.env.VITE_ADSENSE_CLIENT) {
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 306ea3e3..03822fae 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "xslt-playground",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "xslt-playground",
-      "version": "0.1.0",
+      "version": "0.2.0",
       "dependencies": {
         "@monaco-editor/react": "^4.7.0",
         "firebase": "^9.23.0",
@@ -17,10 +17,21 @@
         "xml-formatter": "^3.6.6"
       },
       "devDependencies": {
+        "@testing-library/jest-dom": "^6.6.3",
+        "@testing-library/react": "^16.1.0",
         "@vitejs/plugin-react": "^4.1.0",
-        "vite": "^5.0.0"
+        "jsdom": "^25.0.1",
+        "vite": "^5.0.0",
+        "vitest": "^2.1.4"
       }
     },
+    "node_modules/@adobe/css-tools": {
+      "version": "4.4.4",
+      "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.4.tgz",
+      "integrity": "sha512-Elp+iwUx5rN5+Y8xLt5/GRoG20WGoDCQ/1Fb+1LiGtvwbDavuSk0jhD/eZdckHAuzcDzccnkv+rEjyWfRx18gg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@ampproject/remapping": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
@@ -35,6 +46,27 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@asamuzakjp/css-color": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-3.2.0.tgz",
+      "integrity": "sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/css-calc": "^2.1.3",
+        "@csstools/css-color-parser": "^3.0.9",
+        "@csstools/css-parser-algorithms": "^3.0.4",
+        "@csstools/css-tokenizer": "^3.0.3",
+        "lru-cache": "^10.4.3"
+      }
+    },
+    "node_modules/@asamuzakjp/css-color/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.27.1.tgz",
@@ -259,6 +291,16 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/@babel/runtime": {
+      "version": "7.28.4",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz",
+      "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/template": {
       "version": "7.27.2",
       "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
@@ -307,6 +349,121 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@csstools/color-helpers": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.1.0.tgz",
+      "integrity": "sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@csstools/css-calc": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-2.1.4.tgz",
+      "integrity": "sha512-3N8oaj+0juUw/1H3YwmDDJXCgTB1gKU6Hc/bB502u9zR0q2vd786XJH9QfrKIEgFlZmhZiq6epXl4rHqhzsIgQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^3.0.5",
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/@csstools/css-color-parser": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-3.1.0.tgz",
+      "integrity": "sha512-nbtKwh3a6xNVIp/VRuXV64yTKnb1IjTAEEh3irzS+HkKjAOYLTGNb9pmVNntZ8iVBHcWDA2Dof0QtPgFI1BaTA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/color-helpers": "^5.1.0",
+        "@csstools/css-calc": "^2.1.4"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^3.0.5",
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/@csstools/css-parser-algorithms": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.5.tgz",
+      "integrity": "sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/@csstools/css-tokenizer": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.4.tgz",
+      "integrity": "sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@esbuild/aix-ppc64": {
       "version": "0.21.5",
       "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
@@ -1373,9 +1530,9 @@
       }
     },
     "node_modules/@jridgewell/sourcemap-codec": {
-      "version": "1.5.3",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.3.tgz",
-      "integrity": "sha512-AiR5uKpFxP3PjO4R19kQGIMwxyRyPuXmKEEy301V1C0+1rVjS94EZQXf1QKZYN8Q0YM+estSPhmx5JwNftv6nw==",
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
+      "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
       "dev": true,
       "license": "MIT"
     },
@@ -1764,6 +1921,90 @@
         "win32"
       ]
     },
+    "node_modules/@testing-library/dom": {
+      "version": "10.4.1",
+      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz",
+      "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/code-frame": "^7.10.4",
+        "@babel/runtime": "^7.12.5",
+        "@types/aria-query": "^5.0.1",
+        "aria-query": "5.3.0",
+        "dom-accessibility-api": "^0.5.9",
+        "lz-string": "^1.5.0",
+        "picocolors": "1.1.1",
+        "pretty-format": "^27.0.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@testing-library/jest-dom": {
+      "version": "6.9.1",
+      "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.9.1.tgz",
+      "integrity": "sha512-zIcONa+hVtVSSep9UT3jZ5rizo2BsxgyDYU7WFD5eICBE7no3881HGeb/QkGfsJs6JTkY1aQhT7rIPC7e+0nnA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@adobe/css-tools": "^4.4.0",
+        "aria-query": "^5.0.0",
+        "css.escape": "^1.5.1",
+        "dom-accessibility-api": "^0.6.3",
+        "picocolors": "^1.1.1",
+        "redent": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=14",
+        "npm": ">=6",
+        "yarn": ">=1"
+      }
+    },
+    "node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz",
+      "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@testing-library/react": {
+      "version": "16.3.0",
+      "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.3.0.tgz",
+      "integrity": "sha512-kFSyxiEDwv1WLl2fgsq6pPBbw5aWKrsY2/noi1Id0TK0UParSF62oFQFGHXIyaG4pp2tEub/Zlel+fjjZILDsw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@testing-library/dom": "^10.0.0",
+        "@types/react": "^18.0.0 || ^19.0.0",
+        "@types/react-dom": "^18.0.0 || ^19.0.0",
+        "react": "^18.0.0 || ^19.0.0",
+        "react-dom": "^18.0.0 || ^19.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@types/aria-query": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
+      "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
@@ -1852,6 +2093,129 @@
         "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0-beta.0"
       }
     },
+    "node_modules/@vitest/expect": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-2.1.9.tgz",
+      "integrity": "sha512-UJCIkTBenHeKT1TTlKMJWy1laZewsRIzYighyYiJKZreqtdxSos/S1t+ktRMQWu2CKqaarrkeszJx1cgC5tGZw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "2.1.9",
+        "@vitest/utils": "2.1.9",
+        "chai": "^5.1.2",
+        "tinyrainbow": "^1.2.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/mocker": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-2.1.9.tgz",
+      "integrity": "sha512-tVL6uJgoUdi6icpxmdrn5YNo3g3Dxv+IHJBr0GXHaEdTcw3F+cPKnsXFhli6nO+f/6SDKPHEK1UN+k+TQv0Ehg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "2.1.9",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^0.30.12"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "msw": "^2.4.9",
+        "vite": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "msw": {
+          "optional": true
+        },
+        "vite": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vitest/pretty-format": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-2.1.9.tgz",
+      "integrity": "sha512-KhRIdGV2U9HOUzxfiHmY8IFHTdqtOhIzCpd8WRdJiE7D/HUcZVD0EgQCVjm+Q9gkUXWgBvMmTtZgIG48wq7sOQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyrainbow": "^1.2.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/runner": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-2.1.9.tgz",
+      "integrity": "sha512-ZXSSqTFIrzduD63btIfEyOmNcBmQvgOVsPNPe0jYtESiXkhd8u2erDLnMxmGrDCwHCCHE7hxwRDCT3pt0esT4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/utils": "2.1.9",
+        "pathe": "^1.1.2"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/snapshot": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-2.1.9.tgz",
+      "integrity": "sha512-oBO82rEjsxLNJincVhLhaxxZdEtV0EFHMK5Kmx5sJ6H9L183dHECjiefOAdnqpIgT5eZwT04PoggUnW88vOBNQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "2.1.9",
+        "magic-string": "^0.30.12",
+        "pathe": "^1.1.2"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/spy": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-2.1.9.tgz",
+      "integrity": "sha512-E1B35FwzXXTs9FHNK6bDszs7mtydNi5MIfUWpceJ8Xbfb1gBMscAnwLbEu+B44ed6W3XjL9/ehLPHR1fkf1KLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyspy": "^3.0.2"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/utils": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-2.1.9.tgz",
+      "integrity": "sha512-v0psaMSkNJ3A2NMrUEHFRzJtDPFn+/VWZ5WxImB21T9fjucJRmS7xCS3ppEnARb9y11OAzaD+P2Ps+b+BGX5iQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "2.1.9",
+        "loupe": "^3.1.2",
+        "tinyrainbow": "^1.2.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/agent-base": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
+      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "node_modules/ansi-regex": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -1876,6 +2240,33 @@
         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
+    "node_modules/aria-query": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
+      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "dequal": "^2.0.3"
+      }
+    },
+    "node_modules/assertion-error": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
+      "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/browserslist": {
       "version": "4.25.1",
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.1.tgz",
@@ -1909,6 +2300,30 @@
         "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
       }
     },
+    "node_modules/cac": {
+      "version": "6.7.14",
+      "resolved": "https://registry.npmjs.org/cac/-/cac-6.7.14.tgz",
+      "integrity": "sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001726",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001726.tgz",
@@ -1930,6 +2345,33 @@
       ],
       "license": "CC-BY-4.0"
     },
+    "node_modules/chai": {
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-5.3.3.tgz",
+      "integrity": "sha512-4zNhdJD/iOjSH0A05ea+Ke6MU5mmpQcbQsSOkgdaUMJ9zTlDTD/GYlwohmIE2u0gaxHYiVHEn1Fw9mZ/ktJWgw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "assertion-error": "^2.0.1",
+        "check-error": "^2.1.1",
+        "deep-eql": "^5.0.1",
+        "loupe": "^3.1.0",
+        "pathval": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/check-error": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/check-error/-/check-error-2.1.1.tgz",
+      "integrity": "sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 16"
+      }
+    },
     "node_modules/cliui": {
       "version": "7.0.4",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
@@ -1959,6 +2401,19 @@
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
       "license": "MIT"
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -1966,6 +2421,85 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/css.escape": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
+      "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cssstyle": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.6.0.tgz",
+      "integrity": "sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/css-color": "^3.2.0",
+        "rrweb-cssom": "^0.8.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cssstyle/node_modules/rrweb-cssom": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.8.0.tgz",
+      "integrity": "sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/data-urls": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
+      "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/data-urls/node_modules/tr46": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.1.tgz",
+      "integrity": "sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/data-urls/node_modules/webidl-conversions": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/data-urls/node_modules/whatwg-url": {
+      "version": "14.2.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
+      "integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tr46": "^5.1.0",
+        "webidl-conversions": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/debug": {
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
@@ -1984,6 +2518,66 @@
         }
       }
     },
+    "node_modules/decimal.js": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.6.0.tgz",
+      "integrity": "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/deep-eql": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-5.0.2.tgz",
+      "integrity": "sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/dequal": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
+      "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/dom-accessibility-api": {
+      "version": "0.5.16",
+      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
+      "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/electron-to-chromium": {
       "version": "1.5.178",
       "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.178.tgz",
@@ -1997,6 +2591,75 @@
       "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
       "license": "MIT"
     },
+    "node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-module-lexer": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.7.0.tgz",
+      "integrity": "sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-set-tostringtag": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/esbuild": {
       "version": "0.21.5",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
@@ -2045,6 +2708,26 @@
         "node": ">=6"
       }
     },
+    "node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0"
+      }
+    },
+    "node_modules/expect-type": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.2.2.tgz",
+      "integrity": "sha512-JhFGDVJ7tmDJItKhYgJCGLOWjuK9vPxiXoUFLwLDc99NlmklilbiQJwoctZtt13+xMw91MCk/REan6MWHqDjyA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
     "node_modules/faye-websocket": {
       "version": "0.11.4",
       "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
@@ -2091,6 +2774,23 @@
         "@firebase/util": "1.9.3"
       }
     },
+    "node_modules/form-data": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.4.tgz",
+      "integrity": "sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "hasown": "^2.0.2",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -2106,6 +2806,16 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/ga-4-react": {
       "version": "0.1.281",
       "resolved": "https://registry.npmjs.org/ga-4-react/-/ga-4-react-0.1.281.tgz",
@@ -2134,6 +2844,45 @@
         "node": "6.* || 8.* || >= 10.*"
       }
     },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/globals": {
       "version": "11.12.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
@@ -2144,18 +2893,137 @@
         "node": ">=4"
       }
     },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-tostringtag": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-symbols": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/html-encoding-sniffer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
+      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-encoding": "^3.1.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/http-parser-js": {
       "version": "0.5.10",
       "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.10.tgz",
       "integrity": "sha512-Pysuw9XpUq5dVc/2SMHpuTY01RFl8fttgcyunjL7eEMhGM3cI4eOmiCycJDVCo/7O7ClfQD3SaI6ftDzqOXYMA==",
       "license": "MIT"
     },
+    "node_modules/http-proxy-agent": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/https-proxy-agent": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/idb": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/idb/-/idb-7.1.1.tgz",
       "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ==",
       "license": "ISC"
     },
+    "node_modules/indent-string": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz",
+      "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-fullwidth-code-point": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
@@ -2165,12 +3033,97 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-potential-custom-element-name": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
+      "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
       "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
       "license": "MIT"
     },
+    "node_modules/jsdom": {
+      "version": "25.0.1",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-25.0.1.tgz",
+      "integrity": "sha512-8i7LzZj7BF8uplX+ZyOlIz86V6TAsSs+np6m1kpW9u0JWi4z/1t+FzcK1aek+ybTnAC4KhBL4uXCNT0wcUIeCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cssstyle": "^4.1.0",
+        "data-urls": "^5.0.0",
+        "decimal.js": "^10.4.3",
+        "form-data": "^4.0.0",
+        "html-encoding-sniffer": "^4.0.0",
+        "http-proxy-agent": "^7.0.2",
+        "https-proxy-agent": "^7.0.5",
+        "is-potential-custom-element-name": "^1.0.1",
+        "nwsapi": "^2.2.12",
+        "parse5": "^7.1.2",
+        "rrweb-cssom": "^0.7.1",
+        "saxes": "^6.0.0",
+        "symbol-tree": "^3.2.4",
+        "tough-cookie": "^5.0.0",
+        "w3c-xmlserializer": "^5.0.0",
+        "webidl-conversions": "^7.0.0",
+        "whatwg-encoding": "^3.1.1",
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0",
+        "ws": "^8.18.0",
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "canvas": "^2.11.2"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/jsdom/node_modules/tr46": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.1.tgz",
+      "integrity": "sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/jsdom/node_modules/webidl-conversions": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/jsdom/node_modules/whatwg-url": {
+      "version": "14.2.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
+      "integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tr46": "^5.1.0",
+        "webidl-conversions": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/jsesc": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
@@ -2221,6 +3174,13 @@
         "loose-envify": "cli.js"
       }
     },
+    "node_modules/loupe": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/loupe/-/loupe-3.2.1.tgz",
+      "integrity": "sha512-CdzqowRJCeLU72bHvWqwRBBlLcMEtIvGrlvef74kMnV2AolS9Y8xUv1I0U/MNAWMhBlKIoyuEgoJ0t/bbwHbLQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/lru-cache": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
@@ -2231,6 +3191,70 @@
         "yallist": "^3.0.2"
       }
     },
+    "node_modules/lz-string": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
+      "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "bin": {
+        "lz-string": "bin/bin.js"
+      }
+    },
+    "node_modules/magic-string": {
+      "version": "0.30.21",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
+      "integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.5"
+      }
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/min-indent": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
+      "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/monaco-editor": {
       "version": "0.52.2",
       "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.52.2.tgz",
@@ -2291,6 +3315,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/nwsapi": {
+      "version": "2.2.22",
+      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.22.tgz",
+      "integrity": "sha512-ujSMe1OWVn55euT1ihwCI1ZcAaAU3nxUiDwfDQldc51ZXaB9m2AyOn6/jh1BLe2t/G8xd6uKG1UBF2aZJeg2SQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -2301,6 +3332,36 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/parse5": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.3.0.tgz",
+      "integrity": "sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^6.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/pathe": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-1.1.2.tgz",
+      "integrity": "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/pathval": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/pathval/-/pathval-2.0.1.tgz",
+      "integrity": "sha512-//nshmD55c46FuFw26xV/xFAaB5HF9Xdap7HJBBnrKdAd6/GxDBaNA1870O79+9ueg61cZLSVc+OaFlfmObYVQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.16"
+      }
+    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -2337,6 +3398,44 @@
         "node": "^10 || ^12 || >=14"
       }
     },
+    "node_modules/pretty-format": {
+      "version": "27.5.1",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
+      "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "ansi-regex": "^5.0.1",
+        "ansi-styles": "^5.0.0",
+        "react-is": "^17.0.1"
+      },
+      "engines": {
+        "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
+      }
+    },
+    "node_modules/pretty-format/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/pretty-format/node_modules/react-is": {
+      "version": "17.0.2",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
+      "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
     "node_modules/prop-types": {
       "version": "15.8.1",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
@@ -2375,6 +3474,16 @@
         "pbts": "bin/pbts"
       }
     },
+    "node_modules/punycode": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
+      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/react": {
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
@@ -2427,6 +3536,20 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/redent": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
+      "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "indent-string": "^4.0.0",
+        "strip-indent": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/require-directory": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -2476,6 +3599,13 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/rrweb-cssom": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.7.1.tgz",
+      "integrity": "sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/safe-buffer": {
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@@ -2496,6 +3626,26 @@
       ],
       "license": "MIT"
     },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/saxes": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
+      "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "xmlchars": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=v12.22.7"
+      }
+    },
     "node_modules/scheduler": {
       "version": "0.23.2",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
@@ -2515,6 +3665,13 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/siginfo": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz",
+      "integrity": "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/source-map-js": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
@@ -2525,12 +3682,26 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/stackback": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",
+      "integrity": "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/state-local": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz",
       "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w==",
       "license": "MIT"
     },
+    "node_modules/std-env": {
+      "version": "3.10.0",
+      "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.10.0.tgz",
+      "integrity": "sha512-5GS12FdOZNliM5mAOxFRg7Ir0pWz8MdpYm6AY6VPkGpbA7ZzmbzNcBJQ0GPvvyWgcY7QAhCgf9Uy89I03faLkg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/string-width": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
@@ -2557,6 +3728,103 @@
         "node": ">=8"
       }
     },
+    "node_modules/strip-indent": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
+      "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "min-indent": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/symbol-tree": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+      "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinybench": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
+      "integrity": "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinyexec": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-0.3.2.tgz",
+      "integrity": "sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinypool": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-1.1.1.tgz",
+      "integrity": "sha512-Zba82s87IFq9A9XmjiX5uZA/ARWDrB03OHlq+Vw1fSdt0I+4/Kutwy8BP4Y/y/aORMo61FQ0vIb5j44vSo5Pkg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.0.0 || >=20.0.0"
+      }
+    },
+    "node_modules/tinyrainbow": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-1.2.0.tgz",
+      "integrity": "sha512-weEDEq7Z5eTHPDh4xjX789+fHfF+P8boiFB+0vbWzpbnbsEr/GRaohi/uMKxg8RZMXnl1ItAi/IUHWMsjDV7kQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/tinyspy": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/tinyspy/-/tinyspy-3.0.2.tgz",
+      "integrity": "sha512-n1cw8k1k0x4pgA2+9XrOkFydTerNcJ1zWCO5Nn9scWHTD+5tp8dghT2x1uduQePZTZgd3Tupf+x9BxJjeJi77Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/tldts": {
+      "version": "6.1.86",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.86.tgz",
+      "integrity": "sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tldts-core": "^6.1.86"
+      },
+      "bin": {
+        "tldts": "bin/cli.js"
+      }
+    },
+    "node_modules/tldts-core": {
+      "version": "6.1.86",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.86.tgz",
+      "integrity": "sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tough-cookie": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-5.1.2.tgz",
+      "integrity": "sha512-FVDYdxtnj0G6Qm/DhNPSb8Ju59ULcup3tuJxkFb5K8Bv2pUXILbf0xZWU8PX8Ov19OXljbUyveOFwRMwkXzO+A==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tldts": "^6.1.32"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/tr46": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
@@ -2666,6 +3934,108 @@
         }
       }
     },
+    "node_modules/vite-node": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-2.1.9.tgz",
+      "integrity": "sha512-AM9aQ/IPrW/6ENLQg3AGY4K1N2TGZdR5e4gu/MmmR2xR3Ll1+dib+nook92g4TV3PXVyeyxdWwtaCAiUL0hMxA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cac": "^6.7.14",
+        "debug": "^4.3.7",
+        "es-module-lexer": "^1.5.4",
+        "pathe": "^1.1.2",
+        "vite": "^5.0.0"
+      },
+      "bin": {
+        "vite-node": "vite-node.mjs"
+      },
+      "engines": {
+        "node": "^18.0.0 || >=20.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/vitest": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-2.1.9.tgz",
+      "integrity": "sha512-MSmPM9REYqDGBI8439mA4mWhV5sKmDlBKWIYbA3lRb2PTHACE0mgKwA8yQ2xq9vxDTuk4iPrECBAEW2aoFXY0Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/expect": "2.1.9",
+        "@vitest/mocker": "2.1.9",
+        "@vitest/pretty-format": "^2.1.9",
+        "@vitest/runner": "2.1.9",
+        "@vitest/snapshot": "2.1.9",
+        "@vitest/spy": "2.1.9",
+        "@vitest/utils": "2.1.9",
+        "chai": "^5.1.2",
+        "debug": "^4.3.7",
+        "expect-type": "^1.1.0",
+        "magic-string": "^0.30.12",
+        "pathe": "^1.1.2",
+        "std-env": "^3.8.0",
+        "tinybench": "^2.9.0",
+        "tinyexec": "^0.3.1",
+        "tinypool": "^1.0.1",
+        "tinyrainbow": "^1.2.0",
+        "vite": "^5.0.0",
+        "vite-node": "2.1.9",
+        "why-is-node-running": "^2.3.0"
+      },
+      "bin": {
+        "vitest": "vitest.mjs"
+      },
+      "engines": {
+        "node": "^18.0.0 || >=20.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@edge-runtime/vm": "*",
+        "@types/node": "^18.0.0 || >=20.0.0",
+        "@vitest/browser": "2.1.9",
+        "@vitest/ui": "2.1.9",
+        "happy-dom": "*",
+        "jsdom": "*"
+      },
+      "peerDependenciesMeta": {
+        "@edge-runtime/vm": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@vitest/browser": {
+          "optional": true
+        },
+        "@vitest/ui": {
+          "optional": true
+        },
+        "happy-dom": {
+          "optional": true
+        },
+        "jsdom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/w3c-xmlserializer": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+      "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/webidl-conversions": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
@@ -2695,6 +4065,29 @@
         "node": ">=0.8.0"
       }
     },
+    "node_modules/whatwg-encoding": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "iconv-lite": "0.6.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/whatwg-mimetype": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/whatwg-url": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
@@ -2705,6 +4098,23 @@
         "webidl-conversions": "^3.0.0"
       }
     },
+    "node_modules/why-is-node-running": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz",
+      "integrity": "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "siginfo": "^2.0.0",
+        "stackback": "0.0.2"
+      },
+      "bin": {
+        "why-is-node-running": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/wrap-ansi": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
@@ -2722,6 +4132,28 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
+    "node_modules/ws": {
+      "version": "8.18.3",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.3.tgz",
+      "integrity": "sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/xml-formatter": {
       "version": "3.6.6",
       "resolved": "https://registry.npmjs.org/xml-formatter/-/xml-formatter-3.6.6.tgz",
@@ -2734,6 +4166,16 @@
         "node": ">= 16"
       }
     },
+    "node_modules/xml-name-validator": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+      "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/xml-parser-xo": {
       "version": "4.1.4",
       "resolved": "https://registry.npmjs.org/xml-parser-xo/-/xml-parser-xo-4.1.4.tgz",
@@ -2743,6 +4185,13 @@
         "node": ">= 16"
       }
     },
+    "node_modules/xmlchars": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/y18n": {
       "version": "5.0.8",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index d8aa3994..5e440c22 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,11 +1,12 @@
 {
   "name": "xslt-playground",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": true,
   "scripts": {
     "dev": "vite",
     "build": "vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "test": "vitest run"
   },
   "dependencies": {
     "@monaco-editor/react": "^4.7.0",
@@ -17,7 +18,11 @@
     "xml-formatter": "^3.6.6"
   },
   "devDependencies": {
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
+    "jsdom": "^25.0.1",
     "@vitejs/plugin-react": "^4.1.0",
-    "vite": "^5.0.0"
+    "vite": "^5.0.0",
+    "vitest": "^2.1.4"
   }
 }
diff --git a/frontend/public/favicon.ico b/frontend/public/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..70434749f62153ba60d2514d0988399f72dafbc4
GIT binary patch
literal 4286
zcmc(jU4&F&7{^Z++0WXU-L*t97g0p%qU^=8DWZrXmSRbk*odXri(w-xQhQN~CEAOa
zNJ%ADqPj{qT`b*{zIOWBn%W{=#J}^*`p-V|?E9YcwyHDhH_!V%AOHWHkD0?p(USPD
zP>AF`D&?Z6D~h7EF>xx|5+nKQE3VlWMmmutKZ~8nl5fKuaDf+RKwR~Z9Oota`e%-H
zz@q15ZR?@?5S{6vc3AA3t%vSIbe<n+hsMt6+G5sedQS)Q(Aa)mTg*C5@5!M&i0x&b
zajZOrv*pJ)|Mmf9f1$?ZkC#xIxlq$#KVy>aqk%k#?PFfYB>$_Q#%fx6CQ0|<fgA+e
z!@Mi{j$iz*e;%#s**Ty7-ToW|TW8)Er@jM(=b!#JE5)j&p7rV9-q!}f)|vN3dP{Wq
z+c}^9wZ1kG+r$0IH)Wifeg=L2rTO2f99?is)T5uo(%yMk*YU*b3S9o(E0^9PuHzT~
z$uEbUpFw+0>|PFy_CEgV2VDO2)lt5G`ufxV-q(Y5pFw-cdVE(s^e?^y{+9p!+5NT8
zVExYRSO(3%_SasrKD~V&dNcZtU%vnP+$UXsd;UdRdyZ~x1);BwuIn%UA@{%U{-dA7
zk={A9r>vQm=(_(y{I!Npf4HX=f~_;}i>~L7zW?o<Pk*Sp1%j<J?~7^vcFw0ixTyui
z_AqZ_+VjWuC+QAsYzDD?%<IVK@A$h(Tzr266CbYB{r>A-u9I~8*Ed6Bdv#6!{=58j
zFV{(W($lxD9@}s0f4Wc8+q0$#7CU3>q5BY>ovWK*v2(T_x)0IWR%nC^J?pB6<U%xh
YRy86^Hm_(vmTc&1K$h752mJ5-Z><IB=Kufz

literal 0
HcmV?d00001

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 3a66054b..eaa613b1 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -1,5 +1,5 @@
-import { useState, useEffect, useCallback, useRef } from "react";
-import GA4React from 'ga-4-react';
+import { useState, useEffect, useCallback, useRef, useMemo } from "react";
+import GA4React from "ga-4-react";
 import Editor from "@monaco-editor/react";
 import formatXML from "xml-formatter";
 import { initializeApp } from "firebase/app";
@@ -10,101 +10,20 @@ import {
   signOut,
 } from "firebase/auth";
 import logo from "./logo.svg";
-import Buymeacoffee from "./BuyMeACoffee";
+import TabsNav from "./components/TabsNav";
+import DataPipelineHeader from "./components/DataPipelineHeader";
+import FeedbackWidget from "./components/FeedbackWidget";
+import BuyMeACoffee from "./components/BuyMeACoffee";
+import {
+  parseErrorLines,
+  stripParamBlock,
+  injectParamBlock,
+  addParams,
+  extractParamNames,
+  setStylesheetVersion,
+} from "./lib/workspaceUtils";
 
-const PARAM_START = "<!--PARAMS_START-->";
-const PARAM_END = "<!--PARAMS_END-->";
-
-function parseErrorLines(txt) {
-  if (!txt) return [];
-  const starts = [];
-  const regex = /(^|\r?\n)(Warning|Error)\b/g; // tokens at start or after newline
-  let m;
-  while ((m = regex.exec(txt)) !== null) {
-    const start = m.index + (m[1] ? m[1].length : 0);
-    starts.push(start);
-  }
-  if (starts.length === 0) {
-    return [txt.trim()].filter(Boolean);
-  }
-  const lines = [];
-  // Any leading text before the first token as its own entry
-  const leading = txt.slice(0, starts[0]).trim();
-  if (leading) lines.push(leading);
-  for (let i = 0; i < starts.length; i++) {
-    const s = starts[i];
-    const e = i + 1 < starts.length ? starts[i + 1] : txt.length;
-    const chunk = txt.slice(s, e).trim();
-    if (chunk) lines.push(chunk);
-  }
-  return lines;
-}
-
-function stripParamBlock(text) {
-  const start = text.indexOf(PARAM_START);
-  const end = text.indexOf(PARAM_END);
-  let result = text;
-  if (start !== -1 && end !== -1 && end > start) {
-    let before = text.slice(0, start);
-    let after = text.slice(end + PARAM_END.length);
-    if (before.endsWith("\n")) before = before.slice(0, -1);
-    if (after.startsWith("\n")) after = after.slice(1);
-    result = before + after;
-  }
-  return result.replace(
-    /[ \t]*<xsl:param\b[^>]*?(?:\/>|>[\s\S]*?<\/xsl:param>)[ \t]*(?:\r?\n)?/g,
-    "",
-  );
-}
-
-
-
-function getParamBlock(text) {
-  const start = text.indexOf(PARAM_START);
-  const end = text.indexOf(PARAM_END);
-  if (start !== -1 && end !== -1 && end > start) {
-    return text.slice(start, end);
-  }
-  return text;
-}
-
-function injectParamBlock(text, params) {
-  const clean = stripParamBlock(text);
-  const match = clean.match(/<xsl:stylesheet[^>]*>/);
-  if (!match) return clean;
-  const idx = match.index + match[0].length;
-  const paramLines = params
-    .filter((p) => p.name)
-    .map((p) => `<xsl:param name="${p.name}"/>`)
-    .join("\n");
-  const block = `\n${PARAM_START}\n${paramLines}\n${PARAM_END}`;
-  return clean.slice(0, idx) + block + clean.slice(idx);
-}
-
-function addParams(text, tab) {
-  const extractedParams = extractParamNames(text);
-  const existingNames = new Set(tab.params.map(p => p.name));
-  const newParams = [...tab.params];
-
-  extractedParams.forEach(name => {
-    if (!existingNames.has(name)) {
-      newParams.push({ name, value: "<root/>", open: false });
-    }
-  });
-
-  return newParams;
-}
-
-function extractParamNames(text) {
-  const clean = getParamBlock(text);
-  const names = new Set();
-  const regex = /<xsl:param[^>]*name="([^"]+)"[^>]*>/g;
-  let m;
-  while ((m = regex.exec(clean))) {
-    names.add(m[1]);
-  }
-  return Array.from(names);
-}
+/* global __APP_VERSION__ */
 
 function debounce(fn, delay) {
   let t;
@@ -114,23 +33,20 @@ function debounce(fn, delay) {
   };
 }
 
-function setStylesheetVersion(text, version) {
-  const regex = /<xsl:stylesheet\b([^>]*)>/;
-  const match = text.match(regex);
-  if (!match) return text;
-  let attrs = match[1];
-  if (/version=['"][^'"]*['"]/.test(attrs)) {
-    attrs = attrs.replace(/version=['"][^'"]*['"]/, `version="${version}"`);
-  } else {
-    attrs += ` version="${version}"`;
-  }
-  return text.replace(regex, `<xsl:stylesheet${attrs}>`);
-}
-
 const env = window.env || import.meta.env;
 const goPro = env.VITE_GO_PRO === "true";
 const adsenseClient = env.VITE_ADSENSE_CLIENT;
 const adsenseSlot = env.VITE_ADSENSE_SLOT;
+const defaultRepoUrl = "https://github.com/alexandrev/xslt-lab";
+const repoUrl = env.VITE_REPO_URL || defaultRepoUrl;
+const newsUrl = env.VITE_NEWS_URL || "https://alexandrev.github.io/xslt-lab/";
+const resolvedVersion =
+  typeof __APP_VERSION__ !== "undefined" && __APP_VERSION__
+    ? __APP_VERSION__
+    : env.VITE_APP_VERSION || "";
+const changelogUrl = `${repoUrl}/blob/main/CHANGELOG.md${
+  resolvedVersion ? `#${changelogAnchor(resolvedVersion)}` : ""
+}`;
 
 function defaultTab() {
   return {
@@ -141,6 +57,72 @@ function defaultTab() {
   };
 }
 
+const MAX_WORKSPACES = 3;
+const WORKSPACE_EXPORT_VERSION = 1;
+const RESULT_HEIGHT_KEY = "resultPaneHeight";
+const DEFAULT_RESULT_RATIO = 0.4;
+const MIN_RESULT_HEIGHT = 180;
+const MIN_MAIN_HEIGHT = 320;
+const PARAM_WIDTH_KEY = "paramsPaneWidth";
+const DEFAULT_PARAM_WIDTH = 320;
+const MIN_PARAM_WIDTH = 220;
+const MIN_EDITOR_WIDTH = 360;
+
+function defaultWorkspaceStatus() {
+  return {
+    result: "",
+    duration: null,
+    error: "",
+    errorLines: [],
+    traceEntries: [],
+    traceText: "",
+    showRawTrace: false,
+  };
+}
+
+function normalizeWorkspaceImport(payload) {
+  if (!payload || typeof payload !== "object") {
+    throw new Error("Workspace file is empty or invalid.");
+  }
+  if (
+    payload.schemaVersion &&
+    payload.schemaVersion !== WORKSPACE_EXPORT_VERSION
+  ) {
+    throw new Error(
+      `Unsupported workspace format version ${payload.schemaVersion}.`,
+    );
+  }
+  const workspace = payload.workspace || payload;
+  if (!workspace.xslt || typeof workspace.xslt !== "string") {
+    throw new Error("Workspace file is missing the XSLT content.");
+  }
+  const baseParams = defaultTab().params;
+  const params = Array.isArray(workspace.params)
+    ? workspace.params.map((p, idx) => ({
+        name: typeof p?.name === "string" ? p.name : `param${idx + 1}`,
+        value: typeof p?.value === "string" ? p.value : "",
+        open: Boolean(p?.open),
+      }))
+    : baseParams;
+  const status =
+    payload.status && typeof payload.status === "object"
+      ? { ...defaultWorkspaceStatus(), ...payload.status }
+      : defaultWorkspaceStatus();
+  return {
+    workspace: {
+      params,
+      xslt: workspace.xslt,
+      version: workspace.version || "1.0",
+    },
+    status,
+  };
+}
+
+function changelogAnchor(version) {
+  if (!version) return "";
+  return `v${version}`.replace(/[^0-9a-zA-Z]+/g, "").toLowerCase();
+}
+
 export default function App() {
   // Load persisted workspace from localStorage (if present)
   let initialTabs = [defaultTab()];
@@ -148,27 +130,90 @@ export default function App() {
     const stored = localStorage.getItem("tabs");
     if (stored) initialTabs = JSON.parse(stored);
   } catch {}
+  if (initialTabs.length > MAX_WORKSPACES) {
+    initialTabs = initialTabs.slice(0, MAX_WORKSPACES);
+  }
   let initialActive = initialTabs[0]?.id;
   try {
     const sAct = localStorage.getItem("active");
     if (sAct) initialActive = JSON.parse(sAct);
   } catch {}
 
+  const readStoredWorkspaceStatus = () => {
+    try {
+      const stored = localStorage.getItem("workspaceStatus");
+      if (stored) {
+        return JSON.parse(stored);
+      }
+    } catch {}
+    return {};
+  };
+
   const [tabs, setTabs] = useState(initialTabs);
   const [active, setActive] = useState(initialActive);
+  const [workspaceStatus, setWorkspaceStatus] = useState(() => {
+    const stored = readStoredWorkspaceStatus();
+    const initialStatus = {};
+    initialTabs.forEach((tab) => {
+      initialStatus[tab.id] = stored[tab.id]
+        ? { ...defaultWorkspaceStatus(), ...stored[tab.id] }
+        : defaultWorkspaceStatus();
+    });
+    return initialStatus;
+  });
   const [editorFocused, setEditorFocused] = useState(false);
-  const [result, setResult] = useState("");
-  const [error, setError] = useState("");
-  const [errorLines, setErrorLines] = useState([]);
-  const [duration, setDuration] = useState(null);
   const [user, setUser] = useState(null);
   const [auth, setAuth] = useState(null);
   const resultEditorRef = useRef(null);
+  const traceHoverTimeoutRef = useRef(null);
+  const traceTableWrapRef = useRef(null);
+  const traceNameRefs = useRef([]);
+  const tabsRef = useRef(tabs);
   const [traceEnabled, setTraceEnabled] = useState(() => {
     try { return JSON.parse(localStorage.getItem("traceEnabled") || "false"); } catch { return false; }
   });
-  const [traceEntries, setTraceEntries] = useState([]);
   const [traceCollapsed, setTraceCollapsed] = useState(false);
+  const [traceHover, setTraceHover] = useState(null);
+  const [traceNameWidth, setTraceNameWidth] = useState(240);
+  const [traceScrollLeft, setTraceScrollLeft] = useState(0);
+  const [paramsCollapsed, setParamsCollapsed] = useState(false);
+  const [errorCollapsed, setErrorCollapsed] = useState(false);
+  const workspaceImportRef = useRef(null);
+  const resultResizeState = useRef({ startY: 0, startHeight: MIN_RESULT_HEIGHT });
+  const paramResizeState = useRef({ startX: 0, startWidth: DEFAULT_PARAM_WIDTH });
+  const [resultHeight, setResultHeight] = useState(() => {
+    try {
+      const stored = localStorage.getItem(RESULT_HEIGHT_KEY);
+      if (stored) {
+        const parsed = JSON.parse(stored);
+        if (typeof parsed === "number" && Number.isFinite(parsed)) {
+          return parsed;
+        }
+      }
+    } catch {}
+    return null;
+  });
+  const [paramWidth, setParamWidth] = useState(() => {
+    if (typeof window === "undefined") return DEFAULT_PARAM_WIDTH;
+    try {
+      const stored = localStorage.getItem(PARAM_WIDTH_KEY);
+      if (stored) {
+        const parsed = JSON.parse(stored);
+        if (typeof parsed === "number" && Number.isFinite(parsed)) {
+          return Math.max(parsed, MIN_PARAM_WIDTH);
+        }
+      }
+    } catch {}
+    return DEFAULT_PARAM_WIDTH;
+  });
+  const [isResizingResult, setIsResizingResult] = useState(false);
+  const [isResizingParams, setIsResizingParams] = useState(false);
+  const [viewportHeight, setViewportHeight] = useState(() =>
+    typeof window !== "undefined" ? window.innerHeight : 0,
+  );
+  const [viewportWidth, setViewportWidth] = useState(() =>
+    typeof window !== "undefined" ? window.innerWidth : 0,
+  );
 
   const backendBase = (env.VITE_BACKEND_URL || "").replace(/\/$/, "");
   console.log("Using this URL as backendURL:", backendBase);
@@ -186,10 +231,284 @@ export default function App() {
     } catch {}
   }, [tabs, active]);
 
+  useEffect(() => {
+    try {
+      localStorage.setItem("workspaceStatus", JSON.stringify(workspaceStatus));
+    } catch {}
+  }, [workspaceStatus]);
+
   useEffect(() => {
     try { localStorage.setItem("traceEnabled", JSON.stringify(traceEnabled)); } catch {}
   }, [traceEnabled]);
 
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handleResize = () => {
+      setViewportHeight(window.innerHeight);
+      setViewportWidth(window.innerWidth);
+    };
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+
+  useEffect(() => {
+    try {
+      if (resultHeight === null) {
+        localStorage.removeItem(RESULT_HEIGHT_KEY);
+      } else {
+        localStorage.setItem(RESULT_HEIGHT_KEY, JSON.stringify(resultHeight));
+      }
+    } catch {}
+  }, [resultHeight]);
+  useEffect(() => {
+    try {
+      localStorage.setItem(PARAM_WIDTH_KEY, JSON.stringify(paramWidth));
+    } catch {}
+  }, [paramWidth]);
+
+  useEffect(() => {
+    if (traceCollapsed) {
+      setTraceHover(null);
+      setTraceScrollLeft(0);
+    }
+  }, [traceCollapsed]);
+
+  useEffect(() => {
+    setWorkspaceStatus((prev) => {
+      let changed = false;
+      const next = {};
+      tabs.forEach((tab) => {
+        if (prev[tab.id]) {
+          next[tab.id] = prev[tab.id];
+        } else {
+          next[tab.id] = defaultWorkspaceStatus();
+          changed = true;
+        }
+      });
+      if (Object.keys(prev).length !== tabs.length) {
+        changed = true;
+      }
+      return changed ? next : prev;
+    });
+  }, [tabs]);
+
+  useEffect(() => {
+    if (tabs.length === 0) {
+      return;
+    }
+    if (!tabs.some((t) => t.id === active)) {
+      setActive(tabs[0].id);
+    }
+  }, [tabs, active]);
+
+  useEffect(() => {
+    if (!traceEnabled) {
+      setTraceHover(null);
+      setTraceCollapsed(false);
+    }
+  }, [traceEnabled]);
+
+  useEffect(() => {
+    const closeOnChange = () => setTraceHover(null);
+    window.addEventListener("scroll", closeOnChange, true);
+    window.addEventListener("resize", closeOnChange);
+    return () => {
+      window.removeEventListener("scroll", closeOnChange, true);
+      window.removeEventListener("resize", closeOnChange);
+    };
+  }, []);
+
+  const activeTab = tabs.find((t) => t.id === active) || tabs[0];
+  const activeStatus = activeTab
+    ? (workspaceStatus[activeTab.id] || defaultWorkspaceStatus())
+    : defaultWorkspaceStatus();
+  const {
+    result,
+    duration,
+    error,
+    errorLines,
+    traceEntries,
+    traceText,
+    showRawTrace,
+  } = activeStatus;
+  const MAX_ERROR_LINES = 3;
+  const limitedErrorLines = (errorLines || []).slice(0, MAX_ERROR_LINES);
+  const hasHiddenErrors = (errorLines || []).length > MAX_ERROR_LINES;
+  const canCopyErrors = Boolean((errorLines && errorLines.length) || error);
+  const showResultPane = !error;
+  const TRACE_NAME_LIMIT = 80;
+  const TRACE_VALUE_LIMIT = 200;
+  const EMPTY_SYMBOL = "(empty)";
+  const TRACE_NAME_MIN_WIDTH = 120;
+  const TRACE_NAME_PADDING = 40;
+  const clampResultPaneHeight = useCallback(
+    (value) => {
+      const numericValue =
+        typeof value === "number" && Number.isFinite(value)
+          ? value
+          : MIN_RESULT_HEIGHT;
+      if (!viewportHeight) {
+        return Math.max(MIN_RESULT_HEIGHT, Math.round(numericValue));
+      }
+      const maxHeight = Math.max(
+        MIN_RESULT_HEIGHT,
+        viewportHeight - MIN_MAIN_HEIGHT,
+      );
+      return Math.min(
+        Math.max(Math.round(numericValue), MIN_RESULT_HEIGHT),
+        maxHeight,
+      );
+    },
+    [viewportHeight],
+  );
+  const clampParamPaneWidth = useCallback(
+    (value) => {
+      const numericValue =
+        typeof value === "number" && Number.isFinite(value)
+          ? value
+          : DEFAULT_PARAM_WIDTH;
+      const viewportLimit =
+        viewportWidth && viewportWidth > 0
+          ? Math.max(MIN_PARAM_WIDTH, viewportWidth - MIN_EDITOR_WIDTH)
+          : Number.POSITIVE_INFINITY;
+      const maxWidth = Number.isFinite(viewportLimit)
+        ? viewportLimit
+        : Math.max(MIN_PARAM_WIDTH, numericValue);
+      return Math.min(
+        Math.max(Math.round(numericValue), MIN_PARAM_WIDTH),
+        maxWidth,
+      );
+    },
+    [viewportWidth],
+  );
+  const fallbackViewportHeight = viewportHeight || 800;
+  const resolvedResultHeight = useMemo(
+    () =>
+      clampResultPaneHeight(
+        resultHeight ??
+          Math.round(fallbackViewportHeight * DEFAULT_RESULT_RATIO),
+      ),
+    [resultHeight, fallbackViewportHeight, clampResultPaneHeight],
+  );
+  const isCustomResultHeight = resultHeight !== null;
+  useEffect(() => {
+    setParamWidth((prev) => clampParamPaneWidth(prev));
+  }, [clampParamPaneWidth]);
+
+  useEffect(() => {
+    if (!error) {
+      setErrorCollapsed(false);
+    }
+  }, [error]);
+
+  const clampTraceNameWidth = useCallback(() => {
+    const container = traceTableWrapRef.current;
+    if (!container) {
+      return;
+    }
+    const maxWidth = Math.max(
+      TRACE_NAME_MIN_WIDTH,
+      container.clientWidth - 160,
+    );
+    setTraceNameWidth((prev) =>
+      Math.min(Math.max(prev, TRACE_NAME_MIN_WIDTH), maxWidth),
+    );
+  }, []);
+
+  if (traceNameRefs.current.length !== traceEntries.length) {
+    traceNameRefs.current.length = traceEntries.length;
+  }
+
+  useEffect(() => {
+    clampTraceNameWidth();
+  }, [traceCollapsed, traceEntries.length, clampTraceNameWidth]);
+
+  useEffect(() => {
+    const handleResize = () => clampTraceNameWidth();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [clampTraceNameWidth]);
+
+  useEffect(() => {
+    setTraceScrollLeft(0);
+  }, [traceEntries]);
+
+  useEffect(() => {
+    setResultHeight((prev) => {
+      if (prev === null) return prev;
+      const clamped = clampResultPaneHeight(prev);
+      return clamped === prev ? prev : clamped;
+    });
+  }, [clampResultPaneHeight]);
+
+  useEffect(() => {
+    if (!isResizingResult) return;
+    const handleMove = (event) => {
+      event.preventDefault();
+      const delta = event.clientY - resultResizeState.current.startY;
+      const nextHeight = clampResultPaneHeight(
+        resultResizeState.current.startHeight - delta,
+      );
+      setResultHeight(nextHeight);
+    };
+    const stop = () => setIsResizingResult(false);
+    window.addEventListener("mousemove", handleMove);
+    window.addEventListener("mouseup", stop);
+    return () => {
+      window.removeEventListener("mousemove", handleMove);
+      window.removeEventListener("mouseup", stop);
+    };
+  }, [isResizingResult, clampResultPaneHeight]);
+
+  useEffect(() => {
+    if (typeof document === "undefined") return undefined;
+    if (!isResizingResult) return undefined;
+    const { style } = document.body;
+    const previousCursor = style.cursor;
+    const previousSelect = style.userSelect;
+    style.cursor = "row-resize";
+    style.userSelect = "none";
+    return () => {
+      style.cursor = previousCursor;
+      style.userSelect = previousSelect;
+    };
+  }, [isResizingResult]);
+  useEffect(() => {
+    if (!isResizingParams) return;
+    const handleMove = (event) => {
+      event.preventDefault();
+      const delta = event.clientX - paramResizeState.current.startX;
+      const nextWidth = clampParamPaneWidth(
+        paramResizeState.current.startWidth + delta,
+      );
+      setParamWidth(nextWidth);
+    };
+    const stop = () => setIsResizingParams(false);
+    window.addEventListener("mousemove", handleMove);
+    window.addEventListener("mouseup", stop);
+    return () => {
+      window.removeEventListener("mousemove", handleMove);
+      window.removeEventListener("mouseup", stop);
+    };
+  }, [isResizingParams, clampParamPaneWidth]);
+  useEffect(() => {
+    if (typeof document === "undefined") return undefined;
+    if (!isResizingParams) return undefined;
+    const { style } = document.body;
+    const previousCursor = style.cursor;
+    const previousSelect = style.userSelect;
+    style.cursor = "col-resize";
+    style.userSelect = "none";
+    return () => {
+      style.cursor = previousCursor;
+      style.userSelect = previousSelect;
+    };
+  }, [isResizingParams]);
+  useEffect(() => {
+    if (!paramsCollapsed) return;
+    setIsResizingParams(false);
+  }, [paramsCollapsed]);
+
   useEffect(() => {
     if (!goPro) return;
     try {
@@ -203,7 +522,170 @@ export default function App() {
     } catch {}
   }, []);
 
-  const activeTab = tabs.find((t) => t.id === active) || tabs[0];
+  useEffect(() => {
+    tabsRef.current = tabs;
+  }, [tabs]);
+
+  const updateWorkspaceStatus = useCallback((tabId, updates) => {
+    if (!tabId) return;
+    if (!tabsRef.current.some((t) => t.id === tabId)) {
+      return;
+    }
+    setWorkspaceStatus((prev) => {
+      const current = prev[tabId]
+        ? { ...defaultWorkspaceStatus(), ...prev[tabId] }
+        : defaultWorkspaceStatus();
+      const next =
+        typeof updates === "function"
+          ? updates(current)
+          : { ...current, ...updates };
+      return { ...prev, [tabId]: next };
+    });
+  }, []);
+
+  const truncateText = useCallback((text, limit) => {
+    if (!text) {
+      return "";
+    }
+    return text.length > limit ? `${text.slice(0, limit)}…` : text;
+  }, []);
+
+  const cancelTraceTooltipHide = useCallback(() => {
+    if (traceHoverTimeoutRef.current) {
+      clearTimeout(traceHoverTimeoutRef.current);
+      traceHoverTimeoutRef.current = null;
+    }
+  }, []);
+
+  const showTraceTooltip = useCallback((event, text) => {
+    cancelTraceTooltipHide();
+    const target = event.currentTarget;
+    if (!target) {
+      return;
+    }
+    const rect = target.getBoundingClientRect();
+    const padding = 16;
+    const pointerX = event.clientX;
+    const pointerY = event.clientY;
+    const desiredWidth = Math.max(rect.width, 280);
+    const maxWidth = Math.min(desiredWidth, window.innerWidth - padding * 2);
+    const left = Math.min(
+      Math.max(pointerX + 12, padding),
+      window.innerWidth - maxWidth - padding
+    );
+    const top = Math.min(pointerY + 16, window.innerHeight - padding - 40);
+    setTraceHover({
+      text: text || EMPTY_SYMBOL,
+      x: left,
+      y: top,
+      width: maxWidth
+    });
+  }, [cancelTraceTooltipHide]);
+
+  const hideTraceTooltip = useCallback(() => {
+    cancelTraceTooltipHide();
+    traceHoverTimeoutRef.current = window.setTimeout(() => {
+      setTraceHover(null);
+      traceHoverTimeoutRef.current = null;
+    }, 120);
+  }, [cancelTraceTooltipHide]);
+
+  const copyTraceHover = useCallback(() => {
+    if (!traceHover?.text) {
+      return;
+    }
+    try {
+      navigator.clipboard?.writeText(traceHover.text);
+    } catch (err) {
+      console.error("Clipboard copy failed", err);
+    }
+  }, [traceHover]);
+
+  const copyErrors = useCallback(() => {
+    const allLines = (errorLines && errorLines.length ? errorLines : error ? [error] : []);
+    const payload = allLines.join("\n").trim();
+    if (!payload) return;
+    try {
+      navigator.clipboard?.writeText(payload);
+    } catch (err) {
+      console.error("Copy errors failed", err);
+    }
+  }, [errorLines, error]);
+
+  const registerTraceNameRef = useCallback(
+    (index) => (node) => {
+      traceNameRefs.current[index] = node;
+    },
+    []
+  );
+
+  const autoSizeTraceNameColumn = useCallback(() => {
+    const container = traceTableWrapRef.current;
+    if (!container) {
+      return;
+    }
+    const maxAllowed = Math.max(TRACE_NAME_MIN_WIDTH, container.clientWidth - 160);
+    let maxWidth = TRACE_NAME_MIN_WIDTH;
+    traceNameRefs.current.forEach((el) => {
+      if (el) {
+        maxWidth = Math.max(maxWidth, el.scrollWidth + TRACE_NAME_PADDING);
+      }
+    });
+    setTraceNameWidth(Math.min(Math.max(maxWidth, TRACE_NAME_MIN_WIDTH), maxAllowed));
+  }, []);
+
+  const handleTraceDividerMouseDown = useCallback((event) => {
+    if (event.detail === 2) {
+      event.preventDefault();
+      autoSizeTraceNameColumn();
+      return;
+    }
+    if (event.button !== 0) {
+      return;
+    }
+    event.preventDefault();
+    const startX = event.clientX;
+    const startWidth = traceNameWidth;
+    const container = traceTableWrapRef.current;
+    const maxAllowed = container ? Math.max(TRACE_NAME_MIN_WIDTH, container.clientWidth - 160) : startWidth + 400;
+
+    const onMove = (moveEvent) => {
+      const delta = moveEvent.clientX - startX;
+      const newWidth = Math.min(Math.max(startWidth + delta, TRACE_NAME_MIN_WIDTH), maxAllowed);
+      setTraceNameWidth(newWidth);
+    };
+    const onUp = () => {
+      window.removeEventListener("mousemove", onMove);
+      window.removeEventListener("mouseup", onUp);
+    };
+    window.addEventListener("mousemove", onMove);
+    window.addEventListener("mouseup", onUp);
+  }, [autoSizeTraceNameColumn, traceNameWidth]);
+
+  const handleCopyAllTrace = useCallback(() => {
+    const chunks = traceEntries.map((entry) => {
+      const name = (entry?.name ?? "").toString();
+      const value = (entry?.value ?? "").toString();
+      return `${name}\n${value}`.trim();
+    }).filter(Boolean);
+    let combined = chunks.join("\n\n");
+    if (showRawTrace && traceText) {
+      combined = combined
+        ? `${combined}\n\n--- Raw Trace ---\n${traceText}`
+        : traceText;
+    }
+    if (!combined && traceText) {
+      combined = traceText;
+    }
+    if (!combined) {
+      return;
+    }
+    try {
+      navigator.clipboard?.writeText(combined);
+    } catch (err) {
+      console.error("Copy all trace failed", err);
+    }
+  }, [traceEntries, traceText, showRawTrace]);
 
   const syncParams = useCallback(() => {
     const names = extractParamNames(injectParamBlock(activeTab.xslt, activeTab.params));
@@ -228,9 +710,75 @@ export default function App() {
     );
   }, [active, activeTab.xslt]);
 
-  
+  const handleAddWorkspace = useCallback(() => {
+    setTabs((current) => {
+      if (current.length >= MAX_WORKSPACES) {
+        window.alert(`You can only open up to ${MAX_WORKSPACES} workspaces.`);
+        return current;
+      }
+      const nextTab = defaultTab();
+      setWorkspaceStatus((prev) => ({
+        ...prev,
+        [nextTab.id]: defaultWorkspaceStatus(),
+      }));
+      setActive(nextTab.id);
+      return [...current, nextTab];
+    });
+  }, [setActive, setWorkspaceStatus]);
 
-  const runTransform = debounce(async (xsltText, ver, p) => {
+  const handleRemoveWorkspace = useCallback(
+    (id) => {
+      setTabs((current) => {
+        if (current.length <= 1) {
+          return current;
+        }
+        const filtered = current.filter((t) => t.id !== id);
+        if (!filtered.length) {
+          return current;
+        }
+        const nextActiveId = id === active ? filtered[0].id : active;
+        setActive(nextActiveId);
+        setWorkspaceStatus((prev) => {
+          const next = { ...prev };
+          delete next[id];
+          if (nextActiveId && !next[nextActiveId]) {
+            next[nextActiveId] = defaultWorkspaceStatus();
+          }
+          return next;
+        });
+        return filtered;
+      });
+    },
+    [active, setActive, setWorkspaceStatus],
+  );
+
+  const handleClearWorkspace = useCallback(
+    (tabData) => {
+      const targetId = typeof tabData === "object" ? tabData?.id : tabData;
+      if (!targetId) return;
+      if (
+        !window.confirm(
+          "¿Limpiar este workspace? Se perderán los cambios no guardados.",
+        )
+      ) {
+        return;
+      }
+      setTabs((current) =>
+        current.map((t) => {
+          if (t.id !== targetId) return t;
+          const cleared = { ...defaultTab(), id: t.id, params: [] };
+          return cleared;
+        }),
+      );
+      setWorkspaceStatus((prev) => ({
+        ...prev,
+        [targetId]: defaultWorkspaceStatus(),
+      }));
+    },
+    [setTabs, setWorkspaceStatus],
+  );
+
+  const runTransform = debounce(async (xsltText, ver, p, tabId) => {
     const paramObj = {};
     p.forEach((pr) => {
       if (pr.name) paramObj[pr.name] = pr.value;
@@ -261,34 +809,55 @@ export default function App() {
           txt = await res.text();
         }
         const lines = parseErrorLines(txt || res.statusText || "");
-        setError(txt || res.statusText);
-        setErrorLines(lines);
-        setDuration(null);
-        setResult("");
-        setTraceEntries([]);
+        updateWorkspaceStatus(tabId, {
+          error: txt || res.statusText,
+          errorLines: lines,
+          duration: null,
+          result: "",
+          traceEntries: [],
+          traceText: "",
+          showRawTrace: false,
+        });
         return;
       }
       const data = await res.json();
-      setResult(data.result);
-      setDuration(data.duration_ms);
-      setError("");
-      setErrorLines([]);
-      setTraceEntries(traceEnabled ? (data.trace || []) : []);
+      updateWorkspaceStatus(tabId, {
+        result: data.result,
+        duration: data.duration_ms,
+        error: "",
+        errorLines: [],
+        showRawTrace: false,
+      });
+      const newEntries = traceEnabled ? (data.trace || []) : [];
+      updateWorkspaceStatus(tabId, (prev) => ({
+        ...prev,
+        traceEntries: newEntries,
+        traceText: traceEnabled ? (data.trace_text || "") : "",
+      }));
+      requestAnimationFrame(() => {
+        clampTraceNameWidth();
+      });
     } catch (e) {
       const txt = String(e);
-      setError(txt);
-      setErrorLines(parseErrorLines(txt));
-      setResult("");
-      setDuration(null);
-      setTraceEntries([]);
+      updateWorkspaceStatus(tabId, {
+        error: txt,
+        errorLines: parseErrorLines(txt),
+        result: "",
+        duration: null,
+        traceEntries: [],
+        traceText: "",
+        showRawTrace: false,
+      });
     }
   }, 500);
 
   useEffect(() => {
+    if (!activeTab) return;
     runTransform(
       injectParamBlock(activeTab.xslt, activeTab.params),
       activeTab.version,
       activeTab.params,
+      activeTab.id,
     );
   }, [activeTab, traceEnabled]);
 
@@ -374,15 +943,122 @@ export default function App() {
     reader.readAsText(file);
   };
 
-  const download = (data, filename) => {
-    const blob = new Blob([data], { type: "text/xml" });
+  const handleResultResizeStart = (event) => {
+    event.preventDefault();
+    resultResizeState.current = {
+      startY: event.clientY,
+      startHeight: resolvedResultHeight,
+    };
+    setIsResizingResult(true);
+  };
+
+  const handleParamResizeStart = (event) => {
+    if (paramsCollapsed) return;
+    event.preventDefault();
+    paramResizeState.current = {
+      startX: event.clientX,
+      startWidth: paramWidth || DEFAULT_PARAM_WIDTH,
+    };
+    setIsResizingParams(true);
+  };
+
+  const handleResetResultHeight = () => {
+    setResultHeight(null);
+  };
+
+  const download = useCallback((data, filename, mimeType = "text/xml") => {
+    const blob = new Blob([data], { type: mimeType });
     const url = URL.createObjectURL(blob);
     const a = document.createElement("a");
     a.href = url;
     a.download = filename;
     a.click();
     URL.revokeObjectURL(url);
-  };
+  }, []);
+
+  const handleExportWorkspace = useCallback(
+    (targetTab) => {
+      const tab = targetTab || activeTab;
+      if (!tab) return;
+      const statusSnapshot =
+        workspaceStatus[tab.id] || defaultWorkspaceStatus();
+      const payload = {
+        schemaVersion: WORKSPACE_EXPORT_VERSION,
+        exportedAt: new Date().toISOString(),
+        workspace: {
+          params: tab.params,
+          xslt: tab.xslt,
+          version: tab.version,
+        },
+        status: statusSnapshot,
+      };
+      download(
+        JSON.stringify(payload, null, 2),
+        `workspace-${tab.id}.json`,
+        "application/json",
+      );
+    },
+    [activeTab, download, workspaceStatus],
+  );
+
+  const handleWorkspaceImport = useCallback(
+    (event) => {
+      const input = event.target;
+      const file = input?.files?.[0];
+      if (!file) {
+        if (input) input.value = "";
+        return;
+      }
+      if (tabsRef.current.length >= MAX_WORKSPACES) {
+        window.alert(
+          `You can only keep up to ${MAX_WORKSPACES} workspaces simultaneously.`,
+        );
+        if (input) input.value = "";
+        return;
+      }
+      const reader = new FileReader();
+      reader.onload = () => {
+        try {
+          const parsed = JSON.parse(reader.result || "{}");
+          const normalized = normalizeWorkspaceImport(parsed);
+          setTabs((current) => {
+            if (current.length >= MAX_WORKSPACES) {
+              window.alert(
+                `You can only keep up to ${MAX_WORKSPACES} workspaces simultaneously.`,
+              );
+              return current;
+            }
+            const nextTab = defaultTab({
+              params: normalized.workspace.params,
+              xslt: normalized.workspace.xslt,
+              version: normalized.workspace.version,
+            });
+            setWorkspaceStatus((prev) => ({
+              ...prev,
+              [nextTab.id]: normalized.status,
+            }));
+            setActive(nextTab.id);
+            return [...current, nextTab];
+          });
+        } catch (err) {
+          console.error(err);
+          window.alert(
+            typeof err?.message === "string"
+              ? err.message
+              : "Failed to import workspace file.",
+          );
+        } finally {
+          if (input) input.value = "";
+        }
+      };
+      reader.onerror = () => {
+        window.alert("Unable to read the workspace file.");
+        if (input) input.value = "";
+      };
+      reader.readAsText(file);
+    },
+    [setTabs, setActive, setWorkspaceStatus],
+  );
 
   useEffect(() => {
     if (adsenseClient && adsenseSlot && window.adsbygoogle) {
@@ -394,125 +1070,171 @@ export default function App() {
 
   return (
     <div className="app-container">
-      <div className="header">
-        <div style={{ display: "flex", alignItems: "center" }}>
-          <img src={logo} alt="logo" className="logo" />
-          <strong>xsltplayground.com</strong>
-        </div>
-        <div style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}>
+      <div className="tabs">
+        <TabsNav
+          tabs={tabs}
+          activeId={active}
+          onSelect={setActive}
+          onClose={handleRemoveWorkspace}
+          onExport={handleExportWorkspace}
+          onClear={handleClearWorkspace}
+        />
+        <div className="tabs-right">
           <button
-            className="icon-button"
-            title="Clear workspace"
-            onClick={() => {
-              if (window.confirm("¿Limpiar el workspace? Se perderán los cambios no guardados.")) {
-                const nt = { ...defaultTab(), params: [] };
-                setTabs([nt]);
-                setActive(nt.id);
-                setResult("");
-                setError("");
-                setErrorLines([]);
-                try {
-                  localStorage.removeItem("tabs");
-                  localStorage.removeItem("active");
-                } catch {}
-              }
-            }}
-          >
-            🧹
-          </button>
-          {goPro && auth && (
-            <div>
-              {user ? (
-                <button onClick={() => signOut(auth)}>Sign out</button>
-              ) : (
-                <button onClick={() => signInWithPopup(auth, new GoogleAuthProvider())}>Sign in</button>
-              )}
-            </div>
-          )}
-          <Buymeacoffee />
-        </div>
-      </div>
-      {goPro && (
-        <div className="tabs">
-          {tabs.map((t, idx) => (
-            <button
-              key={t.id}
-              className={t.id === active ? "active" : ""}
-              onClick={() => setActive(t.id)}
-            >
-              {`Transform ${idx + 1}`}
-            </button>
-          ))}
-          <button
-            className="icon-button"
-            onClick={() => {
-              const nt = defaultTab();
-              setTabs((tabs) => [...tabs, nt]);
-              setActive(nt.id);
-            }}
+            type="button"
+            className="icon-button tab-add"
+            onClick={handleAddWorkspace}
+            disabled={tabs.length >= MAX_WORKSPACES}
+            aria-label="Add workspace"
+            title={
+              tabs.length >= MAX_WORKSPACES
+                ? "Maximum number of workspaces reached"
+                : "Add workspace"
+            }
           >
             ➕
           </button>
+          <button
+            type="button"
+            className="icon-button tab-import"
+            onClick={() => workspaceImportRef.current?.click()}
+            title="Import workspace"
+            aria-label="Import workspace"
+          >
+            📥
+          </button>
+          <input
+            ref={workspaceImportRef}
+            type="file"
+            accept="application/json,.json"
+            className="file-input"
+            onChange={handleWorkspaceImport}
+          />
         </div>
-      )}
+      </div>
       <div className="main">
-        <div
-          className="params"
-          onDragOver={(e) => e.preventDefault()}
-          onDrop={handleDropNewParam}
-        >
-          <div className="params-header">
-            <div className="title">Data Pipeline</div>
-            <button className="icon-button" onClick={addParam}>➕</button>
+        {paramsCollapsed ? (
+          <div className="params-collapsed">
+            <button
+              type="button"
+              className="icon-button"
+              title="Show data pipeline"
+              aria-label="Show data pipeline"
+              onClick={() => setParamsCollapsed(false)}
+            >
+              ▶
+            </button>
           </div>
-          {activeTab.params.map((p, i) => (
-            <div key={i} style={{ border: "1px solid #ccc", marginBottom: "0.5rem" }}>
-              <div style={{ display: "flex", alignItems: "center", padding: "0.25rem" }}>
-                <input
-                  style={{ flex: 1 }}
-                  placeholder="name"
-                  value={p.name}
-                  onChange={(e) => updateParam(i, "name", e.target.value)}
-                />
-                <button className="icon-button" onClick={() => updateParam(i, "open", !p.open)}>{p.open ? "▼" : "▶"}</button>
-                <button className="icon-button" onClick={() => removeParam(i)}>❌</button>
-              </div>
-              {p.open && (
-                <div
-                  onDragOver={(e) => e.preventDefault()}
-                  onDrop={(e) => {
-                    e.stopPropagation();
-                    handleDrop(e, (t) => updateParam(i, "value", t));
-                  }}
-                >
-                  <Editor
-                    height="150px"
-                    language="xml"
-                    value={p.value}
-                    onChange={(v) => updateParam(i, "value", v || "")}
-                    options={{ minimap: { enabled: false }, automaticLayout: true }}
-                  />
-                  <div style={{ display: "flex", justifyContent: "space-between" }}>
-                    <label className="icon-button file-label">
-                      📤
-                      <input
-                        type="file"
-                        accept=".xml"
-                        className="file-input"
-                        onChange={(e) => loadFile(e, (t) => updateParam(i, "value", t))}
-                      />
-                    </label>
-                    <button className="icon-button" onClick={() => download(p.value, `${p.name || "param"}.xml`)}>📥</button>
+        ) : (
+          <>
+            <div
+              className="params"
+              style={{
+                width: `${paramWidth}px`,
+                flexBasis: `${paramWidth}px`,
+              }}
+            >
+              <DataPipelineHeader
+                collapsed={paramsCollapsed}
+                onToggleCollapsed={() => setParamsCollapsed((v) => !v)}
+                onAddParam={addParam}
+              />
+              <div
+                className="params-body"
+                onDragOver={(e) => e.preventDefault()}
+                onDrop={handleDropNewParam}
+              >
+                {activeTab.params.map((p, i) => (
+                  <div key={i} className={`param-card${p.open ? " open" : ""}`}>
+                    <div className="param-header-row">
+                      <div className="param-name-wrap">
+                        <button
+                          type="button"
+                          className={`icon-button param-toggle${p.open ? " open" : ""}`}
+                          aria-label={p.open ? "Collapse parameter details" : "Expand parameter details"}
+                          onClick={() => updateParam(i, "open", !p.open)}
+                        >
+                          {p.open ? "▾" : "▸"}
+                        </button>
+                        <input
+                          className="param-name-input"
+                          placeholder="Parameter name"
+                          value={p.name}
+                          onChange={(e) => updateParam(i, "name", e.target.value)}
+                        />
+                      </div>
+                      <button
+                        type="button"
+                        className="icon-button param-remove"
+                        aria-label="Remove parameter"
+                        onClick={() => removeParam(i)}
+                      >
+                        <span aria-hidden="true">✕</span>
+                      </button>
+                    </div>
+                    {p.open && (
+                      <div
+                        className="param-content"
+                        onDragOver={(e) => e.preventDefault()}
+                        onDrop={(e) => {
+                          e.stopPropagation();
+                          handleDrop(e, (t) => updateParam(i, "value", t));
+                        }}
+                      >
+                        <div className="param-editor">
+                          <Editor
+                            height="150px"
+                            language="xml"
+                            value={p.value}
+                            onChange={(v) => updateParam(i, "value", v || "")}
+                            options={{
+                              minimap: { enabled: false },
+                              automaticLayout: true,
+                              lineNumbers: "off",
+                            }}
+                          />
+                        </div>
+                        <div className="param-footer">
+                          <label className="icon-button file-label param-upload">
+                            📤
+                            <input
+                              type="file"
+                              accept=".xml"
+                              className="file-input"
+                              onChange={(e) => loadFile(e, (t) => updateParam(i, "value", t))}
+                            />
+                          </label>
+                          <button
+                            type="button"
+                            className="icon-button param-download"
+                            aria-label="Download parameter value"
+                            onClick={() => download(p.value, `${p.name || "param"}.xml`)}
+                          >
+                            📥
+                          </button>
+                        </div>
+                      </div>
+                    )}
                   </div>
-                </div>
-              )}
+                ))}
+                <div className="drop-hint">Drop your input XML files here..</div>
+              </div>
             </div>
-          ))}
-          <div className="drop-hint">Drop your input XML files here..</div>
-        </div>
+            <div
+              className={`pane-divider${isResizingParams ? " dragging" : ""}`}
+              onMouseDown={handleParamResizeStart}
+              role="separator"
+              aria-label="Resize data pipeline width"
+              aria-orientation="vertical"
+            >
+              <span />
+            </div>
+          </>
+        )}
         <div className="editor">
-          <div style={{ marginBottom: "0.5rem" }} className="toggle">
+          <div className="toggle">
             <select
+              className="version-select"
               value={activeTab.version}
               onChange={(e) =>
                 setTabs((tabs) =>
@@ -531,9 +1253,14 @@ export default function App() {
               <option value="1.0">XSLT 1.0</option>
               <option value="2.0">XSLT 2.0</option>
             </select>
-            <label style={{ display: "inline-flex", alignItems: "center", gap: "0.25rem", marginLeft: "0.5rem" }}>
-              <input type="checkbox" checked={traceEnabled} onChange={(e) => setTraceEnabled(e.target.checked)} />
-              Trace
+            <label className="trace-toggle">
+              <input
+                type="checkbox"
+                checked={traceEnabled}
+                onChange={(e) => setTraceEnabled(e.target.checked)}
+              />
+              <span className="trace-toggle-box" aria-hidden="true" />
+              <span className="trace-toggle-label">Enable Internal Variables</span>
             </label>
             <div className="right-actions">
               <label className="icon-button file-label">
@@ -612,103 +1339,300 @@ export default function App() {
                     {traceCollapsed ? '▶' : '▼'}
                   </button>
                   {!traceCollapsed && (
-                    <span style={{ fontWeight: 'bold' }}>
-                      Trace Variables {traceEntries.length ? `(${traceEntries.length})` : ''}
-                    </span>
+                    <>
+                      <span style={{ fontWeight: 'bold' }}>
+                        Trace Variables {traceEntries.length ? `(${traceEntries.length})` : ''}
+                      </span>
+                      <div className="trace-header-actions">
+                        <button
+                          className="icon-button"
+                          title="Copy all trace variables"
+                          onClick={handleCopyAllTrace}
+                          type="button"
+                          disabled={!traceEntries.length && !traceText}
+                        >
+                          📋
+                        </button>
+                        {traceText && (
+                          <button
+                            className="icon-button"
+                            title={showRawTrace ? "Hide raw trace output" : "Show raw trace output"}
+                            onClick={() => {
+                              if (activeTab) {
+                                updateWorkspaceStatus(activeTab.id, (prev) => ({
+                                  ...prev,
+                                  showRawTrace: !prev.showRawTrace,
+                                }));
+                              }
+                            }}
+                            type="button"
+                          >
+                            {showRawTrace ? "🗕" : "🗖"}
+                          </button>
+                        )}
+                      </div>
+                    </>
                   )}
                 </div>
                 {!traceCollapsed && (
-                  <table className="trace-table">
-                    <tbody>
-                      {traceEntries.map((t, i) => (
-                        <tr key={i}>
-                          <td className="trace-name">{t.name}</td>
-                          <td className="trace-value">{t.value}</td>
-                        </tr>
-                      ))}
-                    </tbody>
-                  </table>
+                  <div className="trace-content">
+                    {traceEntries.length > 0 && (
+                      <div
+                        className="trace-table-wrap"
+                        ref={traceTableWrapRef}
+                        onScroll={(e) => setTraceScrollLeft(e.currentTarget.scrollLeft)}
+                      >
+                        <table className="trace-table">
+                          <colgroup>
+                            <col style={{ width: `${traceNameWidth}px` }} />
+                            <col />
+                          </colgroup>
+                          <tbody>
+                            {traceEntries.map((t, i) => {
+                              const rawName = (t?.name ?? "").toString();
+                              const rawValue = (t?.value ?? "").toString();
+                              const namePreview = truncateText(rawName, TRACE_NAME_LIMIT);
+                              const valuePreview = truncateText(rawValue, TRACE_VALUE_LIMIT);
+                              return (
+                                <tr key={`${rawName}-${i}`}>
+                                  <td className="trace-name">
+                                    <div
+                                      className="trace-cell"
+                                      onMouseEnter={(e) => showTraceTooltip(e, rawName)}
+                                      onMouseLeave={hideTraceTooltip}
+                                    >
+                                      <pre
+                                        className="trace-preview trace-name-preview"
+                                        ref={registerTraceNameRef(i)}
+                                      >
+                                        {namePreview || EMPTY_SYMBOL}
+                                      </pre>
+                                    </div>
+                                  </td>
+                                  <td className="trace-value">
+                                    <div
+                                      className="trace-cell"
+                                      onMouseEnter={(e) => showTraceTooltip(e, rawValue)}
+                                      onMouseLeave={hideTraceTooltip}
+                                    >
+                                      <pre className="trace-preview trace-value-preview">{valuePreview || EMPTY_SYMBOL}</pre>
+                                    </div>
+                                  </td>
+                                </tr>
+                              );
+                            })}
+                          </tbody>
+                        </table>
+                        <div
+                          className="trace-divider"
+                          style={{ left: `${traceNameWidth - 3 - traceScrollLeft}px` }}
+                          onMouseDown={handleTraceDividerMouseDown}
+                          role="separator"
+                          aria-orientation="vertical"
+                        />
+                      </div>
+                    )}
+                    {showRawTrace && traceText && (
+                      <pre className="trace-raw-block">{traceText}</pre>
+                    )}
+                    {!traceEntries.length && !traceText && (
+                      <div className="trace-empty">Trace output is empty.</div>
+                    )}
+                  </div>
                 )}
               </div>
             )}
           </div>
         </div>
       </div>
-      <div className="result" style={{ position: "relative" }}>
-        {error ? (
+      <div
+        className={`result-resizer${isResizingResult ? " dragging" : ""}`}
+        onMouseDown={handleResultResizeStart}
+        role="separator"
+        aria-label="Resize result pane"
+        aria-orientation="horizontal"
+      >
+        <span />
+      </div>
+      <div
+        className="result"
+        style={{
+          height: `${resolvedResultHeight}px`,
+          minHeight: `${MIN_RESULT_HEIGHT}px`,
+        }}
+      >
+        {error && !errorCollapsed && (
           <div className="error-box">
-            {errorLines && errorLines.length > 0 ? (
+            <div className="error-box-header">
+              <span>Errors</span>
+              <div className="error-box-actions">
+                <button
+                  type="button"
+                  className="icon-button"
+                  onClick={copyErrors}
+                  disabled={!canCopyErrors}
+                  title="Copy all errors"
+                  aria-label="Copy errors"
+                >
+                  📋
+                </button>
+                <button
+                  type="button"
+                  className="icon-button"
+                  onClick={() => setErrorCollapsed(true)}
+                  title="Hide errors"
+                  aria-label="Hide errors"
+                >
+                  🗕
+                </button>
+              </div>
+            </div>
+            {limitedErrorLines.length > 0 ? (
               <table className="error-table">
                 <tbody>
-                  {errorLines.map((l, i) => (
+                  {limitedErrorLines.map((l, i) => (
                     <tr key={i} className="error-row">
-                      <td className="error-icon" aria-hidden>🚨</td>
-                      <td className="error-text">{l}</td>
+                      <td className="error-icon" aria-hidden>
+                        🚨
+                      </td>
+                      <td className="error-text" title={l}>
+                        {l}
+                      </td>
                     </tr>
                   ))}
                 </tbody>
               </table>
             ) : (
               <div className="error-line">
-                <span className="error-icon" aria-hidden>🚨</span>
-                <span className="error-text">{error}</span>
+                <span className="error-icon" aria-hidden>
+                  🚨
+                </span>
+                <span className="error-text" title={error || ""}>
+                  {error}
+                </span>
+              </div>
+            )}
+            {hasHiddenErrors && (
+              <div className="error-more">
+                +{(errorLines || []).length - MAX_ERROR_LINES} more…
               </div>
             )}
           </div>
-        ) : (
-          duration !== null && (
-            <div className="success-box">Success in {duration} ms</div>
-          )
         )}
-        <button
-          className="icon-button result-format-button"
-          onClick={() => {
-            try {
-              const formatted = formatXML(result);
-              setResult(formatted);
-            } catch {}
-          }}
-        >
-          📝
-        </button>
-        <Editor
-          height="100%"
-          language="xml"
-          value={result}
-          onMount={(editor) => (resultEditorRef.current = editor)}
-          options={{
-            readOnly: true,
-            minimap: { enabled: false },
-            automaticLayout: true,
-            wordWrap: "bounded",
-            wordWrapBreakAfterCharacters: ' \t})]?|>'
-          }}
-        />
-      </div>
-      <div className="banner">
-        {adsenseClient && adsenseSlot ? (
-          <ins
-            className="adsbygoogle"
-            style={{ display: "block" }}
-            data-ad-client={adsenseClient}
-            data-ad-slot={adsenseSlot}
-            data-ad-format="auto"
-            data-full-width-responsive="true"
-          />
-        ) : (
-          "Anuncio"
+        {error && errorCollapsed && (
+          <button
+            type="button"
+            className="icon-button error-expand-button"
+            onClick={() => setErrorCollapsed(false)}
+            title="Show errors"
+            aria-label="Show errors"
+          >
+            ⚠️
+          </button>
+        )}
+        {showResultPane && (
+          <>
+            {duration !== null && (
+              <div className="success-box">Success in {duration} ms</div>
+            )}
+            <button
+              className="icon-button result-format-button"
+              onClick={() => {
+                try {
+                  const formatted = formatXML(result);
+                  if (activeTab) {
+                    updateWorkspaceStatus(activeTab.id, (prev) => ({
+                      ...prev,
+                      result: formatted,
+                    }));
+                  }
+                } catch {}
+              }}
+            >
+              📝
+            </button>
+            <button
+              type="button"
+              className={`icon-button result-reset-button${isCustomResultHeight ? " active" : ""}`}
+              onClick={handleResetResultHeight}
+              title="Reset result pane height"
+              aria-label="Reset result pane height"
+            >
+              ⟳
+            </button>
+            <div className="result-editor-wrap">
+              <Editor
+                height="100%"
+                language="xml"
+                value={result}
+                onMount={(editor) => (resultEditorRef.current = editor)}
+                options={{
+                  readOnly: true,
+                  minimap: { enabled: false },
+                  automaticLayout: true,
+                  wordWrap: "bounded",
+                  wordWrapBreakAfterCharacters: ' \t})]?|>'
+                }}
+              />
+            </div>
+          </>
         )}
       </div>
       <div className="footer">
-        © 2025 Alexandre Vazquez. All rights reserved.{' '}
-        <a
-          href="https://alexandre-vazquez.com"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          alexandre-vazquez.com
-        </a>
+        <div className="footer-left">
+          <img src={logo} alt="logo" className="logo" />
+          <strong>xsltplayground.com</strong>
+          <a
+            className="news-link"
+            href={newsUrl}
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            News
+          </a>
+          {resolvedVersion && (
+            <a
+              className="version-pill"
+              href={changelogUrl}
+              target="_blank"
+              rel="noopener noreferrer"
+              title="View CHANGELOG"
+            >
+              v{resolvedVersion}
+            </a>
+          )}
+        </div>
+        <div className="footer-right">
+          <span>© 2025 Alexandre Vazquez. All rights reserved.</span>
+          <a
+            href="https://alexandre-vazquez.com"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            alexandre-vazquez.com
+          </a>
+        </div>
       </div>
+      {traceHover && (
+        <div
+          className="trace-hover-tooltip"
+          style={{ top: traceHover.y, left: traceHover.x, maxWidth: traceHover.width }}
+          onMouseEnter={cancelTraceTooltipHide}
+          onMouseLeave={() => {
+            cancelTraceTooltipHide();
+            setTraceHover(null);
+          }}
+        >
+          <div className="trace-hover-actions">
+            <button type="button" className="icon-button" onClick={copyTraceHover} title="Copy value">
+              📋
+            </button>
+          </div>
+          <pre>{traceHover.text}</pre>
+        </div>
+      )}
+      <BuyMeACoffee />
+      <FeedbackWidget />
     </div>
   );
 }
diff --git a/frontend/src/App.test.jsx b/frontend/src/App.test.jsx
new file mode 100644
index 00000000..e84d57a1
--- /dev/null
+++ b/frontend/src/App.test.jsx
@@ -0,0 +1,53 @@
+import { render, screen, waitFor, cleanup } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import App from "./App";
+
+vi.mock("@monaco-editor/react", () => ({
+  default: () => <div data-testid="monaco-editor" />,
+}));
+
+vi.mock("ga-4-react", () => {
+  return {
+    default: class {
+      initialize() {
+        return Promise.resolve();
+      }
+    },
+  };
+});
+
+beforeEach(() => {
+  vi.stubGlobal(
+    "fetch",
+    vi.fn(() =>
+      Promise.resolve({
+        ok: true,
+        json: async () => ({ result: "<root/>", duration_ms: 5 }),
+      }),
+    ),
+  );
+  window.env = {
+    VITE_BACKEND_URL: "",
+    VITE_GA_ID: "",
+    VITE_GO_PRO: "false",
+    VITE_APP_VERSION: "test",
+    VITE_NEWS_URL: "https://example.com/news",
+    VITE_REPO_URL: "https://example.com/repo",
+  };
+  window.adsbygoogle = [];
+  localStorage.clear();
+});
+
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+  delete window.env;
+});
+
+describe("App bootstrap", () => {
+  it("renders without crashing", async () => {
+    render(<App />);
+    await waitFor(() => expect(fetch).toHaveBeenCalled());
+    expect(screen.getByText(/xsltplayground\.com/i)).toBeInTheDocument();
+  });
+});
diff --git a/frontend/src/BuyMeACoffee.jsx b/frontend/src/BuyMeACoffee.jsx
deleted file mode 100644
index 71fbf600..00000000
--- a/frontend/src/BuyMeACoffee.jsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import React, { useEffect } from "react";
-
-export default function Buymeacoffee() {
-	useEffect(() => {
-		const script = document.createElement("script");
-		const div = document.getElementById("supportByBMC");
-		script.setAttribute("data-name", "BMC-Widget");
-		script.src = "https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js";
-		script.setAttribute("data-id", "alexandrev");
-		script.setAttribute("data-description", "Support me on Buy me a coffee!");
-		script.setAttribute(
-			"data-message",
-			"Thank you for visiting my website. If this app has helped you in anyway, consider buying us a coffee. ✨😎",
-		);
-		script.setAttribute("data-color", "#FFDD00");
-		script.setAttribute("data-position", "Right");
-		script.setAttribute("data-x_margin", "18");
-		script.setAttribute("data-y_margin", "18");
-		script.async = true;
-		document.head.appendChild(script);
-		script.onload = function () {
-			var evt = document.createEvent("Event");
-			evt.initEvent("DOMContentLoaded", false, false);
-			window.dispatchEvent(evt);
-		};
-
-		div.appendChild(script);
-	}, []);
-
-	return <div id="supportByBMC"></div>;
-}
\ No newline at end of file
diff --git a/frontend/src/components/BuyMeACoffee.jsx b/frontend/src/components/BuyMeACoffee.jsx
new file mode 100644
index 00000000..c7fc1228
--- /dev/null
+++ b/frontend/src/components/BuyMeACoffee.jsx
@@ -0,0 +1,42 @@
+import { useEffect, useRef } from "react";
+
+const SCRIPT_ID = "bmc-widget";
+
+export default function BuyMeACoffee() {
+  const containerRef = useRef(null);
+
+  useEffect(() => {
+    if (!containerRef.current) return;
+    if (document.getElementById(SCRIPT_ID)) return;
+
+    const script = document.createElement("script");
+    script.id = SCRIPT_ID;
+    script.setAttribute("data-name", "BMC-Widget");
+    script.src = "https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js";
+    script.setAttribute("data-id", "alexandrev");
+    script.setAttribute("data-description", "Support me on Buy me a coffee!");
+    script.setAttribute(
+      "data-message",
+      "Thanks for using XSLT Playground. If it helped you, feel free to buy me a coffee ☕",
+    );
+    script.setAttribute("data-color", "#FFDD00");
+    script.setAttribute("data-position", "Right");
+    script.setAttribute("data-x_margin", "24");
+    script.setAttribute("data-y_margin", "24");
+    script.async = true;
+    containerRef.current.appendChild(script);
+
+    const handleLoad = () => {
+      const evt = document.createEvent("Event");
+      evt.initEvent("DOMContentLoaded", false, false);
+      window.dispatchEvent(evt);
+    };
+
+    script.addEventListener("load", handleLoad);
+    return () => {
+      script.removeEventListener("load", handleLoad);
+    };
+  }, []);
+
+  return <div id="supportByBMC" ref={containerRef} />;
+}
diff --git a/frontend/src/components/DataPipelineHeader.jsx b/frontend/src/components/DataPipelineHeader.jsx
new file mode 100644
index 00000000..d2629ccb
--- /dev/null
+++ b/frontend/src/components/DataPipelineHeader.jsx
@@ -0,0 +1,31 @@
+export default function DataPipelineHeader({
+  collapsed,
+  onToggleCollapsed,
+  onAddParam,
+}) {
+  return (
+    <div className="params-header">
+      <button
+        type="button"
+        className="icon-button params-collapse"
+        title={collapsed ? "Show data pipeline" : "Hide data pipeline"}
+        onClick={onToggleCollapsed}
+        aria-label={collapsed ? "Show data pipeline" : "Hide data pipeline"}
+      >
+        {collapsed ? "▶" : "▼"}
+      </button>
+      <div className="title">Data Pipeline</div>
+      <div className="params-header-actions">
+        <button
+          type="button"
+          className="icon-button"
+          onClick={onAddParam}
+          title="Add new parameter"
+          aria-label="Add new parameter"
+        >
+          ➕
+        </button>
+      </div>
+    </div>
+  );
+}
diff --git a/frontend/src/components/DataPipelineHeader.test.jsx b/frontend/src/components/DataPipelineHeader.test.jsx
new file mode 100644
index 00000000..58585c56
--- /dev/null
+++ b/frontend/src/components/DataPipelineHeader.test.jsx
@@ -0,0 +1,36 @@
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import { describe, it, expect, vi, afterEach } from "vitest";
+import DataPipelineHeader from "./DataPipelineHeader";
+
+afterEach(() => {
+  cleanup();
+});
+describe("DataPipelineHeader", () => {
+  it("calls toggle when collapse button clicked", () => {
+    const onToggle = vi.fn();
+    render(
+      <DataPipelineHeader
+        collapsed={false}
+        onToggleCollapsed={onToggle}
+        onAddParam={vi.fn()}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole("button", { name: /hide data pipeline/i }));
+    expect(onToggle).toHaveBeenCalledTimes(1);
+  });
+
+  it("calls add handler when add button pressed", () => {
+    const onAdd = vi.fn();
+    render(
+      <DataPipelineHeader
+        collapsed
+        onToggleCollapsed={vi.fn()}
+        onAddParam={onAdd}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole("button", { name: /add new parameter/i }));
+    expect(onAdd).toHaveBeenCalledTimes(1);
+  });
+});
diff --git a/frontend/src/components/FeedbackWidget.jsx b/frontend/src/components/FeedbackWidget.jsx
new file mode 100644
index 00000000..a51d5868
--- /dev/null
+++ b/frontend/src/components/FeedbackWidget.jsx
@@ -0,0 +1,249 @@
+import {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+
+const FEEDBACK_MAIL = "xsltplayground@alexandre-vazquez.cloud";
+const STORAGE_KEY = "feedbackPos";
+const MIN_MARGIN = 10;
+const DEFAULT_MARGIN = 24;
+const FALLBACK_WIDTH = 220;
+
+export default function FeedbackWidget() {
+  const [collapsed, setCollapsed] = useState(() => {
+    try {
+      return JSON.parse(localStorage.getItem("feedbackCollapsed") || "false");
+    } catch {
+      return false;
+    }
+  });
+  const widgetRef = useRef(null);
+  const [viewportHeight, setViewportHeight] = useState(() =>
+    typeof window !== "undefined" ? window.innerHeight : 0,
+  );
+  const [viewportWidth, setViewportWidth] = useState(() =>
+    typeof window !== "undefined" ? window.innerWidth : 0,
+  );
+  const [position, setPosition] = useState(() => {
+    if (typeof window === "undefined") return null;
+    try {
+      const stored = localStorage.getItem(STORAGE_KEY);
+      if (stored) {
+        const parsed = JSON.parse(stored);
+        if (
+          typeof parsed?.x === "number" &&
+          typeof parsed?.y === "number"
+        ) {
+          return parsed;
+        }
+        if (
+          typeof parsed?.right === "number" &&
+          typeof parsed?.top === "number"
+        ) {
+          return {
+            x: Math.max(
+              MIN_MARGIN,
+              window.innerWidth - parsed.right - FALLBACK_WIDTH,
+            ),
+            y: Math.max(MIN_MARGIN, parsed.top),
+          };
+        }
+      }
+    } catch {}
+    return null;
+  });
+  const [dragging, setDragging] = useState(false);
+  const [offset, setOffset] = useState({ x: 0, y: 0 });
+  const [opensUp, setOpensUp] = useState(false);
+  const resolvedPosition = useMemo(
+    () => {
+      if (position) return position;
+      const fallbackHeight =
+        viewportHeight || (typeof window !== "undefined" ? window.innerHeight : 0);
+      return {
+        x: DEFAULT_MARGIN,
+        y: Math.max(DEFAULT_MARGIN, fallbackHeight - 220),
+      };
+    },
+    [position, viewportHeight],
+  );
+
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handleResize = () => {
+      setViewportHeight(window.innerHeight);
+      setViewportWidth(window.innerWidth);
+    };
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+
+  useEffect(() => {
+    try {
+      localStorage.setItem("feedbackCollapsed", JSON.stringify(collapsed));
+    } catch {}
+  }, [collapsed]);
+
+  const clampWithinViewport = useCallback(
+    (pos) => {
+      if (
+        !pos ||
+        typeof window === "undefined" ||
+        !widgetRef.current
+      ) {
+        return pos;
+      }
+      const rect = widgetRef.current.getBoundingClientRect();
+      const maxX = Math.max(
+        MIN_MARGIN,
+        window.innerWidth - rect.width - MIN_MARGIN,
+      );
+      const maxY = Math.max(
+        MIN_MARGIN,
+        window.innerHeight - rect.height - MIN_MARGIN,
+      );
+      return {
+        x: Math.min(Math.max(MIN_MARGIN, pos.x), maxX),
+        y: Math.min(Math.max(MIN_MARGIN, pos.y), maxY),
+      };
+    },
+    [],
+  );
+
+  useLayoutEffect(() => {
+    if (!position) return;
+    const next = clampWithinViewport(position);
+    if (!next) return;
+    if (next.x !== position.x || next.y !== position.y) {
+      setPosition(next);
+    }
+  }, [position, clampWithinViewport, viewportHeight, viewportWidth, collapsed]);
+
+  useLayoutEffect(() => {
+    if (
+      position ||
+      typeof window === "undefined" ||
+      typeof document === "undefined"
+    )
+      return;
+    const widget = widgetRef.current;
+    if (!widget) return;
+    const footer = document.querySelector(".footer");
+    const margin = DEFAULT_MARGIN;
+    const viewport = window.innerHeight;
+    const widgetRect = widget.getBoundingClientRect();
+    let y = Math.max(margin, viewport - widgetRect.height - margin);
+
+    if (footer) {
+      const footerRect = footer.getBoundingClientRect();
+      if (footerRect.top < viewport) {
+        y = Math.max(margin, footerRect.top - widgetRect.height - margin);
+      }
+    }
+
+    setPosition({ x: margin, y });
+  }, [position]);
+
+  useEffect(() => {
+    if (!dragging) return;
+    const handleMove = (event) => {
+      event.preventDefault();
+      const widget = widgetRef.current;
+      const widgetRect = widget?.getBoundingClientRect();
+      const maxX = Math.max(
+        MIN_MARGIN,
+        window.innerWidth -
+          (widgetRect?.width ?? 0) -
+          MIN_MARGIN,
+      );
+      const maxY = Math.max(
+        MIN_MARGIN,
+        window.innerHeight -
+          (widgetRect?.height ?? 0) -
+          MIN_MARGIN,
+      );
+
+      setPosition({
+        x: Math.min(
+          Math.max(MIN_MARGIN, event.clientX - offset.x),
+          maxX,
+        ),
+        y: Math.min(
+          Math.max(MIN_MARGIN, event.clientY - offset.y),
+          maxY,
+        ),
+      });
+    };
+    const stop = () => setDragging(false);
+    window.addEventListener("mousemove", handleMove);
+    window.addEventListener("mouseup", stop);
+    return () => {
+      window.removeEventListener("mousemove", handleMove);
+      window.removeEventListener("mouseup", stop);
+    };
+  }, [dragging, offset]);
+
+  useEffect(() => {
+    if (dragging || !position) return;
+    try {
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(position));
+    } catch {}
+  }, [dragging, position]);
+
+  useLayoutEffect(() => {
+    if (!widgetRef.current || !viewportHeight) return;
+    const rect = widgetRef.current.getBoundingClientRect();
+    setOpensUp(rect.top + rect.height / 2 > viewportHeight / 2);
+  }, [position, collapsed, viewportHeight]);
+
+  const startDrag = (event) => {
+    event.preventDefault();
+    const rect = event.currentTarget.getBoundingClientRect();
+    setOffset({
+      x: event.clientX - rect.left,
+      y: event.clientY - rect.top,
+    });
+    setDragging(true);
+  };
+
+  const mailLink = `mailto:${FEEDBACK_MAIL}?subject=${encodeURIComponent(
+    "xsltplayground feedback",
+  )}`;
+
+  return (
+    <div
+      ref={widgetRef}
+      className={`feedback-widget ${collapsed ? "collapsed" : ""} ${opensUp ? "opens-up" : ""}`}
+      style={{ left: resolvedPosition.x, top: resolvedPosition.y }}
+    >
+      <div
+        className="feedback-header"
+        onMouseDown={startDrag}
+        role="button"
+        tabIndex={0}
+      >
+        <span>Feedback</span>
+        <button
+          type="button"
+          className="icon-button"
+          onClick={() => setCollapsed((prev) => !prev)}
+          aria-label={collapsed ? "Show feedback panel" : "Hide feedback panel"}
+        >
+          {collapsed ? "▲" : "▼"}
+        </button>
+      </div>
+      {!collapsed && (
+        <div className="feedback-body">
+          <p>Have an idea or found a glitch? I would love to hear from you.</p>
+          <a className="feedback-link" href={mailLink}>
+            ✉️ Send feedback
+          </a>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/frontend/src/components/TabsNav.jsx b/frontend/src/components/TabsNav.jsx
new file mode 100644
index 00000000..a6c88791
--- /dev/null
+++ b/frontend/src/components/TabsNav.jsx
@@ -0,0 +1,64 @@
+export default function TabsNav({
+  tabs,
+  activeId,
+  onSelect,
+  onClose,
+  onExport,
+  onClear,
+}) {
+  return (
+    <div className="tabs-left">
+      {tabs.map((tab, index) => {
+        const isActive = tab.id === activeId;
+        return (
+          <div
+            key={tab.id}
+            className={`tab ${isActive ? "active" : ""}`}
+          >
+            <div className="tab-tools">
+              <button
+                type="button"
+                className="tab-icon"
+                onClick={() => onExport?.(tab)}
+                title="Export workspace"
+                aria-label={`Export workspace ${index + 1}`}
+              >
+                📤
+              </button>
+              <button
+                type="button"
+                className="tab-icon"
+                onClick={() => onClear?.(tab)}
+                title="Clear workspace"
+                aria-label={`Clear workspace ${index + 1}`}
+              >
+                🧹
+              </button>
+            </div>
+            <button
+              type="button"
+              className="tab-button"
+              onClick={() => onSelect?.(tab.id)}
+            >
+              {`Workspace ${index + 1}`}
+            </button>
+            {tabs.length > 1 && (
+              <button
+                type="button"
+                className="tab-close"
+                onClick={(e) => {
+                  e.stopPropagation();
+                  onClose?.(tab.id);
+                }}
+                title="Close workspace"
+                aria-label={`Close workspace ${index + 1}`}
+              >
+                ✕
+              </button>
+            )}
+          </div>
+        );
+      })}
+    </div>
+  );
+}
diff --git a/frontend/src/components/TabsNav.test.jsx b/frontend/src/components/TabsNav.test.jsx
new file mode 100644
index 00000000..3dccf4cf
--- /dev/null
+++ b/frontend/src/components/TabsNav.test.jsx
@@ -0,0 +1,54 @@
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import { describe, it, expect, vi, afterEach } from "vitest";
+import TabsNav from "./TabsNav";
+
+const sampleTabs = [
+  { id: "a" },
+  { id: "b" },
+];
+
+afterEach(() => {
+  cleanup();
+});
+
+describe("TabsNav", () => {
+  it("invokes export handler for the selected tab button", () => {
+    const onExport = vi.fn();
+    render(
+      <TabsNav
+        tabs={sampleTabs}
+        activeId="a"
+        onSelect={vi.fn()}
+        onClose={vi.fn()}
+        onExport={onExport}
+        onClear={vi.fn()}
+      />,
+    );
+
+    const exportButtons = screen.getAllByRole("button", { name: /Export workspace/ });
+    fireEvent.click(exportButtons[1]);
+
+    expect(onExport).toHaveBeenCalledTimes(1);
+    expect(onExport).toHaveBeenCalledWith(sampleTabs[1]);
+  });
+
+  it("invokes clear handler for matching tab", () => {
+    const onClear = vi.fn();
+    render(
+      <TabsNav
+        tabs={sampleTabs}
+        activeId="a"
+        onSelect={vi.fn()}
+        onClose={vi.fn()}
+        onExport={vi.fn()}
+        onClear={onClear}
+      />,
+    );
+
+    const clearButton = screen.getAllByRole("button", { name: /Clear workspace/ })[0];
+    fireEvent.click(clearButton);
+
+    expect(onClear).toHaveBeenCalledTimes(1);
+    expect(onClear).toHaveBeenCalledWith(sampleTabs[0]);
+  });
+});
diff --git a/frontend/src/logo.svg b/frontend/src/logo.svg
index 8cfa2f80..53658ce3 100644
--- a/frontend/src/logo.svg
+++ b/frontend/src/logo.svg
@@ -1,4 +1,28 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40">
-  <rect width="40" height="40" rx="6" fill="#007acc"/>
-  <text x="20" y="26" text-anchor="middle" font-size="20" font-family="Arial" fill="white" font-weight="bold">XSL</text>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
+  <defs>
+    <linearGradient id="logo-bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#07162f" />
+      <stop offset="50%" stop-color="#0c3264" />
+      <stop offset="100%" stop-color="#1480ff" />
+    </linearGradient>
+    <linearGradient id="logo-flow" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#ffe07d" />
+      <stop offset="100%" stop-color="#52f2c5" />
+    </linearGradient>
+  </defs>
+  <rect width="48" height="48" rx="10" fill="url(#logo-bg)" />
+  <g stroke="#8edfff" stroke-width="2.8" stroke-linecap="round" stroke-linejoin="round" fill="none" opacity="0.92">
+    <path d="M15 10 L8.5 18 L15 26" />
+    <path d="M15 22 L8.5 30 L15 38" />
+    <path d="M33 10 L39.5 18 L33 26" />
+    <path d="M33 22 L39.5 30 L33 38" />
+  </g>
+  <path d="M7 14h34" stroke="rgba(255,255,255,0.25)" stroke-width="1" />
+  <path d="M7 34h34" stroke="rgba(255,255,255,0.25)" stroke-width="1" />
+  <path d="M18 15 L27 15 L35 24 L27 33 L18 33 L23 27 L17 27 L13 24 L17 21 L23 21 Z" fill="url(#logo-flow)" />
+  <path d="M18 15 L27 15 L35 24 L27 33 L18 33 L23 27 L17 27 L13 24 L17 21 L23 21 Z" fill="none" stroke="rgba(0, 0, 0, 0.3)" stroke-width="0.8" stroke-linejoin="round" />
+  <path d="M23 18 V30" stroke="#fff3d4" stroke-width="1.5" stroke-linecap="round" />
+  <circle cx="23" cy="18" r="1.5" fill="#fffcf1" />
+  <circle cx="23" cy="30" r="1.5" fill="#fffcf1" />
+  <circle cx="23" cy="24" r="2.3" fill="#051c38" opacity="0.45" />
 </svg>
diff --git a/frontend/src/setupTests.js b/frontend/src/setupTests.js
new file mode 100644
index 00000000..f149f27a
--- /dev/null
+++ b/frontend/src/setupTests.js
@@ -0,0 +1 @@
+import "@testing-library/jest-dom/vitest";
diff --git a/frontend/src/style.css b/frontend/src/style.css
index 7a5418f8..28e76926 100644
--- a/frontend/src/style.css
+++ b/frontend/src/style.css
@@ -7,13 +7,27 @@ body,
   background: #f5f5f5;
 }
 
-.header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 0.5rem 1rem;
-  background: white;
-  border-bottom: 1px solid #ddd;
+.news-link {
+  color: #007acc;
+  text-decoration: none;
+  font-weight: 500;
+}
+
+.news-link:hover {
+  text-decoration: underline;
+}
+
+.version-pill {
+  border: 1px solid #007acc;
+  color: #007acc;
+  border-radius: 999px;
+  padding: 0.1rem 0.5rem;
+  font-size: 0.75rem;
+  text-decoration: none;
+}
+
+.version-pill:hover {
+  background: #e6f2fb;
 }
 
 .logo {
@@ -23,30 +37,110 @@ body,
 
 .tabs {
   display: flex;
+  align-items: flex-end;
+  gap: 0.5rem;
+  padding: 0 0.5rem;
   border-bottom: 1px solid #ddd;
   background: #fafafa;
+  flex-wrap: wrap;
 }
 
-.tabs button {
-  padding: 0.25rem 0.5rem;
+.tabs-left {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.25rem;
+  align-items: flex-end;
+  flex: 1 1 auto;
+}
+
+.tabs-right {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.tab {
+  display: inline-flex;
+  align-items: center;
+  border: 1px solid transparent;
+  border-bottom: none;
+  border-radius: 6px 6px 0 0;
   background: transparent;
-  border: none;
-  cursor: pointer;
+  gap: 0.25rem;
 }
 
-.tabs button.active {
-  border-bottom: 2px solid #007acc;
-  font-weight: bold;
+.tab.active {
+  background: #fff;
+  border-color: #ddd;
+  border-bottom: 1px solid #fff;
+}
+
+.tab-button {
+  padding: 0.4rem 0.75rem;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  font-weight: 500;
+}
+
+.tab.active .tab-button {
+  color: #007acc;
+}
+
+.tab-close {
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  padding: 0 0.4rem;
+  font-size: 0.85rem;
+  color: #777;
+}
+
+.tab-close:hover {
+  color: #c00;
+}
+
+.tab-add {
+  border: 1px dashed #bbb;
+  border-bottom: none;
+  border-radius: 6px 6px 0 0;
+  padding: 0.35rem 0.5rem;
+}
+
+.tab-import {
+  border: 1px dashed #bbb;
+  border-bottom: none;
+  border-radius: 6px 6px 0 0;
+  padding: 0.35rem 0.5rem;
+}
+
+.tab-tools {
+  display: inline-flex;
+  gap: 0.25rem;
+  align-items: center;
+}
+
+.tab-icon {
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  padding: 0.25rem;
+  font-size: 0.85rem;
+  color: #666;
+}
+
+.tab-icon:hover,
+.tab.active .tab-icon {
+  color: #007acc;
 }
 
 .toggle {
   display: flex;
   align-items: center;
-}
-
-.toggle button,
-.toggle select {
-  margin-right: 0.25rem;
+  gap: 0.5rem;
+  flex-wrap: wrap;
+  margin-bottom: 0.5rem;
 }
 
 .toggle .right-actions {
@@ -55,20 +149,94 @@ body,
   align-items: center;
 }
 
+.trace-toggle {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  margin-left: 0.5rem;
+  padding: 0.2rem 0.8rem 0.2rem 0.45rem;
+  border: 1px solid #cfdcf4;
+  border-radius: 999px;
+  background: #f0f6ff;
+  font-size: 0.85rem;
+  cursor: pointer;
+  position: relative;
+  user-select: none;
+}
+
+.trace-toggle input {
+  position: absolute;
+  opacity: 0;
+  width: 1px;
+  height: 1px;
+}
+
+.trace-toggle-box {
+  width: 1.2rem;
+  height: 1.2rem;
+  border-radius: 6px;
+  border: 2px solid #4a85ff;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: #fff;
+  color: transparent;
+  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
+}
+
+.trace-toggle-box::after {
+  content: "✔";
+  font-size: 0.8rem;
+  line-height: 1;
+}
+
+.trace-toggle input:checked + .trace-toggle-box {
+  background: #4a85ff;
+  color: #fff;
+  border-color: #4a85ff;
+}
+
+.trace-toggle input:focus-visible + .trace-toggle-box {
+  box-shadow: 0 0 0 2px rgba(74, 133, 255, 0.2);
+}
+
+.trace-toggle-label {
+  white-space: nowrap;
+  font-weight: 600;
+  color: #21426c;
+}
+
 .error-box {
   background: #fee;
   color: #900;
   padding: 0.5rem;
   border: 1px solid #f3c2c2;
   border-left: 4px solid #d00;
-  max-height: 30vh; /* limit height */
-  overflow: auto;   /* enable scroll when needed */
+  max-height: 7rem;
+  overflow: auto;
+  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
+  font-size: 0.8rem;
+  line-height: 1.2;
+}
+
+.error-box-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 0.25rem;
+  font-weight: bold;
+  gap: 0.25rem;
+}
+
+.error-box-actions {
+  display: inline-flex;
+  gap: 0.25rem;
 }
 
-/* Tabular error list */
 .error-table {
   width: 100%;
   border-collapse: collapse;
+  table-layout: fixed;
 }
 
 .error-row {
@@ -76,21 +244,40 @@ body,
 }
 
 .error-icon {
-  width: 1.75rem;
+  width: 1.5rem;
   text-align: center;
   padding-right: 0.25rem;
   color: #d00;
 }
 
 .error-text {
-  white-space: pre-wrap;
-  word-break: break-word;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: block;
+  max-width: 100%;
+  padding-right: 0.25rem;
 }
 
 .error-line {
   display: flex;
-  align-items: flex-start;
+  align-items: center;
   gap: 0.25rem;
+  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
+  font-size: 0.8rem;
+  width: 100%;
+}
+
+.error-more {
+  margin-top: 0.25rem;
+  font-size: 0.7rem;
+  color: #b55;
+}
+
+.error-expand-button {
+  position: absolute;
+  top: 0.25rem;
+  left: 0.25rem;
 }
 
 .success-box {
@@ -110,40 +297,254 @@ body,
   flex: 1 1 auto;
   overflow: hidden;
   min-height: 0;
+  gap: 0;
+  align-items: stretch;
 }
 
 .params {
-  width: 30%;
-  overflow-y: auto;
+  flex: 0 0 auto;
+  width: 320px;
+  min-width: 220px;
   border-right: 1px solid #ddd;
-  padding: 0.5rem;
+  background: #fff;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.params-body {
+  flex: 1 1 auto;
+  overflow-y: auto;
+  padding: 0.65rem;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 0.65rem;
+  background: linear-gradient(180deg, #f9fbff 0%, #f1f4ff 100%);
+}
+
+.param-card {
+  border: 1px solid #dfe5fb;
+  border-radius: 14px;
+  background: linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
+  box-shadow: 0 8px 22px rgba(15, 40, 94, 0.07);
+  padding: 0.55rem 0.6rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
+}
+
+.param-card.open {
+  border-color: #c4d4ff;
+  box-shadow: 0 14px 34px rgba(15, 40, 94, 0.12);
+  transform: translateY(-1px);
+}
+
+.param-header-row {
+  display: flex;
+  align-items: center;
+  gap: 0.35rem;
+}
+
+.param-name-wrap {
+  flex: 1;
+  display: flex;
+  align-items: stretch;
+  border: 1px solid #d5dff7;
+  border-radius: 999px;
+  background: #f0f5ff;
+  overflow: hidden;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
+}
+
+.param-name-wrap:focus-within {
+  border-color: #4a85ff;
+  background: #fff;
+  box-shadow: 0 0 0 2px rgba(74, 133, 255, 0.15);
+}
+
+.param-toggle {
+  flex: 0 0 2.2rem;
+  border: none;
+  border-right: 1px solid #d5dff7;
+  background: transparent;
+  color: #1f3a63;
+  font-size: 0.9rem;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: color 0.2s ease, background 0.2s ease;
+}
+
+.param-toggle.open {
+  color: #21426c;
+  background: #e1e9ff;
+}
+
+.param-toggle:hover {
+  color: #4a85ff;
+}
+
+.param-name-input {
+  flex: 1;
+  min-width: 0;
+  border: none;
+  background: transparent;
+  padding: 0.25rem 0.85rem;
+  font-weight: 600;
+  font-size: 0.9rem;
+  color: #1d3770;
+}
+
+.param-name-input::placeholder {
+  color: #6a7da8;
+}
+
+.param-name-input:focus {
+  outline: none;
+}
+
+.param-remove {
+  width: 1.75rem;
+  height: 1.75rem;
+  padding: 0;
+  border-radius: 50%;
+  border: 1px solid #f8bcbc !important;
+  background: #fff5f5;
+  color: #b03a3a;
+  font-size: 0.85rem;
+  box-shadow: 0 2px 6px rgba(176, 58, 58, 0.15);
+  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
+}
+
+.param-remove:hover {
+  background: #ffe4e4;
+  border-color: #f19999 !important;
+  color: #9b2c2c;
+}
+
+.param-content {
+  border-top: 1px solid #ecf0fb;
+  padding-top: 0.45rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.4rem;
+}
+
+.param-editor {
+  border: 1px solid #dfe5fb;
+  border-radius: 12px;
+  overflow: hidden;
+  box-shadow: inset 0 1px 2px rgba(15, 40, 94, 0.08);
+  background: #ffffff;
+}
+
+.param-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.4rem;
+}
+
+.param-footer .icon-button {
+  border-radius: 999px;
+  border: 1px solid #dfe5fb;
+  background: #f7f9ff;
+  padding: 0.3rem 0.65rem;
+  box-shadow: 0 4px 10px rgba(15, 40, 94, 0.08);
+  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
+}
+
+.param-footer .icon-button:hover {
+  background: #eaf0ff;
+  border-color: #c7d6ff;
+}
+
+.param-upload {
+  gap: 0.25rem;
 }
 
 .params-header {
-  position: relative;
-  margin-bottom: 0.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  padding: 0.5rem;
+  border-bottom: 1px solid #eee;
+  background: #f7f9fc;
+  position: sticky;
+  top: 0;
+  z-index: 1;
 }
 
 .params-header .title {
-  width: 100%;
-  text-align: center;
+  flex: 1;
   font-weight: bold;
 }
 
-.params-header button {
-  position: absolute;
-  right: 0;
-  top: 0;
+.params-header-actions {
+  display: flex;
+  gap: 0.25rem;
+}
+
+.params-collapse {
+  padding: 0.25rem;
+}
+
+.params-collapsed {
+  flex: 0 0 2.5rem;
+  border-right: 1px solid #ddd;
+  display: flex;
+  align-items: flex-start;
+  justify-content: center;
+  padding: 0.5rem 0.25rem;
+  background: #fafafa;
+  margin-right: 0.5rem;
 }
 
 .drop-hint {
   text-align: center;
-  color: #666;
-  margin-top: 0.5rem;
+  color: #536084;
+  background: rgba(255, 255, 255, 0.7);
+  border: 1px dashed #c4d4ff;
+  border-radius: 12px;
+  padding: 0.75rem;
+  font-size: 0.85rem;
+  font-weight: 500;
+}
+
+.pane-divider {
+  flex: 0 0 auto;
+  width: 12px;
+  margin: 0 0.35rem;
+  cursor: col-resize;
+  position: relative;
+  display: flex;
+  align-items: center;
+  align-self: stretch;
+  touch-action: none;
+}
+
+.pane-divider span {
+  width: 4px;
+  height: 60%;
+  margin: 0 auto;
+  border-radius: 999px;
+  background: rgba(33, 66, 108, 0.2);
+  transition: background 0.2s ease;
+}
+
+.pane-divider:hover span,
+.pane-divider.dragging span {
+  background: #4a85ff;
 }
 
 .editor {
-  width: 70%;
+  flex: 1 1 auto;
+  width: auto;
   padding: 0.5rem;
   overflow: hidden;
   height: 100%;
@@ -168,7 +569,10 @@ body,
   width: 30%;
   background: #fff;
   border: 1px solid #ddd;
-  overflow: auto;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  min-height: 0;
 }
 
 .trace-header {
@@ -176,17 +580,42 @@ body,
   border-bottom: 1px solid #eee;
   font-weight: bold;
   background: #fafafa;
+  justify-content: space-between;
+}
+
+.trace-header-actions {
+  margin-left: auto;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+}
+
+.trace-content {
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  padding: 0.25rem;
+  overflow: hidden;
+  min-height: 0;
 }
 
 .trace-table {
   width: 100%;
   border-collapse: collapse;
+  table-layout: fixed;
+}
+
+.trace-table-wrap {
+  flex: 1 1 auto;
+  position: relative;
+  overflow: auto;
+  min-height: 0;
 }
 
 .trace-name {
-  width: 30%;
+  width: auto;
   vertical-align: top;
-  padding: 0.25rem;
   font-family: monospace;
   color: #333;
   border-right: 1px solid #f0f0f0;
@@ -194,31 +623,179 @@ body,
 
 .trace-value {
   vertical-align: top;
-  padding: 0.25rem;
-  white-space: pre-wrap;
-  word-break: break-word;
+  white-space: normal;
+  word-break: normal;
   font-family: monospace;
 }
 
+.trace-cell {
+  position: relative;
+  padding: 0.25rem;
+}
+
+.trace-preview {
+  margin: 0;
+  white-space: pre;
+  word-break: normal;
+  overflow: auto;
+  max-height: 6rem;
+}
+
+.trace-name-preview {
+  max-height: 4.5rem;
+}
+
+.trace-value-preview {
+  max-height: 9rem;
+}
+
+.trace-hover-tooltip {
+  position: fixed;
+  z-index: 1000;
+  padding: 0.75rem 0.75rem 0.5rem;
+  background: rgba(30, 30, 30, 0.95);
+  color: #f6f6f6;
+  border-radius: 6px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
+  max-height: 60vh;
+  overflow: auto;
+  white-space: pre-wrap;
+  font-family: monospace;
+  font-size: 0.85rem;
+  backdrop-filter: blur(2px);
+}
+
+.trace-hover-tooltip pre {
+  margin: 0;
+  white-space: pre-wrap;
+}
+
+.trace-hover-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 0.25rem;
+  margin-bottom: 0.35rem;
+}
+
+.trace-hover-tooltip .icon-button {
+  color: #f6f6f6;
+  background: transparent;
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  padding: 0.2rem 0.35rem;
+}
+
+.trace-hover-tooltip .icon-button:hover {
+  background: rgba(255, 255, 255, 0.15);
+}
+
+.trace-raw-block {
+  flex: 1 1 auto;
+  margin: 0;
+  padding: 0.5rem;
+  background: #f7f7f9;
+  border: 1px solid #e2e2e4;
+  border-radius: 4px;
+  white-space: pre;
+  font-family: monospace;
+  font-size: 0.85rem;
+  overflow: auto;
+  min-height: 6rem;
+}
+
+.trace-empty {
+  padding: 0.5rem;
+  color: #777;
+  font-style: italic;
+}
+
+.trace-divider {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  width: 6px;
+  cursor: col-resize;
+  background: transparent;
+}
+
+.trace-divider::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 50%;
+  width: 1px;
+  background: rgba(0, 0, 0, 0.1);
+  transform: translateX(-50%);
+}
+
+.trace-divider:hover::after {
+  background: rgba(0, 122, 204, 0.6);
+  width: 2px;
+}
+
 
 .result {
-  height: 40vh;
   border-top: 1px solid #ddd;
+  background: #fff;
+  padding: 1.75rem 0.5rem 0.75rem;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  overflow: hidden;
+  flex: 0 0 auto;
 }
 
-.banner {
-  text-align: center;
-  padding: 0.5rem;
-  background: #f0f0f0;
-  border-top: 1px solid #ddd;
+.result-editor-wrap {
+  flex: 1 1 auto;
+  min-height: 0;
+}
+
+.result-resizer {
+  flex: 0 0 auto;
+  height: 0.75rem;
+  cursor: row-resize;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #f6f8fb;
+  border-top: 1px solid #e1e7f0;
+  border-bottom: 1px solid #dfe5ef;
+}
+
+.result-resizer span {
+  width: 3rem;
+  height: 3px;
+  border-radius: 999px;
+  background: #c2ccdc;
+}
+
+.result-resizer.dragging {
+  background: #e0ecfc;
+}
+
+.result-resizer.dragging span {
+  background: #007acc;
 }
 
 .footer {
-  text-align: center;
   padding: 0.5rem;
   background: #fafafa;
   border-top: 1px solid #ddd;
   font-size: 0.85rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+}
+
+.footer-left,
+.footer-right {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  flex-wrap: wrap;
 }
 
 .icon-button {
@@ -229,6 +806,40 @@ body,
   font-size: 1rem;
 }
 
+.icon-button:disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+
+.version-select {
+  appearance: none;
+  -webkit-appearance: none;
+  border: 1px solid #cfdcf4;
+  border-radius: 999px;
+  padding: 0.35rem 1.9rem 0.35rem 0.85rem;
+  font-weight: 600;
+  font-size: 0.9rem;
+  background-color: #f0f6ff;
+  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2321426C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
+  background-position: calc(100% - 0.95rem) center;
+  background-repeat: no-repeat;
+  background-size: 12px 8px;
+  color: #21426c;
+  cursor: pointer;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
+}
+
+.version-select:focus {
+  outline: none;
+  border-color: #4a85ff;
+  box-shadow: 0 0 0 3px rgba(74, 133, 255, 0.15);
+  background-color: #fff;
+}
+
+.version-select:hover {
+  border-color: #adc5ff;
+}
+
 .file-input {
   display: none;
 }
@@ -238,8 +849,90 @@ body,
   align-items: center;
 }
 
-.result-format-button {
+.result-format-button,
+.result-reset-button {
   position: absolute;
-  top: 0;
-  right: 0;
+  top: 0.25rem;
+}
+
+.result-format-button {
+  right: 0.5rem;
+}
+
+.result-reset-button {
+  right: 3rem;
+  transition: color 0.2s ease;
+}
+
+.result-reset-button.active {
+  color: #007acc;
+}
+
+.feedback-widget {
+  position: fixed;
+  z-index: 1000;
+  display: flex;
+  flex-direction: column;
+  width: 220px;
+  background: rgba(255, 255, 255, 0.95);
+  border: 1px solid #ddd;
+  border-radius: 10px;
+  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
+  backdrop-filter: blur(6px);
+  font-size: 0.9rem;
+  color: #333;
+  overflow: hidden;
+}
+
+.feedback-widget.opens-up {
+  flex-direction: column-reverse;
+}
+
+.feedback-widget.collapsed {
+  width: auto;
+  min-width: 160px;
+}
+
+.feedback-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #007acc;
+  color: white;
+  padding: 0.35rem 0.5rem;
+  border-radius: 10px 10px 0 0;
+  cursor: grab;
+  font-weight: bold;
+}
+
+.feedback-widget.opens-up .feedback-header {
+  border-radius: 0 0 10px 10px;
+}
+
+.feedback-body {
+  padding: 0.75rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+.feedback-body p {
+  margin: 0;
+  font-size: 0.85rem;
+  color: #555;
+}
+
+.feedback-link {
+  text-decoration: none;
+  padding: 0.4rem 0.6rem;
+  text-align: center;
+  border-radius: 6px;
+  background: #fff1c1;
+  color: #805d00;
+  border: 1px solid #ffd970;
+  font-weight: 600;
+}
+
+.feedback-link:hover {
+  background: #ffe189;
 }
diff --git a/frontend/vite.config.js b/frontend/vite.config.js
index 8f335ca1..8bc2db29 100644
--- a/frontend/vite.config.js
+++ b/frontend/vite.config.js
@@ -1,9 +1,21 @@
+import { readFileSync } from "fs";
 import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
 
+const pkg = JSON.parse(
+  readFileSync(new URL("./package.json", import.meta.url), "utf-8"),
+);
+
 export default defineConfig({
   plugins: [react()],
   server: {
     port: 3000,
   },
+  define: {
+    __APP_VERSION__: JSON.stringify(pkg.version),
+  },
+  test: {
+    environment: "jsdom",
+    setupFiles: "./src/setupTests.js",
+  },
 });