@salutejs-ds/sdds_sbcom 0.1.13 → 0.1.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/css/sdds_sbcom.module.css +121 -105
  2. package/css/sdds_sbcom__dark.css +60 -52
  3. package/css/sdds_sbcom__light.css +61 -53
  4. package/es/index.js +1 -1
  5. package/es/theme/themes/sdds_sbcom__dark.js +1 -1
  6. package/es/theme/themes/sdds_sbcom__dark.js.map +1 -1
  7. package/es/theme/themes/sdds_sbcom__light.js +1 -1
  8. package/es/theme/themes/sdds_sbcom__light.js.map +1 -1
  9. package/es/theme/tokens/index.js +327 -303
  10. package/es/theme/tokens/index.js.map +1 -1
  11. package/index.js +8 -0
  12. package/index.js.map +1 -1
  13. package/package.json +1 -1
  14. package/theme/themes/sdds_sbcom__dark.js +1 -1
  15. package/theme/themes/sdds_sbcom__dark.js.map +1 -1
  16. package/theme/themes/sdds_sbcom__light.js +1 -1
  17. package/theme/themes/sdds_sbcom__light.js.map +1 -1
  18. package/theme/tokens/index.d.ts +284 -268
  19. package/theme/tokens/index.js +334 -302
  20. package/theme/tokens/index.js.map +1 -1
package/css/sdds_sbcom.module.css CHANGED
@@ -1,17 +1,14 @@
1
1
  /* Generated by robots, do not change this manually! */
2
2
 
