@omni-design/components 0.7.0

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 (223) hide show
  1. package/.claude/commands/ScanComponents.md +26 -0
  2. package/.claude/commands/ShareComponent.md +128 -0
  3. package/.cursorrules +21 -0
  4. package/CLAUDE.md +1046 -0
  5. package/README.md +70 -0
  6. package/dist/OmniDesignProvider.esm.js +2 -0
  7. package/dist/OmniDesignProvider.esm.js.map +1 -0
  8. package/dist/OmniDesignProvider.js +2 -0
  9. package/dist/OmniDesignProvider.js.map +1 -0
  10. package/dist/index.esm.js +42 -0
  11. package/dist/index.esm.js.map +1 -0
  12. package/dist/index.js +42 -0
  13. package/dist/index.js.map +1 -0
  14. package/dist/types/OmniDesignProvider.d.ts +158 -0
  15. package/dist/types/components/Accordion/Accordion.d.ts +42 -0
  16. package/dist/types/components/Accordion/AccordionShowcase.d.ts +2 -0
  17. package/dist/types/components/Accordion/index.d.ts +2 -0
  18. package/dist/types/components/Alert/Alert.d.ts +14 -0
  19. package/dist/types/components/Alert/AlertShowcase.d.ts +2 -0
  20. package/dist/types/components/Alert/index.d.ts +2 -0
  21. package/dist/types/components/AppBar/AppBar.d.ts +43 -0
  22. package/dist/types/components/AppBar/AppBarShowcase.d.ts +2 -0
  23. package/dist/types/components/AppBar/index.d.ts +2 -0
  24. package/dist/types/components/Autocomplete/Autocomplete.d.ts +26 -0
  25. package/dist/types/components/Autocomplete/AutocompleteShowcase.d.ts +2 -0
  26. package/dist/types/components/Autocomplete/index.d.ts +2 -0
  27. package/dist/types/components/Avatar/Avatar.d.ts +29 -0
  28. package/dist/types/components/Avatar/AvatarShowcase.d.ts +2 -0
  29. package/dist/types/components/Avatar/defaultAvatar.d.ts +2 -0
  30. package/dist/types/components/Avatar/index.d.ts +3 -0
  31. package/dist/types/components/BackgroundPicker.d.ts +12 -0
  32. package/dist/types/components/Badge/Badge.d.ts +43 -0
  33. package/dist/types/components/Badge/BadgeShowcase.d.ts +1 -0
  34. package/dist/types/components/Badge/index.d.ts +2 -0
  35. package/dist/types/components/BevelText/BevelText.d.ts +15 -0
  36. package/dist/types/components/BevelText/BevelTextShowcase.d.ts +2 -0
  37. package/dist/types/components/BevelText/index.d.ts +2 -0
  38. package/dist/types/components/BottomNavigation/BottomNavigation.d.ts +15 -0
  39. package/dist/types/components/BottomNavigation/BottomNavigationShowcase.d.ts +2 -0
  40. package/dist/types/components/BottomNavigation/index.d.ts +2 -0
  41. package/dist/types/components/Box/Box.d.ts +36 -0
  42. package/dist/types/components/Box/BoxShowcase.d.ts +2 -0
  43. package/dist/types/components/Box/index.d.ts +2 -0
  44. package/dist/types/components/Breadcrumbs/Breadcrumbs.d.ts +22 -0
  45. package/dist/types/components/Breadcrumbs/BreadcrumbsShowcase.d.ts +2 -0
  46. package/dist/types/components/Breadcrumbs/index.d.ts +2 -0
  47. package/dist/types/components/Button/Button.d.ts +66 -0
  48. package/dist/types/components/Button/index.d.ts +2 -0
  49. package/dist/types/components/ButtonGroup/ButtonGroup.d.ts +41 -0
  50. package/dist/types/components/ButtonGroup/index.d.ts +2 -0
  51. package/dist/types/components/Card/Card.d.ts +54 -0
  52. package/dist/types/components/Card/CardShowcase.d.ts +2 -0
  53. package/dist/types/components/Card/index.d.ts +2 -0
  54. package/dist/types/components/Checkbox/Checkbox.d.ts +51 -0
  55. package/dist/types/components/Checkbox/index.d.ts +2 -0
  56. package/dist/types/components/Chip/Chip.d.ts +42 -0
  57. package/dist/types/components/Chip/ChipShowcase.d.ts +2 -0
  58. package/dist/types/components/Chip/index.d.ts +2 -0
  59. package/dist/types/components/CircularProgress/CircularProgress.d.ts +12 -0
  60. package/dist/types/components/CircularProgress/CircularProgressShowcase.d.ts +2 -0
  61. package/dist/types/components/CircularProgress/index.d.ts +2 -0
  62. package/dist/types/components/CodeBlock/CodeBlock.d.ts +35 -0
  63. package/dist/types/components/Colors/Colors.d.ts +7 -0
  64. package/dist/types/components/Colors/index.d.ts +1 -0
  65. package/dist/types/components/Container/Container.d.ts +70 -0
  66. package/dist/types/components/Container/index.d.ts +1 -0
  67. package/dist/types/components/Copyright/Copyright.d.ts +11 -0
  68. package/dist/types/components/Copyright/CopyrightShowcase.d.ts +2 -0
  69. package/dist/types/components/Copyright/index.d.ts +2 -0
  70. package/dist/types/components/CurvedText/CurvedText.d.ts +23 -0
  71. package/dist/types/components/CurvedText/CurvedTextShowcase.d.ts +2 -0
  72. package/dist/types/components/CurvedText/index.d.ts +2 -0
  73. package/dist/types/components/Dialog/Dialog.d.ts +82 -0
  74. package/dist/types/components/Dialog/DialogShowcase.d.ts +2 -0
  75. package/dist/types/components/Dialog/index.d.ts +2 -0
  76. package/dist/types/components/Divider/Divider.d.ts +22 -0
  77. package/dist/types/components/Divider/DividerShowcase.d.ts +2 -0
  78. package/dist/types/components/Divider/index.d.ts +2 -0
  79. package/dist/types/components/Drawer/Drawer.d.ts +30 -0
  80. package/dist/types/components/Drawer/DrawerShowcase.d.ts +2 -0
  81. package/dist/types/components/Drawer/index.d.ts +2 -0
  82. package/dist/types/components/DropZone/DropZone.d.ts +15 -0
  83. package/dist/types/components/DropZone/index.d.ts +2 -0
  84. package/dist/types/components/Fab/Fab.d.ts +17 -0
  85. package/dist/types/components/Fab/FabShowcase.d.ts +2 -0
  86. package/dist/types/components/Fab/index.d.ts +2 -0
  87. package/dist/types/components/Footer/Footer.d.ts +14 -0
  88. package/dist/types/components/Footer/FooterShowcase.d.ts +2 -0
  89. package/dist/types/components/Footer/index.d.ts +2 -0
  90. package/dist/types/components/Gradient/Gradient.d.ts +38 -0
  91. package/dist/types/components/Gradient/GradientShowcase.d.ts +2 -0
  92. package/dist/types/components/Gradient/gradientUtils.d.ts +185 -0
  93. package/dist/types/components/Gradient/index.d.ts +3 -0
  94. package/dist/types/components/Grid/Grid.d.ts +112 -0
  95. package/dist/types/components/Grid/index.d.ts +1 -0
  96. package/dist/types/components/Header/Header.d.ts +53 -0
  97. package/dist/types/components/Header/index.d.ts +1 -0
  98. package/dist/types/components/Icon/Icon.d.ts +19 -0
  99. package/dist/types/components/Icon/IconShowcase.d.ts +2 -0
  100. package/dist/types/components/Icon/index.d.ts +2 -0
  101. package/dist/types/components/IconBadge/IconBadge.d.ts +10 -0
  102. package/dist/types/components/IconBadge/IconBadgeShowcase.d.ts +2 -0
  103. package/dist/types/components/IconBadge/index.d.ts +2 -0
  104. package/dist/types/components/Input/Input.d.ts +47 -0
  105. package/dist/types/components/Input/index.d.ts +2 -0
  106. package/dist/types/components/LinearProgress/LinearProgress.d.ts +9 -0
  107. package/dist/types/components/LinearProgress/LinearProgressShowcase.d.ts +2 -0
  108. package/dist/types/components/LinearProgress/index.d.ts +2 -0
  109. package/dist/types/components/Link/Link.d.ts +16 -0
  110. package/dist/types/components/Link/LinkShowcase.d.ts +2 -0
  111. package/dist/types/components/Link/index.d.ts +2 -0
  112. package/dist/types/components/List/List.d.ts +55 -0
  113. package/dist/types/components/List/ListShowcase.d.ts +2 -0
  114. package/dist/types/components/List/index.d.ts +2 -0
  115. package/dist/types/components/MainLayout/MainLayout.d.ts +28 -0
  116. package/dist/types/components/MainLayout/index.d.ts +1 -0
  117. package/dist/types/components/Menu/Menu.d.ts +37 -0
  118. package/dist/types/components/Menu/MenuShowcase.d.ts +2 -0
  119. package/dist/types/components/Menu/index.d.ts +2 -0
  120. package/dist/types/components/Modal/Modal.d.ts +18 -0
  121. package/dist/types/components/Modal/ModalShowcase.d.ts +2 -0
  122. package/dist/types/components/Modal/index.d.ts +2 -0
  123. package/dist/types/components/NumberField/NumberField.d.ts +22 -0
  124. package/dist/types/components/NumberField/NumberFieldShowcase.d.ts +2 -0
  125. package/dist/types/components/NumberField/index.d.ts +2 -0
  126. package/dist/types/components/Pagination/Pagination.d.ts +17 -0
  127. package/dist/types/components/Pagination/PaginationShowcase.d.ts +2 -0
  128. package/dist/types/components/Pagination/index.d.ts +2 -0
  129. package/dist/types/components/Paper/Paper.d.ts +111 -0
  130. package/dist/types/components/Paper/index.d.ts +1 -0
  131. package/dist/types/components/Popover/Popover.d.ts +31 -0
  132. package/dist/types/components/Popover/index.d.ts +1 -0
  133. package/dist/types/components/PreviewSurface.d.ts +18 -0
  134. package/dist/types/components/Radio/Radio.d.ts +55 -0
  135. package/dist/types/components/Radio/RadioShowcase.d.ts +2 -0
  136. package/dist/types/components/Radio/index.d.ts +2 -0
  137. package/dist/types/components/Rail/Rail.d.ts +15 -0
  138. package/dist/types/components/Rail/RailShowcase.d.ts +2 -0
  139. package/dist/types/components/Rail/index.d.ts +2 -0
  140. package/dist/types/components/Rating/Rating.d.ts +16 -0
  141. package/dist/types/components/Rating/RatingShowcase.d.ts +2 -0
  142. package/dist/types/components/Rating/index.d.ts +2 -0
  143. package/dist/types/components/Ratio/Ratio.d.ts +20 -0
  144. package/dist/types/components/Ratio/RatioShowcase.d.ts +2 -0
  145. package/dist/types/components/Ratio/index.d.ts +2 -0
  146. package/dist/types/components/SearchField/SearchField.d.ts +19 -0
  147. package/dist/types/components/SearchField/SearchFieldShowcase.d.ts +2 -0
  148. package/dist/types/components/SearchField/index.d.ts +2 -0
  149. package/dist/types/components/Section/Section.d.ts +44 -0
  150. package/dist/types/components/Section/SectionShowcase.d.ts +2 -0
  151. package/dist/types/components/Section/index.d.ts +2 -0
  152. package/dist/types/components/Select/Select.d.ts +23 -0
  153. package/dist/types/components/Select/SelectShowcase.d.ts +2 -0
  154. package/dist/types/components/Select/index.d.ts +2 -0
  155. package/dist/types/components/SettingsPanel.d.ts +2 -0
  156. package/dist/types/components/Sidebar/Sidebar.d.ts +53 -0
  157. package/dist/types/components/Sidebar/index.d.ts +1 -0
  158. package/dist/types/components/Slider/Slider.d.ts +79 -0
  159. package/dist/types/components/Slider/SliderShowcase.d.ts +2 -0
  160. package/dist/types/components/Slider/index.d.ts +2 -0
  161. package/dist/types/components/Snackbar/Snackbar.d.ts +17 -0
  162. package/dist/types/components/Snackbar/SnackbarShowcase.d.ts +2 -0
  163. package/dist/types/components/Snackbar/index.d.ts +2 -0
  164. package/dist/types/components/Spacing/Spacing.d.ts +16 -0
  165. package/dist/types/components/Spacing/index.d.ts +1 -0
  166. package/dist/types/components/SpeedDial/SpeedDial.d.ts +17 -0
  167. package/dist/types/components/SpeedDial/SpeedDialShowcase.d.ts +2 -0
  168. package/dist/types/components/SpeedDial/index.d.ts +2 -0
  169. package/dist/types/components/Stack/Stack.d.ts +52 -0
  170. package/dist/types/components/Stack/StackShowcase.d.ts +2 -0
  171. package/dist/types/components/Stack/index.d.ts +2 -0
  172. package/dist/types/components/Stepper/Stepper.d.ts +33 -0
  173. package/dist/types/components/Stepper/StepperShowcase.d.ts +2 -0
  174. package/dist/types/components/Stepper/index.d.ts +2 -0
  175. package/dist/types/components/Switch/Switch.d.ts +65 -0
  176. package/dist/types/components/Switch/SwitchShowcase.d.ts +2 -0
  177. package/dist/types/components/Switch/index.d.ts +2 -0
  178. package/dist/types/components/Table/Table.d.ts +20 -0
  179. package/dist/types/components/Table/TableShowcase.d.ts +2 -0
  180. package/dist/types/components/Table/index.d.ts +2 -0
  181. package/dist/types/components/Tabs/Tabs.d.ts +51 -0
  182. package/dist/types/components/Tabs/TabsShowcase.d.ts +2 -0
  183. package/dist/types/components/Tabs/index.d.ts +2 -0
  184. package/dist/types/components/Tag/Tag.d.ts +57 -0
  185. package/dist/types/components/Tag/TagShowcase.d.ts +2 -0
  186. package/dist/types/components/Tag/index.d.ts +2 -0
  187. package/dist/types/components/TextField/TextField.d.ts +105 -0
  188. package/dist/types/components/TextField/index.d.ts +1 -0
  189. package/dist/types/components/ToggleButton/ToggleButton.d.ts +94 -0
  190. package/dist/types/components/ToggleButton/index.d.ts +1 -0
  191. package/dist/types/components/ToggleButtonGroup/ToggleButtonGroup.d.ts +48 -0
  192. package/dist/types/components/Toolbar/Toolbar.d.ts +14 -0
  193. package/dist/types/components/Toolbar/ToolbarShowcase.d.ts +2 -0
  194. package/dist/types/components/Toolbar/index.d.ts +2 -0
  195. package/dist/types/components/Tooltip/Tooltip.d.ts +20 -0
  196. package/dist/types/components/Tooltip/TooltipShowcase.d.ts +2 -0
  197. package/dist/types/components/Tooltip/index.d.ts +2 -0
  198. package/dist/types/components/TreeView/TreeBranch.d.ts +14 -0
  199. package/dist/types/components/TreeView/TreeView.d.ts +82 -0
  200. package/dist/types/components/TreeView/TreeViewShowcase.d.ts +2 -0
  201. package/dist/types/components/TreeView/index.d.ts +3 -0
  202. package/dist/types/components/Typography/Typography.d.ts +492 -0
  203. package/dist/types/components/Typography/TypographyShowcase.d.ts +2 -0
  204. package/dist/types/components/Typography/index.d.ts +2 -0
  205. package/dist/types/components/_a11y/ContrastCheck.d.ts +15 -0
  206. package/dist/types/components/_bevelPresets.d.ts +92 -0
  207. package/dist/types/components/_shadows.d.ts +32 -0
  208. package/dist/types/components/index.d.ts +74 -0
  209. package/dist/types/theme/useThemeMode.d.ts +4 -0
  210. package/docs/components.md +797 -0
  211. package/docs/getting-started.md +409 -0
  212. package/docs/token-system.md +468 -0
  213. package/package.json +126 -0
  214. package/public/styles/Dark-Mode.css +13867 -0
  215. package/public/styles/Light-Mode.css +14091 -0
  216. package/public/styles/README.md +93 -0
  217. package/public/styles/base.css +261 -0
  218. package/public/styles/core.css +378 -0
  219. package/public/styles/foundation.css +72 -0
  220. package/public/styles/styles.css +6 -0
  221. package/public/styles/theme.js +234 -0
  222. package/public/styles/theme.json +12 -0
  223. package/public/styles/typography-tokens.css +720 -0
