Devtools Animations: Represent delay and end-delay on the animation timeline

Source/devtools/front_end/elements/animationTimeline.css

 /*
  * Copyright (c) 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.
  */
 
 .animation-node-row {
     width: 100%;
     display: flex;
     border-bottom: 1px dashed #ccc;
@@ skipping 22 matching lines @@
 path.animation-keyframe {
     fill-opacity: 0.3;
 }
 
 line.animation-line {
     stroke-width: 3;
     stroke-linecap: round;
     fill: none;
 }
 
+line.animation-delay-line {
+    stroke-width: 2;
+    stroke-dasharray: 6, 4;
+}
+
 circle.animation-endpoint {
     stroke-width: 3;
 }
 
 circle.animation-keyframe-point {
     stroke-width: 3;
     fill: white;
 }
 
 .animation-name {
     position: absolute;
     top: 15px;
-    color: #777;
+    color: #333;
     text-align: center;
     margin-left: -8px;
 }
 
 .animation-timeline-header {
     height: 44px;
     border-bottom: 1px solid #ccc;
 }
 
 .animation-control-replay {
@@ skipping 124 matching lines @@
     background-color: #fff0f0;
 }
 
 svg.animation-ui g:first-child {
     opacity: 1;
 }
 
 .animation-tail-iterations {
     opacity: 0.5;
 }