3
3
  .dark {
4
- --on-dark-personas-green-text-accent: #6CD5BB;
5
- --surface-transparent-accent-minor-hover: #0BA88866;
6
4
  --on-light-outline-primary-hover: #ADA39FFF;
7
5
  --inverse-outline-default-active: #E6E6E6FF;
8
6
  --inverse-personas-sea-blue-text-accent-active: #4BB4B4FF;
9
7
  --inverse-personas-violet-text-accent-active: #81288FFF;
10
- --on-dark-surface-transparent-navi-active: #2424248A;
11
- --inverse-outline-primary-active: #C4BEBAFF;
12
8
  --on-light-outline-default-hover: #CCCCCCFF;
13
- --on-dark-outline-default-hover: #666666FF;
9
+ --inverse-outline-primary-active: #C4BEBAFF;
14
10
  --on-dark-outline-default-active: #292929FF;
11
+ --on-dark-outline-default-hover: #666666FF;
15
12
  --personas-green-text-accent-hover: #04C396FF;
16
13
  --personas-sea-blue-text-accent-hover: #00C5CCFF;
17
14
  --inverse-surface-accent-secondary-hover: #50C3A8FF;
@@ -22,35 +19,26 @@
22
19
  --outline-default-active: #666666FF;
23
20
  --on-dark-outline-primary-active: #2B2827FF;
24
21
  --personas-olive-text-accent-active: #7DC07CFF;
25
- --inverse-personas-ochre-text-accent-active: #AA4A0EFF;
26
22
  --on-dark-personas-olive-text-accent-hover: #A6D4A5FF;
27
- --inverse-surface-transparent-navi-active: #FFFFFFAD;
28
- --on-light-personas-olive-text-accent-active: #179315FF;
29
23
  --on-light-personas-violet-text-accent-active: #81288FFF;
30
24
  --on-light-personas-ochre-text-accent-active: #AA4A0EFF;
31
25
  --on-dark-surface-accent-secondary-hover: #70CDB7FF;
32
26
  --inverse-personas-green-text-accent-hover: #8CDECAFF;
33
27
  --on-light-personas-pink-text-accent-hover: #E47777FF;
34
28
  --surface-accent-secondary-hover: #70CDB7FF;
35
- --personas-pink-text-accent-active: #D83B3BFF;
36
29
  --personas-indigo-text-accent-hover: #E8DAFCFF;
37
30
  --on-dark-personas-violet-text-accent-hover: #E9B6F2FF;
38
31
  --on-light-outline-primary: #DDD9D7;
39
32
  --inverse-outline-default: #FFFFFF;
40
33
  --on-dark-personas-blue-text-accent-hover: #C3DDF9FF;
41
- --on-dark-personas-blue-text-accent-active: #5DA3EFFF;
42
34
  --on-light-personas-indigo-text-accent-hover: #000000FF;
43
35
  --on-light-personas-indigo-text-accent-active: #5B2999FF;
44
36
  --on-light-personas-sea-blue-text-accent-hover: #00D9E0FF;
45
- --on-light-personas-sea-blue-text-accent-active: #00B1B8FF;
46
- --on-light-outline-default: #FFFFFF;
47
37
  --personas-ochre-text-accent-active: #F19F7EFF;
48
- --on-dark-surface-transparent-accent-minor-hover: #0BA88866;
49
38
  --inverse-background-hardline: #000000;
50
39
  --on-dark-surface-transparent-accent-minor-active: #0BA88838;
51
40
  --on-dark-personas-sea-blue-text-accent-hover: #FFFFFFFF;
52
41
  --surface-transparent-navi: #23232399;
53
- --on-light-surface-accent-secondary: #41BDA1;
54
42
  --personas-violet-text-accent-active: #892B97FF;
55
43
  --personas-blue-text-accent-hover: #C3DDF9FF;
56
44
  --outline-default: #FFFFFF;
@@ -67,19 +55,18 @@
67
55
  --on-dark-surface-solid-card-brightness-active: #212121FF;
68
56
  --on-light-surface-solid-primary-brightness-hover: #FFFFFFFF;
69
57
  --on-light-surface-solid-primary-brightness-active: #FFFFFFFF;
70
- --outline-primary: #DDD9D7;
71
58
  --inverse-personas-indigo-text-accent: #BD91F5;
72
59
  --inverse-personas-pink-text-accent: #F7A4A4;
73
- --on-light-outline-positive-active: #20801EFF;
74
60
  --personas-olive-text-accent: #93CB92;
61
+ --on-light-outline-positive-active: #20801EFF;
75
62
  --inverse-personas-ochre-text-accent: #D15A11;
63
+ --on-dark-personas-olive-text-accent: #93CB92;
76
64
  --surface-solid-tertiary-active: #424242FF;
77
65
  --on-light-surface-solid-tertiary-active: #FFFFFFFF;
78
- --on-dark-personas-olive-text-accent: #93CB92;
66
+ --inverse-surface-transparent-navi: #FFFFFF99;
79
67
  --on-light-surface-transparent-card-brightness-hover: #FFFFFFFF;
80
68
  --text-primary: #FFFFFFFC;
81
69
  --on-dark-text-accent-minor-hover: #60C7AFFF;
82
- --inverse-surface-transparent-navi: #FFFFFF99;
83
70
  --on-light-personas-olive-text-accent: #127210;
84
71
  --on-light-surface-transparent-card-brightness-active: #FFFFFFFF;
85
72
  --on-dark-surface-accent-minor-active: #043F34FF;
@@ -88,12 +75,11 @@
88
75
  --inverse-surface-solid-primary-brightness-hover: #FFFFFFFF;
89
76
  --inverse-surface-solid-primary-brightness-active: #FFFFFFFF;
90
77
  --inverse-surface-transparent-card-brightness-hover: #FFFFFFFF;
91
- --on-light-personas-violet-text-accent: #9E32AF;
78
+ --outline-primary: #DDD9D7;
92
79
  --on-light-personas-ochre-text-accent: #D15A11;
93
80
  --on-dark-personas-indigo-text-accent: #BD91F5;
94
81
  --on-dark-surface-accent-secondary: #61C8B0;
95
82
  --inverse-personas-green-text-accent: #6CD5BB;
96
- --on-light-personas-pink-text-accent: #DE5555;
97
83
  --surface-accent-secondary: #61C8B0;
98
84
  --surface-accent-minor: #04473B;
99
85
  --on-dark-surface-solid-tertiary-active: #424242FF;
@@ -102,6 +88,7 @@
102
88
  --on-light-surface-accent-minor: #D0F2E9;
103
89
  --inverse-surface-transparent-card-brightness-active: #FFFFFFFF;
104
90
  --on-light-outline-warning-active: #A3420AFF;
91
+ --on-light-personas-violet-text-accent: #9E32AF;
105
92
  --inverse-surface-accent-minor: #D0F2E9;
106
93
  --inverse-surface-solid-card-brightness-active: #FFFFFFFF;
107
94
  --on-dark-surface-accent-minor-hover: #055C4CFF;
@@ -109,15 +96,11 @@
109
96
  --on-dark-personas-blue-text-accent: #79B3F2;
110
97
  --on-light-personas-indigo-text-accent: #7133BE;
111
98
  --on-light-personas-sea-blue-text-accent: #00898D;
112
- --inverse-personas-olive-text-accent: #127210;
113
99
  --personas-ochre-text-accent: #F4B49B;
114
100
  --on-dark-surface-transparent-accent-minor: #0BA68647;
115
101
  --on-dark-personas-violet-text-accent: #E19DED;
116
102
  --on-light-surface-transparent-navi: #FFFFFF99;
117
- --on-dark-personas-sea-blue-text-accent: #7BC8C8;
118
103
  --on-dark-personas-green-text-accent-hover: #84DCC6FF;
119
- --on-light-personas-blue-text-accent-active: #0D4F96FF;
120
- --on-light-outline-default-active: #E6E6E6FF;
121
104
  --personas-green-text-accent-active: #03A57FFF;
122
105
  --personas-sea-blue-text-accent-active: #00A8ADFF;
123
106
  --inverse-surface-accent-secondary-active: #3CAF94FF;
@@ -140,19 +123,15 @@
140
123
  --on-dark-personas-sea-blue-text-accent-active: #2D6C6CFF;
141
124
  --on-light-surface-transparent-accent-minor: #0BA6863D;
142
125
  --on-light-personas-green-text-accent: #038768;
143
- --text-primary-brightness-hover: #FAFAFA93;
144
- --on-dark-text-primary-brightness-hover: #FAFAFA93;
145
- --on-light-text-warning-active: #6F2D06FF;
146
126
  --on-light-outline-primary-active: #C4BEBAFF;
147
127
  --inverse-personas-blue-text-accent-active: #0D4F96FF;
148
128
  --inverse-surface-transparent-accent-minor-active: #0BA8885C;
149
- --inverse-personas-sea-blue-text-accent-hover: #000000FF;
150
- --inverse-personas-blue-text-accent-hover: #1477E1FF;
151
- --inverse-personas-violet-text-accent-hover: #B740C9FF;
152
- --inverse-surface-transparent-accent-minor-hover: #0BA88857;
153
- --on-light-personas-blue-text-accent-hover: #1477E1FF;
154
- --on-dark-surface-transparent-navi-hover: #242424B8;
155
- --on-light-surface-accent-secondary-hover: #50C3A8FF;
129
+ --text-primary-brightness-hover: #FAFAFA93;
130
+ --on-dark-text-primary-brightness-hover: #FAFAFA93;
131
+ --on-dark-personas-sea-blue-text-accent: #7BC8C8;
132
+ --on-light-personas-blue-text-accent-active: #0D4F96FF;
133
+ --on-light-outline-default-active: #E6E6E6FF;
134
+ --on-light-text-warning-active: #6F2D06FF;
156
135
  --surface-transparent-navi-hover: #242424B8;
157
136
  --on-light-surface-transparent-accent-minor-hover: #0BA8884D;
158
137
  --on-light-personas-green-text-accent-hover: #04D7A6FF;
@@ -176,21 +155,29 @@
176
155
  --inverse-outline-default-hover: #CCCCCCFF;
177
156
  --personas-violet-text-accent: #9E32AF;
178
157
  --inverse-outline-primary-hover: #ADA39FFF;
179
- --surface-accent-secondary-active: #59C5ACFF;
180
- --surface-transparent-accent-minor: #0BA68647;
181
- --inverse-personas-sea-blue-text-accent: #7BC8C8;
182
- --on-dark-personas-pink-text-accent: #F7A4A4;
158
+ --inverse-personas-sea-blue-text-accent-hover: #000000FF;
159
+ --inverse-personas-blue-text-accent-hover: #1477E1FF;
160
+ --inverse-personas-violet-text-accent-hover: #B740C9FF;
161
+ --inverse-surface-transparent-accent-minor-hover: #0BA88857;
162
+ --on-light-personas-blue-text-accent-hover: #1477E1FF;
163
+ --on-dark-surface-transparent-navi-hover: #242424B8;
164
+ --on-light-surface-accent-secondary-hover: #50C3A8FF;
165
+ --personas-blue-text-accent: #79B3F2;
166
+ --personas-sea-blue-text-accent: #00898D;
167
+ --personas-violet-text-accent-hover: #B438C7FF;
168
+ --background-hardline: #000000;
183
169
  --on-light-text-primary-brightness-hover: #17171793;
184
170
  --inverse-text-primary-brightness-hover: #17171793;
185
171
  --surface-solid-primary-brightness-active: #212121FF;
186
172
  --on-dark-surface-solid-primary-brightness-hover: #303030FF;
187
173
  --inverse-surface-solid-card-brightness-hover: #FFFFFFFF;
188
- --personas-pink-text-accent: #DE5555;
189
- --personas-blue-text-accent: #79B3F2;
190
- --personas-sea-blue-text-accent: #00898D;
191
- --personas-violet-text-accent-hover: #B438C7FF;
192
- --background-hardline: #000000;
193
174
  --inverse-personas-blue-text-accent: #1063BA;
175
+ --personas-blue-text-accent-active: #5DA3EFFF;
176
+ --surface-accent-secondary-active: #59C5ACFF;
177
+ --surface-transparent-accent-minor: #0BA68647;
178
+ --inverse-personas-sea-blue-text-accent: #7BC8C8;
179
+ --on-dark-personas-pink-text-accent: #F7A4A4;
180
+ --personas-pink-text-accent: #DE5555;
194
181
  --inverse-personas-violet-text-accent: #9E32AF;
195
182
  --inverse-surface-transparent-accent-minor: #0BA68647;
196
183
  --on-light-personas-blue-text-accent: #1063BA;
@@ -199,7 +186,6 @@
199
186
  --inverse-personas-olive-text-accent-active: #179315FF;
200
187
  --on-dark-outline-default: #383838;
201
188
  --personas-green-text-accent: #038768;
202
- --personas-blue-text-accent-active: #5DA3EFFF;
203
189
  --dark-background-hardline: #000000;
204
190
  --on-dark-outline-primary: #3B3735;
205
191
  --on-dark-text-primary-brightness-active: #FAFAFAC4;
@@ -209,6 +195,20 @@
209
195
  --on-dark-personas-ochre-text-accent-hover: #F7C8B6FF;
210
196
  --on-dark-personas-indigo-text-accent-active: #AA73F2FF;
211
197
  --personas-pink-text-accent-hover: #E26E6EFF;
198
+ --on-dark-personas-green-text-accent: #6CD5BB;
199
+ --surface-transparent-accent-minor-hover: #0BA88866;
200
+ --on-dark-surface-transparent-navi-active: #2424248A;
201
+ --inverse-personas-ochre-text-accent-active: #AA4A0EFF;
202
+ --inverse-surface-transparent-navi-active: #FFFFFFAD;
203
+ --on-light-personas-olive-text-accent-active: #179315FF;
204
+ --personas-pink-text-accent-active: #D83B3BFF;
205
+ --on-dark-personas-blue-text-accent-active: #5DA3EFFF;
206
+ --on-light-personas-sea-blue-text-accent-active: #00B1B8FF;
207
+ --on-light-outline-default: #FFFFFF;
208
+ --on-dark-surface-transparent-accent-minor-hover: #0BA88866;
209
+ --on-light-surface-accent-secondary: #41BDA1;
210
+ --on-light-personas-pink-text-accent: #DE5555;
211
+ --inverse-personas-olive-text-accent: #127210;
212
212
  --text-paragraph-active: #F5F1EF93;
213
213
  --text-accent: #61C8B0;
214
214
  --text-accent-hover: #77CFBBFF;
@@ -385,6 +385,7 @@
385
385
  --surface-warning: #F8AD80;
386
386
  --surface-warning-hover: #F9BB94FF;
387
387
  --surface-transparent-negative: #F8A6A980;
388
+ --surface-transparent-negative-hover: #F8A5A89E;
388
389
  --surface-read-only: #F9F9F905;
389
390
  --surface-read-only-hover: #FAFAFA0F;
390
391
  --surface-read-only-active: #FAFAFA00;
@@ -397,6 +398,7 @@
397
398
  --on-dark-surface-solid-secondary-active: #242424FF;
398
399
  --on-dark-surface-solid-tertiary: #474747;
399
400
  --on-dark-surface-solid-tertiary-hover: #525252FF;
401
+ --surface-transparent-negative-active: #F8A5A870;
400
402
  --on-dark-surface-transparent-secondary-active: #FFFFFF1A;
401
403
  --on-dark-surface-transparent-tertiary: #FFFFFF3D;
402
404
  --on-dark-surface-transparent-tertiary-hover: #FFFFFF5C;
@@ -453,7 +455,9 @@
453
455
  --on-light-surface-solid-secondary-active: #FFFFFFFF;
454
456
  --on-light-surface-solid-tertiary: #FFFFFF;
455
457
  --on-light-surface-solid-tertiary-hover: #FFFFFFFF;
458
+ --on-dark-surface-transparent-negative-active: #F8A5A870;
456
459
  --on-dark-surface-transparent-negative: #F8A6A980;
460
+ --on-dark-surface-transparent-negative-hover: #F8A5A89E;
457
461
  --on-light-surface-transparent-secondary-active: #15110F1F;
458
462
  --on-light-surface-transparent-tertiary: #15110F1F;
459
463
  --on-light-surface-transparent-tertiary-hover: #15110F2E;
@@ -499,6 +503,7 @@
499
503
  --on-light-surface-transparent-accent: #0BA6861F;
500
504
  --on-light-surface-transparent-accent-hover: #0BA8882E;
501
505
  --on-light-surface-transparent-negative: #E8343929;
506
+ --on-light-surface-transparent-negative-hover: #E9353B38;
502
507
  --on-light-surface-read-only: #F9F9F903;
503
508
  --on-light-surface-read-only-hover: #FAFAFA05;
504
509
  --on-light-surface-read-only-active: #FAFAFA08;
@@ -509,6 +514,7 @@
509
514
  --inverse-surface-solid-secondary: #FFFFFF;
510
515
  --inverse-surface-solid-secondary-hover: #FFFFFFFF;
511
516
  --inverse-surface-solid-secondary-active: #FFFFFFFF;
517
+ --on-light-surface-transparent-negative-active: #E9353B3D;
512
518
  --inverse-surface-transparent-secondary-hover: #15110F1A;
513
519
  --inverse-surface-transparent-secondary-active: #15110F1F;
514
520
  --inverse-surface-transparent-tertiary: #15110F1F;
@@ -556,6 +562,7 @@
556
562
  --inverse-surface-transparent-accent-hover: #0BA8882E;
557
563
  --inverse-surface-transparent-accent-active: #0BA88833;
558
564
  --inverse-surface-accent-active: #099579FF;
565
+ --inverse-surface-transparent-negative-active: #E9353B3D;
559
566
  --inverse-surface-transparent-negative: #E8343929;
560
567
  --inverse-surface-read-only: #F9F9F903;
561
568
  --inverse-surface-read-only-hover: #FAFAFA05;
@@ -567,6 +574,7 @@
567
574
  --dark-background-secondary: #0F0F0F;
568
575
  --dark-background-tertiary: #141413;
569
576
  --light-background-primary: #EBE7E5;
577
+ --inverse-surface-transparent-negative-hover: #E9353B38;
570
578
  --inverse-overlay-soft: #0000003D;
571
579
  --inverse-overlay-hard: #00000052;
572
580
  --outline-transparent-primary: #FFFFFF1F;
@@ -659,9 +667,7 @@
659
667
 
660
668
  .dark {
661
669
  --on-dark-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
662
- --on-dark-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
663
670
  --on-light-outline-white-gradient: linear-gradient(135.00deg, rgb(255, 255, 255) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.8) 100.0%);
664
- --inverse-surface-skeleton-gradient: linear-gradient(180deg, #080808 0.0%, #080808 10.0%, #080808 20.0%, #080808 25.0%, #080808 30.0%, #080808 40.0%, #080808 50.0%, #080808 60.0%, #080808 70.0%, #080808 75.0%, #080808 80.0%, #080808 90.0%, #080808 100.0%);
665
671
  --on-dark-personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(47, 130, 217) 0.0%, rgb(16, 99, 186) 100.0%);
666
672
  --inverse-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
667
673
  --outline-white-gradient: linear-gradient(135.00deg, rgb(255, 255, 255) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.8) 100.0%);
