@stackoverflow/stacks 2.0.0-rc.1 → 2.0.0-rc.2

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 (47) hide show
  1. package/README.md +5 -0
  2. package/dist/css/stacks.css +582 -532
  3. package/dist/css/stacks.min.css +1 -1
  4. package/dist/js/stacks.js +265 -110
  5. package/dist/js/stacks.min.js +1 -1
  6. package/lib/atomic/typography.less +4 -0
  7. package/lib/components/activity-indicator/activity-indicator.a11y.test.ts +1 -1
  8. package/lib/components/activity-indicator/activity-indicator.less +17 -4
  9. package/lib/components/anchor/anchor.visual.test.ts +1 -5
  10. package/lib/components/avatar/avatar.visual.test.ts +1 -4
  11. package/lib/components/badge/badge.a11y.test.ts +2 -2
  12. package/lib/components/badge/badge.less +15 -23
  13. package/lib/components/block-link/block-link.less +5 -4
  14. package/lib/components/button/button.a11y.test.ts +2 -5
  15. package/lib/components/button/button.less +28 -58
  16. package/lib/components/button/button.visual.test.ts +2 -5
  17. package/lib/components/card/card.less +8 -0
  18. package/lib/components/description/description.a11y.test.ts +1 -0
  19. package/lib/components/expandable/expandable.a11y.test.ts +27 -0
  20. package/lib/components/expandable/expandable.visual.test.ts +27 -0
  21. package/lib/components/input-icon/input-icon.less +1 -1
  22. package/lib/components/input-message/input-message.less +4 -3
  23. package/lib/components/label/label.less +3 -13
  24. package/lib/components/link-preview/link-preview.a11y.test.ts +48 -0
  25. package/lib/components/link-preview/link-preview.less +13 -4
  26. package/lib/components/link-preview/link-preview.visual.test.ts +52 -0
  27. package/lib/components/notice/notice.a11y.test.ts +17 -0
  28. package/lib/components/notice/notice.less +44 -81
  29. package/lib/components/notice/notice.visual.test.ts +26 -0
  30. package/lib/components/pagination/pagination.a11y.test.ts +20 -0
  31. package/lib/components/pagination/pagination.visual.test.ts +26 -0
  32. package/lib/components/post-summary/post-summary.less +3 -3
  33. package/lib/components/sidebar-widget/sidebar-widget.less +2 -2
  34. package/lib/components/spinner/spinner.a11y.test.ts +15 -0
  35. package/lib/components/spinner/spinner.visual.test.ts +43 -0
  36. package/lib/components/toast/toast.a11y.test.ts +30 -0
  37. package/lib/components/toast/toast.visual.test.ts +10 -6
  38. package/lib/components/toggle-switch/toggle-switch.less +2 -5
  39. package/lib/components/uploader/uploader.less +19 -13
  40. package/lib/exports/color-sets.less +127 -78
  41. package/lib/exports/theme.less +3 -3
  42. package/lib/input-utils.less +1 -1
  43. package/lib/test/axe-apca/README.md +19 -0
  44. package/lib/test/axe-apca/src/axe-apca.test.ts +77 -1
  45. package/lib/test/axe-apca/src/axe-apca.ts +16 -8
  46. package/lib/test/test-utils.ts +7 -3
  47. package/package.json +12 -12
