[signin] Polish style for signin interception bubble

Changes based on feedback from designer.

Screenshot light mode:
https://drive.google.com/file/d/1xddnpwCSkn5PtTcrUtwByiF_5gKOSbfj/view?usp=sharing

Screenshot dark mode:
https://drive.google.com/file/d/1Fjn5fGmpc48CYxtKwI6t0GOEmBqjUzQo/view?usp=sharing

Bug: 1076880
Change-Id: Ia16fd294ffba2c9bf2726d05433ebbb50a5fc328
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2324130Reviewed-by: Monica Basta <msalama@chromium.org>
Commit-Queue: David Roger <droger@chromium.org>
Cr-Commit-Position: refs/heads/master@{#793245}

chrome/browser/resources/signin/dice_web_signin_intercept/dice_web_signin_intercept_app.html

 <style include="signin-dialog-shared">
   :host {
-    color: var(--cr-primary-text-color);
     display: flex;
     flex-direction: column;
     height: 100%;
@@ -9,7 +8,7 @@
   #header {
     --avatar-position: 84px;
     border-radius: 8px;
-    margin: 8px;
+    margin: 8px 8px 16px;
     min-height: 128px;
     position: relative;
   }
@@ -27,6 +26,7 @@
 
   .avatar {
     --avatar-size: 60px;
+    border: 2px solid var(--md-background-color);
     border-radius: 50%;
     height: var(--avatar-size);
     position: absolute;
@@ -44,8 +44,7 @@
 
   #workBadge > iron-icon {
     --work-icon-size: 36px;
-    /** Use dark color for dark mode */
-    color: var(--md-background-color);
+    color: white;
     height: var(--work-icon-size);
     margin: auto;
     width: var(--work-icon-size);
@@ -58,6 +57,7 @@
   }
 
   #body {
+    color: var(--cr-secondary-text-color);
     flex-grow: 1;
     font-size: 13px;
     line-height: 20px;
@@ -65,6 +65,7 @@
   }
 
   #title {
+    color: var(--cr-primary-text-color);
     font-size: 15px;
     font-weight: 500;
     line-height: 22px;