update

internal/app/static/app.css

@@ -41,15 +41,17 @@ button:disabled { cursor: wait; opacity: .58; }
   backdrop-filter: blur(18px);
 }
 
-.wordmark {
-  margin-right: 12px;
-  color: var(--accent);
-  font-weight: 900;
-  letter-spacing: .14em;
+.operator { color: var(--muted); }
+.brand { display: flex; align-items: center; color: var(--accent); text-decoration: none; white-space: nowrap; }
+.brand-logo {
+  display: flex;
+  align-items: center;
+  padding: 6px 10px;
+  border-radius: 9px;
+  background: #f4f7f5;
 }
-
-.product-name, .operator { color: var(--muted); }
-.brand { white-space: nowrap; }
+.brand-logo img { display: block; width: 154px; height: auto; }
+.brand-fallback { display: none; font-weight: 900; letter-spacing: .14em; }
 .portal-nav { display: flex; align-self: stretch; gap: 6px; }
 .portal-nav a {
   display: flex;
@@ -271,14 +273,21 @@ dd { margin: 4px 0 0; overflow-wrap: anywhere; }
   background: linear-gradient(145deg, rgba(23, 38, 36, .96), rgba(10, 20, 19, .98));
   box-shadow: var(--shadow);
 }
-.brand-mark { margin-bottom: 42px; color: var(--accent); font-size: 1.1rem; font-weight: 950; letter-spacing: .18em; }
+.login-logo {
+  display: inline-flex;
+  margin-bottom: 42px;
+  padding: 12px 15px;
+  border-radius: 13px;
+  background: #f4f7f5;
+}
+.login-logo img { display: block; width: min(310px, 65vw); height: auto; }
 .login-card h1 { font-size: clamp(2.8rem, 10vw, 4.8rem); }
 .lede { margin-bottom: 32px; color: var(--muted); line-height: 1.7; }
 .fine-print { margin: 22px 0 0; font-size: .76rem; text-align: center; }
 
 @media (max-width: 900px) {
   .topbar { padding: 0 3vw; }
-  .product-name { display: none; }
+  .brand-logo img { width: 132px; }
   .hero, .content-grid, .package-layout { grid-template-columns: 1fr; }
   .audit-filters { grid-template-columns: 1fr 1fr; }
   .audit-row { grid-template-columns: 1fr 1fr; }
@@ -289,7 +298,8 @@ dd { margin: 4px 0 0; overflow-wrap: anywhere; }
 
 @media (max-width: 580px) {
   .topbar { min-height: 62px; padding: 0 3vw; }
-  .wordmark { margin-right: 0; }
+  .brand-logo { display: none; }
+  .brand-fallback { display: inline; }
   .operator > span { display: none; }
   .operator { gap: 0; }
   .portal-nav { gap: 0; }