@@ -0,0 +1,720 @@
1
+ /* ============================================================================
2
+ * typography-tokens.css — STATIC: lib-owned, do not regenerate per design system.
3
+ * Platform-scaled type sizes (Desktop / IOS-Mobile / etc.) — does NOT
4
+ * reference any brand value, so the same file works for every design system.
5
+ * The "Auto-generated" note below refers to the template itself being
6
+ * auto-generated upstream, not per-design-system regeneration.
7
+ * ============================================================================ */
8
+
9
+ /* typography-tokens.css
10
+ * Auto-generated — do not edit by hand.
11
+ * Apply [data-platform="Desktop"] etc to your root element.
12
+ */
13
+
14
+ [data-platform="Desktop"] {
15
+
16
+ /* Display */
17
+ --Font-Family-Display: var(--Platform-Font-Families-Header);
18
+ --Display-Small-Font-Size: 42px;
19
+ --Display-Small-Font-Weight: 600;
20
+ --Display-Small-Line-Height: 42px;
21
+ --Display-Small-Letter-Spacing: 0px;
22
+ --Font-Family-Display: var(--Platform-Font-Families-Header);
23
+ --Display-Medium-Font-Size: 45px;
24
+ --Display-Medium-Font-Weight: 600;
25
+ --Display-Medium-Line-Height: 45px;
26
+ --Display-Medium-Letter-Spacing: 0px;
27
+ --Font-Family-Display: var(--Platform-Font-Families-Header);
28
+ --Display-Large-Font-Size: 48px;
29
+ --Display-Large-Font-Weight: 600;
30
+ --Display-Large-Line-Height: 48px;
31
+ --Display-Large-Letter-Spacing: 0px;
32
+
33
+ /* Headers */
34
+ --Font-Family-Header: var(--Platform-Font-Families-Header);
35
+ --H1-Font-Size: 32px;
36
+ --H1-Font-Weight: 600;
37
+ --H1-Line-Height: 32px;
38
+ --H1-Letter-Spacing: 1.25px;
39
+ --Font-Family-Header: var(--Platform-Font-Families-Header);
40
+ --H2-Font-Size: 28px;
41
+ --H2-Font-Weight: 600;
42
+ --H2-Line-Height: 28px;
43
+ --H2-Letter-Spacing: 1.25px;
44
+ --Font-Family-Header: var(--Platform-Font-Families-Header);
45
+ --H3-Font-Size: 24px;
46
+ --H3-Font-Weight: 600;
47
+ --H3-Line-Height: 24px;
48
+ --H3-Letter-Spacing: 0px;
49
+ --Font-Family-Header: var(--Platform-Font-Families-Header);
50
+ --H4-Font-Size: 20px;
51
+ --H4-Font-Weight: 600;
52
+ --H4-Line-Height: 20px;
53
+ --H4-Letter-Spacing: 0px;
54
+ --Font-Family-Header: var(--Platform-Font-Families-Header);
55
+ --H5-Font-Size: 18px;
56
+ --H5-Font-Weight: 600;
57
+ --H5-Line-Height: 18px;
58
+ --H5-Letter-Spacing: 0px;
59
+ --Font-Family-Header: var(--Platform-Font-Families-Header);
60
+ --H6-Font-Size: 16px;
61
+ --H6-Font-Weight: 600;
62
+ --H6-Line-Height: 16px;
63
+ --H6-Letter-Spacing: 0px;
64
+
65
+ /* Subtitle */
66
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
67
+ --Subtitle-Small-Font-Size: 16px;
68
+ --Subtitle-Small-Font-Weight: 700;
69
+ --Subtitle-Small-Line-Height: 24px;
70
+ --Subtitle-Small-Letter-Spacing: 0px;
71
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
72
+ --Subtitle-Large-Font-Size: 18px;
73
+ --Subtitle-Large-Font-Weight: 700;
74
+ --Subtitle-Large-Line-Height: 32px;
75
+ --Subtitle-Large-Letter-Spacing: 0px;
76
+
77
+ /* Body */
78
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
79
+ --Body-Small-Font-Size: 14px;
80
+ --Body-Small-Font-Weight: 500;
81
+ --Body-Small-Line-Height: 21px;
82
+ --Body-Small-Letter-Spacing: 0px;
83
+ --Body-Small-Semibold-Font-Weight: 600;
84
+ --Body-Small-Bold-Font-Weight: 700;
85
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
86
+ --Body-Medium-Font-Size: 16px;
87
+ --Body-Medium-Font-Weight: 500;
88
+ --Body-Medium-Line-Height: 24px;
89
+ --Body-Medium-Letter-Spacing: 0px;
90
+ --Body-Medium-Semibold-Font-Weight: 600;
91
+ --Body-Medium-Bold-Font-Weight: 700;
92
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
93
+ --Body-Large-Font-Size: 18px;
94
+ --Body-Large-Font-Weight: 500;
95
+ --Body-Large-Line-Height: 27px;
96
+ --Body-Large-Letter-Spacing: 0px;
97
+ --Body-Large-Semibold-Font-Weight: 600;
98
+ --Body-Large-Bold-Font-Weight: 700;
99
+
100
+ /* Caption */
101
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
102
+ --Caption-Font-Size: 14px;
103
+ --Caption-Font-Weight: 500;
104
+ --Caption-Line-Height: 21px;
105
+ --Caption-Letter-Spacing: 0px;
106
+ --Caption-Bold-Font-Weight: 700;
107
+
108
+ /* Label */
109
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
110
+ --Label-ExtraSmall-Font-Size: 11px;
111
+ --Label-ExtraSmall-Font-Weight: 600;
112
+ --Label-ExtraSmall-Line-Height: 16.5px;
113
+ --Label-ExtraSmall-Letter-Spacing: 0px;
114
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
115
+ --Label-Small-Font-Size: 12.5px;
116
+ --Label-Small-Font-Weight: 600;
117
+ --Label-Small-Line-Height: 18.75px;
118
+ --Label-Small-Letter-Spacing: 0px;
119
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
120
+ --Label-Medium-Font-Size: 16px;
121
+ --Label-Medium-Font-Weight: 600;
122
+ --Label-Medium-Line-Height: 24px;
123
+ --Label-Medium-Letter-Spacing: 0px;
124
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
125
+ --Label-Large-Font-Size: 18px;
126
+ --Label-Large-Font-Weight: 600;
127
+ --Label-Large-Line-Height: 27px;
128
+ --Label-Large-Letter-Spacing: 0px;
129
+
130
+ /* Legal */
131
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
132
+ --Legal-Font-Size: 10px;
133
+ --Legal-Font-Weight: 400;
134
+ --Legal-Line-Height: 15px;
135
+ --Legal-Letter-Spacing: 0px;
136
+ --Legal-Semibold-Font-Weight: 600;
137
+
138
+ /* Overline */
139
+ --Font-Family-Overline: var(--Platform-Font-Families-Decorative);
140
+ --Overline-Small-Font-Size: 14px;
141
+ --Overline-Small-Font-Weight: 500;
142
+ --Overline-Small-Line-Height: 21px;
143
+ --Overline-Small-Letter-Spacing: 0px;
144
+ --Font-Family-Overline: var(--Platform-Font-Families-Decorative);
145
+ --Overline-Medium-Font-Size: 16px;
146
+ --Overline-Medium-Font-Weight: 600;
147
+ --Overline-Medium-Line-Height: 24px;
148
+ --Overline-Medium-Letter-Spacing: 0px;
149
+ --Font-Family-Overline: var(--Platform-Font-Families-Decorative);
150
+ --Overline-Large-Font-Size: 18px;
151
+ --Overline-Large-Font-Weight: 600;
152
+ --Overline-Large-Line-Height: 27px;
153
+ --Overline-Large-Letter-Spacing: 0px;
154
+
155
+ /* Number */
156
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
157
+ --Number-Small-Font-Size: 16px;
158
+ --Number-Small-Font-Weight: 700;
159
+ --Number-Small-Line-Height: 16px;
160
+ --Number-Small-Letter-Spacing: 0px;
161
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
162
+ --Number-Medium-Font-Size: 28px;
163
+ --Number-Medium-Font-Weight: 700;
164
+ --Number-Medium-Line-Height: 28px;
165
+ --Number-Medium-Letter-Spacing: 0px;
166
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
167
+ --Number-Large-Font-Size: 36px;
168
+ --Number-Large-Font-Weight: 700;
169
+ --Number-Large-Line-Height: 36px;
170
+ --Number-Large-Letter-Spacing: 0px;
171
+
172
+ /* Button */
173
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
174
+ --Button-ExtraSmall-Font-Size: 11px;
175
+ --Button-ExtraSmall-Font-Weight: 600;
176
+ --Button-ExtraSmall-Line-Height: 11px;
177
+ --Button-ExtraSmall-Letter-Spacing: 0px;
178
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
179
+ --Button-Small-Font-Size: 14px;
180
+ --Button-Small-Font-Weight: 600;
181
+ --Button-Small-Line-Height: 14px;
182
+ --Button-Small-Letter-Spacing: 0px;
183
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
184
+ --Button-Standard-Font-Size: 16px;
185
+ --Button-Standard-Font-Weight: 600;
186
+ --Button-Standard-Line-Height: 16px;
187
+ --Button-Standard-Letter-Spacing: 0px;
188
+
189
+ }
190
+
191
+ [data-platform="IOS-Mobile"] {
192
+
193
+ /* Display */
194
+ --Font-Family-Display: var(--Platform-Font-Families-Decorative);
195
+ --Display-Small-Font-Size: 28px;
196
+ --Display-Small-Font-Weight: 600;
197
+ --Display-Small-Line-Height: 28px;
198
+ --Display-Small-Letter-Spacing: 0px;
199
+ --Font-Family-Display: var(--Platform-Font-Families-Header);
200
+ --Display-Medium-Font-Size: 28px;
201
+ --Display-Medium-Font-Weight: 600;
202
+ --Display-Medium-Line-Height: 28px;
203
+ --Display-Medium-Letter-Spacing: 0px;
204
+ --Font-Family-Display: var(--Platform-Font-Families-Decorative);
205
+ --Display-Large-Font-Size: 28px;
206
+ --Display-Large-Font-Weight: 600;
207
+ --Display-Large-Line-Height: 28px;
208
+ --Display-Large-Letter-Spacing: 0px;
209
+
210
+ /* Headers */
211
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
212
+ --H1-Font-Size: 28px;
213
+ --H1-Font-Weight: 600;
214
+ --H1-Line-Height: 28px;
215
+ --H1-Letter-Spacing: 0px;
216
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
217
+ --H2-Font-Size: 26px;
218
+ --H2-Font-Weight: 600;
219
+ --H2-Line-Height: 26px;
220
+ --H2-Letter-Spacing: 0px;
221
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
222
+ --H3-Font-Size: 24px;
223
+ --H3-Font-Weight: 600;
224
+ --H3-Line-Height: 24px;
225
+ --H3-Letter-Spacing: 0px;
226
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
227
+ --H4-Font-Size: 20px;
228
+ --H4-Font-Weight: 600;
229
+ --H4-Line-Height: 20px;
230
+ --H4-Letter-Spacing: 0px;
231
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
232
+ --H5-Font-Size: 18px;
233
+ --H5-Font-Weight: 600;
234
+ --H5-Line-Height: 18px;
235
+ --H5-Letter-Spacing: 0px;
236
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
237
+ --H6-Font-Size: 16px;
238
+ --H6-Font-Weight: 600;
239
+ --H6-Line-Height: 16px;
240
+ --H6-Letter-Spacing: 0px;
241
+
242
+ /* Subtitle */
243
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
244
+ --Subtitle-Small-Font-Size: 16px;
245
+ --Subtitle-Small-Font-Weight: 700;
246
+ --Subtitle-Small-Line-Height: 24px;
247
+ --Subtitle-Small-Letter-Spacing: 0px;
248
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
249
+ --Subtitle-Large-Font-Size: 16px;
250
+ --Subtitle-Large-Font-Weight: 700;
251
+ --Subtitle-Large-Line-Height: 24px;
252
+ --Subtitle-Large-Letter-Spacing: 0px;
253
+
254
+ /* Body */
255
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
256
+ --Body-Small-Font-Size: 14px;
257
+ --Body-Small-Font-Weight: 500;
258
+ --Body-Small-Line-Height: 21px;
259
+ --Body-Small-Letter-Spacing: 0px;
260
+ --Body-Small-Semibold-Font-Weight: 600;
261
+ --Body-Small-Bold-Font-Weight: 700;
262
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
263
+ --Body-Medium-Font-Size: 16px;
264
+ --Body-Medium-Font-Weight: 600;
265
+ --Body-Medium-Line-Height: 24px;
266
+ --Body-Medium-Letter-Spacing: 0px;
267
+ --Body-Medium-Semibold-Font-Weight: 600;
268
+ --Body-Medium-Bold-Font-Weight: 700;
269
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
270
+ --Body-Large-Font-Size: 18px;
271
+ --Body-Large-Font-Weight: 600;
272
+ --Body-Large-Line-Height: 27px;
273
+ --Body-Large-Letter-Spacing: 0px;
274
+ --Body-Large-Semibold-Font-Weight: 600;
275
+ --Body-Large-Bold-Font-Weight: 700;
276
+
277
+ /* Caption */
278
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
279
+ --Caption-Font-Size: 14px;
280
+ --Caption-Font-Weight: 500;
281
+ --Caption-Line-Height: 21px;
282
+ --Caption-Letter-Spacing: 0px;
283
+ --Caption-Bold-Font-Weight: 700;
284
+
285
+ /* Label */
286
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
287
+ --Label-ExtraSmall-Font-Size: 11px;
288
+ --Label-ExtraSmall-Font-Weight: 600;
289
+ --Label-ExtraSmall-Line-Height: 16.5px;
290
+ --Label-ExtraSmall-Letter-Spacing: 0px;
291
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
292
+ --Label-Small-Font-Size: 12.5px;
293
+ --Label-Small-Font-Weight: 600;
294
+ --Label-Small-Line-Height: 18.75px;
295
+ --Label-Small-Letter-Spacing: 0px;
296
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
297
+ --Label-Medium-Font-Size: 16px;
298
+ --Label-Medium-Font-Weight: 600;
299
+ --Label-Medium-Line-Height: 24px;
300
+ --Label-Medium-Letter-Spacing: 0px;
301
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
302
+ --Label-Large-Font-Size: 18px;
303
+ --Label-Large-Font-Weight: 600;
304
+ --Label-Large-Line-Height: 27px;
305
+ --Label-Large-Letter-Spacing: 0px;
306
+
307
+ /* Legal */
308
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
309
+ --Legal-Font-Size: 10px;
310
+ --Legal-Font-Weight: 400;
311
+ --Legal-Line-Height: 15px;
312
+ --Legal-Letter-Spacing: 0px;
313
+ --Legal-Semibold-Font-Weight: 600;
314
+
315
+ /* Overline */
316
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
317
+ --Overline-Small-Font-Size: 14px;
318
+ --Overline-Small-Font-Weight: 500;
319
+ --Overline-Small-Line-Height: 21px;
320
+ --Overline-Small-Letter-Spacing: 0px;
321
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
322
+ --Overline-Medium-Font-Size: 16px;
323
+ --Overline-Medium-Font-Weight: 600;
324
+ --Overline-Medium-Line-Height: 24px;
325
+ --Overline-Medium-Letter-Spacing: 0px;
326
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
327
+ --Overline-Large-Font-Size: 18px;
328
+ --Overline-Large-Font-Weight: 600;
329
+ --Overline-Large-Line-Height: 27px;
330
+ --Overline-Large-Letter-Spacing: 0px;
331
+
332
+ /* Number */
333
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
334
+ --Number-Small-Font-Size: 16px;
335
+ --Number-Small-Font-Weight: 700;
336
+ --Number-Small-Line-Height: 16px;
337
+ --Number-Small-Letter-Spacing: 0px;
338
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
339
+ --Number-Medium-Font-Size: 28px;
340
+ --Number-Medium-Font-Weight: 700;
341
+ --Number-Medium-Line-Height: 28px;
342
+ --Number-Medium-Letter-Spacing: 0px;
343
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
344
+ --Number-Large-Font-Size: 18px;
345
+ --Number-Large-Font-Weight: 700;
346
+ --Number-Large-Line-Height: 27px;
347
+ --Number-Large-Letter-Spacing: 0px;
348
+
349
+ /* Button */
350
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
351
+ --Button-ExtraSmall-Font-Size: 11px;
352
+ --Button-ExtraSmall-Font-Weight: 600;
353
+ --Button-ExtraSmall-Line-Height: 11px;
354
+ --Button-ExtraSmall-Letter-Spacing: 0px;
355
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
356
+ --Button-Small-Font-Size: 14px;
357
+ --Button-Small-Font-Weight: 600;
358
+ --Button-Small-Line-Height: 14px;
359
+ --Button-Small-Letter-Spacing: 0px;
360
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
361
+ --Button-Standard-Font-Size: 16px;
362
+ --Button-Standard-Font-Weight: 600;
363
+ --Button-Standard-Line-Height: 16px;
364
+ --Button-Standard-Letter-Spacing: 0px;
365
+
366
+ }
367
+
368
+ [data-platform="IOS-Tablet"] {
369
+
370
+ /* Display */
371
+ --Font-Family-Display: var(--Platform-Font-Families-Decorative);
372
+ --Display-Small-Font-Size: 28px;
373
+ --Display-Small-Font-Weight: 600;
374
+ --Display-Small-Line-Height: 28px;
375
+ --Display-Small-Letter-Spacing: 0px;
376
+ --Font-Family-Display: var(--Platform-Font-Families-Header);
377
+ --Display-Medium-Font-Size: 28px;
378
+ --Display-Medium-Font-Weight: 600;
379
+ --Display-Medium-Line-Height: 28px;
380
+ --Display-Medium-Letter-Spacing: 0px;
381
+ --Font-Family-Display: var(--Platform-Font-Families-Decorative);
382
+ --Display-Large-Font-Size: 28px;
383
+ --Display-Large-Font-Weight: 600;
384
+ --Display-Large-Line-Height: 28px;
385
+ --Display-Large-Letter-Spacing: 0px;
386
+
387
+ /* Headers */
388
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
389
+ --H1-Font-Size: 28px;
390
+ --H1-Font-Weight: 600;
391
+ --H1-Line-Height: 28px;
392
+ --H1-Letter-Spacing: 0px;
393
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
394
+ --H2-Font-Size: 26px;
395
+ --H2-Font-Weight: 600;
396
+ --H2-Line-Height: 26px;
397
+ --H2-Letter-Spacing: 0px;
398
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
399
+ --H3-Font-Size: 24px;
400
+ --H3-Font-Weight: 600;
401
+ --H3-Line-Height: 24px;
402
+ --H3-Letter-Spacing: 0px;
403
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
404
+ --H4-Font-Size: 20px;
405
+ --H4-Font-Weight: 600;
406
+ --H4-Line-Height: 20px;
407
+ --H4-Letter-Spacing: 0px;
408
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
409
+ --H5-Font-Size: 18px;
410
+ --H5-Font-Weight: 600;
411
+ --H5-Line-Height: 18px;
412
+ --H5-Letter-Spacing: 0px;
413
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
414
+ --H6-Font-Size: 16px;
415
+ --H6-Font-Weight: 600;
416
+ --H6-Line-Height: 16px;
417
+ --H6-Letter-Spacing: 0px;
418
+
419
+ /* Subtitle */
420
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
421
+ --Subtitle-Small-Font-Size: 16px;
422
+ --Subtitle-Small-Font-Weight: 700;
423
+ --Subtitle-Small-Line-Height: 24px;
424
+ --Subtitle-Small-Letter-Spacing: 0px;
425
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
426
+ --Subtitle-Large-Font-Size: 18px;
427
+ --Subtitle-Large-Font-Weight: 700;
428
+ --Subtitle-Large-Line-Height: 32px;
429
+ --Subtitle-Large-Letter-Spacing: 0px;
430
+
431
+ /* Body */
432
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
433
+ --Body-Small-Font-Size: 14px;
434
+ --Body-Small-Font-Weight: 500;
435
+ --Body-Small-Line-Height: 21px;
436
+ --Body-Small-Letter-Spacing: 0px;
437
+ --Body-Small-Semibold-Font-Weight: 600;
438
+ --Body-Small-Bold-Font-Weight: 700;
439
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
440
+ --Body-Medium-Font-Size: 16px;
441
+ --Body-Medium-Font-Weight: 500;
442
+ --Body-Medium-Line-Height: 24px;
443
+ --Body-Medium-Letter-Spacing: 0px;
444
+ --Body-Medium-Semibold-Font-Weight: 600;
445
+ --Body-Medium-Bold-Font-Weight: 700;
446
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
447
+ --Body-Large-Font-Size: 18px;
448
+ --Body-Large-Font-Weight: 600;
449
+ --Body-Large-Line-Height: 27px;
450
+ --Body-Large-Letter-Spacing: 0px;
451
+ --Body-Large-Semibold-Font-Weight: 600;
452
+ --Body-Large-Bold-Font-Weight: 700;
453
+
454
+ /* Caption */
455
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
456
+ --Caption-Font-Size: 14px;
457
+ --Caption-Font-Weight: 500;
458
+ --Caption-Line-Height: 21px;
459
+ --Caption-Letter-Spacing: 0px;
460
+ --Caption-Bold-Font-Weight: 700;
461
+
462
+ /* Label */
463
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
464
+ --Label-ExtraSmall-Font-Size: 11px;
465
+ --Label-ExtraSmall-Font-Weight: 600;
466
+ --Label-ExtraSmall-Line-Height: 16.5px;
467
+ --Label-ExtraSmall-Letter-Spacing: 0px;
468
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
469
+ --Label-Small-Font-Size: 12.5px;
470
+ --Label-Small-Font-Weight: 600;
471
+ --Label-Small-Line-Height: 18.75px;
472
+ --Label-Small-Letter-Spacing: 0px;
473
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
474
+ --Label-Medium-Font-Size: 16px;
475
+ --Label-Medium-Font-Weight: 600;
476
+ --Label-Medium-Line-Height: 24px;
477
+ --Label-Medium-Letter-Spacing: 0px;
478
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
479
+ --Label-Large-Font-Size: 18px;
480
+ --Label-Large-Font-Weight: 600;
481
+ --Label-Large-Line-Height: 27px;
482
+ --Label-Large-Letter-Spacing: 0px;
483
+
484
+ /* Legal */
485
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
486
+ --Legal-Font-Size: 10px;
487
+ --Legal-Font-Weight: 400;
488
+ --Legal-Line-Height: 15px;
489
+ --Legal-Letter-Spacing: 0px;
490
+ --Legal-Semibold-Font-Weight: 600;
491
+
492
+ /* Overline */
493
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
494
+ --Overline-Small-Font-Size: 14px;
495
+ --Overline-Small-Font-Weight: 500;
496
+ --Overline-Small-Line-Height: 21px;
497
+ --Overline-Small-Letter-Spacing: 0px;
498
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
499
+ --Overline-Medium-Font-Size: 16px;
500
+ --Overline-Medium-Font-Weight: 600;
501
+ --Overline-Medium-Line-Height: 24px;
502
+ --Overline-Medium-Letter-Spacing: 0px;
503
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
504
+ --Overline-Large-Font-Size: 18px;
505
+ --Overline-Large-Font-Weight: 600;
506
+ --Overline-Large-Line-Height: 27px;
507
+ --Overline-Large-Letter-Spacing: 0px;
508
+
509
+ /* Number */
510
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
511
+ --Number-Small-Font-Size: 16px;
512
+ --Number-Small-Font-Weight: 700;
513
+ --Number-Small-Line-Height: 16px;
514
+ --Number-Small-Letter-Spacing: 0px;
515
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
516
+ --Number-Medium-Font-Size: 28px;
517
+ --Number-Medium-Font-Weight: 700;
518
+ --Number-Medium-Line-Height: 16px;
519
+ --Number-Medium-Letter-Spacing: 0px;
520
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
521
+ --Number-Large-Font-Size: 36px;
522
+ --Number-Large-Font-Weight: 700;
523
+ --Number-Large-Line-Height: 36px;
524
+ --Number-Large-Letter-Spacing: 0px;
525
+
526
+ /* Button */
527
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
528
+ --Button-ExtraSmall-Font-Size: 11px;
529
+ --Button-ExtraSmall-Font-Weight: 600;
530
+ --Button-ExtraSmall-Line-Height: 28px;
531
+ --Button-ExtraSmall-Letter-Spacing: 0px;
532
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
533
+ --Button-Small-Font-Size: 14px;
534
+ --Button-Small-Font-Weight: 600;
535
+ --Button-Small-Line-Height: 16px;
536
+ --Button-Small-Letter-Spacing: 0px;
537
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
538
+ --Button-Standard-Font-Size: 16px;
539
+ --Button-Standard-Font-Weight: 600;
540
+ --Button-Standard-Line-Height: 16px;
541
+ --Button-Standard-Letter-Spacing: 0px;
542
+
543
+ }
544
+
545
+ [data-platform="Android"] {
546
+
547
+ /* Display */
548
+ --Font-Family-Display: var(--Platform-Font-Families-Decorative);
549
+ --Display-Small-Font-Size: 28px;
550
+ --Display-Small-Font-Weight: 600;
551
+ --Display-Small-Line-Height: 28px;
552
+ --Display-Small-Letter-Spacing: 0px;
553
+ --Font-Family-Display: var(--Platform-Font-Families-Header);
554
+ --Display-Medium-Font-Size: 28px;
555
+ --Display-Medium-Font-Weight: 600;
556
+ --Display-Medium-Line-Height: 28px;
557
+ --Display-Medium-Letter-Spacing: 0px;
558
+ --Font-Family-Display: var(--Platform-Font-Families-Decorative);
559
+ --Display-Large-Font-Size: 28px;
560
+ --Display-Large-Font-Weight: 600;
561
+ --Display-Large-Line-Height: 28px;
562
+ --Display-Large-Letter-Spacing: 0px;
563
+
564
+ /* Headers */
565
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
566
+ --H1-Font-Size: 28px;
567
+ --H1-Font-Weight: 600;
568
+ --H1-Line-Height: 28px;
569
+ --H1-Letter-Spacing: 0px;
570
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
571
+ --H2-Font-Size: 26px;
572
+ --H2-Font-Weight: 600;
573
+ --H2-Line-Height: 26px;
574
+ --H2-Letter-Spacing: 0px;
575
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
576
+ --H3-Font-Size: 24px;
577
+ --H3-Font-Weight: 600;
578
+ --H3-Line-Height: 24px;
579
+ --H3-Letter-Spacing: 0px;
580
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
581
+ --H4-Font-Size: 20px;
582
+ --H4-Font-Weight: 600;
583
+ --H4-Line-Height: 20px;
584
+ --H4-Letter-Spacing: 0px;
585
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
586
+ --H5-Font-Size: 18px;
587
+ --H5-Font-Weight: 600;
588
+ --H5-Line-Height: 18px;
589
+ --H5-Letter-Spacing: 0px;
590
+ --Font-Family-Body: var(--Platform-Font-Families-Decorative);
591
+ --H6-Font-Size: 16px;
592
+ --H6-Font-Weight: 600;
593
+ --H6-Line-Height: 16px;
594
+ --H6-Letter-Spacing: 0px;
595
+
596
+ /* Subtitle */
597
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
598
+ --Subtitle-Small-Font-Size: 16px;
599
+ --Subtitle-Small-Font-Weight: 700;
600
+ --Subtitle-Small-Line-Height: 24px;
601
+ --Subtitle-Small-Letter-Spacing: 0px;
602
+ --Font-Family-Subtitle: var(--Platform-Font-Families-Body);
603
+ --Subtitle-Large-Font-Size: 18px;
604
+ --Subtitle-Large-Font-Weight: 700;
605
+ --Subtitle-Large-Line-Height: 32px;
606
+ --Subtitle-Large-Letter-Spacing: 0px;
607
+
608
+ /* Body */
609
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
610
+ --Body-Small-Font-Size: 14px;
611
+ --Body-Small-Font-Weight: 500;
612
+ --Body-Small-Line-Height: 21px;
613
+ --Body-Small-Letter-Spacing: 0px;
614
+ --Body-Small-Semibold-Font-Weight: 600;
615
+ --Body-Small-Bold-Font-Weight: 700;
616
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
617
+ --Body-Medium-Font-Size: 16px;
618
+ --Body-Medium-Font-Weight: 500;
619
+ --Body-Medium-Line-Height: 24px;
620
+ --Body-Medium-Letter-Spacing: 0px;
621
+ --Body-Medium-Semibold-Font-Weight: 600;
622
+ --Body-Medium-Bold-Font-Weight: 700;
623
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
624
+ --Body-Large-Font-Size: 18px;
625
+ --Body-Large-Font-Weight: 600;
626
+ --Body-Large-Line-Height: 27px;
627
+ --Body-Large-Letter-Spacing: 0px;
628
+ --Body-Large-Semibold-Font-Weight: 600;
629
+ --Body-Large-Bold-Font-Weight: 700;
630
+
631
+ /* Caption */
632
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
633
+ --Caption-Font-Size: 14px;
634
+ --Caption-Font-Weight: 500;
635
+ --Caption-Line-Height: 21px;
636
+ --Caption-Letter-Spacing: 0px;
637
+ --Caption-Bold-Font-Weight: 700;
638
+
639
+ /* Label */
640
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
641
+ --Label-ExtraSmall-Font-Size: 11px;
642
+ --Label-ExtraSmall-Font-Weight: 600;
643
+ --Label-ExtraSmall-Line-Height: 16.5px;
644
+ --Label-ExtraSmall-Letter-Spacing: 0px;
645
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
646
+ --Label-Small-Font-Size: 12.5px;
647
+ --Label-Small-Font-Weight: 600;
648
+ --Label-Small-Line-Height: 18.75px;
649
+ --Label-Small-Letter-Spacing: 0px;
650
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
651
+ --Label-Medium-Font-Size: 16px;
652
+ --Label-Medium-Font-Weight: 600;
653
+ --Label-Medium-Line-Height: 24px;
654
+ --Label-Medium-Letter-Spacing: 0px;
655
+ --Font-Family-Label: var(--Platform-Font-Families-Body);
656
+ --Label-Large-Font-Size: 18px;
657
+ --Label-Large-Font-Weight: 600;
658
+ --Label-Large-Line-Height: 27px;
659
+ --Label-Large-Letter-Spacing: 0px;
660
+
661
+ /* Legal */
662
+ --Font-Family-Body: var(--Platform-Font-Families-Body);
663
+ --Legal-Font-Size: 10px;
664
+ --Legal-Font-Weight: 400;
665
+ --Legal-Line-Height: 15px;
666
+ --Legal-Letter-Spacing: 0px;
667
+ --Legal-Semibold-Font-Weight: 600;
668
+
669
+ /* Overline */
670
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
671
+ --Overline-Small-Font-Size: 14px;
672
+ --Overline-Small-Font-Weight: 500;
673
+ --Overline-Small-Line-Height: 21px;
674
+ --Overline-Small-Letter-Spacing: 0px;
675
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
676
+ --Overline-Medium-Font-Size: 16px;
677
+ --Overline-Medium-Font-Weight: 600;
678
+ --Overline-Medium-Line-Height: 24px;
679
+ --Overline-Medium-Letter-Spacing: 0px;
680
+ --Font-Family-Overline: var(--Platform-Font-Families-Body);
681
+ --Overline-Large-Font-Size: 18px;
682
+ --Overline-Large-Font-Weight: 600;
683
+ --Overline-Large-Line-Height: 27px;
684
+ --Overline-Large-Letter-Spacing: 0px;
685
+
686
+ /* Number */
687
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
688
+ --Number-Small-Font-Size: 16px;
689
+ --Number-Small-Font-Weight: 700;
690
+ --Number-Small-Line-Height: 16px;
691
+ --Number-Small-Letter-Spacing: 0px;
692
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
693
+ --Number-Medium-Font-Size: 28px;
694
+ --Number-Medium-Font-Weight: 700;
695
+ --Number-Medium-Line-Height: 16px;
696
+ --Number-Medium-Letter-Spacing: 0px;
697
+ --Font-Family-Number: var(--Platform-Font-Families-Body);
698
+ --Number-Large-Font-Size: 36px;
699
+ --Number-Large-Font-Weight: 700;
700
+ --Number-Large-Line-Height: 36px;
701
+ --Number-Large-Letter-Spacing: 0px;
702
+
703
+ /* Button */
704
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
705
+ --Button-ExtraSmall-Font-Size: 11px;
706
+ --Button-ExtraSmall-Font-Weight: 600;
707
+ --Button-ExtraSmall-Line-Height: 28px;
708
+ --Button-ExtraSmall-Letter-Spacing: 0px;
709
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
710
+ --Button-Small-Font-Size: 14px;
711
+ --Button-Small-Font-Weight: 600;
712
+ --Button-Small-Line-Height: 16px;
713
+ --Button-Small-Letter-Spacing: 0px;
714
+ --Font-Family-Button: var(--Platform-Font-Families-Body);
715
+ --Button-Standard-Font-Size: 16px;
716
+ --Button-Standard-Font-Weight: 600;
717
+ --Button-Standard-Line-Height: 16px;
718
+ --Button-Standard-Letter-Spacing: 0px;
719
+
720
+ }