New blazor dev here ✌️

I am trying to build a simple profile page on the root of my domain. Something similar to instagram.com/nike but mydomain.com/nike

I have a default blazor project after running dotnet new blazor with small modifications. I removed default counter and home pages and removed navbar item. Only have few files.

The Index.razor

@page "/{Username}"

<section>
    <div>
        <h1>@Username</h1>
    </div>
</section>

@code {
    [Parameter]
    public string? Username { get; set; }
}

The Index.razor.css

h1 {
    color: red;
}

My problem is that when I have this setup, the css in the whole project breaks…

If I change my path to something like

@page "user/{Username}"

Everything works perfectly. So I guess it’s something with project not being able to build properly. Any ideas?

Project setup:

Console errors: