fix(ui): Cyrillic/Greek weights, html lang, weight normalisation (#1780)

Load Roboto 600/700 and DM Sans 700 so Cyrillic and Greek headings render
real semibold and bold faces instead of a synthetic bold, keep
<html lang> in step with the UI language, and move every font weight onto
the 400/500/600/700 scale (JetBrains Mono at 500 or lighter; the dashboard
LIVE badge now uses the interface font at 700).

Add the `styles:font-weights:validate` ratchet guard and its CI step. It
reads stylesheets much as Sass and the browser do (cascade, layers,
mixins, content blocks, `@extend`, `@at-root`, `:is()`/`:where()`,
keyframes) and lists what it deliberately does not trace in its header.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

libs/ui/components/src/lib/channel-list-container/all-channels-view/all-channels-view.component.scss

@@ -131,7 +131,7 @@
 
 .no-results-title {
     font-size: 1.05rem;
-    font-weight: 520;
+    font-weight: 500;
     letter-spacing: -0.01em;
     margin-bottom: 8px;
 }

libs/ui/components/src/lib/channel-list-container/channel-details-dialog/channel-details-dialog.component.scss

@@ -69,7 +69,7 @@
     margin: 0;
     font-size: 1.3rem;
     line-height: 1.2;
-    font-weight: 650;
+    font-weight: 600;
     letter-spacing: -0.02em;
     color: var(--app-heading-color, var(--mat-sys-on-surface));
 }
@@ -169,7 +169,7 @@
 
 .channel-stat__value {
     font-size: 1.1rem;
-    font-weight: 650;
+    font-weight: 600;
     letter-spacing: -0.02em;
     color: var(--app-heading-color, var(--mat-sys-on-surface));
     overflow: hidden;
@@ -179,6 +179,8 @@
     &--mono {
         font-family: 'JetBrains Mono', 'Roboto Mono', monospace;
         font-size: 0.92rem;
+        // JetBrains Mono is bundled up to 500; the value's 600 would be faked.
+        font-weight: 500;
     }
 
     &--empty {

libs/ui/components/src/lib/channel-list-container/channel-list-container.component.scss

@@ -57,7 +57,7 @@
 
 .empty-source-state__title {
     font-size: 1.05rem;
-    font-weight: 520;
+    font-weight: 500;
     margin: 0;
     letter-spacing: -0.01em;
 }

libs/ui/components/src/lib/channel-list-container/favorites-view/favorites-view.component.scss

@@ -32,7 +32,7 @@
 .empty-favorites {
     margin-top: 40px;
     font-size: 1.05rem;
-    font-weight: 520;
+    font-weight: 500;
     letter-spacing: -0.01em;
 }
 

libs/ui/components/src/lib/channel-list-container/groups-view/groups-view.component.scss

@@ -220,7 +220,7 @@
 
     &__title {
         font-size: 0.85rem;
-        font-weight: 520;
+        font-weight: 500;
         letter-spacing: -0.01em;
         margin-bottom: 4px;
         text-wrap: balance;
@@ -310,7 +310,7 @@
 
 .empty-state-title {
     font-size: 1.05rem;
-    font-weight: 520;
+    font-weight: 500;
     letter-spacing: -0.01em;
     margin-bottom: 8px;
 }

libs/ui/components/src/lib/channel-list-container/recent-view/recent-view.component.scss

@@ -32,7 +32,7 @@
 .empty-recent {
     margin-top: 40px;
     font-size: 1.05rem;
-    font-weight: 520;
+    font-weight: 500;
     letter-spacing: -0.01em;
 }
 

libs/ui/components/src/lib/vod-sources/vod-sources-menu.component.scss

@@ -41,7 +41,7 @@ $font-mono: var(--font-mono, ui-monospace, 'SF Mono', Menlo, monospace);
     // size as the hint and the action beside it, so all three scanned as
     // column headers over the list.
     font-size: 15px;
-    font-weight: 650;
+    font-weight: 600;
     letter-spacing: -0.01em;
     color: var(--app-on-surface);
     overflow: hidden;