@@ -672,11 +678,11 @@
672
678
  --on-dark-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(229, 128, 66) 0.0%, rgb(199, 90, 23) 100.0%);
673
679
  --personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(153, 215, 217) 0.0%, rgb(116, 198, 200) 100.0%);
674
680
  --inverse-personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(222, 113, 113) 0.0%, rgb(208, 79, 79) 100.0%);
675
- --on-light-surface-skeleton-gradient: linear-gradient(180deg, #080808 0.0%, #080808 10.0%, #080808 20.0%, #080808 25.0%, #080808 30.0%, #080808 40.0%, #080808 50.0%, #080808 60.0%, #080808 70.0%, #080808 75.0%, #080808 80.0%, #080808 90.0%, #080808 100.0%);
681
+ --on-light-surface-skeleton-gradient: linear-gradient(90deg, #0808080F 0.0%, #0808080C 10.0%, #08080809 20.0%, #08080808 25.0%, #08080806 30.0%, #08080803 40.0%, #08080800 50.0%, #08080803 60.0%, #08080806 70.0%, #08080808 75.0%, #08080809 80.0%, #0808080C 90.0%, #0808080F 100.0%);
676
682
  --inverse-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(248, 165, 133) 0.0%, rgb(228, 118, 76) 100.0%);
677
683
  --dark-background-gradient: linear-gradient(135.00deg, rgb(2, 20, 9) 0.0%, rgb(20, 20, 19) 100.0%);
678
684
  --on-dark-personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(27, 173, 178) 0.0%, rgb(0, 137, 141) 100.0%);
