Sharepoint - Adding CSS Reference on Site Page

Unfortunately, in Modern Experience, you can't customize the page to add JS or custom CSS!

Supported customizations for Modern Experience Page

• Custom branding like custom themes

Note: Custom Themes is the available method to customize the modern page themes otherwise you will need to switch to Classic Experience to can use custom CSS/JS and customize your page as you did.

• Adding "modern" pages programmatically
• Adding, deleting, updating client side web parts on "modern" pages

Unsupported customizations for Modern Experience Page

• Custom master pages
• More extensive branding will be supported later using alternative options
• Custom page templates (layout templates) and Alternative layouts
• Adding "classic" web parts on "modern" pages
• Custom CSS via AlternateCSSUrl web property
• Custom JavaScript embedded via User Custom Actions

For more details check

• Customizing "modern" site pages
• Add javascript code to Document Library default view

We can add JS & CSS to modern pages only through SharePoint Framework. You can develop an SPFx extension to add your custom CSS definitions to the page.

I believe this is still in Developer Preview. More details can be found here - https://dev.office.com/blogs/announcing-availability-of-sharepoint-framework-extensions-developer-preview