From d313ce0bec87f8b601dc640190f845560a193587 Mon Sep 17 00:00:00 2001
From: glass beadian <glassbeadian@hdys.band>
Date: Tue, 13 Oct 2026 08:23:52 +0000
Subject: [PATCH] Onboarding: wide hero banner (mark left, system name right)
 on black

---
 apps/web/src/app/(main)/onboarding/page.tsx | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/apps/web/src/app/(main)/onboarding/page.tsx b/apps/web/src/app/(main)/onboarding/page.tsx
index 2808633..d1287a1 100644
--- a/apps/web/src/app/(main)/onboarding/page.tsx
+++ b/apps/web/src/app/(main)/onboarding/page.tsx
@@ -4,7 +4,7 @@ import { useEffect, useState, type FormEvent } from "react";
 import Link from "next/link";
 import { Badge, Button, Card, Input } from "../../../components/ui/primitives";
 import { OfflineBadge } from "../../../components/ui/offline-badge";
-import { ArrowGlyph } from "../../../components/brand/logo";
+import { ArrowGlyph, LogoMark } from "../../../components/brand/logo";
 import { PLATFORMS } from "../../../lib/platforms";
 import { useApiResource } from "../../../lib/use-api";
 import { api, errorMessage } from "../../../lib/api-client";
@@ -220,13 +220,13 @@ export default function OnboardingPage(): React.ReactElement {
               >
                 <div className="mb-5">
                   <div className="-m-6 mb-5 overflow-hidden bg-black">
-                    <img
-                      src="/brand/hero.png"
-                      alt="Tactical Media Broadcast Hub — arrows from a circle, warm red on black"
-                      width={1024}
-                      height={1024}
-                      className="mx-auto h-auto w-full max-h-[420px] object-contain"
-                    />
+                    <div className="flex items-center gap-5 px-8 py-8">
+                      <LogoMark size={96} className="shrink-0 text-accent" />
+                      <div className="min-w-0">
+                        <div className="text-xl font-semibold leading-tight text-white">Horizontal Collaborative Broadcast System</div>
+                        <div className="mt-1 text-xs uppercase tracking-wider text-text-faint">Tactical Media Broadcast Hub</div>
+                      </div>
+                    </div>
                   </div>
                   <div className="text-center">
                     <h1 className="text-2xl font-semibold tracking-tight">Tactical Media Broadcast Hub</h1>