679
- --on-dark-surface-skeleton-gradient: linear-gradient(0deg, #FFFFFF 0.0%, #FFFFFF 50.4%, #FFFFFF 100.0%, #FFFFFF 100.0%);
685
+ --on-dark-surface-skeleton-gradient: linear-gradient(90deg, #FFFFFF00 0.0%, #FFFFFF3D 50.4%, #FFFFFF00 100.0%, #FFFFFF00 100.0%);
680
686
  --inverse-background-gradient: linear-gradient(135.00deg, rgb(2, 20, 9) 0.0%, rgb(20, 20, 19) 100.0%);
681
687
  --inverse-overlay-gradient: linear-gradient(180.00deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
682
688
  --personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(222, 113, 113) 0.0%, rgb(208, 79, 79) 100.0%);
@@ -684,11 +690,12 @@
684
690
  --inverse-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
685
691
  --on-light-text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(179, 49, 208) 8.0%, rgb(109, 78, 223) 56.0%, rgb(31, 185, 224) 100.0%);
686
692
  --light-background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
687
- --surface-skeleton-gradient: linear-gradient(0deg, #FFFFFF 0.0%, #FFFFFF 50.4%, #FFFFFF 100.0%, #FFFFFF 100.0%);
693
+ --surface-skeleton-gradient: linear-gradient(90deg, #FFFFFF00 0.0%, #FFFFFF3D 50.4%, #FFFFFF00 100.0%, #FFFFFF00 100.0%);
688
694
  --overlay-gradient: linear-gradient(180.00deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
689
695
  --on-dark-overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
690
696
  --background-gradient: linear-gradient(135.00deg, rgb(2, 20, 9) 0.0%, rgb(20, 20, 19) 100.0%);
691
- --personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
697
+ --on-dark-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
698
+ --inverse-surface-skeleton-gradient: linear-gradient(90deg, #0808080F 0.0%, #0808080C 10.0%, #08080809 20.0%, #08080808 25.0%, #08080806 30.0%, #08080803 40.0%, #08080800 50.0%, #08080803 60.0%, #08080806 70.0%, #08080808 75.0%, #08080809 80.0%, #0808080C 90.0%, #0808080F 100.0%);
692
699
  --on-light-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(248, 165, 133) 0.0%, rgb(228, 118, 76) 100.0%);
693
700
  --surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
694
701
  --inverse-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(26, 158, 127) 0.0%, rgb(3, 135, 104) 100.0%);
@@ -707,35 +714,33 @@
707
714
  --on-dark-text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(202, 70, 227) 8.0%, rgb(169, 141, 245) 56.0%, rgb(54, 211, 245) 100.0%);
708
715
  --on-dark-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(26, 158, 127) 0.0%, rgb(3, 135, 104) 100.0%);
709
716
  --personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(147, 203, 146) 0.0%, rgb(115, 179, 114) 100.0%);
717
+ --personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
710
718
  --text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(202, 70, 227) 8.0%, rgb(169, 141, 245) 56.0%, rgb(54, 211, 245) 100.0%);
711
- --on-dark-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
712
719
  --on-dark-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
713
720
  --personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 179, 242) 0.0%, rgb(93, 153, 219) 100.0%);
714
721
  --inverse-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(225, 157, 237) 0.0%, rgb(198, 122, 212) 100.0%);
715
722
  --on-light-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
716
723
  --on-light-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 215, 192) 0.0%, rgb(80, 184, 159) 100.0%);
724
+ --on-dark-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
717
725
  --surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
718
726
  --surface-accent-minor-gradient: linear-gradient(135.00deg, rgb(3, 67, 37) 0.0%, rgba(1, 24, 21, 0.98) 100.0%);
719
727
  --on-dark-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
720
728
  --on-dark-surface-accent-minor-gradient: linear-gradient(135.00deg, rgb(3, 67, 37) 0.0%, rgba(1, 24, 21, 0.98) 100.0%);
721
- --on-light-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
729
+ --on-light-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
722
730
  --on-light-surface-accent-minor-gradient: linear-gradient(133.15deg, rgb(193, 234, 207) 0%, rgb(160, 222, 207) 100.0%);
723
731
  --inverse-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
724
732
  --inverse-surface-accent-minor-gradient: linear-gradient(133.15deg, rgb(193, 234, 207) 0%, rgb(160, 222, 207) 100.0%);
725
733
  }
726
734
 
