@liner-fe/design-token 2.3.25 → 2.3.27

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 (8) hide show
  1. package/lib/generated/vars.d.ts +10 -7
  2. package/lib/index.css +84 -74
  3. package/lib/index.css.map +2 -2
  4. package/lib/index.js +1 -1
  5. package/lib/index.js.map +2 -2
  6. package/package.json +1 -1
  7. package/src/generated/vars.ts +1 -1
  8. package/src/style/global.css +84 -74
package/lib/generated/vars.d.ts CHANGED
@@ -30,6 +30,7 @@ export declare const vars: {
30
30
  "neutral-border-overlay-strong": string;
31
31
  "neutral-border-overlay-normal": string;
32
32
  "neutral-border-overlay-subtle": string;
33
+ "neutral-border-overlay-hint": string;
33
34
  "neutral-border-opaque-strong": string;
34
35
  "neutral-border-opaque-normal": string;
35
36
  "neutral-border-opaque-subtle": string;
@@ -55,22 +56,23 @@ export declare const vars: {
55
56
  "inverse-border-overlay-strong": string;
56
57
  "inverse-border-overlay-normal": string;
57
58
  "inverse-border-overlay-subtle": string;
59
+ "inverse-border-overlay-hint": string;
58
60
  "inverse-border-opaque-strong": string;
59
61
  "inverse-border-opaque-normal": string;
60
62
  "inverse-border-opaque-subtle": string;
61
63
  "brand-container-mid": string;
62
64
  "brand-container-mid-hover": string;
63
- "brand-container-high": string;
65
+ "brand-fill-mid": string;
66
+ "brand-fill-mid-hover": string;
67
+ "brand-fill-low": string;
68
+ "brand-fill-low-hover": string;
64
69
  "brand-label-primary": string;
65
70
  "brand-label-secondary": string;
71
+ "brand-label-variation-secondary": string;
66
72
  "brand-border-opaque-normal": string;
67
- "brand-border-overlay-normal": string;
73
+ "brand-border-opaque-strong": string;
68
74
  "brandinverse-label-primary": string;
69
- "accent-yellow": string;
70
- "accent-mint": string;
71
- "accent-cyan": string;
72
- "accent-purple": string;
73
- "accent-pink": string;
75
+ "brandinverse-label-secondary": string;
74
76
  "function-container-positive": string;
75
77
  "function-container-negative": string;
76
78
  "function-container-negative-hover": string;
@@ -81,6 +83,7 @@ export declare const vars: {
81
83
  "function-label-positive": string;
82
84
  "function-label-negative": string;
83
85
  "function-label-caution": string;
86
+ "function-label-link": string;
84
87
  "cover-dim-page": string;
85
88
  };
86
89
  radius: {
package/lib/index.css CHANGED
@@ -4,38 +4,32 @@
4
4
  --lp-pri-achromatic-black: #000000;
5
5
  --lp-pri-gray-cool-980: #F9F9FA;
6
6
  --lp-pri-gray-cool-970: #F6F6F7;
7
+ --lp-pri-gray-cool-950: #F1F1F2;
7
8
  --lp-pri-gray-cool-940: #EDEEF0;
8
9
  --lp-pri-gray-cool-920: #E9E9EB;
9
10
  --lp-pri-gray-cool-900: #E3E3E6;
10
11
  --lp-pri-gray-cool-850: #D7D7D9;
11
- --lp-pri-gray-cool-750: #BEBFC2;
12
- --lp-pri-gray-cool-600: #939499;
13
- --lp-pri-gray-cool-450: #6D6D70;
14
12
  --lp-pri-gray-cool-350: #58595C;
15
13
  --lp-pri-gray-cool-300: #4A4A4D;
14
+ --lp-pri-gray-cool-270: #39393B;
16
15
  --lp-pri-gray-cool-250: #313133;
17
16
  --lp-pri-gray-cool-200: #272729;
17
+ --lp-pri-gray-cool-120: #252526;
18
18
  --lp-pri-gray-cool-100: #1E1E1F;
19
- --lp-pri-brand-original-950: #FAFBFF;
20
- --lp-pri-brand-original-900: #F4F5FF;
21
- --lp-pri-brand-original-800: #D9DEFF;
22
- --lp-pri-brand-original-700: #B7C1FF;
23
- --lp-pri-brand-original-600: #6B7FFF;
24
- --lp-pri-brand-original-500: #4058FF;
25
- --lp-pri-brand-original-400: #273FD9;
26
- --lp-pri-brand-original-200: #152AB3;
27
- --lp-pri-brand-original-100: #071780;
28
- --lp-pri-brand-original-50: #041166;
29
- --lp-pri-brand-variation-950: #FAFBFF;
30
- --lp-pri-brand-variation-900: #F4F7FF;
31
- --lp-pri-brand-variation-800: #D9E4FF;
32
- --lp-pri-brand-variation-700: #B7CDFF;
33
- --lp-pri-brand-variation-600: #759EFF;
34
- --lp-pri-brand-variation-500: #5487FF;
35
- --lp-pri-brand-variation-400: #4E70BF;
36
- --lp-pri-brand-variation-200: #4A6299;
37
- --lp-pri-brand-variation-100: #384666;
38
- --lp-pri-brand-variation-50: #2C364D;
19
+ --lp-pri-brand-original-990: #F6FFF1;
20
+ --lp-pri-brand-original-980: #EBFFE7;
21
+ --lp-pri-brand-original-500: #0C893B;
22
+ --lp-pri-brand-original-380: #006829;
23
+ --lp-pri-brand-original-200: #14371B;
24
+ --lp-pri-brand-original-150: #14371B;
25
+ --lp-pri-brand-original-50: #002109;
26
+ --lp-pri-brand-variation-950: #C3FFD0;
27
+ --lp-pri-brand-variation-900: #96F7B3;
28
+ --lp-pri-brand-variation-380: #236638;
29
+ --lp-pri-brand-variation-350: #1A5E31;
30
+ --lp-pri-brand-variation-250: #00461F;
31
+ --lp-pri-brand-variation-150: #0E2B1A;
32
+ --lp-pri-brand-variation-100: #032110;
39
33
  --lp-pri-rainbow-red-950: #FFF5F5;
40
34
  --lp-pri-rainbow-red-900: #FFE7E7;
41
35
  --lp-pri-rainbow-red-800: #FFC3C3;
@@ -46,16 +40,16 @@
46
40
  --lp-pri-rainbow-red-300: #B81616;
47
41
  --lp-pri-rainbow-red-200: #710808;
48
42
  --lp-pri-rainbow-red-100: #410404;
49
- --lp-pri-rainbow-orange-950: #FFFBF4;
50
- --lp-pri-rainbow-orange-900: #FFF4E3;
51
- --lp-pri-rainbow-orange-800: #FFE1B4;
52
- --lp-pri-rainbow-orange-700: #FFC875;
53
- --lp-pri-rainbow-orange-600: #FFB039;
54
- --lp-pri-rainbow-orange-500: #FF9900;
55
- --lp-pri-rainbow-orange-400: #DB8503;
56
- --lp-pri-rainbow-orange-300: #B87005;
57
- --lp-pri-rainbow-orange-200: #714605;
58
- --lp-pri-rainbow-orange-100: #412803;
43
+ --lp-pri-rainbow-orange-970: #FFF4EF;
44
+ --lp-pri-rainbow-orange-940: #FFEADC;
45
+ --lp-pri-rainbow-orange-900: #FFDCC2;
46
+ --lp-pri-rainbow-orange-800: #FFB77C;
47
+ --lp-pri-rainbow-orange-730: #FF9B3E;
48
+ --lp-pri-rainbow-orange-700: #FE8F16;
49
+ --lp-pri-rainbow-orange-600: #DA7700;
50
+ --lp-pri-rainbow-orange-500: #B46200;
51
+ --lp-pri-rainbow-orange-400: #904D00;
52
+ --lp-pri-rainbow-orange-300: #6D3900;
59
53
  --lp-pri-rainbow-yellow-950: #FFFDF4;
60
54
  --lp-pri-rainbow-yellow-900: #FFF9E3;
61
55
  --lp-pri-rainbow-yellow-800: #FFF0B4;
@@ -66,6 +60,16 @@
66
60
  --lp-pri-rainbow-yellow-300: #B89405;
67
61
  --lp-pri-rainbow-yellow-200: #715B05;
68
62
  --lp-pri-rainbow-yellow-100: #413503;
63
+ --lp-pri-rainbow-lime_green-970: #EAFFB6;
64
+ --lp-pri-rainbow-lime_green-940: #CEFF56;
65
+ --lp-pri-rainbow-lime_green-900: #BFF434;
66
+ --lp-pri-rainbow-lime_green-800: #A4D706;
67
+ --lp-pri-rainbow-lime_green-730: #94C300;
68
+ --lp-pri-rainbow-lime_green-700: #8DBA00;
69
+ --lp-pri-rainbow-lime_green-600: #779D00;
70
+ --lp-pri-rainbow-lime_green-500: #628200;
71
+ --lp-pri-rainbow-lime_green-400: #4D6700;
72
+ --lp-pri-rainbow-lime_green-300: #394D00;
69
73
  --lp-pri-rainbow-green-950: #F5FEF7;
70
74
  --lp-pri-rainbow-green-900: #E6FCEA;
71
75
  --lp-pri-rainbow-green-800: #BFF5C8;
@@ -703,17 +707,17 @@
703
707
  --neutral-container-low: var(--lp-pri-gray-cool-200);
704
708
  --neutral-container-low-hover: var(--lp-pri-gray-cool-250);
705
709
  --neutral-container-mid: var(--lp-pri-gray-cool-250);
706
- --neutral-container-mid-hover: var(--lp-pri-gray-cool-300);
710
+ --neutral-container-mid-hover: var(--lp-pri-gray-cool-270);
707
711
  --neutral-container-high: var(--lp-pri-gray-cool-250);
708
712
  --neutral-container-high-hover: var(--lp-pri-gray-cool-300);
709
713
  --neutral-container-highest: var(--lp-pri-gray-cool-300);
710
714
  --neutral-container-static-lowest: var(--lp-pri-achromatic-white);
711
- --neutral-container-static-lowest-hover: var(--lp-pri-gray-cool-900);
715
+ --neutral-container-static-lowest-hover: var(--lp-pri-gray-cool-980);
712
716
  --neutral-container-variation-lowest: var(--lp-pri-gray-cool-200);
713
717
  --neutral-fill-lowest: var(--lp-pri-gray-cool-dark-alpha-0);
714
718
  --neutral-fill-lowest-hover: var(--lp-pri-gray-cool-dark-alpha-12);
715
- --neutral-fill-low: var(--lp-pri-gray-cool-dark-alpha-20);
716
- --neutral-fill-low-hover: var(--lp-pri-gray-cool-dark-alpha-8);
719
+ --neutral-fill-low: var(--lp-pri-gray-cool-dark-alpha-8);
720
+ --neutral-fill-low-hover: var(--lp-pri-gray-cool-dark-alpha-20);
717
721
  --neutral-fill-mid: var(--lp-pri-gray-cool-dark-alpha-16);
718
722
  --neutral-fill-mid-hover: var(--lp-pri-gray-cool-dark-alpha-32);
719
723
  --neutral-fill-high: var(--lp-pri-gray-cool-dark-alpha-32);
@@ -728,22 +732,23 @@
728
732
  --neutral-border-overlay-strong: var(--lp-pri-gray-cool-light-alpha-64);
729
733
  --neutral-border-overlay-normal: var(--lp-pri-gray-cool-light-alpha-28);
730
734
  --neutral-border-overlay-subtle: var(--lp-pri-gray-cool-light-alpha-20);
735
+ --neutral-border-overlay-hint: var(--lp-pri-gray-cool-light-alpha-12);
731
736
  --neutral-border-opaque-strong: var(--lp-pri-achromatic-white);
732
737
  --neutral-border-opaque-normal: var(--lp-pri-gray-cool-350);
733
738
  --neutral-border-opaque-subtle: var(--lp-pri-gray-cool-250);
734
739
  --inverse-container-lowest: var(--lp-pri-achromatic-white);
735
- --inverse-container-lowest-hover: var(--lp-pri-gray-cool-970);
740
+ --inverse-container-lowest-hover: var(--lp-pri-gray-cool-980);
736
741
  --inverse-container-low: var(--lp-pri-gray-cool-980);
737
742
  --inverse-container-low-hover: var(--lp-pri-gray-cool-970);
738
743
  --inverse-container-mid: var(--lp-pri-gray-cool-970);
739
- --inverse-container-mid-hover: var(--lp-pri-gray-cool-940);
744
+ --inverse-container-mid-hover: var(--lp-pri-gray-cool-950);
740
745
  --inverse-container-high: var(--lp-pri-gray-cool-940);
741
746
  --inverse-container-high-hover: var(--lp-pri-gray-cool-900);
742
747
  --inverse-container-static-high: var(--lp-pri-gray-cool-250);
743
748
  --inverse-container-static-high-hover: var(--lp-pri-gray-cool-350);
744
749
  --inverse-container-highest: var(--lp-pri-gray-cool-920);
745
750
  --inverse-fill-mid: var(--lp-pri-gray-cool-light-alpha-24);
746
- --inverse-fill-mid-hover: var(--lp-pri-gray-cool-light-alpha-0);
751
+ --inverse-fill-mid-hover: var(--lp-pri-gray-cool-dark-alpha-16);
747
752
  --inverse-label-primary: var(--lp-pri-gray-cool-100);
748
753
  --inverse-label-secondary: var(--lp-pri-gray-cool-dark-alpha-80);
749
754
  --inverse-label-tertiary: var(--lp-pri-gray-cool-dark-alpha-48);
@@ -753,32 +758,34 @@
753
758
  --inverse-border-overlay-strong: var(--lp-pri-gray-cool-dark-alpha-64);
754
759
  --inverse-border-overlay-normal: var(--lp-pri-gray-cool-dark-alpha-24);
755
760
  --inverse-border-overlay-subtle: var(--lp-pri-gray-cool-dark-alpha-16);
761
+ --inverse-border-overlay-hint: var(--lp-pri-gray-cool-dark-alpha-12);
756
762
  --inverse-border-opaque-strong: var(--lp-pri-gray-cool-100);
757
763
  --inverse-border-opaque-normal: var(--lp-pri-gray-cool-850);
758
764
  --inverse-border-opaque-subtle: var(--lp-pri-gray-cool-920);
759
- --brand-container-mid: var(--lp-pri-brand-original-500);
760
- --brand-container-mid-hover: var(--lp-pri-brand-original-600);
761
- --brand-container-high: var(--lp-pri-brand-original-400);
762
- --brand-label-primary: var(--lp-pri-brand-variation-500);
763
- --brand-label-secondary: var(--lp-pri-brand-original-alpha-80);
764
- --brand-border-opaque-normal: var(--lp-pri-brand-original-500);
765
- --brand-border-overlay-normal: var(--lp-pri-brand-original-alpha-20);
765
+ --brand-container-mid: var(--lp-pri-brand-variation-380);
766
+ --brand-container-mid-hover: var(--lp-pri-brand-variation-350);
767
+ --brand-fill-mid: var(--lp-pri-brand-variation-380);
768
+ --brand-fill-mid-hover: var(--lp-pri-brand-variation-350);
769
+ --brand-fill-low: var(--lp-pri-brand-variation-100);
770
+ --brand-fill-low-hover: var(--lp-pri-brand-variation-150);
771
+ --brand-label-primary: var(--lp-pri-brand-variation-950);
772
+ --brand-label-secondary: var(--lp-pri-achromatic-white);
773
+ --brand-label-variation-secondary: var(--lp-pri-achromatic-white-alpha-80);
774
+ --brand-border-opaque-normal: var(--lp-pri-achromatic-white);
775
+ --brand-border-opaque-strong: var(--lp-pri-brand-variation-950);
766
776
  --brandinverse-label-primary: var(--lp-pri-brand-original-500);
767
- --accent-yellow: var(--lp-pri-rainbow-yellow-600);
768
- --accent-mint: var(--lp-pri-rainbow-mint-600);
769
- --accent-cyan: var(--lp-pri-rainbow-cyan-600);
770
- --accent-purple: var(--lp-pri-rainbow-purple-600);
771
- --accent-pink: var(--lp-pri-rainbow-pink-600);
777
+ --brandinverse-label-secondary: var(--lp-pri-brand-original-200);
772
778
  --function-container-positive: var(--lp-pri-rainbow-green-600);
773
779
  --function-container-negative: var(--lp-pri-rainbow-red-500);
774
780
  --function-container-negative-hover: var(--lp-pri-rainbow-red-600);
775
781
  --function-container-caution: var(--lp-pri-rainbow-orange-500);
776
782
  --function-container-highlight: var(--lp-pri-rainbow-yellow-100);
777
783
  --function-container-selection: var(--lp-pri-brand-variation-100);
778
- --function-container-drag: var(--lp-pri-brand-variation-100);
784
+ --function-container-drag: var(--lp-pri-achromatic-white-alpha-16);
779
785
  --function-label-positive: var(--lp-pri-rainbow-green-600);
780
786
  --function-label-negative: var(--lp-pri-rainbow-red-500);
781
787
  --function-label-caution: var(--lp-pri-rainbow-orange-500);
788
+ --function-label-link: var(--lp-pri-rainbow-cyan-600);
782
789
  --cover-dim-page: var(--lp-pri-achromatic-black-alpha-56);
783
790
  --lp-sys-shadow-normal:
784
791
  0px 2px 12px 0px rgba(0, 0, 0, 0.24),
@@ -796,21 +803,21 @@
796
803
  :root[color-theme=light],
797
804
  :root[class=light] {
798
805
  --neutral-container-lowest: var(--lp-pri-achromatic-white);
799
- --neutral-container-lowest-hover: var(--lp-pri-gray-cool-970);
806
+ --neutral-container-lowest-hover: var(--lp-pri-gray-cool-980);
800
807
  --neutral-container-low: var(--lp-pri-gray-cool-980);
801
808
  --neutral-container-low-hover: var(--lp-pri-gray-cool-970);
802
809
  --neutral-container-mid: var(--lp-pri-gray-cool-970);
803
- --neutral-container-mid-hover: var(--lp-pri-gray-cool-940);
810
+ --neutral-container-mid-hover: var(--lp-pri-gray-cool-950);
804
811
  --neutral-container-high: var(--lp-pri-gray-cool-940);
805
812
  --neutral-container-high-hover: var(--lp-pri-gray-cool-900);
806
813
  --neutral-container-highest: var(--lp-pri-gray-cool-920);
807
814
  --neutral-container-static-lowest: var(--lp-pri-achromatic-white);
808
- --neutral-container-static-lowest-hover: var(--lp-pri-gray-cool-970);
815
+ --neutral-container-static-lowest-hover: var(--lp-pri-gray-cool-980);
809
816
  --neutral-container-variation-lowest: var(--lp-pri-achromatic-white);
810
817
  --neutral-fill-lowest: var(--lp-pri-gray-cool-dark-alpha-0);
811
818
  --neutral-fill-lowest-hover: var(--lp-pri-gray-cool-dark-alpha-6);
812
- --neutral-fill-low: var(--lp-pri-gray-cool-dark-alpha-8);
813
- --neutral-fill-low-hover: var(--lp-pri-gray-cool-dark-alpha-4);
819
+ --neutral-fill-low: var(--lp-pri-gray-cool-dark-alpha-4);
820
+ --neutral-fill-low-hover: var(--lp-pri-gray-cool-dark-alpha-8);
814
821
  --neutral-fill-mid: var(--lp-pri-gray-cool-dark-alpha-8);
815
822
  --neutral-fill-mid-hover: var(--lp-pri-gray-cool-dark-alpha-16);
816
823
  --neutral-fill-high: var(--lp-pri-gray-cool-dark-alpha-20);
@@ -825,6 +832,7 @@
825
832
  --neutral-border-overlay-strong: var(--lp-pri-gray-cool-dark-alpha-64);
826
833
  --neutral-border-overlay-normal: var(--lp-pri-gray-cool-dark-alpha-24);
827
834
  --neutral-border-overlay-subtle: var(--lp-pri-gray-cool-dark-alpha-16);
835
+ --neutral-border-overlay-hint: var(--lp-pri-gray-cool-dark-alpha-12);
828
836
  --neutral-border-opaque-strong: var(--lp-pri-gray-cool-100);
829
837
  --neutral-border-opaque-normal: var(--lp-pri-gray-cool-850);
830
838
  --neutral-border-opaque-subtle: var(--lp-pri-gray-cool-920);
@@ -832,15 +840,15 @@
832
840
  --inverse-container-lowest-hover: var(--lp-pri-gray-cool-200);
833
841
  --inverse-container-low: var(--lp-pri-gray-cool-200);
834
842
  --inverse-container-low-hover: var(--lp-pri-gray-cool-250);
835
- --inverse-container-mid: var(--lp-pri-gray-cool-200);
836
- --inverse-container-mid-hover: var(--lp-pri-gray-cool-300);
843
+ --inverse-container-mid: var(--lp-pri-gray-cool-250);
844
+ --inverse-container-mid-hover: var(--lp-pri-gray-cool-270);
837
845
  --inverse-container-high: var(--lp-pri-gray-cool-250);
838
846
  --inverse-container-high-hover: var(--lp-pri-gray-cool-300);
839
847
  --inverse-container-static-high: var(--lp-pri-gray-cool-250);
840
848
  --inverse-container-static-high-hover: var(--lp-pri-gray-cool-350);
841
849
  --inverse-container-highest: var(--lp-pri-gray-cool-300);
842
850
  --inverse-fill-mid: var(--lp-pri-achromatic-white);
843
- --inverse-fill-mid-hover: var(--lp-pri-gray-cool-970);
851
+ --inverse-fill-mid-hover: var(--lp-pri-gray-cool-dark-alpha-32);
844
852
  --inverse-label-primary: var(--lp-pri-achromatic-white);
845
853
  --inverse-label-secondary: var(--lp-pri-gray-cool-light-alpha-64);
846
854
  --inverse-label-tertiary: var(--lp-pri-gray-cool-light-alpha-32);
@@ -850,32 +858,34 @@
850
858
  --inverse-border-overlay-strong: var(--lp-pri-gray-cool-light-alpha-64);
851
859
  --inverse-border-overlay-normal: var(--lp-pri-gray-cool-light-alpha-28);
852
860
  --inverse-border-overlay-subtle: var(--lp-pri-gray-cool-light-alpha-20);
861
+ --inverse-border-overlay-hint: var(--lp-pri-gray-cool-light-alpha-12);
853
862
  --inverse-border-opaque-strong: var(--lp-pri-achromatic-white);
854
863
  --inverse-border-opaque-normal: var(--lp-pri-gray-cool-350);
855
864
  --inverse-border-opaque-subtle: var(--lp-pri-gray-cool-250);
856
- --brand-container-mid: var(--lp-pri-brand-original-500);
857
- --brand-container-mid-hover: var(--lp-pri-brand-original-400);
858
- --brand-container-high: var(--lp-pri-brand-original-400);
865
+ --brand-container-mid: var(--lp-pri-brand-original-200);
866
+ --brand-container-mid-hover: var(--lp-pri-brand-original-150);
867
+ --brand-fill-mid: var(--lp-pri-brand-original-200);
868
+ --brand-fill-mid-hover: var(--lp-pri-brand-original-150);
869
+ --brand-fill-low: var(--lp-pri-brand-original-990);
870
+ --brand-fill-low-hover: var(--lp-pri-brand-original-980);
859
871
  --brand-label-primary: var(--lp-pri-brand-original-500);
860
- --brand-label-secondary: var(--lp-pri-brand-original-alpha-80);
861
- --brand-border-opaque-normal: var(--lp-pri-brand-original-500);
862
- --brand-border-overlay-normal: var(--lp-pri-brand-original-alpha-20);
863
- --brandinverse-label-primary: var(--lp-pri-brand-variation-500);
864
- --accent-yellow: var(--lp-pri-rainbow-yellow-500);
865
- --accent-mint: var(--lp-pri-rainbow-mint-500);
866
- --accent-cyan: var(--lp-pri-rainbow-cyan-500);
867
- --accent-purple: var(--lp-pri-rainbow-purple-500);
868
- --accent-pink: var(--lp-pri-rainbow-pink-500);
872
+ --brand-label-secondary: var(--lp-pri-brand-original-200);
873
+ --brand-label-variation-secondary: var(--lp-pri-brand-original-200);
874
+ --brand-border-opaque-normal: var(--lp-pri-brand-original-200);
875
+ --brand-border-opaque-strong: var(--lp-pri-brand-original-500);
876
+ --brandinverse-label-primary: var(--lp-pri-brand-variation-950);
877
+ --brandinverse-label-secondary: var(--lp-pri-achromatic-white);
869
878
  --function-container-positive: var(--lp-pri-rainbow-green-500);
870
879
  --function-container-negative: var(--lp-pri-rainbow-red-500);
871
880
  --function-container-negative-hover: var(--lp-pri-rainbow-red-400);
872
881
  --function-container-caution: var(--lp-pri-rainbow-orange-500);
873
882
  --function-container-highlight: var(--lp-pri-rainbow-yellow-900);
874
883
  --function-container-selection: var(--lp-pri-brand-variation-950);
875
- --function-container-drag: var(--lp-pri-brand-original-800);
884
+ --function-container-drag: var(--lp-pri-brand-original-alpha-12);
876
885
  --function-label-positive: var(--lp-pri-rainbow-green-500);
877
886
  --function-label-negative: var(--lp-pri-rainbow-red-500);
878
887
  --function-label-caution: var(--lp-pri-rainbow-orange-500);
888
+ --function-label-link: var(--lp-pri-rainbow-cyan-300);
879
889
  --cover-dim-page: var(--lp-pri-achromatic-black-alpha-56);
880
890
  --lp-sys-shadow-normal:
881
891
  0px 2px 12px 0px rgba(0, 0, 0, 0.08),