theme.css 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627
  1. :root {
  2. --font-family-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  3. --font-family-sans--font-feature-settings: normal;
  4. --font-family-mono:
  5. ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  6. --font-family-mono--font-feature-settings: normal;
  7. --font-size-small: 13px;
  8. --font-size-base: 14px;
  9. --font-size-large: 16px;
  10. --font-size-x-large: 20px;
  11. --font-weight-regular: 400;
  12. --font-weight-medium: 500;
  13. --line-height-normal: 130%;
  14. --line-height-large: 150%;
  15. --line-height-x-large: 180%;
  16. --line-height-2x-large: 200%;
  17. --letter-spacing-normal: 0;
  18. --letter-spacing-tight: -0.1599999964237213;
  19. --letter-spacing-tightest: -0.3199999928474426;
  20. --paragraph-spacing-base: 0;
  21. --spacing: 0.25rem;
  22. --breakpoint-sm: 40rem;
  23. --breakpoint-md: 48rem;
  24. --breakpoint-lg: 64rem;
  25. --breakpoint-xl: 80rem;
  26. --breakpoint-2xl: 96rem;
  27. --container-3xs: 16rem;
  28. --container-2xs: 18rem;
  29. --container-xs: 20rem;
  30. --container-sm: 24rem;
  31. --container-md: 28rem;
  32. --container-lg: 32rem;
  33. --container-xl: 36rem;
  34. --container-2xl: 42rem;
  35. --container-3xl: 48rem;
  36. --container-4xl: 56rem;
  37. --container-5xl: 64rem;
  38. --container-6xl: 72rem;
  39. --container-7xl: 80rem;
  40. --radius-xs: 0.125rem;
  41. --radius-sm: 0.25rem;
  42. --radius-md: 0.375rem;
  43. --radius-lg: 0.5rem;
  44. --radius-xl: 0.625rem;
  45. --shadow-xs:
  46. 0 1px 2px -0.5px light-dark(hsl(0 0% 0% / 0.04), hsl(0 0% 0% / 0.06)),
  47. 0 0.5px 1.5px 0 light-dark(hsl(0 0% 0% / 0.025), hsl(0 0% 0% / 0.08)),
  48. 0 1px 3px 0 light-dark(hsl(0 0% 0% / 0.05), hsl(0 0% 0% / 0.1));
  49. --shadow-md:
  50. 0 6px 12px -2px light-dark(hsl(0 0% 0% / 0.075), hsl(0 0% 0% / 0.1)),
  51. 0 4px 8px -2px light-dark(hsl(0 0% 0% / 0.075), hsl(0 0% 0% / 0.15)),
  52. 0 1px 2px light-dark(hsl(0 0% 0% / 0.1), hsl(0 0% 0% / 0.15));
  53. --shadow-lg:
  54. 0 16px 48px -6px light-dark(hsl(0 0% 0% / 0.05), hsl(0 0% 0% / 0.15)),
  55. 0 6px 12px -2px light-dark(hsl(0 0% 0% / 0.025), hsl(0 0% 0% / 0.1)),
  56. 0 1px 2.5px light-dark(hsl(0 0% 0% / 0.025), hsl(0 0% 0% / 0.1));
  57. --shadow-xxs-border: 0 0 0 0.5px var(--border-weak-base, rgba(0, 0, 0, 0.07));
  58. --shadow-xs-border:
  59. 0 0 0 1px var(--border-base, rgba(11, 6, 0, 0.2)), 0 1px 2px -1px rgba(19, 16, 16, 0.04),
  60. 0 1px 2px 0 rgba(19, 16, 16, 0.06), 0 1px 3px 0 rgba(19, 16, 16, 0.08);
  61. --shadow-xs-border-base:
  62. 0 0 0 1px var(--border-weak-base, rgba(17, 0, 0, 0.12)), 0 1px 2px -1px rgba(19, 16, 16, 0.04),
  63. 0 1px 2px 0 rgba(19, 16, 16, 0.06), 0 1px 3px 0 rgba(19, 16, 16, 0.08);
  64. --shadow-xs-border-select:
  65. 0 0 0 3px var(--border-weak-selected, rgba(1, 103, 255, 0.29)),
  66. 0 0 0 1px var(--border-selected, rgba(0, 74, 255, 0.99)), 0 1px 2px -1px rgba(19, 16, 16, 0.25),
  67. 0 1px 2px 0 rgba(19, 16, 16, 0.08), 0 1px 3px 0 rgba(19, 16, 16, 0.12);
  68. --shadow-xs-border-focus:
  69. 0 0 0 1px var(--border-base, rgba(11, 6, 0, 0.2)), 0 1px 2px -1px rgba(19, 16, 16, 0.25),
  70. 0 1px 2px 0 rgba(19, 16, 16, 0.08), 0 1px 3px 0 rgba(19, 16, 16, 0.12), 0 0 0 2px var(--background-weak, #f1f0f0),
  71. 0 0 0 3px var(--border-selected, rgba(0, 74, 255, 0.99));
  72. --shadow-xs-border-hover:
  73. 0 0 0 1px var(--border-weak-selected, rgba(0, 112, 255, 0.22)), 0 1px 2px -1px rgba(19, 16, 16, 0.04),
  74. 0 1px 2px 0 rgba(19, 16, 16, 0.06), 0 1px 3px 0 rgba(19, 16, 16, 0.08);
  75. --shadow-xs-border-critical-base: 0 0 0 1px var(--border-critical-selected, #fc543a);
  76. --shadow-xs-border-critical-focus:
  77. 0 0 0 3px var(--border-critical-weak, rgba(251, 34, 0, 0.18)), 0 0 0 1px var(--border-critical-selected, #fc543a),
  78. 0 1px 2px -1px rgba(19, 16, 16, 0.25), 0 1px 2px 0 rgba(19, 16, 16, 0.08), 0 1px 3px 0 rgba(19, 16, 16, 0.12);
  79. --shadow-lg-border-base:
  80. 0 0 0 1px var(--border-weak-base, rgba(0, 0, 0, 0.07)), 0 36px 80px 0 rgba(0, 0, 0, 0.03),
  81. 0 13.141px 29.201px 0 rgba(0, 0, 0, 0.04), 0 6.38px 14.177px 0 rgba(0, 0, 0, 0.05),
  82. 0 3.127px 6.95px 0 rgba(0, 0, 0, 0.06), 0 1.237px 2.748px 0 rgba(0, 0, 0, 0.09);
  83. color-scheme: light;
  84. --text-mix-blend-mode: multiply;
  85. /* OC-2 fallback variables (light) */
  86. --background-base: #f8f8f8;
  87. --background-weak: #f3f3f3;
  88. --background-strong: #fcfcfc;
  89. --background-stronger: #fcfcfc;
  90. --surface-base: rgba(0, 0, 0, 0.031);
  91. --base: rgba(0, 0, 0, 0.034);
  92. --surface-base-hover: rgba(0, 0, 0, 0.059);
  93. --surface-base-active: rgba(0, 0, 0, 0.051);
  94. --surface-base-interactive-active: rgba(3, 76, 255, 0.09);
  95. --base2: rgba(0, 0, 0, 0.034);
  96. --base3: rgba(0, 0, 0, 0.034);
  97. --surface-inset-base: rgba(0, 0, 0, 0.034);
  98. --surface-inset-base-hover: rgba(0, 0, 0, 0.055);
  99. --surface-inset-strong: rgba(0, 0, 0, 0.09);
  100. --surface-inset-strong-hover: rgba(0, 0, 0, 0.09);
  101. --surface-raised-base: rgba(0, 0, 0, 0.031);
  102. --surface-float-base: #161616;
  103. --surface-float-base-hover: #1c1c1c;
  104. --surface-raised-base-hover: rgba(0, 0, 0, 0.051);
  105. --surface-raised-base-active: rgba(0, 0, 0, 0.09);
  106. --surface-raised-strong: #fcfcfc;
  107. --surface-raised-strong-hover: #ffffff;
  108. --surface-raised-stronger: #ffffff;
  109. --surface-raised-stronger-hover: #ffffff;
  110. --surface-weak: rgba(0, 0, 0, 0.051);
  111. --surface-weaker: rgba(0, 0, 0, 0.071);
  112. --surface-strong: #ffffff;
  113. --surface-stronger-non-alpha: var(--surface-raised-stronger-non-alpha);
  114. --surface-raised-stronger-non-alpha: #ffffff;
  115. --surface-brand-base: #dcde8d;
  116. --surface-brand-hover: #d0d283;
  117. --surface-interactive-base: #ecf3ff;
  118. --surface-interactive-hover: #e0eaff;
  119. --surface-interactive-weak: #f7faff;
  120. --surface-interactive-weak-hover: #ecf3ff;
  121. --surface-success-base: #dbfed7;
  122. --surface-success-weak: #f0feee;
  123. --surface-success-strong: #12c905;
  124. --surface-warning-base: #fcf3cb;
  125. --surface-warning-weak: #fdfaec;
  126. --surface-warning-strong: #fbdd46;
  127. --surface-critical-base: #fff2f0;
  128. --surface-critical-weak: #fff8f6;
  129. --surface-critical-strong: #fc533a;
  130. --surface-info-base: #fdecfe;
  131. --surface-info-weak: #fef7ff;
  132. --surface-info-strong: #a753ae;
  133. --surface-diff-unchanged-base: #ffffff00;
  134. --surface-diff-skip-base: #f8f8f8;
  135. --surface-diff-hidden-base: #eaf4ff;
  136. --surface-diff-hidden-weak: #f6faff;
  137. --surface-diff-hidden-weaker: #fbfdff;
  138. --surface-diff-hidden-strong: #cae3ff;
  139. --surface-diff-hidden-stronger: #2090f5;
  140. --surface-diff-add-base: #e3fae1;
  141. --surface-diff-add-weak: #f4fcf3;
  142. --surface-diff-add-weaker: #fbfefb;
  143. --surface-diff-add-strong: #c2eebf;
  144. --surface-diff-add-stronger: #9ff29a;
  145. --surface-diff-delete-base: #feefeb;
  146. --surface-diff-delete-weak: #fff8f6;
  147. --surface-diff-delete-weaker: #fffcfb;
  148. --surface-diff-delete-strong: #fdc3b7;
  149. --surface-diff-delete-stronger: #fc533a;
  150. --input-base: #fcfcfc;
  151. --input-hover: #f8f8f8;
  152. --input-active: #fcfdff;
  153. --input-selected: #e0eaff;
  154. --input-focus: #fcfdff;
  155. --input-disabled: #ededed;
  156. --text-base: #6f6f6f;
  157. --text-weak: #8f8f8f;
  158. --text-weaker: #c7c7c7;
  159. --text-strong: #171717;
  160. --text-invert-base: #f8f8f8;
  161. --text-invert-weak: #f3f3f3;
  162. --text-invert-weaker: #ededed;
  163. --text-invert-strong: #fcfcfc;
  164. --text-interactive-base: #034cff;
  165. --text-on-brand-base: rgba(0, 0, 0, 0.574);
  166. --text-on-interactive-base: #fcfcfc;
  167. --text-on-interactive-weak: rgba(0, 0, 0, 0.574);
  168. --text-on-success-base: #2dba26;
  169. --text-on-critical-base: #ed4831;
  170. --text-on-critical-weak: #fe806a;
  171. --text-on-critical-strong: #601a0f;
  172. --text-on-warning-base: rgba(0, 0, 0, 0.574);
  173. --text-on-info-base: rgba(0, 0, 0, 0.574);
  174. --text-diff-add-base: #3a8437;
  175. --text-diff-delete-base: #ed4831;
  176. --text-diff-delete-strong: #601a0f;
  177. --text-diff-add-strong: #1d3e1c;
  178. --text-on-info-weak: rgba(0, 0, 0, 0.453);
  179. --text-on-info-strong: rgba(0, 0, 0, 0.915);
  180. --text-on-warning-weak: rgba(0, 0, 0, 0.453);
  181. --text-on-warning-strong: rgba(0, 0, 0, 0.915);
  182. --text-on-success-weak: #96ec8e;
  183. --text-on-success-strong: #044202;
  184. --text-on-brand-weak: rgba(0, 0, 0, 0.453);
  185. --text-on-brand-weaker: rgba(0, 0, 0, 0.232);
  186. --text-on-brand-strong: rgba(0, 0, 0, 0.915);
  187. --button-primary-base: #171717;
  188. --button-secondary-base: #fcfcfc;
  189. --button-secondary-hover: #f8f8f8;
  190. --button-ghost-hover: rgba(0, 0, 0, 0.031);
  191. --button-ghost-hover2: rgba(0, 0, 0, 0.051);
  192. --border-base: rgba(0, 0, 0, 0.162);
  193. --border-hover: rgba(0, 0, 0, 0.236);
  194. --border-active: rgba(0, 0, 0, 0.46);
  195. --border-selected: rgba(3, 76, 255, 0.99);
  196. --border-disabled: rgba(0, 0, 0, 0.236);
  197. --border-focus: rgba(0, 0, 0, 0.46);
  198. --border-weak-base: #e5e5e5;
  199. --border-strong-base: rgba(0, 0, 0, 0.151);
  200. --border-strong-hover: rgba(0, 0, 0, 0.232);
  201. --border-strong-active: rgba(0, 0, 0, 0.151);
  202. --border-strong-selected: rgba(3, 76, 255, 0.31);
  203. --border-strong-disabled: rgba(0, 0, 0, 0.118);
  204. --border-strong-focus: rgba(0, 0, 0, 0.151);
  205. --border-weak-hover: rgba(0, 0, 0, 0.118);
  206. --border-weak-active: rgba(0, 0, 0, 0.151);
  207. --border-weak-selected: rgba(3, 76, 255, 0.24);
  208. --border-weak-disabled: rgba(0, 0, 0, 0.118);
  209. --border-weak-focus: rgba(0, 0, 0, 0.151);
  210. --border-weaker-base: #f0f0f0;
  211. --border-weaker-hover: rgba(0, 0, 0, 0.075);
  212. --border-weaker-active: rgba(0, 0, 0, 0.118);
  213. --border-weaker-selected: rgba(3, 76, 255, 0.16);
  214. --border-weaker-disabled: rgba(0, 0, 0, 0.034);
  215. --border-weaker-focus: rgba(0, 0, 0, 0.118);
  216. --border-interactive-base: #a3c1fd;
  217. --border-interactive-hover: #7ea9ff;
  218. --border-interactive-active: #034cff;
  219. --border-interactive-selected: #034cff;
  220. --border-interactive-disabled: #c7c7c7;
  221. --border-interactive-focus: #034cff;
  222. --border-success-base: #96ec8e;
  223. --border-success-hover: #7add71;
  224. --border-success-selected: #12c905;
  225. --border-warning-base: #e8d479;
  226. --border-warning-hover: #d8c158;
  227. --border-warning-selected: #fbdd46;
  228. --border-critical-base: #fdc3b7;
  229. --border-critical-hover: #ffa796;
  230. --border-critical-selected: #fc533a;
  231. --border-info-base: #f4bdf8;
  232. --border-info-hover: #e6a8ea;
  233. --border-info-selected: #a753ae;
  234. --border-color: #ffffff;
  235. --icon-base: #8f8f8f;
  236. --icon-hover: #6f6f6f;
  237. --icon-active: #171717;
  238. --icon-selected: #171717;
  239. --icon-disabled: #c7c7c7;
  240. --icon-focus: #171717;
  241. --icon-invert-base: #ffffff;
  242. --icon-weak-base: #dbdbdb;
  243. --icon-weak-hover: #c7c7c7;
  244. --icon-weak-active: #8f8f8f;
  245. --icon-weak-selected: #858585;
  246. --icon-weak-disabled: #e2e2e2;
  247. --icon-weak-focus: #8f8f8f;
  248. --icon-strong-base: #171717;
  249. --icon-strong-hover: #151313;
  250. --icon-strong-active: #020202;
  251. --icon-strong-selected: #020202;
  252. --icon-strong-disabled: #c7c7c7;
  253. --icon-strong-focus: #020202;
  254. --icon-brand-base: #171717;
  255. --icon-interactive-base: #034cff;
  256. --icon-success-base: #7add71;
  257. --icon-success-hover: #4cc944;
  258. --icon-success-active: #078901;
  259. --icon-warning-base: #ebb76e;
  260. --icon-warning-hover: #da9e40;
  261. --icon-warning-active: #95671b;
  262. --icon-critical-base: #ed4831;
  263. --icon-critical-hover: #ca2d17;
  264. --icon-critical-active: #601a0f;
  265. --icon-info-base: #e6a8ea;
  266. --icon-info-hover: #d58cda;
  267. --icon-info-active: #9b4da1;
  268. --icon-on-brand-base: rgba(0, 0, 0, 0.574);
  269. --icon-on-brand-hover: rgba(0, 0, 0, 0.915);
  270. --icon-on-brand-selected: rgba(0, 0, 0, 0.915);
  271. --icon-on-interactive-base: #fcfcfc;
  272. --icon-agent-plan-base: #a753ae;
  273. --icon-agent-docs-base: #fcb239;
  274. --icon-agent-ask-base: #2090f5;
  275. --icon-agent-build-base: #034cff;
  276. --v2-agent-plan-solid: var(--v2-pink-900);
  277. --v2-agent-plan-border: rgba(200, 61, 139, 0.5);
  278. --v2-agent-plan-background: rgba(253, 236, 243, 0.33);
  279. --v2-agent-build-solid: var(--v2-blue-900);
  280. --v2-agent-build-border: rgba(59, 92, 246, 0.5);
  281. --v2-agent-build-background: rgba(236, 241, 254, 0.33);
  282. --v2-agent-explore-solid: var(--v2-yellow-900);
  283. --v2-agent-explore-border: rgba(142, 114, 49, 0.5);
  284. --v2-agent-explore-background: rgba(254, 250, 236, 0.33);
  285. --icon-on-success-base: rgba(18, 201, 5, 0.9);
  286. --icon-on-success-hover: rgba(45, 186, 38, 0.9);
  287. --icon-on-success-selected: rgba(7, 137, 1, 0.9);
  288. --icon-on-warning-base: rgba(252, 178, 57, 0.9);
  289. --icon-on-warning-hover: rgba(239, 167, 46, 0.9);
  290. --icon-on-warning-selected: rgba(149, 103, 27, 0.9);
  291. --icon-on-critical-base: rgba(252, 83, 58, 0.9);
  292. --icon-on-critical-hover: rgba(237, 72, 49, 0.9);
  293. --icon-on-critical-selected: rgba(202, 45, 23, 0.9);
  294. --icon-on-info-base: #a753ae;
  295. --icon-on-info-hover: rgba(155, 73, 162, 0.9);
  296. --icon-on-info-selected: rgba(155, 77, 161, 0.9);
  297. --icon-diff-add-base: #3a8437;
  298. --icon-diff-add-hover: #1d3e1c;
  299. --icon-diff-add-active: #1d3e1c;
  300. --icon-diff-delete-base: #ed4831;
  301. --icon-diff-delete-hover: #ca2d17;
  302. --icon-diff-modified-base: #ff8c00;
  303. --syntax-comment: var(--text-weak);
  304. --syntax-regexp: var(--text-base);
  305. --syntax-string: #006656;
  306. --syntax-keyword: var(--text-weak);
  307. --syntax-primitive: #fb4804;
  308. --syntax-operator: var(--text-base);
  309. --syntax-variable: var(--text-strong);
  310. --syntax-property: #ed6dc8;
  311. --syntax-type: #596600;
  312. --syntax-constant: #007b80;
  313. --syntax-punctuation: var(--text-base);
  314. --syntax-object: var(--text-strong);
  315. --syntax-success: #2dba26;
  316. --syntax-warning: #efa72e;
  317. --syntax-critical: #ed4831;
  318. --syntax-info: #0092a8;
  319. --syntax-diff-add: #3a8437;
  320. --syntax-diff-delete: #ca2d17;
  321. --syntax-diff-unknown: #ff0000;
  322. --markdown-heading: #d68c27;
  323. --markdown-text: #1a1a1a;
  324. --markdown-link: #3b7dd8;
  325. --markdown-link-text: #318795;
  326. --markdown-code: #3d9a57;
  327. --markdown-block-quote: #b0851f;
  328. --markdown-emph: #b0851f;
  329. --markdown-strong: #d68c27;
  330. --markdown-horizontal-rule: #8a8a8a;
  331. --markdown-list-item: #3b7dd8;
  332. --markdown-list-enumeration: #318795;
  333. --markdown-image: #3b7dd8;
  334. --markdown-image-text: #318795;
  335. --markdown-code-block: #1a1a1a;
  336. --avatar-background-pink: #feeef8;
  337. --avatar-background-mint: #e1fbf4;
  338. --avatar-background-orange: #fff1e7;
  339. --avatar-background-purple: #f9f1fe;
  340. --avatar-background-cyan: #e7f9fb;
  341. --avatar-background-lime: #eefadc;
  342. --avatar-text-pink: #cd1d8d;
  343. --avatar-text-mint: #147d6f;
  344. --avatar-text-orange: #ed5f00;
  345. --avatar-text-purple: #8445bc;
  346. --avatar-text-cyan: #0894b3;
  347. --avatar-text-lime: #5d770d;
  348. --text-stronger: #171717;
  349. @media (prefers-color-scheme: dark) {
  350. color-scheme: dark;
  351. --text-mix-blend-mode: plus-lighter;
  352. /* OC-2 fallback variables (dark) */
  353. --background-base: #101010;
  354. --background-weak: #1e1e1e;
  355. --background-strong: #121212;
  356. --background-stronger: #151515;
  357. --surface-base: rgba(255, 255, 255, 0.031);
  358. --base: rgba(255, 255, 255, 0.034);
  359. --surface-base-hover: rgba(255, 255, 255, 0.039);
  360. --surface-base-active: rgba(255, 255, 255, 0.059);
  361. --surface-base-interactive-active: rgba(3, 76, 255, 0.125);
  362. --base2: rgba(255, 255, 255, 0.034);
  363. --base3: rgba(255, 255, 255, 0.034);
  364. --surface-inset-base: rgba(0, 0, 0, 0.5);
  365. --surface-inset-base-hover: rgba(0, 0, 0, 0.5);
  366. --surface-inset-strong: rgba(0, 0, 0, 0.8);
  367. --surface-inset-strong-hover: rgba(0, 0, 0, 0.8);
  368. --surface-raised-base: rgba(255, 255, 255, 0.059);
  369. --surface-float-base: #161616;
  370. --surface-float-base-hover: #1c1c1c;
  371. --surface-raised-base-hover: rgba(255, 255, 255, 0.078);
  372. --surface-raised-base-active: rgba(255, 255, 255, 0.102);
  373. --surface-raised-strong: rgba(255, 255, 255, 0.078);
  374. --surface-raised-strong-hover: rgba(255, 255, 255, 0.129);
  375. --surface-raised-stronger: rgba(255, 255, 255, 0.129);
  376. --surface-raised-stronger-hover: rgba(255, 255, 255, 0.169);
  377. --surface-weak: rgba(255, 255, 255, 0.078);
  378. --surface-weaker: rgba(255, 255, 255, 0.102);
  379. --surface-strong: rgba(255, 255, 255, 0.169);
  380. --surface-stronger-non-alpha: var(--surface-raised-stronger-non-alpha);
  381. --surface-raised-stronger-non-alpha: #1c1c1c;
  382. --surface-brand-base: #fab283;
  383. --surface-brand-hover: #eda779;
  384. --surface-interactive-base: #091f52;
  385. --surface-interactive-hover: #091f52;
  386. --surface-interactive-weak: #0b1730;
  387. --surface-interactive-weak-hover: #ecf3ff;
  388. --surface-success-base: #062d04;
  389. --surface-success-weak: #0a1e08;
  390. --surface-success-strong: #12c905;
  391. --surface-warning-base: #fdf3cf;
  392. --surface-warning-weak: #fdfaed;
  393. --surface-warning-strong: #fcd53a;
  394. --surface-critical-base: #1f0603;
  395. --surface-critical-weak: #28110c;
  396. --surface-critical-strong: #fc533a;
  397. --surface-info-base: #feecfe;
  398. --surface-info-weak: #fdf7fe;
  399. --surface-info-strong: #edb2f1;
  400. --surface-diff-unchanged-base: #161616;
  401. --surface-diff-skip-base: #00000000;
  402. --surface-diff-hidden-base: #0c1928;
  403. --surface-diff-hidden-weak: #09131d;
  404. --surface-diff-hidden-weaker: #082542;
  405. --surface-diff-hidden-strong: #073966;
  406. --surface-diff-hidden-stronger: #8ec2fc;
  407. --surface-diff-add-base: #1a2919;
  408. --surface-diff-add-weak: #1f351e;
  409. --surface-diff-add-weaker: #1a2919;
  410. --surface-diff-add-strong: #264024;
  411. --surface-diff-add-stronger: #9bcd97;
  412. --surface-diff-delete-base: #42120b;
  413. --surface-diff-delete-weak: #580f06;
  414. --surface-diff-delete-weaker: #42120b;
  415. --surface-diff-delete-strong: #6a1206;
  416. --surface-diff-delete-stronger: #faa494;
  417. --input-base: #1c1c1c;
  418. --input-hover: #1c1c1c;
  419. --input-active: #091123;
  420. --input-selected: #0b1730;
  421. --input-focus: #091123;
  422. --input-disabled: #282828;
  423. --text-base: rgba(255, 255, 255, 0.618);
  424. --text-weak: rgba(255, 255, 255, 0.422);
  425. --text-weaker: rgba(255, 255, 255, 0.284);
  426. --text-strong: rgba(255, 255, 255, 0.936);
  427. --text-invert-base: #a0a0a0;
  428. --text-invert-weak: #707070;
  429. --text-invert-weaker: #505050;
  430. --text-invert-strong: #ededed;
  431. --text-interactive-base: #9dbefe;
  432. --text-on-brand-base: rgba(255, 255, 255, 0.603);
  433. --text-on-interactive-base: #ededed;
  434. --text-on-interactive-weak: rgba(255, 255, 255, 0.603);
  435. --text-on-success-base: #12c905;
  436. --text-on-critical-base: #fc533a;
  437. --text-on-critical-weak: #b72d1a;
  438. --text-on-critical-strong: #ffe0da;
  439. --text-on-warning-base: rgba(255, 255, 255, 0.603);
  440. --text-on-info-base: rgba(255, 255, 255, 0.603);
  441. --text-diff-add-base: #9bcd97;
  442. --text-diff-delete-base: #fc533a;
  443. --text-diff-delete-strong: #ffe0da;
  444. --text-diff-add-strong: #4a7348;
  445. --text-on-info-weak: rgba(255, 255, 255, 0.404);
  446. --text-on-info-strong: rgba(255, 255, 255, 0.928);
  447. --text-on-warning-weak: rgba(255, 255, 255, 0.404);
  448. --text-on-warning-strong: rgba(255, 255, 255, 0.928);
  449. --text-on-success-weak: #127d0d;
  450. --text-on-success-strong: #bafdb3;
  451. --text-on-brand-weak: rgba(255, 255, 255, 0.404);
  452. --text-on-brand-weaker: rgba(255, 255, 255, 0.266);
  453. --text-on-brand-strong: rgba(255, 255, 255, 0.928);
  454. --button-primary-base: #ededed;
  455. --button-secondary-base: #1c1c1c;
  456. --button-secondary-hover: rgba(255, 255, 255, 0.039);
  457. --button-ghost-hover: rgba(255, 255, 255, 0.031);
  458. --button-ghost-hover2: rgba(255, 255, 255, 0.059);
  459. --border-base: rgba(255, 255, 255, 0.195);
  460. --border-hover: rgba(255, 255, 255, 0.284);
  461. --border-active: rgba(255, 255, 255, 0.418);
  462. --border-selected: #9dbefe;
  463. --border-disabled: rgba(255, 255, 255, 0.284);
  464. --border-focus: rgba(255, 255, 255, 0.418);
  465. --border-weak-base: #282828;
  466. --border-strong-base: rgba(255, 255, 255, 0.266);
  467. --border-strong-hover: rgba(255, 255, 255, 0.266);
  468. --border-strong-active: rgba(255, 255, 255, 0.266);
  469. --border-strong-selected: rgba(3, 76, 255, 0.62);
  470. --border-strong-disabled: rgba(255, 255, 255, 0.138);
  471. --border-strong-focus: rgba(255, 255, 255, 0.266);
  472. --border-weak-hover: rgba(255, 255, 255, 0.181);
  473. --border-weak-active: rgba(255, 255, 255, 0.266);
  474. --border-weak-selected: rgba(3, 76, 255, 0.62);
  475. --border-weak-disabled: rgba(255, 255, 255, 0.138);
  476. --border-weak-focus: rgba(255, 255, 255, 0.266);
  477. --border-weaker-base: #202020;
  478. --border-weaker-hover: rgba(255, 255, 255, 0.084);
  479. --border-weaker-active: rgba(255, 255, 255, 0.138);
  480. --border-weaker-selected: rgba(3, 76, 255, 0.32);
  481. --border-weaker-disabled: rgba(255, 255, 255, 0.034);
  482. --border-weaker-focus: rgba(255, 255, 255, 0.138);
  483. --border-interactive-base: #a3c1fd;
  484. --border-interactive-hover: #7ea9ff;
  485. --border-interactive-active: #034cff;
  486. --border-interactive-selected: #034cff;
  487. --border-interactive-disabled: #505050;
  488. --border-interactive-focus: #034cff;
  489. --border-success-base: #96ec8e;
  490. --border-success-hover: #7add71;
  491. --border-success-selected: #12c905;
  492. --border-warning-base: #e9d282;
  493. --border-warning-hover: #dac063;
  494. --border-warning-selected: #fcd53a;
  495. --border-critical-base: #6a1206;
  496. --border-critical-hover: #952414;
  497. --border-critical-selected: #fc533a;
  498. --border-info-base: #eac5ec;
  499. --border-info-hover: #dab1dd;
  500. --border-info-selected: #edb2f1;
  501. --border-color: #ffffff;
  502. --icon-base: #7e7e7e;
  503. --icon-hover: #a0a0a0;
  504. --icon-active: #ededed;
  505. --icon-selected: #ededed;
  506. --icon-disabled: #3e3e3e;
  507. --icon-focus: #ededed;
  508. --icon-invert-base: #161616;
  509. --icon-weak-base: #343434;
  510. --icon-weak-hover: #d9d9d9;
  511. --icon-weak-active: #c8c8c8;
  512. --icon-weak-selected: #707070;
  513. --icon-weak-disabled: #ededed;
  514. --icon-weak-focus: #707070;
  515. --icon-strong-base: #ededed;
  516. --icon-strong-hover: #f6f3f3;
  517. --icon-strong-active: #fcfcfc;
  518. --icon-strong-selected: #fdfcfc;
  519. --icon-strong-disabled: #3e3e3e;
  520. --icon-strong-focus: #fdfcfc;
  521. --icon-brand-base: #ffffff;
  522. --icon-interactive-base: #034cff;
  523. --icon-success-base: #12c905;
  524. --icon-success-hover: #35c02d;
  525. --icon-success-active: #4de144;
  526. --icon-warning-base: #fbb73c;
  527. --icon-warning-hover: #885e08;
  528. --icon-warning-active: #f1b13f;
  529. --icon-critical-base: #fc533a;
  530. --icon-critical-hover: #faa494;
  531. --icon-critical-active: #ffe0da;
  532. --icon-info-base: #68446b;
  533. --icon-info-hover: #815484;
  534. --icon-info-active: #dfa7e3;
  535. --icon-on-brand-base: rgba(255, 255, 255, 0.603);
  536. --icon-on-brand-hover: rgba(255, 255, 255, 0.928);
  537. --icon-on-brand-selected: rgba(255, 255, 255, 0.928);
  538. --icon-on-interactive-base: #ededed;
  539. --icon-agent-plan-base: #edb2f1;
  540. --icon-agent-docs-base: #fbb73c;
  541. --icon-agent-ask-base: #2090f5;
  542. --icon-agent-build-base: #9dbefe;
  543. --v2-agent-plan-solid: var(--v2-pink-400);
  544. --v2-agent-plan-border: rgba(250, 188, 216, 0.5);
  545. --v2-agent-plan-background: rgba(247, 213, 228, 0.1);
  546. --v2-agent-build-solid: var(--v2-blue-400);
  547. --v2-agent-build-border: rgba(215, 226, 252, 0.5);
  548. --v2-agent-build-background: rgba(215, 226, 252, 0.1);
  549. --v2-agent-explore-solid: var(--v2-yellow-400);
  550. --v2-agent-explore-border: rgba(247, 229, 181, 0.5);
  551. --v2-agent-explore-background: rgba(252, 239, 208, 0.1);
  552. --icon-on-success-base: rgba(18, 201, 5, 0.9);
  553. --icon-on-success-hover: rgba(53, 192, 45, 0.9);
  554. --icon-on-success-selected: rgba(77, 225, 68, 0.9);
  555. --icon-on-warning-base: rgba(251, 183, 60, 0.9);
  556. --icon-on-warning-hover: rgba(245, 178, 56, 0.9);
  557. --icon-on-warning-selected: rgba(241, 177, 63, 0.9);
  558. --icon-on-critical-base: rgba(252, 83, 58, 0.9);
  559. --icon-on-critical-hover: rgba(245, 79, 54, 0.9);
  560. --icon-on-critical-selected: rgba(250, 164, 148, 0.9);
  561. --icon-on-info-base: #edb2f1;
  562. --icon-on-info-hover: rgba(231, 173, 235, 0.9);
  563. --icon-on-info-selected: rgba(223, 167, 227, 0.9);
  564. --icon-diff-add-base: #9bcd97;
  565. --icon-diff-add-hover: #c3f9bf;
  566. --icon-diff-add-active: #9bcd97;
  567. --icon-diff-delete-base: #fc533a;
  568. --icon-diff-delete-hover: #f54f36;
  569. --icon-diff-modified-base: #ffba92;
  570. --syntax-comment: var(--text-weak);
  571. --syntax-regexp: var(--text-base);
  572. --syntax-string: #00ceb9;
  573. --syntax-keyword: var(--text-weak);
  574. --syntax-primitive: #ffba92;
  575. --syntax-operator: var(--text-weak);
  576. --syntax-variable: var(--text-strong);
  577. --syntax-property: #ff9ae2;
  578. --syntax-type: #ecf58c;
  579. --syntax-constant: #93e9f6;
  580. --syntax-punctuation: var(--text-weak);
  581. --syntax-object: var(--text-strong);
  582. --syntax-success: #35c02d;
  583. --syntax-warning: #f5b238;
  584. --syntax-critical: #f54f36;
  585. --syntax-info: #93e9f6;
  586. --syntax-diff-add: #9bcd97;
  587. --syntax-diff-delete: #faa494;
  588. --syntax-diff-unknown: #ff0000;
  589. --markdown-heading: #9d7cd8;
  590. --markdown-text: #eeeeee;
  591. --markdown-link: #fab283;
  592. --markdown-link-text: #56b6c2;
  593. --markdown-code: #7fd88f;
  594. --markdown-block-quote: #e5c07b;
  595. --markdown-emph: #e5c07b;
  596. --markdown-strong: #f5a742;
  597. --markdown-horizontal-rule: #808080;
  598. --markdown-list-item: #fab283;
  599. --markdown-list-enumeration: #56b6c2;
  600. --markdown-image: #fab283;
  601. --markdown-image-text: #56b6c2;
  602. --markdown-code-block: #eeeeee;
  603. --avatar-background-pink: #501b3f;
  604. --avatar-background-mint: #033a34;
  605. --avatar-background-orange: #5f2a06;
  606. --avatar-background-purple: #432155;
  607. --avatar-background-cyan: #0f3058;
  608. --avatar-background-lime: #2b3711;
  609. --avatar-text-pink: #e34ba9;
  610. --avatar-text-mint: #95f3d9;
  611. --avatar-text-orange: #ff802b;
  612. --avatar-text-purple: #9d5bd2;
  613. --avatar-text-cyan: #369eff;
  614. --avatar-text-lime: #c4f042;
  615. --text-stronger: rgba(255, 255, 255, 0.936);
  616. }
  617. }