fix(ui): nest assets under their output, decode names, reorder and mend the pin

[elluff]

Six points from reviewing the shipped detail view and the pinned alert. UI only: no backend file is touched.

The Outputs panel read as a wrong count

"Outputs (4)" sat above 29 visually identical rows, because each output's native assets were rendered as siblings of the output line: same layout, only smaller and greyer. The count was right; the panel was lying by omission. Assets now sit behind a left rule with an "N assets" header, and collapse past ASSET_PREVIEW_COUNT so the one output holding 20 tokens stops burying its three siblings.

Asset names decode to text

42414e4b means nothing; BANK is recognisable, which is why every explorer decodes them. Decoding is deliberately all-or-nothing: a name with even one non-printable byte stays hex, because partial decoding would let arbitrary bytes put control characters on screen, and a half-decoded name is less trustworthy than an honest hex string. CIP-67 label prefixes (the four CIP-68 classes) are recognised and stripped first, since decoding the label bytes along with the name yields mojibake. The raw unit, the label and the hex all stay in the title.

The sub-scores panel moved above the chain-level transaction detail

It explains the score the whole modal is about, and the panels below run to dozens of lines on a multi-asset transaction, so anything after them was effectively hidden.

The Avg Risk tooltip named its referent

It said it was unaffected by "the filters on this table", but it hangs off a KPI card at the top of the page, where "this table" has no visible referent. It now names the Risk Alerts table below.

The pinned critical alert is one table row again

Two defects were stacked on each other. The red accent ran only down the alert row, so it started halfway and read as a line cutting the block in two, and TableRow's own bottom border ran between the label strip and the row it described. Carrying the tint on both rows fixed the drawing but not the cause, which was spending a whole table row on two words: the operator read the strip as another alert.

The label is now a marker in the row itself, shaped like the "unclusterable model" badge already in this table, so there is one visual vocabulary for "metadata about this row, not a field of the transaction". It trails the hash rather than leading it, because ahead of it the pinned row's ID would start 80px right of every other row's and the column would look broken. The tint and the full-height accent delimit the row, no coloured horizontal edge remains, and the spacer row separates it from the sorted list. "Kept in view regardless of the sort below" is gone as superfluous; the sentence explaining the pin now lives in the marker's title.

One test changed rather than being added to

It pinned the head-only truncation of a long asset name using the hex for CardaSnekNFT123, which is printable and now renders decoded. It keeps its purpose with a non-printable first byte, so the truncation path is still covered.

Verification

• 148 frontend tests (up 11 from main), and every new behaviour verified falsifiable by injecting the regression it guards: reintroducing the label strip fails four of them, including the one that counts the block's table rows.
• eslint, tsc -b, vite build clean; prettier --check clean on the files touched.
• Every new Tailwind utility checked against the built CSS, since a class Tailwind cannot generate fails silently. The strip's now-unused hover tint is correspondingly absent from the bundle.
• Backend untouched, but the recall gate (tests/analysis/, 554 tests) was run anyway.

🤖 Generated with Claude Code