Angular 13 Google Material Icons Self Hosted not Showing icons, But in development works fine

Question

I downloaded Google Material icons form repository then added css rule local development works fine, but production build don't work.

These are my configurations

// index.html

  <link as="font" rel="stylesheet" href="./assets/styles/icons.css" media="print" onload="this.media='all'" />
  <link rel="stylesheet" href="./assets/styles/fonts.css" media="print" onload="this.media='all'" />

// angular json

 "assets": [
              "src/favicon.ico",
              "src/assets"
            ],

// google icons css

@font-face {
    font-family: "Material Icons";
    font-style: normal;
    font-weight: 400;
    src: url('../icons/MaterialIcons-Regular.eot');
    src: local("Material Icons"), local("MaterialIcons-Regular"),
        url('../icons//MaterialIconsRound-Regular.otf') format("otf"),
        url('../icons/MaterialIconsOutlined-Regular.otf') format("otf"),
        url('../icons/MaterialIconsSharp-Regular.otf') format("otf"),
        url('../icons/MaterialIconsTwoTone-Regular.otf') format("otf"),
        url('../icons/MaterialIcons-Regular.ttf') format("truetype");
}

.material-icons {
    font-family: "Material Icons";
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;

    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;

    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;

    /* Support for IE. */
    font-feature-settings: "liga";
}

// nginx configurations

 location ~* .(js|css|ttf|ttc|otf|eot|woff|woff2)$ {
            add_header access-control-allow-origin "*";
            expires max;
    }

// mime.types

    application/x-font-ttf           ttc;
    application/x-font-otf           otf;
    application/font-woff2           woff2;
    font/ttf    

I use span to display icons locally works fine production don't work <span class="material-icons">sentiment_very_dissatisfied</span>