From 01e878f5ce7aeea373d2165e223251acd52c1e9b Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Tue, 28 Apr 2026 15:33:30 -0400
Subject: [PATCH 01/16] fix(sc): unify SC invocation path and decode hex
 strings in API responses

- Add sc_response_normalizer.go to decode printable ASCII strings from
  DERO.GetSC while preserving numeric values and binary hashes
- Apply normalization to all GetSC exit paths (XSWD, Explorer, direct)
- Refactor InvokeSCFunction to delegate to InternalWalletCall scinvoke
  path, ensuring Studio and dApp calls use identical TX building
- Fix parseXSWDScArgs to handle both []interface{} and []map[string]interface{}
  input types and support uint64/int numeric values
- Add 0-transfer fallback in scinvoke to prevent index-out-of-range panic
  when no explicit transfers are provided
---
 app.go                    |   1 +
 explorer_service.go       |  38 +++----
 sc_function_parser.go     | 201 +++++++++-----------------------------
 sc_response_normalizer.go | 123 +++++++++++++++++++++++
 wallet.go                 | 110 +++++++++++++++------
 xswd_router.go            |   3 +
 6 files changed, 271 insertions(+), 205 deletions(-)
 create mode 100644 sc_response_normalizer.go

diff --git a/app.go b/app.go
index ca95801..cee0b98 100644
--- a/app.go
+++ b/app.go
@@ -834,6 +834,7 @@ func (a *App) DaemonGetSC(scid string) map[string]interface{} {
 	if err != nil {
 		return ErrorResponse(err)
 	}
+	res = normalizeDEROGetSCResult(res)
 	return map[string]interface{}{"success": true, "result": res}
 }
 
