Use CSS variables instead of hardcoded color values

[epuzanov]

This PR make use of CSS variables instead of hard-coded color values to simplify UI color schema customizations.

[iaromoskviak]

Two issues in found:

1. Four variable names are declared twice with different values — --accent-earth, --accent-deep-warm, --accent-positive, --accent-attention — because the rename collapsed two previously-distinct legacy variables onto each of these names. Since the later declaration wins for every consumer, this silently changes colors across dozens of components (e.g. --accent-attention goes from orange to rgb(231, 197, 2), --accent-positive from green to rgb(9, 121, 33)). Please give these their own names so both original values survive.
2. --spinner-stroke-color changed value from #3fb53f (green) to #4793d1 (brand blue) — not just a rename. Looks intentional based on the comment in loading.component.scss, but since this PR is scoped as "replace hardcoded colors with variables," please call this value change out explicitly in the PR description so it doesn't get missed in review.

[iaromoskviak]

rgba(var(--feedback-neutral-text), 0.87) is invalid because --feedback-neutral-text is defined as black, not RGB channel values. This should either stay as rgba(black, 0.87) or use a separate RGB-channel variable such as --feedback-neutral-text-rgb: 0, 0, 0.

[iaromoskviak]

This re-enables previously commented progress bar/spinner positioning rules and removes the previous :host scoping. Because the selectors use ::ng-deep without a host/app-loading scope, this can affect Material progress bars and spinners outside this component. That is a functional/layout behavior change, not just a color-variable refactor. Please scope these rules back to the loading component.