727
735
  .light {
728
- --on-dark-personas-green-text-accent: #6CD5BB;
729
- --surface-transparent-accent-minor-hover: #0BA8884D;
730
736
  --on-light-outline-primary-hover: #ADA39FFF;
731
737
  --inverse-outline-default-active: #292929FF;
732
738
  --inverse-personas-sea-blue-text-accent-active: #00A8ADFF;
733
739
  --inverse-personas-violet-text-accent-active: #D982E8FF;
734
- --on-dark-surface-transparent-navi-active: #2424248A;
735
- --inverse-outline-primary-active: #2B2827FF;
736
740
  --on-light-outline-default-hover: #CCCCCCFF;
737
- --on-dark-outline-default-hover: #666666FF;
741
+ --inverse-outline-primary-active: #2B2827FF;
738
742
  --on-dark-outline-default-active: #292929FF;
743
+ --on-dark-outline-default-hover: #666666FF;
739
744
  --personas-green-text-accent-hover: #8CDECAFF;
740
745
  --personas-sea-blue-text-accent-hover: #000000FF;
741
746
  --inverse-surface-accent-secondary-hover: #70CDB7FF;
@@ -746,35 +751,26 @@
746
751
  --outline-default-active: #6B6B6BFF;
747
752
  --on-dark-outline-primary-active: #2B2827FF;
748
753
  --personas-olive-text-accent-active: #179315FF;
749
- --inverse-personas-ochre-text-accent-active: #F19F7EFF;
750
754
  --on-dark-personas-olive-text-accent-hover: #A6D4A5FF;
751
- --inverse-surface-transparent-navi-active: #2424248A;
752
- --on-light-personas-olive-text-accent-active: #179315FF;
753
755
  --on-light-personas-violet-text-accent-active: #81288FFF;
754
756
  --on-light-personas-ochre-text-accent-active: #AA4A0EFF;
755
757
  --on-dark-surface-accent-secondary-hover: #70CDB7FF;
756
758
  --inverse-personas-green-text-accent-hover: #04C396FF;
757
759
  --on-light-personas-pink-text-accent-hover: #E47777FF;
758
760
  --surface-accent-secondary-hover: #50C3A8FF;
759
- --personas-pink-text-accent-active: #F48080FF;
760
761
  --personas-indigo-text-accent-hover: #000000FF;
761
762
  --on-dark-personas-violet-text-accent-hover: #E9B6F2FF;
762
763
  --on-light-outline-primary: #DDD9D7;
763
764
  --inverse-outline-default: #383838;
764
765
  --on-dark-personas-blue-text-accent-hover: #C3DDF9FF;
765
- --on-dark-personas-blue-text-accent-active: #5DA3EFFF;
766
766
  --on-light-personas-indigo-text-accent-hover: #000000FF;
767
767
  --on-light-personas-indigo-text-accent-active: #5B2999FF;
768
768
  --on-light-personas-sea-blue-text-accent-hover: #00D9E0FF;
769
- --on-light-personas-sea-blue-text-accent-active: #00B1B8FF;
770
- --on-light-outline-default: #FFFFFF;
771
769
  --personas-ochre-text-accent-active: #AA4A0EFF;
772
- --on-dark-surface-transparent-accent-minor-hover: #0BA88866;
773
770
  --inverse-background-hardline: #FFFFFF;
774
771
  --on-dark-surface-transparent-accent-minor-active: #0BA88838;
775
772
  --on-dark-personas-sea-blue-text-accent-hover: #FFFFFFFF;
776
773
  --surface-transparent-navi: #FFFFFF99;
777
- --on-light-surface-accent-secondary: #41BDA1;
778
774
  --personas-violet-text-accent-active: #D679E6FF;
779
775
  --personas-blue-text-accent-hover: #1477E1FF;
780
776
  --outline-default: #383838;
@@ -791,19 +787,18 @@
791
787
  --on-dark-surface-solid-card-brightness-active: #212121FF;
792
788
  --on-light-surface-solid-primary-brightness-hover: #FFFFFFFF;
793
789
  --on-light-surface-solid-primary-brightness-active: #FFFFFFFF;
794
- --outline-primary: #3B3735;
795
790
  --inverse-personas-indigo-text-accent: #7133BE;
796
791
  --inverse-personas-pink-text-accent: #DE5555;
797
- --on-light-outline-positive-active: #20801EFF;
798
792
  --personas-olive-text-accent: #127210;
793
+ --on-light-outline-positive-active: #20801EFF;
799
794
  --inverse-personas-ochre-text-accent: #F4B49B;
795
+ --on-dark-personas-olive-text-accent: #93CB92;
800
796
  --surface-solid-tertiary-active: #FFFFFFFF;
801
797
  --on-light-surface-solid-tertiary-active: #FFFFFFFF;
802
- --on-dark-personas-olive-text-accent: #93CB92;
798
+ --inverse-surface-transparent-navi: #23232399;
803
799
  --on-light-surface-transparent-card-brightness-hover: #FFFFFFFF;
804
800
  --text-primary: #15110FFC;
805
801
  --on-dark-text-accent-minor-hover: #60C7AFFF;
806
- --inverse-surface-transparent-navi: #23232399;
807
802
  --on-light-personas-olive-text-accent: #127210;
808
803
  --on-light-surface-transparent-card-brightness-active: #FFFFFFFF;
809
804
  --on-dark-surface-accent-minor-active: #043F34FF;
@@ -812,12 +807,11 @@
812
807
  --inverse-surface-solid-primary-brightness-hover: #303030FF;
813
808
  --inverse-surface-solid-primary-brightness-active: #212121FF;
814
809
  --inverse-surface-transparent-card-brightness-hover: #FAFAFA1F;
815
- --on-light-personas-violet-text-accent: #9E32AF;
810
+ --outline-primary: #3B3735;
816
811
  --on-light-personas-ochre-text-accent: #D15A11;
817
812
  --on-dark-personas-indigo-text-accent: #BD91F5;
818
813
  --on-dark-surface-accent-secondary: #61C8B0;
819
814
  --inverse-personas-green-text-accent: #038768;
820
- --on-light-personas-pink-text-accent: #DE5555;
821
815
  --surface-accent-secondary: #41BDA1;
822
816
  --surface-accent-minor: #D0F2E9;
823
817
  --on-dark-surface-solid-tertiary-active: #424242FF;
@@ -826,6 +820,7 @@
826
820
  --on-light-surface-accent-minor: #D0F2E9;
827
821
  --inverse-surface-transparent-card-brightness-active: #FAFAFA0A;
828
822
  --on-light-outline-warning-active: #A3420AFF;
823
+ --on-light-personas-violet-text-accent: #9E32AF;
829
824
  --inverse-surface-accent-minor: #04473B;
830
825
  --inverse-surface-solid-card-brightness-active: #212121FF;
831
826
  --on-dark-surface-accent-minor-hover: #055C4CFF;
@@ -833,15 +828,11 @@
833
828
  --on-dark-personas-blue-text-accent: #79B3F2;
834
829
  --on-light-personas-indigo-text-accent: #7133BE;
835
830
  --on-light-personas-sea-blue-text-accent: #00898D;
836
- --inverse-personas-olive-text-accent: #93CB92;
837
831
  --personas-ochre-text-accent: #D15A11;
838
832
  --on-dark-surface-transparent-accent-minor: #0BA68647;
839
833
  --on-dark-personas-violet-text-accent: #E19DED;
840
834
  --on-light-surface-transparent-navi: #FFFFFF99;
841
- --on-dark-personas-sea-blue-text-accent: #7BC8C8;
842
835
  --on-dark-personas-green-text-accent-hover: #84DCC6FF;
843
- --on-light-personas-blue-text-accent-active: #0D4F96FF;
844
- --on-light-outline-default-active: #E6E6E6FF;
845
836
  --personas-green-text-accent-active: #4CCDACFF;
846
837
  --personas-sea-blue-text-accent-active: #4BB4B4FF;
847
838
  --inverse-surface-accent-secondary-active: #59C5ACFF;
@@ -864,19 +855,15 @@
864
855
  --on-dark-personas-sea-blue-text-accent-active: #2D6C6CFF;
865
856
  --on-light-surface-transparent-accent-minor: #0BA6863D;
866
857
  --on-light-personas-green-text-accent: #038768;
867
- --text-primary-brightness-hover: #17171793;
868
- --on-dark-text-primary-brightness-hover: #FAFAFA93;
869
- --on-light-text-warning-active: #6F2D06FF;
870
858
  --on-light-outline-primary-active: #C4BEBAFF;
871
859
  --inverse-personas-blue-text-accent-active: #5DA3EFFF;
872
860
  --inverse-surface-transparent-accent-minor-active: #0BA8882E;
873
- --inverse-personas-sea-blue-text-accent-hover: #00C5CCFF;
874
- --inverse-personas-blue-text-accent-hover: #C3DDF9FF;
875
- --inverse-personas-violet-text-accent-hover: #E9B6F2FF;
876
- --inverse-surface-transparent-accent-minor-hover: #0BA8885C;
877
- --on-light-personas-blue-text-accent-hover: #1477E1FF;
878
- --on-dark-surface-transparent-navi-hover: #242424B8;
879
- --on-light-surface-accent-secondary-hover: #50C3A8FF;
861
+ --text-primary-brightness-hover: #17171793;
862
+ --on-dark-text-primary-brightness-hover: #FAFAFA93;
863
+ --on-dark-personas-sea-blue-text-accent: #7BC8C8;
864
+ --on-light-personas-blue-text-accent-active: #0D4F96FF;
865
+ --on-light-outline-default-active: #E6E6E6FF;
866
+ --on-light-text-warning-active: #6F2D06FF;
880
867
  --surface-transparent-navi-hover: #FFFFFFA8;
881
868
  --on-light-surface-transparent-accent-minor-hover: #0BA8884D;
882
869
  --on-light-personas-green-text-accent-hover: #04D7A6FF;
@@ -900,21 +887,29 @@
900
887
  --inverse-outline-default-hover: #666666FF;
901
888
  --personas-violet-text-accent: #E19DED;
902
889
  --inverse-outline-primary-hover: #6B6461FF;
903
- --surface-accent-secondary-active: #3CAF94FF;
904
- --surface-transparent-accent-minor: #0BA6863D;
905
- --inverse-personas-sea-blue-text-accent: #00898D;
906
- --on-dark-personas-pink-text-accent: #F7A4A4;
890
+ --inverse-personas-sea-blue-text-accent-hover: #00C5CCFF;
891
+ --inverse-personas-blue-text-accent-hover: #C3DDF9FF;
892
+ --inverse-personas-violet-text-accent-hover: #E9B6F2FF;
893
+ --inverse-surface-transparent-accent-minor-hover: #0BA8885C;
894
+ --on-light-personas-blue-text-accent-hover: #1477E1FF;
895
+ --on-dark-surface-transparent-navi-hover: #242424B8;
896
+ --on-light-surface-accent-secondary-hover: #50C3A8FF;
897
+ --personas-blue-text-accent: #1063BA;
898
+ --personas-sea-blue-text-accent: #7BC8C8;
899
+ --personas-violet-text-accent-hover: #EBBEF3FF;
900
+ --background-hardline: #FFFFFF;
907
901
  --on-light-text-primary-brightness-hover: #17171793;
908
902
  --inverse-text-primary-brightness-hover: #FAFAFA93;
909
903
  --surface-solid-primary-brightness-active: #FFFFFFFF;
910
904
  --on-dark-surface-solid-primary-brightness-hover: #303030FF;
911
905
  --inverse-surface-solid-card-brightness-hover: #303030FF;
912
- --personas-pink-text-accent: #F7A4A4;
913
- --personas-blue-text-accent: #1063BA;
914
- --personas-sea-blue-text-accent: #7BC8C8;
915
- --personas-violet-text-accent-hover: #EBBEF3FF;
916
- --background-hardline: #FFFFFF;
917
906
  --inverse-personas-blue-text-accent: #79B3F2;
907
+ --personas-blue-text-accent-active: #0D4F96FF;
908
+ --surface-accent-secondary-active: #3CAF94FF;
909
+ --surface-transparent-accent-minor: #0BA6863D;
910
+ --inverse-personas-sea-blue-text-accent: #00898D;
911
+ --on-dark-personas-pink-text-accent: #F7A4A4;
912
+ --personas-pink-text-accent: #F7A4A4;
918
913
  --inverse-personas-violet-text-accent: #E19DED;
919
914
  --inverse-surface-transparent-accent-minor: #0BA6863D;
920
915
  --on-light-personas-blue-text-accent: #1063BA;
@@ -923,7 +918,6 @@
923
918
  --inverse-personas-olive-text-accent-active: #7DC07CFF;
924
919
  --on-dark-outline-default: #383838;
925
920
  --personas-green-text-accent: #6CD5BB;
926
- --personas-blue-text-accent-active: #0D4F96FF;
927
921
  --dark-background-hardline: #000000;
928
922
  --on-dark-outline-primary: #3B3735;
929
923
  --on-dark-text-primary-brightness-active: #FAFAFAC4;
@@ -933,6 +927,20 @@
933
927
  --on-dark-personas-ochre-text-accent-hover: #F7C8B6FF;
934
928
  --on-dark-personas-indigo-text-accent-active: #AA73F2FF;
935
929
  --personas-pink-text-accent-hover: #FBCBCBFF;
930
+ --on-dark-personas-green-text-accent: #6CD5BB;
931
+ --surface-transparent-accent-minor-hover: #0BA8884D;
932
+ --on-dark-surface-transparent-navi-active: #2424248A;
933
+ --inverse-personas-ochre-text-accent-active: #F19F7EFF;
934
+ --inverse-surface-transparent-navi-active: #2424248A;
935
+ --on-light-personas-olive-text-accent-active: #179315FF;
936
+ --personas-pink-text-accent-active: #F48080FF;
937
+ --on-dark-personas-blue-text-accent-active: #5DA3EFFF;
938
+ --on-light-personas-sea-blue-text-accent-active: #00B1B8FF;
939
+ --on-light-outline-default: #FFFFFF;
940
+ --on-dark-surface-transparent-accent-minor-hover: #0BA88866;
941
+ --on-light-surface-accent-secondary: #41BDA1;
942
+ --on-light-personas-pink-text-accent: #DE5555;
943
+ --inverse-personas-olive-text-accent: #93CB92;
936
944
  --text-paragraph-active: #15110F7A;
937
945
  --text-accent: #0A8E73;
938
946
  --text-accent-hover: #0DB593FF;
@@ -1109,6 +1117,7 @@
1109
1117
  --surface-warning: #BE4E0C;
1110
1118
  --surface-warning-hover: #D3560DFF;
1111
1119
  --surface-transparent-negative: #E8343929;
1120
+ --surface-transparent-negative-hover: #E9353B38;
1112
1121
  --surface-read-only: #F9F9F903;
1113
1122
  --surface-read-only-hover: #FAFAFA05;
1114
1123
  --surface-read-only-active: #FAFAFA08;
@@ -1121,6 +1130,7 @@
1121
1130
  --on-dark-surface-solid-secondary-active: #242424FF;
1122
1131
  --on-dark-surface-solid-tertiary: #474747;
1123
1132
  --on-dark-surface-solid-tertiary-hover: #525252FF;
1133
+ --surface-transparent-negative-active: #E9353B3D;
1124
1134
  --on-dark-surface-transparent-secondary-active: #FFFFFF1A;
1125
1135
  --on-dark-surface-transparent-tertiary: #FFFFFF3D;
1126
1136
  --on-dark-surface-transparent-tertiary-hover: #FFFFFF5C;
@@ -1177,7 +1187,9 @@
1177
1187
  --on-light-surface-solid-secondary-active: #FFFFFFFF;
1178
1188
  --on-light-surface-solid-tertiary: #FFFFFF;
1179
1189
  --on-light-surface-solid-tertiary-hover: #FFFFFFFF;
1190
+ --on-dark-surface-transparent-negative-active: #F8A5A870;
1180
1191
  --on-dark-surface-transparent-negative: #F8A6A980;
1192
+ --on-dark-surface-transparent-negative-hover: #F8A5A89E;
1181
1193
  --on-light-surface-transparent-secondary-active: #15110F1F;
1182
1194
  --on-light-surface-transparent-tertiary: #15110F1F;
1183
1195
  --on-light-surface-transparent-tertiary-hover: #15110F2E;
@@ -1223,6 +1235,7 @@
1223
1235
  --on-light-surface-transparent-accent: #0BA6861F;
1224
1236
  --on-light-surface-transparent-accent-hover: #0BA8882E;
1225
1237
  --on-light-surface-transparent-negative: #E8343929;
1238
+ --on-light-surface-transparent-negative-hover: #E9353B38;
1226
1239
  --on-light-surface-read-only: #F9F9F903;
1227
1240
  --on-light-surface-read-only-hover: #FAFAFA05;
1228
1241
  --on-light-surface-read-only-active: #FAFAFA08;
@@ -1233,6 +1246,7 @@
1233
1246
  --inverse-surface-solid-secondary: #292929;
1234
1247
  --inverse-surface-solid-secondary-hover: #333333FF;
1235
1248
  --inverse-surface-solid-secondary-active: #242424FF;
1249
+ --on-light-surface-transparent-negative-active: #E9353B3D;
1236
1250
  --inverse-surface-transparent-secondary-hover: #FFFFFF47;
1237
1251
  --inverse-surface-transparent-secondary-active: #FFFFFF1A;
1238
1252
  --inverse-surface-transparent-tertiary: #FFFFFF3D;
@@ -1280,6 +1294,7 @@
1280
1294
  --inverse-surface-transparent-accent-hover: #0BA88852;
1281
1295
  --inverse-surface-transparent-accent-active: #0BA88824;
1282
1296
  --inverse-surface-accent-active: #0A9E81FF;
1297
+ --inverse-surface-transparent-negative-active: #F8A5A870;
1283
1298
  --inverse-surface-transparent-negative: #F8A6A980;
1284
1299
  --inverse-surface-read-only: #F9F9F905;
1285
1300
  --inverse-surface-read-only-hover: #FAFAFA0F;
@@ -1291,6 +1306,7 @@
1291
1306
  --dark-background-secondary: #0F0F0F;
1292
1307
  --dark-background-tertiary: #141413;
1293
1308
  --light-background-primary: #EBE7E5;
1309
+ --inverse-surface-transparent-negative-hover: #F8A5A89E;
1294
1310
  --inverse-overlay-soft: #0000001F;
1295
1311
  --inverse-overlay-hard: #00000029;
1296
1312
  --outline-transparent-primary: #15110F3D;
@@ -1383,9 +1399,7 @@
1383
1399
 
1384
1400
  .light {
1385
1401
  --on-dark-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(135, 77, 207) 0.0%, rgb(113, 51, 190) 100.0%);
1386
- --on-dark-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
1387
1402
  --on-light-outline-white-gradient: linear-gradient(135.00deg, rgb(255, 255, 255) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.8) 100.0%);
