Replace the Muli font with Poppins

[petemill]

We have decided to stop using Muli, which we mainly used for body content. Uses should be replaced with Poppins. When replacing, we generally have to dial down the font-weight a little (e.g. from 600 to 500).

This requires changes in brave-core and brave-ui (where there are theme variables and shared styles from components).

Places:

• Welcome
• Rewards (page, not panel)
• NTP widgets

Test Plan

• Open brave://welcome
• Verify that the font being used is Poppins not Muli, via referencing the below screenshots
• Turn on and open brave://rewards. Verify the font (for the "left" column) is correct as per the below screenshots
• Open NTP and switch to Brave Talk widget. Verify screenshots...

Screenshots (old on right, new on left)

Notes

If you really want to verify which font is being used, you can inspect the element, switch to the "computed" tab and scroll right to the bottom. DevTools will report which font is being used to actually render.

[LaurenWags]

@brave/qa-team spot check sections listed in #25527 (comment).

@rebron could someone from design team give this a more thorough check with a trained eye?

[MadhaviSeelam]

Verification PASSED using

Brave | 1.46.56 Chromium: 106.0.5249.119 (Official Build) nightly (64-bit)
-- | --
Revision | 9f2101830b56fd2ea1408287f6c74e253ebcb7c6-refs/branch-heads/5249@{#797}
OS | Windows 11 Version 21H2 (Build 22000.1098)

1. Install 1.46.56
2. Launch Brave

Welcome page

• right click on any element in the page
• select Inspect
• click Computed tab in Developer tools
• scroll down to view the rendered fonts for the page.

Confirmed Poppins font rendered

Muli	Poppins

Brave Talk

• open NTP
• click on Brave Talk to switch to the widget
• right click on any element in the page
• select Inspect
• click Computed tab in the `Developer tools``
• scroll down to view the rendered fonts for the page.

Confirmed Poppins font rendered

Muli	Poppins

Rewards settings page

• enable rewards
• open brave://rewards
• right click on any element in the page
• select Inspect
• click Computed tab in Developer tools
• scroll down to view the rendered fonts for the page.

Confirmed Poppins font rendered

Muli	Poppins

[stephendonner]

Verified PASSED using

Brave	1.46.76 Chromium: 107.0.5304.62 (Official Build) beta (x86_64)
Revision	1eec40d3a5764881c92085aaee66d25075c159aa-refs/branch-heads/5304@{#942}
OS	macOS Version 11.7 (Build 20G817)

Welcome page

1. right click on any element in the page
2. select Inspect
3. click Computed tab in Developer tools
4. scroll down to view the rendered fonts for the page

Confirmed Poppins font rendered

Brave Talk

1. open NTP
2. click on Brave Talk to switch to the widget
3. right click on any element in the page
4. select Inspect
5. click Computed tab in Developer tools
6. scroll down to view the rendered fonts for the page

Confirmed Poppins font rendered

Rewards Settings page

1. enable Rewards
2. open brave://rewards
3. right-click on any element in the page
4. select Inspect
5. click Computed tab in Developer tools
6. scroll down to view the rendered fonts for the page

Confirmed Poppins font rendered

[LaurenWags]

Verified with

Brave	1.46.106 Chromium: 107.0.5304.110 (Official Build) beta (64-bit) 
Revision	2a558545ab7e6fb8177002bf44d4fc1717cb2998-refs/branch-heads/5304@{#1202}
OS	Linux

Welcome page - PASSED

1. right click on any element in the page
2. select Inspect
3. click Computed tab in Developer tools
4. scroll down to view the rendered fonts for the page

Confirmed Poppins font rendered

Brave Talk Widget - PASSED

1. open NTP
2. click on Brave Talk to switch to the widget
3. right click on any element in the Brave Talk widget
4. select Inspect
5. click Computed tab in Developer tools
6. scroll down to view the rendered fonts for the page

Confirmed Poppins font rendered

Rewards Settings page - PASSED

1. enable Rewards
2. open brave://rewards
3. right-click on any element in the page
4. select Inspect
5. click Computed tab in Developer tools
6. scroll down to view the rendered fonts for the page

Confirmed Poppins font rendered

[aguscruiz]

Adding a few places where Poppins is not loading and it should, so far everything I found is on the NTP

Brave news:

[LaurenWags]

@aguscruiz if the places mentioned in #25527 (comment) need to be addressed, please open a new issue for it, thanks!

[stephendonner]

@aguscruiz if the places mentioned in #25527 (comment) need to be addressed, please open a new issue for it, thanks!

Yes, please; helps us keep scope down considerably <3

[aguscruiz]

No problem! Will do, here is the new issue #27081