Inbuilt CSS not reflecting

[DATTATREYA MAHENDRAKAR]

I'm importing paper-toolbar component.

Only texts are visible but CSS are not reflecting.

Can anyone please help?

please check the code...

<link rel="import" href="../../polymer/polymer-element.html">

<link rel="import" href="../../app-layout/app-layout.html">

<script src="../../webcomponentsjs/webcomponents-lite.js"></script>

<dom-module id="nav-bar">

  <template>

    <style>

    html, body {

        margin: 0;

        font-family: 'Roboto', 'Noto', sans-serif;

        -webkit-font-smoothing: antialiased;

        background: #f1f1f1;

        max-height: 368px;

      }

      app-toolbar {

        background-color: #4285f4;

        color: #fff;

      }

      paper-icon-button {

        --paper-icon-button-ink-color: white;

      }

      paper-icon-button + [main-title] {

        margin-left: 24px;

      }

      paper-progress {

        display: block;

        width: 100%;

        --paper-progress-active-color: rgba(255, 255, 255, 0.5);

        --paper-progress-container-color: transparent;

      }

      app-header {

        @apply --layout-fixed-top;

        color: #fff;

        --app-header-background-rear-layer: {

          background-color: #ef6c00;

        };

      }

      app-drawer {

        --app-drawer-scrim-background: rgba(0, 0, 100, 0.8);

        --app-drawer-content-container: {

          background-color: #B0BEC5;

        }

      }

      sample-content {

        padding-top: 64px;

      }

    </style> 

    <paper-toolbar>

      <paper-icon-button slot="top" icon="menu"></paper-icon-button>

      <span slot="top" class="title">Title</span>

      <paper-icon-button slot="top" icon="refresh"></paper-icon-button>

      <paper-icon-button slot="top" icon="add">+</paper-icon-button>

    </paper-toolbar>

  </template>

  <script>

    class NavBar extends Polymer.Element {

      static get is() {

        return 'nav-bar';

      }

      constructor() {

        super();

      }

    }

    customElements.define(NavBar.is, NavBar);

  </script>

</dom-module>