1388
- --inverse-surface-skeleton-gradient: linear-gradient(0deg, #FFFFFF 0.0%, #FFFFFF 50.4%, #FFFFFF 100.0%, #FFFFFF 100.0%);
1389
1403
  --on-dark-personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(47, 130, 217) 0.0%, rgb(16, 99, 186) 100.0%);
1390
1404
  --inverse-personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(189, 145, 245) 0.0%, rgb(161, 117, 217) 100.0%);
1391
1405
  --outline-white-gradient: linear-gradient(135.00deg, rgba(255, 255, 255, 0.8) 0.0%, rgba(255, 255, 255, 0.16) 36.0%, rgba(255, 255, 255, 0.16) 66.0%, rgba(255, 255, 255, 0.6) 100.0%);
@@ -1396,11 +1410,11 @@
1396
1410
  --on-dark-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(229, 128, 66) 0.0%, rgb(199, 90, 23) 100.0%);
1397
1411
  --personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(27, 173, 178) 0.0%, rgb(0, 137, 141) 100.0%);
1398
1412
  --inverse-personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(252, 153, 153) 0.0%, rgb(223, 105, 105) 100.0%);
1399
- --on-light-surface-skeleton-gradient: linear-gradient(180deg, #080808 0.0%, #080808 10.0%, #080808 20.0%, #080808 25.0%, #080808 30.0%, #080808 40.0%, #080808 50.0%, #080808 60.0%, #080808 70.0%, #080808 75.0%, #080808 80.0%, #080808 90.0%, #080808 100.0%);
1413
+ --on-light-surface-skeleton-gradient: linear-gradient(90deg, #0808080F 0.0%, #0808080C 10.0%, #08080809 20.0%, #08080808 25.0%, #08080806 30.0%, #08080803 40.0%, #08080800 50.0%, #08080803 60.0%, #08080806 70.0%, #08080808 75.0%, #08080809 80.0%, #0808080C 90.0%, #0808080F 100.0%);
1400
1414
  --inverse-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(229, 128, 66) 0.0%, rgb(199, 90, 23) 100.0%);
1401
1415
  --dark-background-gradient: linear-gradient(135.00deg, rgb(2, 20, 9) 0.0%, rgb(20, 20, 19) 100.0%);
1402
1416
  --on-dark-personas-sea-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(27, 173, 178) 0.0%, rgb(0, 137, 141) 100.0%);
