theme.css 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536
  1. :root {
  2. --font-sans:
  3. ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  4. --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  5. --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  6. --spacing: 0.25rem;
  7. --breakpoint-sm: 40rem;
  8. --breakpoint-md: 48rem;
  9. --breakpoint-lg: 64rem;
  10. --breakpoint-xl: 80rem;
  11. --breakpoint-2xl: 96rem;
  12. --container-3xs: 16rem;
  13. --container-2xs: 18rem;
  14. --container-xs: 20rem;
  15. --container-sm: 24rem;
  16. --container-md: 28rem;
  17. --container-lg: 32rem;
  18. --container-xl: 36rem;
  19. --container-2xl: 42rem;
  20. --container-3xl: 48rem;
  21. --container-4xl: 56rem;
  22. --container-5xl: 64rem;
  23. --container-6xl: 72rem;
  24. --container-7xl: 80rem;
  25. --text-xs: 0.75rem;
  26. --text-xs--line-height: calc(1 / 0.75);
  27. --text-sm: 0.875rem;
  28. --text-sm--line-height: calc(1.25 / 0.875);
  29. --text-base: 1rem;
  30. --text-base--line-height: calc(1.5 / 1);
  31. --text-lg: 1.125rem;
  32. --text-lg--line-height: calc(1.75 / 1.125);
  33. --text-xl: 1.25rem;
  34. --text-xl--line-height: calc(1.75 / 1.25);
  35. --text-2xl: 1.5rem;
  36. --text-2xl--line-height: calc(2 / 1.5);
  37. --text-3xl: 1.875rem;
  38. --text-3xl--line-height: calc(2.25 / 1.875);
  39. --text-4xl: 2.25rem;
  40. --text-4xl--line-height: calc(2.5 / 2.25);
  41. --text-5xl: 3rem;
  42. --text-5xl--line-height: 1;
  43. --text-6xl: 3.75rem;
  44. --text-6xl--line-height: 1;
  45. --text-7xl: 4.5rem;
  46. --text-7xl--line-height: 1;
  47. --text-8xl: 6rem;
  48. --text-8xl--line-height: 1;
  49. --text-9xl: 8rem;
  50. --text-9xl--line-height: 1;
  51. --font-weight-thin: 100;
  52. --font-weight-extralight: 200;
  53. --font-weight-light: 300;
  54. --font-weight-normal: 400;
  55. --font-weight-medium: 500;
  56. --font-weight-semibold: 600;
  57. --font-weight-bold: 700;
  58. --font-weight-extrabold: 800;
  59. --font-weight-black: 900;
  60. --tracking-tighter: -0.05em;
  61. --tracking-tight: -0.025em;
  62. --tracking-normal: 0em;
  63. --tracking-wide: 0.025em;
  64. --tracking-wider: 0.05em;
  65. --tracking-widest: 0.1em;
  66. --leading-tight: 1.25;
  67. --leading-snug: 1.375;
  68. --leading-normal: 1.5;
  69. --leading-relaxed: 1.625;
  70. --leading-loose: 2;
  71. --radius-xs: 0.125rem;
  72. --radius-sm: 0.25rem;
  73. --radius-md: 0.375rem;
  74. --radius-lg: 0.5rem;
  75. --radius-xl: 0.75rem;
  76. --radius-2xl: 1rem;
  77. --radius-3xl: 1.5rem;
  78. --radius-4xl: 2rem;
  79. --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
  80. --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  81. --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  82. --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  83. --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  84. --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  85. --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  86. --inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);
  87. --inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);
  88. --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);
  89. --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);
  90. --drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);
  91. --drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);
  92. --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);
  93. --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
  94. --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
  95. --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);
  96. --text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);
  97. --text-shadow-sm: 0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075);
  98. --text-shadow-md: 0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1);
  99. --text-shadow-lg: 0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1);
  100. }
  101. :root {
  102. /* OC-1-Light */
  103. color-scheme: light;
  104. --background-background: var(--smoke-light-1);
  105. --background-background-weak: #f7f6f6;
  106. --background-background-weaker: #fcfcfc;
  107. --surface-default-surface: var(--smoke-light-2);
  108. --input-input: var(--smoke-light-1);
  109. --input-input-hover: var(--smoke-light-2);
  110. --input-input-active: var(--cobalt-light-1);
  111. --input-input-selected: var(--cobalt-light-4);
  112. --input-input-focus: var(--cobalt-light-1);
  113. --input-input-disabled: var(--smoke-light-4);
  114. --surface-default-surface-hover: var(--smoke-light-4);
  115. --surface-default-surface-active: var(--smoke-light-5);
  116. --surface-default-surface-selected: var(--cobalt-light-3);
  117. --surface-default-surface-disabled: var(--smoke-light-2);
  118. --surface-default-surface-focus: var(--cobalt-light-3);
  119. --surface-inset-surface-inset: var(--smoke-light-3);
  120. --surface-inset-surface-inset-hover: var(--smoke-light-4);
  121. --surface-inset-surface-inset-active: var(--smoke-light-6);
  122. --surface-inset-surface-inset-selected: var(--cobalt-light-4);
  123. --surface-inset-surface-inset-disabled: var(--smoke-light-3);
  124. --surface-inset-surface-inset-focus: var(--cobalt-light-4);
  125. --surface-raised-surface-raised: var(--white);
  126. --surface-raised-surface-raised-hover: var(--smoke-light-3);
  127. --surface-raised-surface-raised-active: var(--smoke-light-4);
  128. --surface-raised-surface-raised-selected: var(--cobalt-light-3);
  129. --surface-raised-surface-raised-disabled: var(--smoke-light-2);
  130. --surface-raised-surface-raised-focus: var(--cobalt-light-3);
  131. --surface-overlay-surface-overlay: var(--smoke-light-alpha-9);
  132. --surface-brand-surface-brand: var(--yuzu-light-9);
  133. --surface-brand-surface-brand-hover: var(--yuzu-light-10);
  134. --surface-interactive-surface-interactive: var(--cobalt-light-3);
  135. --surface-interactive-surface-interactive-hover: var(--cobalt-light-4);
  136. --surface-interactive-surface-interactive-weak: var(--cobalt-light-2);
  137. --surface-interactive-surface-interactive-weak-hover: var(--cobalt-light-3);
  138. --surface-success-surface-success: var(--apple-light-3);
  139. --surface-success-surface-success-weak: var(--apple-light-2);
  140. --surface-success-surface-success-strong: var(--apple-light-9);
  141. --surface-warning-surface-warning: var(--solaris-light-3);
  142. --surface-warning-surface-warning-weak: var(--solaris-light-2);
  143. --surface-warning-surface-warning-strong: var(--solaris-light-9);
  144. --surface-critical-surface-critical: var(--ember-light-3);
  145. --surface-critical-surface-critical-weak: var(--ember-light-2);
  146. --surface-critical-surface-critical-strong: var(--ember-light-9);
  147. --surface-info-surface-info: var(--lilac-light-3);
  148. --surface-info-surface-info-weak: var(--lilac-light-2);
  149. --surface-info-surface-info-strong: var(--lilac-light-9);
  150. --surface-diff-add-surface-diff-add: var(--coral-light-3);
  151. --surface-diff-add-surface-diff-add-weak: var(--coral-light-2);
  152. --surface-diff-add-surface-diff-add-weaker: var(--coral-light-1);
  153. --surface-diff-add-surface-diff-add-strong: var(--coral-light-9);
  154. --surface-diff-add-surface-diff-add-stronger: var(--coral-light-12);
  155. --surface-diff-delete-surface-diff-delete: var(--mint-light-3);
  156. --surface-on-background-weak-default-surface-on-background-weak: var(--smoke-light-1);
  157. --surface-on-background-weak-inset-surface-inset-on-background-weak: var(--smoke-light-1);
  158. --surface-on-background-weak-default-surface-on-background-weak-hover: var(--smoke-light-1);
  159. --surface-on-background-weak-default-surface-on-background-weak-active: var(--smoke-light-1);
  160. --surface-on-background-weak-default-surface-on-background-weak-selected: var(--smoke-light-1);
  161. --surface-on-background-weak-default-surface-on-background-weak-disabled: var(--smoke-light-1);
  162. --surface-on-background-weak-default-surface-on-background-weak-focus: var(--smoke-light-1);
  163. --surface-on-background-weak-inset-surface-inset-on-background-weak-hover: var(--smoke-light-1);
  164. --surface-on-background-weak-inset-surface-inset-on-background-weak-active: var(--smoke-light-1);
  165. --surface-on-background-weak-inset-surface-inset-on-background-weak-selected: var(--smoke-light-1);
  166. --surface-on-background-weak-inset-surface-inset-on-background-weak-disabled: var(--smoke-light-1);
  167. --surface-on-background-weak-inset-surface-inset-on-background-weak-focus: var(--smoke-light-1);
  168. --surface-diff-delete-surface-diff-delete-weak: var(--mint-light-2);
  169. --surface-diff-delete-surface-diff-delete-weaker: var(--mint-light-1);
  170. --surface-diff-delete-surface-diff-delete-strong: var(--mint-light-9);
  171. --surface-diff-delete-surface-diff-delete-stronger: var(--mint-light-11);
  172. --text-default-text: var(--smoke-light-11);
  173. --text-default-text-weak: var(--smoke-light-9);
  174. --text-default-text-weaker: var(--smoke-light-8);
  175. --text-default-text-strong: var(--smoke-light-12);
  176. --text-on-brand-text-on-brand: var(--smoke-light-alpha-11);
  177. --text-on-interactive-text-on-interactive: var(--smoke-light-alpha-11);
  178. --text-on-success-text-on-success: var(--smoke-dark-alpha-11);
  179. --text-on-warning-text-on-warning: var(--smoke-dark-alpha-11);
  180. --text-on-info-text-on-info: var(--smoke-dark-alpha-11);
  181. --text-on-diff-add-text-on-diff-add: var(--smoke-dark-alpha-11);
  182. --text-on-diff-delete-text-on-diff-delete: var(--smoke-dark-alpha-11);
  183. --text-on-diff-delete-text-weak-on-diff-delete: var(--smoke-dark-alpha-9);
  184. --text-on-diff-delete-text-strong-on-diff-delete: var(--smoke-dark-alpha-12);
  185. --text-on-diff-add-text-weak-on-diff-add: var(--smoke-dark-alpha-9);
  186. --text-on-diff-add-text-strong-on-diff-add: var(--smoke-dark-alpha-12);
  187. --text-on-info-text-weak-on-info: var(--smoke-dark-alpha-9);
  188. --text-on-info-text-strong-on-info: var(--smoke-dark-alpha-12);
  189. --text-on-warning-text-weak-on-warning: var(--smoke-dark-alpha-9);
  190. --text-on-warning-text-strong-on-warning: var(--smoke-dark-alpha-12);
  191. --text-on-success-text-weak-on-success: var(--smoke-dark-alpha-9);
  192. --text-on-success-text-strong-on-success: var(--smoke-dark-alpha-12);
  193. --text-on-interactive-text-weak-on-interactive: var(--smoke-light-alpha-9);
  194. --text-on-interactive-text-strong-on-interactive: var(--smoke-light-alpha-12);
  195. --text-on-brand-text-weak-on-brand: var(--smoke-light-alpha-9);
  196. --text-on-brand-text-weaker-on-brand: var(--smoke-light-alpha-8);
  197. --text-on-brand-text-strong-on-brand: var(--smoke-light-alpha-12);
  198. --border-default-border: var(--smoke-light-alpha-7);
  199. --border-default-border-hover: var(--smoke-light-alpha-8);
  200. --border-default-border-active: var(--smoke-light-alpha-9);
  201. --border-default-border-selected: var(--cobalt-light-alpha-9);
  202. --border-default-border-disabled: var(--smoke-light-alpha-8);
  203. --border-default-border-focus: var(--smoke-light-alpha-9);
  204. --border-default-border-weak: var(--smoke-light-alpha-5);
  205. --icon-default-icon: var(--smoke-light-9);
  206. --border-default-border-weak-hover: var(--smoke-light-alpha-6);
  207. --icon-default-icon-hover: var(--smoke-light-10);
  208. --border-default-border-weak-active: var(--smoke-light-alpha-7);
  209. --icon-default-icon-active: var(--smoke-light-11);
  210. --icon-default-icon-selected: var(--smoke-light-12);
  211. --icon-default-icon-disabled: var(--smoke-light-7);
  212. --icon-default-icon-focus: var(--smoke-light-12);
  213. --icon-default-icon-weak: var(--smoke-light-7);
  214. --icon-default-icon-weak-hover: var(--smoke-light-8);
  215. --icon-default-icon-weak-active: var(--smoke-light-9);
  216. --icon-default-icon-weak-selected: var(--smoke-light-10);
  217. --icon-default-icon-weak-disabled: var(--smoke-light-6);
  218. --icon-default-icon-weak-focus: var(--smoke-light-9);
  219. --icon-default-icon-strong: var(--smoke-light-12);
  220. --icon-default-icon-strong-hover: var(--smoke-light-12);
  221. --icon-default-icon-strong-active: var(--smoke-light-12);
  222. --icon-default-icon-strong-selected: var(--smoke-light-12);
  223. --icon-default-icon-strong-disabled: var(--smoke-light-8);
  224. --icon-default-icon-strong-focus: var(--smoke-light-12);
  225. --border-default-border-weak-selected: var(--cobalt-light-alpha-6);
  226. --border-default-border-weak-disabled: var(--smoke-light-alpha-6);
  227. --border-default-border-weak-focus: var(--smoke-light-alpha-7);
  228. --border-interactive-border-interactive: var(--cobalt-light-7);
  229. --border-interactive-border-interactive-hover: var(--cobalt-light-8);
  230. --border-interactive-border-interactive-active: var(--cobalt-light-9);
  231. --border-interactive-border-interactive-selected: var(--cobalt-light-9);
  232. --border-interactive-border-interactive-disabled: var(--smoke-light-8);
  233. --border-interactive-border-interactive-focus: var(--cobalt-light-9);
  234. --border-success-border-success: var(--apple-light-6);
  235. --border-success-border-success-hover: var(--apple-light-7);
  236. --border-success-border-success-selected: var(--apple-light-9);
  237. --border-warning-border-warning: var(--solaris-light-6);
  238. --border-warning-border-warning-hover: var(--solaris-light-7);
  239. --border-warning-border-warning-selected: var(--solaris-light-9);
  240. --border-critical-border-critical: var(--ember-light-6);
  241. --border-critical-border-critical-hover: var(--ember-light-7);
  242. --border-critical-border-critical-selected: var(--ember-light-9);
  243. --border-info-border-info: var(--lilac-light-6);
  244. --border-info-border-info-hover: var(--lilac-light-7);
  245. --border-info-border-info-selected: var(--lilac-light-9);
  246. --icon-brand-icon-brand: var(--smoke-light-12);
  247. --icon-success-icon-success: var(--apple-light-7);
  248. --icon-warning-icon-warning: var(--solaris-light-7);
  249. --icon-warning-icon-warning-hover: var(--solaris-light-8);
  250. --icon-warning-icon-warning-active: var(--solaris-light-11);
  251. --icon-success-icon-success-hover: var(--apple-light-8);
  252. --icon-success-icon-success-active: var(--apple-light-11);
  253. --icon-critical-icon-critical: var(--ember-light-7);
  254. --icon-critical-icon-critical-hover: var(--ember-light-8);
  255. --icon-critical-icon-critical-active: var(--ember-light-11);
  256. --icon-info-icon-info: var(--lilac-light-7);
  257. --icon-info-icon-info-hover: var(--lilac-light-8);
  258. --icon-info-icon-info-active: var(--lilac-light-11);
  259. --icon-on-brand-icon-on-brand: var(--smoke-light-alpha-11);
  260. --icon-on-brand-icon-on-brand-hover: var(--smoke-light-alpha-12);
  261. --icon-on-brand-icon-on-brand-selected: var(--smoke-light-alpha-12);
  262. --icon-on-interactive-icon-on-interactive: var(--smoke-light-alpha-9);
  263. --icon-on-interactive-icon-on-interactive-hover: var(--smoke-light-alpha-10);
  264. --icon-on-interactive-icon-on-interactive-selected: var(--smoke-light-alpha-11);
  265. --icon-on-success-icon-on-success: var(--apple-light-alpha-9);
  266. --icon-on-success-icon-on-success-hover: var(--apple-light-alpha-10);
  267. --icon-on-success-icon-on-success-selected: var(--apple-light-alpha-11);
  268. --icon-on-warning-icon-on-warning: var(--solaris-light-alpha-9);
  269. --icon-on-warning-icon-on-warning-hover: var(--solaris-light-alpha-10);
  270. --icon-on-warning-icon-on-warning-selected: var(--solaris-light-alpha-11);
  271. --icon-on-critical-icon-on-critical: var(--ember-light-alpha-9);
  272. --icon-on-critical-icon-on-critical-hover: var(--ember-light-alpha-10);
  273. --icon-on-critical-icon-on-critical-selected: var(--ember-light-alpha-11);
  274. --icon-on-info-icon-on-info: var(--lilac-light-9);
  275. --icon-on-diff-add-icon-on-diff-add: var(--mint-dark-alpha-9);
  276. --icon-on-diff-delete-icon-on-diff-delete: var(--coral-light-alpha-9);
  277. --icon-on-diff-delete-icon-on-diff-delete-hover: var(--coral-light-alpha-10);
  278. --icon-on-diff-delete-icon-on-diff-delete-active: var(--coral-light-alpha-11);
  279. --icon-on-diff-add-icon-on-diff-add-hover: var(--mint-dark-alpha-10);
  280. --icon-on-diff-add-icon-on-diff-add-active: var(--mint-dark-alpha-11);
  281. --icon-on-info-icon-on-info-hover: var(--lilac-light-alpha-10);
  282. --icon-on-info-icon-on-info-selected: var(--lilac-light-alpha-11);
  283. --syntax-syntax-comment: #ffffff;
  284. --syntax-syntax-string: #ffffff;
  285. --syntax-syntax-keyword: #ffffff;
  286. --syntax-syntax-function: #ffffff;
  287. --syntax-syntax-number: #ffffff;
  288. --syntax-syntax-operator: #ffffff;
  289. --syntax-syntax-variable: #ffffff;
  290. --syntax-syntax-type: #ffffff;
  291. --syntax-syntax-constant: #ffffff;
  292. --syntax-syntax-punctuation: #ffffff;
  293. --syntax-syntax-success: #ffffff;
  294. --syntax-syntax-warning: #ffffff;
  295. --syntax-syntax-critical: #ffffff;
  296. --syntax-syntax-info: #ffffff;
  297. --markdown-markdown-heading: #ffffff;
  298. --markdown-markdown-text: #ffffff;
  299. --markdown-markdown-link: #ffffff;
  300. --markdown-markdown-link-text: #ffffff;
  301. --markdown-markdown-code: #ffffff;
  302. --markdown-markdown-block-quote: #ffffff;
  303. --markdown-markdown-emph: #ffffff;
  304. --markdown-markdown-strong: #ffffff;
  305. --markdown-markdown-horizontal-rule: #ffffff;
  306. --markdown-markdown-list-item: #ffffff;
  307. --markdown-markdown-list-enumeration: #ffffff;
  308. --markdown-markdown-image: #ffffff;
  309. --markdown-markdown-image-text: #ffffff;
  310. --markdown-markdown-code-block: #ffffff;
  311. .dark {
  312. /* OC-1-Dark */
  313. color-scheme: dark;
  314. --background-background: var(--smoke-dark-1);
  315. --background-background-weak: #151313;
  316. --background-background-weaker: #201c1c;
  317. --surface-default-surface: var(--smoke-dark-3);
  318. --input-input: var(--smoke-dark-2);
  319. --input-input-hover: var(--smoke-dark-2);
  320. --input-input-active: var(--cobalt-dark-1);
  321. --input-input-selected: var(--cobalt-dark-2);
  322. --input-input-focus: var(--cobalt-dark-1);
  323. --input-input-disabled: var(--smoke-dark-4);
  324. --surface-default-surface-hover: var(--smoke-dark-4);
  325. --surface-default-surface-active: var(--smoke-dark-5);
  326. --surface-default-surface-selected: var(--cobalt-dark-3);
  327. --surface-default-surface-disabled: var(--smoke-dark-2);
  328. --surface-default-surface-focus: var(--cobalt-dark-3);
  329. --surface-inset-surface-inset: var(--smoke-dark-4);
  330. --surface-inset-surface-inset-hover: var(--smoke-dark-5);
  331. --surface-inset-surface-inset-active: var(--smoke-dark-6);
  332. --surface-inset-surface-inset-selected: var(--cobalt-dark-4);
  333. --surface-inset-surface-inset-disabled: var(--smoke-dark-3);
  334. --surface-inset-surface-inset-focus: var(--cobalt-dark-4);
  335. --surface-raised-surface-raised: var(--smoke-dark-4);
  336. --surface-raised-surface-raised-hover: var(--smoke-dark-7);
  337. --surface-raised-surface-raised-active: var(--smoke-dark-8);
  338. --surface-raised-surface-raised-selected: var(--cobalt-dark-3);
  339. --surface-raised-surface-raised-disabled: var(--smoke-dark-3);
  340. --surface-raised-surface-raised-focus: var(--cobalt-dark-3);
  341. --surface-overlay-surface-overlay: var(--smoke-dark-alpha-2);
  342. --surface-brand-surface-brand: var(--yuzu-light-9);
  343. --surface-brand-surface-brand-hover: var(--yuzu-light-10);
  344. --surface-interactive-surface-interactive: var(--cobalt-light-3);
  345. --surface-interactive-surface-interactive-hover: var(--cobalt-light-4);
  346. --surface-interactive-surface-interactive-weak: var(--cobalt-light-2);
  347. --surface-interactive-surface-interactive-weak-hover: var(--cobalt-light-3);
  348. --surface-success-surface-success: var(--apple-light-3);
  349. --surface-success-surface-success-weak: var(--apple-light-2);
  350. --surface-success-surface-success-strong: var(--apple-light-9);
  351. --surface-warning-surface-warning: var(--solaris-light-3);
  352. --surface-warning-surface-warning-weak: var(--solaris-light-2);
  353. --surface-warning-surface-warning-strong: var(--solaris-light-9);
  354. --surface-critical-surface-critical: var(--ember-light-3);
  355. --surface-critical-surface-critical-weak: var(--ember-light-2);
  356. --surface-critical-surface-critical-strong: var(--ember-light-9);
  357. --surface-info-surface-info: var(--lilac-light-3);
  358. --surface-info-surface-info-weak: var(--lilac-light-2);
  359. --surface-info-surface-info-strong: var(--lilac-light-9);
  360. --surface-diff-add-surface-diff-add: var(--coral-light-3);
  361. --surface-diff-add-surface-diff-add-weak: var(--coral-light-2);
  362. --surface-diff-add-surface-diff-add-weaker: var(--coral-light-1);
  363. --surface-diff-add-surface-diff-add-strong: var(--coral-light-9);
  364. --surface-diff-add-surface-diff-add-stronger: var(--coral-light-12);
  365. --surface-diff-delete-surface-diff-delete: var(--mint-light-3);
  366. --surface-on-background-weak-default-surface-on-background-weak: var(--smoke-dark-1);
  367. --surface-on-background-weak-inset-surface-inset-on-background-weak: var(--smoke-light-1);
  368. --surface-on-background-weak-default-surface-on-background-weak-hover: var(--smoke-light-1);
  369. --surface-on-background-weak-default-surface-on-background-weak-active: var(--smoke-light-1);
  370. --surface-on-background-weak-default-surface-on-background-weak-selected: var(--smoke-light-1);
  371. --surface-on-background-weak-default-surface-on-background-weak-disabled: var(--smoke-light-1);
  372. --surface-on-background-weak-default-surface-on-background-weak-focus: var(--smoke-light-1);
  373. --surface-on-background-weak-inset-surface-inset-on-background-weak-hover: var(--smoke-light-1);
  374. --surface-on-background-weak-inset-surface-inset-on-background-weak-active: var(--smoke-light-1);
  375. --surface-on-background-weak-inset-surface-inset-on-background-weak-selected: var(--smoke-light-1);
  376. --surface-on-background-weak-inset-surface-inset-on-background-weak-disabled: var(--smoke-light-1);
  377. --surface-on-background-weak-inset-surface-inset-on-background-weak-focus: var(--smoke-light-1);
  378. --surface-diff-delete-surface-diff-delete-weak: var(--mint-light-2);
  379. --surface-diff-delete-surface-diff-delete-weaker: var(--mint-light-1);
  380. --surface-diff-delete-surface-diff-delete-strong: var(--mint-light-9);
  381. --surface-diff-delete-surface-diff-delete-stronger: var(--mint-light-11);
  382. --text-default-text: var(--smoke-dark-alpha-11);
  383. --text-default-text-weak: var(--smoke-dark-alpha-9);
  384. --text-default-text-weaker: var(--smoke-dark-alpha-8);
  385. --text-default-text-strong: var(--smoke-dark-alpha-12);
  386. --text-on-brand-text-on-brand: var(--smoke-dark-alpha-11);
  387. --text-on-interactive-text-on-interactive: var(--smoke-dark-alpha-11);
  388. --text-on-success-text-on-success: var(--smoke-dark-alpha-11);
  389. --text-on-warning-text-on-warning: var(--smoke-dark-alpha-11);
  390. --text-on-info-text-on-info: var(--smoke-dark-alpha-11);
  391. --text-on-diff-add-text-on-diff-add: var(--smoke-dark-alpha-11);
  392. --text-on-diff-delete-text-on-diff-delete: var(--smoke-dark-alpha-11);
  393. --text-on-diff-delete-text-weak-on-diff-delete: var(--smoke-dark-alpha-9);
  394. --text-on-diff-delete-text-strong-on-diff-delete: var(--smoke-dark-alpha-12);
  395. --text-on-diff-add-text-weak-on-diff-add: var(--smoke-dark-alpha-9);
  396. --text-on-diff-add-text-strong-on-diff-add: var(--smoke-dark-alpha-12);
  397. --text-on-info-text-weak-on-info: var(--smoke-dark-alpha-9);
  398. --text-on-info-text-strong-on-info: var(--smoke-dark-alpha-12);
  399. --text-on-warning-text-weak-on-warning: var(--smoke-dark-alpha-9);
  400. --text-on-warning-text-strong-on-warning: var(--smoke-dark-alpha-12);
  401. --text-on-success-text-weak-on-success: var(--smoke-dark-alpha-9);
  402. --text-on-success-text-strong-on-success: var(--smoke-dark-alpha-12);
  403. --text-on-interactive-text-weak-on-interactive: var(--smoke-dark-alpha-9);
  404. --text-on-interactive-text-strong-on-interactive: var(--smoke-dark-alpha-12);
  405. --text-on-brand-text-weak-on-brand: var(--smoke-dark-alpha-9);
  406. --text-on-brand-text-weaker-on-brand: var(--smoke-dark-alpha-8);
  407. --text-on-brand-text-strong-on-brand: var(--smoke-dark-alpha-12);
  408. --border-default-border: var(--smoke-dark-alpha-7);
  409. --border-default-border-hover: var(--smoke-dark-alpha-8);
  410. --border-default-border-active: var(--smoke-dark-alpha-9);
  411. --border-default-border-selected: var(--cobalt-dark-alpha-9);
  412. --border-default-border-disabled: var(--smoke-dark-alpha-8);
  413. --border-default-border-focus: var(--smoke-dark-alpha-9);
  414. --border-default-border-weak: var(--smoke-dark-alpha-6);
  415. --icon-default-icon: var(--smoke-light-9);
  416. --border-default-border-weak-hover: var(--smoke-dark-alpha-7);
  417. --icon-default-icon-hover: var(--smoke-light-10);
  418. --border-default-border-weak-active: var(--smoke-dark-alpha-8);
  419. --icon-default-icon-active: var(--smoke-light-11);
  420. --icon-default-icon-selected: var(--smoke-light-12);
  421. --icon-default-icon-disabled: var(--smoke-light-7);
  422. --icon-default-icon-focus: var(--smoke-light-12);
  423. --icon-default-icon-weak: var(--smoke-dark-6);
  424. --icon-default-icon-weak-hover: var(--smoke-light-7);
  425. --icon-default-icon-weak-active: var(--smoke-light-8);
  426. --icon-default-icon-weak-selected: var(--smoke-light-9);
  427. --icon-default-icon-weak-disabled: var(--smoke-light-4);
  428. --icon-default-icon-weak-focus: var(--smoke-light-9);
  429. --icon-default-icon-strong: var(--smoke-dark-12);
  430. --icon-default-icon-strong-hover: var(--smoke-light-12);
  431. --icon-default-icon-strong-active: var(--smoke-light-12);
  432. --icon-default-icon-strong-selected: var(--smoke-light-12);
  433. --icon-default-icon-strong-disabled: var(--smoke-light-8);
  434. --icon-default-icon-strong-focus: var(--smoke-light-12);
  435. --border-default-border-weak-selected: var(--cobalt-dark-alpha-6);
  436. --border-default-border-weak-disabled: var(--smoke-dark-alpha-6);
  437. --border-default-border-weak-focus: var(--smoke-dark-alpha-8);
  438. --border-interactive-border-interactive: var(--cobalt-light-7);
  439. --border-interactive-border-interactive-hover: var(--cobalt-light-8);
  440. --border-interactive-border-interactive-active: var(--cobalt-light-9);
  441. --border-interactive-border-interactive-selected: var(--cobalt-light-9);
  442. --border-interactive-border-interactive-disabled: var(--smoke-light-8);
  443. --border-interactive-border-interactive-focus: var(--cobalt-light-9);
  444. --border-success-border-success: var(--apple-light-6);
  445. --border-success-border-success-hover: var(--apple-light-7);
  446. --border-success-border-success-selected: var(--apple-light-9);
  447. --border-warning-border-warning: var(--solaris-light-6);
  448. --border-warning-border-warning-hover: var(--solaris-light-7);
  449. --border-warning-border-warning-selected: var(--solaris-light-9);
  450. --border-critical-border-critical: var(--ember-light-6);
  451. --border-critical-border-critical-hover: var(--ember-light-7);
  452. --border-critical-border-critical-selected: var(--ember-light-9);
  453. --border-info-border-info: var(--lilac-light-6);
  454. --border-info-border-info-hover: var(--lilac-light-7);
  455. --border-info-border-info-selected: var(--lilac-light-9);
  456. --icon-brand-icon-brand: var(--white);
  457. --icon-success-icon-success: var(--apple-light-7);
  458. --icon-warning-icon-warning: var(--solaris-light-7);
  459. --icon-warning-icon-warning-hover: var(--solaris-light-8);
  460. --icon-warning-icon-warning-active: var(--solaris-light-11);
  461. --icon-success-icon-success-hover: var(--apple-light-8);
  462. --icon-success-icon-success-active: var(--apple-light-11);
  463. --icon-critical-icon-critical: var(--ember-light-7);
  464. --icon-critical-icon-critical-hover: var(--ember-light-8);
  465. --icon-critical-icon-critical-active: var(--ember-light-11);
  466. --icon-info-icon-info: var(--lilac-light-7);
  467. --icon-info-icon-info-hover: var(--lilac-light-8);
  468. --icon-info-icon-info-active: var(--lilac-light-11);
  469. --icon-on-brand-icon-on-brand: var(--smoke-light-alpha-11);
  470. --icon-on-brand-icon-on-brand-hover: var(--smoke-light-alpha-12);
  471. --icon-on-brand-icon-on-brand-selected: var(--smoke-light-alpha-12);
  472. --icon-on-interactive-icon-on-interactive: var(--smoke-dark-alpha-9);
  473. --icon-on-interactive-icon-on-interactive-hover: var(--smoke-dark-alpha-10);
  474. --icon-on-interactive-icon-on-interactive-selected: var(--smoke-dark-alpha-11);
  475. --icon-on-success-icon-on-success: var(--apple-light-alpha-9);
  476. --icon-on-success-icon-on-success-hover: var(--apple-light-alpha-10);
  477. --icon-on-success-icon-on-success-selected: var(--apple-light-alpha-11);
  478. --icon-on-warning-icon-on-warning: var(--solaris-light-alpha-9);
  479. --icon-on-warning-icon-on-warning-hover: var(--solaris-light-alpha-10);
  480. --icon-on-warning-icon-on-warning-selected: var(--solaris-light-alpha-11);
  481. --icon-on-critical-icon-on-critical: var(--ember-light-alpha-9);
  482. --icon-on-critical-icon-on-critical-hover: var(--ember-light-alpha-10);
  483. --icon-on-critical-icon-on-critical-selected: var(--ember-light-alpha-11);
  484. --icon-on-info-icon-on-info: var(--lilac-light-9);
  485. --icon-on-diff-add-icon-on-diff-add: var(--mint-dark-alpha-9);
  486. --icon-on-diff-delete-icon-on-diff-delete: var(--coral-light-alpha-9);
  487. --icon-on-diff-delete-icon-on-diff-delete-hover: var(--coral-light-alpha-10);
  488. --icon-on-diff-delete-icon-on-diff-delete-active: var(--coral-light-alpha-11);
  489. --icon-on-diff-add-icon-on-diff-add-hover: var(--mint-dark-alpha-10);
  490. --icon-on-diff-add-icon-on-diff-add-active: var(--mint-dark-alpha-11);
  491. --icon-on-info-icon-on-info-hover: var(--lilac-light-alpha-10);
  492. --icon-on-info-icon-on-info-selected: var(--lilac-light-alpha-11);
  493. --syntax-syntax-comment: #ffffff;
  494. --syntax-syntax-string: #ffffff;
  495. --syntax-syntax-keyword: #ffffff;
  496. --syntax-syntax-function: #ffffff;
  497. --syntax-syntax-number: #ffffff;
  498. --syntax-syntax-operator: #ffffff;
  499. --syntax-syntax-variable: #ffffff;
  500. --syntax-syntax-type: #ffffff;
  501. --syntax-syntax-constant: #ffffff;
  502. --syntax-syntax-punctuation: #ffffff;
  503. --syntax-syntax-success: #ffffff;
  504. --syntax-syntax-warning: #ffffff;
  505. --syntax-syntax-critical: #ffffff;
  506. --syntax-syntax-info: #ffffff;
  507. --markdown-markdown-heading: #ffffff;
  508. --markdown-markdown-text: #ffffff;
  509. --markdown-markdown-link: #ffffff;
  510. --markdown-markdown-link-text: #ffffff;
  511. --markdown-markdown-code: #ffffff;
  512. --markdown-markdown-block-quote: #ffffff;
  513. --markdown-markdown-emph: #ffffff;
  514. --markdown-markdown-strong: #ffffff;
  515. --markdown-markdown-horizontal-rule: #ffffff;
  516. --markdown-markdown-list-item: #ffffff;
  517. --markdown-markdown-list-enumeration: #ffffff;
  518. --markdown-markdown-image: #ffffff;
  519. --markdown-markdown-image-text: #ffffff;
  520. --markdown-markdown-code-block: #ffffff;
  521. }
  522. }