fix(portal): give the header's signed-in name a consistent treatment (bd-2558)

[hatafatif]

Small UI fix — and the first end-to-end test of the Railway-builds-the-portal pipeline (bd-2555). No rebuilt dist is committed; the only route to production is the new build.

The problem

The signed-in name sat in the desktop header as a bare text-sm text-white/80 span, in the same flex row as a Logout button styled px-4 py-2 rounded-md:

<span className="text-sm text-white/80">{user?.firstName}</span>
<button className="... px-4 py-2 rounded-md ...">Logout</button>

Three things were off:

1. No shared vertical metrics — no padding, so the name didn't sit on the same optical line as the control beside it.
2. A third opacity — white/80 next to the nav items' white/70 and the active pill's white. Three greys in one bar, for no reason.
3. No width bound — a long name pushed the Logout button sideways. And when firstName was missing the span collapsed entirely, leaving a floating Logout with no indication of who was signed in.

The fix

<span
  data-testid="portal-user-name"
  title={user?.firstName}
  className="px-2 py-2 text-sm font-medium text-white/70 max-w-[12rem] truncate"
>
  {user?.firstName || "Signed in"}
</span>

py-2 to match its sibling's rhythm · the nav's single white/70 · truncating max-w-[12rem] with the full name in title · a "Signed in" fallback so the slot never collapses.

No hover state — it's a label, not a control, and giving it one would imply it's clickable.

Verification

• Red-first: 5 failing before the change → 9 passing after. The 4 pre-existing role-gating tests are unaffected.
• 13 files / 68 tests green across the portal component suite.
• Build compiles; the "Signed in" fallback is confirmed present in the compiled bundle.

Tests assert on the rendered element relative to its sibling rather than on a screenshot, since the defect is structural.

Closes: bd-2558

🤖 Generated with Claude Code