contain-css-svelte 1.1.1 → 1.1.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 (84) hide show
  1. package/dist/Card.svelte +276 -109
  2. package/dist/controls/Button.svelte +93 -67
  3. package/dist/controls/ButtonLink.svelte +74 -68
  4. package/dist/controls/Checkbox.svelte +4 -1
  5. package/dist/controls/Input.svelte +3 -0
  6. package/dist/controls/MiniButton.svelte +21 -17
  7. package/dist/controls/RadioButton.svelte +4 -1
  8. package/dist/controls/Select.svelte +18 -27
  9. package/dist/controls/Slider.svelte +2 -2
  10. package/dist/controls/TabItem.svelte +31 -28
  11. package/dist/cssprops.js +14 -2
  12. package/dist/dropdowns/DropdownMenu.svelte +74 -69
  13. package/dist/layout/Accordion.svelte +68 -83
  14. package/dist/layout/Accordion.svelte.d.ts +1 -1
  15. package/dist/layout/Bar.svelte +8 -8
  16. package/dist/layout/Container.svelte +275 -116
  17. package/dist/layout/DataList.svelte +17 -24
  18. package/dist/layout/DataListItem.svelte +255 -96
  19. package/dist/layout/Fieldset.svelte +20 -17
  20. package/dist/layout/Form.svelte +20 -17
  21. package/dist/layout/FormItem.svelte +3 -0
  22. package/dist/layout/GridLayout.svelte +3 -0
  23. package/dist/layout/Hero.svelte +251 -94
  24. package/dist/layout/Inline.svelte +3 -154
  25. package/dist/layout/MenuList.svelte +79 -19
  26. package/dist/layout/Page.svelte +11 -8
  27. package/dist/layout/Sidebar.svelte +34 -29
  28. package/dist/layout/SplitPane.svelte +1 -1
  29. package/dist/layout/Stack.svelte +4 -164
  30. package/dist/layout/TabBar.svelte +5 -5
  31. package/dist/layout/Table.svelte +293 -147
  32. package/dist/layout/Tile.svelte +269 -117
  33. package/dist/misc/CodeInner.svelte +21 -19
  34. package/dist/misc/Progress.svelte +207 -45
  35. package/dist/misc/Tag.svelte +19 -11
  36. package/dist/overlays/Dialog.svelte +17 -12
  37. package/dist/overlays/Tooltip.svelte +188 -39
  38. package/dist/review/ReviewAppPage.svelte +33 -1
  39. package/dist/review/ReviewIndexShell.svelte +96 -0
  40. package/dist/review/ReviewIndexShell.svelte.d.ts +9 -0
  41. package/dist/review/ReviewRootIndex.svelte +14 -11
  42. package/dist/review/ReviewThemeAppIndex.svelte +18 -12
  43. package/dist/review/ReviewThemeIndex.svelte +29 -19
  44. package/dist/review/ReviewThemeStyle.svelte +33 -0
  45. package/dist/review/ReviewThemeStyle.svelte.d.ts +7 -0
  46. package/dist/review/ReviewThemeSwitcher.svelte +77 -0
  47. package/dist/review/ReviewThemeSwitcher.svelte.d.ts +7 -0
  48. package/dist/review/loadReviewAppPage.d.ts +2 -2
  49. package/dist/review/scenarios/LaunchStudio.svelte +12 -7
  50. package/dist/review/themes.d.ts +83 -9
  51. package/dist/review/themes.js +40 -8
  52. package/dist/sass/_affordances.scss +17 -2
  53. package/dist/sass/_box.scss +23 -12
  54. package/dist/sass/_functions.scss +42 -0
  55. package/dist/sass/_typography.scss +100 -16
  56. package/dist/theme/combinedThemes.d.ts +34 -0
  57. package/dist/theme/combinedThemes.js +38 -0
  58. package/dist/theme/themeConfig.js +18 -0
  59. package/dist/typography/TextLayout.svelte +178 -22
  60. package/dist/vars/affordances.css +55 -21
  61. package/dist/vars/colors.css +4 -1
  62. package/dist/vars/defaults.css +62 -23
  63. package/dist/vars/flat.css +33 -0
  64. package/dist/vars/layered.css +39 -0
  65. package/dist/vars/soft-corners.css +13 -0
  66. package/dist/vars/solid-headings.css +19 -0
  67. package/dist/vars/themes/bootstrap.css +4 -2
  68. package/dist/vars/themes/canyon-modern-serif-fancy.css +3 -0
  69. package/dist/vars/themes/canyon.css +55 -0
  70. package/dist/vars/themes/dark-ibm-layered.css +3 -0
  71. package/dist/vars/themes/dark.css +6 -4
  72. package/dist/vars/themes/forest-editorial-rounded.css +3 -0
  73. package/dist/vars/themes/forest.css +55 -0
  74. package/dist/vars/themes/light-airy-solid.css +3 -0
  75. package/dist/vars/themes/light.css +8 -8
  76. package/dist/vars/themes/material.css +7 -5
  77. package/dist/vars/themes/purple.css +4 -2
  78. package/dist/vars/themes/retro.css +4 -2
  79. package/dist/vars/themes/typography-browser.css +1 -1
  80. package/dist/vars/themes/typography-carbon.css +1 -1
  81. package/dist/vars/themes/typography-editorial.css +20 -0
  82. package/dist/vars/themes/typography-modern-serif.css +20 -0
  83. package/dist/vars/typography.css +3 -1
  84. package/package.json +1 -1
package/dist/Card.svelte CHANGED
@@ -47,15 +47,17 @@ let hasFooter = $derived(Boolean(footer));
47
47
  container-type: inline-size;
48
48
  width: var(--w);
49
49
  margin: var(--card-margin, var(--margin, 16px));
50
- border-radius: var(--card-border-radius, var(--container-border-radius, var(--border-radius, 0)));
51
- border: var(--card-border, var(--container-border, var(--border, var(--border-width) var(--border-style) var(--border-color))));
52
- --_background-color: var(--card-bg, var(--container-bg, var(--bg, unset)));
53
- --_color: var(--card-fg, var(--container-fg, var(--fg, unset)));
54
- --link-bg: var(--card-link-bg, var(--container-link-bg, inherit));
55
- --link-fg: var(--card-link-fg, var(--container-link-fg, inherit));
50
+ border-radius: var(--card-border-radius, var(--surface-border-radius, var(--border-radius, 0)));
51
+ border: var(--card-border, var(--surface-border, var(--border, var(--border-width) var(--border-style) var(--border-color))));
52
+ --_background-color: var(--card-bg, var(--surface-bg, var(--bg, unset)));
53
+ --_color: var(--card-fg, var(--surface-fg, var(--fg, unset)));
54
+ --link-bg: var(--card-link-bg, var(--surface-link-bg, inherit));
55
+ --link-fg: var(--card-link-fg, var(--surface-link-fg, inherit));
56
56
  background-color: var(--_background-color);
57
57
  color: var(--_color);
58
- box-shadow: var(--card-shadow-distance, var(--container-shadow-distance, var(--shadow-distance, var(--space)))) var(--card-shadow-distance, var(--container-shadow-distance, var(--shadow-distance, var(--space)))) var(--card-shadow-blur, var(--container-shadow-blur, var(--shadow-blur, var(--space)))) var(--card-shadow-color, var(--container-shadow-color, var(--shadow-color, rgba(127, 127, 127, 0.4))));
58
+ --_box-shadow:
59
+ var(--card-shadow-distance, var(--surface-shadow-distance, var(--shadow-distance, var(--space)))) var(--card-shadow-distance, var(--surface-shadow-distance, var(--shadow-distance, var(--space)))) var(--card-shadow-blur, var(--surface-shadow-blur, var(--shadow-blur, var(--space)))) var(--card-shadow-color, var(--surface-shadow-color, var(--shadow-color, rgba(127, 127, 127, 0.4))));
60
+ box-shadow: var(--_box-shadow);
59
61
  }
60
62
 
61
63
  .card.center section {
@@ -73,30 +75,30 @@ let hasFooter = $derived(Boolean(footer));
73
75
  }
74
76
 
75
77
  .card.fixedHeight::-webkit-scrollbar {
76
- width: var(--card-scrollbar-width, var(--container-scrollbar-width, var(--scrollbar-width, 6px)));
77
- height: var(--card-scrollbar-height, var(--container-scrollbar-height, var(--scrollbar-height, 6px)));
78
+ width: var(--card-scrollbar-width, var(--surface-scrollbar-width, var(--scrollbar-width, 6px)));
79
+ height: var(--card-scrollbar-height, var(--surface-scrollbar-height, var(--scrollbar-height, 6px)));
78
80
  }
79
81
 