diff --git a/explorer_service.go b/explorer_service.go
index fca7685..6f31e49 100644
--- a/explorer_service.go
+++ b/explorer_service.go
@@ -312,9 +312,9 @@ func (a *App) GetCoinbaseMiner(txid string) map[string]interface{} {
 
 	if txHex == "" {
 		return map[string]interface{}{
-			"success":   true,
+			"success":    true,
 			"isCoinbase": false,
-			"message":   "No raw transaction hex available",
+			"message":    "No raw transaction hex available",
 		}
 	}
 
@@ -547,7 +547,7 @@ func (a *App) SearchAddress(address string) map[string]interface{} {
 	if a.gnomonClient.IsRunning() {
 		// Search through Gnomon for SCIDs owned by this address
 		ownedSCIDs := a.getOwnedSCIDs(address)
-		
+
 		return map[string]interface{}{
 			"success":    true,
 			"address":    address,
@@ -910,7 +910,7 @@ func (a *App) GetBlockchainStats() map[string]interface{} {
 
 	// Extract relevant stats - info is already map[string]interface{}
 	stats := map[string]interface{}{}
-	
+
 	stats["height"] = info["height"]
 	stats["topoheight"] = info["topoheight"]
 	stats["difficulty"] = info["difficulty"]
@@ -1192,7 +1192,7 @@ func (a *App) GetMempoolExtended(maxCount int) map[string]interface{} {
 func (a *App) GetSCInfo(scid string) map[string]interface{} {
 	// Normalize SCID to lowercase (DERO requires lowercase hex)
 	normalizedSCID := strings.ToLower(strings.TrimSpace(scid))
-	
+
 	a.logToConsole(fmt.Sprintf("[...] Getting SC info: %s", normalizedSCID[:16]+"..."))
 
 	params := map[string]interface{}{
@@ -1205,6 +1205,7 @@ func (a *App) GetSCInfo(scid string) map[string]interface{} {
 	if err != nil {
 		return ErrorResponse(err)
 	}
+	result = normalizeDEROGetSCResult(result)
 
 	scData := map[string]interface{}{}
 	if resultMap, ok := result.(map[string]interface{}); ok {
@@ -1248,7 +1249,7 @@ func (a *App) GetRingMembers(txid string) map[string]interface{} {
 							"index":   idx,
 							"members": []string{},
 						}
-						
+
 						if addresses, ok := payload.([]interface{}); ok {
 							members := []string{}
 							for _, addr := range addresses {
@@ -1258,12 +1259,12 @@ func (a *App) GetRingMembers(txid string) map[string]interface{} {
 							}
 							payloadRing["members"] = members
 							payloadRing["count"] = len(members)
-							
+
 							if len(members) > ringSize {
 								ringSize = len(members)
 							}
 						}
-						
+
 						ringData = append(ringData, payloadRing)
 					}
 				}
@@ -1274,10 +1275,10 @@ func (a *App) GetRingMembers(txid string) map[string]interface{} {
 	a.logToConsole(fmt.Sprintf("[OK] Found %d ring groups, max size %d", len(ringData), ringSize))
 
 	return map[string]interface{}{
-		"success":    true,
-		"txid":       txid,
-		"rings":      ringData,
-		"ringCount":  len(ringData),
+		"success":     true,
+		"txid":        txid,
+		"rings":       ringData,
+		"ringCount":   len(ringData),
 		"maxRingSize": ringSize,
 	}
 }
@@ -1294,15 +1295,14 @@ func (a *App) GetTransactionWithRings(txid string) map[string]interface{} {
 
 	// Get ring members
 	ringResult := a.GetRingMembers(txid)
-	
+
 	// Combine results
 	return map[string]interface{}{
-		"success":    true,
-		"txid":       txid,
-		"tx":         txResult["tx"],
-		"rings":      ringResult["rings"],
-		"ringCount":  ringResult["ringCount"],
+		"success":     true,
+		"txid":        txid,
+		"tx":          txResult["tx"],
+		"rings":       ringResult["rings"],
+		"ringCount":   ringResult["ringCount"],
 		"maxRingSize": ringResult["maxRingSize"],
 	}
 }
-
diff --git a/sc_function_parser.go b/sc_function_parser.go
index 0a27bc2..724491e 100644
--- a/sc_function_parser.go
+++ b/sc_function_parser.go
@@ -223,7 +223,11 @@ func (a *App) InvokeSCFunction(paramsJSON string) map[string]interface{} {
 		}
 	}
 
-	a.logToConsole(fmt.Sprintf("[SC] Invoking %s on %s...", params.Function, params.SCID[:16]))
+	scidPrefix := params.SCID
+	if len(scidPrefix) > 16 {
+		scidPrefix = scidPrefix[:16]
+	}
+	a.logToConsole(fmt.Sprintf("[SC] Invoking %s on %s...", params.Function, scidPrefix))
 
 	// Check wallet
 	wallet := GetWallet()
@@ -238,186 +242,73 @@ func (a *App) InvokeSCFunction(paramsJSON string) map[string]interface{} {
 		}
 	}
 
-	// Build SC arguments
-	scArgs := rpc.Arguments{
-		{Name: rpc.SCACTION, DataType: rpc.DataUint64, Value: uint64(rpc.SC_CALL)},
-		{Name: rpc.SCID, DataType: rpc.DataHash, Value: crypto.HashHexToHash(params.SCID)},
-		{Name: "entrypoint", DataType: rpc.DataString, Value: params.Function},
+	// Route through the wallet's built-in scinvoke path (same path used by dApps),
+	// which keeps SC arg handling consistent across Studio and XSWD calls.
+	scRPC := []interface{}{
+		map[string]interface{}{"name": "entrypoint", "datatype": "S", "value": params.Function},
 	}
-
-	// Add function parameters
 	for name, value := range params.Params {
 		switch v := value.(type) {
 		case string:
-			scArgs = append(scArgs, rpc.Argument{
-				Name:     name,
-				DataType: rpc.DataString,
-				Value:    v,
+			scRPC = append(scRPC, map[string]interface{}{
+				"name": name, "datatype": "S", "value": v,
 			})
-		case float64: // JSON numbers come as float64
-			scArgs = append(scArgs, rpc.Argument{
-				Name:     name,
-				DataType: rpc.DataUint64,
-				Value:    uint64(v),
+		case float64:
+			scRPC = append(scRPC, map[string]interface{}{
+				"name": name, "datatype": "U", "value": v,
 			})
 		case int:
-			scArgs = append(scArgs, rpc.Argument{
-				Name:     name,
-				DataType: rpc.DataUint64,
-				Value:    uint64(v),
+			scRPC = append(scRPC, map[string]interface{}{
+				"name": name, "datatype": "U", "value": float64(v),
+			})
+		case uint64:
+			scRPC = append(scRPC, map[string]interface{}{
+				"name": name, "datatype": "U", "value": float64(v),
 			})
 		}
 	}
 
-	// Validate SC arguments before building the transaction
-	if err := scArgs.Validate_Arguments(); err != nil {
-		a.logToConsole(fmt.Sprintf("[ERR] SC argument validation failed: %v", err))
-		return map[string]interface{}{
-			"success": false,
-			"error":   "Invalid SC arguments: " + err.Error(),
-		}
-	}
-	if a.simulatorManager != nil && a.simulatorManager.isInitialized {
-		return a.withSimulatorTransactionConnectivity(wallet, "scinvoke", func() map[string]interface{} {
-			return a.invokeSCFunctionSimulator(params, wallet, scArgs)
-		})
-	}
-
-	// Sync wallet with daemon before building the transaction
-	// (mirrors InternalWalletCall scinvoke path which does this and works correctly)
-	if syncErr := wallet.Sync_Wallet_Memory_With_Daemon(); syncErr != nil {
-		a.logToConsole(fmt.Sprintf("[WARN] Pre-invoke wallet sync failed: %v", syncErr))
-	}
-
-	// Check daemon connectivity
-	if wallet.Get_Daemon_Height() == 0 {
-		return map[string]interface{}{
-			"success": false,
-			"error":   "Wallet is not connected to the daemon. Please check your connection and try again.",
-		}
-	}
-
-	// Check wallet has balance for gas fees
-	mature, _ := wallet.Get_Balance()
-	if mature == 0 {
-		return map[string]interface{}{
-			"success": false,
-			"error":   "Insufficient balance. Smart contract calls require gas fees — please fund your wallet first.",
-		}
-	}
-
-	// Build transfers
-	transfers := []rpc.Transfer{}
-
-	// Ensure daemon connection before Random_ring_members (needs daemon to fetch decoy outputs)
-	a.ensureWalletDaemonConnectivity(a.getDaemonEndpointForWallet())
-
-	// Get random destination for the transfer
-	randos := wallet.Random_ring_members(crypto.ZEROHASH)
-	if len(randos) == 0 {
-		return map[string]interface{}{
-			"success": false,
-			"error":   "Could not get ring members - check daemon connection",
-		}
+	walletParams := map[string]interface{}{
+		"scid":     params.SCID,
+		"sc_rpc":   scRPC,
+		"ringsize": float64(2),
 	}
-	destination := randos[0]
-	if destination == wallet.GetAddress().String() && len(randos) > 1 {
-		destination = randos[1]
+	if params.Anonymous {
+		walletParams["ringsize"] = float64(16)
 	}
-
-	// Add DERO transfer if needed
 	if params.DeroAmount > 0 {
-		transfers = append(transfers, rpc.Transfer{
-			Destination: destination,
-			Amount:      0,
-			Burn:        params.DeroAmount,
-		})
+		walletParams["sc_dero_deposit"] = float64(params.DeroAmount)
 	}
-
-	// Add asset transfer if needed
 	if params.AssetSCID != "" && params.AssetAmount > 0 {
-		transfers = append(transfers, rpc.Transfer{
-			Destination: destination,
-			SCID:        crypto.HashHexToHash(params.AssetSCID),
-			Amount:      0,
-			Burn:        params.AssetAmount,
-		})
-	}
-
-	// If no transfers, add a minimal one
-	if len(transfers) == 0 {
-		transfers = append(transfers, rpc.Transfer{
-			Destination: destination,
-			Amount:      0,
-		})
+		walletParams["sc_token_deposit"] = float64(params.AssetAmount)
+		walletParams["sc_token_deposit_scid"] = params.AssetSCID
 	}
 
-	// Set ringsize
-	ringsize := uint64(2)
-	if params.Anonymous {
-		ringsize = 16
-	}
-
-	// Estimate gas via daemon RPC (same as Engram and InternalWalletCall paths)
-	gasStorage := uint64(0)
-	gasRPC := []map[string]interface{}{
-		{"name": "SC_ACTION", "datatype": "U", "value": uint64(0)},
-		{"name": "SC_ID", "datatype": "H", "value": params.SCID},
-		{"name": "entrypoint", "datatype": "S", "value": params.Function},
-	}
-	for name, value := range params.Params {
-		switch v := value.(type) {
-		case string:
-			gasRPC = append(gasRPC, map[string]interface{}{"name": name, "datatype": "S", "value": v})
-		case float64:
-			gasRPC = append(gasRPC, map[string]interface{}{"name": name, "datatype": "U", "value": uint64(v)})
+	a.logToConsole(fmt.Sprintf("[SC] Forwarding invoke through wallet scinvoke path (args=%d)", len(scRPC)-1))
+	invokeResult := a.InternalWalletCall("scinvoke", walletParams, "")
+	if success, _ := invokeResult["success"].(bool); !success {
+		errorMessage := "Transaction failed"
+		if errText, ok := invokeResult["error"].(string); ok && errText != "" {
+			errorMessage = errText
 		}
-	}
-	gasParams := map[string]interface{}{
-		"sc_rpc":   gasRPC,
-		"ringsize": ringsize,
-		"signer":   wallet.GetAddress().String(),
-	}
-	if a.daemonClient != nil {
-		gasResult, gasErr := a.daemonClient.Call("DERO.GetGasEstimate", gasParams)
-		if gasErr != nil {
-			a.logToConsole(fmt.Sprintf("[WARN] Gas estimate failed (proceeding with 0): %v", gasErr))
-		} else if resultMap, ok := gasResult.(map[string]interface{}); ok {
-			if gs, ok := resultMap["gasstorage"].(float64); ok {
-				gasStorage = uint64(gs)
-			}
-		}
-	}
-
-	a.logToConsole(fmt.Sprintf("[SC] Building TX: ringsize=%d gasStorage=%d transfers=%d", ringsize, gasStorage, len(transfers)))
-
-	// Build and send transaction
-	tx, err := wallet.TransferPayload0(transfers, ringsize, false, scArgs, gasStorage, false)
-	if err != nil {
-		// Retry after resync (mirrors InternalWalletCall pattern)
-		a.logToConsole(fmt.Sprintf("[WARN] SC invoke build failed, retrying after resync: %v", err))
-		if syncErr := wallet.Sync_Wallet_Memory_With_Daemon(); syncErr != nil {
-			a.logToConsole(fmt.Sprintf("[WARN] Retry sync failed: %v", syncErr))
+		resp := map[string]interface{}{
+			"success": false,
+			"error":   errorMessage,
 		}
-		tx, err = wallet.TransferPayload0(transfers, ringsize, false, scArgs, gasStorage, false)
-		if err != nil {
-			return map[string]interface{}{
-				"success": false,
-				"error":   "Transaction failed: " + err.Error(),
-			}
+		if technicalError, ok := invokeResult["technicalError"].(string); ok && technicalError != "" {
+			resp["technicalError"] = technicalError
 		}
+		return resp
 	}
 
-	if err := wallet.SendTransaction(tx); err != nil {
-		return map[string]interface{}{
-			"success": false,
-			"error":   "Failed to send transaction: " + err.Error(),
+	txid := ""
+	if resultMap, ok := invokeResult["result"].(map[string]interface{}); ok {
+		if tx, ok := resultMap["txid"].(string); ok {
+			txid = tx
 		}
 	}
 
-	txid := tx.GetHash().String()
-	a.logToConsole(fmt.Sprintf("[OK] SC invoked successfully: %s...", txid[:16]))
-
+	a.logToConsole(fmt.Sprintf("[OK] SC invoked successfully: %s...", txid))
 	return map[string]interface{}{
 		"success":  true,
 		"txid":     txid,
diff --git a/sc_response_normalizer.go b/sc_response_normalizer.go
new file mode 100644
index 0000000..d6622ae
--- /dev/null
+++ b/sc_response_normalizer.go
@@ -0,0 +1,123 @@
+package main
+
+import (
+	"encoding/hex"
+	"strings"
+)
+
+// normalizeDEROGetSCResult decodes printable ASCII string values from
+// DERO.GetSC variable maps to preserve legacy client behavior.
+func normalizeDEROGetSCResult(result interface{}) interface{} {
+	resultMap, ok := result.(map[string]interface{})
+	if !ok {
+		return result
+	}
+
+	normalizeGetSCMapField(resultMap, "stringkeys")
+	normalizeGetSCMapField(resultMap, "uint64keys")
+	return resultMap
+}
+
+func normalizeGetSCMapField(resultMap map[string]interface{}, field string) {
+	raw, ok := resultMap[field]
+	if !ok {
+		return
+	}
+
+	values, ok := raw.(map[string]interface{})
+	if !ok {
+		return
+	}
+
+	normalized := make(map[string]interface{}, len(values))
+	for key, value := range values {
+		if strValue, ok := value.(string); ok {
+			normalized[key] = decodePrintableHexString(strValue)
+		} else {
+			normalized[key] = value
+		}
+	}
+
+	resultMap[field] = normalized
+}
+
+func decodePrintableHexString(value string) string {
+	trimmed := strings.TrimSpace(value)
+	if !shouldDecodeHexString(trimmed) {
+		return value
+	}
+	decimalOnly := isDecimalString(trimmed)
+
+	decoded, err := hex.DecodeString(trimmed)
+	if err != nil {
+		return value
+	}
+
+	if !isPrintableASCII(decoded) {
+		return value
+	}
+
+	decodedText := strings.TrimRight(string(decoded), "\x00 \t\n\r")
+	if decodedText == "" {
+		return value
+	}
+	// Keep short decimal strings as numbers ("50" should stay numeric).
+	if decimalOnly && len(decodedText) == 1 {
+		return value
+	}
+	// Decimal-only hex should decode only when it clearly becomes text.
+	if decimalOnly && !containsASCIIAlpha(decodedText) {
+		return value
+	}
+
+	return decodedText
+}
+
+func shouldDecodeHexString(value string) bool {
+	if value == "" || len(value)%2 != 0 || len(value) < 4 {
+		return false
+	}
+
+	for _, c := range value {
+		if !(c >= '0' && c <= '9' || c >= 'a' && c <= 'f' || c >= 'A' && c <= 'F') {
+			return false
+		}
+	}
+
+	return true
+}
+
+func isPrintableASCII(data []byte) bool {
+	if len(data) == 0 {
+		return false
+	}
+
+	for _, b := range data {
+		if b < 32 || b > 126 {
+			return false
+		}
+	}
+
+	return true
+}
+
+func isDecimalString(value string) bool {
+	if value == "" {
+		return false
+	}
+	for _, c := range value {
+		if c < '0' || c > '9' {
+			return false
+		}
+	}
+	return true
+}
+
+func containsASCIIAlpha(value string) bool {
+	for _, c := range value {
+		if (c >= 'a' && c <= 'z') || (c >= 'A' && c <= 'Z') {
+			return true
+		}
+	}
+	return false
+}
diff --git a/wallet.go b/wallet.go
index 58294fd..e6184fd 100644
--- a/wallet.go
+++ b/wallet.go
@@ -1338,42 +1338,60 @@ func parseXSWDScArgs(params map[string]interface{}, scid string) rpc.Arguments {
 	hasEntrypointInScRpc := false
 	entrypointFromScRpc := ""
 
+	appendScArg := func(argMap map[string]interface{}) {
+		name, _ := argMap["name"].(string)
+		dtype, _ := argMap["datatype"].(string)
+		val := argMap["value"]
+		if name == "" {
+			return
+		}
+		if name == "entrypoint" {
+			hasEntrypointInScRpc = true
+			if ep, ok := val.(string); ok {
+				entrypointFromScRpc = ep
+			}
+		}
+		switch dtype {
+		case "U":
+			switch v := val.(type) {
+			case float64:
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "U", Value: uint64(v)})
+			case uint64:
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "U", Value: v})
+			case int:
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "U", Value: uint64(v)})
+			}
+		case "I":
+			switch v := val.(type) {
+			case float64:
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "I", Value: int64(v)})
+			case int64:
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "I", Value: v})
+			case int:
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "I", Value: int64(v)})
+			}
+		case "S":
+			if v, ok := val.(string); ok {
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "S", Value: v})
+			}
+		case "H":
+			if v, ok := val.(string); ok {
+				scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "H", Value: crypto.HashHexToHash(v)})
+			}
+		}
+	}
+
 	if args, ok := params["sc_rpc"].([]interface{}); ok {
 		for _, arg := range args {
-			a, ok := arg.(map[string]interface{})
+			argMap, ok := arg.(map[string]interface{})
 			if !ok {
 				continue
 			}
-			name, _ := a["name"].(string)
-			dtype, _ := a["datatype"].(string)
-			val := a["value"]
-			if name == "" {
-				continue
-			}
-			if name == "entrypoint" {
-				hasEntrypointInScRpc = true
-				if ep, ok := val.(string); ok {
-					entrypointFromScRpc = ep
-				}
-			}
-			switch dtype {
-			case "U":
-				if v, ok := val.(float64); ok {
-					scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "U", Value: uint64(v)})
-				}
-			case "I":
-				if v, ok := val.(float64); ok {
-					scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "I", Value: int64(v)})
-				}
-			case "S":
-				if v, ok := val.(string); ok {
-					scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "S", Value: v})
-				}
-			case "H":
-				if v, ok := val.(string); ok {
-					scArgs = append(scArgs, rpc.Argument{Name: name, DataType: "H", Value: crypto.HashHexToHash(v)})
-				}
-			}
+			appendScArg(argMap)
+		}
+	} else if args, ok := params["sc_rpc"].([]map[string]interface{}); ok {
+		for _, argMap := range args {
+			appendScArg(argMap)
 		}
 	}
 
@@ -1650,6 +1668,12 @@ func (a *App) InternalWalletCall(method string, params map[string]interface{}, p
 
 		// Parse SC arguments (shared helper handles all datatypes including I, U, S, H)
 		scArgs := parseXSWDScArgs(params, scid)
+		if len(scArgs) == 0 {
+			return map[string]interface{}{
+				"success": false,
+				"error":   "Invalid smart contract call. Missing or malformed 'entrypoint'/'sc_rpc' parameters.",
+			}
+		}
 
 		// sc_dero_deposit / sc_token_deposit -- amount attached to the SC call.
 		// These are top-level params distinct from the transfers array.
@@ -1729,6 +1753,30 @@ func (a *App) InternalWalletCall(method string, params map[string]interface{}, p
 			if f, ok := params["fees"].(float64); ok && f > 0 {
 				fees = uint64(f)
 			}
+
+			// Guard against wallet library panic path: scinvoke with no transfers at all.
+			if len(transfers) == 0 {
+				destination := ""
+				if a.IsInSimulatorMode() {
+					destination = a.getSimulatorTransferDestination(wallet.GetAddress().String())
+				} else {
+					randos := wallet.Random_ring_members(crypto.ZEROHASH)
+					if len(randos) == 0 {
+						return map[string]interface{}{
+							"success": false,
+							"error":   "Could not get ring members for SC call. Please check daemon connection and retry.",
+						}
+					}
+					destination = randos[0]
+					if destination == wallet.GetAddress().String() && len(randos) > 1 {
+						destination = randos[1]
+					}
+				}
+				transfers = append(transfers, rpc.Transfer{
+					Destination: destination,
+					Amount:      0,
+				})
+			}
 			a.logToConsole(fmt.Sprintf("[XSWD] Building scinvoke TX with ringsize=%d fees=%d", ringsize, fees))
 
 			tx, err := wallet.TransferPayload0(transfers, ringsize, false, scArgs, fees, false)
diff --git a/xswd_router.go b/xswd_router.go
index 16caeb9..2e061a6 100644
--- a/xswd_router.go
+++ b/xswd_router.go
@@ -46,6 +46,9 @@ func (a *App) routeDaemonCall(method string, params map[string]interface{}) XSWD
 		log.Printf("[ERR] Daemon call failed: %v", err)
 		return xswdError(FriendlyError(err), err.Error())
 	}
+	if method == "DERO.GetSC" {
+		result = normalizeDEROGetSCResult(result)
+	}
 	return xswdSuccess(result)
 }
 

From a1d2af2d0df49107ae46fb18dccfd780aab9e1d3 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Fri, 1 May 2026 21:15:10 -0400
Subject: [PATCH 02/16] fix(explorer): decode SC string values consistently

Normalize smart contract search results before Explorer renders them and move SC variable display decoding into a focused helper. This keeps scores numeric while allowing printable string values to display as text with raw hex still available.
---
 frontend/src/lib/utils/scValueDisplay.js      | 74 +++++++++++++++++++
 frontend/src/lib/utils/scValueDisplay.test.js | 72 ++++++++++++++++++
 frontend/src/routes/Explorer.svelte           | 50 ++++---------
 search_service.go                             |  3 +
 4 files changed, 164 insertions(+), 35 deletions(-)
 create mode 100644 frontend/src/lib/utils/scValueDisplay.js
 create mode 100644 frontend/src/lib/utils/scValueDisplay.test.js

diff --git a/frontend/src/lib/utils/scValueDisplay.js b/frontend/src/lib/utils/scValueDisplay.js
new file mode 100644
index 0000000..6f601fb
--- /dev/null
+++ b/frontend/src/lib/utils/scValueDisplay.js
@@ -0,0 +1,74 @@
+const HEX_RE = /^[0-9a-fA-F]+$/;
+const PRINTABLE_TEXT_RE = /^[\t\n\r -~]*$/;
+
+function toDisplayString(value) {
+  return value == null ? '' : String(value);
+}
+
+function decodePrintableHexString(value) {
+  if (typeof value !== 'string' || value.length === 0 || value.length % 2 !== 0) {
+    return null;
+  }
+
+  if (!HEX_RE.test(value)) {
+    return null;
+  }
+
+  const bytes = value.match(/.{2}/g).map((pair) => parseInt(pair, 16));
+  let decoded;
+
+  try {
+    decoded = new TextDecoder('utf-8', { fatal: true }).decode(new Uint8Array(bytes));
+  } catch {
+    return null;
+  }
+
+  decoded = decoded.replace(/\0+$/, '');
+
+  if (decoded.length === 0 || !PRINTABLE_TEXT_RE.test(decoded)) {
+    return null;
+  }
+
+  // Scores/counters such as "40", "50", and "60" are valid one-byte hex too.
+  if (/^\d+$/.test(value) && decoded.length === 1) {
+    return null;
+  }
+
+  return decoded;
+}
+
+function formatSCDisplayString(value) {
+  const raw = toDisplayString(value);
+  const decoded = decodePrintableHexString(value);
+
+  if (decoded == null || decoded === raw) {
+    return {
+      display: raw,
+      raw,
+      wasDecoded: false,
+    };
+  }
+
+  return {
+    display: decoded,
+    raw,
+    wasDecoded: true,
+  };
+}
+
+export function formatSCDisplayValue(value) {
+  if (typeof value !== 'string') {
+    const raw = toDisplayString(value);
+    return {
+      display: raw,
+      raw,
+      wasDecoded: false,
+    };
+  }
+
+  return formatSCDisplayString(value);
+}
+
+export function formatSCDisplayKey(key) {
+  return formatSCDisplayString(toDisplayString(key));
+}
diff --git a/frontend/src/lib/utils/scValueDisplay.test.js b/frontend/src/lib/utils/scValueDisplay.test.js
new file mode 100644
index 0000000..a84acfb
--- /dev/null
+++ b/frontend/src/lib/utils/scValueDisplay.test.js
@@ -0,0 +1,72 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+
+import { formatSCDisplayKey, formatSCDisplayValue } from './scValueDisplay.js';
+
+test('decodes printable hex string values shown in SC variables', () => {
+  const cases = [
+    ['53696567', 'Sieg'],
+    ['536965676672696564', 'Siegfried'],
+    ['5465737453696567', 'TestSieg'],
+    ['736563726574', 'secret'],
+    ['5369656746', 'SiegF'],
+  ];
+
+  for (const [raw, display] of cases) {
+    assert.deepEqual(formatSCDisplayValue(raw), {
+      display,
+      raw,
+      wasDecoded: true,
+    });
+  }
+});
+
+test('keeps numeric score and time values numeric-looking', () => {
+  for (const value of [40, 50, 60, 55, 132]) {
+    assert.deepEqual(formatSCDisplayValue(value), {
+      display: String(value),
+      raw: String(value),
+      wasDecoded: false,
+    });
+  }
+
+  for (const value of ['40', '50', '60', '55', '132', '6962919']) {
+    assert.deepEqual(formatSCDisplayValue(value), {
+      display: value,
+      raw: value,
+      wasDecoded: false,
+    });
+  }
+});
+
+test('trims null padding after decoding printable hex strings', () => {
+  assert.deepEqual(formatSCDisplayValue('48656c6c6f00'), {
+    display: 'Hello',
+    raw: '48656c6c6f00',
+    wasDecoded: true,
+  });
+});
+
+test('leaves invalid or non-printable hex values raw', () => {
+  for (const value of ['not-hex', '123', '00ff', '48656c6c6g']) {
+    assert.deepEqual(formatSCDisplayValue(value), {
+      display: value,
+      raw: value,
+      wasDecoded: false,
+    });
+  }
+});
+
+test('formats keys independently from values', () => {
+  assert.deepEqual(formatSCDisplayKey('6e616d65'), {
+    display: 'name',
+    raw: '6e616d65',
+    wasDecoded: true,
+  });
+
+  assert.deepEqual(formatSCDisplayKey('name_0'), {
+    display: 'name_0',
+    raw: 'name_0',
+    wasDecoded: false,
+  });
+});
diff --git a/frontend/src/routes/Explorer.svelte b/frontend/src/routes/Explorer.svelte
index 290f7cb..ec8dd4e 100644
--- a/frontend/src/routes/Explorer.svelte
+++ b/frontend/src/routes/Explorer.svelte
@@ -18,6 +18,7 @@
   import SearchHistory from '../lib/components/SearchHistory.svelte';
   import VersionHistory from '../lib/components/VersionHistory.svelte';
   import SCFunctionInteractor from '../lib/components/SCFunctionInteractor.svelte';
+  import { formatSCDisplayKey, formatSCDisplayValue } from '../lib/utils/scValueDisplay.js';
   import { 
     Package, FileText, Coins, Clock, Copy, ArrowLeft, Home, X, ChevronLeft, ChevronRight,
     FileCode, User, Globe, Lock, Info, AlertTriangle, Check, Loader2, Shield, Pickaxe,
@@ -88,26 +89,12 @@
   // Hex toggle: tracks which string var keys are currently showing raw hex instead of decoded text
   let hexViewKeys = {};
   function toggleHexView(key) { hexViewKeys[key] = !hexViewKeys[key]; hexViewKeys = hexViewKeys; }
-  function tryHexDecode(hex) {
-    if (typeof hex !== 'string') return String(hex);
-    try {
-      const bytes = hex.match(/.{1,2}/g);
-      if (!bytes) return hex;
-      const decoded = new TextDecoder('utf-8', { fatal: true }).decode(
-        new Uint8Array(bytes.map(b => parseInt(b, 16)))
-      );
-      return decoded.replace(/\0+$/, '');
-    } catch { return hex; }
-  }
-  function isHexEncoded(str) {
-    if (typeof str !== 'string' || str.length === 0 || str.length % 2 !== 0) return false;
-    if (!/^[0-9a-fA-F]+$/.test(str)) return false;
-    // DERO.GetSC can return uint64 values under stringkeys when the variable key
-    // itself is a string (e.g. score_0 = "50"). Do not decode decimal numerics
-    // as ASCII hex ("50" -> "P").
-    if (/^\d+$/.test(str)) return false;
-    const decoded = tryHexDecode(str);
-    return decoded !== str;
+  function getSCDisplayName(data, fallback = 'Smart Contract') {
+    const stringkeys = data?.stringkeys || {};
+    const rawName = stringkeys.nameHdr ?? stringkeys.var_header_name ?? stringkeys.dURL;
+    if (rawName == null || rawName === '') return fallback;
+
+    return formatSCDisplayValue(rawName).display || fallback;
   }
   
   // SC Discovery state
@@ -1276,9 +1263,7 @@
     
     watchingInProgress = true;
     try {
-      const scName = searchResult?.data?.stringkeys?.nameHdr || 
-                     searchResult?.data?.stringkeys?.dURL || 
-                     searchQuery.substring(0, 16);
+      const scName = getSCDisplayName(searchResult?.data, searchQuery.substring(0, 16));
       const result = await WatchSmartContract(searchQuery, scName);
       if (result.success) {
         toast.success('Now watching this smart contract');
@@ -2341,19 +2326,16 @@
                 </div>
                 <div class="cmd-vars-list">
                   {#each Object.entries(searchResult.data.stringkeys) as [key, value]}
-                    {@const strVal = String(value)}
-                    {@const decodedKey = isHexEncoded(key) ? tryHexDecode(key) : key}
-                    {@const decodedVal = isHexEncoded(strVal) ? tryHexDecode(strVal) : strVal}
-                    {@const keyWasDecoded = decodedKey !== key}
-                    {@const valWasDecoded = decodedVal !== strVal}
+                    {@const displayKey = formatSCDisplayKey(key)}
+                    {@const displayVal = formatSCDisplayValue(value)}
                     {@const showingRaw = hexViewKeys[key]}
                     <div class="cmd-var-row">
-                      <span class="cmd-var-key string">{showingRaw ? key : decodedKey}</span>
+                      <span class="cmd-var-key string">{showingRaw ? displayKey.raw : displayKey.display}</span>
                       <div class="cmd-var-value-row">
-                        <span class="cmd-var-value" class:cmd-var-hex={showingRaw} title={showingRaw ? strVal : decodedVal}>
-                          {showingRaw ? strVal : decodedVal}
+                        <span class="cmd-var-value" class:cmd-var-hex={showingRaw} title={showingRaw ? displayVal.raw : displayVal.display}>
+                          {showingRaw ? displayVal.raw : displayVal.display}
                         </span>
-                        {#if keyWasDecoded || valWasDecoded}
+                        {#if displayKey.wasDecoded || displayVal.wasDecoded}
                           <button
                             class="cmd-hex-toggle"
                             class:active={showingRaw}
@@ -2414,9 +2396,7 @@
               <!-- SC Quick Actions (Phase 4) -->
               <SCQuickActions 
                 scid={searchQuery} 
-                scName={searchResult.data.stringkeys?.nameHdr ? 
-                  (typeof searchResult.data.stringkeys.nameHdr === 'string' ? 
-                    searchResult.data.stringkeys.nameHdr : 'Smart Contract') : 'Smart Contract'}
+                scName={getSCDisplayName(searchResult.data)}
               />
               
               <!-- Version History (for TELA INDEXes) -->
diff --git a/search_service.go b/search_service.go
index d116aac..c77f0cd 100644
--- a/search_service.go
+++ b/search_service.go
@@ -205,6 +205,9 @@ func (a *App) searchSmartContract(query string) SearchResult {
 			Error:   fmt.Sprintf("Smart contract lookup failed: %v", err),
 		}
 	}
+	if normalized, ok := normalizeDEROGetSCResult(result).(map[string]interface{}); ok {
+		result = normalized
+	}
 
 	// Log what we got back from daemon
 	a.logToConsole(fmt.Sprintf("[SC] Result keys: %v", getMapKeys(result)))

From 92e46c49a10f38c86989cf97ba9bda8dafab93ad Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 00:34:44 -0400
Subject: [PATCH 03/16] fix(wallet): align seed/key reveal flow with Engram
 standards

Move seed and key reveal state into the modal lifecycle, require password confirmation for each reveal, and close the modal on wallet switch or wallet close. Add conditional native clipboard clearing via Wails and await clipboard writes for more reliable copy feedback.
---
 .../lib/components/RevealSecretModal.svelte   | 520 ++++++++++++++++++
 frontend/src/routes/Wallet.svelte             | 323 +++--------
 frontend/wailsjs/go/main/App.d.ts             |   2 +
 frontend/wailsjs/go/main/App.js               |   4 +
 wallet.go                                     |  43 ++
 5 files changed, 641 insertions(+), 251 deletions(-)
 create mode 100644 frontend/src/lib/components/RevealSecretModal.svelte

diff --git a/frontend/src/lib/components/RevealSecretModal.svelte b/frontend/src/lib/components/RevealSecretModal.svelte
new file mode 100644
index 0000000..50fca55
--- /dev/null
+++ b/frontend/src/lib/components/RevealSecretModal.svelte
@@ -0,0 +1,520 @@
+<script>
+  // RevealSecretModal: Engram-shaped reveal flow for the wallet's recovery seed
+  // and secret/public keys.
+  //
+  // Security invariants (matches Engram's pattern + a few extras):
+  //   1. Decrypted material lives ONLY inside this component's local lets.
+  //      When the parent unmounts the modal (close, wallet change, wallet close,
+  //      route change, ESC), the binding goes out of scope and is GC'd.
+  //   2. Password is required on every reveal. There is no sticky "revealed"
+  //      state that survives navigating away and back.
+  //   3. The wallet handle is checked server-side on every call; we never trust
+  //      a previous reveal.
+  //   4. Auto-hide after AUTO_HIDE_MS so an unattended screen does not leak.
+  //   5. Clipboard auto-clear after CLIPBOARD_CLEAR_MS on copy.
+  //
+  // The component is intentionally self-contained. The parent only sets `show`
+  // and `kind`; everything else (password, secret, timers) lives here.
+
+  import { createEventDispatcher, onDestroy, tick } from 'svelte';
+  import { GetSeedPhrase, GetWalletKeys, ClipboardClearIf } from '../../../wailsjs/go/main/App.js';
+  import { toast, handleBackendError } from '../stores/appState.js';
+  import PasswordInput from './PasswordInput.svelte';
+  import { AlertTriangle, Copy, Loader2, Lock, Shield, X, Eye } from 'lucide-svelte';
+
+  export let show = false;
+  /** @type {'seed' | 'keys'} */
+  export let kind = 'seed';
+
+  const dispatch = createEventDispatcher();
+
+  const AUTO_HIDE_MS = 60_000;
+  const CLIPBOARD_CLEAR_MS = 30_000;
+  const TICK_MS = 1_000;
+
+  // === LOCAL STATE — the only place decrypted material exists in the UI ===
+  let password = '';
+  let loading = false;
+  let error = null;
+  let revealed = false;
+  let seed = '';
+  let secretKey = '';
+  let publicKey = '';
+
+  // Auto-hide countdown
+  let autoHideTimer = null;
+  let autoHideTickTimer = null;
+  let autoHideRemainingMs = AUTO_HIDE_MS;
+
+  // Clipboard auto-clear scheduling
+  /** @type {{ timer: any, value: string } | null} */
+  let clipboardScrub = null;
+
+  $: title = kind === 'seed' ? 'Recovery Seed' : 'Wallet Keys';
+  $: lockSubtitle =
+    kind === 'seed'
+      ? 'Enter your wallet password to view your recovery seed phrase'
+      : 'Enter your wallet password to view your secret and public keys';
+
+  function clearAutoHide() {
+    if (autoHideTimer) { clearTimeout(autoHideTimer); autoHideTimer = null; }
+    if (autoHideTickTimer) { clearInterval(autoHideTickTimer); autoHideTickTimer = null; }
+  }
+
+  function startAutoHide() {
+    clearAutoHide();
+    autoHideRemainingMs = AUTO_HIDE_MS;
+    const startedAt = Date.now();
+    autoHideTickTimer = setInterval(() => {
+      autoHideRemainingMs = Math.max(0, AUTO_HIDE_MS - (Date.now() - startedAt));
+    }, TICK_MS);
+    autoHideTimer = setTimeout(() => {
+      toast.info('Auto-hidden after 60s of inactivity');
+      close('auto-hide');
+    }, AUTO_HIDE_MS);
+  }
+
+  function scrubLocalSecrets(reason) {
+    seed = '';
+    secretKey = '';
+    publicKey = '';
+    password = '';
+    revealed = false;
+    error = null;
+    loading = false;
+    clearAutoHide();
+    autoHideRemainingMs = AUTO_HIDE_MS;
+  }
+
+  async function close(reason = 'user') {
+    scrubLocalSecrets(reason);
+    show = false;
+    dispatch('close', { reason });
+  }
+
+  // Parent toggles `show`. When it goes false-from-true, scrub immediately.
+  // When it goes true-from-false, ensure we start with a clean slate.
+  let prevShow = false;
+  $: if (show !== prevShow) {
+    if (show) {
+      scrubLocalSecrets('open');
+      // Focus password on next tick so the field exists in the DOM
+      tick().then(() => {
+        const el = document.querySelector('.reveal-modal .password-input input');
+        if (el) el.focus();
+      });
+    } else {
+      scrubLocalSecrets('hidden-by-parent');
+    }
+    prevShow = show;
+  }
+
+  async function reveal() {
+    if (!password.trim() || loading) return;
+    loading = true;
+    error = null;
+    try {
+      const result = kind === 'seed'
+        ? await GetSeedPhrase(password)
+        : await GetWalletKeys(password);
+
+      // Scrub the password we just used regardless of outcome
+      password = '';
+
+      if (result?.success) {
+        if (kind === 'seed') {
+          seed = result.seed || '';
+        } else {
+          secretKey = result.secretKey || '';
+          publicKey = result.publicKey || '';
+        }
+        revealed = true;
+        startAutoHide();
+      } else {
+        error = handleBackendError(result, { showToast: false }) ||
+          (kind === 'seed' ? 'Failed to retrieve seed phrase' : 'Failed to retrieve wallet keys');
+      }
+    } catch (err) {
+      console.error('[RevealSecretModal] reveal error:', err);
+      error = err.message || 'Unexpected error';
+    } finally {
+      loading = false;
+    }
+  }
+
+  async function copyAndScheduleClear(text, label) {
+    if (!text) return;
+    try {
+      await navigator.clipboard.writeText(text);
+      toast.success(`${label} (clipboard auto-clears in 30s)`, 2500);
+    } catch (e) {
+      toast.error('Failed to copy to clipboard');
+      return;
+    }
+    if (clipboardScrub?.timer) clearTimeout(clipboardScrub.timer);
+    const value = text;
+    clipboardScrub = {
+      value,
+      timer: setTimeout(async () => {
+        // Browser clipboard API requires a user-gesture context, which is
+        // gone 30s after the click. Route the conditional clear through Go,
+        // which talks to the native pasteboard directly with no such
+        // restriction. The Go side reads first and only clears if the value
+        // still matches what we placed, so we never clobber user content.
+        try {
+          const result = await ClipboardClearIf(value);
+          if (result?.cleared) {
+            toast.info('Clipboard cleared');
+          }
+        } catch (e) {
+          console.error('[RevealSecretModal] clipboard scrub failed:', e);
+        }
+        clipboardScrub = null;
+      }, CLIPBOARD_CLEAR_MS),
+    };
+  }
+
+  function handleKeydown(e) {
+    if (!show) return;
+    if (e.key === 'Escape') close('escape');
+    if (e.key === 'Enter' && !revealed && !loading && password.trim()) reveal();
+  }
+
+  onDestroy(() => {
+    scrubLocalSecrets('destroy');
+    if (clipboardScrub?.timer) {
+      clearTimeout(clipboardScrub.timer);
+      clipboardScrub = null;
+    }
+  });
+
+  $: secondsRemaining = Math.ceil(autoHideRemainingMs / 1000);
+</script>
+
+<svelte:window on:keydown={handleKeydown} />
+
+{#if show}
+  <div class="modal-overlay reveal-modal" on:click|self={() => close('overlay-click')}>
+    <div class="modal-content reveal-content">
+      <div class="modal-header">
+        <div class="modal-title">
+          {#if kind === 'seed'}
+            <Eye size={18} />
+            <span>{title}</span>
+          {:else}
+            <Shield size={18} />
+            <span>{title}</span>
+          {/if}
+        </div>
+        <button class="modal-close" on:click={() => close('close-button')} title="Close">
+          <X size={18} />
+        </button>
+      </div>
+
+      <div class="modal-body">
+        {#if !revealed}
+          <div class="lock-banner">
+            <Lock size={16} />
+            <span>{lockSubtitle}</span>
+          </div>
+
+          {#if kind === 'keys'}
+            <div class="critical-banner">
+              <AlertTriangle size={16} />
+              <div>
+                <strong>CRITICAL:</strong> Your secret key provides full control over your wallet. Never share it with anyone.
+              </div>
+            </div>
+          {/if}
+
+          <div class="form-group">
+            <label class="form-label">Wallet Password</label>
+            <div class="password-input">
+              <PasswordInput bind:value={password} placeholder="Enter wallet password" />
+            </div>
+          </div>
+
+          {#if error}
+            <div class="alert alert-error">
+              <AlertTriangle size={14} />
+              <span>{error}</span>
+            </div>
+          {/if}
+        {:else}
+          <div class="auto-hide-pill" title="Auto-hides for your protection">
+            <Lock size={12} />
+            <span>Auto-hides in {secondsRemaining}s</span>
+          </div>
+
+          {#if kind === 'seed'}
+            <div class="seed-header">
+              <AlertTriangle size={28} class="seed-warning-icon" />
+              <h2 class="seed-title">Your Recovery Seed</h2>
+              <p class="seed-subtitle">Write down these 25 words in order. This is the ONLY way to recover your wallet.</p>
+            </div>
+
+            <div class="seed-grid">
+              {#each seed.split(' ') as word, i}
+                <div class="seed-word">
+                  <span class="seed-num">{i + 1}</span>
+                  <span class="seed-text">{word}</span>
+                </div>
+              {/each}
+            </div>
+
+            <div class="seed-warnings">
+              <div class="warning-item">
+                <AlertTriangle size={14} />
+                <span>NEVER share your seed with anyone</span>
+              </div>
+              <div class="warning-item">
+                <AlertTriangle size={14} />
+                <span>Hologram will NEVER ask for your seed</span>
+              </div>
+              <div class="warning-item">
+                <AlertTriangle size={14} />
+                <span>Store this offline in a safe place</span>
+              </div>
+            </div>
+          {:else}
+            <div class="key-section">
+              <div class="key-header">
+                <span class="key-label">SECRET KEY</span>
+                <span class="key-warning-badge">CRITICAL</span>
+              </div>
+              <div class="key-value-box">
+                <code class="key-value mono">{secretKey}</code>
+              </div>
+              <button class="btn btn-secondary btn-sm" on:click={() => copyAndScheduleClear(secretKey, 'Secret key copied')}>
+                <Copy size={14} />
+                Copy Secret Key
+              </button>
+              <div class="key-warning-text">
+                <AlertTriangle size={14} />
+                <span>This key provides full wallet control. Keep it secure and never share it.</span>
+              </div>
+            </div>
+
+            <div class="key-separator"></div>
+
+            <div class="key-section">
+              <div class="key-header">
+                <span class="key-label">PUBLIC KEY</span>
+              </div>
+              <div class="key-value-box">
+                <code class="key-value mono">{publicKey}</code>
+              </div>
+              <button class="btn btn-secondary btn-sm" on:click={() => copyAndScheduleClear(publicKey, 'Public key copied')}>
+                <Copy size={14} />
+                Copy Public Key
+              </button>
+              <div class="key-info-text">
+                <span>Public key can be shared safely. It's used to verify signatures.</span>
+              </div>
+            </div>
+          {/if}
+        {/if}
+      </div>
+
+      <div class="modal-footer">
+        {#if !revealed}
+          <button class="btn btn-ghost" on:click={() => close('cancel')}>Cancel</button>
+          <button class="btn btn-primary" disabled={loading || !password.trim()} on:click={reveal}>
+            {#if loading}
+              <Loader2 size={14} class="spin" />
+              Verifying...
+            {:else}
+              View {kind === 'seed' ? 'Seed Phrase' : 'Keys'}
+            {/if}
+          </button>
+        {:else}
+          {#if kind === 'seed'}
+            <button class="btn btn-secondary" on:click={() => copyAndScheduleClear(seed, 'Seed phrase copied')}>
+              <Copy size={14} />
+              Copy Seed Phrase
+            </button>
+          {/if}
+          <button class="btn btn-primary" on:click={() => close('hide')}>
+            <Lock size={14} />
+            Hide
+          </button>
+        {/if}
+      </div>
+    </div>
+  </div>
+{/if}
+
+<style>
+  .reveal-content {
+    max-width: 560px;
+    width: calc(100vw - 48px);
+  }
+
+  .lock-banner {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 10px 12px;
+    border: 1px solid var(--border-warning, #b8860b);
+    background: rgba(184, 134, 11, 0.08);
+    color: var(--text-warning, #ffb84d);
+    border-radius: 6px;
+    font-size: 13px;
+    margin-bottom: 12px;
+  }
+
+  .critical-banner {
+    display: flex;
+    align-items: flex-start;
+    gap: 8px;
+    padding: 10px 12px;
+    border: 1px solid var(--border-danger, #b22222);
+    background: rgba(178, 34, 34, 0.08);
+    color: var(--text-danger, #ff6666);
+    border-radius: 6px;
+    font-size: 13px;
+    margin-bottom: 12px;
+    line-height: 1.4;
+  }
+
+  .auto-hide-pill {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    align-self: flex-end;
+    padding: 4px 10px;
+    border: 1px solid var(--border-subtle, #2b3340);
+    border-radius: 999px;
+    font-size: 11px;
+    color: var(--text-muted, #8a96a8);
+    margin-bottom: 8px;
+    margin-left: auto;
+  }
+
+  .seed-header {
+    text-align: center;
+    margin-bottom: 12px;
+  }
+
+  .seed-title {
+    margin: 6px 0 4px;
+    font-size: 18px;
+    font-weight: 700;
+  }
+
+  .seed-subtitle {
+    margin: 0;
+    font-size: 12px;
+    color: var(--text-muted, #8a96a8);
+  }
+
+  .seed-grid {
+    display: grid;
+    grid-template-columns: repeat(5, 1fr);
+    gap: 6px;
+    margin-bottom: 12px;
+  }
+
+  .seed-word {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 8px;
+    background: rgba(19, 25, 34, 0.85);
+    border: 1px solid var(--border-subtle, #2b3340);
+    border-radius: 4px;
+    font-size: 12px;
+  }
+
+  .seed-num {
+    color: var(--text-muted, #8a96a8);
+    font-size: 10px;
+    min-width: 18px;
+    text-align: right;
+    font-variant-numeric: tabular-nums;
+  }
+
+  .seed-text {
+    font-weight: 600;
+    font-family: var(--font-mono);
+  }
+
+  .seed-warnings {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    margin-bottom: 8px;
+  }
+
+  .warning-item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: 12px;
+    color: var(--text-muted, #8a96a8);
+  }
+
+  .key-section {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    margin-bottom: 12px;
+  }
+
+  .key-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 11px;
+    letter-spacing: 0.06em;
+    color: var(--text-muted, #8a96a8);
+  }
+
+  .key-warning-badge {
+    padding: 2px 6px;
+    border-radius: 3px;
+    background: rgba(178, 34, 34, 0.15);
+    color: var(--text-danger, #ff6666);
+    font-size: 10px;
+    font-weight: 700;
+    letter-spacing: 0.08em;
+  }
+
+  .key-value-box {
+    padding: 10px;
+    border: 1px solid var(--border-subtle, #2b3340);
+    border-radius: 4px;
+    background: rgba(19, 25, 34, 0.85);
+    word-break: break-all;
+  }
+
+  .key-value {
+    font-family: var(--font-mono);
+    font-size: 12px;
+  }
+
+  .key-warning-text,
+  .key-info-text {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    font-size: 11px;
+    color: var(--text-muted, #8a96a8);
+  }
+
+  .key-separator {
+    height: 1px;
+    background: var(--border-subtle, #2b3340);
+    margin: 4px 0 12px;
+  }
+
+  .mono {
+    font-family: var(--font-mono);
+    font-size: 12px;
+  }
+
+  :global(.reveal-modal .modal-body) {
+    display: flex;
+    flex-direction: column;
+  }
+</style>
diff --git a/frontend/src/routes/Wallet.svelte b/frontend/src/routes/Wallet.svelte
index 2eeaf22..758704b 100644
--- a/frontend/src/routes/Wallet.svelte
+++ b/frontend/src/routes/Wallet.svelte
@@ -15,6 +15,7 @@
   import QRCodeComponent from '../lib/components/QRCode.svelte';
   import AddContactModal from '../lib/components/AddContactModal.svelte';
   import PasswordInput from '../lib/components/PasswordInput.svelte';
+  import RevealSecretModal from '../lib/components/RevealSecretModal.svelte';
   
   // ============================================
   // NAVIGATION STATE
@@ -181,20 +182,14 @@
   // ============================================
   // BACKUP & SECURITY STATE
   // ============================================
-  let backupPassword = '';
-  let seedRevealed = false;
-  let revealedSeed = '';
-  let backupLoading = false;
-  let backupError = null;
-  
-  // Keys state
-  let keysPassword = '';
-  let keysRevealed = false;
-  let revealedSecretKey = '';
-  let revealedPublicKey = '';
-  let keysLoading = false;
-  let keysError = null;
-  
+  // NOTE: The decrypted seed and keys intentionally do NOT live here. They are
+  // owned by <RevealSecretModal/> children below so that unmounting the modal
+  // (close, ESC, wallet switch, wallet close, route change) drops the only
+  // reference and lets GC reclaim the secret. This matches Engram's invariant
+  // that the seed is only read live from the open wallet at render time.
+  let showSeedModal = false;
+  let showKeysModal = false;
+
   // Change Password state
   let changePasswordCurrent = '';
   let changePasswordNew = '';
@@ -1302,78 +1297,15 @@
   }
   
   // ============================================
-  // BACKUP & SECURITY FUNCTIONS
+  // BACKUP & SECURITY: REVEAL MODAL CONTROL
   // ============================================
-  async function revealSeed() {
-    if (!backupPassword.trim()) {
-      backupError = 'Please enter your wallet password';
-      return;
-    }
-    
-    backupLoading = true;
-    backupError = null;
-    
-    try {
-      const result = await GetSeedPhrase(backupPassword);
-      if (result.success) {
-        revealedSeed = result.seed;
-        seedRevealed = true;
-        backupPassword = ''; // Clear password from memory
-        toast.success('Seed phrase revealed');
-      } else {
-        backupError = handleBackendError(result, { showToast: false }) || 'Failed to retrieve seed phrase';
-      }
-    } catch (err) {
-      console.error('Error retrieving seed phrase:', err);
-      backupError = err.message || 'Failed to retrieve seed phrase';
-    } finally {
-      backupLoading = false;
-    }
-  }
-  
-  function resetBackup() {
-    seedRevealed = false;
-    revealedSeed = '';
-    backupPassword = '';
-    backupError = null;
-    showBackupPassword = false;
-  }
-  
-  async function revealKeys() {
-    if (!keysPassword.trim()) {
-      keysError = 'Please enter your wallet password';
-      return;
-    }
-    
-    keysLoading = true;
-    keysError = null;
-    
-    try {
-      const result = await GetWalletKeys(keysPassword);
-      if (result.success) {
-        revealedSecretKey = result.secretKey;
-        revealedPublicKey = result.publicKey;
-        keysRevealed = true;
-        keysPassword = ''; // Clear password from memory
-        toast.success('Wallet keys revealed');
-      } else {
-        keysError = handleBackendError(result, { showToast: false }) || 'Failed to retrieve wallet keys';
-      }
-    } catch (err) {
-      console.error('Error retrieving wallet keys:', err);
-      keysError = err.message || 'Failed to retrieve wallet keys';
-    } finally {
-      keysLoading = false;
-    }
-  }
-  
-  function resetKeys() {
-    keysRevealed = false;
-    revealedSecretKey = '';
-    revealedPublicKey = '';
-    keysPassword = '';
-    keysError = null;
-    showKeysPassword = false;
+  // The decrypted seed/keys live inside <RevealSecretModal/>. This route only
+  // toggles which modal is mounted. Whenever the active wallet path changes
+  // or the wallet is closed, both modals are dismissed so the child is
+  // unmounted and its local secret state is GC'd.
+  $: if (!$walletState.isOpen && (showSeedModal || showKeysModal)) {
+    showSeedModal = false;
+    showKeysModal = false;
   }
   
   // ============================================
@@ -1575,8 +1507,14 @@
     }
   }
 
-  // Keep wallet path display synced when wallet is switched outside this route
+  // Keep wallet path display synced when wallet is switched outside this route.
+  // Also dismiss any open reveal modal so the previous wallet's decrypted
+  // material cannot render under the new wallet (security: cross-wallet leak).
   $: if ($walletState.walletPath && $walletState.walletPath !== currentWalletPath) {
+    if (currentWalletPath && (showSeedModal || showKeysModal)) {
+      showSeedModal = false;
+      showKeysModal = false;
+    }
     currentWalletPath = $walletState.walletPath;
   }
 </script>
@@ -2847,83 +2785,22 @@
                 RECOVERY SEED
               </div>
             </div>
-            
+
             <div class="backup-content">
-              {#if !seedRevealed}
-                <!-- Password Prompt -->
-                <div class="backup-warning">
-                  <AlertTriangle size={16} />
-                  <span>Enter your wallet password to view your recovery seed phrase</span>
-                </div>
-                
-                <div class="form-group">
-                  <label class="form-label">Wallet Password</label>
-                  <PasswordInput bind:value={backupPassword} placeholder="Enter wallet password" />
-                </div>
-                
-                {#if backupError}
-                  <div class="alert alert-error">
-                    <AlertTriangle size={14} />
-                    <span>{backupError}</span>
-                  </div>
-                {/if}
-                
-                <div class="form-actions">
-                  <button 
-                    class="btn btn-primary" 
-                    on:click={revealSeed} 
-                    disabled={backupLoading || !backupPassword.trim()}
-                  >
-                    {#if backupLoading}
-                      <Loader2 size={14} class="spin" />
-                      Verifying...
-                    {:else}
-                      View Seed Phrase
-                    {/if}
-                  </button>
-                </div>
-              {:else}
-                <!-- Seed Display -->
-                <div class="seed-header">
-                  <AlertTriangle size={32} class="seed-warning-icon" />
-                  <h2 class="seed-title">Your Recovery Seed</h2>
-                  <p class="seed-subtitle">Write down these 25 words in order. This is the ONLY way to recover your wallet.</p>
-                </div>
-                
-                <div class="seed-grid">
-                  {#each revealedSeed.split(' ') as word, i}
-                    <div class="seed-word">
-                      <span class="seed-num">{i + 1}</span>
-                      <span class="seed-text">{word}</span>
-                    </div>
-                  {/each}
-                </div>
-                
-                <div class="seed-warnings">
-                  <div class="warning-item">
-                    <AlertTriangle size={16} />
-                    <span>NEVER share your seed with anyone</span>
-                  </div>
-                  <div class="warning-item">
-                    <AlertTriangle size={16} />
-                    <span>Hologram will NEVER ask for your seed</span>
-                  </div>
-                  <div class="warning-item">
-                    <AlertTriangle size={16} />
-                    <span>Store this offline in a safe place</span>
-                  </div>
-                </div>
-                
-                <div class="backup-actions">
-                  <button class="btn btn-secondary" on:click={() => copyToClipboard(revealedSeed, 'Seed phrase copied!')}>
-                    <Copy size={14} />
-                    Copy Seed Phrase
-                  </button>
-                  <button class="btn btn-ghost" on:click={resetBackup}>
-                    Hide Seed
-                  </button>
-                </div>
-              {/if}
+              <div class="backup-warning">
+                <AlertTriangle size={16} />
+                <span>Your password is required every time the seed is revealed. The seed is held only while open and is auto-hidden after 60 seconds.</span>
+              </div>
+
+              <div class="form-actions">
+                <button
+                  class="btn btn-primary"
+                  on:click={() => { showSeedModal = true; }}
+                >
+                  <Eye size={14} />
+                  View Seed Phrase
+                </button>
+              </div>
             </div>
           </div>
 
@@ -2935,97 +2812,29 @@
                 WALLET KEYS
               </div>
             </div>
-            
+
             <div class="backup-content">
-              {#if !keysRevealed}
-                <!-- Password Prompt -->
-                <div class="backup-warning">
-                  <AlertTriangle size={16} />
-                  <span>Enter your wallet password to view your secret and public keys</span>
-                </div>
-                
-                <div class="keys-warning-critical">
-                  <AlertTriangle size={16} />
-                  <div>
-                    <strong>CRITICAL:</strong> Your secret key provides full control over your wallet. Never share it with anyone.
-                  </div>
-                </div>
-                
-                <div class="form-group">
-                  <label class="form-label">Wallet Password</label>
-                  <PasswordInput bind:value={keysPassword} placeholder="Enter wallet password" />
-                </div>
-                
-                {#if keysError}
-                  <div class="alert alert-error">
-                    <AlertTriangle size={14} />
-                    <span>{keysError}</span>
-                  </div>
-                {/if}
-                
-                <div class="form-actions">
-                  <button 
-                    class="btn btn-primary" 
-                    on:click={revealKeys} 
-                    disabled={keysLoading || !keysPassword.trim()}
-                  >
-                    {#if keysLoading}
-                      <Loader2 size={14} class="spin" />
-                      Verifying...
-                    {:else}
-                      View Keys
-                    {/if}
-                  </button>
-                </div>
-              {:else}
-                <!-- Keys Display -->
-                <div class="keys-display">
-                  <!-- Secret Key -->
-                  <div class="key-section">
-                    <div class="key-header">
-                      <span class="key-label">SECRET KEY</span>
-                      <span class="key-warning-badge">CRITICAL</span>
-                    </div>
-                    <div class="key-value-box">
-                      <code class="key-value mono">{revealedSecretKey}</code>
-                    </div>
-                    <button class="btn btn-secondary btn-sm" on:click={() => copyToClipboard(revealedSecretKey, 'Secret key copied!')}>
-                      <Copy size={14} />
-                      Copy Secret Key
-                    </button>
-                    <div class="key-warning-text">
-                      <AlertTriangle size={14} />
-                      <span>This key provides full wallet control. Keep it secure and never share it.</span>
-                    </div>
-                  </div>
-                  
-                  <!-- Separator -->
-                  <div class="key-separator"></div>
-                  
-                  <!-- Public Key -->
-                  <div class="key-section">
-                    <div class="key-header">
-                      <span class="key-label">PUBLIC KEY</span>
-                    </div>
-                    <div class="key-value-box">
-                      <code class="key-value mono">{revealedPublicKey}</code>
-                    </div>
-                    <button class="btn btn-secondary btn-sm" on:click={() => copyToClipboard(revealedPublicKey, 'Public key copied!')}>
-                      <Copy size={14} />
-                      Copy Public Key
-                    </button>
-                    <div class="key-info-text">
-                      <span>Public key can be shared safely. It's used to verify signatures.</span>
-                    </div>
-                  </div>
-                </div>
-                
-                <div class="backup-actions">
-                  <button class="btn btn-ghost" on:click={resetKeys}>
-                    Hide Keys
-                  </button>
+              <div class="backup-warning">
+                <AlertTriangle size={16} />
+                <span>Your password is required every time keys are revealed. Keys are held only while open and are auto-hidden after 60 seconds.</span>
+              </div>
+
+              <div class="keys-warning-critical">
+                <AlertTriangle size={16} />
+                <div>
+                  <strong>CRITICAL:</strong> Your secret key provides full control over your wallet. Never share it with anyone.
                 </div>
-              {/if}
+              </div>
+
+              <div class="form-actions">
+                <button
+                  class="btn btn-primary"
+                  on:click={() => { showKeysModal = true; }}
+                >
+                  <Key size={14} />
+                  View Keys
+                </button>
+              </div>
             </div>
           </div>
 
@@ -3546,6 +3355,18 @@
   on:close={() => { editingContact = null; }}
 />
 
+<!-- Reveal modals: own all decrypted seed/key state inside the child so
+     unmounting (close, ESC, wallet switch, wallet close) drops the only
+     reference and lets GC reclaim the secret. -->
+<RevealSecretModal
+  bind:show={showSeedModal}
+  kind="seed"
+/>
+<RevealSecretModal
+  bind:show={showKeysModal}
+  kind="keys"
+/>
+
 <style>
   /* ============================================
      WALLET PAGE STYLES
diff --git a/frontend/wailsjs/go/main/App.d.ts b/frontend/wailsjs/go/main/App.d.ts
index ccacc7f..a6f0557 100755
--- a/frontend/wailsjs/go/main/App.d.ts
+++ b/frontend/wailsjs/go/main/App.d.ts
@@ -59,6 +59,8 @@ export function ClearRecentWallets():Promise<Record<string, any>>;
 
 export function ClearSearchExclusions():Promise<Record<string, any>>;
 
+export function ClipboardClearIf(arg1:string):Promise<Record<string, any>>;
+
 export function CloneTELA(arg1:string,arg2:boolean):Promise<Record<string, any>>;
 
 export function CloseWallet():Promise<Record<string, any>>;
diff --git a/frontend/wailsjs/go/main/App.js b/frontend/wailsjs/go/main/App.js
index 5b8b4c1..f594a97 100755
--- a/frontend/wailsjs/go/main/App.js
+++ b/frontend/wailsjs/go/main/App.js
@@ -114,6 +114,10 @@ export function ClearSearchExclusions() {
   return window['go']['main']['App']['ClearSearchExclusions']();
 }
 
+export function ClipboardClearIf(arg1) {
+  return window['go']['main']['App']['ClipboardClearIf'](arg1);
+}
+
 export function CloneTELA(arg1, arg2) {
   return window['go']['main']['App']['CloneTELA'](arg1, arg2);
 }
diff --git a/wallet.go b/wallet.go
index e6184fd..f9c9199 100644
--- a/wallet.go
+++ b/wallet.go
@@ -644,6 +644,49 @@ func (a *App) GetWalletKeys(password string) map[string]interface{} {
 	}
 }
 
+// ClipboardClearIf atomically clears the native OS clipboard if it still
+// contains the value the caller previously placed there.
+//
+// Why this exists: navigator.clipboard.writeText("") in the embedded WebKit
+// is rejected with NotAllowedError when invoked outside a user-gesture
+// context (e.g. from a setTimeout 30s after a copy). The native pasteboard
+// has no such restriction, so we route the auto-clear through Go.
+//
+// Returns:
+//
+//	{ success: bool, cleared: bool, error?: string }
+//
+// `cleared` is true only when the clipboard contained `expected` and was
+// successfully overwritten with empty. If the user copied something else
+// in the meantime, `cleared` is false and we leave their data alone.
+func (a *App) ClipboardClearIf(expected string) map[string]interface{} {
+	current, err := runtime.ClipboardGetText(a.ctx)
+	if err != nil {
+		return map[string]interface{}{
+			"success": false,
+			"cleared": false,
+			"error":   "clipboard read failed: " + err.Error(),
+		}
+	}
+	if current != expected {
+		return map[string]interface{}{
+			"success": true,
+			"cleared": false,
+		}
+	}
+	if err := runtime.ClipboardSetText(a.ctx, ""); err != nil {
+		return map[string]interface{}{
+			"success": false,
+			"cleared": false,
+			"error":   "clipboard write failed: " + err.Error(),
+		}
+	}
+	return map[string]interface{}{
+		"success": true,
+		"cleared": true,
+	}
+}
+
 // GetIntegratedAddress generates an integrated address with optional destination port (payment ID)
 // In DERO, "payment ID" is implemented as a destination port (uint64) embedded in the address.
 // The resulting address changes from dero.../deto... to deroi.../detoi... format.

From b30d5b2b37e5c1cba35ff181ee0d613f20e46a23 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 01:16:21 -0400
Subject: [PATCH 04/16] style(wallet): align RevealSecretModal with HOLOGRAM
 design system

- Use global modal-* classes from hologram.css
- Match original seed grid and key display patterns
- Move auto-hide timer to header row
- Make seed header compact (remove large warning icon)
- Tighten warning items for better fit
- Fix widow in key warning text
---
 .../lib/components/RevealSecretModal.svelte   | 374 ++++++++++--------
 1 file changed, 216 insertions(+), 158 deletions(-)

diff --git a/frontend/src/lib/components/RevealSecretModal.svelte b/frontend/src/lib/components/RevealSecretModal.svelte
index 50fca55..82e5a32 100644
--- a/frontend/src/lib/components/RevealSecretModal.svelte
+++ b/frontend/src/lib/components/RevealSecretModal.svelte
@@ -20,7 +20,7 @@
   import { GetSeedPhrase, GetWalletKeys, ClipboardClearIf } from '../../../wailsjs/go/main/App.js';
   import { toast, handleBackendError } from '../stores/appState.js';
   import PasswordInput from './PasswordInput.svelte';
-  import { AlertTriangle, Copy, Loader2, Lock, Shield, X, Eye } from 'lucide-svelte';
+  import { AlertTriangle, Copy, Loader2, Lock, Shield, X, Eye, Key } from 'lucide-svelte';
 
   export let show = false;
   /** @type {'seed' | 'keys'} */
@@ -50,7 +50,7 @@
   /** @type {{ timer: any, value: string } | null} */
   let clipboardScrub = null;
 
-  $: title = kind === 'seed' ? 'Recovery Seed' : 'Wallet Keys';
+  $: title = kind === 'seed' ? 'RECOVERY SEED' : 'WALLET KEYS';
   $: lockSubtitle =
     kind === 'seed'
       ? 'Enter your wallet password to view your recovery seed phrase'
@@ -69,7 +69,7 @@
       autoHideRemainingMs = Math.max(0, AUTO_HIDE_MS - (Date.now() - startedAt));
     }, TICK_MS);
     autoHideTimer = setTimeout(() => {
-      toast.info('Auto-hidden after 60s of inactivity');
+      toast.info('Auto-hidden after 60s');
       close('auto-hide');
     }, AUTO_HIDE_MS);
   }
@@ -98,9 +98,8 @@
   $: if (show !== prevShow) {
     if (show) {
       scrubLocalSecrets('open');
-      // Focus password on next tick so the field exists in the DOM
       tick().then(() => {
-        const el = document.querySelector('.reveal-modal .password-input input');
+        const el = document.querySelector('.reveal-modal-overlay .password-input input');
         if (el) el.focus();
       });
     } else {
@@ -118,7 +117,6 @@
         ? await GetSeedPhrase(password)
         : await GetWalletKeys(password);
 
-      // Scrub the password we just used regardless of outcome
       password = '';
 
       if (result?.success) {
@@ -156,11 +154,6 @@
     clipboardScrub = {
       value,
       timer: setTimeout(async () => {
-        // Browser clipboard API requires a user-gesture context, which is
-        // gone 30s after the click. Route the conditional clear through Go,
-        // which talks to the native pasteboard directly with no such
-        // restriction. The Go side reads first and only clears if the value
-        // still matches what we placed, so we never clobber user content.
         try {
           const result = await ClipboardClearIf(value);
           if (result?.cleared) {
@@ -194,32 +187,42 @@
 <svelte:window on:keydown={handleKeydown} />
 
 {#if show}
-  <div class="modal-overlay reveal-modal" on:click|self={() => close('overlay-click')}>
-    <div class="modal-content reveal-content">
+  <div class="modal-overlay reveal-modal-overlay" on:click|self={() => close('overlay-click')}>
+    <div class="modal-content modal-content-wide seed-modal-content">
+      <!-- Modal Header -->
       <div class="modal-header">
         <div class="modal-title">
           {#if kind === 'seed'}
-            <Eye size={18} />
-            <span>{title}</span>
+            <span class="modal-icon warning"><Eye size={16} /></span>
           {:else}
-            <Shield size={18} />
-            <span>{title}</span>
+            <span class="modal-icon warning"><Key size={16} /></span>
           {/if}
+          <span>{title}</span>
+        </div>
+        <div class="modal-header-right">
+          {#if revealed}
+            <div class="auto-hide-pill">
+              <Lock size={12} />
+              <span>Auto-hides in {secondsRemaining}s</span>
+            </div>
+          {/if}
+          <button class="modal-close" on:click={() => close('close-button')} title="Close">
+            <X size={18} />
+          </button>
         </div>
-        <button class="modal-close" on:click={() => close('close-button')} title="Close">
-          <X size={18} />
-        </button>
       </div>
 
+      <!-- Modal Body -->
       <div class="modal-body">
         {#if !revealed}
-          <div class="lock-banner">
-            <Lock size={16} />
+          <!-- Password Prompt State -->
+          <div class="backup-warning">
+            <AlertTriangle size={16} />
             <span>{lockSubtitle}</span>
           </div>
 
           {#if kind === 'keys'}
-            <div class="critical-banner">
+            <div class="keys-warning-critical">
               <AlertTriangle size={16} />
               <div>
                 <strong>CRITICAL:</strong> Your secret key provides full control over your wallet. Never share it with anyone.
@@ -241,14 +244,10 @@
             </div>
           {/if}
         {:else}
-          <div class="auto-hide-pill" title="Auto-hides for your protection">
-            <Lock size={12} />
-            <span>Auto-hides in {secondsRemaining}s</span>
-          </div>
-
+          <!-- Revealed State -->
           {#if kind === 'seed'}
-            <div class="seed-header">
-              <AlertTriangle size={28} class="seed-warning-icon" />
+            <!-- Seed Display -->
+            <div class="seed-header-compact">
               <h2 class="seed-title">Your Recovery Seed</h2>
               <p class="seed-subtitle">Write down these 25 words in order. This is the ONLY way to recover your wallet.</p>
             </div>
@@ -264,59 +263,66 @@
 
             <div class="seed-warnings">
               <div class="warning-item">
-                <AlertTriangle size={14} />
+                <AlertTriangle size={12} />
                 <span>NEVER share your seed with anyone</span>
               </div>
               <div class="warning-item">
-                <AlertTriangle size={14} />
+                <AlertTriangle size={12} />
                 <span>Hologram will NEVER ask for your seed</span>
               </div>
               <div class="warning-item">
-                <AlertTriangle size={14} />
+                <AlertTriangle size={12} />
                 <span>Store this offline in a safe place</span>
               </div>
             </div>
           {:else}
-            <div class="key-section">
-              <div class="key-header">
-                <span class="key-label">SECRET KEY</span>
-                <span class="key-warning-badge">CRITICAL</span>
-              </div>
-              <div class="key-value-box">
-                <code class="key-value mono">{secretKey}</code>
-              </div>
-              <button class="btn btn-secondary btn-sm" on:click={() => copyAndScheduleClear(secretKey, 'Secret key copied')}>
-                <Copy size={14} />
-                Copy Secret Key
-              </button>
-              <div class="key-warning-text">
-                <AlertTriangle size={14} />
-                <span>This key provides full wallet control. Keep it secure and never share it.</span>
+            <!-- Keys Display -->
+            <div class="keys-display">
+              <!-- Secret Key -->
+              <div class="key-section">
+                <div class="key-header">
+                  <span class="key-label">SECRET KEY</span>
+                  <span class="key-warning-badge">CRITICAL</span>
+                </div>
+                <div class="key-value-box">
+                  <code class="key-value mono">{secretKey}</code>
+                </div>
+                <button class="btn btn-secondary btn-sm" on:click={() => copyAndScheduleClear(secretKey, 'Secret key copied')}>
+                  <Copy size={14} />
+                  Copy Secret Key
+                </button>
+                <div class="key-warning-text">
+                  <AlertTriangle size={14} />
+                  <span>This key grants full wallet control. Never share it.</span>
+                </div>
               </div>
-            </div>
 
-            <div class="key-separator"></div>
+              <!-- Separator -->
+              <div class="key-separator"></div>
 
-            <div class="key-section">
-              <div class="key-header">
-                <span class="key-label">PUBLIC KEY</span>
-              </div>
-              <div class="key-value-box">
-                <code class="key-value mono">{publicKey}</code>
-              </div>
-              <button class="btn btn-secondary btn-sm" on:click={() => copyAndScheduleClear(publicKey, 'Public key copied')}>
-                <Copy size={14} />
-                Copy Public Key
-              </button>
-              <div class="key-info-text">
-                <span>Public key can be shared safely. It's used to verify signatures.</span>
+              <!-- Public Key -->
+              <div class="key-section">
+                <div class="key-header">
+                  <span class="key-label">PUBLIC KEY</span>
+                </div>
+                <div class="key-value-box">
+                  <code class="key-value mono">{publicKey}</code>
+                </div>
+                <button class="btn btn-secondary btn-sm" on:click={() => copyAndScheduleClear(publicKey, 'Public key copied')}>
+                  <Copy size={14} />
+                  Copy Public Key
+                </button>
+                <div class="key-info-text">
+                  <span>Public key can be shared safely. It's used to verify signatures.</span>
+                </div>
               </div>
             </div>
           {/if}
         {/if}
       </div>
 
-      <div class="modal-footer">
+      <!-- Modal Footer -->
+      <div class="modal-footer modal-footer-spread">
         {#if !revealed}
           <button class="btn btn-ghost" on:click={() => close('cancel')}>Cancel</button>
           <button class="btn btn-primary" disabled={loading || !password.trim()} on:click={reveal}>
@@ -345,176 +351,228 @@
 {/if}
 
 <style>
-  .reveal-content {
-    max-width: 560px;
-    width: calc(100vw - 48px);
+  /* Use HOLOGRAM design system tokens and patterns */
+
+  /* Seed modal needs extra height to show all content comfortably */
+  :global(.seed-modal-content) {
+    max-height: 92vh;
+    min-height: 580px;
   }
 
-  .lock-banner {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 10px 12px;
-    border: 1px solid var(--border-warning, #b8860b);
-    background: rgba(184, 134, 11, 0.08);
-    color: var(--text-warning, #ffb84d);
-    border-radius: 6px;
-    font-size: 13px;
-    margin-bottom: 12px;
+  :global(.seed-modal-content > .modal-body) {
+    overflow-y: auto;
+    flex: 1;
+    min-height: 0;
   }
 
-  .critical-banner {
+  /* Modal header right section */
+  .modal-header-right {
     display: flex;
-    align-items: flex-start;
-    gap: 8px;
-    padding: 10px 12px;
-    border: 1px solid var(--border-danger, #b22222);
-    background: rgba(178, 34, 34, 0.08);
-    color: var(--text-danger, #ff6666);
-    border-radius: 6px;
-    font-size: 13px;
-    margin-bottom: 12px;
-    line-height: 1.4;
+    align-items: center;
+    gap: var(--s-3);
   }
 
+  /* Auto-hide countdown pill - now in header */
   .auto-hide-pill {
     display: inline-flex;
     align-items: center;
-    gap: 6px;
-    align-self: flex-end;
-    padding: 4px 10px;
-    border: 1px solid var(--border-subtle, #2b3340);
-    border-radius: 999px;
+    gap: var(--s-2);
+    padding: var(--s-1) var(--s-3);
+    background: var(--void-deep);
+    border: 1px solid var(--border-dim);
+    border-radius: var(--r-full);
     font-size: 11px;
-    color: var(--text-muted, #8a96a8);
-    margin-bottom: 8px;
-    margin-left: auto;
+    color: var(--text-4);
   }
 
-  .seed-header {
+  /* Seed Display - compact header without large icon */
+  .seed-header-compact {
     text-align: center;
-    margin-bottom: 12px;
+    margin-bottom: var(--s-4);
   }
 
   .seed-title {
-    margin: 6px 0 4px;
-    font-size: 18px;
-    font-weight: 700;
+    font-family: var(--font-mono);
+    font-size: 16px;
+    font-weight: 600;
+    color: var(--text-1);
+    margin: 0 0 var(--s-1) 0;
   }
 
-  .seed-subtitle {
-    margin: 0;
-    font-size: 12px;
-    color: var(--text-muted, #8a96a8);
+  .seed-subtitle { 
+    font-size: 12px; 
+    color: var(--text-3); 
+    margin: 0; 
   }
 
   .seed-grid {
     display: grid;
     grid-template-columns: repeat(5, 1fr);
-    gap: 6px;
-    margin-bottom: 12px;
+    gap: var(--s-2);
+    background: var(--void-deep);
+    padding: var(--s-4);
+    border-radius: var(--r-md);
+    margin-bottom: var(--s-4);
   }
 
   .seed-word {
     display: flex;
+    flex-direction: column;
     align-items: center;
-    gap: 6px;
-    padding: 6px 8px;
-    background: rgba(19, 25, 34, 0.85);
-    border: 1px solid var(--border-subtle, #2b3340);
-    border-radius: 4px;
-    font-size: 12px;
+    padding: var(--s-2);
+    background: var(--void-mid);
+    border-radius: var(--r-sm);
   }
 
-  .seed-num {
-    color: var(--text-muted, #8a96a8);
-    font-size: 10px;
-    min-width: 18px;
-    text-align: right;
-    font-variant-numeric: tabular-nums;
+  .seed-num { 
+    font-size: 9px; 
+    color: var(--text-4); 
+    margin-bottom: 2px; 
   }
 
-  .seed-text {
-    font-weight: 600;
-    font-family: var(--font-mono);
+  .seed-text { 
+    font-family: var(--font-mono); 
+    font-size: 11px; 
+    color: var(--text-1); 
+    font-weight: 500; 
   }
 
-  .seed-warnings {
-    display: flex;
-    flex-direction: column;
-    gap: 6px;
-    margin-bottom: 8px;
+  .seed-warnings { 
+    display: flex; 
+    flex-direction: column; 
+    gap: 6px; 
   }
 
   .warning-item {
     display: flex;
     align-items: center;
-    gap: 8px;
+    gap: var(--s-2);
+    padding: 6px var(--s-3);
+    background: rgba(251, 191, 36, 0.08);
+    border-radius: var(--r-sm);
+    font-size: 11px;
+    color: var(--status-warn);
+  }
+
+  /* Backup Warning Banner */
+  .backup-warning {
+    display: flex;
+    align-items: center;
+    gap: var(--s-2);
+    padding: var(--s-3) var(--s-4);
+    background: rgba(251, 191, 36, 0.1);
+    border: 1px solid rgba(251, 191, 36, 0.2);
+    border-radius: var(--r-md);
+    margin-bottom: var(--s-4);
     font-size: 12px;
-    color: var(--text-muted, #8a96a8);
+    color: var(--status-warn);
+  }
+
+  /* Keys Display - matches original Wallet.svelte styling */
+  .keys-warning-critical {
+    display: flex;
+    align-items: flex-start;
+    gap: var(--s-2);
+    padding: var(--s-3) var(--s-4);
+    background: rgba(248, 113, 113, 0.1);
+    border: 1px solid rgba(248, 113, 113, 0.3);
+    border-radius: var(--r-md);
+    margin-bottom: var(--s-4);
+    font-size: 12px;
+    color: var(--status-err);
+  }
+
+  .keys-warning-critical strong {
+    font-weight: 600;
+  }
+
+  .keys-display {
+    display: flex;
+    flex-direction: column;
+    gap: var(--s-4);
   }
 
   .key-section {
     display: flex;
     flex-direction: column;
-    gap: 8px;
-    margin-bottom: 12px;
+    gap: var(--s-3);
   }
 
   .key-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
+    font-family: var(--font-mono);
     font-size: 11px;
-    letter-spacing: 0.06em;
-    color: var(--text-muted, #8a96a8);
+    font-weight: 500;
+    text-transform: uppercase;
+    letter-spacing: 0.1em;
+    color: var(--text-3);
+  }
+
+  .key-label {
+    color: var(--text-2);
   }
 
   .key-warning-badge {
-    padding: 2px 6px;
-    border-radius: 3px;
-    background: rgba(178, 34, 34, 0.15);
-    color: var(--text-danger, #ff6666);
-    font-size: 10px;
-    font-weight: 700;
-    letter-spacing: 0.08em;
+    padding: 2px 8px;
+    background: rgba(248, 113, 113, 0.15);
+    color: var(--status-err);
+    border-radius: var(--r-xs);
+    font-size: 9px;
+    font-weight: 600;
   }
 
   .key-value-box {
-    padding: 10px;
-    border: 1px solid var(--border-subtle, #2b3340);
-    border-radius: 4px;
-    background: rgba(19, 25, 34, 0.85);
+    padding: var(--s-3) var(--s-4);
+    background: var(--void-deep);
+    border: 1px solid var(--border-dim);
+    border-radius: var(--r-md);
     word-break: break-all;
   }
 
   .key-value {
     font-family: var(--font-mono);
-    font-size: 12px;
+    font-size: 11px;
+    color: var(--text-1);
+    line-height: 1.6;
+    display: block;
   }
 
-  .key-warning-text,
-  .key-info-text {
+  .key-value.mono {
+    font-variant-numeric: tabular-nums;
+  }
+
+  .key-warning-text {
     display: flex;
     align-items: center;
-    gap: 6px;
+    gap: var(--s-2);
+    padding: var(--s-2) var(--s-3);
+    background: rgba(251, 191, 36, 0.1);
+    border-radius: var(--r-sm);
     font-size: 11px;
-    color: var(--text-muted, #8a96a8);
+    color: var(--status-warn);
+  }
+
+  .key-info-text {
+    padding: var(--s-2) var(--s-3);
+    font-size: 11px;
+    color: var(--text-4);
+    font-style: italic;
   }
 
   .key-separator {
     height: 1px;
-    background: var(--border-subtle, #2b3340);
-    margin: 4px 0 12px;
+    background: var(--border-dim);
+    margin: var(--s-2) 0;
   }
 
-  .mono {
-    font-family: var(--font-mono);
-    font-size: 12px;
+  /* Spin Animation */
+  :global(.spin) {
+    animation: spin 1s linear infinite;
   }
 
-  :global(.reveal-modal .modal-body) {
-    display: flex;
-    flex-direction: column;
+  @keyframes spin {
+    to { transform: rotate(360deg); }
   }
 </style>

From 9994f9179da5eb5774e99d644c7cc6df4df5a0ed Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 01:19:30 -0400
Subject: [PATCH 05/16] chore(wallet): remove stale reveal styles

Remove old inline seed/key display selectors after moving reveal UI into RevealSecretModal so Wallet.svelte stays warning-free.
---
 frontend/src/routes/Wallet.svelte | 90 +------------------------------
 1 file changed, 1 insertion(+), 89 deletions(-)

diff --git a/frontend/src/routes/Wallet.svelte b/frontend/src/routes/Wallet.svelte
index 758704b..04a6212 100644
--- a/frontend/src/routes/Wallet.svelte
+++ b/frontend/src/routes/Wallet.svelte
@@ -4839,14 +4839,7 @@
     font-size: 12px;
     color: var(--status-warn);
   }
-  
-  .backup-actions {
-    display: flex;
-    gap: var(--s-3);
-    justify-content: flex-end;
-    margin-top: var(--s-4);
-  }
-  
+
   /* Keys Display Styles */
   .keys-warning-critical {
     display: flex;
@@ -4864,87 +4857,6 @@
   .keys-warning-critical strong {
     font-weight: 600;
   }
-  
-  .keys-display {
-    display: flex;
-    flex-direction: column;
-    gap: var(--s-4);
-  }
-  
-  .key-section {
-    display: flex;
-    flex-direction: column;
-    gap: var(--s-3);
-  }
-  
-  .key-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    font-family: var(--font-mono);
-    font-size: 11px;
-    font-weight: 500;
-    text-transform: uppercase;
-    letter-spacing: 0.1em;
-    color: var(--text-3);
-  }
-  
-  .key-label {
-    color: var(--text-2);
-  }
-  
-  .key-warning-badge {
-    padding: 2px 8px;
-    background: rgba(248, 113, 113, 0.15);
-    color: var(--status-err);
-    border-radius: var(--r-xs);
-    font-size: 9px;
-    font-weight: 600;
-  }
-  
-  .key-value-box {
-    padding: var(--s-3) var(--s-4);
-    background: var(--void-deep);
-    border: 1px solid var(--border-dim);
-    border-radius: var(--r-md);
-    word-break: break-all;
-  }
-  
-  .key-value {
-    font-family: var(--font-mono);
-    font-size: 11px;
-    color: var(--text-1);
-    line-height: 1.6;
-    display: block;
-  }
-  
-  .key-value.mono {
-    font-variant-numeric: tabular-nums;
-  }
-  
-  .key-warning-text {
-    display: flex;
-    align-items: center;
-    gap: var(--s-2);
-    padding: var(--s-2) var(--s-3);
-    background: rgba(251, 191, 36, 0.1);
-    border-radius: var(--r-sm);
-    font-size: 11px;
-    color: var(--status-warn);
-  }
-  
-  .key-info-text {
-    padding: var(--s-2) var(--s-3);
-    font-size: 11px;
-    color: var(--text-4);
-    font-style: italic;
-  }
-  
-  .key-separator {
-    height: 1px;
-    background: var(--border-dim);
-    margin: var(--s-2) 0;
-  }
 
   .tx-label { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; background: rgba(82, 200, 219, 0.15); border: 1px solid rgba(82, 200, 219, 0.3); border-radius: 4px; font-size: 0.75rem; color: #52c8db; }
 

From e48e960d34cd9f1a315da70c087ea271a0b8bd70 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 01:33:25 -0400
Subject: [PATCH 06/16] chore(explorer): remove unused simulator status
 selector

Remove a stale nested selector so Svelte dev/build logs stay clean.
---
 frontend/src/routes/Explorer.svelte | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/frontend/src/routes/Explorer.svelte b/frontend/src/routes/Explorer.svelte
index ec8dd4e..0f1e5a9 100644
--- a/frontend/src/routes/Explorer.svelte
+++ b/frontend/src/routes/Explorer.svelte
@@ -6679,8 +6679,4 @@
   .landing-status-simulator {
     color: var(--status-warn, #fbbf24);
   }
-
-  .landing-status-simulator .landing-status-icon {
-    color: var(--status-warn, #fbbf24);
-  }
 </style>

From aec7cac41b901ef9027dfa3adf574a7dfe7a9ff9 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 03:39:35 -0400
Subject: [PATCH 07/16] fix(wallet): add Clear All modal and fix recent wallets
 refresh

Replace native confirm() with HOLOGRAM-styled confirmation modal for
clearing recent wallets. Add horizontal red gradient treatment matching
the notification banner language. Fix recent wallets list not refreshing
after opening/closing a wallet by centralizing refresh logic.
---
 frontend/src/routes/Wallet.svelte | 176 +++++++++++++++++++++++++-----
 1 file changed, 151 insertions(+), 25 deletions(-)

diff --git a/frontend/src/routes/Wallet.svelte b/frontend/src/routes/Wallet.svelte
index 04a6212..73399e6 100644
--- a/frontend/src/routes/Wallet.svelte
+++ b/frontend/src/routes/Wallet.svelte
@@ -8,7 +8,7 @@
     Wallet, Plus, RotateCcw, AlertTriangle, Check, FolderOpen, Pickaxe,
     LayoutDashboard, QrCode, History, Coins, Users, FileSignature, RefreshCw,
     Loader2, Download, Search, ChevronRight, ExternalLink, Edit, Trash2, Send, Shield,
-    Key, Eye, EyeOff
+    Key, Eye, EyeOff, X
   } from 'lucide-svelte';
   
   import TokenPortfolio from '../lib/components/TokenPortfolio.svelte';
@@ -54,6 +54,8 @@
   let error = null;
   let recentWallets = [];
   let recentWalletsInfo = [];
+  let showClearWalletsConfirm = false;
+  let clearingRecentWallets = false;
   
   // Test wallets (Simulator mode)
   let testWallets = [];
@@ -315,25 +317,7 @@
         dashboardLoading = false;
       }
       
-      // Load enhanced wallet info for recent wallets
-      try {
-        const infos = await GetRecentWalletsWithInfo();
-        if (infos && infos.length > 0) {
-          recentWalletsInfo = infos;
-          recentWallets = infos.map(w => w.path);
-        }
-      } catch (e) {
-        // Fallback to simple list
-        const recents = await ListRecentWallets();
-        if (recents && recents.length > 0) {
-          recentWallets = recents;
-          recentWalletsInfo = recents.map(p => ({ 
-            path: p, 
-            filename: getWalletFilename(p), 
-            addressPrefix: '' 
-          }));
-        }
-      }
+      await refreshRecentWallets();
       
       // Load test wallets if in simulator mode
       if ($settingsState.network === 'simulator') {
@@ -795,6 +779,33 @@
   // ============================================
   // WALLET MANAGEMENT
   // ============================================
+  async function refreshRecentWallets() {
+    try {
+      const infos = await GetRecentWalletsWithInfo();
+      if (infos) {
+        recentWalletsInfo = infos;
+        recentWallets = infos.map(w => w.path);
+        return;
+      }
+    } catch (e) {
+      // Fallback to simple list
+    }
+
+    try {
+      const recents = await ListRecentWallets();
+      recentWallets = recents || [];
+      recentWalletsInfo = recentWallets.map(p => ({
+        path: p,
+        filename: getWalletFilename(p),
+        addressPrefix: ''
+      }));
+    } catch (e) {
+      console.error('Failed to refresh recent wallets:', e);
+      recentWallets = [];
+      recentWalletsInfo = [];
+    }
+  }
+
   async function openWallet() {
     // Context-aware validation messages (Bug #33 fix)
     if (!walletPath && !password) {
@@ -839,8 +850,7 @@
         loadWalletPath();
         SubscribeToWalletEvents().catch(() => {});
         
-        const recents = await ListRecentWallets();
-        if (recents) recentWallets = recents;
+        await refreshRecentWallets();
       } else {
         error = handleBackendError(result, { showToast: false }) || 'Failed to open wallet';
       }
@@ -872,6 +882,7 @@
         integratedPort = '';
         integratedComment = '';
         resetSendForm();
+        await refreshRecentWallets();
       }
     } catch (err) {
       console.error('Failed to close wallet:', err);
@@ -898,17 +909,34 @@
   }
   
   // Clear all recent wallets
-  async function handleClearRecentWallets() {
-    if (!confirm('Clear all recent wallets from the list?')) return;
+  function requestClearRecentWallets() {
+    showClearWalletsConfirm = true;
+  }
+
+  function cancelClearRecentWallets() {
+    if (clearingRecentWallets) return;
+    showClearWalletsConfirm = false;
+  }
+
+  async function confirmClearRecentWallets() {
+    if (clearingRecentWallets) return;
+    clearingRecentWallets = true;
     try {
       const result = await ClearRecentWallets();
       if (result.success) {
         recentWalletsInfo = [];
         recentWallets = [];
         walletPath = '';
+        showClearWalletsConfirm = false;
+        toast.success('Recent wallet list cleared');
+      } else {
+        toast.error(result.error || 'Failed to clear recent wallets');
       }
     } catch (err) {
       console.error('Failed to clear recent wallets:', err);
+      toast.error('Failed to clear recent wallets');
+    } finally {
+      clearingRecentWallets = false;
     }
   }
   
@@ -3020,7 +3048,7 @@
                 </button>
               </button>
             {/each}
-            <button class="sidebar-clear-btn" on:click={handleClearRecentWallets}>
+            <button class="sidebar-clear-btn" on:click={requestClearRecentWallets}>
               <Trash2 size={12} />
               Clear All
             </button>
@@ -3367,6 +3395,48 @@
   kind="keys"
 />
 
+{#if showClearWalletsConfirm}
+  <div class="modal-overlay" on:click={cancelClearRecentWallets}>
+    <div class="modal-content clear-wallets-modal" on:click|stopPropagation>
+      <div class="modal-header">
+        <div class="modal-title">
+          <span class="modal-icon error"><Trash2 size={16} /></span>
+          <span>Clear Recent Wallets</span>
+        </div>
+        <button class="modal-close" on:click={cancelClearRecentWallets} disabled={clearingRecentWallets}>
+          <X size={18} />
+        </button>
+      </div>
+      <div class="modal-body">
+        <p class="clear-wallets-lead">
+          Remove saved wallet shortcuts from the sidebar.
+        </p>
+        <div class="clear-wallets-meta">
+          <span class="clear-wallets-count">{recentWalletsInfo.length}</span>
+          <span class="clear-wallets-label">recent {recentWalletsInfo.length === 1 ? 'wallet' : 'wallets'}</span>
+        </div>
+        <div class="clear-wallets-warning">
+          <AlertTriangle size={16} />
+          <span>Wallet files remain on disk. You can reopen them later with Browse.</span>
+        </div>
+      </div>
+      <div class="modal-footer modal-footer-spread">
+        <button class="btn btn-secondary" on:click={cancelClearRecentWallets} disabled={clearingRecentWallets}>
+          Cancel
+        </button>
+        <button class="btn btn-danger" on:click={confirmClearRecentWallets} disabled={clearingRecentWallets}>
+          {#if clearingRecentWallets}
+            <Loader2 size={14} class="spin" />
+            Clearing...
+          {:else}
+            Clear All
+          {/if}
+        </button>
+      </div>
+    </div>
+  </div>
+{/if}
+
 <style>
   /* ============================================
      WALLET PAGE STYLES
@@ -3621,6 +3691,62 @@
     border-color: var(--border-accent);
   }
   .sidebar-sync-btn:disabled { opacity: 0.5; cursor: not-allowed; }
+
+  :global(.clear-wallets-modal) {
+    max-width: 420px;
+  }
+
+  .clear-wallets-lead {
+    margin: 0 0 var(--s-4);
+    color: var(--text-2);
+    font-size: 13px;
+    line-height: 1.5;
+  }
+
+  .clear-wallets-meta {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    padding: var(--s-4);
+    margin-bottom: var(--s-4);
+    background: linear-gradient(90deg, rgba(248, 113, 113, 0.12) 0%, rgba(248, 113, 113, 0.04) 50%, transparent 100%);
+    border: 1px solid rgba(248, 113, 113, 0.2);
+    border-radius: var(--r-md);
+  }
+
+  .clear-wallets-count {
+    font-family: var(--font-mono);
+    font-size: 28px;
+    font-weight: 600;
+    line-height: 1;
+    color: var(--status-err);
+  }
+
+  .clear-wallets-label {
+    font-family: var(--font-mono);
+    font-size: 10px;
+    letter-spacing: 0.12em;
+    text-transform: uppercase;
+    color: var(--text-3);
+  }
+
+  .clear-wallets-warning {
+    display: flex;
+    align-items: flex-start;
+    gap: var(--s-2);
+    padding: var(--s-3) var(--s-4);
+    background: rgba(251, 191, 36, 0.08);
+    border: 1px solid rgba(251, 191, 36, 0.18);
+    border-radius: var(--r-md);
+    color: var(--status-warn);
+    font-size: 12px;
+    line-height: 1.5;
+  }
+
+  .clear-wallets-warning :global(svg) {
+    flex-shrink: 0;
+    margin-top: 1px;
+  }
   
   /* Test wallet mini balance in sidebar */
   .test-wallet-balance-mini {

From dc9e52ef12d020698c6a203795afb252f23fe02d Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 03:39:45 -0400
Subject: [PATCH 08/16] ux(studio): improve icon field hints to recommend
 on-chain DOC SCIDs

Update icon input placeholders and hints across BatchUpload, StudioInstallIndex,
and StudioUpdateIndex to recommend using on-chain icon DOC SCIDs instead of
external URLs. Suggests 100x100 SVG/PNG as optimal format.
---
 frontend/src/lib/components/BatchUpload.svelte               | 4 +++-
 frontend/src/lib/components/studio/StudioInstallIndex.svelte | 4 ++--
 frontend/src/lib/components/studio/StudioUpdateIndex.svelte  | 3 ++-
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/frontend/src/lib/components/BatchUpload.svelte b/frontend/src/lib/components/BatchUpload.svelte
index 80daa04..ca7bf73 100644
--- a/frontend/src/lib/components/BatchUpload.svelte
+++ b/frontend/src/lib/components/BatchUpload.svelte
@@ -1355,7 +1355,7 @@
           <input
             type="text"
             bind:value={indexIcon}
-            placeholder="https://example.com/icon.png or SCID"
+            placeholder="Icon DOC SCID (recommended) or URL"
             disabled={deploying}
             class="config-input"
             class:input-valid={indexIcon && iconValidation.valid && !iconValidation.warning}
@@ -1378,6 +1378,8 @@
           <p class="icon-hint" class:hint-valid={iconValidation.valid && !iconValidation.warning} class:hint-warning={iconValidation.warning} class:hint-error={!iconValidation.valid}>
             {iconValidation.message}
           </p>
+        {:else}
+          <p class="icon-hint">Recommended: use an on-chain icon DOC SCID (100x100 SVG/PNG works well).</p>
         {/if}
       </div>
       
diff --git a/frontend/src/lib/components/studio/StudioInstallIndex.svelte b/frontend/src/lib/components/studio/StudioInstallIndex.svelte
index c35e128..4707678 100644
--- a/frontend/src/lib/components/studio/StudioInstallIndex.svelte
+++ b/frontend/src/lib/components/studio/StudioInstallIndex.svelte
@@ -198,7 +198,7 @@
           <input
             type="text"
             bind:value={indexIconURL}
-            placeholder="https://example.com/icon.png or SCID"
+            placeholder="Icon DOC SCID (recommended) or URL"
             class="input"
             class:input-valid={indexIconURL && indexIconValidation.valid && !indexIconValidation.warning}
             class:input-warning={indexIconValidation.warning}
@@ -221,7 +221,7 @@
             {indexIconValidation.message}
           </p>
         {:else}
-          <p class="form-hint">URL or SCID of an image for the app icon</p>
+          <p class="form-hint">Recommended: use an on-chain icon DOC SCID (100x100 SVG/PNG works well).</p>
         {/if}
       </div>
       
diff --git a/frontend/src/lib/components/studio/StudioUpdateIndex.svelte b/frontend/src/lib/components/studio/StudioUpdateIndex.svelte
index cdec5af..f044013 100644
--- a/frontend/src/lib/components/studio/StudioUpdateIndex.svelte
+++ b/frontend/src/lib/components/studio/StudioUpdateIndex.svelte
@@ -232,10 +232,11 @@
           <input
             type="text"
             bind:value={updateIndexIcon}
-            placeholder="https://..."
+            placeholder="Icon DOC SCID (recommended) or URL"
             class="input"
             disabled={!canUpdateIndex()}
           />
+          <p class="form-hint">Recommended: use an on-chain icon DOC SCID (100x100 SVG/PNG works well). Note: older INDEX versions may require a contract upgrade before header icon changes persist.</p>
         </div>
       </div>
       

From c3fa954127241e5dbaa02f665b50afb5ff4131df Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 04:05:25 -0400
Subject: [PATCH 09/16] fix(wallet): clarify unregistered recipient
 registration guidance

Replace misleading auto-registration wording with accurate PoW-first guidance and improve -32098/account unregistered errors so senders and recipients get clear next-step instructions.
---
 error_messages.go                 | 10 +++++-----
 frontend/src/routes/Wallet.svelte |  2 +-
 wallet.go                         |  2 +-
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/error_messages.go b/error_messages.go
index e4f5063..1d4d41a 100644
--- a/error_messages.go
+++ b/error_messages.go
@@ -91,9 +91,9 @@ var TELADeploymentErrors = []TELADeploymentError{
 	// === Wallet/Account errors ===
 	{
 		Pattern:     `Account Unregistered|account unregistered|-32098.*unregistered`,
-		Title:       "Destination wallet is not registered",
-		Description: "The destination address for this transaction is not registered on the blockchain. In DERO, addresses must be registered before receiving transactions.",
-		Fix:         "Use a registered wallet address. In simulator mode, use one of the pre-seeded test wallets.",
+		Title:       "Recipient wallet is not registered",
+		Description: "The recipient's wallet address is not yet registered on the DERO blockchain. In DERO, addresses must be registered before they can receive transactions.",
+		Fix:         "The recipient needs to register their wallet first. They can do this by clicking 'Register Now' in their wallet app (Backup & Security section). Registration uses PoW and can take a few minutes. In simulator mode, use one of the pre-seeded test wallets which are already registered.",
 		Example:     "",
 	},
 	{
@@ -350,7 +350,7 @@ var UserFriendlyErrors = map[string]string{
 	"wallet file not found":        "Wallet file not found. Check the path.",
 	"insufficient balance":         "Not enough DERO for this transaction.",
 	"insufficient funds":           "Not enough DERO for this transaction.",
-	"account unregistered":         "Destination wallet is not registered on the blockchain.",
+	"account unregistered":         "Recipient's wallet is not registered on-chain. They need to open their wallet and click 'Register Now' (in Backup & Security) before they can receive DERO.",
 	"sending to self":              "Cannot send transactions to your own address.",
 	
 	// Transaction errors
@@ -384,7 +384,7 @@ var UserFriendlyErrors = map[string]string{
 	"-32601":                       "RPC method not found. Check method name.",
 	"-32700":                       "Invalid JSON in request.",
 	"-32602":                       "Invalid parameters for RPC method.",
-	"-32098":                       "DERO daemon error. Check the error details.",
+	"-32098":                       "Recipient's wallet is not registered on-chain. They need to open their wallet and click 'Register Now' (in Backup & Security) before they can receive DERO.",
 	
 	// Gnomon errors
 	"gnomon not running":           "Gnomon indexer is not running. Start it in Settings.",
diff --git a/frontend/src/routes/Wallet.svelte b/frontend/src/routes/Wallet.svelte
index 73399e6..4dbdf43 100644
--- a/frontend/src/routes/Wallet.svelte
+++ b/frontend/src/routes/Wallet.svelte
@@ -1677,7 +1677,7 @@
                     <span>TX broadcast successfully. Waiting for blockchain confirmation...</span>
                   {:else}
                     <strong>New Wallet</strong>
-                    <span>Your address isn't on-chain yet. Receive DERO to auto-register, or register manually via PoW.</span>
+                    <span>Your address isn't on-chain yet. Click Register Now to complete on-chain registration via PoW before receiving DERO.</span>
                   {/if}
                 </div>
               </div>
diff --git a/wallet.go b/wallet.go
index f9c9199..a6add7f 100644
--- a/wallet.go
+++ b/wallet.go
@@ -3266,7 +3266,7 @@ func (a *App) GetRegistrationStatus() map[string]interface{} {
 	}
 
 	if !isRegistered {
-		result["message"] = "Wallet address not yet on-chain. You can either receive DERO (auto-registers) or manually register via PoW."
+		result["message"] = "Wallet address not yet on-chain. Run PoW registration first, then receive DERO."
 	} else {
 		result["message"] = "Wallet is registered on-chain"
 	}

From 2b10990a5af58598aa008cf06119994231fc6a90 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 13:33:07 -0400
Subject: [PATCH 10/16] fix(build): support modern Linux WebKitGTK (4.1 /
 libsoup3)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

All current Linux distros (Ubuntu 24.04+, Debian 13, Fedora 40+, Arch)
have dropped webkit2gtk-4.0 / libsoup2 in favour of webkit2gtk-4.1 /
libsoup3. Wails v2 supports the new binding via the webkit2_41 build
tag, but HOLOGRAM was not setting it — leaving Linux contributors with
either a build failure (missing pkg-config target) or a runtime crash
from libsoup2/libsoup3 conflicts.

- Makefile: auto-apply -tags webkit2_41 on GOOS=linux for build, dev,
  and release targets via a WAILS_TAGS variable. Override with
  'make WAILS_TAGS=' to opt out for the legacy 4.0 binding.
- README.md / CONTRIBUTING.md: correct Ubuntu and Arch package names
  (libwebkit2gtk-4.1-dev, webkit2gtk-4.1), recommend Go from go.dev/dl
  over distro packages, link to the new Linux build guide.
- docs/LINUX-BUILD.md (new): canonical troubleshooting guide covering
  the libsoup split, OOM during 'make all' (GOFLAGS='-p=2'), vite port
  collisions, and outdated distro Go.
- .gitignore: allowlist docs/LINUX-BUILD.md alongside ARCHITECTURE.md
  and DESIGN-SYSTEM-RULEBOOK.md.

Resolves contributor friction reported on Debian (apt) and Arch
(pacman). The wailsapp/wails#3193 webkitgtk-6.0 upgrade is a Wails v3
roadmap item and is not required to support modern Linux on v2.
---
 .gitignore          |   1 +
 CONTRIBUTING.md     |  22 +++--
 Makefile            |  18 +++-
 README.md           |  30 +++++--
 docs/LINUX-BUILD.md | 203 ++++++++++++++++++++++++++++++++++++++++++++
 5 files changed, 257 insertions(+), 17 deletions(-)
 create mode 100644 docs/LINUX-BUILD.md

diff --git a/.gitignore b/.gitignore
index 77f47b6..a15ef19 100644
--- a/.gitignore
+++ b/.gitignore
@@ -53,6 +53,7 @@ datashards/
 docs/*
 !docs/ARCHITECTURE.md
 !docs/DESIGN-SYSTEM-RULEBOOK.md
+!docs/LINUX-BUILD.md
 
 # Compiled binaries (should be built, not committed)
 TELA-Browser-Wails
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index ac358b2..cc94e0a 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -33,40 +33,52 @@ Thank you for your interest in contributing to HOLOGRAM — a native desktop DER
 
 ### Prerequisites
 
-- **Go** 1.24.0+
+- **Go** 1.24.0+ — install from [go.dev/dl](https://go.dev/dl). Distro packages (`apt install golang-go`, etc.) are usually too old; HOLOGRAM will not build on Go 1.22.
 - **Wails v2 CLI:** `go install github.com/wailsapp/wails/v2/cmd/wails@latest`
 - **Node.js** 18+
 
 ### Linux users
 
+All current distros (Ubuntu 24.04+, Debian 13, Fedora 40+, Arch) ship `webkit2gtk-4.1` (libsoup3). The Makefile auto-applies `-tags webkit2_41` on Linux — install the matching system packages:
+
 ```bash
 # Ubuntu/Debian
-sudo apt install libgtk-3-dev libglib2.0-dev libwebkit2gtk-4.0-dev
+sudo apt install libgtk-3-dev libglib2.0-dev libwebkit2gtk-4.1-dev
 
 # Fedora
 sudo dnf install gtk3-devel glib2-devel webkit2gtk4.1-devel
 
 # Arch Linux
-sudo pacman -S gtk3 glib2 webkit2gtk
+sudo pacman -S gtk3 glib2 webkit2gtk-4.1
 ```
 
+> Build error, runtime crash, or vite timeout on Linux? See **[docs/LINUX-BUILD.md](docs/LINUX-BUILD.md)** — covers the libsoup conflict, OOM during `make all`, and stale dev-server cleanup.
+
 ### Run in development mode
 
 ```bash
 git clone https://github.com/DHEBP/HOLOGRAM.git
 cd HOLOGRAM
 cd frontend && npm install && cd ..
+
+# macOS / Windows
 wails dev
+
+# Linux
+wails dev -tags webkit2_41
+# or, equivalently:
+make dev
 ```
 
 ### Build
 
 ```bash
-# Full build (HOLOGRAM + derod + simulator)
+# Full build (HOLOGRAM + derod + simulator) — auto-tags on Linux
 make all
 
 # HOLOGRAM only
-wails build
+wails build              # macOS / Windows
+wails build -tags webkit2_41   # Linux
 ```
 
 ### Run Go tests
diff --git a/Makefile b/Makefile
index bb07656..de33950 100644
--- a/Makefile
+++ b/Makefile
@@ -40,6 +40,18 @@ else
     SIMULATOR_BIN = simulator-linux-$(GOARCH)
 endif
 
+# Linux: link against webkit2gtk-4.1 (libsoup3) instead of the default
+# webkit2gtk-4.0 (libsoup2). All current distros (Ubuntu 24.04+, Debian 13,
+# Fedora 40+, Arch) ship 4.1 only — building without this tag fails to link
+# or crashes at runtime due to libsoup2 ↔ libsoup3 conflicts.
+# Override on the command line if you really need the legacy 4.0 binding:
+#   make WAILS_TAGS= ...
+ifeq ($(GOOS),linux)
+    WAILS_TAGS ?= -tags webkit2_41
+else
+    WAILS_TAGS ?=
+endif
+
 # Build directories
 BUILD_DIR = build/bin
 DEROHE_PKG = github.com/deroproject/derohe
@@ -65,13 +77,13 @@ endif
 # Build HOLOGRAM using wails (dev/local build with metadata)
 hologram:
 	@echo "🔨 Building HOLOGRAM ($(VERSION), $(COMMIT))..."
-	wails build -ldflags "$(LDFLAGS)"
+	wails build $(WAILS_TAGS) -ldflags "$(LDFLAGS)"
 	@echo "✅ HOLOGRAM built"
 
 # Release build — clean, trimpath, metadata injected (use this for distribution)
 release: derod simulator
 	@echo "🚀 Building HOLOGRAM release ($(VERSION), $(COMMIT))..."
-	wails build -ldflags "$(LDFLAGS)" -clean -trimpath
+	wails build $(WAILS_TAGS) -ldflags "$(LDFLAGS)" -clean -trimpath
 	@echo "✅ Release build complete: $(BUILD_DIR)/$(HOLOGRAM_BIN)"
 
 # Build derod from derohe source
@@ -125,7 +137,7 @@ test-mtp-integration: mtp-anchor
 
 # Development mode
 dev:
-	wails dev
+	wails dev $(WAILS_TAGS)
 
 # Clean build artifacts
 clean:
diff --git a/README.md b/README.md
index da29754..9ca636e 100644
--- a/README.md
+++ b/README.md
@@ -44,24 +44,26 @@ Browse TELA applications. Manage your DERO. Build and deploy dApps with an integ
 
 ### Prerequisites
 
-- **Go** 1.24.0+
+- **Go** 1.24.0+ — install from [go.dev/dl](https://go.dev/dl) (distro packages like `apt install golang-go` are usually too old)
 - **Wails** v2 CLI: `go install github.com/wailsapp/wails/v2/cmd/wails@latest`
 - **Node.js** 18+
 
 #### Linux-specific Dependencies
 
+All current Linux distros (Ubuntu 24.04+, Debian 13, Fedora 40+, Arch) have moved to `webkit2gtk-4.1` (libsoup3). The Makefile auto-applies the matching `-tags webkit2_41` build tag on Linux — you just need the right system packages:
+
 ```bash
 # Ubuntu/Debian
-sudo apt install libgtk-3-dev libglib2.0-dev libwebkit2gtk-4.0-dev
+sudo apt install libgtk-3-dev libglib2.0-dev libwebkit2gtk-4.1-dev
 
 # Fedora
 sudo dnf install gtk3-devel glib2-devel webkit2gtk4.1-devel
 
 # Arch Linux
-sudo pacman -S gtk3 glib2 webkit2gtk
+sudo pacman -S gtk3 glib2 webkit2gtk-4.1
 ```
 
-> **Note:** Ubuntu 24.04/Debian 13 users may need additional steps for webkit2gtk-4.0. See the [DERO community Linux setup guide](https://github.com/deroproject/documentation) or open an issue if you hit a platform-specific snag.
+> Hitting a build error, runtime crash, or vite timeout on Linux? See [docs/LINUX-BUILD.md](docs/LINUX-BUILD.md) — it covers the libsoup conflict, the `webkit2_41` tag, OOM during `make all`, and stale dev-server cleanup.
 
 ### Development
 
@@ -69,7 +71,14 @@ sudo pacman -S gtk3 glib2 webkit2gtk
 git clone https://github.com/DHEBP/HOLOGRAM.git
 cd HOLOGRAM
 cd frontend && npm install && cd ..
+
+# macOS / Windows
 wails dev
+
+# Linux
+wails dev -tags webkit2_41
+# or, equivalently:
+make dev
 ```
 
 ### Production Build (Recommended)
@@ -93,9 +102,12 @@ This builds the DERO daemon and simulator directly from the derohe source code,
 If you prefer to download derod separately:
 
 ```bash
-# Build HOLOGRAM only
+# macOS / Windows
 wails build
 
+# Linux
+wails build -tags webkit2_41
+
 # Output locations:
 # macOS:   build/bin/Hologram.app
 # Linux:   build/bin/Hologram
@@ -105,10 +117,10 @@ wails build
 ### Cross-Platform Builds
 
 ```bash
-wails build -platform darwin/amd64   # macOS Intel
-wails build -platform darwin/arm64   # macOS Apple Silicon
-wails build -platform linux/amd64    # Linux x64
-wails build -platform windows/amd64  # Windows x64
+wails build -platform darwin/amd64                    # macOS Intel
+wails build -platform darwin/arm64                    # macOS Apple Silicon
+wails build -platform linux/amd64   -tags webkit2_41  # Linux x64
+wails build -platform windows/amd64                   # Windows x64
 ```
 
 ---
diff --git a/docs/LINUX-BUILD.md b/docs/LINUX-BUILD.md
new file mode 100644
index 0000000..2354f9d
--- /dev/null
+++ b/docs/LINUX-BUILD.md
@@ -0,0 +1,203 @@
+# Linux Build Guide
+
+HOLOGRAM is built with [Wails v2](https://wails.io/), which renders the UI through the system's WebKitGTK runtime. The Linux WebKit ecosystem went through a transition starting around 2024 that affects every Wails app, not just HOLOGRAM. This guide covers the gotchas you will hit on a modern distro and how to resolve each one.
+
+If you just want the working command and don't care about the why:
+
+```bash
+# Ubuntu / Debian
+sudo apt install libgtk-3-dev libglib2.0-dev libwebkit2gtk-4.1-dev
+
+# Fedora
+sudo dnf install gtk3-devel glib2-devel webkit2gtk4.1-devel
+
+# Arch
+sudo pacman -S gtk3 glib2 webkit2gtk-4.1
+
+# Build / run
+make all                       # full build (auto-applies -tags webkit2_41 on Linux)
+wails dev -tags webkit2_41     # dev mode
+wails build -tags webkit2_41   # HOLOGRAM-only build
+```
+
+Read on for the *why*, plus fixes for the four most common Linux failure modes.
+
+---
+
+## The libsoup2 → libsoup3 split (the big one)
+
+Wails v2 has two WebKit bindings:
+
+| Binding | WebKit package | HTTP backend |
+|---------|---------------|--------------|
+| Default (no tag) | `webkit2gtk-4.0` | libsoup **2** |
+| `-tags webkit2_41` | `webkit2gtk-4.1` | libsoup **3** |
+
+Every current Linux distro has dropped or is dropping the libsoup2-based `webkit2gtk-4.0`:
+
+- **Ubuntu 24.04+ / Debian 13+** — package renamed to `libwebkit2gtk-4.1-dev`, the 4.0 package is gone.
+- **Fedora 40+** — only ships `webkit2gtk4.1-devel`.
+- **Arch** — ships only `webkit2gtk-4.1`. The bare `webkit2gtk` package is no longer in repos.
+
+If you build HOLOGRAM **without** `-tags webkit2_41` on these systems you'll see one of:
+
+- Linker errors about missing `webkit2gtk-4.0` / pkg-config can't find it.
+- A successful build that **crashes at startup** because libsoup2 and libsoup3 get loaded into the same process. This is a known WebKitGTK runtime conflict, not a HOLOGRAM bug.
+
+**Fix:** install the 4.1 dev package above and pass the build tag (or use `make`, which sets it for you).
+
+> ### Wails v3 / `webkitgtk-6.0`?
+> [wails#3193](https://github.com/wailsapp/wails/issues/3193) tracks moving Wails to GTK4 / WebKitGTK 6.0 in the v3 branch. That is **not** required for HOLOGRAM to build — `webkit2_41` is the supported path on Wails v2 and works on every modern distro.
+
+---
+
+## Failure 1 — `pkg-config: command not found` or "Package webkit2gtk-4.0 was not found"
+
+You're missing the dev headers, or you have the 4.0 package name in muscle memory.
+
+```bash
+# Ubuntu/Debian
+sudo apt install pkg-config libgtk-3-dev libglib2.0-dev libwebkit2gtk-4.1-dev
+
+# Fedora
+sudo dnf install pkgconf gtk3-devel glib2-devel webkit2gtk4.1-devel
+
+# Arch
+sudo pacman -S pkgconf gtk3 glib2 webkit2gtk-4.1
+```
+
+Then rebuild with `-tags webkit2_41` (or just `make`).
+
+---
+
+## Failure 2 — Build succeeds but the app crashes / hangs at launch
+
+Symptom: `wails build` finishes, but `./build/bin/Hologram` immediately segfaults, freezes the desktop, or prints something about libsoup before dying.
+
+This is the **libsoup2 + libsoup3 in the same process** conflict. It happens when:
+
+- You built without `-tags webkit2_41` but the runtime found a libsoup3-only WebKitGTK,
+- Or the system has both libsoup major versions installed and a transitive dep pulled in the wrong one.
+
+**Fix:**
+
+```bash
+make clean
+make all      # auto-tags on Linux
+# Or explicitly:
+wails build -tags webkit2_41
+```
+
+---
+
+## Failure 3 — `make all` hangs the machine / triggers OOM killer
+
+`make all` builds three things end-to-end:
+
+1. `derod` (DERO daemon, from `derohe` source)
+2. `simulator` (DERO simulator)
+3. HOLOGRAM (Wails Go + bundled Svelte frontend, CGO-linked against WebKit)
+
+The Go linker for the third step is memory-heavy, and parallel compilation can spike well past 8 GB on a fresh checkout. On a small VM or laptop this can OOM-kill X/Wayland and lock the desktop.
+
+**Mitigations, easiest first:**
+
+```bash
+# 1. Limit Go's parallelism (4 → 2 workers)
+GOFLAGS='-p=2' make all
+
+# 2. Skip derod/simulator entirely — build HOLOGRAM only
+wails build -tags webkit2_41
+
+# 3. If derod is the heavy step, build sequentially with reduced concurrency
+make derod GOFLAGS='-p=1'
+make simulator GOFLAGS='-p=1'
+make hologram
+
+# 4. Add swap if you don't have any
+sudo fallocate -l 4G /swapfile && sudo chmod 600 /swapfile
+sudo mkswap /swapfile && sudo swapon /swapfile
+```
+
+If the machine is locking up *before* the link stage, it's almost certainly the frontend `vite` build chewing memory while Go's compiler runs in parallel. `GOFLAGS='-p=2'` is the cleanest fix.
+
+---
+
+## Failure 4 — `wails dev` errors with "Timed out waiting for Vite to output a URL"
+
+```
+failed to find Vite server URL: Timed out waiting for Vite to output a URL after 10 seconds
+```
+
+A previous `wails dev` session left a vite/wails process holding port `5173` (or another dev port). The new session can't bind it and gives up.
+
+**Fix:**
+
+```bash
+lsof -ti:5173 | xargs -r kill -9
+pkill -f vite
+pkill -f wails
+wails dev -tags webkit2_41
+```
+
+If it keeps recurring, `npm run dev` may be running standalone in another terminal — close it.
+
+---
+
+## Failure 5 — Go is too old (`go version go1.22.x linux/amd64`)
+
+HOLOGRAM requires Go **1.24.0+**. Most distro packages (`apt install golang-go`, etc.) are pinned to whatever shipped with the distro release and are usually one or two majors behind.
+
+**Install a current Go from upstream:**
+
+```bash
+# Remove any distro Go first
+sudo apt remove golang-go golang 2>/dev/null || true
+sudo rm -rf /usr/local/go
+
+# Pick the latest from https://go.dev/dl/
+GO_VERSION=1.24.2
+wget https://go.dev/dl/go${GO_VERSION}.linux-amd64.tar.gz
+sudo tar -C /usr/local -xzf go${GO_VERSION}.linux-amd64.tar.gz
+
+# Add Go to PATH (persist across sessions)
+echo 'export PATH=$PATH:/usr/local/go/bin:$HOME/go/bin' >> ~/.profile
+source ~/.profile
+
+go version   # should print 1.24.x or newer
+```
+
+Then reinstall the Wails CLI under the new Go:
+
+```bash
+go install github.com/wailsapp/wails/v2/cmd/wails@latest
+export PATH=$PATH:$HOME/go/bin
+wails doctor
+```
+
+`wails doctor` is worth running once on a fresh machine — it sanity-checks Go, Node, npm, pkg-config, and WebKit headers in one shot.
+
+---
+
+## TL;DR cheat sheet
+
+```bash
+# 1. Up-to-date Go (>= 1.24) from go.dev, not from your distro
+go version
+
+# 2. Wails CLI
+go install github.com/wailsapp/wails/v2/cmd/wails@latest
+export PATH=$PATH:$HOME/go/bin
+
+# 3. WebKit 4.1 dev headers (your distro's package name)
+sudo apt install libwebkit2gtk-4.1-dev libgtk-3-dev libglib2.0-dev   # Debian/Ubuntu
+sudo dnf install webkit2gtk4.1-devel gtk3-devel glib2-devel         # Fedora
+sudo pacman -S webkit2gtk-4.1 gtk3 glib2                            # Arch
+
+# 4. Build with the right tag (or use make, which does this automatically)
+make dev                                # interactive
+make all                                # full build
+wails build -tags webkit2_41            # HOLOGRAM only
+```
+
+Anything else broken? Open a [GitHub Discussion](https://github.com/DHEBP/HOLOGRAM/discussions) with your distro, `go version`, `wails doctor` output, and the exact error.

From a8b56e1f874646aedc26869794214de11913dc79 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sat, 2 May 2026 23:03:41 -0400
Subject: [PATCH 11/16] fix(wallet): preserve pending registration state

Keep broadcast registration transactions marked pending until on-chain confirmation so the wallet does not fall back to the new-wallet banner after the confirmation poll times out.
---
 frontend/src/routes/Wallet.svelte |  8 +++++
 wallet.go                         | 51 ++++++++++++++++++++++++++++---
 2 files changed, 54 insertions(+), 5 deletions(-)

diff --git a/frontend/src/routes/Wallet.svelte b/frontend/src/routes/Wallet.svelte
index 4dbdf43..d36d7c7 100644
--- a/frontend/src/routes/Wallet.svelte
+++ b/frontend/src/routes/Wallet.svelte
@@ -732,11 +732,19 @@
           isRegistered: result.isRegistered,
           registrationHeight: result.registrationHeight,
           registrationProgress: result.registrationProgress,
+          registrationPending: result.registrationPending,
+          registrationTxid: result.registrationTxid,
           hashCount: result.hashCount,
           elapsedSeconds: result.elapsedSeconds,
           message: result.message
         };
         isRegistering = result.registrationProgress || false;
+        registrationPending = result.registrationPending || false;
+        registrationTxid = result.registrationTxid || '';
+        if (result.isRegistered) {
+          registrationPending = false;
+          registrationTxid = '';
+        }
         if (result.hashCount) registrationHashCount = result.hashCount;
         if (result.elapsedSeconds) registrationElapsed = result.elapsedSeconds;
       }
diff --git a/wallet.go b/wallet.go
index a6add7f..088e69f 100644
--- a/wallet.go
+++ b/wallet.go
@@ -3212,6 +3212,9 @@ func (a *App) VerifySignature(signedData string) map[string]interface{} {
 type registrationState struct {
 	sync.RWMutex
 	inProgress bool
+	pending    bool
+	pendingTx  string
+	pendingAt  time.Time
 	hashCount  uint64
 	startTime  time.Time
 	cancelCh   chan struct{}
@@ -3240,21 +3243,33 @@ func (a *App) GetRegistrationStatus() map[string]interface{} {
 	regHeight := wallet.Get_Registration_TopoHeight()
 	isRegistered := regHeight >= 0
 
-	// Check if registration is in progress
-	regState.RLock()
+	// Check if registration is in progress or awaiting confirmation.
+	regState.Lock()
+	if isRegistered && regState.pending {
+		regState.pending = false
+		regState.pendingTx = ""
+		regState.pendingAt = time.Time{}
+	}
 	inProgress := regState.inProgress
+	pending := regState.pending && !isRegistered
+	pendingTx := regState.pendingTx
 	hashCount := regState.hashCount
 	var elapsedSeconds float64
 	if inProgress {
 		elapsedSeconds = time.Since(regState.startTime).Seconds()
 	}
-	regState.RUnlock()
+	var pendingSeconds float64
+	if pending && !regState.pendingAt.IsZero() {
+		pendingSeconds = time.Since(regState.pendingAt).Seconds()
+	}
+	regState.Unlock()
 
 	result := map[string]interface{}{
 		"success":              true,
 		"isRegistered":         isRegistered,
 		"registrationHeight":   regHeight,
 		"registrationProgress": inProgress,
+		"registrationPending":  pending,
 	}
 
 	if inProgress {
@@ -3265,7 +3280,11 @@ func (a *App) GetRegistrationStatus() map[string]interface{} {
 		}
 	}
 
-	if !isRegistered {
+	if pending {
+		result["registrationTxid"] = pendingTx
+		result["pendingSeconds"] = pendingSeconds
+		result["message"] = "Registration TX broadcast. Waiting for blockchain confirmation."
+	} else if !isRegistered {
 		result["message"] = "Wallet address not yet on-chain. Run PoW registration first, then receive DERO."
 	} else {
 		result["message"] = "Wallet is registered on-chain"
@@ -3309,6 +3328,9 @@ func (a *App) RegisterWallet() map[string]interface{} {
 
 	// Start registration
 	regState.inProgress = true
+	regState.pending = false
+	regState.pendingTx = ""
+	regState.pendingAt = time.Time{}
 	regState.hashCount = 0
 	regState.startTime = time.Now()
 	regState.cancelCh = make(chan struct{})
@@ -3392,6 +3414,11 @@ func (a *App) RegisterWallet() map[string]interface{} {
 								// Send the transaction RIGHT NOW while we have the valid TX
 								err := w.SendTransaction(regTx)
 								if err != nil {
+									regState.Lock()
+									regState.pending = false
+									regState.pendingTx = ""
+									regState.pendingAt = time.Time{}
+									regState.Unlock()
 									a.logToConsole(fmt.Sprintf("[REGISTER] Failed to broadcast registration TX: %v", err))
 									if a.ctx != nil {
 										runtime.EventsEmit(a.ctx, "wallet:registration_failed", map[string]interface{}{
@@ -3402,6 +3429,12 @@ func (a *App) RegisterWallet() map[string]interface{} {
 								}
 
 								txid := regTx.GetHash().String()
+								regState.Lock()
+								regState.pending = true
+								regState.pendingTx = txid
+								regState.pendingAt = time.Now()
+								regState.Unlock()
+
 								a.logToConsole(fmt.Sprintf("[REGISTER] Registration TX sent! TXID: %s", txid))
 								a.logToConsole("[REGISTER] Waiting for blockchain confirmation...")
 
@@ -3433,6 +3466,11 @@ func (a *App) RegisterWallet() map[string]interface{} {
 										regHeight := wallet.Get_Registration_TopoHeight()
 
 										if regHeight >= 0 {
+											regState.Lock()
+											regState.pending = false
+											regState.pendingTx = ""
+											regState.pendingAt = time.Time{}
+											regState.Unlock()
 											a.logToConsole(fmt.Sprintf("[REGISTER] Registration confirmed at height %d!", regHeight))
 											if a.ctx != nil {
 												runtime.EventsEmit(a.ctx, "wallet:registration_complete", map[string]interface{}{
@@ -3452,7 +3490,7 @@ func (a *App) RegisterWallet() map[string]interface{} {
 									// The TX might still be pending in the mempool
 									a.logToConsole("[REGISTER] Confirmation taking longer than expected. TX is in mempool, will be confirmed soon.")
 									if a.ctx != nil {
-										runtime.EventsEmit(a.ctx, "wallet:registration_complete", map[string]interface{}{
+										runtime.EventsEmit(a.ctx, "wallet:registration_pending", map[string]interface{}{
 											"txid":    txid,
 											"message": "Registration TX sent! It may take a few more blocks to confirm.",
 										})
@@ -3502,6 +3540,9 @@ func (a *App) CancelRegistration() map[string]interface{} {
 
 	close(regState.cancelCh)
 	regState.inProgress = false
+	regState.pending = false
+	regState.pendingTx = ""
+	regState.pendingAt = time.Time{}
 
 	a.logToConsole("[REGISTER] Registration cancelled by user")
 

From 300b465ef3c28b188051e2774c4993ced14c4883 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sun, 3 May 2026 22:00:17 -0400
Subject: [PATCH 12/16] feat(tela): support embedded INDEX contracts with
 DocShards

Implements internal handling for TELA applications that use embedded
INDEX contracts (DocShards) for large files like WASM binaries and
animation assets.

- Add detection of embedded .shards INDEX contracts in DOC references
- Implement recursive shard fetching and reassembly for embedded INDEXes
- Create in-memory HTTP server to serve assembled DocShards content
- Store content under both simple filename and full HTTP path for
  compatibility with different request patterns
- Add file input interceptor to bridge script for native file dialogs

Enables loading of complex TELA apps like villager.tela that use
sharded WASM (rive.wasm) and binary assets (rive files).
---
 blockchain.go     | 223 ++++++++++++++++++++++++++-
 server_manager.go | 385 +++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 597 insertions(+), 11 deletions(-)

diff --git a/blockchain.go b/blockchain.go
index e1fc5fd..34ed8fe 100644
--- a/blockchain.go
+++ b/blockchain.go
@@ -156,6 +156,8 @@ func (a *App) FetchTELAContent(scid string) (*TELAContent, error) {
 		if docData == nil {
 			continue // Skip failed fetches
 		}
+		// Add SCID to docData so processDOC can access it
+		docData["scid"] = docSCIDs[i]
 		if err := a.processDOC(docData, content); err != nil {
 			a.logToConsole(fmt.Sprintf("  [WARN]  Failed to process DOC %d: %v", i+1, err))
 			failedDOCs = append(failedDOCs, i)
@@ -170,7 +172,7 @@ func (a *App) FetchTELAContent(scid string) (*TELAContent, error) {
 
 		for _, i := range failedDOCs {
 			scid := docSCIDs[i]
-			a.logToConsole(fmt.Sprintf("  [RETRY] Re-fetching DOC %d: %s...", i+1, scid[:16]))
+			a.logToConsole(fmt.Sprintf("  [RETRY] Re-fetching DOC %d: %s...", i+1, truncateSCID(scid, 16)))
 
 			// Re-fetch the DOC
 			data, err := a.fetchSmartContract(scid, true, true)
@@ -179,6 +181,9 @@ func (a *App) FetchTELAContent(scid string) (*TELAContent, error) {
 				continue
 			}
 
+			// Add SCID to data so processDOC can access it
+			data["scid"] = scid
+
 			// Try to process again
 			if err := a.processDOC(data, content); err != nil {
 				a.logToConsole(fmt.Sprintf("  [ERR] Retry process failed for DOC %d: %v", i+1, err))
@@ -243,10 +248,29 @@ func (a *App) FetchTELAContent(scid string) (*TELAContent, error) {
 	return content, nil
 }
 
-// isShardIndexDURL returns true if the dURL ends with .tela.shards
+// isShardIndexDURL returns true if the dURL ends with .shards (embedded shard INDEX)
 func isShardIndexDURL(durl string) bool {
 	s := strings.ToLower(strings.TrimSpace(durl))
-	return strings.HasSuffix(s, ".tela.shards")
+	return strings.HasSuffix(s, ".shards")
+}
+
+// isEmbeddedINDEX returns true if the contract is an INDEX (not a DOC)
+// by checking for telaVersion or DOC1 keys in stringkeys
+func isEmbeddedINDEX(stringKeys map[string]interface{}) bool {
+	if stringKeys == nil {
+		return false
+	}
+	_, hasTelaVersion := stringKeys["telaVersion"]
+	_, hasDOC1 := stringKeys["DOC1"]
+	return hasTelaVersion || hasDOC1
+}
+
+// truncateSCID safely truncates a SCID for logging (prevents slice bounds panic)
+func truncateSCID(scid string, maxLen int) string {
+	if len(scid) <= maxLen {
+		return scid
+	}
+	return scid[:maxLen]
 }
 
 // isShardChunkName returns true if the filename matches the shard naming pattern
@@ -345,10 +369,10 @@ func (a *App) reassembleShardChunks(content *TELAContent) {
 	}
 }
 
-// isLibraryDURL returns true if the dURL ends with .tela.lib
+// isLibraryDURL returns true if the dURL ends with .lib (embedded library INDEX)
 func isLibraryDURL(durl string) bool {
 	s := strings.ToLower(strings.TrimSpace(durl))
-	return strings.HasSuffix(s, ".tela.lib")
+	return strings.HasSuffix(s, ".lib")
 }
 
 // fetchSingleDOC renders a standalone DOC contract directly (not part of an INDEX)
@@ -915,6 +939,29 @@ func (a *App) processDOC(docData map[string]interface{}, content *TELAContent) e
 		}
 	}
 
+	// Check if this is actually an embedded INDEX (not a DOC)
+	// Embedded INDEXes have telaVersion or DOC1 keys but no docType
+	if isEmbeddedINDEX(stringKeys) {
+		dURL := fallbackMeta.DURL
+		if durlHex, ok := stringKeys["dURL"].(string); ok {
+			dURL = decodeHexString(durlHex)
+		}
+
+		// Handle embedded .shards INDEX (e.g., rive.js-2.35.3.shards)
+		if isShardIndexDURL(dURL) {
+			scid := ""
+			if scidStr, ok := docData["scid"].(string); ok {
+				scid = scidStr
+			}
+			a.logToConsole(fmt.Sprintf("  [EMBED] Detected embedded .shards INDEX: %s (%s...)", dURL, truncateSCID(scid, 16)))
+			return a.processEmbeddedShardsINDEX(docData, content)
+		}
+
+		// For other embedded INDEXes (.lib), we can add support later
+		a.logToConsole(fmt.Sprintf("  [WARN] Embedded INDEX detected but not .shards: %s (skipping)", dURL))
+		return nil
+	}
+
 	// Get docType (hex-encoded) - with nil check
 	docType := fallbackMeta.DocType
 	if docTypeHex, ok := stringKeys["docType"].(string); ok {
@@ -1041,6 +1088,172 @@ func (a *App) processDOC(docData map[string]interface{}, content *TELAContent) e
 	return nil
 }
 
+// processEmbeddedShardsINDEX handles an embedded INDEX with .shards dURL
+// This is used for sharded libraries like rive.js that are split across multiple DOC contracts
+// The function fetches all DOCs from the embedded INDEX, concatenates them, and decompresses
+func (a *App) processEmbeddedShardsINDEX(indexData map[string]interface{}, content *TELAContent) error {
+	// Get the embedded INDEX's dURL to derive the output filename
+	stringKeys, _ := indexData["stringkeys"].(map[string]interface{})
+	code, _ := indexData["code"].(string)
+	fallbackMeta := extractDOCMetadataFromCode(code)
+
+	dURL := fallbackMeta.DURL
+	if durlHex, ok := stringKeys["dURL"].(string); ok {
+		dURL = decodeHexString(durlHex)
+	}
+
+	// For HTTP serving, the browser requests the full path: /rive.wasm-2.35.3.shards/rive.wasm
+	// - Directory name: dURL (e.g., "rive.wasm-2.35.3.shards")
+	// - Filename: base name without version (e.g., "rive.wasm")
+	// We need BOTH:
+	// - Full path for HTTP serving: "rive.wasm-2.35.3.shards/rive.wasm"
+	// - Simple name for HTML inlining: "rive.wasm"
+
+	// Get base name by stripping .shards and version
+	baseName := strings.TrimSuffix(dURL, ".shards")
+	versionRe := regexp.MustCompile(`^(.+)-\d+\.\d+\.\d+$`)
+	if m := versionRe.FindStringSubmatch(baseName); len(m) > 1 {
+		baseName = m[1]
+	}
+
+	// Full path for HTTP serving: "dURL/baseName"
+	fullPath := dURL + "/" + baseName
+
+	// We'll store under both names
+	outputName := baseName
+
+	a.logToConsole(fmt.Sprintf("  [EMBED] Processing embedded shards: %s -> %s (HTTP: %s)", dURL, outputName, fullPath))
+
+	// Extract DOC SCIDs from the embedded INDEX
+	docSCIDs := extractDOCsSCIDs(indexData)
+	if len(docSCIDs) == 0 {
+		return fmt.Errorf("no DOC SCIDs found in embedded INDEX %s", dURL)
+	}
+
+	a.logToConsole(fmt.Sprintf("  [EMBED] Found %d shard DOCs in %s", len(docSCIDs), dURL))
+
+	// Fetch all DOC contracts and extract their content in order
+	var shardContents []string
+	var compression string
+
+	for i, docSCID := range docSCIDs {
+		docData, err := a.fetchSmartContract(docSCID, true, false)
+		if err != nil {
+			a.logToConsole(fmt.Sprintf("  [EMBED] Failed to fetch shard DOC %d (%s...): %v", i+1, truncateSCID(docSCID, 16), err))
+			continue
+		}
+
+		docCode, ok := docData["code"].(string)
+		if !ok || docCode == "" {
+			a.logToConsole(fmt.Sprintf("  [EMBED] Shard DOC %d has no code", i+1))
+			continue
+		}
+
+		// Extract shard content from the DOC's comment block
+		shardContent := extractFileContentFromCode(docCode)
+		if shardContent == "" {
+			a.logToConsole(fmt.Sprintf("  [EMBED] Failed to extract content from shard DOC %d", i+1))
+			continue
+		}
+
+		// Detect compression from first shard's filename
+		if i == 0 {
+			docStringKeys, _ := docData["stringkeys"].(map[string]interface{})
+			docMeta := extractDOCMetadataFromCode(docCode)
+			docFileName := docMeta.FileName
+			if fnHex, ok := docStringKeys["var_header_name"].(string); ok {
+				docFileName = decodeHexString(fnHex)
+			} else if fnHex, ok := docStringKeys["nameHdr"].(string); ok {
+				docFileName = decodeHexString(fnHex)
+			}
+				if strings.HasSuffix(docFileName, ".gz") {
+				compression = ".gz"
+			}
+		}
+
+		shardContents = append(shardContents, shardContent)
+	}
+
+	if len(shardContents) == 0 {
+		return fmt.Errorf("no shard content extracted from embedded INDEX %s", dURL)
+	}
+
+	a.logToConsole(fmt.Sprintf("  [EMBED] Extracted %d shard chunks for %s", len(shardContents), outputName))
+
+	// Concatenate all shard contents
+	concatenated := strings.Join(shardContents, "")
+
+	// Decompress if shards were compressed
+	var finalContent string
+	if compression == ".gz" {
+		decompressed, err := decompressGzip(concatenated)
+		if err != nil {
+			a.logToConsole(fmt.Sprintf("  [EMBED] Decompression failed for %s: %v", outputName, err))
+			return fmt.Errorf("failed to decompress shards for %s: %w", outputName, err)
+		}
+		finalContent = decompressed
+		a.logToConsole(fmt.Sprintf("  [EMBED] Decompressed %s: %d bytes -> %d bytes", outputName, len(concatenated), len(finalContent)))
+	} else {
+		finalContent = concatenated
+		a.logToConsole(fmt.Sprintf("  [EMBED] Assembled %s: %d bytes (uncompressed)", outputName, len(finalContent)))
+	}
+
+	// Determine docType based on file extension
+	docType := "TELA-STATIC-1"
+	ext := strings.ToLower(filepath.Ext(outputName))
+	switch ext {
+	case ".js":
+		docType = "TELA-JS-1"
+	case ".css":
+		docType = "TELA-CSS-1"
+	case ".html", ".htm":
+		docType = "TELA-HTML-1"
+	case ".wasm":
+		docType = "TELA-STATIC-1"
+	}
+
+	// Store by type (similar to regular DOC processing)
+	// Store under BOTH:
+	// - Simple name (for HTML inlining): "rive.wasm"
+	// - Full path (for HTTP serving): "rive.wasm-2.35.3.shards/rive.wasm"
+	switch {
+	case strings.HasPrefix(docType, "TELA-JS"):
+		content.JS = append(content.JS, finalContent)
+		if content.JSByName == nil {
+			content.JSByName = make(map[string]string)
+		}
+		content.JSByName[outputName] = finalContent
+		content.JSByName[fullPath] = finalContent
+		a.logToConsole(fmt.Sprintf("  [EMBED] Stored %s as JS (%d bytes)", outputName, len(finalContent)))
+
+	case strings.HasPrefix(docType, "TELA-CSS"):
+		content.CSS = append(content.CSS, finalContent)
+		if content.CSSByName == nil {
+			content.CSSByName = make(map[string]string)
+		}
+		content.CSSByName[outputName] = finalContent
+		content.CSSByName[fullPath] = finalContent
+		a.logToConsole(fmt.Sprintf("  [EMBED] Stored %s as CSS (%d bytes)", outputName, len(finalContent)))
+
+	default:
+		if content.StaticByName == nil {
+			content.StaticByName = make(map[string]string)
+		}
+		content.StaticByName[outputName] = finalContent
+		content.StaticByName[fullPath] = finalContent
+		a.logToConsole(fmt.Sprintf("  [EMBED] Stored %s as static (%d bytes)", outputName, len(finalContent)))
+	}
+
+	// Record raw file
+	content.Files = append(content.Files, DocFile{
+		Name:    outputName,
+		Content: finalContent,
+		DocType: docType,
+	})
+
+	return nil
+}
+
 // extractFileContentFromCode extracts file content from smart contract code
 // The actual file content is in a comment block (/* ... */)
 func extractFileContentFromCode(code string) string {
diff --git a/server_manager.go b/server_manager.go
index 35a77d2..331a6c3 100644
--- a/server_manager.go
+++ b/server_manager.go
@@ -45,6 +45,18 @@ var proxyRegistry = struct {
 	ports:   make(map[string]int),
 }
 
+// In-memory server registry - for serving DocShards content assembled by HOLOGRAM
+var memoryServerRegistry = struct {
+	sync.RWMutex
+	servers map[string]*http.Server // SCID -> in-memory server
+	ports   map[string]int          // SCID -> port
+	content map[string]*TELAContent // SCID -> assembled content
+}{
+	servers: make(map[string]*http.Server),
+	ports:   make(map[string]int),
+	content: make(map[string]*TELAContent),
+}
+
 // findAvailableProxyPort finds an available port for the proxy server
 func findAvailableProxyPort() (int, error) {
 	// Use port range 50000-60000 for proxy servers (separate from tela servers)
@@ -183,6 +195,155 @@ func createProxyServer(targetURL, scid string) (string, error) {
 	return proxyURL, nil
 }
 
+// serveDocShardsContent creates an in-memory HTTP server for assembled DocShards content.
+// This bypasses the tela library (which doesn't support DocShards) and serves content
+// directly from memory, including binary files like WASM that can't be inlined into HTML.
+func (a *App) serveDocShardsContent(scid string, content *TELAContent) (string, error) {
+	a.logToConsole("[MEM] Creating in-memory server for DocShards content")
+
+	// Check if server already exists for this SCID
+	memoryServerRegistry.RLock()
+	if existingServer := memoryServerRegistry.servers[scid]; existingServer != nil {
+		port := memoryServerRegistry.ports[scid]
+		memoryServerRegistry.RUnlock()
+		serverURL := fmt.Sprintf("http://127.0.0.1:%d", port)
+		a.logToConsole(fmt.Sprintf("[MEM] Reusing existing in-memory server: %s", serverURL))
+		return serverURL, nil
+	}
+	memoryServerRegistry.RUnlock()
+
+	// Find available port
+	port, err := findAvailableProxyPort()
+	if err != nil {
+		return "", fmt.Errorf("failed to find available port: %w", err)
+	}
+
+	// Create HTTP handler that serves content from memory
+	mux := http.NewServeMux()
+
+	// Serve HTML at root
+	mux.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
+		path := r.URL.Path
+		if path == "/" || path == "/index.html" {
+			w.Header().Set("Content-Type", "text/html; charset=utf-8")
+			w.Header().Set("Access-Control-Allow-Origin", "*")
+			// Inject XSWD bridge script for wallet connectivity
+			html := content.HTML
+			bridgeScript := getXSWDBridgeScript()
+			html = injectScriptIntoHTML(html, bridgeScript)
+			w.Write([]byte(html))
+			return
+		}
+
+		// Strip leading slash for filename lookup
+		filename := strings.TrimPrefix(path, "/")
+
+		// Try to serve from JSByName
+		if js, ok := content.JSByName[filename]; ok {
+			w.Header().Set("Content-Type", "application/javascript; charset=utf-8")
+			w.Header().Set("Access-Control-Allow-Origin", "*")
+			w.Write([]byte(js))
+			return
+		}
+
+		// Try to serve from CSSByName
+		if css, ok := content.CSSByName[filename]; ok {
+			w.Header().Set("Content-Type", "text/css; charset=utf-8")
+			w.Header().Set("Access-Control-Allow-Origin", "*")
+			w.Write([]byte(css))
+			return
+		}
+
+		// Try to serve from StaticByName (WASM, RIV, images, etc.)
+		if static, ok := content.StaticByName[filename]; ok {
+			ext := strings.ToLower(filepath.Ext(filename))
+			var contentType string
+			switch ext {
+			case ".wasm":
+				contentType = "application/wasm"
+			case ".riv":
+				contentType = "application/octet-stream"
+			case ".json":
+				contentType = "application/json"
+			case ".svg":
+				contentType = "image/svg+xml"
+			case ".png":
+				contentType = "image/png"
+			case ".jpg", ".jpeg":
+				contentType = "image/jpeg"
+			case ".gif":
+				contentType = "image/gif"
+			case ".webp":
+				contentType = "image/webp"
+			case ".ico":
+				contentType = "image/x-icon"
+			default:
+				contentType = "application/octet-stream"
+			}
+			w.Header().Set("Content-Type", contentType)
+			w.Header().Set("Access-Control-Allow-Origin", "*")
+			w.Write([]byte(static))
+			return
+		}
+
+		// File not found
+		http.NotFound(w, r)
+	})
+
+	// Create and start server
+	server := &http.Server{
+		Addr:    fmt.Sprintf("127.0.0.1:%d", port),
+		Handler: mux,
+	}
+
+	// Start server in goroutine
+	go func() {
+		if err := server.ListenAndServe(); err != nil && err != http.ErrServerClosed {
+			a.logToConsole(fmt.Sprintf("[MEM] Server error for %s: %v", scid, err))
+		}
+	}()
+
+	// Register server
+	memoryServerRegistry.Lock()
+	memoryServerRegistry.servers[scid] = server
+	memoryServerRegistry.ports[scid] = port
+	memoryServerRegistry.content[scid] = content
+	memoryServerRegistry.Unlock()
+
+	serverURL := fmt.Sprintf("http://127.0.0.1:%d", port)
+	a.logToConsole(fmt.Sprintf("[MEM] In-memory server started: %s", serverURL))
+
+	// Log what files are available
+	if len(content.JSByName) > 0 {
+		for name := range content.JSByName {
+			a.logToConsole(fmt.Sprintf("  [MEM] Serving JS: /%s", name))
+		}
+	}
+	if len(content.StaticByName) > 0 {
+		for name := range content.StaticByName {
+			a.logToConsole(fmt.Sprintf("  [MEM] Serving static: /%s", name))
+		}
+	}
+
+	return serverURL, nil
+}
+
+// injectScriptIntoHTML injects a script into HTML, preferably into <head>
+func injectScriptIntoHTML(html, script string) string {
+	// Try to inject after <head>
+	if idx := strings.Index(strings.ToLower(html), "<head>"); idx != -1 {
+		insertPos := idx + 6
+		return html[:insertPos] + "\n" + script + "\n" + html[insertPos:]
+	}
+	// Try to inject after <!DOCTYPE html>
+	if idx := strings.Index(strings.ToLower(html), "<!doctype html>"); idx != -1 {
+		insertPos := idx + 15
+		return html[:insertPos] + "\n" + script + "\n" + html[insertPos:]
+	}
+	// Prepend to HTML
+	return script + "\n" + html
+}
+
 // getXSWDBridgeScript returns the XSWD bridge script to inject into TELA apps
 // This script intercepts WebSocket connections to localhost:44326 and routes them
 // through Hologram's XSWD server via postMessage
@@ -633,6 +794,146 @@ func getXSWDBridgeScript() string {
 
     log('[Bridge] Download interceptor installed');
   })();
+
+  // ── File input interceptor ────────────────────────────────────────────────
+  // Intercepts file input elements so dApps can select files through HOLOGRAM's
+  // native file dialog. This works around iframe sandbox restrictions that
+  // prevent file inputs from working in Wails WebView.
+  (function() {
+    // Override click on file inputs to route through parent
+    function interceptFileInputClick(input) {
+      var accept = input.getAttribute('accept') || '';
+      var title = input.getAttribute('title') || input.getAttribute('data-title') || 'Select File';
+      
+      log('[File] Intercepting file input click: accept=' + accept);
+      
+      request('selectFile', { title: title, accept: accept }).then(function(result) {
+        if (result && result.success && result.base64) {
+          log('[OK] File selected: ' + result.filename + ' (' + result.size + ' bytes)');
+          
+          // Convert base64 to Blob and create a File object
+          var byteString = atob(result.base64);
+          var ab = new ArrayBuffer(byteString.length);
+          var ia = new Uint8Array(ab);
+          for (var i = 0; i < byteString.length; i++) {
+            ia[i] = byteString.charCodeAt(i);
+          }
+          var blob = new Blob([ab], { type: result.mimeType || 'application/octet-stream' });
+          
+          // Create a File object (for browser compatibility)
+          var file;
+          try {
+            file = new File([blob], result.filename, { type: result.mimeType || 'application/octet-stream' });
+          } catch(e) {
+            // Safari workaround - File constructor may not work in some contexts
+            file = blob;
+            file.name = result.filename;
+            file.lastModified = Date.now();
+          }
+          
+          // Create a synthetic FileList-like object
+          var dt = new DataTransfer();
+          dt.items.add(file);
+          
+          // Set the files on the input (this triggers any onchange handlers)
+          try {
+            input.files = dt.files;
+          } catch(e) {
+            log('[Warn] Could not set input.files: ' + e.message);
+          }
+          
+          // Dispatch change event so dApp knows a file was selected
+          var changeEvent = new Event('change', { bubbles: true, cancelable: false });
+          input.dispatchEvent(changeEvent);
+          
+          // Also dispatch input event for completeness
+          var inputEvent = new Event('input', { bubbles: true, cancelable: false });
+          input.dispatchEvent(inputEvent);
+          
+          log('[File] File data injected and events dispatched');
+        } else if (result && result.cancelled) {
+          log('[File] User cancelled file selection');
+        } else {
+          log('[File] Selection failed: ' + (result && result.error || 'unknown'));
+        }
+      }).catch(function(e) {
+        log('[Error] File selection error: ' + e.message);
+      });
+    }
+    
+    // Method 1: Intercept programmatic .click() calls on file inputs
+    var _origInputClick = HTMLInputElement.prototype.click;
+    HTMLInputElement.prototype.click = function() {
+      if (this.type === 'file') {
+        interceptFileInputClick(this);
+        return;
+      }
+      return _origInputClick.call(this);
+    };
+    
+    // Method 2: Intercept direct click events on file inputs
+    document.addEventListener('click', function(e) {
+      var el = e.target;
+      if (el && el.tagName === 'INPUT' && el.type === 'file') {
+        e.preventDefault();
+        e.stopPropagation();
+        interceptFileInputClick(el);
+      }
+    }, true);
+    
+    // Method 3: Override showOpenFilePicker if it exists (modern File System Access API)
+    if (window.showOpenFilePicker) {
+      var _origShowOpenFilePicker = window.showOpenFilePicker;
+      window.showOpenFilePicker = function(options) {
+        log('[File] showOpenFilePicker intercepted');
+        options = options || {};
+        var accept = '';
+        if (options.types && options.types.length > 0) {
+          var exts = [];
+          options.types.forEach(function(t) {
+            if (t.accept) {
+              Object.keys(t.accept).forEach(function(mime) {
+                t.accept[mime].forEach(function(ext) {
+                  exts.push(ext);
+                });
+              });
+            }
+          });
+          accept = exts.join(',');
+        }
+        
+        return new Promise(function(resolve, reject) {
+          request('selectFile', { title: 'Select File', accept: accept }).then(function(result) {
+            if (result && result.success && result.base64) {
+              var byteString = atob(result.base64);
+              var ab = new ArrayBuffer(byteString.length);
+              var ia = new Uint8Array(ab);
+              for (var i = 0; i < byteString.length; i++) {
+                ia[i] = byteString.charCodeAt(i);
+              }
+              var blob = new Blob([ab], { type: result.mimeType || 'application/octet-stream' });
+              
+              // Create a mock FileSystemFileHandle
+              var mockHandle = {
+                kind: 'file',
+                name: result.filename,
+                getFile: function() {
+                  return Promise.resolve(new File([blob], result.filename, { type: result.mimeType }));
+                }
+              };
+              resolve([mockHandle]);
+            } else if (result && result.cancelled) {
+              reject(new DOMException('The user aborted a request.', 'AbortError'));
+            } else {
+              reject(new Error(result && result.error || 'File selection failed'));
+            }
+          }).catch(reject);
+        });
+      };
+    }
+    
+    log('[Bridge] File input interceptor installed');
+  })();
 })();
 </script>`
 }
@@ -650,6 +951,20 @@ func shutdownProxyServer(scid string) {
 	}
 }
 
+// shutdownMemoryServer shuts down an in-memory DocShards server by SCID
+func shutdownMemoryServer(scid string) {
+	memoryServerRegistry.Lock()
+	defer memoryServerRegistry.Unlock()
+
+	server, exists := memoryServerRegistry.servers[scid]
+	if exists {
+		server.Close()
+		delete(memoryServerRegistry.servers, scid)
+		delete(memoryServerRegistry.ports, scid)
+		delete(memoryServerRegistry.content, scid)
+	}
+}
+
 // ListActiveServers returns all currently running TELA servers
 func (a *App) ListActiveServers() map[string]interface{} {
 	a.logToConsole("[Server] Listing active servers...")
@@ -751,6 +1066,18 @@ func (a *App) ShutdownAllServers() map[string]interface{} {
 	proxyRegistry.ports = make(map[string]int)
 	proxyRegistry.Unlock()
 
+	// Shutdown all in-memory DocShards servers
+	memoryServerRegistry.Lock()
+	for scid := range memoryServerRegistry.servers {
+		if server, exists := memoryServerRegistry.servers[scid]; exists {
+			server.Close()
+		}
+	}
+	memoryServerRegistry.servers = make(map[string]*http.Server)
+	memoryServerRegistry.ports = make(map[string]int)
+	memoryServerRegistry.content = make(map[string]*TELAContent)
+	memoryServerRegistry.Unlock()
+
 	// Shutdown via tela library - get all servers and shut each down
 	telaServers := tela.GetServerInfo()
 	for _, ts := range telaServers {
@@ -785,6 +1112,8 @@ func (a *App) ShutdownTELAServers() map[string]interface{} {
 		if !server.IsLocal {
 			// Shutdown proxy for this SCID
 			shutdownProxyServer(server.SCID)
+			// Shutdown in-memory server for this SCID (if any)
+			shutdownMemoryServer(server.SCID)
 			tela.ShutdownServer(name)
 			delete(serverRegistry.servers, name)
 			shutdownCount++
@@ -888,14 +1217,58 @@ func (a *App) ServeTELAContent(scid string) map[string]interface{} {
 	telaLink, err := tela.ServeTELA(scid, endpoint)
 	if err != nil {
 		// DocShards INDEX contracts are assembled by HOLOGRAM, not the tela library.
-		// The tela library doesn't support serving them, so use srcdoc mode directly.
+		// Since the tela library doesn't support serving DocShards, HOLOGRAM serves
+		// the assembled content via its own HTTP server. This is necessary because
+		// WASM files cannot be inlined into HTML and must be fetched via HTTP.
 		if strings.Contains(err.Error(), "DocShards") {
-			a.logToConsole("[OK] DocShards content — using srcdoc mode (HOLOGRAM handles shard assembly)")
+			a.logToConsole("[MEM] DocShards detected — fetching and assembling content")
+			
+			// Fetch and assemble the content (same as FetchSCID does)
+			content, fetchErr := a.FetchTELAContent(scid)
+			if fetchErr != nil {
+				a.logToConsole(fmt.Sprintf("[ERR] Failed to fetch DocShards content: %v", fetchErr))
+				return map[string]interface{}{
+					"success": false,
+					"error":   fmt.Sprintf("Failed to fetch DocShards content: %v", fetchErr),
+				}
+			}
+			
+			// Create in-memory HTTP server to serve the assembled content
+			memURL, memErr := a.serveDocShardsContent(scid, content)
+			if memErr != nil {
+				a.logToConsole(fmt.Sprintf("[ERR] Failed to create in-memory server: %v", memErr))
+				return map[string]interface{}{
+					"success": false,
+					"error":   fmt.Sprintf("Failed to serve DocShards: %v", memErr),
+				}
+			}
+			
+			// Register the in-memory server as the active server
+			durl := ""
+			if du, ok := content.Meta["durl"].(string); ok {
+				durl = du
+			}
+			serverName := durl
+			if serverName == "" {
+				serverName = scid[:16]
+			}
+			
+			serverRegistry.Lock()
+			serverRegistry.servers[serverName] = &ActiveServer{
+				Name:    serverName,
+				SCID:    scid,
+				URL:     memURL,
+				IsLocal: false,
+			}
+			serverRegistry.Unlock()
+			
+			a.logToConsole(fmt.Sprintf("[OK] DocShards content served via in-memory HTTP: %s", memURL))
 			return map[string]interface{}{
-				"success":    true,
-				"srcdocOnly": true,
-				"scid":       scid,
-				"message":    "DocShards content served via srcdoc mode",
+				"success": true,
+				"name":    serverName,
+				"scid":    scid,
+				"url":     memURL,
+				"message": "DocShards content served via in-memory HTTP server",
 			}
 		}
 		// Retry once if a stale clone already exists

From faf450dc17fe5b5641f6c7811f04e03f3d5171b5 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sun, 3 May 2026 22:00:56 -0400
Subject: [PATCH 13/16] feat(browser): add native file picker for TELA apps

Implements native file dialog support for TELA dApps that need to
import files (images, data, etc.) through HTML file inputs.

- Add SelectFileWithContent Go method that opens native file dialog
  and returns base64-encoded file content
- Support MIME type and extension filtering
- Handle file size limits (50MB max)
- Add Wails bindings for frontend access

Works around iframe sandbox restrictions in Wails WebView that
prevent standard file inputs from functioning in TELA apps.
---
 file_service.go                   | 153 ++++++++++++++++++++++++++++++
 frontend/wailsjs/go/main/App.d.ts |   4 +
 frontend/wailsjs/go/main/App.js   |   8 ++
 3 files changed, 165 insertions(+)

diff --git a/file_service.go b/file_service.go
index fc0110a..b7a5392 100644
--- a/file_service.go
+++ b/file_service.go
@@ -551,6 +551,159 @@ func (a *App) SelectFile() string {
 	return selection
 }
 
+// SelectFileWithContent opens a native file picker dialog and returns the file content as base64.
+// This is used by TELA dApps that need to select files (e.g., importing images).
+// The accept parameter is a comma-separated list of MIME types (e.g., "image/png,image/jpeg")
+// or file extensions (e.g., ".png,.jpg"). If empty, all files are shown.
+func (a *App) SelectFileWithContent(title string, accept string) map[string]interface{} {
+	a.logToConsole(fmt.Sprintf("[FILE] SelectFileWithContent: title=%s, accept=%s", title, accept))
+
+	// Build file filters from accept parameter
+	filters := []runtime.FileFilter{}
+	if accept != "" {
+		// Parse accept string to build filters
+		parts := strings.Split(accept, ",")
+		patterns := []string{}
+		for _, part := range parts {
+			part = strings.TrimSpace(part)
+			if strings.HasPrefix(part, ".") {
+				// Extension like ".png"
+				patterns = append(patterns, "*"+part)
+			} else if strings.Contains(part, "/") {
+				// MIME type like "image/png"
+				switch part {
+				case "image/png":
+					patterns = append(patterns, "*.png")
+				case "image/jpeg":
+					patterns = append(patterns, "*.jpg", "*.jpeg")
+				case "image/gif":
+					patterns = append(patterns, "*.gif")
+				case "image/svg+xml":
+					patterns = append(patterns, "*.svg")
+				case "image/*":
+					patterns = append(patterns, "*.png", "*.jpg", "*.jpeg", "*.gif", "*.svg", "*.webp")
+				case "text/plain":
+					patterns = append(patterns, "*.txt")
+				case "text/html":
+					patterns = append(patterns, "*.html", "*.htm")
+				case "text/css":
+					patterns = append(patterns, "*.css")
+				case "application/javascript", "text/javascript":
+					patterns = append(patterns, "*.js")
+				case "application/json":
+					patterns = append(patterns, "*.json")
+				}
+			}
+		}
+		if len(patterns) > 0 {
+			filters = append(filters, runtime.FileFilter{
+				DisplayName: "Allowed Files",
+				Pattern:     strings.Join(patterns, ";"),
+			})
+		}
+	}
+	// Always add "All Files" as fallback
+	filters = append(filters, runtime.FileFilter{
+		DisplayName: "All Files",
+		Pattern:     "*.*",
+	})
+
+	dialogTitle := title
+	if dialogTitle == "" {
+		dialogTitle = "Select File"
+	}
+
+	selection, err := runtime.OpenFileDialog(a.ctx, runtime.OpenDialogOptions{
+		Title:   dialogTitle,
+		Filters: filters,
+	})
+	if err != nil {
+		a.logToConsole(fmt.Sprintf("[ERR] SelectFileWithContent: Dialog error - %v", err))
+		return map[string]interface{}{
+			"success": false,
+			"error":   fmt.Sprintf("File dialog error: %v", err),
+		}
+	}
+
+	// User cancelled
+	if selection == "" {
+		a.logToConsole("[FILE] SelectFileWithContent: User cancelled")
+		return map[string]interface{}{
+			"success":   false,
+			"cancelled": true,
+		}
+	}
+
+	// Read the file
+	info, err := os.Stat(selection)
+	if err != nil {
+		a.logToConsole(fmt.Sprintf("[ERR] SelectFileWithContent: Stat error - %v", err))
+		return map[string]interface{}{
+			"success": false,
+			"error":   fmt.Sprintf("Cannot read file: %v", err),
+		}
+	}
+
+	// Limit file size to 50MB for safety
+	const maxSize = 50 * 1024 * 1024
+	if info.Size() > maxSize {
+		a.logToConsole(fmt.Sprintf("[ERR] SelectFileWithContent: File too large (%d bytes)", info.Size()))
+		return map[string]interface{}{
+			"success": false,
+			"error":   fmt.Sprintf("File too large (%d bytes). Maximum is 50MB.", info.Size()),
+		}
+	}
+
+	data, err := os.ReadFile(selection)
+	if err != nil {
+		a.logToConsole(fmt.Sprintf("[ERR] SelectFileWithContent: Read error - %v", err))
+		return map[string]interface{}{
+			"success": false,
+			"error":   fmt.Sprintf("Failed to read file: %v", err),
+		}
+	}
+
+	// Detect MIME type from extension
+	ext := strings.ToLower(filepath.Ext(selection))
+	mimeType := "application/octet-stream"
+	switch ext {
+	case ".png":
+		mimeType = "image/png"
+	case ".jpg", ".jpeg":
+		mimeType = "image/jpeg"
+	case ".gif":
+		mimeType = "image/gif"
+	case ".svg":
+		mimeType = "image/svg+xml"
+	case ".webp":
+		mimeType = "image/webp"
+	case ".txt":
+		mimeType = "text/plain"
+	case ".html", ".htm":
+		mimeType = "text/html"
+	case ".css":
+		mimeType = "text/css"
+	case ".js":
+		mimeType = "application/javascript"
+	case ".json":
+		mimeType = "application/json"
+	}
+
+	// Encode as base64
+	base64Data := base64.StdEncoding.EncodeToString(data)
+
+	a.logToConsole(fmt.Sprintf("[OK] SelectFileWithContent: Selected %s (%d bytes)", info.Name(), info.Size()))
+
+	return map[string]interface{}{
+		"success":  true,
+		"filename": info.Name(),
+		"path":     selection,
+		"size":     info.Size(),
+		"mimeType": mimeType,
+		"base64":   base64Data,
+	}
+}
+
 // ReadTextFile reads a text file and returns its content.
 // Used by the Deploy SC flow to load .bas files from disk.
 func (a *App) ReadTextFile(filePath string) map[string]interface{} {
diff --git a/frontend/wailsjs/go/main/App.d.ts b/frontend/wailsjs/go/main/App.d.ts
index a6f0557..04b51b9 100755
--- a/frontend/wailsjs/go/main/App.d.ts
+++ b/frontend/wailsjs/go/main/App.d.ts
@@ -329,6 +329,8 @@ export function GetSCStateAtHeight(arg1:string,arg2:number):Promise<Record<strin
 
 export function GetSCStateHistory(arg1:string):Promise<Record<string, any>>;
 
+export function GetSCVariable(arg1:string,arg2:Array<string>):Promise<Record<string, any>>;
+
 export function GetSCVariables(arg1:string):Promise<Record<string, any>>;
 
 export function GetSearchExclusions():Promise<Record<string, any>>;
@@ -551,6 +553,8 @@ export function SearchMyINDEXes():Promise<Record<string, any>>;
 
 export function SelectFile():Promise<string>;
 
+export function SelectFileWithContent(arg1:string,arg2:string):Promise<Record<string, any>>;
+
 export function SelectFiles():Promise<Record<string, any>>;
 
 export function SelectFolder():Promise<string>;
diff --git a/frontend/wailsjs/go/main/App.js b/frontend/wailsjs/go/main/App.js
index f594a97..8c240b0 100755
--- a/frontend/wailsjs/go/main/App.js
+++ b/frontend/wailsjs/go/main/App.js
@@ -654,6 +654,10 @@ export function GetSCStateHistory(arg1) {
   return window['go']['main']['App']['GetSCStateHistory'](arg1);
 }
 
+export function GetSCVariable(arg1, arg2) {
+  return window['go']['main']['App']['GetSCVariable'](arg1, arg2);
+}
+
 export function GetSCVariables(arg1) {
   return window['go']['main']['App']['GetSCVariables'](arg1);
 }
@@ -1098,6 +1102,10 @@ export function SelectFile() {
   return window['go']['main']['App']['SelectFile']();
 }
 
+export function SelectFileWithContent(arg1, arg2) {
+  return window['go']['main']['App']['SelectFileWithContent'](arg1, arg2);
+}
+
 export function SelectFiles() {
   return window['go']['main']['App']['SelectFiles']();
 }

From b001f4b2a3b5bcc1279ee4a22266185c4e695399 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sun, 3 May 2026 22:01:17 -0400
Subject: [PATCH 14/16] fix(wallet): display burn fees and gas costs in
 approval modal

Enhances the wallet approval modal to clearly show all transaction
costs before the user approves, addressing visibility issues where
burn amounts and gas fees were not being surfaced.

- Add parseScPayload function to extract entrypoint and SC arguments
  from raw DERO RPC sc_rpc arrays
- Display TOTAL COST summing burn amounts, transfer amounts, and fees
- Show cost breakdown with individual Burn/Fees/Amount components
- Handle SC calls without explicit transfers (show 0 DERO explicitly)
- Capture top-level fees field in addition to per-transfer fees
- Add CSS styling for total and breakdown display

Users now see exactly what they're about to spend before approving
any smart contract transaction.
---
 .../src/lib/components/WalletModal.svelte     | 118 ++++++++++++++----
 frontend/src/routes/Browser.svelte            |  59 ++++++++-
 2 files changed, 149 insertions(+), 28 deletions(-)

diff --git a/frontend/src/lib/components/WalletModal.svelte b/frontend/src/lib/components/WalletModal.svelte
index 2719f37..6ed9d6a 100644
--- a/frontend/src/lib/components/WalletModal.svelte
+++ b/frontend/src/lib/components/WalletModal.svelte
@@ -416,36 +416,67 @@
               
               <!-- Transfers (DERO or token amounts) -->
               {#if request.payload.transfers && request.payload.transfers.length > 0}
-                {#each request.payload.transfers as transfer}
+                {@const deroTransfers = request.payload.transfers.filter(t => !t.scid || t.scid === '0000000000000000000000000000000000000000000000000000000000000000')}
+                <!-- Sum all cost fields: amount, burn (if numeric), fees from transfers AND top-level fees -->
+                {@const totalAmount = deroTransfers.reduce((sum, t) => sum + (t.amount || 0), 0)}
+                {@const totalBurn = deroTransfers.reduce((sum, t) => sum + (typeof t.burn === 'number' ? t.burn : 0), 0)}
+                {@const transferFees = deroTransfers.reduce((sum, t) => sum + (t.fees || 0), 0)}
+                {@const topLevelFees = request.payload.fees || 0}
+                {@const totalFees = transferFees + topLevelFees}
+                {@const totalDero = totalAmount + totalBurn + totalFees}
+                {@const hasBurnField = deroTransfers.some(t => t.burn)}
+                
+                <!-- Show total DERO cost -->
+                {#if deroTransfers.length > 0}
                   <div class="modal-tx-field">
-                    <div class="modal-tx-label">
-                      {#if transfer.burn}
-                        BURN AMOUNT
-                      {:else}
-                        AMOUNT
-                      {/if}
-                    </div>
-                    <div class="modal-tx-amount">
-                      {#if transfer.scid && transfer.scid !== '0000000000000000000000000000000000000000000000000000000000000000'}
-                        {transfer.amount || 0} token(s)
-                        <span class="modal-tx-token-scid" title={transfer.scid}>
-                          ({transfer.scid.slice(0, 6)}...)
-                        </span>
-                      {:else}
-                        {((transfer.amount || 0) / 100000).toLocaleString()} DERO
-                      {/if}
+                    <div class="modal-tx-label">TOTAL COST</div>
+                    <div class="modal-tx-amount modal-tx-amount-total">
+                      {(totalDero / 100000).toLocaleString()} DERO
                     </div>
                   </div>
-                  {#if transfer.destination}
-                    <div class="modal-tx-field">
-                      <div class="modal-tx-label">DESTINATION</div>
-                      <div class="modal-tx-destination">
-                        {transfer.destination}
+                {/if}
+                
+                <!-- Show breakdown of costs if any non-zero values -->
+                {#if totalAmount > 0 || totalBurn > 0 || totalFees > 0}
+                  <div class="modal-tx-breakdown">
+                    <div class="modal-tx-label modal-tx-label-small">BREAKDOWN</div>
+                    {#if totalBurn > 0}
+                      <div class="modal-tx-breakdown-item">
+                        <span class="modal-tx-breakdown-label">Burn:</span>
+                        <span class="modal-tx-breakdown-value">{(totalBurn / 100000).toLocaleString()} DERO</span>
+                      </div>
+                    {/if}
+                    {#if totalFees > 0}
+                      <div class="modal-tx-breakdown-item">
+                        <span class="modal-tx-breakdown-label">Fees:</span>
+                        <span class="modal-tx-breakdown-value">{(totalFees / 100000).toLocaleString()} DERO</span>
                       </div>
+                    {/if}
+                    {#if totalAmount > 0}
+                      <div class="modal-tx-breakdown-item">
+                        <span class="modal-tx-breakdown-label">Amount:</span>
+                        <span class="modal-tx-breakdown-value">{(totalAmount / 100000).toLocaleString()} DERO</span>
+                      </div>
+                    {/if}
+                  </div>
+                {/if}
+                
+                <!-- Show destination if present (usually same for all burns to SC) -->
+                {#if request.payload.transfers[0]?.destination}
+                  <div class="modal-tx-field">
+                    <div class="modal-tx-label">DESTINATION</div>
+                    <div class="modal-tx-destination">
+                      {request.payload.transfers[0].destination}
                     </div>
-                  {/if}
-                {/each}
-              {:else if !request.payload.scid}
+                  </div>
+                {/if}
+              {:else if request.payload.scid}
+                <!-- SC call with no explicit transfers - show 0 DERO burn -->
+                <div class="modal-tx-field">
+                  <div class="modal-tx-label">BURN AMOUNT</div>
+                  <div class="modal-tx-amount">0 DERO</div>
+                </div>
+              {:else}
                 <!-- No transfers and no SC - unusual, show warning -->
                 <div class="modal-tx-field">
                   <div class="modal-tx-label">AMOUNT</div>
@@ -945,6 +976,43 @@
     font-style: italic;
   }
   
+  .modal-tx-amount-total {
+    font-size: 16px;
+    font-weight: 600;
+    color: var(--accent);
+  }
+  
+  .modal-tx-breakdown {
+    display: flex;
+    flex-direction: column;
+    gap: var(--s-1);
+    padding: var(--s-2);
+    background: rgba(8, 8, 14, 0.3);
+    border-radius: var(--r-sm);
+    margin-top: var(--s-1);
+  }
+  
+  .modal-tx-label-small {
+    font-size: 9px;
+    margin-bottom: var(--s-1);
+  }
+  
+  .modal-tx-breakdown-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-family: var(--font-mono);
+    font-size: 11px;
+  }
+  
+  .modal-tx-breakdown-label {
+    color: var(--text-5);
+  }
+  
+  .modal-tx-breakdown-value {
+    color: var(--text-3);
+  }
+  
   .modal-tx-ringsize {
     font-family: var(--font-mono);
     font-size: 12px;
diff --git a/frontend/src/routes/Browser.svelte b/frontend/src/routes/Browser.svelte
index 21f4f0f..af1612b 100644
--- a/frontend/src/routes/Browser.svelte
+++ b/frontend/src/routes/Browser.svelte
@@ -3,7 +3,7 @@
   import { writable, get } from 'svelte/store';
   import { appState, settingsState, walletState, addToHistory, addConsoleLog, pendingNavigation, clearPendingNavigation, requestWalletApproval, walletRequests, consoleLogs as consoleLogsStore, clearConsoleLogs as clearConsoleLogsStore, navigateTo, updateStatus, toast, setAppDiscoveryState } from '../lib/stores/appState.js';
   import { favorites } from '../lib/stores/favorites.js';
-  import { Navigate, FetchSCID, FetchByDURL, GetAppRating, GetNameSuggestions, CallXSWD, ConnectXSWD, ApproveWalletConnection, InternalWalletCall, GetDiscoveredApps, StartGnomon, EnsureGnomonRunning, GetLocalDevServerStatus, StartLocalDevServer, ServeTELAContent, ShutdownServer, ListActiveServers, ClearConsoleLogs as ClearBackendLogs, SetGnomonAutostart, GetGnomonAutostart, GetAllTags, GetTELAAppsWithTags, GetSCIDMetadata, CheckAppFilter, GetContentFilterConfig, ManuallyAllowApp, ManuallyBlockApp, ClearAppFilterOverride, GetLiveStats, GetBalance, GetTransactionHistory, SaveBinaryFileWithDialog, OpenURLInBrowserIfAllowed, ClearAppCache, IsAppCachedOffline } from '../../wailsjs/go/main/App.js';
+  import { Navigate, FetchSCID, FetchByDURL, GetAppRating, GetNameSuggestions, CallXSWD, ConnectXSWD, ApproveWalletConnection, InternalWalletCall, GetDiscoveredApps, StartGnomon, EnsureGnomonRunning, GetLocalDevServerStatus, StartLocalDevServer, ServeTELAContent, ShutdownServer, ListActiveServers, ClearConsoleLogs as ClearBackendLogs, SetGnomonAutostart, GetGnomonAutostart, GetAllTags, GetTELAAppsWithTags, GetSCIDMetadata, CheckAppFilter, GetContentFilterConfig, ManuallyAllowApp, ManuallyBlockApp, ClearAppFilterOverride, GetLiveStats, GetBalance, GetTransactionHistory, SaveBinaryFileWithDialog, SelectFileWithContent, OpenURLInBrowserIfAllowed, ClearAppCache, IsAppCachedOffline } from '../../wailsjs/go/main/App.js';
   import ReloadSplitButton from '../lib/components/browser/ReloadSplitButton.svelte';
   import { EventsOn, EventsOff, ClipboardSetText } from '../../wailsjs/runtime/runtime.js';
 import { HoloBadge, DotIndicator, Icons } from '../lib/components/holo';
@@ -46,6 +46,40 @@ function getPermissionDescription(permId) {
   return descriptions[permId] || 'Unknown permission';
 }
 
+// Parse SC payload from raw DERO RPC format for display in wallet modal
+// Extracts entrypoint and sc_args from sc_rpc array
+function parseScPayload(params) {
+  if (!params) return params;
+  
+  const scRpc = params.sc_rpc || params.sc_data || [];
+  
+  // Extract entrypoint from sc_rpc if present
+  let entrypoint = params.entrypoint;
+  if (!entrypoint && Array.isArray(scRpc)) {
+    const entrypointArg = scRpc.find(arg => arg.name === 'entrypoint');
+    if (entrypointArg) {
+      entrypoint = entrypointArg.value;
+    }
+  }
+  
+  // Extract SC arguments (excluding entrypoint) for display
+  let scArgs = [];
+  if (Array.isArray(scRpc)) {
+    scArgs = scRpc.filter(arg => arg.name !== 'entrypoint').map(arg => ({
+      name: arg.name,
+      type: arg.datatype,
+      value: arg.value
+    }));
+  }
+  
+  return {
+    ...params,
+    entrypoint,
+    sc_args: scArgs,
+    sc_data: scRpc
+  };
+}
+
 function closeExternalLinkModal() {
   showExternalLinkModal = false;
   externalLinkUrl = '';
@@ -1177,11 +1211,13 @@ let addressInput = '';
                 
                 if (isSigningMethod) {
                   // Signing methods need user approval each time
+                  // Parse SC payload for proper display in wallet modal
+                  const parsedPayload = parseScPayload(params);
                   const approval = await requestWalletApproval({
                     type: 'sign',
                     appName: currentMeta.name || 'App',
                     origin: addressInput,
-                    payload: params
+                    payload: parsedPayload
                   });
                   
                   if (approval.approved) {
@@ -1226,6 +1262,21 @@ let addressInput = '';
             }
             break;
             
+          case 'selectFile': {
+            // File picker request from bridge script (allows dApps to select files)
+            const { title, accept } = payload || {};
+            addConsoleLog(`[Browser] Opening file picker: title="${title || 'Select File'}", accept="${accept || '*'}"`);
+            result = await SelectFileWithContent(title || '', accept || '');
+            if (result && result.success) {
+              addConsoleLog(`[OK] File selected: ${result.filename} (${result.size} bytes)`);
+            } else if (result && result.cancelled) {
+              addConsoleLog(`[Browser] File picker cancelled by user`);
+            } else {
+              addConsoleLog(`[ERR] File picker failed: ${result?.error || 'unknown error'}`);
+            }
+            break;
+          }
+
           case 'saveFile': {
             // Download request from bridge script (works for cross-origin HTTP-served apps)
             const { filename, base64, mimeType } = payload;
@@ -2623,11 +2674,13 @@ ${logsText || '(no logs)'}
             const methodLower = method.toLowerCase().replace('dero.', '');
             
             if (settings.integratedWallet && signingMethods.includes(methodLower)) {
+              // Parse SC payload for proper display in wallet modal
+              const parsedPayload = parseScPayload(params);
               const approval = await requestWalletApproval({
                 type: 'sign',
                 appName: currentMeta.name || 'App',
                 origin: addressInput,
-                payload: params
+                payload: parsedPayload
               });
               
               if (approval.approved) {

From 1a8a1c8d4315eb28cac27b91597ffd7811b25846 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sun, 3 May 2026 22:01:38 -0400
Subject: [PATCH 15/16] feat(sidebar): integrate Villager avatar in wallet
 anchor

Adds Villager avatar display in the wallet anchor area and enables
launching the Villager editor by clicking on the avatar.

- Add GetSCVariable Go method for direct daemon SC key queries
- Update avatarService to use direct daemon RPC instead of XSWD
  for fetching avatar pixel data from Villager contract
- Make getAvatarUrl async to ensure custom pixels load before render
- Update handleAvatarClick to navigate to villager.tela and switch
  to Browser tab
- Update UI text to reflect Villager availability

The wallet anchor now shows the user's on-chain Villager avatar and
provides quick access to the avatar editor.
---
 app.go                                     | 38 ++++++++++++++++
 frontend/src/lib/components/Sidebar.svelte | 21 +++++----
 frontend/src/lib/utils/avatarService.js    | 50 +++++++---------------
 3 files changed, 66 insertions(+), 43 deletions(-)

diff --git a/app.go b/app.go
index cee0b98..a48a559 100644
--- a/app.go
+++ b/app.go
@@ -838,6 +838,44 @@ func (a *App) DaemonGetSC(scid string) map[string]interface{} {
 	return map[string]interface{}{"success": true, "result": res}
 }
 
+// GetSCVariable queries specific keys from a smart contract
+// Used for fetching individual variables like avatar data without fetching all contract data
+func (a *App) GetSCVariable(scid string, keys []string) map[string]interface{} {
+	if a.daemonClient == nil {
+		return map[string]interface{}{"success": false, "error": "Not connected to any node. Please connect to a network first."}
+	}
+	if scid == "" {
+		return map[string]interface{}{"success": false, "error": "SCID is required"}
+	}
+	if len(keys) == 0 {
+		return map[string]interface{}{"success": false, "error": "At least one key is required"}
+	}
+
+	params := map[string]interface{}{
+		"scid":       scid,
+		"code":       false,
+		"variables":  false,
+		"keysstring": keys,
+	}
+
+	res, err := a.daemonClient.Call("DERO.GetSC", params)
+	if err != nil {
+		a.logToConsole(fmt.Sprintf("[ERR] GetSCVariable failed for %s: %v", scid[:16], err))
+		return ErrorResponse(err)
+	}
+
+	// Extract valuesstring from result
+	if resMap, ok := res.(map[string]interface{}); ok {
+		return map[string]interface{}{
+			"success":      true,
+			"scid":         scid,
+			"valuesstring": resMap["valuesstring"],
+		}
+	}
+
+	return map[string]interface{}{"success": true, "result": res}
+}
+
 // ================== NRS & Explorer Features ==================
 
 func (a *App) ResolveDeroName(name string) map[string]interface{} {
diff --git a/frontend/src/lib/components/Sidebar.svelte b/frontend/src/lib/components/Sidebar.svelte
index 955c543..36bdc9b 100644
--- a/frontend/src/lib/components/Sidebar.svelte
+++ b/frontend/src/lib/components/Sidebar.svelte
@@ -1,6 +1,6 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy } from 'svelte';
-  import { appState, walletState, settingsState, requestWalletApproval, syncNetworkMode, toast, combinedSyncProgress } from '../stores/appState.js';
+  import { appState, walletState, settingsState, requestWalletApproval, syncNetworkMode, toast, combinedSyncProgress, navigateTo } from '../stores/appState.js';
   import { 
     GetEpochStats, SetNetworkMode,
     StartSimulatorMode, StopSimulatorMode, GetSimulatorStatus,
@@ -481,11 +481,16 @@
     }
   }
   
-  // Avatar editing is moving to Villager; keep a clear temporary action for now.
+  // Launch Villager avatar editor when clicking on the avatar
   function handleAvatarClick(event) {
     event.stopPropagation();
     event.preventDefault();
-    toast.info('Villager avatar editor coming soon');
+    
+    // Navigate to villager.tela
+    navigateTo('villager.tela');
+    
+    // Switch to Browser tab
+    window.dispatchEvent(new CustomEvent('switch-tab', { detail: 'browser' }));
   }
   
   async function handleConnectWallet() {
@@ -1087,7 +1092,7 @@
           <img 
             src={walletAvatarUrl} 
             alt="Wallet avatar"
-            title="Villager avatar editor coming soon"
+            title="Edit avatar in Villager"
             class="wallet-avatar wallet-avatar-collapsed wallet-avatar-clickable"
             class:wallet-avatar-pending={walletIsConnected && $appState.pendingXSWDRequests?.length > 0}
             on:click={handleAvatarClick}
@@ -1127,7 +1132,7 @@
             <img 
               src={walletAvatarUrl} 
               alt="Wallet avatar"
-              title="Villager avatar editor coming soon"
+              title="Edit avatar in Villager"
               class="wallet-avatar wallet-avatar-expanded wallet-avatar-clickable"
               class:wallet-avatar-pending={walletIsConnected && $appState.pendingXSWDRequests?.length > 0}
               on:click={handleAvatarClick}
@@ -1301,15 +1306,15 @@
             </div>
           {/if}
 
-          <!-- Manage Avatar Placeholder -->
+          <!-- Manage Avatar -->
           <div class="wallet-menu-action">
             <button
               on:click|stopPropagation={handleAvatarClick}
               class="manage-avatar-btn"
-              title="Villager avatar editor coming soon"
+              title="Edit your avatar in Villager"
             >
               <span class="manage-avatar-title">Manage Avatar</span>
-              <span class="manage-avatar-subtitle">Coming soon (Villager on TELA)</span>
+              <span class="manage-avatar-subtitle">Edit in Villager</span>
             </button>
           </div>
           
diff --git a/frontend/src/lib/utils/avatarService.js b/frontend/src/lib/utils/avatarService.js
index d498890..a3c714a 100644
--- a/frontend/src/lib/utils/avatarService.js
+++ b/frontend/src/lib/utils/avatarService.js
@@ -1,5 +1,5 @@
 import VillagerIdenticon from './villager-identicon.js';
-import { CallXSWD } from '../../../wailsjs/go/main/App.js';
+import { GetSCVariable } from '../../../wailsjs/go/main/App.js';
 
 // Villager Smart Contract ID (Mainnet)
 let VILLAGER_SCID = 'f0b29081c1ed35fe942cb3402cd9d7bf0cf27639201bbc96223bdc99c4c6aa9f';
@@ -36,7 +36,7 @@ function hexToString(hex) {
 }
 
 /**
- * Fetch avatar pixels from smart contract
+ * Fetch avatar pixels from smart contract using direct daemon call
  * @param {string} address - Wallet address
  * @returns {Promise<string|null>} - 576-character pixel string or null if not found
  */
@@ -49,19 +49,11 @@ async function fetchAvatarPixels(address) {
     }
     
     try {
-        // Call smart contract to get avatar
-        const response = await CallXSWD(JSON.stringify({
-            jsonrpc: "2.0",
-            id: 1,
-            method: "DERO.GetSC",
-            params: {
-                scid: VILLAGER_SCID,
-                keysstring: [`avatar_${address}`]
-            }
-        }));
+        // Call smart contract using direct daemon RPC (works without XSWD)
+        const response = await GetSCVariable(VILLAGER_SCID, [`avatar_${address}`]);
         
-        if (response?.result?.valuesstring?.[0]) {
-            const avatarHex = response.result.valuesstring[0];
+        if (response?.success && response?.valuesstring?.[0]) {
+            const avatarHex = response.valuesstring[0];
             // Decode hex to 576-char string
             const avatarStr = hexToString(avatarHex);
             
@@ -80,7 +72,7 @@ async function fetchAvatarPixels(address) {
 
 /**
  * Get avatar URL for an address
- * Renders frame instantly, fetches custom pixels in background
+ * Fetches custom pixels from blockchain and renders with identicon frame
  * @param {string} address - Wallet address
  * @param {number} size - Requested size in pixels (default: 40)
  * @returns {Promise<string>} - Object URL for the avatar image
@@ -96,31 +88,19 @@ export async function getAvatarUrl(address, size = 40) {
         return avatarUrlCache.get(cacheKey);
     }
     
-    // Start with empty avatar (frame only) - renders instantly
+    // Fetch custom pixels from blockchain (or use empty if none found)
     let avatarStr = EMPTY_AVATAR;
-    
-    // Try to fetch custom pixels (non-blocking)
-    fetchAvatarPixels(address).then(pixels => {
+    try {
+        const pixels = await fetchAvatarPixels(address);
         if (pixels && pixels.length === 576) {
-            // Update cache with custom pixels
-            avatarPixelCache.set(address, pixels);
-            
-            // Re-render with custom pixels
-            // Clear old cache entry
-            avatarUrlCache.delete(cacheKey);
-            
-            // Generate new avatar with custom pixels
-            VillagerIdenticon.render(address, pixels, size).then(url => {
-                avatarUrlCache.set(cacheKey, url);
-            }).catch(err => {
-                console.error('Failed to render avatar with custom pixels:', err);
-            });
+            avatarStr = pixels;
         }
-    }).catch(err => {
+    } catch (err) {
         console.error('Failed to fetch avatar pixels:', err);
-    });
+        // Continue with empty avatar
+    }
     
-    // Render immediately with empty pixels (frame only)
+    // Render avatar with identicon frame
     try {
         const url = await VillagerIdenticon.render(address, avatarStr, size);
         avatarUrlCache.set(cacheKey, url);

From 47126c701e42b2f3e66c2f3a8e7483f0eba053a8 Mon Sep 17 00:00:00 2001
From: dhebp <152355273+DHEBP@users.noreply.github.com>
Date: Sun, 3 May 2026 22:11:19 -0400
Subject: [PATCH 16/16] fix(tela): separate embedded shards detection from TELA
 naming convention

Fixes CI test failures by distinguishing between:
- isShardIndexDURL: matches .tela.shards (TELA naming convention)
- isEmbeddedShardsINDEX: matches .shards (embedded INDEX detection)

The original isShardIndexDURL function was modified incorrectly to
check for .shards instead of .tela.shards, breaking existing tests.
---
 blockchain.go | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/blockchain.go b/blockchain.go
index 34ed8fe..1e705a5 100644
--- a/blockchain.go
+++ b/blockchain.go
@@ -203,7 +203,7 @@ func (a *App) FetchTELAContent(scid string) (*TELAContent, error) {
 	// Check if we got at least HTML
 	if content.HTML == "" {
 		// Attempt shard assembly if this is a shard index dURL
-		if du, ok := content.Meta["durl"].(string); ok && isShardIndexDURL(du) {
+		if du, ok := content.Meta["durl"].(string); ok && isEmbeddedShardsINDEX(du) {
 			a.logToConsole("[LINK] Shard index detected; assembling shard files")
 			assembled := assembleShardFiles(content)
 			if assembled != "" {
@@ -248,10 +248,10 @@ func (a *App) FetchTELAContent(scid string) (*TELAContent, error) {
 	return content, nil
 }
 
-// isShardIndexDURL returns true if the dURL ends with .shards (embedded shard INDEX)
+// isShardIndexDURL returns true if the dURL ends with .tela.shards (embedded shard INDEX)
 func isShardIndexDURL(durl string) bool {
 	s := strings.ToLower(strings.TrimSpace(durl))
-	return strings.HasSuffix(s, ".shards")
+	return strings.HasSuffix(s, ".tela.shards")
 }
 
 // isEmbeddedINDEX returns true if the contract is an INDEX (not a DOC)
@@ -369,10 +369,17 @@ func (a *App) reassembleShardChunks(content *TELAContent) {
 	}
 }
 
-// isLibraryDURL returns true if the dURL ends with .lib (embedded library INDEX)
+// isLibraryDURL returns true if the dURL ends with .tela.lib (TELA library INDEX)
 func isLibraryDURL(durl string) bool {
 	s := strings.ToLower(strings.TrimSpace(durl))
-	return strings.HasSuffix(s, ".lib")
+	return strings.HasSuffix(s, ".tela.lib")
+}
+
+// isEmbeddedShardsINDEX returns true if the dURL ends with .shards (embedded shard INDEX)
+// This is used for detecting embedded INDEX contracts like rive.wasm-2.35.3.shards
+func isEmbeddedShardsINDEX(durl string) bool {
+	s := strings.ToLower(strings.TrimSpace(durl))
+	return strings.HasSuffix(s, ".shards")
 }
 
 // fetchSingleDOC renders a standalone DOC contract directly (not part of an INDEX)
@@ -948,7 +955,7 @@ func (a *App) processDOC(docData map[string]interface{}, content *TELAContent) e
 		}
 
 		// Handle embedded .shards INDEX (e.g., rive.js-2.35.3.shards)
-		if isShardIndexDURL(dURL) {
+		if isEmbeddedShardsINDEX(dURL) {
 			scid := ""
 			if scidStr, ok := docData["scid"].(string); ok {
 				scid = scidStr