1403
- --on-dark-surface-skeleton-gradient: linear-gradient(0deg, #FFFFFF 0.0%, #FFFFFF 50.4%, #FFFFFF 100.0%, #FFFFFF 100.0%);
1417
+ --on-dark-surface-skeleton-gradient: linear-gradient(90deg, #FFFFFF00 0.0%, #FFFFFF3D 50.4%, #FFFFFF00 100.0%, #FFFFFF00 100.0%);
1404
1418
  --inverse-background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
1405
1419
  --inverse-overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
1406
1420
  --personas-pink-surface-accent-gradient: linear-gradient(180.00deg, rgb(252, 153, 153) 0.0%, rgb(223, 105, 105) 100.0%);
@@ -1408,11 +1422,12 @@
1408
1422
  --inverse-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
1409
1423
  --on-light-text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(179, 49, 208) 8.0%, rgb(109, 78, 223) 56.0%, rgb(31, 185, 224) 100.0%);
1410
1424
  --light-background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
1411
- --surface-skeleton-gradient: linear-gradient(180deg, #080808 0.0%, #080808 10.0%, #080808 20.0%, #080808 25.0%, #080808 30.0%, #080808 40.0%, #080808 50.0%, #080808 60.0%, #080808 70.0%, #080808 75.0%, #080808 80.0%, #080808 90.0%, #080808 100.0%);
1425
+ --surface-skeleton-gradient: linear-gradient(90deg, #0808080F 0.0%, #0808080C 10.0%, #08080809 20.0%, #08080808 25.0%, #08080806 30.0%, #08080803 40.0%, #08080800 50.0%, #08080803 60.0%, #08080806 70.0%, #08080808 75.0%, #08080809 80.0%, #0808080C 90.0%, #0808080F 100.0%);
1412
1426
  --overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
1413
1427
  --on-dark-overlay-gradient: linear-gradient(180deg, #000000 0.0%, #000000 100.0%);
1414
1428
  --background-gradient: linear-gradient(135.00deg, rgb(193, 234, 207) 0.0%, rgb(160, 222, 207) 100.0%);
1415
- --personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(189, 145, 245) 0.0%, rgb(161, 117, 217) 100.0%);
1429
+ --on-dark-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
1430
+ --inverse-surface-skeleton-gradient: linear-gradient(90deg, #FFFFFF00 0.0%, #FFFFFF3D 50.4%, #FFFFFF00 100.0%, #FFFFFF00 100.0%);
1416
1431
  --on-light-personas-ochre-surface-accent-gradient: linear-gradient(180.00deg, rgb(248, 165, 133) 0.0%, rgb(228, 118, 76) 100.0%);
1417
1432
  --surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
1418
1433
  --inverse-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 215, 192) 0.0%, rgb(80, 184, 159) 100.0%);
@@ -1431,18 +1446,19 @@
1431
1446
  --on-dark-text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(202, 70, 227) 8.0%, rgb(169, 141, 245) 56.0%, rgb(54, 211, 245) 100.0%);
1432
1447
  --on-dark-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(26, 158, 127) 0.0%, rgb(3, 135, 104) 100.0%);
