fix: correct UM portal branding asset

web/components/Layout.tsx

@@ -1,4 +1,5 @@
 import Head from "next/head";
+import Image from "next/image";
 import Link from "next/link";
 import { useRouter } from "next/router";
 import { ReactNode } from "react";
@@ -53,9 +54,15 @@ export default function Layout({
       </a>
       <header className="ul-shell__header">
         <Link href="/" className="ul-shell__brand" aria-label="UlHub jobs home">
-          <span className="ul-shell__brand-mark" aria-hidden="true">
+          <Image
-            UL
+            className="ul-shell__brand-mark"
-          </span>
+            src="/um-trace-mark.png"
+            alt=""
+            width={40}
+            height={40}
+            priority
+            unoptimized
+          />
           <span>UlHub</span>
         </Link>
         {user && (

web/styles/global.css

@@ -131,16 +131,15 @@ textarea {
 }
 
 .ul-shell__brand-mark {
-  display: inline-grid;
+  display: block;
+  box-sizing: border-box;
   width: 2.5rem;
   height: 2.5rem;
-  place-items: center;
+  object-fit: contain;
+  padding: 0.375rem;
   border-radius: var(--portal-radius-sm);
-  background: var(--portal-primary);
+  border: 1px solid var(--portal-border);
-  color: var(--portal-on-primary);
+  background: var(--portal-surface);
-  font-family: var(--portal-font-mono);
-  font-size: 0.875rem;
-  letter-spacing: 0.04em;
 }
 
 .ul-shell__nav {

web/tests/s3-portal.test.mjs

@@ -58,6 +58,17 @@ test("the authenticated shell keeps organization and navigation context accessib
   assert.match(layout, /aria-current=/);
   assert.match(layout, /Skip to main content/);
   assert.match(layout, /aria-label="Primary navigation"/);
+  assert.match(layout, /src="\/um-trace-mark\.png"/);
+  assert.doesNotMatch(layout, />\s*UL\s*</);
+});
+
+test("the portal uses the cropped UM foreground without nested icon padding", () => {
+  const layout = read("components/Layout.tsx");
+  const css = read("styles/global.css");
+  assert.match(layout, /src="\/um-trace-mark\.png"/);
+  assert.doesNotMatch(layout, /um-trace-icon\.svg/);
+  assert.match(css, /\.ul-shell__brand-mark\s*\{[^}]*object-fit:\s*contain;/s);
+  assert.match(css, /\.ul-shell__brand-mark\s*\{[^}]*padding:\s*0\.375rem;/s);
 });
 
 test("status presentation always combines a readable label with an icon", () => {