Bug 1838939 - Part 6: Use design system typography in protection and panels r=desktop-theme-reviewers,reusable-components-reviewers,dao,hjones

Differential Revision: https://phabricator.services.mozilla.com/D186035

browser/components/protections/content/protections.css

@@ -65,12 +65,10 @@ body[focuseddatatype=cryptominer] {
 }
 
 h2 {
-  font-weight: 700;
+  font-weight: var(--font-weight-bold);
 }
 
 #report-title {
-  font-size: 20px;
-  font-weight: 300;
   margin-block-end: 20px;
 }
 

browser/themes/shared/customizableui/panelUI-shared.css

@@ -1550,8 +1550,6 @@ radiogroup:focus-visible > .subviewradio[focused="true"] > .radio-label-box {
 
 .panel-header > h1 {
   flex: auto;
-  font-size: inherit;
-  font-weight: 600;
   margin: 0;
 }
 

toolkit/themes/shared/design-system/tokens-brand.css

@@ -2,7 +2,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-@import url("chrome://global/skin/design-tokens-shared.css");
+@import url("chrome://global/skin/design-system/tokens-shared.css");
 
 :root,
 :host(.anonymous-content-host) {