80
82
  .card.fixedHeight::-webkit-scrollbar-track {
81
- background: var(--card-scrollbar-track-bg, var(--container-scrollbar-track-bg, var(--scrollbar-track-bg, transparent)));
83
+ background: var(--card-scrollbar-track-bg, var(--surface-scrollbar-track-bg, var(--scrollbar-track-bg, transparent)));
82
84
  }
83
85
 
84
86
  .card.fixedHeight::-webkit-scrollbar-thumb {
85
87
  background: transparent;
86
- border-radius: var(--card-scrollbar-thumb-radius, var(--container-scrollbar-thumb-radius, var(--scrollbar-thumb-radius, 3px)));
87
- transition: background var(--card-transition, var(--container-transition, var(--transition, 300ms)));
88
+ border-radius: var(--card-scrollbar-thumb-radius, var(--surface-scrollbar-thumb-radius, var(--scrollbar-thumb-radius, 3px)));
89
+ transition: background var(--card-transition, var(--surface-transition, var(--transition, 300ms)));
88
90
  }
89
91
 
90
92
  .card.fixedHeight:hover {
91
- scrollbar-color: var(--card-scrollbar-thumb-bg, var(--container-scrollbar-thumb-bg, var(--scrollbar-thumb-bg, rgba(0, 0, 0, 0.3)))) var(--card-scrollbar-track-bg, var(--container-scrollbar-track-bg, var(--scrollbar-track-bg, transparent)));
93
+ scrollbar-color: var(--card-scrollbar-thumb-bg, var(--surface-scrollbar-thumb-bg, var(--scrollbar-thumb-bg, rgba(0, 0, 0, 0.3)))) var(--card-scrollbar-track-bg, var(--surface-scrollbar-track-bg, var(--scrollbar-track-bg, transparent)));
92
94
  }
93
95
 
94
96
  .card.fixedHeight:hover::-webkit-scrollbar-thumb {
95
- background: var(--card-scrollbar-thumb-bg, var(--container-scrollbar-thumb-bg, var(--scrollbar-thumb-bg, rgba(0, 0, 0, 0.3))));
97
+ background: var(--card-scrollbar-thumb-bg, var(--surface-scrollbar-thumb-bg, var(--scrollbar-thumb-bg, rgba(0, 0, 0, 0.3))));
96
98
  }
97
99
 
98
100
  .card.fixedHeight:hover::-webkit-scrollbar-thumb:hover {
99
- background: var(--card-scrollbar-thumb-hover-bg, var(--container-scrollbar-thumb-hover-bg, var(--scrollbar-thumb-hover-bg, rgba(0, 0, 0, 0.5))));
101
+ background: var(--card-scrollbar-thumb-hover-bg, var(--surface-scrollbar-thumb-hover-bg, var(--scrollbar-thumb-hover-bg, rgba(0, 0, 0, 0.5))));
100
102
  }
101
103
 
102
104
  /* ── Card regions ───────────────────────────────────────── */
