[Dialog] Make the dimmed background darker for dialogs

* Added `scrim` state color.
* Used it in dimmed pane.

Screenshot is in the last comment of b/403242786

Fixed: 403242786
Change-Id: I575e7aa2436b9dc2a9de4a533c9bfc97b50347ac
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6351920
Auto-Submit: Ergün Erdoğmuş <[email protected]>
Reviewed-by: Kim-Anh Tran <[email protected]>
Commit-Queue: Ergün Erdoğmuş <[email protected]>

Author: ergunsh

front_end/design_system_tokens.css

@@ -92,6 +92,7 @@
   --sys-color-state-on-header-hover: var(--ref-palette-primary20);
   --sys-color-state-text-highlight: var(--ref-palette-primary40);
   --sys-color-state-on-text-highlight: var(--ref-palette-neutral-variant100);
+  --sys-color-state-scrim: rgb(0 0 0 / 60%);
 
   /* Surfaces */
 

front_end/ui/legacy/glassPane.css

@@ -13,7 +13,7 @@
 }
 
 :host-context(.dimmed-pane) {
-  background-color: var(--color-background-opacity-50);
+  background-color: var(--sys-color-state-scrim);
 }
 
 :host-context(.no-pointer-events) {