Enhanced Sync Confirmation modal

chrome/browser/resources/sync_confirmation/sync_confirmation.css

 /* Copyright 2015 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file. */
 
 body {
   margin: 0;
   padding: 0;
 }
 
-a {
-  color: rgb(85, 149, 254);
-  text-decoration: none;
-}
-
 .picture img {
   border-radius: 50%;
   max-height: 100%;
   max-width: 100%;
 }
 
 .container {
   background-color: white;
+  color: #333;
   overflow: hidden;
   width: 448px;
 }
 
 .top-title-bar {
-  -webkit-padding-start: 24px;
   align-items: center;
   border-bottom: 1px solid lightgray;
-  color: #333;
   display: flex;
   font-size: 16px;
   height: 52px;
+  padding: 0 24px;
 }
 
 .details {
-  font-size: 13px;
-  padding: 20px 24px;
-}
-
-.sync-message {
-  color: #595959;
-  line-height: 150%;
-  padding-bottom: 32px;
+  padding: 0 24px;
 }
 
 #picture-container {
   align-items: center;
   display: flex;
   justify-content: center;
   padding-bottom: 32px;
+  padding-top: 24px;
 }
 
 .picture {
   -webkit-margin-start: 84px;
   height: 96px;
   position: relative;
   width: 96px;
 }
 
 #profile-picture,
 .checkmark-circle {
   position: absolute;
 }
 
+.message-container {
+  display: flex;
+  margin-bottom: 16px;
+}
+
+.message-container:last-child {
+  margin-bottom: 32px;
+}
+
+.message-container .logo {
+  -webkit-margin-end: 20px;
+  background-size: cover;
+  flex-shrink: 0;
+  height: 20px;
+  position: relative;
+  top: -2px;
+  width: 20px;
+}
+
+#chrome-logo {
+  background-image: url(../../../../ui/webui/resources/images/200-logo_chrome.png);
+}
+
+#googleg-logo {
+  background-image: url(../../../../ui/webui/resources/images/200-logo_googleg.png);
+}
+
+.message-container .title {
+  font-weight: 500;
+  margin-bottom: 4px;
+}
+
+.message-container .body {
+  color: #646464;
+}
+
+.message-container .text {
+  line-height: 20px;
+}
+
+.message-container #activityControlsCheckbox {
+  -webkit-margin-start: 40px;
+}
+
 .action-container {
-  align-items: baseline;
   display: flex;
   justify-content: flex-end;
+  padding: 16px;
 }
 
-paper-button {
+#confirmButton,
+#undoButton {
   font-weight: 500;
   line-height: 16px;
   margin: 0;
   padding: 8px 16px;
 }
 
-paper-button + paper-button {
-  -webkit-margin-start: 8px;
-}
-
 #confirmButton {
   background-color: rgb(66, 133, 244);
   color: white;
 }
 
 #undoButton {
+  -webkit-margin-start: 8px;
   color: #5A5A5A;
 }
 
 #illustration {
   height: 96px;
   margin: 0 auto;
   position: relative;
   width: 264px;
 }
 
@@ skipping 216 matching lines @@
 @keyframes fade-in-icon-bottom-right {
   from {
     opacity: 0;
     transform: translate(0, 0);
   }
   to {
     opacity: 0.1;
     transform: translate(4px, 4px);
   }
 }