Redesign login promo logo: pill brand mark instead of standalone image

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

static/styles.css

@@ -930,16 +930,39 @@ textarea:focus {
     max-width: 480px;
 }
 
-.login-promo__logo {
-    width: 160px;
-    height: 160px;
-    object-fit: contain;
-    border-radius: 24px;
+.login-brand {
+    display: inline-flex;
+    align-items: center;
+    gap: 12px;
+    background: rgba(255,255,255,0.12);
+    border: 1px solid rgba(255,255,255,0.2);
+    border-radius: 99px;
+    padding: 8px 20px 8px 8px;
+    margin-bottom: 36px;
+    backdrop-filter: blur(8px);
+}
+.login-brand__icon {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
     background: #fff;
-    padding: 16px;
-    box-shadow: 0 12px 40px rgba(0,0,0,0.35), 0 0 0 4px rgba(255,255,255,0.15);
-    margin-bottom: 32px;
-    display: block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
+    overflow: hidden;
+}
+.login-brand__icon img {
+    width: 32px;
+    height: 32px;
+    object-fit: contain;
+}
+.login-brand__name {
+    font-size: 16px;
+    font-weight: 700;
+    color: #fff;
+    letter-spacing: -0.2px;
 }
 
 .login-promo__title {