@cloud-ru/ds-markdown 1.0.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 (212) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/LICENSE +201 -0
  3. package/README.md +273 -0
  4. package/dist/cjs/components/Markdown/CodeBlock.d.ts +9 -0
  5. package/dist/cjs/components/Markdown/CodeBlock.js +58 -0
  6. package/dist/cjs/components/Markdown/Markdown.d.ts +2 -0
  7. package/dist/cjs/components/Markdown/Markdown.js +25 -0
  8. package/dist/cjs/components/Markdown/index.d.ts +1 -0
  9. package/dist/cjs/components/Markdown/index.js +17 -0
  10. package/dist/cjs/components/Markdown/styles.module.css +205 -0
  11. package/dist/cjs/components/MarkdownEditor/MarkdownEditor.d.ts +2 -0
  12. package/dist/cjs/components/MarkdownEditor/MarkdownEditor.js +176 -0
  13. package/dist/cjs/components/MarkdownEditor/index.d.ts +1 -0
  14. package/dist/cjs/components/MarkdownEditor/index.js +17 -0
  15. package/dist/cjs/components/MarkdownEditor/styles.module.css +273 -0
  16. package/dist/cjs/components/Toolbar/Toolbar.d.ts +9 -0
  17. package/dist/cjs/components/Toolbar/Toolbar.js +173 -0
  18. package/dist/cjs/components/Toolbar/constants.d.ts +13 -0
  19. package/dist/cjs/components/Toolbar/constants.js +40 -0
  20. package/dist/cjs/components/Toolbar/hooks/index.d.ts +2 -0
  21. package/dist/cjs/components/Toolbar/hooks/index.js +18 -0
  22. package/dist/cjs/components/Toolbar/hooks/useToolbarHotkeys.d.ts +21 -0
  23. package/dist/cjs/components/Toolbar/hooks/useToolbarHotkeys.js +59 -0
  24. package/dist/cjs/components/Toolbar/hooks/useToolbarOverflow.d.ts +14 -0
  25. package/dist/cjs/components/Toolbar/hooks/useToolbarOverflow.js +87 -0
  26. package/dist/cjs/components/Toolbar/index.d.ts +2 -0
  27. package/dist/cjs/components/Toolbar/index.js +20 -0
  28. package/dist/cjs/components/Toolbar/styles.module.css +17 -0
  29. package/dist/cjs/components/index.d.ts +2 -0
  30. package/dist/cjs/components/index.js +20 -0
  31. package/dist/cjs/constants.d.ts +65 -0
  32. package/dist/cjs/constants.js +67 -0
  33. package/dist/cjs/helperComponents/ButtonHeading/ButtonHeading.d.ts +6 -0
  34. package/dist/cjs/helperComponents/ButtonHeading/ButtonHeading.js +61 -0
  35. package/dist/cjs/helperComponents/ButtonHeading/index.d.ts +1 -0
  36. package/dist/cjs/helperComponents/ButtonHeading/index.js +17 -0
  37. package/dist/cjs/helperComponents/ButtonHeading/styles.module.css +3 -0
  38. package/dist/cjs/helperComponents/Buttons/Buttons.d.ts +10 -0
  39. package/dist/cjs/helperComponents/Buttons/Buttons.js +21 -0
  40. package/dist/cjs/helperComponents/Buttons/index.d.ts +1 -0
  41. package/dist/cjs/helperComponents/Buttons/index.js +17 -0
  42. package/dist/cjs/helperComponents/Buttons/styles.module.css +17 -0
  43. package/dist/cjs/helperComponents/Modals/CustomizeTableModal.d.ts +8 -0
  44. package/dist/cjs/helperComponents/Modals/CustomizeTableModal.js +39 -0
  45. package/dist/cjs/helperComponents/Modals/ImageModal.d.ts +7 -0
  46. package/dist/cjs/helperComponents/Modals/ImageModal.js +44 -0
  47. package/dist/cjs/helperComponents/Modals/LinkModal.d.ts +13 -0
  48. package/dist/cjs/helperComponents/Modals/LinkModal.js +42 -0
  49. package/dist/cjs/helperComponents/Modals/index.d.ts +3 -0
  50. package/dist/cjs/helperComponents/Modals/index.js +19 -0
  51. package/dist/cjs/helperComponents/Modals/styles.module.css +17 -0
  52. package/dist/cjs/helperComponents/PrivateButton/PrivateButton.d.ts +17 -0
  53. package/dist/cjs/helperComponents/PrivateButton/PrivateButton.js +27 -0
  54. package/dist/cjs/helperComponents/PrivateButton/index.d.ts +1 -0
  55. package/dist/cjs/helperComponents/PrivateButton/index.js +17 -0
  56. package/dist/cjs/helperComponents/PrivateButton/styles.module.css +140 -0
  57. package/dist/cjs/helperComponents/TableSelectItem/TableSelectItem.d.ts +11 -0
  58. package/dist/cjs/helperComponents/TableSelectItem/TableSelectItem.js +12 -0
  59. package/dist/cjs/helperComponents/TableSelectItem/index.d.ts +1 -0
  60. package/dist/cjs/helperComponents/TableSelectItem/index.js +17 -0
  61. package/dist/cjs/helperComponents/TableSelectItem/styles.module.css +101 -0
  62. package/dist/cjs/helperComponents/TableSelectSettingsGrid/TableSelectSettingsGrid.d.ts +4 -0
  63. package/dist/cjs/helperComponents/TableSelectSettingsGrid/TableSelectSettingsGrid.js +27 -0
  64. package/dist/cjs/helperComponents/TableSelectSettingsGrid/index.d.ts +1 -0
  65. package/dist/cjs/helperComponents/TableSelectSettingsGrid/index.js +17 -0
  66. package/dist/cjs/helperComponents/TableSelectSettingsGrid/styles.module.css +54 -0
  67. package/dist/cjs/helperComponents/index.d.ts +6 -0
  68. package/dist/cjs/helperComponents/index.js +22 -0
  69. package/dist/cjs/index.d.ts +4 -0
  70. package/dist/cjs/index.js +20 -0
  71. package/dist/cjs/locale/index.d.ts +199 -0
  72. package/dist/cjs/locale/index.js +104 -0
  73. package/dist/cjs/lowlight.d.ts +14 -0
  74. package/dist/cjs/lowlight.js +35 -0
  75. package/dist/cjs/mixins.css +0 -0
  76. package/dist/cjs/package.json +3 -0
  77. package/dist/cjs/rawMarkdownCommands.d.ts +16 -0
  78. package/dist/cjs/rawMarkdownCommands.js +145 -0
  79. package/dist/cjs/style.css +875 -0
  80. package/dist/cjs/styles/syntax.module.css +47 -0
  81. package/dist/cjs/toolbarApi.d.ts +33 -0
  82. package/dist/cjs/toolbarApi.js +100 -0
  83. package/dist/cjs/types.d.ts +52 -0
  84. package/dist/cjs/types.js +2 -0
  85. package/dist/esm/components/Markdown/CodeBlock.d.ts +9 -0
  86. package/dist/esm/components/Markdown/CodeBlock.js +52 -0
  87. package/dist/esm/components/Markdown/Markdown.d.ts +2 -0
  88. package/dist/esm/components/Markdown/Markdown.js +19 -0
  89. package/dist/esm/components/Markdown/index.d.ts +1 -0
  90. package/dist/esm/components/Markdown/index.js +1 -0
  91. package/dist/esm/components/Markdown/styles.module.css +205 -0
  92. package/dist/esm/components/MarkdownEditor/MarkdownEditor.d.ts +2 -0
  93. package/dist/esm/components/MarkdownEditor/MarkdownEditor.js +170 -0
  94. package/dist/esm/components/MarkdownEditor/index.d.ts +1 -0
  95. package/dist/esm/components/MarkdownEditor/index.js +1 -0
  96. package/dist/esm/components/MarkdownEditor/styles.module.css +273 -0
  97. package/dist/esm/components/Toolbar/Toolbar.d.ts +9 -0
  98. package/dist/esm/components/Toolbar/Toolbar.js +167 -0
  99. package/dist/esm/components/Toolbar/constants.d.ts +13 -0
  100. package/dist/esm/components/Toolbar/constants.js +37 -0
  101. package/dist/esm/components/Toolbar/hooks/index.d.ts +2 -0
  102. package/dist/esm/components/Toolbar/hooks/index.js +2 -0
  103. package/dist/esm/components/Toolbar/hooks/useToolbarHotkeys.d.ts +21 -0
  104. package/dist/esm/components/Toolbar/hooks/useToolbarHotkeys.js +56 -0
  105. package/dist/esm/components/Toolbar/hooks/useToolbarOverflow.d.ts +14 -0
  106. package/dist/esm/components/Toolbar/hooks/useToolbarOverflow.js +84 -0
  107. package/dist/esm/components/Toolbar/index.d.ts +2 -0
  108. package/dist/esm/components/Toolbar/index.js +2 -0
  109. package/dist/esm/components/Toolbar/styles.module.css +17 -0
  110. package/dist/esm/components/index.d.ts +2 -0
  111. package/dist/esm/components/index.js +4 -0
  112. package/dist/esm/constants.d.ts +65 -0
  113. package/dist/esm/constants.js +61 -0
  114. package/dist/esm/helperComponents/ButtonHeading/ButtonHeading.d.ts +6 -0
  115. package/dist/esm/helperComponents/ButtonHeading/ButtonHeading.js +55 -0
  116. package/dist/esm/helperComponents/ButtonHeading/index.d.ts +1 -0
  117. package/dist/esm/helperComponents/ButtonHeading/index.js +1 -0
  118. package/dist/esm/helperComponents/ButtonHeading/styles.module.css +3 -0
  119. package/dist/esm/helperComponents/Buttons/Buttons.d.ts +10 -0
  120. package/dist/esm/helperComponents/Buttons/Buttons.js +13 -0
  121. package/dist/esm/helperComponents/Buttons/index.d.ts +1 -0
  122. package/dist/esm/helperComponents/Buttons/index.js +1 -0
  123. package/dist/esm/helperComponents/Buttons/styles.module.css +17 -0
  124. package/dist/esm/helperComponents/Modals/CustomizeTableModal.d.ts +8 -0
  125. package/dist/esm/helperComponents/Modals/CustomizeTableModal.js +33 -0
  126. package/dist/esm/helperComponents/Modals/ImageModal.d.ts +7 -0
  127. package/dist/esm/helperComponents/Modals/ImageModal.js +38 -0
  128. package/dist/esm/helperComponents/Modals/LinkModal.d.ts +13 -0
  129. package/dist/esm/helperComponents/Modals/LinkModal.js +36 -0
  130. package/dist/esm/helperComponents/Modals/index.d.ts +3 -0
  131. package/dist/esm/helperComponents/Modals/index.js +3 -0
  132. package/dist/esm/helperComponents/Modals/styles.module.css +17 -0
  133. package/dist/esm/helperComponents/PrivateButton/PrivateButton.d.ts +17 -0
  134. package/dist/esm/helperComponents/PrivateButton/PrivateButton.js +21 -0
  135. package/dist/esm/helperComponents/PrivateButton/index.d.ts +1 -0
  136. package/dist/esm/helperComponents/PrivateButton/index.js +1 -0
  137. package/dist/esm/helperComponents/PrivateButton/styles.module.css +140 -0
  138. package/dist/esm/helperComponents/TableSelectItem/TableSelectItem.d.ts +11 -0
  139. package/dist/esm/helperComponents/TableSelectItem/TableSelectItem.js +6 -0
  140. package/dist/esm/helperComponents/TableSelectItem/index.d.ts +1 -0
  141. package/dist/esm/helperComponents/TableSelectItem/index.js +1 -0
  142. package/dist/esm/helperComponents/TableSelectItem/styles.module.css +101 -0
  143. package/dist/esm/helperComponents/TableSelectSettingsGrid/TableSelectSettingsGrid.d.ts +4 -0
  144. package/dist/esm/helperComponents/TableSelectSettingsGrid/TableSelectSettingsGrid.js +21 -0
  145. package/dist/esm/helperComponents/TableSelectSettingsGrid/index.d.ts +1 -0
  146. package/dist/esm/helperComponents/TableSelectSettingsGrid/index.js +1 -0
  147. package/dist/esm/helperComponents/TableSelectSettingsGrid/styles.module.css +54 -0
  148. package/dist/esm/helperComponents/index.d.ts +6 -0
  149. package/dist/esm/helperComponents/index.js +6 -0
  150. package/dist/esm/index.d.ts +4 -0
  151. package/dist/esm/index.js +4 -0
  152. package/dist/esm/locale/index.d.ts +199 -0
  153. package/dist/esm/locale/index.js +101 -0
  154. package/dist/esm/lowlight.d.ts +14 -0
  155. package/dist/esm/lowlight.js +29 -0
  156. package/dist/esm/mixins.css +0 -0
  157. package/dist/esm/rawMarkdownCommands.d.ts +16 -0
  158. package/dist/esm/rawMarkdownCommands.js +135 -0
  159. package/dist/esm/style.css +875 -0
  160. package/dist/esm/styles/syntax.module.css +47 -0
  161. package/dist/esm/toolbarApi.d.ts +33 -0
  162. package/dist/esm/toolbarApi.js +96 -0
  163. package/dist/esm/types.d.ts +52 -0
  164. package/dist/esm/types.js +1 -0
  165. package/dist/tsconfig.cjs.tsbuildinfo +1 -0
  166. package/dist/tsconfig.esm.tsbuildinfo +1 -0
  167. package/package.json +84 -0
  168. package/src/components/Markdown/CodeBlock.tsx +96 -0
  169. package/src/components/Markdown/Markdown.tsx +47 -0
  170. package/src/components/Markdown/index.ts +1 -0
  171. package/src/components/Markdown/styles.module.scss +105 -0
  172. package/src/components/MarkdownEditor/MarkdownEditor.tsx +322 -0
  173. package/src/components/MarkdownEditor/index.ts +1 -0
  174. package/src/components/MarkdownEditor/styles.module.scss +201 -0
  175. package/src/components/Toolbar/Toolbar.tsx +292 -0
  176. package/src/components/Toolbar/constants.tsx +63 -0
  177. package/src/components/Toolbar/hooks/index.ts +2 -0
  178. package/src/components/Toolbar/hooks/useToolbarHotkeys.ts +74 -0
  179. package/src/components/Toolbar/hooks/useToolbarOverflow.ts +102 -0
  180. package/src/components/Toolbar/index.ts +2 -0
  181. package/src/components/Toolbar/styles.module.scss +29 -0
  182. package/src/components/index.ts +4 -0
  183. package/src/constants.ts +67 -0
  184. package/src/helperComponents/ButtonHeading/ButtonHeading.tsx +100 -0
  185. package/src/helperComponents/ButtonHeading/index.ts +1 -0
  186. package/src/helperComponents/ButtonHeading/styles.module.scss +5 -0
  187. package/src/helperComponents/Buttons/Buttons.tsx +30 -0
  188. package/src/helperComponents/Buttons/index.ts +1 -0
  189. package/src/helperComponents/Buttons/styles.module.scss +26 -0
  190. package/src/helperComponents/Modals/CustomizeTableModal.tsx +82 -0
  191. package/src/helperComponents/Modals/ImageModal.tsx +84 -0
  192. package/src/helperComponents/Modals/LinkModal.tsx +92 -0
  193. package/src/helperComponents/Modals/index.ts +3 -0
  194. package/src/helperComponents/Modals/styles.module.scss +21 -0
  195. package/src/helperComponents/PrivateButton/PrivateButton.tsx +88 -0
  196. package/src/helperComponents/PrivateButton/index.ts +1 -0
  197. package/src/helperComponents/PrivateButton/styles.module.scss +77 -0
  198. package/src/helperComponents/TableSelectItem/TableSelectItem.tsx +43 -0
  199. package/src/helperComponents/TableSelectItem/index.ts +1 -0
  200. package/src/helperComponents/TableSelectItem/styles.module.scss +26 -0
  201. package/src/helperComponents/TableSelectSettingsGrid/TableSelectSettingsGrid.tsx +48 -0
  202. package/src/helperComponents/TableSelectSettingsGrid/index.ts +1 -0
  203. package/src/helperComponents/TableSelectSettingsGrid/styles.module.scss +65 -0
  204. package/src/helperComponents/index.ts +6 -0
  205. package/src/index.ts +4 -0
  206. package/src/locale/index.ts +105 -0
  207. package/src/lowlight.ts +30 -0
  208. package/src/mixins.scss +123 -0
  209. package/src/rawMarkdownCommands.ts +179 -0
  210. package/src/styles/syntax.module.scss +54 -0
  211. package/src/toolbarApi.ts +152 -0
  212. package/src/types.ts +56 -0