@@ -118,6 +120,9 @@ header {
118
120
  --_padding: var(--card-header-padding, var(--bar-padding, var(--padding, 4px)));
119
121
  padding: var(--_padding);
120
122
  border: var(--card-header-border, var(--bar-border, var(--border, inherit)));
123
+ border-width: var(--card-header-border-width, var(--bar-border-width, var(--__missing-border-width)));
124
+ border-style: var(--card-header-border-style, var(--bar-border-style, var(--__missing-border-style)));
125
+ border-color: var(--card-header-border-color, var(--bar-border-color, var(--__missing-border-color)));
121
126
  border-top: var(--card-header-border-top, var(--bar-border-top, var(--border-top, var(--card-header-border, var(--bar-border, var(--border, none))))));
122
127
  border-right: var(--card-header-border-right, var(--bar-border-right, var(--border-right, var(--card-header-border, var(--bar-border, var(--border, none))))));
123
128
  border-bottom: var(--card-header-border-bottom, var(--bar-border-bottom, var(--border-bottom, var(--card-header-border, var(--bar-border, var(--border, none))))));
@@ -162,6 +167,9 @@ footer {
162
167
  --_padding: var(--card-footer-padding, var(--bar-padding, var(--padding, 4px)));
163
168
  padding: var(--_padding);
164
169
  border: var(--card-footer-border, var(--bar-border, var(--border, inherit)));
170
+ border-width: var(--card-footer-border-width, var(--bar-border-width, var(--__missing-border-width)));
171
+ border-style: var(--card-footer-border-style, var(--bar-border-style, var(--__missing-border-style)));
172
+ border-color: var(--card-footer-border-color, var(--bar-border-color, var(--__missing-border-color)));
165
173
  border-top: var(--card-footer-border-top, var(--bar-border-top, var(--border-top, var(--card-footer-border, var(--bar-border, var(--border, none))))));
166
174
  border-right: var(--card-footer-border-right, var(--bar-border-right, var(--border-right, var(--card-footer-border, var(--bar-border, var(--border, none))))));
167
175
  border-bottom: var(--card-footer-border-bottom, var(--bar-border-bottom, var(--border-bottom, var(--card-footer-border, var(--bar-border, var(--border, none))))));
@@ -177,40 +185,43 @@ section {
177
185
  max-width: var(--line-width);
178
186
  width: 100%;
179
187
  box-sizing: border-box;
180
- --_background-color: var(--card-content-bg, var(--container-bg, var(--bg, unset)));
181
- --_color: var(--card-content-fg, var(--container-fg, var(--fg, unset)));
182
- --link-bg: var(--card-content-link-bg, var(--container-link-bg, inherit));
183
- --link-fg: var(--card-content-link-fg, var(--container-link-fg, inherit));
188
+ --_background-color: var(--card-content-bg, var(--surface-bg, var(--bg, unset)));
189
+ --_color: var(--card-content-fg, var(--surface-fg, var(--fg, unset)));
190
+ --link-bg: var(--card-content-link-bg, var(--surface-link-bg, inherit));
191
+ --link-fg: var(--card-content-link-fg, var(--surface-link-fg, inherit));
184
192
  background-color: var(--_background-color);
185
193
  color: var(--_color);
186
194
  box-sizing: border-box;
187
195
  --_padding: var(--card-content-padding, var(--padding, 4px));
188
196
  padding: var(--_padding);
189
197
  border: var(--card-content-border, var(--border, inherit));
198
+ border-width: var(--card-content-border-width, var(--__missing-border-width));
199
+ border-style: var(--card-content-border-style, var(--__missing-border-style));
200
+ border-color: var(--card-content-border-color, var(--__missing-border-color));
190
201
  border-top: var(--card-content-border-top, var(--border-top, var(--card-content-border, var(--border, none))));
191
202
  border-right: var(--card-content-border-right, var(--border-right, var(--card-content-border, var(--border, none))));
192
203
  border-bottom: var(--card-content-border-bottom, var(--border-bottom, var(--card-content-border, var(--border, none))));
193
204
  border-left: var(--card-content-border-left, var(--border-left, var(--card-content-border, var(--border, none))));
194
205
  border-radius: var(--card-content-border-radius, var(--border-radius, none));
195
- max-width: var(--card-line-width, var(--container-line-width, var(--line-width, unset)));
196
- font-family: var(--card-body-font-family, var(--container-body-font-family, var(--body-font-family, var(--font-family))));
197
- font-family: var(--card-font-family, var(--container-font-family, var(--font-family, unset)));
198
- text-transform: var(--card-text-transform, var(--container-text-transform, var(--text-transform, unset)));
199
- text-decoration: var(--card-text-decoration, var(--container-text-decoration, var(--text-decoration, unset)));
200
- --_font-size: var(--card-font-size, var(--container-font-size, var(--font-size, unset)));
206
+ max-width: var(--card-line-width, var(--surface-line-width, var(--line-width, unset)));
207
+ font-family: var(--card-body-font-family, var(--surface-body-font-family, var(--body-font-family, var(--font-family))));
208
+ font-family: var(--card-font-family, var(--surface-font-family, var(--font-family, unset)));
209
+ text-transform: var(--card-text-transform, var(--surface-text-transform, var(--text-transform, unset)));
210
+ text-decoration: var(--card-text-decoration, var(--surface-text-decoration, var(--text-decoration, unset)));
211
+ --_font-size: var(--card-font-size, var(--surface-font-size, var(--font-size, unset)));
201
212
  font-size: var(--_font-size);
202
- font-weight: var(--card-font-weight, var(--container-font-weight, var(--font-weight, unset)));
203
- line-height: var(--card-line-height, var(--container-line-height, var(--line-height, unset)));
204
- letter-spacing: var(--card-letter-spacing, var(--container-letter-spacing, var(--letter-spacing, unset)));
205
- --_margin-top: var(--card-margin, var(--container-margin, var(--margin, unset)));
206
- --_margin-top: var(--card-margin-top, var(--container-margin-top, var(--margin-top, unset)));
213
+ font-weight: var(--card-font-weight, var(--surface-font-weight, var(--font-weight, unset)));
214
+ line-height: var(--card-line-height, var(--surface-line-height, var(--line-height, unset)));
215
+ letter-spacing: var(--card-letter-spacing, var(--surface-letter-spacing, var(--letter-spacing, unset)));
216
+ --_margin-top: var(--card-margin, var(--surface-margin, var(--margin, unset)));
217
+ --_margin-top: var(--card-margin-top, var(--surface-margin-top, var(--margin-top, unset)));
207
218
  margin-top: var(--_margin-top);
208
- --_margin-bottom: var(--card-margin, var(--container-margin, var(--margin, unset)));
209
- --_margin-bottom: var(--card-margin-bottom, var(--container-margin-bottom, var(--margin-bottom, unset)));
219
+ --_margin-bottom: var(--card-margin, var(--surface-margin, var(--margin, unset)));
220
+ --_margin-bottom: var(--card-margin-bottom, var(--surface-margin-bottom, var(--margin-bottom, unset)));
210
221
  margin-bottom: var(--_margin-bottom);
211
- text-indent: var(--card-indent, var(--container-indent, var(--indent, unset)));
212
- font-variant: var(--card-font-variant, var(--container-font-variant, var(--font-variant, unset)));
213
- text-align: var(--card-text-align, var(--container-text-align, var(--text-align, unset)));
222
+ text-indent: var(--card-indent, var(--surface-indent, var(--indent, unset)));
223
+ font-variant: var(--card-font-variant, var(--surface-font-variant, var(--font-variant, unset)));
224
+ text-align: var(--card-text-align, var(--surface-text-align, var(--text-align, unset)));
214
225
  }
215
226
 
216
227
  section :global(p),
@@ -218,12 +229,12 @@ section :global(blockquote),
218
229
  section :global(dl),
219
230
  section :global(ul),
220
231
  section :global(ol) {
221
- max-width: var(--card-line-width, var(--container-line-width, var(--line-width, 40em)));
222
- font-family: var(--card-body-font-family, var(--container-body-font-family, var(--body-font-family, var(--font-family))));
223
- line-height: var(--card-line-height, var(--container-line-height, var(--line-height, 1.5)));
232
+ max-width: var(--card-line-width, var(--surface-line-width, var(--line-width, 40em)));
233
+ font-family: var(--card-body-font-family, var(--surface-body-font-family, var(--body-font-family, var(--font-family))));
234
+ line-height: var(--card-line-height, var(--surface-line-height, var(--line-height, 1.5)));
224
235
  margin-left: auto;
225
236
  margin-right: auto;
226
- font-weight: var(--card-body-font-weight, var(--container-body-font-weight, var(--body-font-weight, unset)));
237
+ font-weight: var(--card-body-font-weight, var(--surface-body-font-weight, var(--body-font-weight, unset)));
227
238
  }
228
239
 
229
240
  section :global(h1),
@@ -232,47 +243,203 @@ section :global(h3),
232
243
  section :global(h4),
233
244
  section :global(h5),
234
245
  section :global(h6) {
235
- color: var(--card-heading-fg, var(--container-heading-fg, var(--heading-fg, unset)));
236
- background: var(--card-heading-bg, var(--container-heading-bg, var(--heading-bg, transparent)));
237
- max-width: var(--card-line-width, var(--container-line-width, var(--line-width, unset)));
246
+ max-width: var(--card-line-width, var(--surface-line-width, var(--line-width, unset)));
238
247
  margin-left: auto;
239
248
  margin-right: auto;
240
- margin-bottom: var(--card-heading-margin-bottom, var(--container-heading-margin-bottom, var(--heading-margin-bottom, 0)));
241
- margin-top: var(--card-heading-margin-top, var(--container-heading-margin-top, var(--heading-margin-top, 1.5em)));
242
- /* Typography */
243
- font-family: var(--card-heading-font-family, var(--container-heading-font-family, var(--heading-font-family, inherit)));
244
- text-transform: var(--card-heading-text-transform, var(--container-heading-text-transform, var(--heading-text-transform, inherit)));
245
- text-decoration: var(--card-heading-text-decoration, var(--container-heading-text-decoration, var(--heading-text-decoration, inherit)));
246
- --_font-size: var(--card-heading-font-size, var(--container-heading-font-size, var(--heading-font-size, inherit)));
247
- font-size: var(--_font-size);
248
- font-weight: var(--card-heading-font-weight, var(--container-heading-font-weight, var(--heading-font-weight, inherit)));
249
- line-height: var(--card-heading-line-height, var(--container-heading-line-height, var(--heading-line-height, inherit)));
250
- letter-spacing: var(--card-heading-letter-spacing, var(--container-heading-letter-spacing, var(--heading-letter-spacing, inherit)));
251
- text-indent: var(--card-heading-indent, var(--container-heading-indent, var(--heading-indent, inherit)));
252
- font-variant: var(--card-heading-font-variant, var(--container-heading-font-variant, var(--heading-font-variant, inherit)));
253
- text-align: var(--card-heading-text-align, var(--container-heading-text-align, var(--heading-text-align, inherit)));
254
- /* font-family: fn.var(--heading-font-family, var(--body-font-family, var(--font-family, inherit)));
255
- font-size: fn.var(--heading-font-size, inherit);
256
- font-weight: fn.var(--heading-font-weight, var(--body-font-weight, var(--font-weight, inherit)));
257
- line-height: fn.var(--heading-line-height, var(--body-line-height, var(--line-height, inherit)));
258
- letter-spacing: fn.var(--heading-letter-spacing, var(--body-letter-spacing, var(--letter-spacing, inherit)));
259
- text-indent: fn.var(--heading-indent, var(--body-indent, var(--indent, inherit)));
260
- font-variant: fn.var(--heading-font-variant, var(--body-font-variant, var(--font-variant, inherit)));
261
- text-align: fn.var(--heading-text-align, var(--body-text-align, var(--text-align, inherit))); */
249
+ box-sizing: border-box;
250
+ margin-bottom: var(--card-heading-margin-bottom, var(--surface-heading-margin-bottom, var(--heading-margin-bottom, 0)));
251
+ margin-top: var(--card-heading-margin-top, var(--surface-heading-margin-top, var(--heading-margin-top, 1.5em)));
252
+ }
253
+
254
+ section :global(h1:first-child),
255
+ section :global(h2:first-child),
256
+ section :global(h3:first-child),
257
+ section :global(h4:first-child),
258
+ section :global(h5:first-child),
259
+ section :global(h6:first-child) {
260
+ margin-top: var(--card-first-heading-margin-top, var(--surface-first-heading-margin-top, var(--first-heading-margin-top, 0)));
261
+ }
262
+
263
+ section :global(h1) {
264
+ --_heading-color: var(--card-heading-1-fg, var(--surface-heading-1-fg, var(--card-heading-major-fg, var(--surface-heading-major-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--heading-1-fg, var(--heading-major-fg, var(--heading-fg, revert)))))))));
265
+ color: var(--_heading-color);
266
+ --_heading-background: var(--card-heading-1-bg, var(--surface-heading-1-bg, var(--card-heading-major-bg, var(--surface-heading-major-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--heading-1-bg, var(--heading-major-bg, var(--heading-bg, transparent)))))))));
267
+ background: var(--_heading-background);
268
+ --_heading-padding: var(--card-heading-1-padding, var(--surface-heading-1-padding, var(--card-heading-major-padding, var(--surface-heading-major-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--heading-1-padding, var(--heading-major-padding, var(--heading-padding, 0)))))))));
269
+ padding: var(--_heading-padding);
270
+ --_heading-border: var(--card-heading-1-border, var(--surface-heading-1-border, var(--card-heading-major-border, var(--surface-heading-major-border, var(--card-heading-border, var(--surface-heading-border, var(--heading-1-border, var(--heading-major-border, var(--heading-border, none)))))))));
271
+ border: var(--_heading-border);
272
+ border-width: var(--card-heading-1-border-width, var(--surface-heading-1-border-width, var(--card-heading-major-border-width, var(--surface-heading-major-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--heading-1-border-width, var(--heading-major-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
273
+ border-style: var(--card-heading-1-border-style, var(--surface-heading-1-border-style, var(--card-heading-major-border-style, var(--surface-heading-major-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--heading-1-border-style, var(--heading-major-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
274
+ border-color: var(--card-heading-1-border-color, var(--surface-heading-1-border-color, var(--card-heading-major-border-color, var(--surface-heading-major-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--heading-1-border-color, var(--heading-major-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
275
+ --_heading-border-radius: var(--card-heading-1-border-radius, var(--surface-heading-1-border-radius, var(--card-heading-major-border-radius, var(--surface-heading-major-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--heading-1-border-radius, var(--heading-major-border-radius, var(--heading-border-radius, 0)))))))));
276
+ border-radius: var(--_heading-border-radius);
277
+ --_heading-box-shadow: var(--card-heading-1-box-shadow, var(--surface-heading-1-box-shadow, var(--card-heading-major-box-shadow, var(--surface-heading-major-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-1-box-shadow, var(--heading-major-box-shadow, var(--heading-box-shadow, none)))))))));
278
+ box-shadow: var(--_heading-box-shadow);
279
+ font-family: var(--card-heading-1-font-family, var(--surface-heading-1-font-family, var(--card-heading-major-font-family, var(--surface-heading-major-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--heading-1-font-family, var(--heading-major-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
280
+ text-transform: var(--card-heading-1-text-transform, var(--surface-heading-1-text-transform, var(--card-heading-major-text-transform, var(--surface-heading-major-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--heading-1-text-transform, var(--heading-major-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
281
+ text-decoration: var(--card-heading-1-text-decoration, var(--surface-heading-1-text-decoration, var(--card-heading-major-text-decoration, var(--surface-heading-major-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-1-text-decoration, var(--heading-major-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
282
+ font-size: var(--card-heading-1-font-size, var(--surface-heading-1-font-size, var(--card-heading-major-font-size, var(--surface-heading-major-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--heading-1-font-size, var(--heading-major-font-size, var(--heading-font-size, revert)))))))));
283
+ font-weight: var(--card-heading-1-font-weight, var(--surface-heading-1-font-weight, var(--card-heading-major-font-weight, var(--surface-heading-major-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--heading-1-font-weight, var(--heading-major-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
284
+ line-height: var(--card-heading-1-line-height, var(--surface-heading-1-line-height, var(--card-heading-major-line-height, var(--surface-heading-major-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--heading-1-line-height, var(--heading-major-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
285
+ letter-spacing: var(--card-heading-1-letter-spacing, var(--surface-heading-1-letter-spacing, var(--card-heading-major-letter-spacing, var(--surface-heading-major-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-1-letter-spacing, var(--heading-major-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
286
+ text-indent: var(--card-heading-1-indent, var(--surface-heading-1-indent, var(--card-heading-major-indent, var(--surface-heading-major-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--heading-1-indent, var(--heading-major-indent, var(--heading-indent, var(--indent, revert))))))))));
287
+ font-variant: var(--card-heading-1-font-variant, var(--surface-heading-1-font-variant, var(--card-heading-major-font-variant, var(--surface-heading-major-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--heading-1-font-variant, var(--heading-major-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
288
+ text-align: var(--card-heading-1-text-align, var(--surface-heading-1-text-align, var(--card-heading-major-text-align, var(--surface-heading-major-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--heading-1-text-align, var(--heading-major-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
289
+ }
290
+
291
+ section :global(h2) {
292
+ --_heading-color: var(--card-heading-2-fg, var(--surface-heading-2-fg, var(--card-heading-major-fg, var(--surface-heading-major-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--heading-2-fg, var(--heading-major-fg, var(--heading-fg, revert)))))))));
293
+ color: var(--_heading-color);
294
+ --_heading-background: var(--card-heading-2-bg, var(--surface-heading-2-bg, var(--card-heading-major-bg, var(--surface-heading-major-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--heading-2-bg, var(--heading-major-bg, var(--heading-bg, transparent)))))))));
295
+ background: var(--_heading-background);
296
+ --_heading-padding: var(--card-heading-2-padding, var(--surface-heading-2-padding, var(--card-heading-major-padding, var(--surface-heading-major-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--heading-2-padding, var(--heading-major-padding, var(--heading-padding, 0)))))))));
297
+ padding: var(--_heading-padding);
298
+ --_heading-border: var(--card-heading-2-border, var(--surface-heading-2-border, var(--card-heading-major-border, var(--surface-heading-major-border, var(--card-heading-border, var(--surface-heading-border, var(--heading-2-border, var(--heading-major-border, var(--heading-border, none)))))))));
299
+ border: var(--_heading-border);
300
+ border-width: var(--card-heading-2-border-width, var(--surface-heading-2-border-width, var(--card-heading-major-border-width, var(--surface-heading-major-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--heading-2-border-width, var(--heading-major-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
301
+ border-style: var(--card-heading-2-border-style, var(--surface-heading-2-border-style, var(--card-heading-major-border-style, var(--surface-heading-major-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--heading-2-border-style, var(--heading-major-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
302
+ border-color: var(--card-heading-2-border-color, var(--surface-heading-2-border-color, var(--card-heading-major-border-color, var(--surface-heading-major-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--heading-2-border-color, var(--heading-major-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
303
+ --_heading-border-radius: var(--card-heading-2-border-radius, var(--surface-heading-2-border-radius, var(--card-heading-major-border-radius, var(--surface-heading-major-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--heading-2-border-radius, var(--heading-major-border-radius, var(--heading-border-radius, 0)))))))));
304
+ border-radius: var(--_heading-border-radius);
305
+ --_heading-box-shadow: var(--card-heading-2-box-shadow, var(--surface-heading-2-box-shadow, var(--card-heading-major-box-shadow, var(--surface-heading-major-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-2-box-shadow, var(--heading-major-box-shadow, var(--heading-box-shadow, none)))))))));
306
+ box-shadow: var(--_heading-box-shadow);
307
+ font-family: var(--card-heading-2-font-family, var(--surface-heading-2-font-family, var(--card-heading-major-font-family, var(--surface-heading-major-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--heading-2-font-family, var(--heading-major-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
308
+ text-transform: var(--card-heading-2-text-transform, var(--surface-heading-2-text-transform, var(--card-heading-major-text-transform, var(--surface-heading-major-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--heading-2-text-transform, var(--heading-major-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
309
+ text-decoration: var(--card-heading-2-text-decoration, var(--surface-heading-2-text-decoration, var(--card-heading-major-text-decoration, var(--surface-heading-major-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-2-text-decoration, var(--heading-major-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
310
+ font-size: var(--card-heading-2-font-size, var(--surface-heading-2-font-size, var(--card-heading-major-font-size, var(--surface-heading-major-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--heading-2-font-size, var(--heading-major-font-size, var(--heading-font-size, revert)))))))));
311
+ font-weight: var(--card-heading-2-font-weight, var(--surface-heading-2-font-weight, var(--card-heading-major-font-weight, var(--surface-heading-major-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--heading-2-font-weight, var(--heading-major-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
312
+ line-height: var(--card-heading-2-line-height, var(--surface-heading-2-line-height, var(--card-heading-major-line-height, var(--surface-heading-major-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--heading-2-line-height, var(--heading-major-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
313
+ letter-spacing: var(--card-heading-2-letter-spacing, var(--surface-heading-2-letter-spacing, var(--card-heading-major-letter-spacing, var(--surface-heading-major-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-2-letter-spacing, var(--heading-major-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
314
+ text-indent: var(--card-heading-2-indent, var(--surface-heading-2-indent, var(--card-heading-major-indent, var(--surface-heading-major-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--heading-2-indent, var(--heading-major-indent, var(--heading-indent, var(--indent, revert))))))))));
315
+ font-variant: var(--card-heading-2-font-variant, var(--surface-heading-2-font-variant, var(--card-heading-major-font-variant, var(--surface-heading-major-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--heading-2-font-variant, var(--heading-major-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
316
+ text-align: var(--card-heading-2-text-align, var(--surface-heading-2-text-align, var(--card-heading-major-text-align, var(--surface-heading-major-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--heading-2-text-align, var(--heading-major-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
317
+ }
318
+
319
+ section :global(h3) {
320
+ --_heading-color: var(--card-heading-3-fg, var(--surface-heading-3-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--heading-3-fg, var(--heading-fg, var(--heading-fg, revert)))))))));
321
+ color: var(--_heading-color);
322
+ --_heading-background: var(--card-heading-3-bg, var(--surface-heading-3-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--heading-3-bg, var(--heading-bg, var(--heading-bg, transparent)))))))));
323
+ background: var(--_heading-background);
324
+ --_heading-padding: var(--card-heading-3-padding, var(--surface-heading-3-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--heading-3-padding, var(--heading-padding, var(--heading-padding, 0)))))))));
325
+ padding: var(--_heading-padding);
326
+ --_heading-border: var(--card-heading-3-border, var(--surface-heading-3-border, var(--card-heading-border, var(--surface-heading-border, var(--card-heading-border, var(--surface-heading-border, var(--heading-3-border, var(--heading-border, var(--heading-border, none)))))))));
327
+ border: var(--_heading-border);
328
+ border-width: var(--card-heading-3-border-width, var(--surface-heading-3-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--heading-3-border-width, var(--heading-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
329
+ border-style: var(--card-heading-3-border-style, var(--surface-heading-3-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--heading-3-border-style, var(--heading-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
330
+ border-color: var(--card-heading-3-border-color, var(--surface-heading-3-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--heading-3-border-color, var(--heading-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
331
+ --_heading-border-radius: var(--card-heading-3-border-radius, var(--surface-heading-3-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--heading-3-border-radius, var(--heading-border-radius, var(--heading-border-radius, 0)))))))));
332
+ border-radius: var(--_heading-border-radius);
333
+ --_heading-box-shadow: var(--card-heading-3-box-shadow, var(--surface-heading-3-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-3-box-shadow, var(--heading-box-shadow, var(--heading-box-shadow, none)))))))));
334
+ box-shadow: var(--_heading-box-shadow);
335
+ font-family: var(--card-heading-3-font-family, var(--surface-heading-3-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--heading-3-font-family, var(--heading-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
336
+ text-transform: var(--card-heading-3-text-transform, var(--surface-heading-3-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--heading-3-text-transform, var(--heading-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
337
+ text-decoration: var(--card-heading-3-text-decoration, var(--surface-heading-3-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-3-text-decoration, var(--heading-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
338
+ font-size: var(--card-heading-3-font-size, var(--surface-heading-3-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--heading-3-font-size, var(--heading-font-size, var(--heading-font-size, revert)))))))));
339
+ font-weight: var(--card-heading-3-font-weight, var(--surface-heading-3-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--heading-3-font-weight, var(--heading-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
340
+ line-height: var(--card-heading-3-line-height, var(--surface-heading-3-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--heading-3-line-height, var(--heading-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
341
+ letter-spacing: var(--card-heading-3-letter-spacing, var(--surface-heading-3-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-3-letter-spacing, var(--heading-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
342
+ text-indent: var(--card-heading-3-indent, var(--surface-heading-3-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--heading-3-indent, var(--heading-indent, var(--heading-indent, var(--indent, revert))))))))));
343
+ font-variant: var(--card-heading-3-font-variant, var(--surface-heading-3-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--heading-3-font-variant, var(--heading-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
344
+ text-align: var(--card-heading-3-text-align, var(--surface-heading-3-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--heading-3-text-align, var(--heading-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
345
+ }
346
+
347
+ section :global(h4) {
348
+ --_heading-color: var(--card-heading-4-fg, var(--surface-heading-4-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--heading-4-fg, var(--heading-fg, var(--heading-fg, revert)))))))));
349
+ color: var(--_heading-color);
350
+ --_heading-background: var(--card-heading-4-bg, var(--surface-heading-4-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--heading-4-bg, var(--heading-bg, var(--heading-bg, transparent)))))))));
351
+ background: var(--_heading-background);
352
+ --_heading-padding: var(--card-heading-4-padding, var(--surface-heading-4-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--heading-4-padding, var(--heading-padding, var(--heading-padding, 0)))))))));
353
+ padding: var(--_heading-padding);
354
+ --_heading-border: var(--card-heading-4-border, var(--surface-heading-4-border, var(--card-heading-border, var(--surface-heading-border, var(--card-heading-border, var(--surface-heading-border, var(--heading-4-border, var(--heading-border, var(--heading-border, none)))))))));
355
+ border: var(--_heading-border);
356
+ border-width: var(--card-heading-4-border-width, var(--surface-heading-4-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--heading-4-border-width, var(--heading-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
357
+ border-style: var(--card-heading-4-border-style, var(--surface-heading-4-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--heading-4-border-style, var(--heading-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
358
+ border-color: var(--card-heading-4-border-color, var(--surface-heading-4-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--heading-4-border-color, var(--heading-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
359
+ --_heading-border-radius: var(--card-heading-4-border-radius, var(--surface-heading-4-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--heading-4-border-radius, var(--heading-border-radius, var(--heading-border-radius, 0)))))))));
360
+ border-radius: var(--_heading-border-radius);
361
+ --_heading-box-shadow: var(--card-heading-4-box-shadow, var(--surface-heading-4-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-4-box-shadow, var(--heading-box-shadow, var(--heading-box-shadow, none)))))))));
362
+ box-shadow: var(--_heading-box-shadow);
363
+ font-family: var(--card-heading-4-font-family, var(--surface-heading-4-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--heading-4-font-family, var(--heading-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
364
+ text-transform: var(--card-heading-4-text-transform, var(--surface-heading-4-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--heading-4-text-transform, var(--heading-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
365
+ text-decoration: var(--card-heading-4-text-decoration, var(--surface-heading-4-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-4-text-decoration, var(--heading-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
366
+ font-size: var(--card-heading-4-font-size, var(--surface-heading-4-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--heading-4-font-size, var(--heading-font-size, var(--heading-font-size, revert)))))))));
367
+ font-weight: var(--card-heading-4-font-weight, var(--surface-heading-4-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--heading-4-font-weight, var(--heading-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
368
+ line-height: var(--card-heading-4-line-height, var(--surface-heading-4-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--heading-4-line-height, var(--heading-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
369
+ letter-spacing: var(--card-heading-4-letter-spacing, var(--surface-heading-4-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-4-letter-spacing, var(--heading-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
370
+ text-indent: var(--card-heading-4-indent, var(--surface-heading-4-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--heading-4-indent, var(--heading-indent, var(--heading-indent, var(--indent, revert))))))))));
371
+ font-variant: var(--card-heading-4-font-variant, var(--surface-heading-4-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--heading-4-font-variant, var(--heading-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
372
+ text-align: var(--card-heading-4-text-align, var(--surface-heading-4-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--heading-4-text-align, var(--heading-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
373
+ }
374
+
375
+ section :global(h5) {
376
+ --_heading-color: var(--card-heading-5-fg, var(--surface-heading-5-fg, var(--card-heading-minor-fg, var(--surface-heading-minor-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--heading-5-fg, var(--heading-minor-fg, var(--heading-fg, revert)))))))));
377
+ color: var(--_heading-color);
378
+ --_heading-background: var(--card-heading-5-bg, var(--surface-heading-5-bg, var(--card-heading-minor-bg, var(--surface-heading-minor-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--heading-5-bg, var(--heading-minor-bg, var(--heading-bg, transparent)))))))));
379
+ background: var(--_heading-background);
380
+ --_heading-padding: var(--card-heading-5-padding, var(--surface-heading-5-padding, var(--card-heading-minor-padding, var(--surface-heading-minor-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--heading-5-padding, var(--heading-minor-padding, var(--heading-padding, 0)))))))));
381
+ padding: var(--_heading-padding);
382
+ --_heading-border: var(--card-heading-5-border, var(--surface-heading-5-border, var(--card-heading-minor-border, var(--surface-heading-minor-border, var(--card-heading-border, var(--surface-heading-border, var(--heading-5-border, var(--heading-minor-border, var(--heading-border, none)))))))));
383
+ border: var(--_heading-border);
384
+ border-width: var(--card-heading-5-border-width, var(--surface-heading-5-border-width, var(--card-heading-minor-border-width, var(--surface-heading-minor-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--heading-5-border-width, var(--heading-minor-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
385
+ border-style: var(--card-heading-5-border-style, var(--surface-heading-5-border-style, var(--card-heading-minor-border-style, var(--surface-heading-minor-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--heading-5-border-style, var(--heading-minor-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
386
+ border-color: var(--card-heading-5-border-color, var(--surface-heading-5-border-color, var(--card-heading-minor-border-color, var(--surface-heading-minor-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--heading-5-border-color, var(--heading-minor-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
387
+ --_heading-border-radius: var(--card-heading-5-border-radius, var(--surface-heading-5-border-radius, var(--card-heading-minor-border-radius, var(--surface-heading-minor-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--heading-5-border-radius, var(--heading-minor-border-radius, var(--heading-border-radius, 0)))))))));
388
+ border-radius: var(--_heading-border-radius);
389
+ --_heading-box-shadow: var(--card-heading-5-box-shadow, var(--surface-heading-5-box-shadow, var(--card-heading-minor-box-shadow, var(--surface-heading-minor-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-5-box-shadow, var(--heading-minor-box-shadow, var(--heading-box-shadow, none)))))))));
390
+ box-shadow: var(--_heading-box-shadow);
391
+ font-family: var(--card-heading-5-font-family, var(--surface-heading-5-font-family, var(--card-heading-minor-font-family, var(--surface-heading-minor-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--heading-5-font-family, var(--heading-minor-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
392
+ text-transform: var(--card-heading-5-text-transform, var(--surface-heading-5-text-transform, var(--card-heading-minor-text-transform, var(--surface-heading-minor-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--heading-5-text-transform, var(--heading-minor-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
393
+ text-decoration: var(--card-heading-5-text-decoration, var(--surface-heading-5-text-decoration, var(--card-heading-minor-text-decoration, var(--surface-heading-minor-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-5-text-decoration, var(--heading-minor-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
394
+ font-size: var(--card-heading-5-font-size, var(--surface-heading-5-font-size, var(--card-heading-minor-font-size, var(--surface-heading-minor-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--heading-5-font-size, var(--heading-minor-font-size, var(--heading-font-size, revert)))))))));
395
+ font-weight: var(--card-heading-5-font-weight, var(--surface-heading-5-font-weight, var(--card-heading-minor-font-weight, var(--surface-heading-minor-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--heading-5-font-weight, var(--heading-minor-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
396
+ line-height: var(--card-heading-5-line-height, var(--surface-heading-5-line-height, var(--card-heading-minor-line-height, var(--surface-heading-minor-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--heading-5-line-height, var(--heading-minor-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
397
+ letter-spacing: var(--card-heading-5-letter-spacing, var(--surface-heading-5-letter-spacing, var(--card-heading-minor-letter-spacing, var(--surface-heading-minor-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-5-letter-spacing, var(--heading-minor-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
398
+ text-indent: var(--card-heading-5-indent, var(--surface-heading-5-indent, var(--card-heading-minor-indent, var(--surface-heading-minor-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--heading-5-indent, var(--heading-minor-indent, var(--heading-indent, var(--indent, revert))))))))));
399
+ font-variant: var(--card-heading-5-font-variant, var(--surface-heading-5-font-variant, var(--card-heading-minor-font-variant, var(--surface-heading-minor-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--heading-5-font-variant, var(--heading-minor-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
400
+ text-align: var(--card-heading-5-text-align, var(--surface-heading-5-text-align, var(--card-heading-minor-text-align, var(--surface-heading-minor-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--heading-5-text-align, var(--heading-minor-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
401
+ }
402
+
403
+ section :global(h6) {
404
+ --_heading-color: var(--card-heading-6-fg, var(--surface-heading-6-fg, var(--card-heading-minor-fg, var(--surface-heading-minor-fg, var(--card-heading-fg, var(--surface-heading-fg, var(--heading-6-fg, var(--heading-minor-fg, var(--heading-fg, revert)))))))));
405
+ color: var(--_heading-color);
406
+ --_heading-background: var(--card-heading-6-bg, var(--surface-heading-6-bg, var(--card-heading-minor-bg, var(--surface-heading-minor-bg, var(--card-heading-bg, var(--surface-heading-bg, var(--heading-6-bg, var(--heading-minor-bg, var(--heading-bg, transparent)))))))));
407
+ background: var(--_heading-background);
408
+ --_heading-padding: var(--card-heading-6-padding, var(--surface-heading-6-padding, var(--card-heading-minor-padding, var(--surface-heading-minor-padding, var(--card-heading-padding, var(--surface-heading-padding, var(--heading-6-padding, var(--heading-minor-padding, var(--heading-padding, 0)))))))));
409
+ padding: var(--_heading-padding);
410
+ --_heading-border: var(--card-heading-6-border, var(--surface-heading-6-border, var(--card-heading-minor-border, var(--surface-heading-minor-border, var(--card-heading-border, var(--surface-heading-border, var(--heading-6-border, var(--heading-minor-border, var(--heading-border, none)))))))));
411
+ border: var(--_heading-border);
412
+ border-width: var(--card-heading-6-border-width, var(--surface-heading-6-border-width, var(--card-heading-minor-border-width, var(--surface-heading-minor-border-width, var(--card-heading-border-width, var(--surface-heading-border-width, var(--heading-6-border-width, var(--heading-minor-border-width, var(--heading-border-width, var(--__missing-border-width))))))))));
413
+ border-style: var(--card-heading-6-border-style, var(--surface-heading-6-border-style, var(--card-heading-minor-border-style, var(--surface-heading-minor-border-style, var(--card-heading-border-style, var(--surface-heading-border-style, var(--heading-6-border-style, var(--heading-minor-border-style, var(--heading-border-style, var(--__missing-border-style))))))))));
414
+ border-color: var(--card-heading-6-border-color, var(--surface-heading-6-border-color, var(--card-heading-minor-border-color, var(--surface-heading-minor-border-color, var(--card-heading-border-color, var(--surface-heading-border-color, var(--heading-6-border-color, var(--heading-minor-border-color, var(--heading-border-color, var(--__missing-border-color))))))))));
415
+ --_heading-border-radius: var(--card-heading-6-border-radius, var(--surface-heading-6-border-radius, var(--card-heading-minor-border-radius, var(--surface-heading-minor-border-radius, var(--card-heading-border-radius, var(--surface-heading-border-radius, var(--heading-6-border-radius, var(--heading-minor-border-radius, var(--heading-border-radius, 0)))))))));
416
+ border-radius: var(--_heading-border-radius);
417
+ --_heading-box-shadow: var(--card-heading-6-box-shadow, var(--surface-heading-6-box-shadow, var(--card-heading-minor-box-shadow, var(--surface-heading-minor-box-shadow, var(--card-heading-box-shadow, var(--surface-heading-box-shadow, var(--heading-6-box-shadow, var(--heading-minor-box-shadow, var(--heading-box-shadow, none)))))))));
418
+ box-shadow: var(--_heading-box-shadow);
419
+ font-family: var(--card-heading-6-font-family, var(--surface-heading-6-font-family, var(--card-heading-minor-font-family, var(--surface-heading-minor-font-family, var(--card-heading-font-family, var(--surface-heading-font-family, var(--heading-6-font-family, var(--heading-minor-font-family, var(--heading-font-family, var(--font-family, revert))))))))));
420
+ text-transform: var(--card-heading-6-text-transform, var(--surface-heading-6-text-transform, var(--card-heading-minor-text-transform, var(--surface-heading-minor-text-transform, var(--card-heading-text-transform, var(--surface-heading-text-transform, var(--heading-6-text-transform, var(--heading-minor-text-transform, var(--heading-text-transform, var(--text-transform, revert))))))))));
421
+ text-decoration: var(--card-heading-6-text-decoration, var(--surface-heading-6-text-decoration, var(--card-heading-minor-text-decoration, var(--surface-heading-minor-text-decoration, var(--card-heading-text-decoration, var(--surface-heading-text-decoration, var(--heading-6-text-decoration, var(--heading-minor-text-decoration, var(--heading-text-decoration, var(--text-decoration, revert))))))))));
422
+ font-size: var(--card-heading-6-font-size, var(--surface-heading-6-font-size, var(--card-heading-minor-font-size, var(--surface-heading-minor-font-size, var(--card-heading-font-size, var(--surface-heading-font-size, var(--heading-6-font-size, var(--heading-minor-font-size, var(--heading-font-size, revert)))))))));
423
+ font-weight: var(--card-heading-6-font-weight, var(--surface-heading-6-font-weight, var(--card-heading-minor-font-weight, var(--surface-heading-minor-font-weight, var(--card-heading-font-weight, var(--surface-heading-font-weight, var(--heading-6-font-weight, var(--heading-minor-font-weight, var(--heading-font-weight, var(--font-weight, revert))))))))));
424
+ line-height: var(--card-heading-6-line-height, var(--surface-heading-6-line-height, var(--card-heading-minor-line-height, var(--surface-heading-minor-line-height, var(--card-heading-line-height, var(--surface-heading-line-height, var(--heading-6-line-height, var(--heading-minor-line-height, var(--heading-line-height, var(--line-height, revert))))))))));
425
+ letter-spacing: var(--card-heading-6-letter-spacing, var(--surface-heading-6-letter-spacing, var(--card-heading-minor-letter-spacing, var(--surface-heading-minor-letter-spacing, var(--card-heading-letter-spacing, var(--surface-heading-letter-spacing, var(--heading-6-letter-spacing, var(--heading-minor-letter-spacing, var(--heading-letter-spacing, var(--letter-spacing, revert))))))))));
426
+ text-indent: var(--card-heading-6-indent, var(--surface-heading-6-indent, var(--card-heading-minor-indent, var(--surface-heading-minor-indent, var(--card-heading-indent, var(--surface-heading-indent, var(--heading-6-indent, var(--heading-minor-indent, var(--heading-indent, var(--indent, revert))))))))));
427
+ font-variant: var(--card-heading-6-font-variant, var(--surface-heading-6-font-variant, var(--card-heading-minor-font-variant, var(--surface-heading-minor-font-variant, var(--card-heading-font-variant, var(--surface-heading-font-variant, var(--heading-6-font-variant, var(--heading-minor-font-variant, var(--heading-font-variant, var(--font-variant, revert))))))))));
428
+ text-align: var(--card-heading-6-text-align, var(--surface-heading-6-text-align, var(--card-heading-minor-text-align, var(--surface-heading-minor-text-align, var(--card-heading-text-align, var(--surface-heading-text-align, var(--heading-6-text-align, var(--heading-minor-text-align, var(--heading-text-align, var(--text-align, revert))))))))));
262
429
  }
263
430
 
264
431
  section :global(p) {
265
- font-family: var(--card-paragraph-font-family, var(--container-paragraph-font-family, var(--paragraph-font-family, inherit)));
266
- text-transform: var(--card-paragraph-text-transform, var(--container-paragraph-text-transform, var(--paragraph-text-transform, inherit)));
267
- text-decoration: var(--card-paragraph-text-decoration, var(--container-paragraph-text-decoration, var(--paragraph-text-decoration, inherit)));
268
- --_font-size: var(--card-paragraph-font-size, var(--container-paragraph-font-size, var(--paragraph-font-size, inherit)));
432
+ font-family: var(--card-paragraph-font-family, var(--surface-paragraph-font-family, var(--paragraph-font-family, inherit)));
433
+ text-transform: var(--card-paragraph-text-transform, var(--surface-paragraph-text-transform, var(--paragraph-text-transform, inherit)));
434
+ text-decoration: var(--card-paragraph-text-decoration, var(--surface-paragraph-text-decoration, var(--paragraph-text-decoration, inherit)));
435
+ --_font-size: var(--card-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, inherit)));
269
436
  font-size: var(--_font-size);
270
- font-weight: var(--card-paragraph-font-weight, var(--container-paragraph-font-weight, var(--paragraph-font-weight, inherit)));
271
- line-height: var(--card-paragraph-line-height, var(--container-paragraph-line-height, var(--paragraph-line-height, inherit)));
272
- letter-spacing: var(--card-paragraph-letter-spacing, var(--container-paragraph-letter-spacing, var(--paragraph-letter-spacing, inherit)));
273
- text-indent: var(--card-paragraph-indent, var(--container-paragraph-indent, var(--paragraph-indent, inherit)));
274
- font-variant: var(--card-paragraph-font-variant, var(--container-paragraph-font-variant, var(--paragraph-font-variant, inherit)));
275
- text-align: var(--card-paragraph-text-align, var(--container-paragraph-text-align, var(--paragraph-text-align, inherit)));
437
+ font-weight: var(--card-paragraph-font-weight, var(--surface-paragraph-font-weight, var(--paragraph-font-weight, inherit)));
438
+ line-height: var(--card-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, inherit)));
439
+ letter-spacing: var(--card-paragraph-letter-spacing, var(--surface-paragraph-letter-spacing, var(--paragraph-letter-spacing, inherit)));
440
+ text-indent: var(--card-paragraph-indent, var(--surface-paragraph-indent, var(--paragraph-indent, inherit)));
441
+ font-variant: var(--card-paragraph-font-variant, var(--surface-paragraph-font-variant, var(--paragraph-font-variant, inherit)));
442
+ text-align: var(--card-paragraph-text-align, var(--surface-paragraph-text-align, var(--paragraph-text-align, inherit)));
276
443
  }
277
444
 
278
445
  section :global(p:first-of-type),
@@ -282,20 +449,20 @@ section :global(h3 + p),
282
449
  section :global(h4 + p),
283
450
  section :global(h5 + p),
284
451
  section :global(h6 + p) {
285
- font-family: var(--card-first-paragraph-font-family, var(--container-first-paragraph-font-family, var(--card-paragraph-font-family, var(--container-paragraph-font-family, var(--paragraph-font-family, var(--first-paragraph-font-family, inherit))))));
286
- text-transform: var(--card-first-paragraph-text-transform, var(--container-first-paragraph-text-transform, var(--card-paragraph-text-transform, var(--container-paragraph-text-transform, var(--paragraph-text-transform, var(--first-paragraph-text-transform, inherit))))));
287
- text-decoration: var(--card-first-paragraph-text-decoration, var(--container-first-paragraph-text-decoration, var(--card-paragraph-text-decoration, var(--container-paragraph-text-decoration, var(--paragraph-text-decoration, var(--first-paragraph-text-decoration, inherit))))));
288
- --_font-size: var(--card-first-paragraph-font-size, var(--container-first-paragraph-font-size, var(--card-paragraph-font-size, var(--container-paragraph-font-size, var(--paragraph-font-size, var(--first-paragraph-font-size, inherit))))));
452
+ font-family: var(--card-first-paragraph-font-family, var(--surface-first-paragraph-font-family, var(--card-paragraph-font-family, var(--surface-paragraph-font-family, var(--paragraph-font-family, var(--first-paragraph-font-family, inherit))))));
453
+ text-transform: var(--card-first-paragraph-text-transform, var(--surface-first-paragraph-text-transform, var(--card-paragraph-text-transform, var(--surface-paragraph-text-transform, var(--paragraph-text-transform, var(--first-paragraph-text-transform, inherit))))));
454
+ text-decoration: var(--card-first-paragraph-text-decoration, var(--surface-first-paragraph-text-decoration, var(--card-paragraph-text-decoration, var(--surface-paragraph-text-decoration, var(--paragraph-text-decoration, var(--first-paragraph-text-decoration, inherit))))));
455
+ --_font-size: var(--card-first-paragraph-font-size, var(--surface-first-paragraph-font-size, var(--card-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, var(--first-paragraph-font-size, inherit))))));
289
456
  font-size: var(--_font-size);
290
- font-weight: var(--card-first-paragraph-font-weight, var(--container-first-paragraph-font-weight, var(--card-paragraph-font-weight, var(--container-paragraph-font-weight, var(--paragraph-font-weight, var(--first-paragraph-font-weight, inherit))))));
291
- line-height: var(--card-first-paragraph-line-height, var(--container-first-paragraph-line-height, var(--card-paragraph-line-height, var(--container-paragraph-line-height, var(--paragraph-line-height, var(--first-paragraph-line-height, inherit))))));
292
- letter-spacing: var(--card-first-paragraph-letter-spacing, var(--container-first-paragraph-letter-spacing, var(--card-paragraph-letter-spacing, var(--container-paragraph-letter-spacing, var(--paragraph-letter-spacing, var(--first-paragraph-letter-spacing, inherit))))));
293
- text-indent: var(--card-first-paragraph-indent, var(--container-first-paragraph-indent, var(--card-paragraph-indent, var(--container-paragraph-indent, var(--paragraph-indent, var(--first-paragraph-indent, inherit))))));
294
- font-variant: var(--card-first-paragraph-font-variant, var(--container-first-paragraph-font-variant, var(--card-paragraph-font-variant, var(--container-paragraph-font-variant, var(--paragraph-font-variant, var(--first-paragraph-font-variant, inherit))))));
295
- text-align: var(--card-first-paragraph-text-align, var(--container-first-paragraph-text-align, var(--card-paragraph-text-align, var(--container-paragraph-text-align, var(--paragraph-text-align, var(--first-paragraph-text-align, inherit))))));
296
- font-size: var(--card-first-paragraph-first-paragraph-font-size, var(--container-first-paragraph-first-paragraph-font-size, var(--first-paragraph-font-size, var(--card-paragraph-font-size, var(--container-paragraph-font-size, var(--paragraph-font-size, inherit))))));
297
- line-height: var(--card-first-paragraph-first-paragraph-line-height, var(--container-first-paragraph-first-paragraph-line-height, var(--first-paragraph-line-height, var(--card-paragraph-line-height, var(--container-paragraph-line-height, var(--paragraph-line-height, inherit))))));
298
- margin-block-start: var(--card-first-paragraph-margin-top, var(--container-first-paragraph-margin-top, var(--first-paragraph-margin-top, 0)));
457
+ font-weight: var(--card-first-paragraph-font-weight, var(--surface-first-paragraph-font-weight, var(--card-paragraph-font-weight, var(--surface-paragraph-font-weight, var(--paragraph-font-weight, var(--first-paragraph-font-weight, inherit))))));
458
+ line-height: var(--card-first-paragraph-line-height, var(--surface-first-paragraph-line-height, var(--card-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, var(--first-paragraph-line-height, inherit))))));
459
+ letter-spacing: var(--card-first-paragraph-letter-spacing, var(--surface-first-paragraph-letter-spacing, var(--card-paragraph-letter-spacing, var(--surface-paragraph-letter-spacing, var(--paragraph-letter-spacing, var(--first-paragraph-letter-spacing, inherit))))));
460
+ text-indent: var(--card-first-paragraph-indent, var(--surface-first-paragraph-indent, var(--card-paragraph-indent, var(--surface-paragraph-indent, var(--paragraph-indent, var(--first-paragraph-indent, inherit))))));
461
+ font-variant: var(--card-first-paragraph-font-variant, var(--surface-first-paragraph-font-variant, var(--card-paragraph-font-variant, var(--surface-paragraph-font-variant, var(--paragraph-font-variant, var(--first-paragraph-font-variant, inherit))))));
462
+ text-align: var(--card-first-paragraph-text-align, var(--surface-first-paragraph-text-align, var(--card-paragraph-text-align, var(--surface-paragraph-text-align, var(--paragraph-text-align, var(--first-paragraph-text-align, inherit))))));
463
+ font-size: var(--card-first-paragraph-first-paragraph-font-size, var(--surface-first-paragraph-first-paragraph-font-size, var(--first-paragraph-font-size, var(--card-paragraph-font-size, var(--surface-paragraph-font-size, var(--paragraph-font-size, inherit))))));
464
+ line-height: var(--card-first-paragraph-first-paragraph-line-height, var(--surface-first-paragraph-first-paragraph-line-height, var(--first-paragraph-line-height, var(--card-paragraph-line-height, var(--surface-paragraph-line-height, var(--paragraph-line-height, inherit))))));
465
+ margin-block-start: var(--card-first-paragraph-margin-top, var(--surface-first-paragraph-margin-top, var(--first-paragraph-margin-top, 0)));
299
466
  }
300
467
 
301
468
  section :global(p:first-of-type::first-line),
@@ -305,17 +472,17 @@ section :global(h3 + p::first-line),
305
472
  section :global(h4 + p::first-line),
306
473
  section :global(h5 + p::first-line),
307
474
  section :global(h6 + p::first-line) {
308
- font-family: var(--first-line-font-family, var(--card-first-line-font-family, var(--container-first-line-font-family, var(--first-line-font-family, inherit))));
309
- text-transform: var(--first-line-text-transform, var(--card-first-line-text-transform, var(--container-first-line-text-transform, var(--first-line-text-transform, inherit))));
310
- text-decoration: var(--first-line-text-decoration, var(--card-first-line-text-decoration, var(--container-first-line-text-decoration, var(--first-line-text-decoration, inherit))));
311
- --_font-size: var(--first-line-font-size, var(--card-first-line-font-size, var(--container-first-line-font-size, var(--first-line-font-size, inherit))));
475
+ font-family: var(--first-line-font-family, var(--card-first-line-font-family, var(--surface-first-line-font-family, var(--first-line-font-family, inherit))));
476
+ text-transform: var(--first-line-text-transform, var(--card-first-line-text-transform, var(--surface-first-line-text-transform, var(--first-line-text-transform, inherit))));
477
+ text-decoration: var(--first-line-text-decoration, var(--card-first-line-text-decoration, var(--surface-first-line-text-decoration, var(--first-line-text-decoration, inherit))));
478
+ --_font-size: var(--first-line-font-size, var(--card-first-line-font-size, var(--surface-first-line-font-size, var(--first-line-font-size, inherit))));
312
479
  font-size: var(--_font-size);
313
- font-weight: var(--first-line-font-weight, var(--card-first-line-font-weight, var(--container-first-line-font-weight, var(--first-line-font-weight, inherit))));
314
- line-height: var(--first-line-line-height, var(--card-first-line-line-height, var(--container-first-line-line-height, var(--first-line-line-height, inherit))));
315
- letter-spacing: var(--first-line-letter-spacing, var(--card-first-line-letter-spacing, var(--container-first-line-letter-spacing, var(--first-line-letter-spacing, inherit))));
316
- text-indent: var(--first-line-indent, var(--card-first-line-indent, var(--container-first-line-indent, var(--first-line-indent, inherit))));
317
- font-variant: var(--first-line-font-variant, var(--card-first-line-font-variant, var(--container-first-line-font-variant, var(--first-line-font-variant, inherit))));
318
- text-align: var(--first-line-text-align, var(--card-first-line-text-align, var(--container-first-line-text-align, var(--first-line-text-align, inherit))));
480
+ font-weight: var(--first-line-font-weight, var(--card-first-line-font-weight, var(--surface-first-line-font-weight, var(--first-line-font-weight, inherit))));
481
+ line-height: var(--first-line-line-height, var(--card-first-line-line-height, var(--surface-first-line-line-height, var(--first-line-line-height, inherit))));
482
+ letter-spacing: var(--first-line-letter-spacing, var(--card-first-line-letter-spacing, var(--surface-first-line-letter-spacing, var(--first-line-letter-spacing, inherit))));
483
+ text-indent: var(--first-line-indent, var(--card-first-line-indent, var(--surface-first-line-indent, var(--first-line-indent, inherit))));
484
+ font-variant: var(--first-line-font-variant, var(--card-first-line-font-variant, var(--surface-first-line-font-variant, var(--first-line-font-variant, inherit))));
485
+ text-align: var(--first-line-text-align, var(--card-first-line-text-align, var(--surface-first-line-text-align, var(--first-line-text-align, inherit))));
319
486
  }
320
487
 
321
488
  section :global(p:first-of-type::first-letter),
@@ -325,19 +492,19 @@ section :global(h3 + p::first-letter),
325
492
  section :global(h4 + p::first-letter),
326
493
  section :global(h5 + p::first-letter),
327
494
  section :global(h6 + p::first-letter) {
328
- font-family: var(--first-letter-font-family, var(--card-first-letter-font-family, var(--container-first-letter-font-family, inherit)));
329
- text-transform: var(--first-letter-text-transform, var(--card-first-letter-text-transform, var(--container-first-letter-text-transform, inherit)));
330
- text-decoration: var(--first-letter-text-decoration, var(--card-first-letter-text-decoration, var(--container-first-letter-text-decoration, inherit)));
331
- --_font-size: var(--first-letter-font-size, var(--card-first-letter-font-size, var(--container-first-letter-font-size, inherit)));
495
+ font-family: var(--first-letter-font-family, var(--card-first-letter-font-family, var(--surface-first-letter-font-family, inherit)));
496
+ text-transform: var(--first-letter-text-transform, var(--card-first-letter-text-transform, var(--surface-first-letter-text-transform, inherit)));
497
+ text-decoration: var(--first-letter-text-decoration, var(--card-first-letter-text-decoration, var(--surface-first-letter-text-decoration, inherit)));
498
+ --_font-size: var(--first-letter-font-size, var(--card-first-letter-font-size, var(--surface-first-letter-font-size, inherit)));
332
499
  font-size: var(--_font-size);
333
- font-weight: var(--first-letter-font-weight, var(--card-first-letter-font-weight, var(--container-first-letter-font-weight, inherit)));
334
- line-height: var(--first-letter-line-height, var(--card-first-letter-line-height, var(--container-first-letter-line-height, inherit)));
335
- letter-spacing: var(--first-letter-letter-spacing, var(--card-first-letter-letter-spacing, var(--container-first-letter-letter-spacing, inherit)));
336
- text-indent: var(--first-letter-indent, var(--card-first-letter-indent, var(--container-first-letter-indent, inherit)));
337
- font-variant: var(--first-letter-font-variant, var(--card-first-letter-font-variant, var(--container-first-letter-font-variant, inherit)));
338
- text-align: var(--first-letter-text-align, var(--card-first-letter-text-align, var(--container-first-letter-text-align, inherit)));
339
- --link-bg: var(--card-link-bg, var(--container-link-bg, inherit));
340
- --link-fg: var(--card-link-fg, var(--container-link-fg, inherit));
500
+ font-weight: var(--first-letter-font-weight, var(--card-first-letter-font-weight, var(--surface-first-letter-font-weight, inherit)));
501
+ line-height: var(--first-letter-line-height, var(--card-first-letter-line-height, var(--surface-first-letter-line-height, inherit)));
502
+ letter-spacing: var(--first-letter-letter-spacing, var(--card-first-letter-letter-spacing, var(--surface-first-letter-letter-spacing, inherit)));
503
+ text-indent: var(--first-letter-indent, var(--card-first-letter-indent, var(--surface-first-letter-indent, inherit)));
504
+ font-variant: var(--first-letter-font-variant, var(--card-first-letter-font-variant, var(--surface-first-letter-font-variant, inherit)));
505
+ text-align: var(--first-letter-text-align, var(--card-first-letter-text-align, var(--surface-first-letter-text-align, inherit)));
506
+ --link-bg: var(--card-link-bg, var(--surface-link-bg, inherit));
507
+ --link-fg: var(--card-link-fg, var(--surface-link-fg, inherit));
341
508
  background: var(--card-first-letter-bg, var(--first-letter-bg, inherit));
342
509
  color: var(--card-first-letter-fg, var(--first-letter-fg, inherit));
343
510
  float: var(--first-letter-float, none);