@@ -413,7 +413,7 @@ fieldset {
413
413
  .s-activity-indicator {
414
414
  --_ai-focus-ring: var(--focus-ring);
415
415
  --_ai-bg: var(--theme-secondary-400);
416
- --_ai-fc: var(--_white-static);
416
+ --_ai-fc: var(--white);
417
417
  background-color: var(--_ai-bg);
418
418
  box-shadow: 0 0 0 var(--su-static4) var(--_ai-focus-ring);
419
419
  color: var(--_ai-fc);
@@ -428,20 +428,31 @@ fieldset {
428
428
  text-transform: uppercase;
429
429
  }
430
430
  body.theme-highcontrast .s-activity-indicator {
431
- --_ai-fc: var(--white);
431
+ --_ai-bg: var(--theme-secondary-500);
432
432
  }
433
433
  .s-activity-indicator.s-activity-indicator__danger {
434
434
  --_ai-bg: var(--red-400);
435
435
  --_ai-focus-ring: var(--focus-ring-error);
436
436
  }
437
+ body.theme-highcontrast .s-activity-indicator.s-activity-indicator__danger {
438
+ --_ai-bg: var(--red-500);
439
+ }
437
440
  .s-activity-indicator.s-activity-indicator__success {
438
441
  --_ai-bg: var(--green-400);
439
442
  --_ai-focus-ring: var(--focus-ring-success);
440
443
  }
444
+ body.theme-highcontrast .s-activity-indicator.s-activity-indicator__success {
445
+ --_ai-bg: var(--green-500);
446
+ }
441
447
  .s-activity-indicator.s-activity-indicator__warning {
442
- --_ai-bg: var(--yellow-500);
448
+ --_ai-bg: var(--yellow-400);
449
+ --_ai-fc: var(--_black-static);
443
450
  --_ai-focus-ring: var(--focus-ring-warning);
444
451
  }
452
+ body.theme-highcontrast .s-activity-indicator.s-activity-indicator__warning {
453
+ --_ai-bg: var(--yellow-500);
454
+ --_ai-fc: var(--white);
455
+ }
445
456
  .s-anchors {
446
457
  --_an-a-fc-visited: var(--_an-a-fc);
447
458
  }
@@ -708,11 +719,6 @@ body.theme-highcontrast .s-badgebody.theme-highcontrast .s-badge__staff {
708
719
  .s-badge.s-badge__bronze {
709
720
  --_ba-fc: var(--black-500);
710
721
  }
711
- body.theme-highcontrast .s-badge.s-badge__gold,
712
- body.theme-highcontrast .s-badge.s-badge__silver,
713
- body.theme-highcontrast .s-badge.s-badge__bronze {
714
- --_ba-fc: var(--black-600);
715
- }
716
722
  .s-badge.s-badge__gold {
717
723
  --_ba-bc: var(--gold-400);
718
724
  --_ba-bg: var(--gold-100);
@@ -740,10 +746,10 @@ body.theme-highcontrast .s-badge.s-badge__bronze {
740
746
  --_ba-bg: var(--green-400);
741
747
  }
742
748
  .s-badge.s-badge__bounty {
743
- --_ba-bg: var(--blue-500);
749
+ --_ba-bg: var(--blue-400);
744
750
  }
745
751
  .s-badge.s-badge__important {
746
- --_ba-bg: var(--red-500);
752
+ --_ba-bg: var(--red-400);
747
753
  }
748
754
  .s-badge.s-badge__rep {
749
755
  --_ba-bc: var(--green-400);
@@ -759,8 +765,8 @@ body.theme-highcontrast .s-badge.s-badge__bronze {
759
765
  }
760
766
  .s-badge.s-badge__admin {
761
767
  --_ba-bc: var(--theme-primary-300);
762
- --_ba-bg: var(--theme-primary-200);
763
- --_ba-fc: var(--theme-primary-600);
768
+ --_ba-bg: var(--theme-primary-100);
769
+ --_ba-fc: var(--theme-primary-500);
764
770
  }
765
771
  .s-badge.s-badge__moderator {
766
772
  --_ba-bc: var(--theme-secondary-300);
@@ -799,7 +805,7 @@ body.theme-highcontrast .s-badge.s-badge__bronze {
799
805
  }
800
806
  .s-badge.s-badge__staff {
801
807
  --_ba-bc: var(--orange-400);
802
- --_ba-bg: var(--orange-300);
808
+ --_ba-bg: var(--orange-200);
803
809
  --_ba-fc: var(--orange-600);
804
810
  }
805
811
  .s-badge.s-badge__danger.s-badge__filled,
@@ -807,31 +813,28 @@ body.theme-highcontrast .s-badge.s-badge__bronze {
807
813
  --_ba-bc: transparent;
808
814
  }
809
815
  .s-badge.s-badge__danger {
810
- --_ba-bc: var(--red-500);
811
- --_ba-bg: var(--red-300);
816
+ --_ba-bc: var(--red-400);
817
+ --_ba-bg: var(--red-200);
812
818
  --_ba-fc: var(--red-600);
813
819
  }
814
820
  .s-badge.s-badge__danger.s-badge__filled {
815
821
  --_ba-bg: var(--red-400);
816
- --_ba-fc: var(--_white-static);
817
- }
818
- body.theme-highcontrast .s-badge.s-badge__danger.s-badge__filled {
819
822
  --_ba-fc: var(--white);
820
823
  }
821
824
  .s-badge.s-badge__info {
822
- --_ba-bc: var(--blue-500);
823
- --_ba-bg: var(--blue-300);
825
+ --_ba-bc: var(--blue-400);
826
+ --_ba-bg: var(--blue-200);
824
827
  --_ba-fc: var(--blue-600);
825
828
  }
826
829
  .s-badge.s-badge__warning {
827
- --_ba-bc: var(--yellow-500);
828
- --_ba-bg: var(--yellow-300);
830
+ --_ba-bc: var(--yellow-400);
831
+ --_ba-bg: var(--yellow-200);
829
832
  --_ba-fc: var(--yellow-600);
830
833
  }
831
834
  .s-badge.s-badge__muted {
832
- --_ba-bc: var(--black-500);
833
- --_ba-bg: var(--black-225);
834
- --_ba-fc: var(--black-600);
835
+ --_ba-bc: var(--black-400);
836
+ --_ba-bg: var(--black-200);
837
+ --_ba-fc: var(--black-500);
835
838
  }
836
839
  .s-badge.s-badge__muted.s-badge__filled {
837
840
  --_ba-bg: var(--black-500);
@@ -849,11 +852,12 @@ a.s-badge:hover {
849
852
  }
850
853
  .s-banner {
851
854
  --_no-x-offset: 0;
852
- --_no-bc: var(--bc-medium);
855
+ --_no-bc: var(--black-225);
853
856
  --_no-bg: var(--black-150);
854
- --_no-fc: var(--fc-medium);
857
+ --_no-fc: var(--black-500);
855
858
  --_no-btn-bg-focus: var(--black-225);
856
859
  --_no-btn-bg-active: var(--black-250);
860
+ --_no-btn-fc: var(--_no-fc);
857
861
  background: var(--_no-bg);
858
862
  border-color: var(--_no-bc);
859
863
  color: var(--_no-fc);
@@ -895,174 +899,111 @@ body.theme-highcontrast.theme-dark .s-banner:not(.s-banner__important) {
895
899
  --_no-fc: var(--white);
896
900
  --_no-btn-bg-focus: var(--black-600);
897
901
  --_no-btn-bg-active: var(--black-600);
898
- }
899
- body.theme-highcontrast .s-banner__important {
900
- --_no-bc: var(--_no-bg);
902
+ --_no-btn-fc: var(--_no-fc);
903
+ --_no-code-bg: var(--black-300);
901
904
  }
902
905
  .s-banner__danger {
903
906
  --_no-bc: var(--red-300);
904
- --_no-bg: var(--red-200);
905
- --_no-btn-bg-active: var(--red-300);
906
- --_no-btn-bg-focus: var(--red-300);
907
- }
908
- body.theme-highcontrast .s-banner__danger:not(.s-banner__important) {
909
- --_no-bg: var(--red-300);
907
+ --_no-bg: var(--red-100);
908
+ --_no-btn-bg-active: var(--red-200);
909
+ --_no-btn-bg-focus: var(--red-200);
910
+ --_no-btn-fc: var(--red-500);
911
+ --_no-code-bg: var(--red-300);
910
912
  }
911
913
  .s-banner__danger.s-banner__important {
912
914
  --_no-bc: var(--_no-bg);
913
915
  --_no-bg: var(--red-400);
914
916
  --_no-btn-bg-active: var(--red-500);
915
917
  --_no-btn-bg-focus: var(--red-500);
918
+ --_no-btn-fc: var(--red-100);
916
919
  }
917
- @media (prefers-color-scheme: dark) {
918
- body.theme-system .s-banner__danger.s-banner__important {
919
- --_no-bg: var(--red-400);
920
- --_no-fc: var(--black-600);
921
- }
922
- }
923
- body.theme-dark .s-banner__danger.s-banner__important,
924
- .theme-dark__forced .s-banner__danger.s-banner__important,
925
- body.theme-system .theme-dark__forced .s-banner__danger.s-banner__important {
926
- --_no-bg: var(--red-400);
927
- --_no-fc: var(--black-600);
928
- }
929
- @media (prefers-color-scheme: dark) {
930
- body.theme-highcontrast.theme-system .s-banner__danger.s-banner__important {
931
- --_no-bg: var(--red-400);
932
- --_no-fc: var(--white);
933
- }
934
- }
935
- body.theme-highcontrast.theme-dark .s-banner__danger.s-banner__important {
936
- --_no-bg: var(--red-400);
937
- --_no-fc: var(--white);
920
+ body.theme-highcontrast .s-banner__danger.s-banner__important {
921
+ --_no-bg: var(--red-500);
938
922
  }
939
923
  .s-banner__info {
940
924
  --_no-bc: var(--theme-secondary-300);
941
- --_no-bg: var(--theme-secondary-200);
942
- --_no-btn-bg-focus: var(--theme-secondary-300);
943
- --_no-btn-bg-active: var(--theme-secondary-300);
925
+ --_no-bg: var(--theme-secondary-100);
926
+ --_no-btn-bg-focus: var(--theme-secondary-200);
927
+ --_no-btn-bg-active: var(--theme-secondary-200);
928
+ --_no-btn-fc: var(--theme-secondary-500);
944
929
  --_no-code-bg: var(--theme-secondary-300);
945
930
  }
946
- body.theme-highcontrast .s-banner__info:not(.s-banner__important) {
947
- --_no-bg: var(--theme-secondary-300);
948
- }
949
- @media (prefers-color-scheme: dark) {
950
- body.theme-highcontrast.theme-system .s-banner__info:not(.s-banner__important) {
951
- --_no-bg: var(--theme-secondary-300);
952
- }
953
- }
954
- body.theme-highcontrast.theme-dark .s-banner__info:not(.s-banner__important) {
955
- --_no-bg: var(--theme-secondary-300);
956
- }
957
931
  .s-banner__info.s-banner__important {
958
932
  --_no-bc: var(--_no-bg);
959
933
  --_no-bg: var(--theme-secondary-400);
960
934
  --_no-btn-bg-active: var(--theme-secondary-500);
961
- --_no-btn-bg-focus: var(--theme-secondary-400);
962
- }
963
- @media (prefers-color-scheme: dark) {
964
- body.theme-system .s-banner__info.s-banner__important {
965
- --_no-bg: var(--theme-secondary-400);
966
- --_no-fc: var(--black-600);
967
- }
935
+ --_no-btn-bg-focus: var(--theme-secondary-500);
936
+ --_no-btn-fc: var(--theme-secondary-100);
968
937
  }
969
- body.theme-dark .s-banner__info.s-banner__important,
970
- .theme-dark__forced .s-banner__info.s-banner__important,
971
- body.theme-system .theme-dark__forced .s-banner__info.s-banner__important {
972
- --_no-bg: var(--theme-secondary-400);
973
- --_no-fc: var(--black-600);
974
- }
975
- @media (prefers-color-scheme: dark) {
976
- body.theme-highcontrast.theme-system .s-banner__info.s-banner__important {
977
- --_no-bg: var(--theme-secondary-400);
978
- --_no-fc: var(--white);
979
- }
980
- }
981
- body.theme-highcontrast.theme-dark .s-banner__info.s-banner__important {
982
- --_no-bg: var(--theme-secondary-400);
983
- --_no-fc: var(--white);
938
+ body.theme-highcontrast .s-banner__info.s-banner__important {
939
+ --_no-bg: var(--theme-secondary-500);
984
940
  }
985
941
  .s-banner__success {
986
942
  --_no-bc: var(--green-300);
987
- --_no-bg: var(--green-200);
988
- --_no-btn-bg-active: var(--green-300);
989
- --_no-btn-bg-focus: var(--green-300);
990
- }
991
- body.theme-highcontrast .s-banner__success:not(.s-banner__important) {
992
- --_no-bg: var(--green-300);
943
+ --_no-bg: var(--green-100);
944
+ --_no-btn-bg-active: var(--green-200);
945
+ --_no-btn-bg-focus: var(--green-200);
946
+ --_no-btn-fc: var(--green-500);
947
+ --_no-code-bg: var(--green-300);
993
948
  }
994
949
  .s-banner__success.s-banner__important {
995
950
  --_no-bc: var(--_no-bg);
996
951
  --_no-bg: var(--green-400);
997
- --_no-fc: var(--black-600);
998
952
  --_no-btn-bg-active: var(--green-500);
999
- --_no-btn-bg-focus: var(--green-400);
1000
- }
1001
- @media (prefers-color-scheme: dark) {
1002
- body.theme-system .s-banner__success.s-banner__important {
1003
- --_no-bg: var(--green-400);
1004
- --_no-fc: var(--white);
1005
- }
1006
- }
1007
- body.theme-dark .s-banner__success.s-banner__important,
1008
- .theme-dark__forced .s-banner__success.s-banner__important,
1009
- body.theme-system .theme-dark__forced .s-banner__success.s-banner__important {
1010
- --_no-bg: var(--green-400);
1011
- --_no-fc: var(--white);
953
+ --_no-btn-bg-focus: var(--green-500);
954
+ --_no-btn-fc: var(--green-100);
1012
955
  }
1013
956
  body.theme-highcontrast .s-banner__success.s-banner__important {
1014
- --_no-bg: var(--green-400);
1015
- --_no-fc: var(--white);
957
+ --_no-bg: var(--green-500);
1016
958
  }
1017
959
  .s-banner__warning {
1018
- --_no-bc: var(--yellow-400);
1019
- --_no-bg: var(--yellow-200);
1020
- --_no-btn-bg-active: var(--yellow-400);
1021
- --_no-btn-bg-focus: var(--yellow-300);
960
+ --_no-bc: var(--yellow-300);
961
+ --_no-bg: var(--yellow-100);
962
+ --_no-btn-bg-active: var(--yellow-200);
963
+ --_no-btn-bg-focus: var(--yellow-200);
964
+ --_no-btn-fc: var(--yellow-600);
1022
965
  --_no-code-bg: var(--yellow-300);
1023
966
  }
1024
- body.theme-highcontrast .s-banner__warning:not(.s-banner__important) {
1025
- --_no-bg: var(--yellow-300);
1026
- }
1027
967
  .s-banner__warning.s-banner__important {
1028
968
  --_no-bc: var(--_no-bg);
1029
969
  --_no-bg: var(--yellow-400);
1030
- --_no-fc: var(--black-600);
1031
- --_no-btn-bg-active: var(--yellow-500);
1032
- --_no-btn-bg-focus: var(--yellow-400);
970
+ --_no-fc: var(--black);
971
+ --_no-btn-fc: var(--_no-fc);
972
+ --_no-btn-bg-active: var(--yellow-300);
973
+ --_no-btn-bg-focus: var(--yellow-300);
1033
974
  }
1034
975
  @media (prefers-color-scheme: dark) {
1035
976
  body.theme-system .s-banner__warning.s-banner__important {
1036
- --_no-bg: var(--yellow-500);
1037
- --_no-fc: var(--white);
977
+ --_no-fc: var(--yellow-200);
1038
978
  }
1039
979
  }
1040
980
  body.theme-dark .s-banner__warning.s-banner__important,
1041
981
  .theme-dark__forced .s-banner__warning.s-banner__important,
1042
982
  body.theme-system .theme-dark__forced .s-banner__warning.s-banner__important {
1043
- --_no-bg: var(--yellow-500);
1044
- --_no-fc: var(--white);
983
+ --_no-fc: var(--yellow-200);
1045
984
  }
1046
985
  body.theme-highcontrast .s-banner__warning.s-banner__important {
1047
986
  --_no-bg: var(--yellow-500);
1048
987
  --_no-fc: var(--white);
988
+ --_no-btn-bg-active: transparent;
989
+ --_no-btn-bg-focus: transparent;
1049
990
  }
1050
991
  .s-banner code {
1051
992
  background: var(--_no-code-bg, transparent);
1052
993
  }
1053
994
  .s-banner .s-banner--btn {
1054
- color: inherit;
995
+ color: var(--_no-btn-fc, inherit) !important;
1055
996
  padding: var(--su8);
1056
997
  }
1057
998
  .s-banner .s-banner--btn:not(:focus) {
1058
999
  box-shadow: none;
1059
1000
  }
1060
1001
  .s-banner .s-banner--btn:active {
1061
- background: var(--_no-btn-bg-active);
1002
+ background-color: var(--_no-btn-bg-active, inherit) !important;
1062
1003
  }
1063
1004
  .s-banner .s-banner--btn:focus,
1064
1005
  .s-banner .s-banner--btn:hover {
1065
- background: var(--_no-btn-bg-focus);
1006
+ background-color: var(--_no-btn-bg-focus, inherit) !important;
1066
1007
  }
1067
1008
  .s-banner[aria-hidden="true"] {
1068
1009
  --_no-x-offset: -1;
@@ -1089,6 +1030,7 @@ body.theme-highcontrast .s-banner__warning.s-banner__important {
1089
1030
  }
1090
1031
  a.s-block-link,
1091
1032
  .s-block-link {
1033
+ --_bl-bs-color: var(--theme-primary);
1092
1034
  --_bl-bg: transparent;
1093
1035
  --_bl-fc: var(--black-500);
1094
1036
  --_bl-fc-hover: var(--black-600);
@@ -1133,7 +1075,7 @@ a.s-block-linka.s-block-link__right.is-selected,
1133
1075
  a.s-block-link.s-block-link__right.is-selected,
1134
1076
  .s-block-linka.s-block-link__right.is-selected,
1135
1077
  .s-block-link.s-block-link__right.is-selected {
1136
- box-shadow: inset var(--_li-block-bs-offset-x, 3px) 0 0 var(--theme-primary);
1078
+ box-shadow: inset var(--_li-block-bs-offset-x, 3px) 0 0 var(--_bl-bs-color);
1137
1079
  }
1138
1080
  a.s-block-linka.s-block-link__left.is-selected:focus:not(:focus-visible),
1139
1081
  a.s-block-link.s-block-link__left.is-selected:focus:not(:focus-visible),
@@ -1161,7 +1103,7 @@ a.s-block-linka.s-block-link__right.is-selected:focus-visible,
1161
1103
  a.s-block-link.s-block-link__right.is-selected:focus-visible,
1162
1104
  .s-block-linka.s-block-link__right.is-selected:focus-visible,
1163
1105
  .s-block-link.s-block-link__right.is-selected:focus-visible {
1164
- box-shadow: inset var(--_li-block-bs-offset-x, 3px) 0 0 var(--theme-primary), 0 0 0 var(--su-static4) var(--focus-ring-muted);
1106
+ box-shadow: inset var(--_li-block-bs-offset-x, 3px) 0 0 var(--_bl-bs-color), 0 0 0 var(--su-static4) var(--focus-ring-muted);
1165
1107
  }
1166
1108
  a.s-block-linka.s-block-link__right.is-selected,
1167
1109
  a.s-block-link.s-block-link__right.is-selected,
@@ -1175,6 +1117,7 @@ a.s-block-link.s-block-link__danger,
1175
1117
  .s-block-link.s-block-link__danger {
1176
1118
  --_bl-fc: var(--red-400);
1177
1119
  --_bl-fc-hover: var(--red-500);
1120
+ --_bl-fc-visited: var(--red-500);
1178
1121
  }
1179
1122
  a.s-block-link:active,
1180
1123
  .s-block-link:active,
@@ -1188,7 +1131,7 @@ a.s-block-link:hover:visited,
1188
1131
  }
1189
1132
  a.s-block-link:visited,
1190
1133
  .s-block-link:visited {
1191
- color: var(--_bl-fc-focus);
1134
+ color: var(--_bl-fc-visited);
1192
1135
  }
1193
1136
  a.s-block-link:focus:not(:focus-visible),
1194
1137
  .s-block-link:focus:not(:focus-visible) {
@@ -1251,15 +1194,15 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
1251
1194
  --_bu-fc-selected: var(--theme-button-selected-color);
1252
1195
  --_bu-filled-bc: transparent;
1253
1196
  --_bu-filled-bc-active: transparent;
1254
- --_bu-filled-bg-hover: var(--theme-button-filled-hover-background-color);
1255
1197
  --_bu-filled-bc-selected: transparent;
1256
- --_bu-filled-bg: var(--theme-button-filled-background-color);
1257
- --_bu-filled-bg-active: var(--theme-button-filled-active-background-color);
1258
- --_bu-filled-bg-selected: var(--theme-button-filled-selected-background-color);
1259
- --_bu-filled-fc: var(--theme-button-filled-color);
1260
- --_bu-filled-fc-active: var(--theme-button-filled-hover-color);
1261
- --_bu-filled-fc-hover: var(--theme-button-filled-hover-color);
1262
- --_bu-filled-fc-selected: var(--theme-button-filled-selected-color);
1198
+ --_bu-filled-bg: var(--theme-button-primary-background-color);
1199
+ --_bu-filled-bg-active: var(--theme-button-primary-active-background-color);
1200
+ --_bu-filled-bg-hover: var(--theme-button-primary-hover-background-color);
1201
+ --_bu-filled-bg-selected: var(--theme-button-primary-selected-background-color);
1202
+ --_bu-filled-fc: var(--theme-button-primary-color);
1203
+ --_bu-filled-fc-active: var(--theme-button-primary-hover-color);
1204
+ --_bu-filled-fc-hover: var(--theme-button-primary-hover-color);
1205
+ --_bu-filled-fc-selected: var(--theme-button-primary-selected-color);
1263
1206
  --_bu-outlined-bc: var(--theme-button-outlined-border-color);
1264
1207
  --_bu-outlined-bg: var(--theme-button-outlined-background-color);
1265
1208
  --_bu-outlined-bc-selected: var(--theme-button-outlined-selected-border-color);
@@ -1268,7 +1211,8 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
1268
1211
  --_bu-badge-o: 0.5;
1269
1212
  --_bu-dropdown-bw: var(--su-static4);
1270
1213
  --_bu-number-fc: var(--white);
1271
- --_bu-number-fc-selected: var(--_bu-number-fc);
1214
+ --_bu-number-fc-filled: var(--theme-button-primary-number-color);
1215
+ --_bu-number-fc-selected: var(--white);
1272
1216
  background-color: var(--_bu-bg, inherit);
1273
1217
  border: var(--_bu-baw) solid var(--_bu-bc);
1274
1218
  border-radius: var(--_bu-br);
@@ -1289,14 +1233,12 @@ body.theme-highcontrast .s-breadcrumbs .s-breadcrumbs--divider {
1289
1233
  }
1290
1234
  body.theme-highcontrast .s-btn {
1291
1235
  --_bu-bc: currentColor;
1292
- --_bu-filled-bc: var(--_bu-bc);
1293
1236
  --_bu-outlined-bc: var(--_bu-bc);
1294
1237
  --_bu-bc-selected: var(--_bu-bc);
1238
+ --_bu-fc-selected: var(--white);
1239
+ --_bu-outlined-fc-selected: var(--white);
1295
1240
  --_bu-badge-o: 0.8;
1296
- }
1297
- body.theme-highcontrast .s-btn:not(.s-btn__primary):not(.s-btn__muted):not(.s-btn__danger):not(.is-selected):not(.s-btn__link):not(.s-btn__unset) {
1298
- --_bu-bg-hover: var(--theme-secondary-300);
1299
- --_bu-filled-bg-hover: var(--theme-secondary-400);
1241
+ --_bu-number-fc-selected: var(--theme-button-primary-number-color);
1300
1242
  }
1301
1243
  fieldset[disabled] .s-btn,
1302
1244
  .s-btn[disabled],
@@ -1354,6 +1296,9 @@ body.theme-highcontrast .s-btn-group.s-btn-group--radio .s-btn--radio:checked +
1354
1296
  background-color: var(--_bu-filled-bg);
1355
1297
  color: var(--_bu-filled-fc);
1356
1298
  }
1299
+ .s-btn.s-btn__filled .s-btn--number {
1300
+ color: var(--_bu-number-fc-filled);
1301
+ }
1357
1302
  .s-btn.s-btn__outlined {
1358
1303
  border-color: var(--_bu-outlined-bc);
1359
1304
  background-color: var(--_bu-outlined-bg, inherit);
@@ -1558,37 +1503,8 @@ body.theme-highcontrast .s-btn.s-btn__muted {
1558
1503
  --_bu-outlined-bc-selected: var(--red-500);
1559
1504
  --_bu-outlined-bg-selected: var(--_bu-bg-selected);
1560
1505
  --_bu-outlined-fc-selected: var(--_bu-fc-selected);
1561
- }
1562
- .s-btn.s-btn__danger.s-btn__filled {
1563
- --_bu-number-fc: var(--black);
1564
- }
1565
- @media (prefers-color-scheme: dark) {
1566
- body.theme-system .s-btn.s-btn__danger.s-btn__filled {
1567
- --_bu-filled-fc: var(--black);
1568
- --_bu-filled-fc-selected: var(--white);
1569
- --_bu-number-fc: var(--white);
1570
- --_bu-number-fc-selected: var(--black);
1571
- }
1572
- }
1573
- body.theme-dark .s-btn.s-btn__danger.s-btn__filled,
1574
- .theme-dark__forced .s-btn.s-btn__danger.s-btn__filled,
1575
- body.theme-system .theme-dark__forced .s-btn.s-btn__danger.s-btn__filled {
1576
- --_bu-filled-fc: var(--black);
1577
- --_bu-filled-fc-selected: var(--white);
1578
1506
  --_bu-number-fc: var(--white);
1579
- --_bu-number-fc-selected: var(--black);
1580
- }
1581
- @media (prefers-color-scheme: dark) {
1582
- body.theme-highcontrast.theme-system .s-btn.s-btn__danger.s-btn__filled {
1583
- --_bu-filled-fc: var(--white);
1584
- --_bu-number-fc: var(--black);
1585
- --_bu-number-fc-selected: var(--black);
1586
- }
1587
- }
1588
- body.theme-highcontrast.theme-dark .s-btn.s-btn__danger.s-btn__filled {
1589
- --_bu-filled-fc: var(--white);
1590
- --_bu-number-fc: var(--black);
1591
- --_bu-number-fc-selected: var(--black);
1507
+ --_bu-number-fc-filled: var(--black);
1592
1508
  }
1593
1509
  .s-btn.s-btn__muted {
1594
1510
  --_bu-bg-active: var(--black-150);
@@ -1613,6 +1529,7 @@ body.theme-highcontrast.theme-dark .s-btn.s-btn__danger.s-btn__filled {
1613
1529
  --_bu-outlined-bc-selected: var(--black-300);
1614
1530
  --_bu-outlined-bg-selected: var(--_bu-bg-selected);
1615
1531
  --_bu-outlined-fc-selected: var(--_bu-fc-selected);
1532
+ --_bu-number-fc-selected: var(--white);
1616
1533
  }
1617
1534
  body.theme-highcontrast .s-btn.s-btn__muted {
1618
1535
  --_bu-bg-hover: var(--black-225);
@@ -1622,9 +1539,10 @@ body.theme-highcontrast .s-btn.s-btn__muted {
1622
1539
  --_bu-filled-bg-selected: var(--black-500);
1623
1540
  --_bu-filled-fc: var(--white);
1624
1541
  --_bu-filled-fc-selected: var(--_bu-filled-fc);
1625
- }
1626
- body.theme-highcontrast .s-btn.s-btn__muted.s-btn__filled {
1627
- --_bu-number-fc: var(--black);
1542
+ --_bu-fc-selected: var(--black);
1543
+ --_bu-number-fc: var(--white);
1544
+ --_bu-number-fc-filled: var(--black);
1545
+ --_bu-number-fc-selected: var(--white);
1628
1546
  }
1629
1547
  .s-btn.s-btn__primary {
1630
1548
  --_bu-bg: var(--theme-button-primary-background-color);
@@ -1636,52 +1554,11 @@ body.theme-highcontrast .s-btn.s-btn__muted.s-btn__filled {
1636
1554
  --_bu-fc-hover: var(--theme-button-primary-hover-color);
1637
1555
  --_bu-fc-selected: var(--theme-button-primary-selected-color);
1638
1556
  --_bu-number-fc: var(--theme-button-primary-number-color);
1639
- }
1640
- @media (prefers-color-scheme: dark) {
1641
- body.theme-system .s-btn.s-btn__primary {
1642
- --_bu-bg: var(--theme-secondary-400);
1643
- --_bu-bg-active: var(--theme-secondary-400);
1644
- --_bu-bg-hover: var(--theme-secondary-400);
1645
- --_bu-fc: var(--black);
1646
- --_bu-fc-active: var(--_bu-fc);
1647
- --_bu-fc-hover: var(--_bu-fc);
1648
- --_bu-fc-selected: var(--white);
1649
- --_bu-number-fc: var(--white);
1650
- --_bu-number-fc-selected: var(--black);
1651
- }
1652
- }
1653
- body.theme-dark .s-btn.s-btn__primary,
1654
- .theme-dark__forced .s-btn.s-btn__primary,
1655
- body.theme-system .theme-dark__forced .s-btn.s-btn__primary {
1656
- --_bu-bg: var(--theme-secondary-400);
1657
- --_bu-bg-active: var(--theme-secondary-400);
1658
- --_bu-bg-hover: var(--theme-secondary-400);
1659
- --_bu-fc: var(--black);
1660
- --_bu-fc-active: var(--_bu-fc);
1661
- --_bu-fc-hover: var(--_bu-fc);
1662
- --_bu-fc-selected: var(--white);
1663
- --_bu-number-fc: var(--white);
1664
- --_bu-number-fc-selected: var(--black);
1557
+ --_bu-number-fc-selected: var(--theme-button-primary-number-color);
1665
1558
  }
1666
1559
  body.theme-highcontrast .s-btn.s-btn__primary {
1667
1560
  --_bu-bc: transparent;
1668
1561
  }
1669
- @media (prefers-color-scheme: dark) {
1670
- body.theme-highcontrast.theme-system .s-btn.s-btn__primary {
1671
- --_bu-bg: var(--theme-secondary-400);
1672
- --_bu-bg-active: var(--theme-secondary-500);
1673
- --_bu-bg-hover: var(--theme-secondary-400);
1674
- --_bu-fc: var(--white);
1675
- --_bu-number-fc: var(--black);
1676
- }
1677
- }
1678
- body.theme-highcontrast.theme-dark .s-btn.s-btn__primary {
1679
- --_bu-bg: var(--theme-secondary-400);
1680
- --_bu-bg-active: var(--theme-secondary-500);
1681
- --_bu-bg-hover: var(--theme-secondary-400);
1682
- --_bu-fc: var(--white);
1683
- --_bu-number-fc: var(--black);
1684
- }
1685
1562
  body.theme-highcontrast .s-btn.s-btn__facebook,
1686
1563
  body.theme-highcontrast .s-btn.s-btn__github {
1687
1564
  --_bu-bc: transparent;
@@ -1846,6 +1723,19 @@ a.s-card {
1846
1723
  .s-card.s-card__muted > * {
1847
1724
  opacity: 0.65;
1848
1725
  }
1726
+ @media (prefers-color-scheme: dark) {
1727
+ body.theme-system .s-card.s-card__muted > * {
1728
+ opacity: 0.7;
1729
+ }
1730
+ }
1731
+ body.theme-dark .s-card.s-card__muted > *,
1732
+ .theme-dark__forced .s-card.s-card__muted > *,
1733
+ body.theme-system .theme-dark__forced .s-card.s-card__muted > * {
1734
+ opacity: 0.7;
1735
+ }
1736
+ body.theme-highcontrast .s-card.s-card__muted > * {
1737
+ opacity: 0.75;
1738
+ }
1849
1739
  .s-card > :last-child {
1850
1740
  margin-bottom: 0;
1851
1741
  }
@@ -1998,7 +1888,7 @@ body.theme-system .theme-dark__forced .s-radio:checked {
1998
1888
  }
1999
1889
  .has-warning .s-checkbox,
2000
1890
  .has-warning .s-radio:not(:checked) {
2001
- --_ch-bc: var(--yellow-600);
1891
+ --_ch-bc: var(--yellow-500);
2002
1892
  --_ch-bs-focus: 0 0 0 var(--su-static4) var(--focus-ring-warning);
2003
1893
  }
2004
1894
  .s-check-control {
@@ -2371,7 +2261,7 @@ body.theme-highcontrast .has-success .s-textarea {
2371
2261
  }
2372
2262
  .has-warning .s-input,
2373
2263
  .has-warning .s-textarea {
2374
- --_in-bc: var(--yellow-600);
2264
+ --_in-bc: var(--yellow-500);
2375
2265
  --_in-bs-focus: 0 0 0 var(--su-static4) var(--focus-ring-warning);
2376
2266
  }
2377
2267
  body.theme-highcontrast .has-warning .s-input,
@@ -2562,7 +2452,7 @@ body.theme-highcontrast .s-input:focus-within {
2562
2452
  --_ii-fc: var(--green-400);
2563
2453
  }
2564
2454
  .has-warning .s-input-icon {
2565
- --_ii-fc: var(--yellow-500);
2455
+ --_ii-fc: var(--yellow-400);
2566
2456
  }
2567
2457
  .is-disabled .s-input-icon {
2568
2458
  --_ii-fc: var(--black-400);
@@ -2601,16 +2491,17 @@ fieldset[disabled] .s-input-message {
2601
2491
  .has-error .s-input-message {
2602
2492
  --_im-fc: var(--red-400);
2603
2493
  --_im-a-fc: var(--red-600);
2604
- --_im-a-fc-hover: var(--red-600);
2494
+ --_im-a-fc-hover: var(--red-500);
2605
2495
  }
2606
2496
  .has-success .s-input-message {
2607
2497
  --_im-fc: var(--green-400);
2608
2498
  --_im-a-fc: var(--green-600);
2609
- --_im-a-fc-hover: var(--green-600);
2499
+ --_im-a-fc-hover: var(--green-500);
2610
2500
  }
2611
2501
  .has-warning .s-input-message {
2612
- --_im-fc: var(--yellow-600);
2502
+ --_im-fc: var(--yellow-500);
2613
2503
  --_im-a-fc: var(--yellow-600);
2504
+ --_im-a-fc-hover: var(--yellow-500);
2614
2505
  }
2615
2506
  .s-input-message a {
2616
2507
  color: var(--_im-a-fc);
@@ -2673,40 +2564,16 @@ body.theme-highcontrast .s-label--status {
2673
2564
  --_la-status-b: var(--su-static1) solid currentColor;
2674
2565
  }
2675
2566
  .s-label--status__beta {
2676
- --_la-status-bg: var(--blue-300);
2567
+ --_la-status-bg: var(--blue-200);
2677
2568
  --_la-status-fc: var(--blue-500);
2678
2569
  }
2679
2570
  .s-label--status__new {
2680
- --_la-status-bg: var(--green-300);
2681
- --_la-status-fc: var(--green-500);
2682
- }
2683
- @media (prefers-color-scheme: dark) {
2684
- body.theme-system .s-label--status__new {
2685
- --_la-status-bg: var(--green-200);
2686
- --_la-status-fc: var(--green-600);
2687
- }
2688
- }
2689
- body.theme-dark .s-label--status__new,
2690
- .theme-dark__forced .s-label--status__new,
2691
- body.theme-system .theme-dark__forced .s-label--status__new {
2692
2571
  --_la-status-bg: var(--green-200);
2693
- --_la-status-fc: var(--green-600);
2572
+ --_la-status-fc: var(--green-500);
2694
2573
  }
2695
2574
  .s-label--status__required {
2696
- --_la-status-bg: var(--red-300);
2697
- --_la-status-fc: var(--red-500);
2698
- }
2699
- @media (prefers-color-scheme: dark) {
2700
- body.theme-system .s-label--status__required {
2701
- --_la-status-bg: var(--red-200);
2702
- --_la-status-fc: var(--red-600);
2703
- }
2704
- }
2705
- body.theme-dark .s-label--status__required,
2706
- .theme-dark__forced .s-label--status__required,
2707
- body.theme-system .theme-dark__forced .s-label--status__required {
2708
2575
  --_la-status-bg: var(--red-200);
2709
- --_la-status-fc: var(--red-600);
2576
+ --_la-status-fc: var(--red-500);
2710
2577
  }
2711
2578
  .s-label .s-description,
2712
2579
  .s-label .s-input-message {
@@ -2841,8 +2708,11 @@ button.s-link:focus {
2841
2708
  outline: revert;
2842
2709
  }
2843
2710
  .s-link-preview {
2711
+ --_lp-details-fc: var(--black-400);
2844
2712
  --_lp-details-mt: var(--su2);
2713
+ --_lp-footer-bg: var(--black-100);
2845
2714
  --_lp-footer-fd: unset;
2715
+ --_lp-header-bg: var(--black-100);
2846
2716
  --_lp-misc-pl: var(--su4);
2847
2717
  --_lp-misc-pt: unset;
2848
2718
  border: var(--su-static1) solid var(--bc-medium);
@@ -2858,9 +2728,14 @@ button.s-link:focus {
2858
2728
  --_lp-misc-pt: var(--su2);
2859
2729
  }
2860
2730
  }
2731
+ body.theme-highcontrast .s-link-preview {
2732
+ --_lp-details-fc: var(--black-600);
2733
+ --_lp-footer-bg: var(--black-050);
2734
+ --_lp-header-bg: var(--black-050);
2735
+ }
2861
2736
  .s-link-preview .s-link-preview--details a,
2862
2737
  .s-link-preview .s-link-preview--footer a {
2863
- color: var(--black-400);
2738
+ color: var(--black-600);
2864
2739
  cursor: pointer;
2865
2740
  text-decoration: none;
2866
2741
  }
@@ -2889,13 +2764,13 @@ button.s-link:focus {
2889
2764
  max-height: 400px;
2890
2765
  }
2891
2766
  .s-link-preview .s-link-preview--details {
2767
+ color: var(--_lp-details-fc);
2892
2768
  margin-top: var(--_lp-details-mt);
2893
- color: var(--black-400);
2894
2769
  font-size: var(--fs-caption);
2895
2770
  }
2896
2771
  .s-link-preview .s-link-preview--footer {
2772
+ background: var(--_lp-footer-bg);
2897
2773
  flex-direction: var(--_lp-footer-fd);
2898
- background: var(--black-100);
2899
2774
  border-bottom-left-radius: var(--br-sm);
2900
2775
  border-bottom-right-radius: var(--br-sm);
2901
2776
  border-top: var(--su-static1) solid var(--bc-medium);
@@ -2905,7 +2780,7 @@ button.s-link:focus {
2905
2780
  padding: var(--su12);
2906
2781
  }
2907
2782
  .s-link-preview .s-link-preview--header {
2908
- background: var(--black-100);
2783
+ background: var(--_lp-header-bg);
2909
2784
  border-bottom: var(--su-static1) solid var(--bc-medium);
2910
2785
  border-top-left-radius: var(--br-sm);
2911
2786
  border-top-right-radius: var(--br-sm);
@@ -3257,11 +3132,12 @@ body.theme-highcontrast .s-navigation .s-navigation--item.is-selected {
3257
3132
  --_na-title-mt: 0;
3258
3133
  }
3259
3134
  .s-notice {
3260
- --_no-bc: var(--bc-medium);
3135
+ --_no-bc: var(--black-225);
3261
3136
  --_no-bg: var(--black-150);
3262
- --_no-fc: var(--fc-medium);
3137
+ --_no-fc: var(--black-500);
3263
3138
  --_no-btn-bg-focus: var(--black-225);
3264
3139
  --_no-btn-bg-active: var(--black-250);
3140
+ --_no-btn-fc: var(--_no-fc);
3265
3141
  background: var(--_no-bg);
3266
3142
  border-color: var(--_no-bc);
3267
3143
  color: var(--_no-fc);
@@ -3298,174 +3174,111 @@ body.theme-highcontrast.theme-dark .s-notice:not(.s-notice__important) {
3298
3174
  --_no-fc: var(--white);
3299
3175
  --_no-btn-bg-focus: var(--black-600);
3300
3176
  --_no-btn-bg-active: var(--black-600);
3301
- }
3302
- body.theme-highcontrast .s-notice__important {
3303
- --_no-bc: var(--_no-bg);
3177
+ --_no-btn-fc: var(--_no-fc);
3178
+ --_no-code-bg: var(--black-300);
3304
3179
  }
3305
3180
  .s-notice__danger {
3306
3181
  --_no-bc: var(--red-300);
3307
- --_no-bg: var(--red-200);
3308
- --_no-btn-bg-active: var(--red-300);
3309
- --_no-btn-bg-focus: var(--red-300);
3310
- }
3311
- body.theme-highcontrast .s-notice__danger:not(.s-notice__important) {
3312
- --_no-bg: var(--red-300);
3182
+ --_no-bg: var(--red-100);
3183
+ --_no-btn-bg-active: var(--red-200);
3184
+ --_no-btn-bg-focus: var(--red-200);
3185
+ --_no-btn-fc: var(--red-500);
3186
+ --_no-code-bg: var(--red-300);
3313
3187
  }
3314
3188
  .s-notice__danger.s-notice__important {
3315
3189
  --_no-bc: var(--_no-bg);
3316
3190
  --_no-bg: var(--red-400);
3317
3191
  --_no-btn-bg-active: var(--red-500);
3318
3192
  --_no-btn-bg-focus: var(--red-500);
3193
+ --_no-btn-fc: var(--red-100);
3319
3194
  }
3320
- @media (prefers-color-scheme: dark) {
3321
- body.theme-system .s-notice__danger.s-notice__important {
3322
- --_no-bg: var(--red-400);
3323
- --_no-fc: var(--black-600);
3324
- }
3325
- }
3326
- body.theme-dark .s-notice__danger.s-notice__important,
3327
- .theme-dark__forced .s-notice__danger.s-notice__important,
3328
- body.theme-system .theme-dark__forced .s-notice__danger.s-notice__important {
3329
- --_no-bg: var(--red-400);
3330
- --_no-fc: var(--black-600);
3331
- }
3332
- @media (prefers-color-scheme: dark) {
3333
- body.theme-highcontrast.theme-system .s-notice__danger.s-notice__important {
3334
- --_no-bg: var(--red-400);
3335
- --_no-fc: var(--white);
3336
- }
3337
- }
3338
- body.theme-highcontrast.theme-dark .s-notice__danger.s-notice__important {
3339
- --_no-bg: var(--red-400);
3340
- --_no-fc: var(--white);
3195
+ body.theme-highcontrast .s-notice__danger.s-notice__important {
3196
+ --_no-bg: var(--red-500);
3341
3197
  }
3342
3198
  .s-notice__info {
3343
3199
  --_no-bc: var(--theme-secondary-300);
3344
- --_no-bg: var(--theme-secondary-200);
3345
- --_no-btn-bg-focus: var(--theme-secondary-300);
3346
- --_no-btn-bg-active: var(--theme-secondary-300);
3200
+ --_no-bg: var(--theme-secondary-100);
3201
+ --_no-btn-bg-focus: var(--theme-secondary-200);
3202
+ --_no-btn-bg-active: var(--theme-secondary-200);
3203
+ --_no-btn-fc: var(--theme-secondary-500);
3347
3204
  --_no-code-bg: var(--theme-secondary-300);
3348
3205
  }
3349
- body.theme-highcontrast .s-notice__info:not(.s-notice__important) {
3350
- --_no-bg: var(--theme-secondary-300);
3351
- }
3352
- @media (prefers-color-scheme: dark) {
3353
- body.theme-highcontrast.theme-system .s-notice__info:not(.s-notice__important) {
3354
- --_no-bg: var(--theme-secondary-300);
3355
- }
3356
- }
3357
- body.theme-highcontrast.theme-dark .s-notice__info:not(.s-notice__important) {
3358
- --_no-bg: var(--theme-secondary-300);
3359
- }
3360
3206
  .s-notice__info.s-notice__important {
3361
3207
  --_no-bc: var(--_no-bg);
3362
3208
  --_no-bg: var(--theme-secondary-400);
3363
3209
  --_no-btn-bg-active: var(--theme-secondary-500);
3364
- --_no-btn-bg-focus: var(--theme-secondary-400);
3365
- }
3366
- @media (prefers-color-scheme: dark) {
3367
- body.theme-system .s-notice__info.s-notice__important {
3368
- --_no-bg: var(--theme-secondary-400);
3369
- --_no-fc: var(--black-600);
3370
- }
3371
- }
3372
- body.theme-dark .s-notice__info.s-notice__important,
3373
- .theme-dark__forced .s-notice__info.s-notice__important,
3374
- body.theme-system .theme-dark__forced .s-notice__info.s-notice__important {
3375
- --_no-bg: var(--theme-secondary-400);
3376
- --_no-fc: var(--black-600);
3210
+ --_no-btn-bg-focus: var(--theme-secondary-500);
3211
+ --_no-btn-fc: var(--theme-secondary-100);
3377
3212
  }
3378
- @media (prefers-color-scheme: dark) {
3379
- body.theme-highcontrast.theme-system .s-notice__info.s-notice__important {
3380
- --_no-bg: var(--theme-secondary-400);
3381
- --_no-fc: var(--white);
3382
- }
3383
- }
3384
- body.theme-highcontrast.theme-dark .s-notice__info.s-notice__important {
3385
- --_no-bg: var(--theme-secondary-400);
3386
- --_no-fc: var(--white);
3213
+ body.theme-highcontrast .s-notice__info.s-notice__important {
3214
+ --_no-bg: var(--theme-secondary-500);
3387
3215
  }
3388
3216
  .s-notice__success {
3389
3217
  --_no-bc: var(--green-300);
3390
- --_no-bg: var(--green-200);
3391
- --_no-btn-bg-active: var(--green-300);
3392
- --_no-btn-bg-focus: var(--green-300);
3393
- }
3394
- body.theme-highcontrast .s-notice__success:not(.s-notice__important) {
3395
- --_no-bg: var(--green-300);
3218
+ --_no-bg: var(--green-100);
3219
+ --_no-btn-bg-active: var(--green-200);
3220
+ --_no-btn-bg-focus: var(--green-200);
3221
+ --_no-btn-fc: var(--green-500);
3222
+ --_no-code-bg: var(--green-300);
3396
3223
  }
3397
3224
  .s-notice__success.s-notice__important {
3398
3225
  --_no-bc: var(--_no-bg);
3399
3226
  --_no-bg: var(--green-400);
3400
- --_no-fc: var(--black-600);
3401
3227
  --_no-btn-bg-active: var(--green-500);
3402
- --_no-btn-bg-focus: var(--green-400);
3403
- }
3404
- @media (prefers-color-scheme: dark) {
3405
- body.theme-system .s-notice__success.s-notice__important {
3406
- --_no-bg: var(--green-400);
3407
- --_no-fc: var(--white);
3408
- }
3409
- }
3410
- body.theme-dark .s-notice__success.s-notice__important,
3411
- .theme-dark__forced .s-notice__success.s-notice__important,
3412
- body.theme-system .theme-dark__forced .s-notice__success.s-notice__important {
3413
- --_no-bg: var(--green-400);
3414
- --_no-fc: var(--white);
3228
+ --_no-btn-bg-focus: var(--green-500);
3229
+ --_no-btn-fc: var(--green-100);
3415
3230
  }
3416
3231
  body.theme-highcontrast .s-notice__success.s-notice__important {
3417
- --_no-bg: var(--green-400);
3418
- --_no-fc: var(--white);
3232
+ --_no-bg: var(--green-500);
3419
3233
  }
3420
3234
  .s-notice__warning {
3421
- --_no-bc: var(--yellow-400);
3422
- --_no-bg: var(--yellow-200);
3423
- --_no-btn-bg-active: var(--yellow-400);
3424
- --_no-btn-bg-focus: var(--yellow-300);
3235
+ --_no-bc: var(--yellow-300);
3236
+ --_no-bg: var(--yellow-100);
3237
+ --_no-btn-bg-active: var(--yellow-200);
3238
+ --_no-btn-bg-focus: var(--yellow-200);
3239
+ --_no-btn-fc: var(--yellow-600);
3425
3240
  --_no-code-bg: var(--yellow-300);
3426
3241
  }
3427
- body.theme-highcontrast .s-notice__warning:not(.s-notice__important) {
3428
- --_no-bg: var(--yellow-300);
3429
- }
3430
3242
  .s-notice__warning.s-notice__important {
3431
3243
  --_no-bc: var(--_no-bg);
3432
3244
  --_no-bg: var(--yellow-400);
3433
- --_no-fc: var(--black-600);
3434
- --_no-btn-bg-active: var(--yellow-500);
3435
- --_no-btn-bg-focus: var(--yellow-400);
3245
+ --_no-fc: var(--black);
3246
+ --_no-btn-fc: var(--_no-fc);
3247
+ --_no-btn-bg-active: var(--yellow-300);
3248
+ --_no-btn-bg-focus: var(--yellow-300);
3436
3249
  }
3437
3250
  @media (prefers-color-scheme: dark) {
3438
3251
  body.theme-system .s-notice__warning.s-notice__important {
3439
- --_no-bg: var(--yellow-500);
3440
- --_no-fc: var(--white);
3252
+ --_no-fc: var(--yellow-200);
3441
3253
  }
3442
3254
  }
3443
3255
  body.theme-dark .s-notice__warning.s-notice__important,
3444
3256
  .theme-dark__forced .s-notice__warning.s-notice__important,
3445
3257
  body.theme-system .theme-dark__forced .s-notice__warning.s-notice__important {
3446
- --_no-bg: var(--yellow-500);
3447
- --_no-fc: var(--white);
3258
+ --_no-fc: var(--yellow-200);
3448
3259
  }
3449
3260
  body.theme-highcontrast .s-notice__warning.s-notice__important {
3450
3261
  --_no-bg: var(--yellow-500);
3451
3262
  --_no-fc: var(--white);
3263
+ --_no-btn-bg-active: transparent;
3264
+ --_no-btn-bg-focus: transparent;
3452
3265
  }
3453
3266
  .s-notice code {
3454
3267
  background: var(--_no-code-bg, transparent);
3455
3268
  }
3456
3269
  .s-notice .s-notice--btn {
3457
- color: inherit;
3270
+ color: var(--_no-btn-fc, inherit) !important;
3458
3271
  padding: var(--su8);
3459
3272
  }
3460
3273
  .s-notice .s-notice--btn:not(:focus) {
3461
3274
  box-shadow: none;
3462
3275
  }
3463
3276
  .s-notice .s-notice--btn:active {
3464
- background: var(--_no-btn-bg-active);
3277
+ background-color: var(--_no-btn-bg-active, inherit) !important;
3465
3278
  }
3466
3279
  .s-notice .s-notice--btn:focus,
3467
3280
  .s-notice .s-notice--btn:hover {
3468
- background: var(--_no-btn-bg-focus);
3281
+ background-color: var(--_no-btn-bg-focus, inherit) !important;
3469
3282
  }
3470
3283
  .s-page-title {
3471
3284
  --_pt-ai: flex-end;
@@ -4123,13 +3936,13 @@ body.theme-highcontrast .s-post-summary .s-post-summary--answer:before {
4123
3936
  color: var(--white);
4124
3937
  }
4125
3938
  .s-post-summary .s-post-summary--stats-item.is-warm {
4126
- color: var(--_ps-state-fc, var(--yellow-600));
3939
+ color: var(--_ps-state-fc, var(--yellow-500));
4127
3940
  }
4128
3941
  .s-post-summary .s-post-summary--stats-item.is-hot {
4129
- color: var(--_ps-state-fc, var(--orange-600));
3942
+ color: var(--_ps-state-fc, var(--orange-500));
4130
3943
  }
4131
3944
  .s-post-summary .s-post-summary--stats-item.is-supernova {
4132
- color: var(--_ps-state-fc, var(--red-600));
3945
+ color: var(--_ps-state-fc, var(--red-500));
4133
3946
  }
4134
3947
  .s-post-summary .s-post-summary--stats-item.is-archived {
4135
3948
  background-color: var(--black-225);
@@ -4914,7 +4727,7 @@ body.theme-highcontrast .s-prose {
4914
4727
  --_se-select-bs-focus: 0 0 0 var(--su-static4) var(--focus-ring-success);
4915
4728
  }
4916
4729
  .has-warning .s-select {
4917
- --_se-select-bc: var(--yellow-600);
4730
+ --_se-select-bc: var(--yellow-500);
4918
4731
  --_se-select-bs-focus: 0 0 0 var(--su-static4) var(--focus-ring-warning);
4919
4732
  }
4920
4733
  .is-disabled .s-select {
@@ -5039,7 +4852,7 @@ body.theme-highcontrast .s-select > select:focus {
5039
4852
  }
5040
4853
  .s-sidebarwidget.s-sidebarwidget__blue {
5041
4854
  --_sw-bc: var(--blue-300);
5042
- background-color: var(--blue-200);
4855
+ background-color: var(--blue-100);
5043
4856
  border-color: var(--_sw-bc);
5044
4857
  }
5045
4858
  body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__blue {
@@ -5051,12 +4864,12 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__blue {
5051
4864
  border-color: var(--_sw-bc);
5052
4865
  }
5053
4866
  .s-sidebarwidget.s-sidebarwidget__blue .s-sidebarwidget--header {
5054
- background-color: var(--blue-300);
4867
+ background-color: var(--blue-200);
5055
4868
  color: var(--fc-medium);
5056
4869
  }
5057
4870
  .s-sidebarwidget.s-sidebarwidget__yellow {
5058
4871
  --_sw-bc: var(--yellow-300);
5059
- background-color: var(--yellow-200);
4872
+ background-color: var(--yellow-100);
5060
4873
  border-color: var(--_sw-bc);
5061
4874
  }
5062
4875
  body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__yellow {
@@ -5068,12 +4881,12 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__yellow {
5068
4881
  border-color: var(--_sw-bc);
5069
4882
  }
5070
4883
  .s-sidebarwidget.s-sidebarwidget__yellow .s-sidebarwidget--header {
5071
- background-color: var(--yellow-300);
4884
+ background-color: var(--yellow-200);
5072
4885
  color: var(--fc-medium);
5073
4886
  }
5074
4887
  .s-sidebarwidget.s-sidebarwidget__green {
5075
4888
  --_sw-bc: var(--green-300);
5076
- background-color: var(--green-200);
4889
+ background-color: var(--green-100);
5077
4890
  border-color: var(--_sw-bc);
5078
4891
  }
5079
4892
  body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
@@ -5085,7 +4898,7 @@ body.theme-highcontrast .s-sidebarwidget.s-sidebarwidget__green {
5085
4898
  border-color: var(--_sw-bc);
5086
4899
  }
5087
4900
  .s-sidebarwidget.s-sidebarwidget__green .s-sidebarwidget--header {
5088
- background-color: var(--green-300);
4901
+ background-color: var(--green-200);
5089
4902
  color: var(--fc-medium);
5090
4903
  }
5091
4904
  .s-sidebarwidget .s-sidebarwidget--action {
@@ -5862,21 +5675,8 @@ fieldset[disabled] .s-toggle-switch label,
5862
5675
  --_ts-multiple-bg: var(--black-400);
5863
5676
  --_ts-multiple-fc: var(--white);
5864
5677
  }
5865
- @media (prefers-color-scheme: dark) {
5866
- body.theme-system .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked + label.s-toggle-switch--label-off {
5867
- --_ts-multiple-bg: var(--black-350);
5868
- }
5869
- }
5870
- body.theme-dark .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked + label.s-toggle-switch--label-off,
5871
- .theme-dark__forced .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked + label.s-toggle-switch--label-off,
5872
- body.theme-system .theme-dark__forced .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked + label.s-toggle-switch--label-off {
5873
- --_ts-multiple-bg: var(--black-350);
5874
- }
5875
5678
  .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked + label:not(.s-toggle-switch--label-off) {
5876
5679
  --_ts-multiple-bg: var(--green-400);
5877
- --_ts-multiple-fc: var(--_white-static);
5878
- }
5879
- body.theme-highcontrast .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked + label:not(.s-toggle-switch--label-off) {
5880
5680
  --_ts-multiple-fc: var(--white);
5881
5681
  }
5882
5682
  .s-toggle-switch.s-toggle-switch__multiple input[type="radio"]:checked:focus + label {
@@ -5914,6 +5714,7 @@ input[type="checkbox"].s-toggle-switch {
5914
5714
  background-repeat: no-repeat;
5915
5715
  border-radius: 1000px;
5916
5716
  cursor: pointer;
5717
+ flex-shrink: 0;
5917
5718
  height: var(--su-static24);
5918
5719
  margin: 0;
5919
5720
  transition: background-position 0.2s ease;
@@ -6050,9 +5851,9 @@ body.theme-highcontrast .s-topbar {
6050
5851
  --theme-topbar-bottom-border: 1px solid hsl(210, 8%, 85%);
6051
5852
  --theme-topbar-search-color: hsl(210, 8%, 25%);
6052
5853
  --theme-topbar-search-background: var(--_white-static);
6053
- --theme-topbar-search-placeholder: hsl(210, 8%, 45%);
6054
- --theme-topbar-search-border: hsl(213, 9%, 75%);
6055
- --theme-topbar-search-border-focus: hsl(210, 70%, 48%);
5854
+ --theme-topbar-search-placeholder: hsl(210, 8%, 42%);
5855
+ --theme-topbar-search-border: hsl(210, 9%, 75%);
5856
+ --theme-topbar-search-border-focus: hsl(210, 77%, 46%);
6056
5857
  --theme-topbar-search-shadow-focus: 0 0 0 var(--su-static4) var(--focus-ring);
6057
5858
  --theme-topbar-select-color: hsl(210, 8%, 25%);
6058
5859
  --theme-topbar-select-background: hsl(210, 8%, 95%);
@@ -6309,34 +6110,40 @@ body.theme-highcontrast .s-topbar__dark .s-badge {
6309
6110
  body.theme-highcontrast .s-uploader {
6310
6111
  --_up-bg-bc-hc: var(--black-400);
6311
6112
  }
6113
+ body.theme-highcontrast .s-uploader.has-error {
6114
+ --_up-bg-bc-hc-state: var(--red-500);
6115
+ }
6116
+ body.theme-highcontrast .s-uploader.has-success {
6117
+ --_up-bg-bc-hc-state: var(--green-400);
6118
+ }
6119
+ body.theme-highcontrast .s-uploader.has-warning {
6120
+ --_up-bg-bc-hc-state: var(--yellow-500);
6121
+ }
6312
6122
  .s-uploader.has-error .s-link,
6313
6123
  .s-uploader.has-success .s-link,
6314
6124
  .s-uploader.has-warning .s-link {
6315
6125
  color: var(--_up-link-fc);
6316
6126
  }
6317
6127
  .s-uploader.has-error {
6318
- --_up-bg: var(--red-200);
6319
- --_up-bg-focus: var(--red-300);
6320
- --_up-bg-bc: var(--red-400);
6321
- --_up-bg-bc-hc-state: var(--red-400);
6128
+ --_up-bg: var(--red-100);
6129
+ --_up-bg-focus: var(--red-200);
6130
+ --_up-bg-bc: var(--red-300);
6322
6131
  --_up-focus-ring-color: var(--focus-ring-error);
6323
- --_up-link-fc: var(--red-600);
6132
+ --_up-link-fc: var(--red-500);
6324
6133
  }
6325
6134
  .s-uploader.has-success {
6326
6135
  --_up-bg: var(--green-100);
6327
6136
  --_up-bg-focus: var(--green-200);
6328
- --_up-bg-bc: var(--green-400);
6329
- --_up-bg-bc-hc-state: var(--green-400);
6137
+ --_up-bg-bc: var(--green-300);
6330
6138
  --_up-focus-ring-color: var(--focus-ring-success);
6331
- --_up-link-fc: var(--green-600);
6139
+ --_up-link-fc: var(--green-400);
6332
6140
  }
6333
6141
  .s-uploader.has-warning {
6334
- --_up-bg: var(--yellow-200);
6335
- --_up-bg-focus: var(--yellow-300);
6336
- --_up-bg-bc: var(--yellow-400);
6337
- --_up-bg-bc-hc-state: var(--yellow-400);
6142
+ --_up-bg: var(--yellow-100);
6143
+ --_up-bg-focus: var(--yellow-200);
6144
+ --_up-bg-bc: var(--yellow-300);
6338
6145
  --_up-focus-ring-color: var(--focus-ring-warning);
6339
- --_up-link-fc: var(--yellow-600);
6146
+ --_up-link-fc: var(--yellow-500);
6340
6147
  }
6341
6148
  .s-uploader.is-active {
6342
6149
  --_up-bg: var(--black-150);
@@ -7575,7 +7382,7 @@ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
7575
7382
  body {
7576
7383
  --_o-disabled: 0.5;
7577
7384
  --_o-disabled-static: 0.5;
7578
- --_black-static: hsl(0, 8%, 5%);
7385
+ --_black-static: hsl(210, 8%, 5%);
7579
7386
  --_white-static: hsl(0, 0%, 100%);
7580
7387
  --bg-error: var(--red-400);
7581
7388
  --bg-danger: var(--red-400);
@@ -7599,7 +7406,7 @@ body {
7599
7406
  --theme-link-color-visited: var(--theme-secondary-500);
7600
7407
  --theme-button-color: var(--theme-secondary-400);
7601
7408
  --theme-button-background-color: transparent;
7602
- --theme-button-hover-color: var(--theme-secondary-400);
7409
+ --theme-button-hover-color: var(--theme-secondary-500);
7603
7410
  --theme-button-hover-background-color: var(--theme-secondary-200);
7604
7411
  --theme-button-active-background-color: var(--theme-secondary-300);
7605
7412
  --theme-button-selected-color: var(--theme-secondary-600);
@@ -7607,8 +7414,8 @@ body {
7607
7414
  --theme-button-primary-color: var(--white);
7608
7415
  --theme-button-primary-background-color: var(--theme-secondary-400);
7609
7416
  --theme-button-primary-hover-color: var(--white);
7610
- --theme-button-primary-hover-background-color: var(--theme-secondary-400);
7611
- --theme-button-primary-active-background-color: var(--theme-secondary-500);
7417
+ --theme-button-primary-hover-background-color: var(--theme-secondary-500);
7418
+ --theme-button-primary-active-background-color: var(--theme-secondary-600);
7612
7419
  --theme-button-primary-selected-color: var(--white);
7613
7420
  --theme-button-primary-selected-background-color: var(--theme-secondary-500);
7614
7421
  --theme-button-primary-number-color: var(--theme-secondary-600);
@@ -7674,23 +7481,23 @@ body:not(.theme-highcontrast).theme-system .theme-light__forced .themed {
7674
7481
  --black-200: hsl(210, 8%, 90%);
7675
7482
  --black-225: hsl(210, 8%, 85%);
7676
7483
  --black-250: hsl(210, 8%, 80%);
7677
- --black-300: hsl(213, 9%, 75%);
7678
- --black-350: hsl(212, 8%, 68%);
7679
- --black-400: hsl(210, 8%, 45%);
7484
+ --black-300: hsl(210, 9%, 75%);
7485
+ --black-350: hsl(210, 8%, 68%);
7486
+ --black-400: hsl(210, 8%, 42%);
7680
7487
  --black-500: hsl(210, 8%, 25%);
7681
7488
  --black-600: hsl(210, 8%, 5%);
7682
- --black: hsl(0, 8%, 5%);
7489
+ --black: hsl(210, 8%, 5%);
7683
7490
  --orange-100: hsl(23, 85%, 97%);
7684
7491
  --orange-200: hsl(27, 85%, 87%);
7685
7492
  --orange-300: hsl(27, 85%, 72%);
7686
- --orange-400: hsl(27, 90%, 55%);
7687
- --orange-500: hsl(27, 88%, 43%);
7493
+ --orange-400: hsl(27, 80%, 52%);
7494
+ --orange-500: hsl(27, 80%, 43%);
7688
7495
  --orange-600: hsl(27, 80%, 29%);
7689
7496
  --blue-100: hsl(210, 80%, 96%);
7690
7497
  --blue-200: hsl(210, 80%, 91%);
7691
7498
  --blue-300: hsl(210, 78%, 76%);
7692
- --blue-400: hsl(210, 70%, 48%);
7693
- --blue-500: hsl(210, 75%, 36%);
7499
+ --blue-400: hsl(210, 77%, 46%);
7500
+ --blue-500: hsl(210, 77%, 36%);
7694
7501
  --blue-600: hsl(210, 80%, 23%);
7695
7502
  --green-100: hsl(148, 35%, 95%);
7696
7503
  --green-200: hsl(148, 35%, 88%);
@@ -7710,6 +7517,12 @@ body:not(.theme-highcontrast).theme-system .theme-light__forced .themed {
7710
7517
  --yellow-400: hsl(43, 85%, 50%);
7711
7518
  --yellow-500: hsl(43, 85%, 33%);
7712
7519
  --yellow-600: hsl(43, 84%, 18%);
7520
+ --purple-100: hsl(237, 80%, 96%);
7521
+ --purple-200: hsl(237, 77%, 92%);
7522
+ --purple-300: hsl(237, 60%, 83%);
7523
+ --purple-400: hsl(237, 55%, 57%);
7524
+ --purple-500: hsl(237, 50%, 45%);
7525
+ --purple-600: hsl(237, 50%, 32%);
7713
7526
  --gold-100: hsl(46, 100%, 91%);
7714
7527
  --gold-200: hsl(46, 100%, 74%);
7715
7528
  --gold-300: hsl(45, 100%, 42%);
@@ -7786,49 +7599,55 @@ body:not(.theme-highcontrast).theme-dark.themed,
7786
7599
  body:not(.theme-highcontrast):not(.theme-dark) .theme-dark__forced.themed,
7787
7600
  body:not(.theme-highcontrast).theme-dark .themed,
7788
7601
  body:not(.theme-highcontrast):not(.theme-dark) .theme-dark__forced .themed {
7789
- --white: hsl(220, 3%, 15%);
7790
- --black-050: hsl(220, 3%, 15%);
7791
- --black-100: hsl(220, 3%, 18%);
7792
- --black-150: hsl(230, 4%, 21%);
7793
- --black-200: hsl(233, 4%, 27%);
7794
- --black-225: hsl(233, 4%, 30%);
7795
- --black-250: hsl(235, 5%, 36%);
7796
- --black-300: hsl(233, 4%, 47%);
7797
- --black-350: hsl(219, 10%, 60%);
7798
- --black-400: hsl(220, 10%, 74%);
7799
- --black-500: hsl(220, 10%, 83%);
7800
- --black-600: hsl(180, 11%, 98%);
7602
+ --white: hsl(210, 3%, 15%);
7603
+ --black-050: hsl(210, 3%, 15%);
7604
+ --black-100: hsl(210, 3%, 18%);
7605
+ --black-150: hsl(210, 4%, 21%);
7606
+ --black-200: hsl(210, 4%, 27%);
7607
+ --black-225: hsl(210, 4%, 30%);
7608
+ --black-250: hsl(210, 5%, 36%);
7609
+ --black-300: hsl(210, 4%, 47%);
7610
+ --black-350: hsl(210, 8%, 70%);
7611
+ --black-400: hsl(210, 8%, 80%);
7612
+ --black-500: hsl(210, 8%, 90%);
7613
+ --black-600: hsl(210, 11%, 98%);
7801
7614
  --black: hsl(0, 0%, 100%);
7802
7615
  --orange-100: hsl(27, 29%, 19%);
7803
7616
  --orange-200: hsl(27, 43%, 31%);
7804
7617
  --orange-300: hsl(27, 43%, 47%);
7805
- --orange-400: hsl(27, 80%, 64%);
7806
- --orange-500: hsl(27, 80%, 78%);
7807
- --orange-600: hsl(27, 80%, 89%);
7618
+ --orange-400: hsl(27, 80%, 80%);
7619
+ --orange-500: hsl(27, 80%, 88%);
7620
+ --orange-600: hsl(27, 80%, 93%);
7808
7621
  --blue-100: hsl(209, 29%, 19%);
7809
7622
  --blue-200: hsl(210, 29%, 35%);
7810
7623
  --blue-300: hsl(210, 29%, 50%);
7811
- --blue-400: hsl(210, 81%, 72%);
7812
- --blue-500: hsl(210, 80%, 82%);
7813
- --blue-600: hsl(210, 80%, 90%);
7624
+ --blue-400: hsl(210, 80%, 80%);
7625
+ --blue-500: hsl(210, 80%, 88%);
7626
+ --blue-600: hsl(210, 80%, 93%);
7814
7627
  --green-100: hsl(148, 29%, 19%);
7815
7628
  --green-200: hsl(148, 29%, 27%);
7816
7629
  --green-300: hsl(148, 25%, 40%);
7817
- --green-400: hsl(148, 40%, 62%);
7818
- --green-500: hsl(148, 40%, 75%);
7819
- --green-600: hsl(148, 40%, 87%);
7630
+ --green-400: hsl(148, 40%, 75%);
7631
+ --green-500: hsl(148, 40%, 85%);
7632
+ --green-600: hsl(148, 40%, 93%);
7820
7633
  --red-100: hsl(358, 29%, 19%);
7821
7634
  --red-200: hsl(0, 29%, 37%);
7822
7635
  --red-300: hsl(0, 34%, 54%);
7823
- --red-400: hsl(0, 75%, 77%);
7824
- --red-500: hsl(0, 69%, 85%);
7825
- --red-600: hsl(0, 69%, 93%);
7636
+ --red-400: hsl(0, 73%, 85%);
7637
+ --red-500: hsl(0, 73%, 91%);
7638
+ --red-600: hsl(0, 73%, 95%);
7826
7639
  --yellow-100: hsl(43, 29%, 17%);
7827
7640
  --yellow-200: hsl(43, 29%, 25%);
7828
7641
  --yellow-300: hsl(43, 29%, 40%);
7829
- --yellow-400: hsl(43, 59%, 64%);
7830
- --yellow-500: hsl(43, 65%, 70%);
7831
- --yellow-600: hsl(43, 65%, 85%);
7642
+ --yellow-400: hsl(43, 75%, 75%);
7643
+ --yellow-500: hsl(43, 75%, 85%);
7644
+ --yellow-600: hsl(43, 75%, 91%);
7645
+ --purple-100: hsl(237, 25%, 24%);
7646
+ --purple-200: hsl(237, 27%, 38%);
7647
+ --purple-300: hsl(237, 32%, 56%);
7648
+ --purple-400: hsl(237, 58%, 86%);
7649
+ --purple-500: hsl(237, 60%, 91%);
7650
+ --purple-600: hsl(237, 65%, 96%);
7832
7651
  --gold-100: hsl(45, 29%, 24%);
7833
7652
  --gold-200: hsl(45, 47%, 37%);
7834
7653
  --gold-300: hsl(45, 92%, 62%);
@@ -7857,12 +7676,12 @@ body:not(.theme-highcontrast):not(.theme-dark) .theme-dark__forced .themed {
7857
7676
  --focus-ring-error: hsla(358, 62%, 47%, 0.15);
7858
7677
  --focus-ring-muted: hsla(210, 8%, 15%, 0.1);
7859
7678
  --highlight-addition: var(--green-500);
7860
- --highlight-attribute: hsl(207, 41.5%, 67%);
7679
+ --highlight-attribute: var(--blue-400);
7861
7680
  --highlight-bg: hsl(0, 2%, 11%);
7862
7681
  --highlight-color: var(--black);
7863
7682
  --highlight-comment: hsl(0, 0%, 60%);
7864
7683
  --highlight-deletion: var(--red-500);
7865
- --highlight-keyword: hsl(208, 41.5%, 67%);
7684
+ --highlight-keyword: var(--blue-400);
7866
7685
  --highlight-literal: hsl(27, 85%, 61.5%);
7867
7686
  --highlight-namespace: hsl(27, 85%, 61.5%);
7868
7687
  --highlight-punctuation: hsl(0, 0%, 80%);
@@ -7903,49 +7722,55 @@ body:not(.theme-highcontrast):not(.theme-dark) .theme-dark__forced .themed {
7903
7722
  body:not(.theme-highcontrast).theme-system,
7904
7723
  body:not(.theme-highcontrast).theme-system.themed,
7905
7724
  body:not(.theme-highcontrast).theme-system .themed {
7906
- --white: hsl(220, 3%, 15%);
7907
- --black-050: hsl(220, 3%, 15%);
7908
- --black-100: hsl(220, 3%, 18%);
7909
- --black-150: hsl(230, 4%, 21%);
7910
- --black-200: hsl(233, 4%, 27%);
7911
- --black-225: hsl(233, 4%, 30%);
7912
- --black-250: hsl(235, 5%, 36%);
7913
- --black-300: hsl(233, 4%, 47%);
7914
- --black-350: hsl(219, 10%, 60%);
7915
- --black-400: hsl(220, 10%, 74%);
7916
- --black-500: hsl(220, 10%, 83%);
7917
- --black-600: hsl(180, 11%, 98%);
7725
+ --white: hsl(210, 3%, 15%);
7726
+ --black-050: hsl(210, 3%, 15%);
7727
+ --black-100: hsl(210, 3%, 18%);
7728
+ --black-150: hsl(210, 4%, 21%);
7729
+ --black-200: hsl(210, 4%, 27%);
7730
+ --black-225: hsl(210, 4%, 30%);
7731
+ --black-250: hsl(210, 5%, 36%);
7732
+ --black-300: hsl(210, 4%, 47%);
7733
+ --black-350: hsl(210, 8%, 70%);
7734
+ --black-400: hsl(210, 8%, 80%);
7735
+ --black-500: hsl(210, 8%, 90%);
7736
+ --black-600: hsl(210, 11%, 98%);
7918
7737
  --black: hsl(0, 0%, 100%);
7919
7738
  --orange-100: hsl(27, 29%, 19%);
7920
7739
  --orange-200: hsl(27, 43%, 31%);
7921
7740
  --orange-300: hsl(27, 43%, 47%);
7922
- --orange-400: hsl(27, 80%, 64%);
7923
- --orange-500: hsl(27, 80%, 78%);
7924
- --orange-600: hsl(27, 80%, 89%);
7741
+ --orange-400: hsl(27, 80%, 80%);
7742
+ --orange-500: hsl(27, 80%, 88%);
7743
+ --orange-600: hsl(27, 80%, 93%);
7925
7744
  --blue-100: hsl(209, 29%, 19%);
7926
7745
  --blue-200: hsl(210, 29%, 35%);
7927
7746
  --blue-300: hsl(210, 29%, 50%);
7928
- --blue-400: hsl(210, 81%, 72%);
7929
- --blue-500: hsl(210, 80%, 82%);
7930
- --blue-600: hsl(210, 80%, 90%);
7747
+ --blue-400: hsl(210, 80%, 80%);
7748
+ --blue-500: hsl(210, 80%, 88%);
7749
+ --blue-600: hsl(210, 80%, 93%);
7931
7750
  --green-100: hsl(148, 29%, 19%);
7932
7751
  --green-200: hsl(148, 29%, 27%);
7933
7752
  --green-300: hsl(148, 25%, 40%);
7934
- --green-400: hsl(148, 40%, 62%);
7935
- --green-500: hsl(148, 40%, 75%);
7936
- --green-600: hsl(148, 40%, 87%);
7753
+ --green-400: hsl(148, 40%, 75%);
7754
+ --green-500: hsl(148, 40%, 85%);
7755
+ --green-600: hsl(148, 40%, 93%);
7937
7756
  --red-100: hsl(358, 29%, 19%);
7938
7757
  --red-200: hsl(0, 29%, 37%);
7939
7758
  --red-300: hsl(0, 34%, 54%);
7940
- --red-400: hsl(0, 75%, 77%);
7941
- --red-500: hsl(0, 69%, 85%);
7942
- --red-600: hsl(0, 69%, 93%);
7759
+ --red-400: hsl(0, 73%, 85%);
7760
+ --red-500: hsl(0, 73%, 91%);
7761
+ --red-600: hsl(0, 73%, 95%);
7943
7762
  --yellow-100: hsl(43, 29%, 17%);
7944
7763
  --yellow-200: hsl(43, 29%, 25%);
7945
7764
  --yellow-300: hsl(43, 29%, 40%);
7946
- --yellow-400: hsl(43, 59%, 64%);
7947
- --yellow-500: hsl(43, 65%, 70%);
7948
- --yellow-600: hsl(43, 65%, 85%);
7765
+ --yellow-400: hsl(43, 75%, 75%);
7766
+ --yellow-500: hsl(43, 75%, 85%);
7767
+ --yellow-600: hsl(43, 75%, 91%);
7768
+ --purple-100: hsl(237, 25%, 24%);
7769
+ --purple-200: hsl(237, 27%, 38%);
7770
+ --purple-300: hsl(237, 32%, 56%);
7771
+ --purple-400: hsl(237, 58%, 86%);
7772
+ --purple-500: hsl(237, 60%, 91%);
7773
+ --purple-600: hsl(237, 65%, 96%);
7949
7774
  --gold-100: hsl(45, 29%, 24%);
7950
7775
  --gold-200: hsl(45, 47%, 37%);
7951
7776
  --gold-300: hsl(45, 92%, 62%);
@@ -7974,12 +7799,12 @@ body:not(.theme-highcontrast):not(.theme-dark) .theme-dark__forced .themed {
7974
7799
  --focus-ring-error: hsla(358, 62%, 47%, 0.15);
7975
7800
  --focus-ring-muted: hsla(210, 8%, 15%, 0.1);
7976
7801
  --highlight-addition: var(--green-500);
7977
- --highlight-attribute: hsl(207, 41.5%, 67%);
7802
+ --highlight-attribute: var(--blue-400);
7978
7803
  --highlight-bg: hsl(0, 2%, 11%);
7979
7804
  --highlight-color: var(--black);
7980
7805
  --highlight-comment: hsl(0, 0%, 60%);
7981
7806
  --highlight-deletion: var(--red-500);
7982
- --highlight-keyword: hsl(208, 41.5%, 67%);
7807
+ --highlight-keyword: var(--blue-400);
7983
7808
  --highlight-literal: hsl(27, 85%, 61.5%);
7984
7809
  --highlight-namespace: hsl(27, 85%, 61.5%);
7985
7810
  --highlight-punctuation: hsl(0, 0%, 80%);
@@ -8027,34 +7852,34 @@ body.theme-highcontrast.theme-system .theme-light__forced {
8027
7852
  --black-200: hsl(210, 8%, 90%);
8028
7853
  --black-225: hsl(210, 8%, 85%);
8029
7854
  --black-250: hsl(210, 8%, 80%);
8030
- --black-300: hsl(213, 9%, 75%);
7855
+ --black-300: hsl(210, 9%, 75%);
8031
7856
  --black-350: hsl(210, 8%, 45%);
8032
- --black-400: hsl(210, 8%, 45%);
7857
+ --black-400: hsl(212, 8%, 35%);
8033
7858
  --black-500: hsl(210, 8%, 25%);
8034
7859
  --black-600: hsl(210, 8%, 5%);
8035
- --black: hsl(0, 8%, 5%);
7860
+ --black: hsl(210, 8%, 5%);
8036
7861
  --orange-100: hsl(22, 85%, 97%);
8037
7862
  --orange-200: hsl(22, 85%, 97%);
8038
7863
  --orange-300: hsl(27, 90%, 55%);
8039
7864
  --orange-400: hsl(27, 90%, 55%);
8040
- --orange-500: hsl(27, 80%, 29%);
8041
- --orange-600: hsl(27, 80%, 29%);
7865
+ --orange-500: hsl(27, 80%, 28%);
7866
+ --orange-600: hsl(27, 80%, 28%);
8042
7867
  --blue-100: hsl(210, 80%, 96%);
8043
7868
  --blue-200: hsl(210, 80%, 96%);
8044
7869
  --blue-300: hsl(210, 70%, 48%);
8045
- --blue-400: hsl(210, 70%, 48%);
7870
+ --blue-400: hsl(210, 77%, 34%);
8046
7871
  --blue-500: hsl(210, 80%, 23%);
8047
7872
  --blue-600: hsl(210, 80%, 23%);
8048
7873
  --green-100: hsl(147, 36%, 95%);
8049
7874
  --green-200: hsl(147, 36%, 95%);
8050
7875
  --green-300: hsl(148, 70%, 31%);
8051
- --green-400: hsl(148, 70%, 31%);
7876
+ --green-400: hsl(148, 75%, 22%);
8052
7877
  --green-500: hsl(147, 74%, 15%);
8053
7878
  --green-600: hsl(147, 74%, 15%);
8054
7879
  --red-100: hsl(0, 79%, 96%);
8055
7880
  --red-200: hsl(0, 79%, 96%);
8056
7881
  --red-300: hsl(0, 60%, 49%);
8057
- --red-400: hsl(0, 60%, 49%);
7882
+ --red-400: hsl(0, 65%, 37%);
8058
7883
  --red-500: hsl(0, 66%, 24%);
8059
7884
  --red-600: hsl(0, 66%, 24%);
8060
7885
  --yellow-100: hsl(41, 80%, 96%);
@@ -8063,12 +7888,18 @@ body.theme-highcontrast.theme-system .theme-light__forced {
8063
7888
  --yellow-400: hsl(43, 85%, 50%);
8064
7889
  --yellow-500: hsl(48, 85%, 18%);
8065
7890
  --yellow-600: hsl(48, 85%, 18%);
7891
+ --purple-100: hsl(237, 80%, 96%);
7892
+ --purple-200: hsl(237, 80%, 96%);
7893
+ --purple-300: hsl(237, 55%, 57%);
7894
+ --purple-400: hsl(237, 55%, 57%);
7895
+ --purple-500: hsl(237, 50%, 32%);
7896
+ --purple-600: hsl(237, 50%, 32%);
8066
7897
  --gold-100: hsl(46, 100%, 91%);
8067
7898
  --gold-200: hsl(46, 100%, 91%);
8068
7899
  --gold-300: hsl(45, 100%, 42%);
8069
7900
  --gold-400: hsl(46, 92%, 26%);
8070
7901
  --silver-100: hsl(0, 0%, 95%);
8071
- --silver-200: hsl(0, 0%, 84%);
7902
+ --silver-200: hsl(0, 0%, 95%);
8072
7903
  --silver-300: hsl(210, 5%, 68%);
8073
7904
  --silver-400: hsl(216, 2%, 40%);
8074
7905
  --bronze-100: hsl(28, 40%, 92%);
@@ -8122,48 +7953,54 @@ body.theme-highcontrast.theme-system .theme-light__forced {
8122
7953
  body.theme-highcontrast.theme-dark,
8123
7954
  body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
8124
7955
  --white: hsl(0, 0%, 0%);
8125
- --black-050: hsl(220, 3%, 15%);
8126
- --black-100: hsl(220, 3%, 18%);
8127
- --black-150: hsl(230, 4%, 21%);
8128
- --black-200: hsl(233, 4%, 27%);
8129
- --black-225: hsl(233, 4%, 30%);
8130
- --black-250: hsl(235, 5%, 36%);
8131
- --black-300: hsl(233, 4%, 47%);
8132
- --black-350: hsl(220, 10%, 74%);
8133
- --black-400: hsl(220, 10%, 74%);
8134
- --black-500: hsl(220, 10%, 83%);
8135
- --black-600: hsl(180, 11%, 98%);
7956
+ --black-050: hsl(210, 3%, 15%);
7957
+ --black-100: hsl(210, 3%, 18%);
7958
+ --black-150: hsl(210, 4%, 21%);
7959
+ --black-200: hsl(210, 4%, 27%);
7960
+ --black-225: hsl(210, 4%, 30%);
7961
+ --black-250: hsl(210, 5%, 36%);
7962
+ --black-300: hsl(210, 4%, 47%);
7963
+ --black-350: hsl(210, 10%, 74%);
7964
+ --black-400: hsl(210, 8%, 80%);
7965
+ --black-500: hsl(210, 8%, 90%);
7966
+ --black-600: hsl(210, 11%, 98%);
8136
7967
  --black: hsl(0, 0%, 100%);
8137
7968
  --orange-100: hsl(27, 29%, 19%);
8138
7969
  --orange-200: hsl(27, 29%, 19%);
8139
7970
  --orange-300: hsl(27, 80%, 64%);
8140
- --orange-400: hsl(27, 80%, 64%);
7971
+ --orange-400: hsl(27, 80%, 80%);
8141
7972
  --orange-500: hsl(27, 79%, 89%);
8142
- --orange-600: hsl(27, 79%, 89%);
7973
+ --orange-600: hsl(27, 80%, 93%);
8143
7974
  --blue-100: hsl(209, 29%, 19%);
8144
7975
  --blue-200: hsl(209, 29%, 19%);
8145
7976
  --blue-300: hsl(210, 80%, 72%);
8146
- --blue-400: hsl(210, 80%, 72%);
7977
+ --blue-400: hsl(210, 80%, 80%);
8147
7978
  --blue-500: hsl(209, 79%, 87%);
8148
- --blue-600: hsl(209, 79%, 87%);
7979
+ --blue-600: hsl(210, 80%, 93%);
8149
7980
  --green-100: hsl(147, 29%, 19%);
8150
7981
  --green-200: hsl(147, 29%, 19%);
8151
7982
  --green-300: hsl(148, 40%, 62%);
8152
- --green-400: hsl(148, 40%, 62%);
7983
+ --green-400: hsl(148, 40%, 75%);
8153
7984
  --green-500: hsl(148, 39%, 87%);
8154
- --green-600: hsl(148, 39%, 87%);
7985
+ --green-600: hsl(148, 40%, 93%);
8155
7986
  --red-100: hsl(358, 29%, 19%);
8156
7987
  --red-200: hsl(358, 29%, 19%);
8157
7988
  --red-300: hsl(0, 75%, 77%);
8158
- --red-400: hsl(0, 75%, 77%);
7989
+ --red-400: hsl(0, 73%, 85%);
8159
7990
  --red-500: hsl(0, 70%, 92%);
8160
- --red-600: hsl(0, 70%, 92%);
7991
+ --red-600: hsl(0, 73%, 95%);
8161
7992
  --yellow-100: hsl(43, 29%, 17%);
8162
7993
  --yellow-200: hsl(43, 29%, 17%);
8163
7994
  --yellow-300: hsl(43, 59%, 64%);
8164
- --yellow-400: hsl(43, 59%, 64%);
7995
+ --yellow-400: hsl(43, 75%, 75%);
8165
7996
  --yellow-500: hsl(48, 74%, 91%);
8166
- --yellow-600: hsl(48, 74%, 91%);
7997
+ --yellow-600: hsl(43, 75%, 91%);
7998
+ --purple-100: hsl(237, 25%, 24%);
7999
+ --purple-200: hsl(237, 25%, 24%);
8000
+ --purple-300: hsl(237, 58%, 86%);
8001
+ --purple-400: hsl(237, 58%, 86%);
8002
+ --purple-500: hsl(237, 65%, 96%);
8003
+ --purple-600: hsl(237, 65%, 96%);
8167
8004
  --gold-100: hsl(45, 22%, 25%);
8168
8005
  --gold-200: hsl(45, 22%, 25%);
8169
8006
  --gold-300: hsl(45, 92%, 62%);
@@ -8223,48 +8060,54 @@ body.theme-highcontrast:not(.theme-dark) .theme-dark__forced {
8223
8060
  @media (prefers-color-scheme: dark) {
8224
8061
  body.theme-highcontrast.theme-system {
8225
8062
  --white: hsl(0, 0%, 0%);
8226
- --black-050: hsl(220, 3%, 15%);
8227
- --black-100: hsl(220, 3%, 18%);
8228
- --black-150: hsl(230, 4%, 21%);
8229
- --black-200: hsl(233, 4%, 27%);
8230
- --black-225: hsl(233, 4%, 30%);
8231
- --black-250: hsl(235, 5%, 36%);
8232
- --black-300: hsl(233, 4%, 47%);
8233
- --black-350: hsl(220, 10%, 74%);
8234
- --black-400: hsl(220, 10%, 74%);
8235
- --black-500: hsl(220, 10%, 83%);
8236
- --black-600: hsl(180, 11%, 98%);
8063
+ --black-050: hsl(210, 3%, 15%);
8064
+ --black-100: hsl(210, 3%, 18%);
8065
+ --black-150: hsl(210, 4%, 21%);
8066
+ --black-200: hsl(210, 4%, 27%);
8067
+ --black-225: hsl(210, 4%, 30%);
8068
+ --black-250: hsl(210, 5%, 36%);
8069
+ --black-300: hsl(210, 4%, 47%);
8070
+ --black-350: hsl(210, 10%, 74%);
8071
+ --black-400: hsl(210, 8%, 80%);
8072
+ --black-500: hsl(210, 8%, 90%);
8073
+ --black-600: hsl(210, 11%, 98%);
8237
8074
  --black: hsl(0, 0%, 100%);
8238
8075
  --orange-100: hsl(27, 29%, 19%);
8239
8076
  --orange-200: hsl(27, 29%, 19%);
8240
8077
  --orange-300: hsl(27, 80%, 64%);
8241
- --orange-400: hsl(27, 80%, 64%);
8078
+ --orange-400: hsl(27, 80%, 80%);
8242
8079
  --orange-500: hsl(27, 79%, 89%);
8243
- --orange-600: hsl(27, 79%, 89%);
8080
+ --orange-600: hsl(27, 80%, 93%);
8244
8081
  --blue-100: hsl(209, 29%, 19%);
8245
8082
  --blue-200: hsl(209, 29%, 19%);
8246
8083
  --blue-300: hsl(210, 80%, 72%);
8247
- --blue-400: hsl(210, 80%, 72%);
8084
+ --blue-400: hsl(210, 80%, 80%);
8248
8085
  --blue-500: hsl(209, 79%, 87%);
8249
- --blue-600: hsl(209, 79%, 87%);
8086
+ --blue-600: hsl(210, 80%, 93%);
8250
8087
  --green-100: hsl(147, 29%, 19%);
8251
8088
  --green-200: hsl(147, 29%, 19%);
8252
8089
  --green-300: hsl(148, 40%, 62%);
8253
- --green-400: hsl(148, 40%, 62%);
8090
+ --green-400: hsl(148, 40%, 75%);
8254
8091
  --green-500: hsl(148, 39%, 87%);
8255
- --green-600: hsl(148, 39%, 87%);
8092
+ --green-600: hsl(148, 40%, 93%);
8256
8093
  --red-100: hsl(358, 29%, 19%);
8257
8094
  --red-200: hsl(358, 29%, 19%);
8258
8095
  --red-300: hsl(0, 75%, 77%);
8259
- --red-400: hsl(0, 75%, 77%);
8096
+ --red-400: hsl(0, 73%, 85%);
8260
8097
  --red-500: hsl(0, 70%, 92%);
8261
- --red-600: hsl(0, 70%, 92%);
8098
+ --red-600: hsl(0, 73%, 95%);
8262
8099
  --yellow-100: hsl(43, 29%, 17%);
8263
8100
  --yellow-200: hsl(43, 29%, 17%);
8264
8101
  --yellow-300: hsl(43, 59%, 64%);
8265
- --yellow-400: hsl(43, 59%, 64%);
8102
+ --yellow-400: hsl(43, 75%, 75%);
8266
8103
  --yellow-500: hsl(48, 74%, 91%);
8267
- --yellow-600: hsl(48, 74%, 91%);
8104
+ --yellow-600: hsl(43, 75%, 91%);
8105
+ --purple-100: hsl(237, 25%, 24%);
8106
+ --purple-200: hsl(237, 25%, 24%);
8107
+ --purple-300: hsl(237, 58%, 86%);
8108
+ --purple-400: hsl(237, 58%, 86%);
8109
+ --purple-500: hsl(237, 65%, 96%);
8110
+ --purple-600: hsl(237, 65%, 96%);
8268
8111
  --gold-100: hsl(45, 22%, 25%);
8269
8112
  --gold-200: hsl(45, 22%, 25%);
8270
8113
  --gold-300: hsl(45, 92%, 62%);
@@ -13304,6 +13147,114 @@ body.theme-system .theme-dark__forced .d\:bg-theme-secondary-legacy-025 {
13304
13147
  .f\:fc-yellow-600:focus-within {
13305
13148
  color: var(--yellow-600) !important;
13306
13149
  }
13150
+ .bg-purple-100,
13151
+ .h\:bg-purple-100:hover,
13152
+ .f\:bg-purple-100:focus,
13153
+ .f\:bg-purple-100:focus-within {
13154
+ background-color: var(--purple-100) !important;
13155
+ }
13156
+ .bc-purple-100,
13157
+ .h\:bc-purple-100:hover,
13158
+ .f\:bc-purple-100:focus,
13159
+ .f\:bc-purple-100:focus-within {
13160
+ border-color: var(--purple-100) !important;
13161
+ }
13162
+ .fc-purple-100,
13163
+ .h\:fc-purple-100:hover,
13164
+ .f\:fc-purple-100:focus,
13165
+ .f\:fc-purple-100:focus-within {
13166
+ color: var(--purple-100) !important;
13167
+ }
13168
+ .bg-purple-200,
13169
+ .h\:bg-purple-200:hover,
13170
+ .f\:bg-purple-200:focus,
13171
+ .f\:bg-purple-200:focus-within {
13172
+ background-color: var(--purple-200) !important;
13173
+ }
13174
+ .bc-purple-200,
13175
+ .h\:bc-purple-200:hover,
13176
+ .f\:bc-purple-200:focus,
13177
+ .f\:bc-purple-200:focus-within {
13178
+ border-color: var(--purple-200) !important;
13179
+ }
13180
+ .fc-purple-200,
13181
+ .h\:fc-purple-200:hover,
13182
+ .f\:fc-purple-200:focus,
13183
+ .f\:fc-purple-200:focus-within {
13184
+ color: var(--purple-200) !important;
13185
+ }
13186
+ .bg-purple-300,
13187
+ .h\:bg-purple-300:hover,
13188
+ .f\:bg-purple-300:focus,
13189
+ .f\:bg-purple-300:focus-within {
13190
+ background-color: var(--purple-300) !important;
13191
+ }
13192
+ .bc-purple-300,
13193
+ .h\:bc-purple-300:hover,
13194
+ .f\:bc-purple-300:focus,
13195
+ .f\:bc-purple-300:focus-within {
13196
+ border-color: var(--purple-300) !important;
13197
+ }
13198
+ .fc-purple-300,
13199
+ .h\:fc-purple-300:hover,
13200
+ .f\:fc-purple-300:focus,
13201
+ .f\:fc-purple-300:focus-within {
13202
+ color: var(--purple-300) !important;
13203
+ }
13204
+ .bg-purple-400,
13205
+ .h\:bg-purple-400:hover,
13206
+ .f\:bg-purple-400:focus,
13207
+ .f\:bg-purple-400:focus-within {
13208
+ background-color: var(--purple-400) !important;
13209
+ }
13210
+ .bc-purple-400,
13211
+ .h\:bc-purple-400:hover,
13212
+ .f\:bc-purple-400:focus,
13213
+ .f\:bc-purple-400:focus-within {
13214
+ border-color: var(--purple-400) !important;
13215
+ }
13216
+ .fc-purple-400,
13217
+ .h\:fc-purple-400:hover,
13218
+ .f\:fc-purple-400:focus,
13219
+ .f\:fc-purple-400:focus-within {
13220
+ color: var(--purple-400) !important;
13221
+ }
13222
+ .bg-purple-500,
13223
+ .h\:bg-purple-500:hover,
13224
+ .f\:bg-purple-500:focus,
13225
+ .f\:bg-purple-500:focus-within {
13226
+ background-color: var(--purple-500) !important;
13227
+ }
13228
+ .bc-purple-500,
13229
+ .h\:bc-purple-500:hover,
13230
+ .f\:bc-purple-500:focus,
13231
+ .f\:bc-purple-500:focus-within {
13232
+ border-color: var(--purple-500) !important;
13233
+ }
13234
+ .fc-purple-500,
13235
+ .h\:fc-purple-500:hover,
13236
+ .f\:fc-purple-500:focus,
13237
+ .f\:fc-purple-500:focus-within {
13238
+ color: var(--purple-500) !important;
13239
+ }
13240
+ .bg-purple-600,
13241
+ .h\:bg-purple-600:hover,
13242
+ .f\:bg-purple-600:focus,
13243
+ .f\:bg-purple-600:focus-within {
13244
+ background-color: var(--purple-600) !important;
13245
+ }
13246
+ .bc-purple-600,
13247
+ .h\:bc-purple-600:hover,
13248
+ .f\:bc-purple-600:focus,
13249
+ .f\:bc-purple-600:focus-within {
13250
+ border-color: var(--purple-600) !important;
13251
+ }
13252
+ .fc-purple-600,
13253
+ .h\:fc-purple-600:hover,
13254
+ .f\:fc-purple-600:focus,
13255
+ .f\:fc-purple-600:focus-within {
13256
+ color: var(--purple-600) !important;
13257
+ }
13307
13258
  .bg-gold-100,
13308
13259
  .h\:bg-gold-100:hover,
13309
13260
  .f\:bg-gold-100:focus,
@@ -14145,6 +14096,42 @@ body.theme-system .theme-dark__forced .d\:bg-theme-secondary-legacy-025 {
14145
14096
  body.theme-system .d\:fc-yellow-600 {
14146
14097
  color: var(--yellow-600) !important;
14147
14098
  }
14099
+ body.theme-system .d\:bg-purple-100 {
14100
+ background-color: var(--purple-100) !important;
14101
+ }
14102
+ body.theme-system .d\:fc-purple-100 {
14103
+ color: var(--purple-100) !important;
14104
+ }
14105
+ body.theme-system .d\:bg-purple-200 {
14106
+ background-color: var(--purple-200) !important;
14107
+ }
14108
+ body.theme-system .d\:fc-purple-200 {
14109
+ color: var(--purple-200) !important;
14110
+ }
14111
+ body.theme-system .d\:bg-purple-300 {
14112
+ background-color: var(--purple-300) !important;
14113
+ }
14114
+ body.theme-system .d\:fc-purple-300 {
14115
+ color: var(--purple-300) !important;
14116
+ }
14117
+ body.theme-system .d\:bg-purple-400 {
14118
+ background-color: var(--purple-400) !important;
14119
+ }
14120
+ body.theme-system .d\:fc-purple-400 {
14121
+ color: var(--purple-400) !important;
14122
+ }
14123
+ body.theme-system .d\:bg-purple-500 {
14124
+ background-color: var(--purple-500) !important;
14125
+ }
14126
+ body.theme-system .d\:fc-purple-500 {
14127
+ color: var(--purple-500) !important;
14128
+ }
14129
+ body.theme-system .d\:bg-purple-600 {
14130
+ background-color: var(--purple-600) !important;
14131
+ }
14132
+ body.theme-system .d\:fc-purple-600 {
14133
+ color: var(--purple-600) !important;
14134
+ }
14148
14135
  body.theme-system .d\:bg-gold-100 {
14149
14136
  background-color: var(--gold-100) !important;
14150
14137
  }
@@ -14705,6 +14692,66 @@ body.theme-dark .d\:fc-yellow-600,
14705
14692
  body.theme-system .theme-dark__forced .d\:fc-yellow-600 {
14706
14693
  color: var(--yellow-600) !important;
14707
14694
  }
14695
+ body.theme-dark .d\:bg-purple-100,
14696
+ .theme-dark__forced .d\:bg-purple-100,
14697
+ body.theme-system .theme-dark__forced .d\:bg-purple-100 {
14698
+ background-color: var(--purple-100) !important;
14699
+ }
14700
+ body.theme-dark .d\:fc-purple-100,
14701
+ .theme-dark__forced .d\:fc-purple-100,
14702
+ body.theme-system .theme-dark__forced .d\:fc-purple-100 {
14703
+ color: var(--purple-100) !important;
14704
+ }
14705
+ body.theme-dark .d\:bg-purple-200,
14706
+ .theme-dark__forced .d\:bg-purple-200,
14707
+ body.theme-system .theme-dark__forced .d\:bg-purple-200 {
14708
+ background-color: var(--purple-200) !important;
14709
+ }
14710
+ body.theme-dark .d\:fc-purple-200,
14711
+ .theme-dark__forced .d\:fc-purple-200,
14712
+ body.theme-system .theme-dark__forced .d\:fc-purple-200 {
14713
+ color: var(--purple-200) !important;
14714
+ }
14715
+ body.theme-dark .d\:bg-purple-300,
14716
+ .theme-dark__forced .d\:bg-purple-300,
14717
+ body.theme-system .theme-dark__forced .d\:bg-purple-300 {
14718
+ background-color: var(--purple-300) !important;
14719
+ }
14720
+ body.theme-dark .d\:fc-purple-300,
14721
+ .theme-dark__forced .d\:fc-purple-300,
14722
+ body.theme-system .theme-dark__forced .d\:fc-purple-300 {
14723
+ color: var(--purple-300) !important;
14724
+ }
14725
+ body.theme-dark .d\:bg-purple-400,
14726
+ .theme-dark__forced .d\:bg-purple-400,
14727
+ body.theme-system .theme-dark__forced .d\:bg-purple-400 {
14728
+ background-color: var(--purple-400) !important;
14729
+ }
14730
+ body.theme-dark .d\:fc-purple-400,
14731
+ .theme-dark__forced .d\:fc-purple-400,
14732
+ body.theme-system .theme-dark__forced .d\:fc-purple-400 {
14733
+ color: var(--purple-400) !important;
14734
+ }
14735
+ body.theme-dark .d\:bg-purple-500,
14736
+ .theme-dark__forced .d\:bg-purple-500,
14737
+ body.theme-system .theme-dark__forced .d\:bg-purple-500 {
14738
+ background-color: var(--purple-500) !important;
14739
+ }
14740
+ body.theme-dark .d\:fc-purple-500,
14741
+ .theme-dark__forced .d\:fc-purple-500,
14742
+ body.theme-system .theme-dark__forced .d\:fc-purple-500 {
14743
+ color: var(--purple-500) !important;
14744
+ }
14745
+ body.theme-dark .d\:bg-purple-600,
14746
+ .theme-dark__forced .d\:bg-purple-600,
14747
+ body.theme-system .theme-dark__forced .d\:bg-purple-600 {
14748
+ background-color: var(--purple-600) !important;
14749
+ }
14750
+ body.theme-dark .d\:fc-purple-600,
14751
+ .theme-dark__forced .d\:fc-purple-600,
14752
+ body.theme-system .theme-dark__forced .d\:fc-purple-600 {
14753
+ color: var(--purple-600) !important;
14754
+ }
14708
14755
  body.theme-dark .d\:bg-gold-100,
14709
14756
  .theme-dark__forced .d\:bg-gold-100,
14710
14757
  body.theme-system .theme-dark__forced .d\:bg-gold-100 {
@@ -20016,6 +20063,9 @@ p {
20016
20063
  .ow-normal {
20017
20064
  overflow-wrap: normal !important;
20018
20065
  }
20066
+ .ow-anywhere {
20067
+ overflow-wrap: anywhere !important;
20068
+ }
20019
20069
  .ow-break-word {
20020
20070
  overflow-wrap: break-word !important;
20021
20071
  }
@@ -20706,16 +20756,16 @@ ol {
20706
20756
  box-shadow: 0 var(--su-static4) var(--su-static8) hsl(210, 8%, 85%) !important;
20707
20757
  }
20708
20758
  .bs-lg.bs-hover:hover {
20709
- box-shadow: 0 var(--su-static4) var(--su-static12) hsla(212, 8%, 68%, 0.7) !important;
20759
+ box-shadow: 0 var(--su-static4) var(--su-static12) hsla(210, 8%, 68%, 0.7) !important;
20710
20760
  }
20711
20761
  .bs-i-sm.bs-hover:hover {
20712
- box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 hsla(213, 9%, 75%, 0.75) !important;
20762
+ box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 hsla(210, 9%, 75%, 0.75) !important;
20713
20763
  }
20714
20764
  .bs-i-md.bs-hover:hover {
20715
- box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 hsla(212, 8%, 68%, 0.8) !important;
20765
+ box-shadow: inset 0 var(--su-static1) var(--su-static8) 0 hsla(210, 8%, 68%, 0.8) !important;
20716
20766
  }
20717
20767
  .bs-i-lg.bs-hover:hover {
20718
- box-shadow: inset 0 var(--su-static1) var(--su-static12) 0 hsl(212, 8%, 68%) !important;
20768
+ box-shadow: inset 0 var(--su-static1) var(--su-static12) 0 hsl(210, 8%, 68%) !important;
20719
20769
  }
20720
20770
  .t {
20721
20771
  transition-duration: var(--transition-time);