@@ -0,0 +1,875 @@
1
+ .root{
2
+ box-sizing:border-box;
3
+ max-width:100%;
4
+ font-family:var(--sn-brand-font-fontFamily-regular-body, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface));
5
+ font-size:var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px));
6
+ line-height:var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px));
7
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
8
+ }
9
+ .root p,
10
+ .root h1,
11
+ .root h2,
12
+ .root h3,
13
+ .root h4,
14
+ .root h5,
15
+ .root ul,
16
+ .root ol,
17
+ .root blockquote,
18
+ .root pre,
19
+ .root table,
20
+ .root hr,
21
+ .root img{
22
+ margin:0;
23
+ }
24
+ .root h1{
25
+ font-family:var(--sn-regular-headline-l-fontFamily, var(--sn-brand-font-fontFamily-regular-headline, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
26
+ font-weight:var(--sn-regular-headline-l-fontWeight, var(--sn-theme-typography-fontWeight-regular-headline-l, var(--sn-brand-font-fontWeight-light-regular-headline-l, var(--sn-primitive-font-fontWeightValue-600, 600))));
27
+ line-height:var(--sn-regular-headline-l-lineHeight, var(--sn-density-typography-roleHeadline-lineHeightL, var(--sn-primitive-font-lineHeight-by40, 48px)));
28
+ font-size:var(--sn-regular-headline-l-fontSize, var(--sn-density-typography-roleHeadline-fontSizeL, var(--sn-primitive-font-fontSize-36, 36px)));
29
+ letter-spacing:var(--sn-regular-headline-l-letterSpacing, var(--sn-primitive-font-letterSpacing-xs, -0.5px));
30
+ paragraph-spacing:var(--sn-regular-headline-l-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize32, 16px));
31
+ }
32
+ .root h2{
33
+ font-family:var(--sn-regular-headline-m-fontFamily, var(--sn-brand-font-fontFamily-regular-headline, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
34
+ font-weight:var(--sn-regular-headline-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-headline-m, var(--sn-brand-font-fontWeight-light-regular-headline-m, var(--sn-primitive-font-fontWeightValue-600, 600))));
35
+ line-height:var(--sn-regular-headline-m-lineHeight, var(--sn-density-typography-roleHeadline-lineHeightM, var(--sn-primitive-font-lineHeight-by32, 40px)));
36
+ font-size:var(--sn-regular-headline-m-fontSize, var(--sn-density-typography-roleHeadline-fontSizeM, var(--sn-primitive-font-fontSize-32, 32px)));
37
+ letter-spacing:var(--sn-regular-headline-m-letterSpacing, var(--sn-primitive-font-letterSpacing-xs, -0.5px));
38
+ paragraph-spacing:var(--sn-regular-headline-m-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize28, 14px));
39
+ }
40
+ .root h3{
41
+ font-family:var(--sn-regular-headline-s-fontFamily, var(--sn-brand-font-fontFamily-regular-headline, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
42
+ font-weight:var(--sn-regular-headline-s-fontWeight, var(--sn-theme-typography-fontWeight-regular-headline-s, var(--sn-brand-font-fontWeight-light-regular-headline-s, var(--sn-primitive-font-fontWeightValue-600, 600))));
43
+ line-height:var(--sn-regular-headline-s-lineHeight, var(--sn-density-typography-roleHeadline-lineHeightS, var(--sn-primitive-font-lineHeight-by24, 32px)));
44
+ font-size:var(--sn-regular-headline-s-fontSize, var(--sn-density-typography-roleHeadline-fontSizeS, var(--sn-primitive-font-fontSize-24, 24px)));
45
+ letter-spacing:var(--sn-regular-headline-s-letterSpacing, var(--sn-primitive-font-letterSpacing-xs, -0.5px));
46
+ paragraph-spacing:var(--sn-regular-headline-s-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize24, 12px));
47
+ }
48
+ .root h4{
49
+ font-family:var(--sn-regular-title-l-fontFamily, var(--sn-brand-font-fontFamily-regular-title, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
50
+ font-weight:var(--sn-regular-title-l-fontWeight, var(--sn-theme-typography-fontWeight-regular-title-l, var(--sn-brand-font-fontWeight-light-regular-title-l, var(--sn-primitive-font-fontWeightValue-600, 600))));
51
+ line-height:var(--sn-regular-title-l-lineHeight, var(--sn-density-typography-roleTitle-lineHeightL, var(--sn-primitive-font-lineHeight-by20, 28px)));
52
+ font-size:var(--sn-regular-title-l-fontSize, var(--sn-density-typography-roleTitle-fontSizeL, var(--sn-primitive-font-fontSize-20, 20px)));
53
+ letter-spacing:var(--sn-regular-title-l-letterSpacing, var(--sn-primitive-font-letterSpacing-l, 0.15px));
54
+ paragraph-spacing:var(--sn-regular-title-l-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize20, 10px));
55
+ }
56
+ .root h5{
57
+ font-family:var(--sn-regular-title-m-fontFamily, var(--sn-brand-font-fontFamily-regular-title, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
58
+ font-weight:var(--sn-regular-title-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-title-m, var(--sn-brand-font-fontWeight-light-regular-title-m, var(--sn-primitive-font-fontWeightValue-600, 600))));
59
+ line-height:var(--sn-regular-title-m-lineHeight, var(--sn-density-typography-roleTitle-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px)));
60
+ font-size:var(--sn-regular-title-m-fontSize, var(--sn-density-typography-roleTitle-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px)));
61
+ letter-spacing:var(--sn-regular-title-m-letterSpacing, var(--sn-primitive-font-letterSpacing-l, 0.15px));
62
+ paragraph-spacing:var(--sn-regular-title-m-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize16, 8px));
63
+ }
64
+ .root ul,
65
+ .root ol{
66
+ padding-left:var(--sn-primitive-dimension-24, 24px);
67
+ }
68
+ .root blockquote{
69
+ padding:var(--sn-markdown-anatomy-size-syntax-quote-wrapper-paddingVertical, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-syntax-quote-wrapper-paddingHorizontal, var(--sn-primitive-dimension-8, 8px));
70
+ border-left:var(--sn-markdown-anatomy-size-syntax-quote-wrapper-borderWidth, var(--sn-primitive-strokeWeight-strokeSemiBold, 2px)) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
71
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
72
+ background:var(--sn-theme-color-neutral-decorTransparent, var(--sn-brand-color-neutral-transparent-forLightMode, rgba(124, 131, 182, 0.0784313725)));
73
+ }
74
+ .root code{
75
+ min-height:var(--sn-markdown-anatomy-size-syntax-inlineCode-minHeight, var(--sn-primitive-dimension-20, 20px));
76
+ padding:0 var(--sn-markdown-anatomy-size-syntax-inlineCode-paddingHorizontal, var(--sn-primitive-dimension-4, 4px));
77
+ border-radius:var(--sn-markdown-anatomy-size-syntax-inlineCode-borderRadius, var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px)));
78
+ font-family:var(--sn-brand-font-fontFamily-mono-body, var(--sn-primitive-fontFamily-brandA-mono, SB Sans Text Mono));
79
+ background:var(--sn-theme-color-neutral-decorTransparent, var(--sn-brand-color-neutral-transparent-forLightMode, rgba(124, 131, 182, 0.0784313725)));
80
+ }
81
+ .root a{
82
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
83
+ text-decoration:underline;
84
+ }
85
+ .root table{
86
+ border-collapse:collapse;
87
+ width:100%;
88
+ }
89
+ .root th,
90
+ .root td{
91
+ min-height:var(--sn-markdown-anatomy-size-syntax-table-tableCell-minHeight, var(--sn-primitive-dimension-40, 40px));
92
+ padding:var(--sn-markdown-anatomy-size-syntax-table-tableCell-paddingVertical, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-syntax-table-tableCell-paddingHorizontal, var(--sn-primitive-dimension-16, 16px));
93
+ border-bottom:var(--sn-primitive-strokeWeight-strokeRegular, 1px) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
94
+ text-align:left;
95
+ }
96
+ .root th{
97
+ font-weight:600;
98
+ background:var(--sn-theme-color-neutral-decorTransparent, var(--sn-brand-color-neutral-transparent-forLightMode, rgba(124, 131, 182, 0.0784313725)));
99
+ }
100
+ .root > *:not(:first-child){
101
+ margin-top:10px;
102
+ }
103
+ .root > ul:not(:first-child),
104
+ .root > ol:not(:first-child){
105
+ margin-top:5px;
106
+ }
107
+ .root > h1:not(:first-child){
108
+ margin-top:var(--sn-markdown-anatomy-size-syntax-headings-h1-paddingTop, var(--sn-primitive-dimension-20, 20px));
109
+ }
110
+ .root > h2:not(:first-child){
111
+ margin-top:18px;
112
+ }
113
+ .root > h3:not(:first-child){
114
+ margin-top:var(--sn-markdown-anatomy-size-syntax-headings-h3-paddingTop, var(--sn-primitive-dimension-16, 16px));
115
+ }
116
+ .root > h4:not(:first-child){
117
+ margin-top:14px;
118
+ }
119
+ .root > h5:not(:first-child){
120
+ margin-top:var(--sn-markdown-anatomy-size-syntax-headings-h5-paddingTop, var(--sn-primitive-dimension-12, 12px));
121
+ }
122
+ .root > blockquote:not(:first-child){
123
+ margin-top:5px;
124
+ }
125
+ .root > pre:not(:first-child){
126
+ margin-top:5px;
127
+ }
128
+ .root > table:not(:first-child){
129
+ margin-top:5px;
130
+ }
131
+ .root > img:not(:first-child){
132
+ margin-top:5px;
133
+ }
134
+ .root > hr:not(:first-child){
135
+ margin-top:10px;
136
+ }
137
+ .root .codeBlock{
138
+ overflow:hidden;
139
+ border:var(--sn-primitive-strokeWeight-strokeRegular, 1px) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
140
+ border-radius:var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px));
141
+ background:var(--sn-theme-color-neutral-background2Level, var(--sn-brand-color-neutral-99, var(--sn-primitive-color-gray-99, #ffffff)));
142
+ }
143
+ .root .codeHeader{
144
+ display:flex;
145
+ gap:var(--sn-primitive-dimension-8, 8px);
146
+ align-items:center;
147
+ justify-content:space-between;
148
+ padding:var(--sn-primitive-dimension-6, 6px) var(--sn-primitive-dimension-12, 12px);
149
+ border-bottom:var(--sn-primitive-strokeWeight-strokeRegular, 1px) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
150
+ }
151
+ .root .codeLang{
152
+ font-family:var(--sn-brand-font-fontFamily-mono-body, var(--sn-primitive-fontFamily-brandA-mono, SB Sans Text Mono));
153
+ font-size:var(--sn-density-typography-roleBody-fontSizeS, var(--sn-primitive-font-fontSize-14, 14px));
154
+ line-height:var(--sn-density-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-by14, 20px));
155
+ color:var(--sn-theme-color-available-version-textSecondary, var(--sn-brand-color-text-version-secondary, rgba(65, 66, 78, 0.8)));
156
+ text-transform:lowercase;
157
+ }
158
+ .root .codeCopy[data-copied]{
159
+ color:var(--sn-theme-color-green-text, var(--sn-primitive-color-green-45, #438b4b));
160
+ }
161
+ .root .codeBody{
162
+ display:flex;
163
+ max-width:100%;
164
+ }
165
+ .root .codeGutter{
166
+ -webkit-user-select:none;
167
+ -moz-user-select:none;
168
+ user-select:none;
169
+ display:flex;
170
+ flex-direction:column;
171
+ flex-shrink:0;
172
+ padding:var(--sn-primitive-dimension-12, 12px) 0;
173
+ border-right:var(--sn-primitive-strokeWeight-strokeRegular, 1px) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
174
+ font-family:var(--sn-brand-font-fontFamily-mono-body, var(--sn-primitive-fontFamily-brandA-mono, SB Sans Text Mono));
175
+ font-size:var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px));
176
+ line-height:var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px));
177
+ color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(65, 66, 78, 0.5490196078)));
178
+ text-align:right;
179
+ }
180
+ .root .codeLineNo{
181
+ padding:0 var(--sn-primitive-dimension-12, 12px);
182
+ }
183
+ .root .codeScroll{
184
+ flex:1;
185
+ margin:0;
186
+ }
187
+ .root .codePre{
188
+ margin:0;
189
+ padding:var(--sn-primitive-dimension-12, 12px);
190
+ }
191
+ .root .codeContent{
192
+ min-height:0;
193
+ padding:0;
194
+ font-size:var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px));
195
+ line-height:var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px));
196
+ background:transparent;
197
+ }
198
+ .root hr{
199
+ border:0;
200
+ border-top:var(--sn-primitive-strokeWeight-strokeRegular, 1px) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
201
+ }
202
+ .root img{
203
+ max-width:100%;
204
+ height:auto;
205
+ }
206
+ .root{
207
+ display:flex;
208
+ flex-direction:column;
209
+ gap:var(--sn-markdown-anatomy-size-container-gap, var(--sn-primitive-dimension-4, 4px));
210
+ box-sizing:border-box;
211
+ }
212
+
213
+ .header{
214
+ display:flex;
215
+ gap:var(--sn-primitive-dimension-8, 8px);
216
+ align-items:center;
217
+ justify-content:space-between;
218
+ font-family:var(--sn-brand-font-fontFamily-regular-body, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface));
219
+ font-size:var(--sn-density-typography-roleBody-fontSizeS, var(--sn-primitive-font-fontSize-14, 14px));
220
+ line-height:var(--sn-density-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-by14, 20px));
221
+ color:var(--sn-theme-color-available-version-textSecondary, var(--sn-brand-color-text-version-secondary, rgba(65, 66, 78, 0.8)));
222
+ }
223
+
224
+ .previewToggle{
225
+ cursor:pointer;
226
+ -webkit-user-select:none;
227
+ -moz-user-select:none;
228
+ user-select:none;
229
+ display:inline-flex;
230
+ gap:var(--sn-markdown-anatomy-size-container-headlineWrapper-headline-gap, var(--sn-primitive-dimension-8, 8px));
231
+ align-items:center;
232
+ }
233
+
234
+ .previewToggleLabel{
235
+ font-family:var(--sn-regular-body-m-fontFamily, var(--sn-brand-font-fontFamily-regular-body, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
236
+ font-weight:var(--sn-regular-body-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-m, var(--sn-brand-font-fontWeight-light-regular-body-m, var(--sn-primitive-font-fontWeightValue-400, 400))));
237
+ line-height:var(--sn-regular-body-m-lineHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px)));
238
+ font-size:var(--sn-regular-body-m-fontSize, var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px)));
239
+ letter-spacing:var(--sn-regular-body-m-letterSpacing, var(--sn-primitive-font-letterSpacing-m, 0.1px));
240
+ paragraph-spacing:var(--sn-regular-body-m-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize14, 7px));
241
+ color:var(--sn-theme-color-neutral-text, var(--sn-brand-color-neutral-45, var(--sn-primitive-color-gray-45, #81869c)));
242
+ }
243
+
244
+ .label{
245
+ color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(65, 66, 78, 0.5490196078)));
246
+ }
247
+
248
+ .toolbarSlot{
249
+ flex:1 1 auto;
250
+ min-width:0;
251
+ }
252
+
253
+ .contentArea{
254
+ position:relative;
255
+ display:flex;
256
+ box-sizing:border-box;
257
+ width:100%;
258
+ padding:var(--sn-field-anatomy-size-m-fieldContainer-contentWrapper-verticalPadding, var(--sn-density-spacing-control-wrapper-vertical-m, var(--sn-primitive-dimension-8, 8px))) var(--sn-field-anatomy-size-m-fieldContainer-paddingRight, var(--sn-density-spacing-control-container-horizontal-m, var(--sn-primitive-dimension-16, 16px)));
259
+ }
260
+
261
+ .resizeBox{
262
+ display:flex;
263
+ flex:1 1 auto;
264
+ flex-direction:column;
265
+ min-width:0;
266
+ min-height:var(--sn-field-anatomy-size-m-fieldContainer-multiLine-minHeight, var(--sn-primitive-dimension-68, 68px));
267
+ }
268
+
269
+ .resizeBoxResizable{
270
+ resize:vertical;
271
+ overflow:hidden;
272
+ height:var(--sn-field-anatomy-size-m-fieldContainer-multiLine-minHeight, var(--sn-primitive-dimension-68, 68px));
273
+ }
274
+
275
+ .postfix{
276
+ position:absolute;
277
+ top:calc(var(--sn-field-anatomy-size-m-fieldContainer-contentWrapper-verticalPadding, var(--sn-density-spacing-control-wrapper-vertical-m, var(--sn-primitive-dimension-8, 8px))) + (var(--sn-regular-body-m-lineHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px))) - var(--sn-field-anatomy-size-m-fieldContainer-centeredWrapper-maxHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px)))) / 2);
278
+ right:calc(var(--sn-scroll-anatomy-container-size-s-square, var(--sn-primitive-dimension-8, 8px)) + var(--sn-field-anatomy-size-m-fieldContainer-contentWrapper-inputLine-horizontalPadding, var(--sn-density-spacing-control-wrapper-horizontal-m, var(--sn-primitive-dimension-8, 8px))));
279
+ display:grid;
280
+ grid-auto-rows:var(--sn-field-anatomy-size-m-fieldContainer-centeredWrapper-maxHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px)));
281
+ grid-template-columns:100%;
282
+ row-gap:var(--sn-primitive-dimension-2, 2px);
283
+ place-items:center center;
284
+ width:var(--sn-field-anatomy-size-m-fieldContainer-centeredWrapper-maxHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px)));
285
+ }
286
+
287
+ .rawInputWrapper{
288
+ display:flex;
289
+ width:100%;
290
+ height:100%;
291
+ }
292
+
293
+ .rawInput{
294
+ resize:none;
295
+ overflow-y:auto;
296
+ flex:1 1 auto;
297
+ min-height:0;
298
+ padding:0;
299
+ padding-right:calc(var(--sn-field-anatomy-size-m-fieldContainer-centeredWrapper-maxHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px))) + var(--sn-scroll-anatomy-container-size-s-square, var(--sn-primitive-dimension-8, 8px)) + var(--sn-field-anatomy-size-m-fieldContainer-contentWrapper-inputLine-horizontalPadding, var(--sn-density-spacing-control-wrapper-horizontal-m, var(--sn-primitive-dimension-8, 8px))));
300
+ border:none;
301
+ font-family:var(--sn-brand-font-fontFamily-regular-body, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface));
302
+ font-size:var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px));
303
+ line-height:var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px));
304
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
305
+ background:transparent;
306
+ outline:none;
307
+ }
308
+ .rawInput::-moz-placeholder{
309
+ color:var(--sn-theme-color-available-version-textDisabled, var(--sn-brand-color-text-version-disabled, rgba(65, 66, 78, 0.3490196078)));
310
+ }
311
+ .rawInput::placeholder{
312
+ color:var(--sn-theme-color-available-version-textDisabled, var(--sn-brand-color-text-version-disabled, rgba(65, 66, 78, 0.3490196078)));
313
+ }
314
+
315
+ .content{
316
+ overflow-y:auto;
317
+ flex:1 1 auto;
318
+ min-height:0;
319
+ font-family:var(--sn-brand-font-fontFamily-regular-body, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface));
320
+ font-size:var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px));
321
+ line-height:var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px));
322
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
323
+ }
324
+ .content :global(.ProseMirror){
325
+ min-height:100%;
326
+ padding-right:calc(var(--sn-field-anatomy-size-m-fieldContainer-centeredWrapper-maxHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px))) + var(--sn-scroll-anatomy-container-size-s-square, var(--sn-primitive-dimension-8, 8px)) + var(--sn-field-anatomy-size-m-fieldContainer-contentWrapper-inputLine-horizontalPadding, var(--sn-density-spacing-control-wrapper-horizontal-m, var(--sn-primitive-dimension-8, 8px))));
327
+ outline:none;
328
+ }
329
+ .content :global(.ProseMirror) p,
330
+ .content :global(.ProseMirror) h1,
331
+ .content :global(.ProseMirror) h2,
332
+ .content :global(.ProseMirror) h3,
333
+ .content :global(.ProseMirror) h4,
334
+ .content :global(.ProseMirror) h5,
335
+ .content :global(.ProseMirror) ul,
336
+ .content :global(.ProseMirror) ol,
337
+ .content :global(.ProseMirror) blockquote,
338
+ .content :global(.ProseMirror) pre,
339
+ .content :global(.ProseMirror) table,
340
+ .content :global(.ProseMirror) hr,
341
+ .content :global(.ProseMirror) img{
342
+ margin:0;
343
+ }
344
+ .content :global(.ProseMirror) h1{
345
+ font-family:var(--sn-regular-headline-l-fontFamily, var(--sn-brand-font-fontFamily-regular-headline, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
346
+ font-weight:var(--sn-regular-headline-l-fontWeight, var(--sn-theme-typography-fontWeight-regular-headline-l, var(--sn-brand-font-fontWeight-light-regular-headline-l, var(--sn-primitive-font-fontWeightValue-600, 600))));
347
+ line-height:var(--sn-regular-headline-l-lineHeight, var(--sn-density-typography-roleHeadline-lineHeightL, var(--sn-primitive-font-lineHeight-by40, 48px)));
348
+ font-size:var(--sn-regular-headline-l-fontSize, var(--sn-density-typography-roleHeadline-fontSizeL, var(--sn-primitive-font-fontSize-36, 36px)));
349
+ letter-spacing:var(--sn-regular-headline-l-letterSpacing, var(--sn-primitive-font-letterSpacing-xs, -0.5px));
350
+ paragraph-spacing:var(--sn-regular-headline-l-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize32, 16px));
351
+ }
352
+ .content :global(.ProseMirror) h2{
353
+ font-family:var(--sn-regular-headline-m-fontFamily, var(--sn-brand-font-fontFamily-regular-headline, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
354
+ font-weight:var(--sn-regular-headline-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-headline-m, var(--sn-brand-font-fontWeight-light-regular-headline-m, var(--sn-primitive-font-fontWeightValue-600, 600))));
355
+ line-height:var(--sn-regular-headline-m-lineHeight, var(--sn-density-typography-roleHeadline-lineHeightM, var(--sn-primitive-font-lineHeight-by32, 40px)));
356
+ font-size:var(--sn-regular-headline-m-fontSize, var(--sn-density-typography-roleHeadline-fontSizeM, var(--sn-primitive-font-fontSize-32, 32px)));
357
+ letter-spacing:var(--sn-regular-headline-m-letterSpacing, var(--sn-primitive-font-letterSpacing-xs, -0.5px));
358
+ paragraph-spacing:var(--sn-regular-headline-m-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize28, 14px));
359
+ }
360
+ .content :global(.ProseMirror) h3{
361
+ font-family:var(--sn-regular-headline-s-fontFamily, var(--sn-brand-font-fontFamily-regular-headline, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
362
+ font-weight:var(--sn-regular-headline-s-fontWeight, var(--sn-theme-typography-fontWeight-regular-headline-s, var(--sn-brand-font-fontWeight-light-regular-headline-s, var(--sn-primitive-font-fontWeightValue-600, 600))));
363
+ line-height:var(--sn-regular-headline-s-lineHeight, var(--sn-density-typography-roleHeadline-lineHeightS, var(--sn-primitive-font-lineHeight-by24, 32px)));
364
+ font-size:var(--sn-regular-headline-s-fontSize, var(--sn-density-typography-roleHeadline-fontSizeS, var(--sn-primitive-font-fontSize-24, 24px)));
365
+ letter-spacing:var(--sn-regular-headline-s-letterSpacing, var(--sn-primitive-font-letterSpacing-xs, -0.5px));
366
+ paragraph-spacing:var(--sn-regular-headline-s-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize24, 12px));
367
+ }
368
+ .content :global(.ProseMirror) h4{
369
+ font-family:var(--sn-regular-title-l-fontFamily, var(--sn-brand-font-fontFamily-regular-title, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
370
+ font-weight:var(--sn-regular-title-l-fontWeight, var(--sn-theme-typography-fontWeight-regular-title-l, var(--sn-brand-font-fontWeight-light-regular-title-l, var(--sn-primitive-font-fontWeightValue-600, 600))));
371
+ line-height:var(--sn-regular-title-l-lineHeight, var(--sn-density-typography-roleTitle-lineHeightL, var(--sn-primitive-font-lineHeight-by20, 28px)));
372
+ font-size:var(--sn-regular-title-l-fontSize, var(--sn-density-typography-roleTitle-fontSizeL, var(--sn-primitive-font-fontSize-20, 20px)));
373
+ letter-spacing:var(--sn-regular-title-l-letterSpacing, var(--sn-primitive-font-letterSpacing-l, 0.15px));
374
+ paragraph-spacing:var(--sn-regular-title-l-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize20, 10px));
375
+ }
376
+ .content :global(.ProseMirror) h5{
377
+ font-family:var(--sn-regular-title-m-fontFamily, var(--sn-brand-font-fontFamily-regular-title, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface)));
378
+ font-weight:var(--sn-regular-title-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-title-m, var(--sn-brand-font-fontWeight-light-regular-title-m, var(--sn-primitive-font-fontWeightValue-600, 600))));
379
+ line-height:var(--sn-regular-title-m-lineHeight, var(--sn-density-typography-roleTitle-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px)));
380
+ font-size:var(--sn-regular-title-m-fontSize, var(--sn-density-typography-roleTitle-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px)));
381
+ letter-spacing:var(--sn-regular-title-m-letterSpacing, var(--sn-primitive-font-letterSpacing-l, 0.15px));
382
+ paragraph-spacing:var(--sn-regular-title-m-paragraphSpacing, var(--sn-primitive-font-paragraphSpacing-byFontSize16, 8px));
383
+ }
384
+ .content :global(.ProseMirror) ul,
385
+ .content :global(.ProseMirror) ol{
386
+ padding-left:var(--sn-primitive-dimension-24, 24px);
387
+ }
388
+ .content :global(.ProseMirror) blockquote{
389
+ padding:var(--sn-markdown-anatomy-size-syntax-quote-wrapper-paddingVertical, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-syntax-quote-wrapper-paddingHorizontal, var(--sn-primitive-dimension-8, 8px));
390
+ border-left:var(--sn-markdown-anatomy-size-syntax-quote-wrapper-borderWidth, var(--sn-primitive-strokeWeight-strokeSemiBold, 2px)) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
391
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
392
+ background:var(--sn-theme-color-neutral-decorTransparent, var(--sn-brand-color-neutral-transparent-forLightMode, rgba(124, 131, 182, 0.0784313725)));
393
+ }
394
+ .content :global(.ProseMirror) code{
395
+ min-height:var(--sn-markdown-anatomy-size-syntax-inlineCode-minHeight, var(--sn-primitive-dimension-20, 20px));
396
+ padding:0 var(--sn-markdown-anatomy-size-syntax-inlineCode-paddingHorizontal, var(--sn-primitive-dimension-4, 4px));
397
+ border-radius:var(--sn-markdown-anatomy-size-syntax-inlineCode-borderRadius, var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px)));
398
+ font-family:var(--sn-brand-font-fontFamily-mono-body, var(--sn-primitive-fontFamily-brandA-mono, SB Sans Text Mono));
399
+ background:var(--sn-theme-color-neutral-decorTransparent, var(--sn-brand-color-neutral-transparent-forLightMode, rgba(124, 131, 182, 0.0784313725)));
400
+ }
401
+ .content :global(.ProseMirror) a{
402
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
403
+ text-decoration:underline;
404
+ }
405
+ .content :global(.ProseMirror) table{
406
+ border-collapse:collapse;
407
+ width:100%;
408
+ }
409
+ .content :global(.ProseMirror) th,
410
+ .content :global(.ProseMirror) td{
411
+ min-height:var(--sn-markdown-anatomy-size-syntax-table-tableCell-minHeight, var(--sn-primitive-dimension-40, 40px));
412
+ padding:var(--sn-markdown-anatomy-size-syntax-table-tableCell-paddingVertical, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-syntax-table-tableCell-paddingHorizontal, var(--sn-primitive-dimension-16, 16px));
413
+ border-bottom:var(--sn-primitive-strokeWeight-strokeRegular, 1px) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
414
+ text-align:left;
415
+ }
416
+ .content :global(.ProseMirror) th{
417
+ font-weight:600;
418
+ background:var(--sn-theme-color-neutral-decorTransparent, var(--sn-brand-color-neutral-transparent-forLightMode, rgba(124, 131, 182, 0.0784313725)));
419
+ }
420
+ .content :global(.ProseMirror) > *:not(:first-child){
421
+ margin-top:10px;
422
+ }
423
+ .content :global(.ProseMirror) > ul:not(:first-child),
424
+ .content :global(.ProseMirror) > ol:not(:first-child){
425
+ margin-top:5px;
426
+ }
427
+ .content :global(.ProseMirror) > h1:not(:first-child){
428
+ margin-top:var(--sn-markdown-anatomy-size-syntax-headings-h1-paddingTop, var(--sn-primitive-dimension-20, 20px));
429
+ }
430
+ .content :global(.ProseMirror) > h2:not(:first-child){
431
+ margin-top:18px;
432
+ }
433
+ .content :global(.ProseMirror) > h3:not(:first-child){
434
+ margin-top:var(--sn-markdown-anatomy-size-syntax-headings-h3-paddingTop, var(--sn-primitive-dimension-16, 16px));
435
+ }
436
+ .content :global(.ProseMirror) > h4:not(:first-child){
437
+ margin-top:14px;
438
+ }
439
+ .content :global(.ProseMirror) > h5:not(:first-child){
440
+ margin-top:var(--sn-markdown-anatomy-size-syntax-headings-h5-paddingTop, var(--sn-primitive-dimension-12, 12px));
441
+ }
442
+ .content :global(.ProseMirror) > blockquote:not(:first-child){
443
+ margin-top:5px;
444
+ }
445
+ .content :global(.ProseMirror) > pre:not(:first-child){
446
+ margin-top:5px;
447
+ }
448
+ .content :global(.ProseMirror) > table:not(:first-child){
449
+ margin-top:5px;
450
+ }
451
+ .content :global(.ProseMirror) > img:not(:first-child){
452
+ margin-top:5px;
453
+ }
454
+ .content :global(.ProseMirror) > hr:not(:first-child){
455
+ margin-top:10px;
456
+ }
457
+ .content :global(.ProseMirror) pre{
458
+ overflow-x:auto;
459
+ padding:var(--sn-primitive-dimension-12, 12px);
460
+ border-radius:var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px));
461
+ background:var(--sn-theme-color-neutral-background2Level, var(--sn-brand-color-neutral-99, var(--sn-primitive-color-gray-99, #ffffff)));
462
+ }
463
+ .content :global(.ProseMirror) pre code{
464
+ min-height:0;
465
+ padding:0;
466
+ background:transparent;
467
+ }
468
+ .content :global(.ProseMirror) :global(p.is-editor-empty:first-child)::before{
469
+ pointer-events:none;
470
+ content:attr(data-placeholder);
471
+ float:left;
472
+ height:0;
473
+ color:var(--sn-theme-color-available-version-textDisabled, var(--sn-brand-color-text-version-disabled, rgba(65, 66, 78, 0.3490196078)));
474
+ }
475
+ .content :global(.ProseMirror) img{
476
+ max-width:100%;
477
+ height:auto;
478
+ }
479
+ .root{
480
+ overflow:hidden;
481
+ display:flex;
482
+ flex-shrink:0;
483
+ align-items:center;
484
+ box-sizing:border-box;
485
+ padding:var(--sn-markdown-anatomy-size-buttons-paddingTop, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-buttons-paddingHorizontal, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-buttons-paddingBottom, var(--sn-primitive-dimension-6, 6px));
486
+ }
487
+
488
+ .tooltipTrigger{
489
+ display:inline-flex;
490
+ }
491
+
492
+ .tableCustomizeOption{
493
+ align-items:flex-start;
494
+ align-self:center;
495
+ }
496
+ .trigger{
497
+ display:inline-flex;
498
+ }
499
+ .root{
500
+ overflow:hidden;
501
+ display:flex;
502
+ flex:0 0 auto;
503
+ gap:var(--sn-markdown-anatomy-size-buttons-gap, var(--sn-primitive-dimension-8, 8px));
504
+ box-sizing:border-box;
505
+ }
506
+
507
+ .group{
508
+ display:flex;
509
+ gap:var(--sn-primitive-dimension-4, 4px);
510
+ align-items:center;
511
+ }
512
+
513
+ .divider[data-orientation=vertical]{
514
+ height:auto;
515
+ }
516
+ .fields{
517
+ display:flex;
518
+ gap:var(--sn-primitive-dimension-16, 16px);
519
+ }
520
+ .fields[data-column]{
521
+ flex-direction:column;
522
+ }
523
+
524
+ .field{
525
+ flex:1 1 0;
526
+ min-width:0;
527
+ }
528
+
529
+ .buttons{
530
+ justify-content:flex-end;
531
+ width:100%;
532
+ }
533
+ @charset "UTF-8";
534
+ .stateLayer{
535
+ visibility:initial;
536
+ }
537
+
538
+ .root{
539
+ cursor:pointer;
540
+ position:relative;
541
+ display:inline-flex;
542
+ flex:0 0 auto;
543
+ align-items:center;
544
+ justify-content:center;
545
+ box-sizing:border-box;
546
+ min-width:var(--sn-button-anatomy-size-s-container-iconOnly-minWidth, var(--sn-density-size-s, var(--sn-primitive-dimension-48, 48px)));
547
+ height:var(--sn-button-anatomy-size-s-container-minHeight, var(--sn-density-size-s, var(--sn-primitive-dimension-48, 48px)));
548
+ padding:0;
549
+ border:0;
550
+ border-radius:var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px));
551
+ color:var(--sn-theme-color-neutral-text, var(--sn-brand-color-neutral-45, var(--sn-primitive-color-gray-45, #81869c)));
552
+ background:transparent;
553
+ }
554
+ .root:has(.chevron){
555
+ gap:var(--sn-markdown-anatomy-size-buttons-button-gap, var(--sn-primitive-dimension-2, 2px));
556
+ padding-right:var(--sn-markdown-anatomy-size-buttons-button-paddingRight, var(--sn-primitive-dimension-4, 4px));
557
+ }
558
+ .root svg{
559
+ flex:0 0 auto;
560
+ stroke-width:var(--sn-density-size-icon-strokeWeight-s, 1.5px);
561
+ }
562
+ .root svg:not(.chevron){
563
+ width:var(--sn-density-size-icon-s, var(--sn-primitive-dimension-24, 24px));
564
+ height:var(--sn-density-size-icon-s, var(--sn-primitive-dimension-24, 24px));
565
+ }
566
+ .root:focus-visible{
567
+ outline:var(--sn-primitive-strokeWeight-strokeSemiBold, 2px) solid var(--sn-theme-color-available-complementary, #000000);
568
+ outline-offset:0;
569
+ }
570
+ .root[data-checked]{
571
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
572
+ }
573
+ .root[data-disabled]{
574
+ cursor:not-allowed;
575
+ color:var(--sn-theme-color-available-version-textDisabled, var(--sn-brand-color-text-version-disabled, rgba(65, 66, 78, 0.3490196078)));
576
+ }
577
+ .root .stateLayer{
578
+ position:absolute;
579
+ inset:0;
580
+ border-radius:inherit;
581
+ }
582
+ .root .stateLayer[data-state=borderOnBackground]{
583
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
584
+ border-style:solid;
585
+ border-width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
586
+ }
587
+ .root .stateLayer[data-state=emptyNeutralOnBackground]{
588
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(120, 123, 138, 0)));
589
+ }
590
+ .root .stateLayer[data-state=activatedOnBackground]{
591
+ background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, var(--sn-brandRole-color-brandA-backgroundActivatedDefault, rgba(56, 159, 116, 0.1490196078))));
592
+ }
593
+ .root .stateLayer[data-state=versionOnColor]{
594
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-default-filled, rgba(0, 0, 0, 0.0509803922));
595
+ }
596
+ .root .stateLayer[data-state=emptyVersionOnColor]{
597
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-defaultEmpty-filled, rgba(0, 0, 0, 0));
598
+ }
599
+ .root .stateLayer[data-state=inversionOnColor]{
600
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-default-filled, rgba(255, 255, 255, 0.1019607843));
601
+ }
602
+ .root .stateLayer[data-state=emptyInversionOnColor]{
603
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-defaultEmpty-filled, rgba(255, 255, 255, 0));
604
+ }
605
+ .root .stateLayer[data-state=emptyDarkOnAccent]{
606
+ background:var(--sn-theme-color-material-stateLayer-darkOnAccent-defaultEmpty-filled, rgba(0, 0, 0, 0));
607
+ }
608
+ @media (hover: hover){
609
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
610
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(159, 166, 198, 0.6509803922)));
611
+ }
612
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
613
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
614
+ }
615
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
616
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, var(--sn-brandRole-color-brandA-backgroundActivatedHovered, rgba(56, 159, 116, 0.3490196078))));
617
+ }
618
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
619
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
620
+ }
621
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyVersionOnColor]{
622
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
623
+ }
624
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=inversionOnColor]{
625
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-hovered-filled, rgba(255, 255, 255, 0.1490196078));
626
+ }
627
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyInversionOnColor]{
628
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-hovered-filled, rgba(255, 255, 255, 0.1490196078));
629
+ }
630
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyDarkOnAccent]{
631
+ background:var(--sn-theme-color-material-stateLayer-darkOnAccent-hovered-filled, rgba(0, 0, 0, 0.0588235294));
632
+ }
633
+ }
634
+ .root{
635
+ }
636
+ .root[data-loading] .stateLayer[data-state=borderOnBackground], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
637
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(159, 166, 198, 0.8)));
638
+ }
639
+ .root[data-loading] .stateLayer[data-state=emptyNeutralOnBackground], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
640
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(188, 195, 220, 0.3019607843)));
641
+ }
642
+ .root[data-loading] .stateLayer[data-state=activatedOnBackground], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
643
+ background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, var(--sn-brandRole-color-brandA-backgroundActivatedPressed, rgba(56, 159, 116, 0.4509803922))));
644
+ }
645
+ .root[data-loading] .stateLayer[data-state=versionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
646
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
647
+ }
648
+ .root[data-loading] .stateLayer[data-state=emptyVersionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyVersionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyVersionOnColor]{
649
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
650
+ }
651
+ .root[data-loading] .stateLayer[data-state=inversionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=inversionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=inversionOnColor]{
652
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-pressed-filled, rgba(255, 255, 255, 0.0509803922));
653
+ }
654
+ .root[data-loading] .stateLayer[data-state=emptyInversionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyInversionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyInversionOnColor]{
655
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-pressed-filled, rgba(255, 255, 255, 0.0509803922));
656
+ }
657
+ .root[data-loading] .stateLayer[data-state=emptyDarkOnAccent], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyDarkOnAccent], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyDarkOnAccent]{
658
+ background:var(--sn-theme-color-material-stateLayer-darkOnAccent-pressed-filled, rgba(0, 0, 0, 0.1215686275));
659
+ }
660
+
661
+ .tooltipTrigger{
662
+ display:inline-flex;
663
+ }
664
+
665
+ .tipTitle{
666
+ text-align:center;
667
+ }
668
+
669
+ .tipCaption{
670
+ color:var(--sn-theme-color-available-inversion-textTertiary, var(--sn-brand-color-text-inversion-tertiary, rgba(242, 243, 248, 0.6)));
671
+ text-align:center;
672
+ }
673
+ @charset "UTF-8";
674
+ .stateLayer{
675
+ pointer-events:none;
676
+ }
677
+
678
+ .root{
679
+ cursor:pointer;
680
+ position:relative;
681
+ box-sizing:border-box;
682
+ width:var(--sn-markdown-anatomy-size-tableSelect-container-item-size, var(--sn-primitive-dimension-16, 16px));
683
+ height:var(--sn-markdown-anatomy-size-tableSelect-container-item-size, var(--sn-primitive-dimension-16, 16px));
684
+ padding:0;
685
+ border:var(--sn-markdown-anatomy-size-tableSelect-container-item-borderWidth, var(--sn-primitive-strokeWeight-strokeRegular, 1px)) solid var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
686
+ border-radius:var(--sn-markdown-anatomy-size-tableSelect-container-item-borderRadius, var(--sn-density-radius-2xs, var(--sn-primitive-dimension-4, 4px)));
687
+ }
688
+ .root[data-checked]{
689
+ border-color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
690
+ }
691
+ .root .stateLayer{
692
+ position:absolute;
693
+ inset:0;
694
+ border-radius:inherit;
695
+ }
696
+ .root .stateLayer[data-state=borderOnBackground]{
697
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
698
+ border-style:solid;
699
+ border-width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
700
+ }
701
+ .root .stateLayer[data-state=emptyNeutralOnBackground]{
702
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(120, 123, 138, 0)));
703
+ }
704
+ .root .stateLayer[data-state=activatedOnBackground]{
705
+ background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, var(--sn-brandRole-color-brandA-backgroundActivatedDefault, rgba(56, 159, 116, 0.1490196078))));
706
+ }
707
+ .root .stateLayer[data-state=versionOnColor]{
708
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-default-filled, rgba(0, 0, 0, 0.0509803922));
709
+ }
710
+ .root .stateLayer[data-state=emptyVersionOnColor]{
711
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-defaultEmpty-filled, rgba(0, 0, 0, 0));
712
+ }
713
+ .root .stateLayer[data-state=inversionOnColor]{
714
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-default-filled, rgba(255, 255, 255, 0.1019607843));
715
+ }
716
+ .root .stateLayer[data-state=emptyInversionOnColor]{
717
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-defaultEmpty-filled, rgba(255, 255, 255, 0));
718
+ }
719
+ .root .stateLayer[data-state=emptyDarkOnAccent]{
720
+ background:var(--sn-theme-color-material-stateLayer-darkOnAccent-defaultEmpty-filled, rgba(0, 0, 0, 0));
721
+ }
722
+ @media (hover: hover){
723
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
724
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(159, 166, 198, 0.6509803922)));
725
+ }
726
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
727
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
728
+ }
729
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
730
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, var(--sn-brandRole-color-brandA-backgroundActivatedHovered, rgba(56, 159, 116, 0.3490196078))));
731
+ }
732
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
733
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
734
+ }
735
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyVersionOnColor]{
736
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
737
+ }
738
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=inversionOnColor]{
739
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-hovered-filled, rgba(255, 255, 255, 0.1490196078));
740
+ }
741
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyInversionOnColor]{
742
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-hovered-filled, rgba(255, 255, 255, 0.1490196078));
743
+ }
744
+ .root:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyDarkOnAccent]{
745
+ background:var(--sn-theme-color-material-stateLayer-darkOnAccent-hovered-filled, rgba(0, 0, 0, 0.0588235294));
746
+ }
747
+ }
748
+ .root{
749
+ }
750
+ .root[data-loading] .stateLayer[data-state=borderOnBackground], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
751
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(159, 166, 198, 0.8)));
752
+ }
753
+ .root[data-loading] .stateLayer[data-state=emptyNeutralOnBackground], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
754
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(188, 195, 220, 0.3019607843)));
755
+ }
756
+ .root[data-loading] .stateLayer[data-state=activatedOnBackground], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
757
+ background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, var(--sn-brandRole-color-brandA-backgroundActivatedPressed, rgba(56, 159, 116, 0.4509803922))));
758
+ }
759
+ .root[data-loading] .stateLayer[data-state=versionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
760
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
761
+ }
762
+ .root[data-loading] .stateLayer[data-state=emptyVersionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyVersionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyVersionOnColor]{
763
+ background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
764
+ }
765
+ .root[data-loading] .stateLayer[data-state=inversionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=inversionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=inversionOnColor]{
766
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-pressed-filled, rgba(255, 255, 255, 0.0509803922));
767
+ }
768
+ .root[data-loading] .stateLayer[data-state=emptyInversionOnColor], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyInversionOnColor], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyInversionOnColor]{
769
+ background:var(--sn-theme-color-material-stateLayer-inversionOnColor-pressed-filled, rgba(255, 255, 255, 0.0509803922));
770
+ }
771
+ .root[data-loading] .stateLayer[data-state=emptyDarkOnAccent], .root:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyDarkOnAccent], .root[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyDarkOnAccent]{
772
+ background:var(--sn-theme-color-material-stateLayer-darkOnAccent-pressed-filled, rgba(0, 0, 0, 0.1215686275));
773
+ }
774
+ .root{
775
+ display:flex;
776
+ flex-direction:column;
777
+ }
778
+
779
+ .container{
780
+ display:flex;
781
+ flex-direction:column;
782
+ gap:var(--sn-markdown-anatomy-size-tableSelect-container-gap, var(--sn-primitive-dimension-4, 4px));
783
+ box-sizing:border-box;
784
+ padding:var(--sn-markdown-anatomy-size-tableSelect-container-paddingHorizontal, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-tableSelect-container-paddingHorizontal, var(--sn-primitive-dimension-8, 8px)) var(--sn-markdown-anatomy-size-tableSelect-container-paddingBottom, var(--sn-primitive-dimension-4, 4px));
785
+ }
786
+
787
+ .grid{
788
+ display:grid;
789
+ grid-template-columns:repeat(8, var(--sn-markdown-anatomy-size-tableSelect-container-item-size, var(--sn-primitive-dimension-16, 16px)));
790
+ gap:var(--sn-markdown-anatomy-size-tableSelect-container-gap, var(--sn-primitive-dimension-4, 4px));
791
+ }
792
+
793
+ .label{
794
+ font-size:var(--sn-density-typography-roleBody-fontSizeS, var(--sn-primitive-font-fontSize-14, 14px));
795
+ line-height:var(--sn-density-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-by14, 20px));
796
+ color:var(--sn-theme-color-available-version-textSecondary, var(--sn-brand-color-text-version-secondary, rgba(65, 66, 78, 0.8)));
797
+ text-align:center;
798
+ }
799
+
800
+ .customize{
801
+ cursor:pointer;
802
+ display:flex;
803
+ gap:var(--sn-primitive-dimension-8, 8px);
804
+ align-items:center;
805
+ justify-content:space-between;
806
+ box-sizing:border-box;
807
+ padding:var(--sn-primitive-dimension-4, 4px) var(--sn-primitive-dimension-12, 12px);
808
+ border:none;
809
+ font-family:var(--sn-brand-font-fontFamily-regular-body, var(--sn-primitive-fontFamily-brandA-sans, SB Sans Interface));
810
+ font-size:var(--sn-density-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px));
811
+ line-height:var(--sn-density-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-by16, 24px));
812
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
813
+ text-align:left;
814
+ background:transparent;
815
+ }
816
+ .customize:hover{
817
+ background:var(--sn-theme-color-neutral-background2Level, var(--sn-brand-color-neutral-99, var(--sn-primitive-color-gray-99, #ffffff)));
818
+ }
819
+
820
+ .customizeLabel{
821
+ flex:1 1 auto;
822
+ }
823
+
824
+ .customizeChevron{
825
+ flex:0 0 auto;
826
+ color:var(--sn-theme-color-available-version-textSecondary, var(--sn-brand-color-text-version-secondary, rgba(65, 66, 78, 0.8)));
827
+ }
828
+
829
+ .syntax :global(.hljs-comment),
830
+ .syntax :global(.hljs-quote){
831
+ font-style:italic;
832
+ color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(65, 66, 78, 0.5490196078)));
833
+ }
834
+ .syntax :global(.hljs-keyword),
835
+ .syntax :global(.hljs-selector-tag),
836
+ .syntax :global(.hljs-built_in),
837
+ .syntax :global(.hljs-name),
838
+ .syntax :global(.hljs-tag){
839
+ color:var(--sn-theme-color-blue-text, var(--sn-primitive-color-blue-45, #3b6fad));
840
+ }
841
+ .syntax :global(.hljs-string),
842
+ .syntax :global(.hljs-title),
843
+ .syntax :global(.hljs-section),
844
+ .syntax :global(.hljs-attribute),
845
+ .syntax :global(.hljs-literal),
846
+ .syntax :global(.hljs-template-tag),
847
+ .syntax :global(.hljs-template-variable),
848
+ .syntax :global(.hljs-type),
849
+ .syntax :global(.hljs-addition){
850
+ color:var(--sn-theme-color-green-text, var(--sn-primitive-color-green-45, #438b4b));
851
+ }
852
+ .syntax :global(.hljs-number),
853
+ .syntax :global(.hljs-symbol),
854
+ .syntax :global(.hljs-bullet),
855
+ .syntax :global(.hljs-link),
856
+ .syntax :global(.hljs-meta),
857
+ .syntax :global(.hljs-selector-id),
858
+ .syntax :global(.hljs-selector-class){
859
+ color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
860
+ }
861
+ .syntax :global(.hljs-deletion),
862
+ .syntax :global(.hljs-regexp),
863
+ .syntax :global(.hljs-variable),
864
+ .syntax :global(.hljs-template-variable){
865
+ color:var(--sn-theme-color-red-text, var(--sn-primitive-color-red-45, #a93533));
866
+ }
867
+ .syntax :global(.hljs-emphasis){
868
+ font-style:italic;
869
+ }
870
+ .syntax :global(.hljs-strong){
871
+ font-weight:600;
872
+ }
873
+ .syntax :global(.hljs-link){
874
+ text-decoration:underline;
875
+ }