1433
1448
  --personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
1449
+ --personas-indigo-surface-accent-gradient: linear-gradient(180.00deg, rgb(189, 145, 245) 0.0%, rgb(161, 117, 217) 100.0%);
1434
1450
  --text-accent-gradient-a-i: linear-gradient(135.00deg, rgb(179, 49, 208) 8.0%, rgb(109, 78, 223) 56.0%, rgb(31, 185, 224) 100.0%);
1435
- --on-dark-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
1436
1451
  --on-dark-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
1437
1452
  --personas-blue-surface-accent-gradient: linear-gradient(180.00deg, rgb(47, 130, 217) 0.0%, rgb(16, 99, 186) 100.0%);
1438
1453
  --inverse-personas-violet-surface-accent-gradient: linear-gradient(180.00deg, rgb(177, 76, 194) 0.0%, rgb(158, 50, 175) 100.0%);
1439
1454
  --on-light-surface-accent-gradient-secondary: linear-gradient(90.00deg, rgb(11, 166, 134) 0.0%, rgb(9, 133, 107) 100.0%);
1440
1455
  --on-light-personas-green-surface-accent-gradient: linear-gradient(180.00deg, rgb(121, 215, 192) 0.0%, rgb(80, 184, 159) 100.0%);
1441
- --surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
1456
+ --on-dark-personas-olive-surface-accent-gradient: linear-gradient(180.00deg, rgb(33, 150, 31) 0.0%, rgb(18, 114, 16) 100.0%);
1457
+ --surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
1442
1458
  --surface-accent-minor-gradient: linear-gradient(133.15deg, rgb(193, 234, 207) 0%, rgb(160, 222, 207) 100.0%);
1443
1459
  --on-dark-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
1444
1460
  --on-dark-surface-accent-minor-gradient: linear-gradient(135.00deg, rgb(3, 67, 37) 0.0%, rgba(1, 24, 21, 0.98) 100.0%);
1445
- --on-light-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
1461
+ --on-light-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
1446
1462
  --on-light-surface-accent-minor-gradient: linear-gradient(133.15deg, rgb(193, 234, 207) 0%, rgb(160, 222, 207) 100.0%);
1447
1463
  --inverse-surface-accent-gradient: linear-gradient(180.00deg, rgb(129, 211, 192) 0.0%, rgb(29, 145, 88) 100.0%);
1448
1464
  --inverse-surface-accent-minor-gradient: linear-gradient(135.00deg, rgb(3, 67, 37) 0.0%, rgba(1, 24, 21, 0.98) 100.0%);