@vireo-ai/trellis-ui 0.1.25 → 0.1.29

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 (195) hide show
  1. package/package.json +6 -1
  2. package/packages/client/src/components/checkbox/styles.css +7 -0
  3. package/packages/client/src/components/radio/styles.css +2 -8
  4. package/packages/client/src/styles/components.css +1 -0
  5. package/packages/client/src/styles/generated/theme-fonts.css +1 -1
  6. package/packages/client/src/styles/generated/theme-palette.css +7 -4
  7. package/packages/client/src/styles/generated/theme-runtime.css +1791 -452
  8. package/packages/client/src/styles/generated-sources.css +1 -1
  9. package/packages/client/src/styles/theme.css +161 -43
  10. package/packages/client/types/assets/full-runtime.generated.d.ts +1 -1
  11. package/packages/client/types/capabilities/motion.entry.generated.d.ts +3 -0
  12. package/packages/client/types/capabilities/resizable.entry.generated.d.ts +3 -0
  13. package/packages/client/types/capabilities/sortable.entry.generated.d.ts +3 -0
  14. package/packages/client/types/component-api.d.ts +10 -10
  15. package/packages/client/types/components/accordion/index.d.ts +7 -4
  16. package/packages/client/types/components/accordion/machine.d.ts +51 -57
  17. package/packages/client/types/components/card/contract.d.ts +9 -3
  18. package/packages/client/types/components/checkbox/contract.d.ts +20 -10
  19. package/packages/client/types/components/common.d.ts +6 -1
  20. package/packages/client/types/components/date-picker/index.d.ts +7 -4
  21. package/packages/client/types/components/date-picker/machine.d.ts +46 -362
  22. package/packages/client/types/components/dropdown/index.d.ts +7 -4
  23. package/packages/client/types/components/dropdown/machine.d.ts +5 -67
  24. package/packages/client/types/components/field/index.d.ts +1 -2
  25. package/packages/client/types/components/file-upload/index.d.ts +7 -4
  26. package/packages/client/types/components/file-upload/machine.d.ts +17 -39
  27. package/packages/client/types/components/input/index.d.ts +1 -2
  28. package/packages/client/types/components/modal/index.d.ts +6 -2
  29. package/packages/client/types/components/modal/machine.d.ts +5 -103
  30. package/packages/client/types/components/panels/index.d.ts +6 -2
  31. package/packages/client/types/components/panels/machine.d.ts +59 -81
  32. package/packages/client/types/components/radio/contract.d.ts +10 -2
  33. package/packages/client/types/components/runtime.d.ts +10 -10
  34. package/packages/client/types/components/scroll-area/index.d.ts +1 -2
  35. package/packages/client/types/components/select/index.d.ts +7 -4
  36. package/packages/client/types/components/select/machine.d.ts +37 -331
  37. package/packages/client/types/components/sidebar/index.d.ts +6 -2
  38. package/packages/client/types/components/sidebar/machine.d.ts +11 -47
  39. package/packages/client/types/components/slider/index.d.ts +1 -2
  40. package/packages/client/types/components/switch/index.d.ts +1 -2
  41. package/packages/client/types/components/tabs/contract.d.ts +6 -2
  42. package/packages/client/types/components/tabs/index.d.ts +7 -4
  43. package/packages/client/types/components/tabs/machine.d.ts +11 -29
  44. package/packages/client/types/components/toast/index.d.ts +6 -2
  45. package/packages/client/types/components/toast/machine.d.ts +7 -66
  46. package/packages/client/types/core.d.ts +2 -2
  47. package/packages/client/types/runtime/alpine-data.d.ts +6 -0
  48. package/packages/client/types/runtime/alpine-machine.d.ts +3 -8
  49. package/packages/client/types/runtime/engine/request.d.ts +1 -0
  50. package/packages/client/types/runtime/index.d.ts +7 -3
  51. package/packages/client/types/runtime/transition-coordinator.d.ts +41 -7
  52. package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.css +2226 -512
  53. package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.min.css +1 -1
  54. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/build-metadata.json +488 -372
  55. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/motion.js +2 -0
  56. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/motion.js.map +1 -0
  57. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/resizable.js +2 -0
  58. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/resizable.js.map +1 -0
  59. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/sortable.js +2 -0
  60. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/sortable.js.map +1 -0
  61. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/alpine-data-DZ17j0jc.js +2 -0
  62. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/alpine-data-DZ17j0jc.js.map +1 -0
  63. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/alpine-machine-D0Kqjm-1.js +2 -0
  64. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/alpine-machine-D0Kqjm-1.js.map +1 -0
  65. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/capability-motion-Cog7tKk0.js +2 -0
  66. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/capability-motion-Cog7tKk0.js.map +1 -0
  67. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/capability-resizable-C6LKIbpv.js +2 -0
  68. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/capability-resizable-C6LKIbpv.js.map +1 -0
  69. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/capability-sortable-k107A8WE.js +3 -0
  70. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/capability-sortable-k107A8WE.js.map +1 -0
  71. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{common-DAxHCzB-.js → common-BOd_thC-.js} +2 -2
  72. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{common-DAxHCzB-.js.map → common-BOd_thC-.js.map} +1 -1
  73. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/core-vW9Cglw8.js +2 -0
  74. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{core-DjoX4J-6.js.map → core-vW9Cglw8.js.map} +1 -1
  75. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/drag-and-drop-BV6kB47L.js +2 -0
  76. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/drag-and-drop-BV6kB47L.js.map +1 -0
  77. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Bbm6qhVl.js +2 -0
  78. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Bbm6qhVl.js.map +1 -0
  79. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BgnZZd0A.js +2 -0
  80. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BgnZZd0A.js.map +1 -0
  81. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BhPEF6oz.js +2 -0
  82. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-xcXw-cEl.js.map → entry.generated-BhPEF6oz.js.map} +1 -1
  83. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Bhvs_TUM.js +2 -0
  84. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Bhvs_TUM.js.map +1 -0
  85. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CGgRCeB5.js +2 -0
  86. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CGgRCeB5.js.map +1 -0
  87. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CgO0b8V6.js +2 -0
  88. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CgO0b8V6.js.map +1 -0
  89. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Cvgc61x9.js +2 -0
  90. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Cvgc61x9.js.map +1 -0
  91. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DFITIl56.js +2 -0
  92. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DFITIl56.js.map +1 -0
  93. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DMK37KS0.js +2 -0
  94. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DMK37KS0.js.map +1 -0
  95. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DMre0DbH.js +2 -0
  96. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DMre0DbH.js.map +1 -0
  97. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DOV8BDMY.js +2 -0
  98. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DOV8BDMY.js.map +1 -0
  99. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DT70Lo44.js +2 -0
  100. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DT70Lo44.js.map +1 -0
  101. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DVPnOfPb.js +2 -0
  102. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DVPnOfPb.js.map +1 -0
  103. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DiG5fS1F.js +2 -0
  104. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DiG5fS1F.js.map +1 -0
  105. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DnSxEcns.js +2 -0
  106. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DnSxEcns.js.map +1 -0
  107. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-JnbQA47P.js +2 -0
  108. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-JnbQA47P.js.map +1 -0
  109. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-byAFfb_v.js +2 -0
  110. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-byAFfb_v.js.map +1 -0
  111. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-dTc38DPe.js +2 -0
  112. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-dTc38DPe.js.map +1 -0
  113. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/machine-Dqut4h89.js +2 -0
  114. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/machine-Dqut4h89.js.map +1 -0
  115. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/motion-BRaHJwNf.js +3 -0
  116. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/motion-BRaHJwNf.js.map +1 -0
  117. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/semantic-observer-DS2ew4dT.js +2 -0
  118. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{semantic-observer-9VxzbQBi.js.map → semantic-observer-DS2ew4dT.js.map} +1 -1
  119. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/stream-uyKKe0QF.js +4 -0
  120. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/stream-uyKKe0QF.js.map +1 -0
  121. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/ui-H3t7UHMs.js +2 -0
  122. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/ui-H3t7UHMs.js.map +1 -0
  123. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/accordion.js +1 -1
  124. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/checkbox.js +1 -1
  125. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/date-picker.js +1 -1
  126. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/dropdown.js +1 -1
  127. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/field.js +1 -1
  128. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/file-upload.js +1 -1
  129. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/index.js +2 -1
  130. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/index.js.map +1 -0
  131. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/input.js +1 -1
  132. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/modal.js +1 -1
  133. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/panels.js +1 -1
  134. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/radio.js +1 -1
  135. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/scroll-area.js +1 -1
  136. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/select.js +1 -1
  137. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/sidebar.js +1 -1
  138. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/slider.js +1 -1
  139. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/switch.js +1 -1
  140. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/table.js +1 -1
  141. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/tabs.js +1 -1
  142. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/toast.js +1 -1
  143. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/core.js +1 -1
  144. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/index.js +1 -1
  145. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/index.js.map +1 -1
  146. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/logical-entry-manifest.json +232 -127
  147. package/packages/server/trellis_ui/static/trellis_ui/assets/js/trellis.js +9 -9
  148. package/packages/server/trellis_ui/static/trellis_ui/assets/js/trellis.min.js +9 -9
  149. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/core-DjoX4J-6.js +0 -2
  150. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-5kNpQFGr.js +0 -2
  151. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-5kNpQFGr.js.map +0 -1
  152. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-B85L90Qp.js +0 -2
  153. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-B85L90Qp.js.map +0 -1
  154. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BGCM6LAW.js +0 -2
  155. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BGCM6LAW.js.map +0 -1
  156. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Bc-uE56r.js +0 -2
  157. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Bc-uE56r.js.map +0 -1
  158. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-C6ldtrmy.js +0 -2
  159. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-C6ldtrmy.js.map +0 -1
  160. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CPWoMIwn.js +0 -2
  161. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CPWoMIwn.js.map +0 -1
  162. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Co0bLLZE.js +0 -2
  163. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Co0bLLZE.js.map +0 -1
  164. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CtyXH8zf.js +0 -2
  165. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CtyXH8zf.js.map +0 -1
  166. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DGrOItIx.js +0 -2
  167. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DGrOItIx.js.map +0 -1
  168. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DHMRhcYF.js +0 -2
  169. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DHMRhcYF.js.map +0 -1
  170. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-De12QrT5.js +0 -3
  171. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-De12QrT5.js.map +0 -1
  172. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DgmqZx_W.js +0 -2
  173. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DgmqZx_W.js.map +0 -1
  174. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Dn6MRCe0.js +0 -2
  175. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-Dn6MRCe0.js.map +0 -1
  176. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DoOgk6l4.js +0 -2
  177. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DoOgk6l4.js.map +0 -1
  178. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DxUOcPkU.js +0 -2
  179. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DxUOcPkU.js.map +0 -1
  180. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DyIjCOhT.js +0 -2
  181. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-DyIjCOhT.js.map +0 -1
  182. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-K6qKowpw.js +0 -2
  183. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-K6qKowpw.js.map +0 -1
  184. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-oAIExc1V.js +0 -2
  185. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-oAIExc1V.js.map +0 -1
  186. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-xcXw-cEl.js +0 -2
  187. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/machine-CX3wFSoV.js +0 -2
  188. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/machine-CX3wFSoV.js.map +0 -1
  189. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/motion-Bpttk6iZ.js +0 -3
  190. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/motion-Bpttk6iZ.js.map +0 -1
  191. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/resizable-BixtYF9M.js +0 -2
  192. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/resizable-BixtYF9M.js.map +0 -1
  193. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/semantic-observer-9VxzbQBi.js +0 -2
  194. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/ui-xTjuF3uC.js +0 -4
  195. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/ui-xTjuF3uC.js.map +0 -1
package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.css CHANGED
@@ -202,6 +202,7 @@
202
202
  --text-13: 128px;
203
203
  --text-13--line-height: 132px;
204
204
  --text-13--letter-spacing: -0.045em;
205
+ --label-ink-emphasis: 35%;
205
206
  --text-body: var(--text-2);
206
207
  --text-body--line-height: var(--text-2--line-height);
207
208
  --text-body--letter-spacing: var(--text-2--letter-spacing);
@@ -261,7 +262,7 @@
261
262
  --text-label--line-height: var(--text-2--line-height);
262
263
  --text-label--letter-spacing: var(--text-2--letter-spacing);
263
264
  --font-label: var(--font-sans);
264
- --font-weight-label: var(--font-weight-medium);
265
+ --font-weight-label: var(--font-weight-normal);
265
266
  --text-description: var(--text-2);
266
267
  --text-description--line-height: var(--text-2--line-height);
267
268
  --text-description--letter-spacing: var(--text-2--letter-spacing);
@@ -379,8 +380,7 @@
379
380
  --spacing-panel-6: 640px;
380
381
  --spacing-panel-6-max: 768px;
381
382
  --spacing-icon: var(--spacing-icon-md);
382
- --color-separator: transparent;
383
- --color-separator-muted: transparent;
383
+ --color-separator: var(--ui-surface-separator);
384
384
  --color-intent-accent-text: transparent;
385
385
  --color-intent-accent-text-hover: transparent;
386
386
  --color-intent-accent-soft: transparent;
@@ -412,7 +412,6 @@
412
412
  --color-intent-danger-edge-strong: transparent;
413
413
  --color-intent-danger-focus: transparent;
414
414
  --color-intent-neutral-text: transparent;
415
- --color-intent-neutral-text-hover: transparent;
416
415
  --color-intent-neutral-soft: transparent;
417
416
  --color-intent-neutral-soft-hover: transparent;
418
417
  --color-intent-neutral-soft-pressed: transparent;
@@ -491,6 +490,60 @@
491
490
  --color-surface-8: transparent;
492
491
  --color-surface-8-ink: transparent;
493
492
  --color-surface-8-ink-muted: transparent;
493
+ --color-surface-workspace-0: transparent;
494
+ --color-surface-workspace-0-ink: transparent;
495
+ --color-surface-workspace-0-ink-muted: transparent;
496
+ --color-surface-workspace-1: transparent;
497
+ --color-surface-workspace-1-ink: transparent;
498
+ --color-surface-workspace-1-ink-muted: transparent;
499
+ --color-surface-workspace-2: transparent;
500
+ --color-surface-workspace-2-ink: transparent;
501
+ --color-surface-workspace-2-ink-muted: transparent;
502
+ --color-surface-workspace-3: transparent;
503
+ --color-surface-workspace-3-ink: transparent;
504
+ --color-surface-workspace-3-ink-muted: transparent;
505
+ --color-surface-workspace-4: transparent;
506
+ --color-surface-workspace-4-ink: transparent;
507
+ --color-surface-workspace-4-ink-muted: transparent;
508
+ --color-surface-workspace-5: transparent;
509
+ --color-surface-workspace-5-ink: transparent;
510
+ --color-surface-workspace-5-ink-muted: transparent;
511
+ --color-surface-workspace-6: transparent;
512
+ --color-surface-workspace-6-ink: transparent;
513
+ --color-surface-workspace-6-ink-muted: transparent;
514
+ --color-surface-workspace-7: transparent;
515
+ --color-surface-workspace-7-ink: transparent;
516
+ --color-surface-workspace-7-ink-muted: transparent;
517
+ --color-surface-workspace-8: transparent;
518
+ --color-surface-workspace-8-ink: transparent;
519
+ --color-surface-workspace-8-ink-muted: transparent;
520
+ --color-surface-chrome-0: transparent;
521
+ --color-surface-chrome-0-ink: transparent;
522
+ --color-surface-chrome-0-ink-muted: transparent;
523
+ --color-surface-chrome-1: transparent;
524
+ --color-surface-chrome-1-ink: transparent;
525
+ --color-surface-chrome-1-ink-muted: transparent;
526
+ --color-surface-chrome-2: transparent;
527
+ --color-surface-chrome-2-ink: transparent;
528
+ --color-surface-chrome-2-ink-muted: transparent;
529
+ --color-surface-chrome-3: transparent;
530
+ --color-surface-chrome-3-ink: transparent;
531
+ --color-surface-chrome-3-ink-muted: transparent;
532
+ --color-surface-chrome-4: transparent;
533
+ --color-surface-chrome-4-ink: transparent;
534
+ --color-surface-chrome-4-ink-muted: transparent;
535
+ --color-surface-chrome-5: transparent;
536
+ --color-surface-chrome-5-ink: transparent;
537
+ --color-surface-chrome-5-ink-muted: transparent;
538
+ --color-surface-chrome-6: transparent;
539
+ --color-surface-chrome-6-ink: transparent;
540
+ --color-surface-chrome-6-ink-muted: transparent;
541
+ --color-surface-chrome-7: transparent;
542
+ --color-surface-chrome-7-ink: transparent;
543
+ --color-surface-chrome-7-ink-muted: transparent;
544
+ --color-surface-chrome-8: transparent;
545
+ --color-surface-chrome-8-ink: transparent;
546
+ --color-surface-chrome-8-ink-muted: transparent;
494
547
  --shadow-elevation-0: none;
495
548
  --shadow-elevation-1: none;
496
549
  --shadow-elevation-2: none;
@@ -2597,7 +2650,7 @@
2597
2650
  border-color: var(--color-neutral-a12);
2598
2651
  }
2599
2652
  .border-separator {
2600
- border-color: var(--color-separator);
2653
+ border-color: var(--ui-surface-separator);
2601
2654
  }
2602
2655
  .border-surface-0 {
2603
2656
  border-color: var(--color-surface-0);
@@ -2786,13 +2839,13 @@
2786
2839
  background-color: var(--color-scrim);
2787
2840
  }
2788
2841
  .bg-scrollbar-thumb {
2789
- background-color: var(--color-intent-neutral-edge);
2842
+ background-color: var(--ui-surface-edge);
2790
2843
  }
2791
2844
  .bg-separator {
2792
- background-color: var(--color-separator);
2845
+ background-color: var(--ui-surface-separator);
2793
2846
  }
2794
2847
  .bg-separator-muted {
2795
- background-color: var(--color-separator-muted);
2848
+ background-color: var(--ui-surface-separator-muted);
2796
2849
  }
2797
2850
  .bg-surface {
2798
2851
  background-color: var(--ui-surface-color);
@@ -3871,6 +3924,9 @@
3871
3924
  .text-intent-danger-text {
3872
3925
  color: var(--color-intent-danger-text);
3873
3926
  }
3927
+ .text-label-ink {
3928
+ color: var(--ui-label-ink);
3929
+ }
3874
3930
  .text-neutral-1 {
3875
3931
  color: var(--color-neutral-1);
3876
3932
  }
@@ -4022,6 +4078,10 @@
4022
4078
  .opacity-75 {
4023
4079
  opacity: 75%;
4024
4080
  }
4081
+ .shadow-\[0_0_0_var\(--border-width-edge-control\)_var\(--ui-surface-edge\)\] {
4082
+ --tw-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
4083
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4084
+ }
4025
4085
  .shadow-elevation-0 {
4026
4086
  --tw-shadow: none;
4027
4087
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -4059,7 +4119,7 @@
4059
4119
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4060
4120
  }
4061
4121
  .ui-edge {
4062
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge);
4122
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
4063
4123
  }
4064
4124
  .ring-accent-1 {
4065
4125
  --tw-ring-color: var(--color-accent-1);
@@ -4240,6 +4300,9 @@
4240
4300
  -webkit-user-select: none;
4241
4301
  user-select: none;
4242
4302
  }
4303
+ .\[--ui-interaction-rest-edge\:var\(--ui-surface-edge\)\] {
4304
+ --ui-interaction-rest-edge: var(--ui-surface-edge);
4305
+ }
4243
4306
  .\[--ui-sidebar-drawer-elevation\:var\(--shadow-elevation-0\)\] {
4244
4307
  --ui-sidebar-drawer-elevation: var(--shadow-elevation-0);
4245
4308
  }
@@ -4450,7 +4513,7 @@
4450
4513
  .hover\:bg-scrollbar-thumb-hover {
4451
4514
  &:hover {
4452
4515
  @media (hover: hover) {
4453
- background-color: var(--color-intent-neutral-edge-hover);
4516
+ background-color: var(--ui-surface-edge-hover);
4454
4517
  }
4455
4518
  }
4456
4519
  }
@@ -4476,6 +4539,16 @@
4476
4539
  box-shadow: inset 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
4477
4540
  }
4478
4541
  }
4542
+ .active\:bg-interaction-pressed {
4543
+ &:active {
4544
+ background-color: var(--color-interaction-pressed);
4545
+ }
4546
+ }
4547
+ .has-\[\:focus-visible\]\:ui-focus-ring {
4548
+ &:has(*:is(:focus-visible)) {
4549
+ box-shadow: 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
4550
+ }
4551
+ }
4479
4552
  .data-checked\:translate-x-switch-travel-lg {
4480
4553
  &[data-checked] {
4481
4554
  --tw-translate-x: var(--spacing-switch-travel-lg);
@@ -4544,7 +4617,7 @@
4544
4617
  }
4545
4618
  .data-dragging\:bg-scrollbar-thumb-hover {
4546
4619
  &[data-dragging] {
4547
- background-color: var(--color-intent-neutral-edge-hover);
4620
+ background-color: var(--ui-surface-edge-hover);
4548
4621
  }
4549
4622
  }
4550
4623
  .data-indeterminate\:opacity-100 {
@@ -4552,6 +4625,22 @@
4552
4625
  opacity: 100%;
4553
4626
  }
4554
4627
  }
4628
+ .data-invalid\:shadow-\[0_0_0_var\(--border-width-edge-control\)_var\(--color-intent-danger-edge\)\] {
4629
+ &[data-invalid] {
4630
+ --tw-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge);
4631
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4632
+ }
4633
+ }
4634
+ .data-invalid\:hover\:shadow-\[0_0_0_var\(--border-width-edge-control\)_var\(--color-intent-danger-edge-hover\)\] {
4635
+ &[data-invalid] {
4636
+ &:hover {
4637
+ @media (hover: hover) {
4638
+ --tw-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge-hover);
4639
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4640
+ }
4641
+ }
4642
+ }
4643
+ }
4555
4644
  .data-resizing\:border-intent-neutral-edge-strong {
4556
4645
  &[data-resizing] {
4557
4646
  border-color: var(--color-intent-neutral-edge-strong);
@@ -4932,6 +5021,11 @@
4932
5021
  }
4933
5022
  }
4934
5023
  }
5024
+ .\[\&_\[data-ui-checkbox-indicator\]\]\:hidden {
5025
+ & [data-ui-checkbox-indicator] {
5026
+ display: none;
5027
+ }
5028
+ }
4935
5029
  .data-\[placement\=top\]\:data-\[responsive-mode\=desktop\]\:\[\&_\[data-ui-sidebar-content-inner\]\]\:flex {
4936
5030
  &[data-placement="top"] {
4937
5031
  &[data-responsive-mode="desktop"] {
@@ -5193,7 +5287,7 @@
5193
5287
  }
5194
5288
  .\[\&_\[data-ui-table-row\]\>\*\]\:border-separator {
5195
5289
  & [data-ui-table-row]>* {
5196
- border-color: var(--color-separator);
5290
+ border-color: var(--ui-surface-separator);
5197
5291
  }
5198
5292
  }
5199
5293
  .\[\&_\[data-ui-table-row\]\>\*\+\*\]\:border-l-edge-separator {
@@ -5526,6 +5620,7 @@
5526
5620
  --font-weight-medium: 500;
5527
5621
  --font-weight-semibold: 600;
5528
5622
  --font-weight-bold: 700;
5623
+ --label-ink-emphasis: 35%;
5529
5624
  --text-body: var(--text-2);
5530
5625
  --text-body--line-height: var(--text-2--line-height);
5531
5626
  --text-body--letter-spacing: var(--text-2--letter-spacing);
@@ -5587,7 +5682,7 @@
5587
5682
  --text-label--line-height: var(--text-2--line-height);
5588
5683
  --text-label--letter-spacing: var(--text-2--letter-spacing);
5589
5684
  --font-label: var(--font-sans);
5590
- --font-weight-label: var(--font-weight-medium);
5685
+ --font-weight-label: var(--font-weight-normal);
5591
5686
  --text-description: var(--text-2);
5592
5687
  --text-description--line-height: var(--text-2--line-height);
5593
5688
  --text-description--letter-spacing: var(--text-2--letter-spacing);
@@ -5918,6 +6013,7 @@
5918
6013
  --font-weight-medium: 500;
5919
6014
  --font-weight-semibold: 600;
5920
6015
  --font-weight-bold: 700;
6016
+ --label-ink-emphasis: 35%;
5921
6017
  --text-body: var(--text-2);
5922
6018
  --text-body--line-height: var(--text-2--line-height);
5923
6019
  --text-body--letter-spacing: var(--text-2--letter-spacing);
@@ -5979,7 +6075,7 @@
5979
6075
  --text-label--line-height: var(--text-2--line-height);
5980
6076
  --text-label--letter-spacing: var(--text-2--letter-spacing);
5981
6077
  --font-label: var(--font-sans);
5982
- --font-weight-label: var(--font-weight-medium);
6078
+ --font-weight-label: var(--font-weight-normal);
5983
6079
  --text-description: var(--text-2);
5984
6080
  --text-description--line-height: var(--text-2--line-height);
5985
6081
  --text-description--letter-spacing: var(--text-2--letter-spacing);
@@ -7476,6 +7572,7 @@
7476
7572
  --font-weight-medium: 500;
7477
7573
  --font-weight-semibold: 600;
7478
7574
  --font-weight-bold: 700;
7575
+ --label-ink-emphasis: 35%;
7479
7576
  --text-body: var(--text-2);
7480
7577
  --text-body--line-height: var(--text-2--line-height);
7481
7578
  --text-body--letter-spacing: var(--text-2--letter-spacing);
@@ -7537,7 +7634,7 @@
7537
7634
  --text-label--line-height: var(--text-2--line-height);
7538
7635
  --text-label--letter-spacing: var(--text-2--letter-spacing);
7539
7636
  --font-label: var(--font-sans);
7540
- --font-weight-label: var(--font-weight-medium);
7637
+ --font-weight-label: var(--font-weight-normal);
7541
7638
  --text-description: var(--text-2);
7542
7639
  --text-description--line-height: var(--text-2--line-height);
7543
7640
  --text-description--letter-spacing: var(--text-2--letter-spacing);
@@ -7868,6 +7965,7 @@
7868
7965
  --font-weight-medium: 500;
7869
7966
  --font-weight-semibold: 600;
7870
7967
  --font-weight-bold: 700;
7968
+ --label-ink-emphasis: 35%;
7871
7969
  --text-body: var(--text-2);
7872
7970
  --text-body--line-height: var(--text-2--line-height);
7873
7971
  --text-body--letter-spacing: var(--text-2--letter-spacing);
@@ -7929,7 +8027,7 @@
7929
8027
  --text-label--line-height: var(--text-2--line-height);
7930
8028
  --text-label--letter-spacing: var(--text-2--letter-spacing);
7931
8029
  --font-label: var(--font-sans);
7932
- --font-weight-label: var(--font-weight-medium);
8030
+ --font-weight-label: var(--font-weight-normal);
7933
8031
  --text-description: var(--text-2);
7934
8032
  --text-description--line-height: var(--text-2--line-height);
7935
8033
  --text-description--letter-spacing: var(--text-2--letter-spacing);
@@ -8164,69 +8262,205 @@
8164
8262
  --color-intent-warning-edge-strong: oklch(49.23687% 0.104461 73.787219 / 0.469);
8165
8263
  --color-intent-warning-focus: oklch(71.848357% 0.119477 84.129977 / 0.42);
8166
8264
  --color-intent-warning-focus-width: 3px;
8167
- --background-interaction-selection-accent: oklch(50.756307% 0.185449 257.696372 / 0.115167);
8168
- --background-interaction-selection-accent-hover: oklch(50.756307% 0.185449 257.696372 / 0.161989);
8265
+ --background-interaction-selection-accent: oklch(50.756307% 0.185449 257.696372 / 0.118811);
8266
+ --background-interaction-selection-accent-hover: oklch(50.756307% 0.185449 257.696372 / 0.167052);
8169
8267
  --color-interaction-selection-accent-ink: oklch(55.25987% 0.16965 252.857709 / 1);
8170
- --background-interaction-selection-danger: oklch(50.734487% 0.20819 29.23388 / 0.116544);
8171
- --background-interaction-selection-danger-hover: oklch(50.734487% 0.20819 29.23388 / 0.163881);
8268
+ --background-interaction-selection-danger: oklch(50.734487% 0.20819 29.23388 / 0.120444);
8269
+ --background-interaction-selection-danger-hover: oklch(50.734487% 0.20819 29.23388 / 0.169286);
8172
8270
  --color-interaction-selection-danger-ink: oklch(56.831333% 0.171879 23.02606 / 1);
8173
- --background-interaction-selection-information: oklch(50.756307% 0.185449 257.696372 / 0.115167);
8174
- --background-interaction-selection-information-hover: oklch(50.756307% 0.185449 257.696372 / 0.161989);
8271
+ --background-interaction-selection-information: oklch(50.756307% 0.185449 257.696372 / 0.118811);
8272
+ --background-interaction-selection-information-hover: oklch(50.756307% 0.185449 257.696372 / 0.167052);
8175
8273
  --color-interaction-selection-information-ink: oklch(55.25987% 0.16965 252.857709 / 1);
8176
- --background-interaction-selection-neutral: oklch(0% 0 none / 0.074218);
8177
- --background-interaction-selection-neutral-hover: oklch(0% 0 none / 0.116935);
8274
+ --background-interaction-selection-neutral: oklch(0% 0 none / 0.0761);
8275
+ --background-interaction-selection-neutral-hover: oklch(0% 0 none / 0.119852);
8178
8276
  --color-interaction-selection-neutral-ink: oklch(18% 0 none / 1);
8179
- --background-interaction-selection-success: oklch(48.174496% 0.14582 146.334155 / 0.115826);
8180
- --background-interaction-selection-success-hover: oklch(48.174496% 0.14582 146.334155 / 0.162912);
8277
+ --background-interaction-selection-success: oklch(48.174496% 0.14582 146.334155 / 0.119873);
8278
+ --background-interaction-selection-success-hover: oklch(48.174496% 0.14582 146.334155 / 0.168532);
8181
8279
  --color-interaction-selection-success-ink: oklch(53.50073% 0.118126 157.679534 / 1);
8182
- --background-interaction-selection-warning: oklch(51.857569% 0.108211 77.702583 / 0.119976);
8183
- --background-interaction-selection-warning-hover: oklch(51.857569% 0.108211 77.702583 / 0.168755);
8280
+ --background-interaction-selection-warning: oklch(51.857569% 0.108211 77.702583 / 0.124597);
8281
+ --background-interaction-selection-warning-hover: oklch(51.857569% 0.108211 77.702583 / 0.175179);
8184
8282
  --color-interaction-selection-warning-ink: oklch(55.666518% 0.115491 79.432947 / 1);
8185
8283
  --color-interaction-hover: oklch(75.985345% 0.0417 42.653991 / 0.035);
8186
8284
  --color-interaction-pressed: oklch(61.752131% 0.03464 319.944721 / 0.055);
8187
- --color-interaction-selected: oklch(50.756307% 0.185449 257.696372 / 0.115167);
8188
- --color-interaction-selected-hover: oklch(50.756307% 0.185449 257.696372 / 0.161989);
8285
+ --color-interaction-selected: oklch(50.756307% 0.185449 257.696372 / 0.118811);
8286
+ --color-interaction-selected-hover: oklch(50.756307% 0.185449 257.696372 / 0.167052);
8287
+ --color-interaction-edge-hover: oklch(75.985345% 0.0417 42.653991 / 0.035);
8288
+ --color-interaction-edge-pressed: oklch(61.752131% 0.03464 319.944721 / 0.055);
8289
+ --color-interaction-edge-selected: oklch(50.756307% 0.185449 257.696372 / 0.118811);
8290
+ --color-interaction-edge-selected-hover: oklch(50.756307% 0.185449 257.696372 / 0.167052);
8189
8291
  --opacity-interaction-disabled: 0.5;
8190
8292
  --color-interaction-disabled: oklch(75.985345% 0.0417 42.653991 / 0.043);
8191
8293
  --color-interaction-disabled-edge: oklch(0% 0 none / 0.294);
8192
8294
  --color-interaction-disabled-ink: var(--ui-surface-ink-muted);
8193
8295
  --color-scrim: oklch(12.382253% 0 none / 0.35);
8296
+ --color-substrate-workspace: oklch(98.510365% 0 none / 1);
8297
+ --color-substrate-workspace-ink: oklch(20.93472% 0 none / 1);
8298
+ --color-substrate-workspace-ink-muted: oklch(55.779494% 0 none / 1);
8299
+ --color-surface-workspace-0: oklch(98.510365% 0 none / 1);
8300
+ --color-surface-workspace-0-ink: oklch(20.93472% 0 none / 1);
8301
+ --color-surface-workspace-0-ink-muted: oklch(55.779494% 0 none / 1);
8302
+ --color-surface-workspace-0-edge: oklch(95.51204% 0.001003 48.821037 / 1);
8303
+ --color-surface-workspace-0-edge-hover: oklch(94.010893% 0.000706 226.904518 / 1);
8304
+ --color-surface-workspace-0-edge-strong: oklch(92.510344% 0 none / 1);
8305
+ --shadow-depth-workspace-0: 0 0 0 0 transparent;
8306
+ --color-surface-workspace-1: oklch(99.110365% 0 none / 1);
8307
+ --color-surface-workspace-1-ink: oklch(21.693184% 0 none / 1);
8308
+ --color-surface-workspace-1-ink-muted: oklch(56.194798% 0 none / 1);
8309
+ --color-surface-workspace-1-edge: oklch(96.111969% 0.000982 48.819123 / 1);
8310
+ --color-surface-workspace-1-edge-hover: oklch(94.610885% 0.000692 226.905723 / 1);
8311
+ --color-surface-workspace-1-edge-strong: oklch(93.110343% 0 none / 1);
8312
+ --shadow-depth-workspace-1: 0 0 0 0 transparent;
8313
+ --color-surface-workspace-2: oklch(100% 0 none / 1);
8314
+ --color-surface-workspace-2-ink: oklch(22.74366% 0 none / 1);
8315
+ --color-surface-workspace-2-ink-muted: oklch(56.808564% 0 none / 1);
8316
+ --color-surface-workspace-2-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8317
+ --color-surface-workspace-2-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8318
+ --color-surface-workspace-2-edge-strong: oklch(93.999998% 0 none / 1);
8319
+ --shadow-depth-workspace-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06);
8320
+ --color-surface-workspace-3: oklch(100% 0 none / 1);
8321
+ --color-surface-workspace-3-ink: oklch(22.74366% 0 none / 1);
8322
+ --color-surface-workspace-3-ink-muted: oklch(56.808564% 0 none / 1);
8323
+ --color-surface-workspace-3-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8324
+ --color-surface-workspace-3-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8325
+ --color-surface-workspace-3-edge-strong: oklch(93.999998% 0 none / 1);
8326
+ --shadow-depth-workspace-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06);
8327
+ --color-surface-workspace-4: oklch(100% 0 none / 1);
8328
+ --color-surface-workspace-4-ink: oklch(22.74366% 0 none / 1);
8329
+ --color-surface-workspace-4-ink-muted: oklch(56.808564% 0 none / 1);
8330
+ --color-surface-workspace-4-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8331
+ --color-surface-workspace-4-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8332
+ --color-surface-workspace-4-edge-strong: oklch(93.999998% 0 none / 1);
8333
+ --shadow-depth-workspace-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06);
8334
+ --color-surface-workspace-5: oklch(100% 0 none / 1);
8335
+ --color-surface-workspace-5-ink: oklch(22.74366% 0 none / 1);
8336
+ --color-surface-workspace-5-ink-muted: oklch(56.808564% 0 none / 1);
8337
+ --color-surface-workspace-5-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8338
+ --color-surface-workspace-5-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8339
+ --color-surface-workspace-5-edge-strong: oklch(93.999998% 0 none / 1);
8340
+ --shadow-depth-workspace-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06);
8341
+ --color-surface-workspace-6: oklch(100% 0 none / 1);
8342
+ --color-surface-workspace-6-ink: oklch(22.74366% 0 none / 1);
8343
+ --color-surface-workspace-6-ink-muted: oklch(56.808564% 0 none / 1);
8344
+ --color-surface-workspace-6-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8345
+ --color-surface-workspace-6-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8346
+ --color-surface-workspace-6-edge-strong: oklch(93.999998% 0 none / 1);
8347
+ --shadow-depth-workspace-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06);
8348
+ --color-surface-workspace-7: oklch(100% 0 none / 1);
8349
+ --color-surface-workspace-7-ink: oklch(22.74366% 0 none / 1);
8350
+ --color-surface-workspace-7-ink-muted: oklch(56.808564% 0 none / 1);
8351
+ --color-surface-workspace-7-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8352
+ --color-surface-workspace-7-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8353
+ --color-surface-workspace-7-edge-strong: oklch(93.999998% 0 none / 1);
8354
+ --shadow-depth-workspace-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06);
8355
+ --color-surface-workspace-8: oklch(100% 0 none / 1);
8356
+ --color-surface-workspace-8-ink: oklch(22.74366% 0 none / 1);
8357
+ --color-surface-workspace-8-ink-muted: oklch(56.808564% 0 none / 1);
8358
+ --color-surface-workspace-8-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8359
+ --color-surface-workspace-8-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8360
+ --color-surface-workspace-8-edge-strong: oklch(93.999998% 0 none / 1);
8361
+ --shadow-depth-workspace-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06), 0px 96px 96px -48px oklch(0% 0 none / 0.06);
8362
+ --color-substrate-chrome: oklch(96.010365% 0 none / 1);
8363
+ --color-substrate-chrome-ink: oklch(17.101275% 0 none / 1);
8364
+ --color-substrate-chrome-ink-muted: oklch(54.036418% 0 none / 1);
8365
+ --color-surface-chrome-0: oklch(96.010365% 0 none / 1);
8366
+ --color-surface-chrome-0-ink: oklch(17.101275% 0 none / 1);
8367
+ --color-surface-chrome-0-ink-muted: oklch(54.036418% 0 none / 1);
8368
+ --color-surface-chrome-0-edge: oklch(93.012377% 0.0011 48.82982 / 1);
8369
+ --color-surface-chrome-0-edge-hover: oklch(91.511% 0.000765 226.899059 / 1);
8370
+ --color-surface-chrome-0-edge-strong: oklch(90.010356% 0 none / 1);
8371
+ --shadow-depth-chrome-0: 0 0 0 0 transparent;
8372
+ --color-surface-chrome-1: oklch(96.610365% 0 none / 1);
8373
+ --color-surface-chrome-1-ink: oklch(18.154498% 0 none / 1);
8374
+ --color-surface-chrome-1-ink-muted: oklch(54.456699% 0 none / 1);
8375
+ --color-surface-chrome-1-edge: oklch(93.61229% 0.001076 48.827585 / 1);
8376
+ --color-surface-chrome-1-edge-hover: oklch(92.11098% 0.00075 226.900438 / 1);
8377
+ --color-surface-chrome-1-edge-strong: oklch(90.610362% 0 none / 1);
8378
+ --shadow-depth-chrome-1: 0 0 0 0 transparent;
8379
+ --color-surface-chrome-2: oklch(100% 0 none / 1);
8380
+ --color-surface-chrome-2-ink: oklch(22.74366% 0 none / 1);
8381
+ --color-surface-chrome-2-ink-muted: oklch(56.808564% 0 none / 1);
8382
+ --color-surface-chrome-2-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8383
+ --color-surface-chrome-2-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8384
+ --color-surface-chrome-2-edge-strong: oklch(93.999998% 0 none / 1);
8385
+ --shadow-depth-chrome-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06);
8386
+ --color-surface-chrome-3: oklch(100% 0 none / 1);
8387
+ --color-surface-chrome-3-ink: oklch(22.74366% 0 none / 1);
8388
+ --color-surface-chrome-3-ink-muted: oklch(56.808564% 0 none / 1);
8389
+ --color-surface-chrome-3-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8390
+ --color-surface-chrome-3-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8391
+ --color-surface-chrome-3-edge-strong: oklch(93.999998% 0 none / 1);
8392
+ --shadow-depth-chrome-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06);
8393
+ --color-surface-chrome-4: oklch(100% 0 none / 1);
8394
+ --color-surface-chrome-4-ink: oklch(22.74366% 0 none / 1);
8395
+ --color-surface-chrome-4-ink-muted: oklch(56.808564% 0 none / 1);
8396
+ --color-surface-chrome-4-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8397
+ --color-surface-chrome-4-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8398
+ --color-surface-chrome-4-edge-strong: oklch(93.999998% 0 none / 1);
8399
+ --shadow-depth-chrome-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06);
8400
+ --color-surface-chrome-5: oklch(100% 0 none / 1);
8401
+ --color-surface-chrome-5-ink: oklch(22.74366% 0 none / 1);
8402
+ --color-surface-chrome-5-ink-muted: oklch(56.808564% 0 none / 1);
8403
+ --color-surface-chrome-5-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8404
+ --color-surface-chrome-5-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8405
+ --color-surface-chrome-5-edge-strong: oklch(93.999998% 0 none / 1);
8406
+ --shadow-depth-chrome-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06);
8407
+ --color-surface-chrome-6: oklch(100% 0 none / 1);
8408
+ --color-surface-chrome-6-ink: oklch(22.74366% 0 none / 1);
8409
+ --color-surface-chrome-6-ink-muted: oklch(56.808564% 0 none / 1);
8410
+ --color-surface-chrome-6-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8411
+ --color-surface-chrome-6-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8412
+ --color-surface-chrome-6-edge-strong: oklch(93.999998% 0 none / 1);
8413
+ --shadow-depth-chrome-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06);
8414
+ --color-surface-chrome-7: oklch(100% 0 none / 1);
8415
+ --color-surface-chrome-7-ink: oklch(22.74366% 0 none / 1);
8416
+ --color-surface-chrome-7-ink-muted: oklch(56.808564% 0 none / 1);
8417
+ --color-surface-chrome-7-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8418
+ --color-surface-chrome-7-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8419
+ --color-surface-chrome-7-edge-strong: oklch(93.999998% 0 none / 1);
8420
+ --shadow-depth-chrome-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06);
8421
+ --color-surface-chrome-8: oklch(100% 0 none / 1);
8422
+ --color-surface-chrome-8-ink: oklch(22.74366% 0 none / 1);
8423
+ --color-surface-chrome-8-ink-muted: oklch(56.808564% 0 none / 1);
8424
+ --color-surface-chrome-8-edge: oklch(97.001505% 0.000951 48.81641 / 1);
8425
+ --color-surface-chrome-8-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
8426
+ --color-surface-chrome-8-edge-strong: oklch(93.999998% 0 none / 1);
8427
+ --shadow-depth-chrome-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06), 0px 96px 96px -48px oklch(0% 0 none / 0.06);
8194
8428
  --color-surface-0: oklch(98.510365% 0 none / 1);
8195
8429
  --color-surface-0-ink: oklch(20.93472% 0 none / 1);
8196
8430
  --color-surface-0-ink-muted: oklch(55.779494% 0 none / 1);
8197
- --shadow-elevation-0: 0 0 0 0 transparent;
8431
+ --shadow-elevation-0: var(--ui-local-elevation-0);
8198
8432
  --color-surface-1: oklch(99.110365% 0 none / 1);
8199
8433
  --color-surface-1-ink: oklch(21.693184% 0 none / 1);
8200
8434
  --color-surface-1-ink-muted: oklch(56.194798% 0 none / 1);
8201
- --shadow-elevation-1: 0px 0px 0px 1px oklch(0% 0 none / 0.06);
8435
+ --shadow-elevation-1: var(--ui-local-elevation-1);
8202
8436
  --color-surface-2: oklch(100% 0 none / 1);
8203
8437
  --color-surface-2-ink: oklch(22.74366% 0 none / 1);
8204
8438
  --color-surface-2-ink-muted: oklch(56.808564% 0 none / 1);
8205
- --shadow-elevation-2: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06);
8439
+ --shadow-elevation-2: var(--ui-local-elevation-2);
8206
8440
  --color-surface-3: oklch(100% 0 none / 1);
8207
8441
  --color-surface-3-ink: oklch(22.74366% 0 none / 1);
8208
8442
  --color-surface-3-ink-muted: oklch(56.808564% 0 none / 1);
8209
- --shadow-elevation-3: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06);
8443
+ --shadow-elevation-3: var(--ui-local-elevation-3);
8210
8444
  --color-surface-4: oklch(100% 0 none / 1);
8211
8445
  --color-surface-4-ink: oklch(22.74366% 0 none / 1);
8212
8446
  --color-surface-4-ink-muted: oklch(56.808564% 0 none / 1);
8213
- --shadow-elevation-4: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06);
8447
+ --shadow-elevation-4: var(--ui-local-elevation-4);
8214
8448
  --color-surface-5: oklch(100% 0 none / 1);
8215
8449
  --color-surface-5-ink: oklch(22.74366% 0 none / 1);
8216
8450
  --color-surface-5-ink-muted: oklch(56.808564% 0 none / 1);
8217
- --shadow-elevation-5: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06);
8451
+ --shadow-elevation-5: var(--ui-local-elevation-5);
8218
8452
  --color-surface-6: oklch(100% 0 none / 1);
8219
8453
  --color-surface-6-ink: oklch(22.74366% 0 none / 1);
8220
8454
  --color-surface-6-ink-muted: oklch(56.808564% 0 none / 1);
8221
- --shadow-elevation-6: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06);
8455
+ --shadow-elevation-6: var(--ui-local-elevation-6);
8222
8456
  --color-surface-7: oklch(100% 0 none / 1);
8223
8457
  --color-surface-7-ink: oklch(22.74366% 0 none / 1);
8224
8458
  --color-surface-7-ink-muted: oklch(56.808564% 0 none / 1);
8225
- --shadow-elevation-7: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06);
8459
+ --shadow-elevation-7: var(--ui-local-elevation-7);
8226
8460
  --color-surface-8: oklch(100% 0 none / 1);
8227
8461
  --color-surface-8-ink: oklch(22.74366% 0 none / 1);
8228
8462
  --color-surface-8-ink-muted: oklch(56.808564% 0 none / 1);
8229
- --shadow-elevation-8: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06), 0px 96px 96px -48px oklch(0% 0 none / 0.06);
8463
+ --shadow-elevation-8: var(--ui-local-elevation-8);
8230
8464
  }
8231
8465
  .dark {
8232
8466
  --color-separator: oklch(46.196358% 0.002178 197.081633 / 0.125);
@@ -8327,69 +8561,205 @@
8327
8561
  --color-intent-warning-edge-strong: oklch(65.04112% 0.133369 84.629105 / 0.373);
8328
8562
  --color-intent-warning-focus: oklch(56.020502% 0.113818 84.129977 / 0.42);
8329
8563
  --color-intent-warning-focus-width: 3px;
8330
- --background-interaction-selection-accent: oklch(77.631661% 0.121666 245.605952 / 0.052868);
8331
- --background-interaction-selection-accent-hover: oklch(77.631661% 0.121666 245.605952 / 0.078446);
8564
+ --background-interaction-selection-accent: oklch(77.631661% 0.121666 245.605952 / 0.058873);
8565
+ --background-interaction-selection-accent-hover: oklch(77.631661% 0.121666 245.605952 / 0.087255);
8332
8566
  --color-interaction-selection-accent-ink: oklch(75.932957% 0.129993 247.644507 / 1);
8333
- --background-interaction-selection-danger: oklch(78.425088% 0.125337 22.763785 / 0.050484);
8334
- --background-interaction-selection-danger-hover: oklch(78.425088% 0.125337 22.763785 / 0.074815);
8567
+ --background-interaction-selection-danger: oklch(78.425088% 0.125337 22.763785 / 0.056177);
8568
+ --background-interaction-selection-danger-hover: oklch(78.425088% 0.125337 22.763785 / 0.083144);
8335
8569
  --color-interaction-selection-danger-ink: oklch(76.851326% 0.136711 22.908814 / 1);
8336
- --background-interaction-selection-information: oklch(77.631661% 0.121666 245.605952 / 0.052868);
8337
- --background-interaction-selection-information-hover: oklch(77.631661% 0.121666 245.605952 / 0.078446);
8570
+ --background-interaction-selection-information: oklch(77.631661% 0.121666 245.605952 / 0.058873);
8571
+ --background-interaction-selection-information-hover: oklch(77.631661% 0.121666 245.605952 / 0.087255);
8338
8572
  --color-interaction-selection-information-ink: oklch(75.932957% 0.129993 247.644507 / 1);
8339
- --background-interaction-selection-neutral: oklch(89.093811% 0 none / 0.026409);
8340
- --background-interaction-selection-neutral-hover: oklch(89.093811% 0 none / 0.043644);
8573
+ --background-interaction-selection-neutral: oklch(89.093811% 0 none / 0.029342);
8574
+ --background-interaction-selection-neutral-hover: oklch(89.093811% 0 none / 0.048426);
8341
8575
  --color-interaction-selection-neutral-ink: oklch(86% 0 none / 1);
8342
- --background-interaction-selection-success: oklch(78.22263% 0.109703 157.679229 / 0.053901);
8343
- --background-interaction-selection-success-hover: oklch(78.22263% 0.109703 157.679229 / 0.07965);
8576
+ --background-interaction-selection-success: oklch(78.22263% 0.109703 157.679229 / 0.060166);
8577
+ --background-interaction-selection-success-hover: oklch(78.22263% 0.109703 157.679229 / 0.088788);
8344
8578
  --color-interaction-selection-success-ink: oklch(75.524628% 0.105769 157.679534 / 1);
8345
- --background-interaction-selection-warning: oklch(79.718501% 0.129813 84.141302 / 0.05001);
8346
- --background-interaction-selection-warning-hover: oklch(79.718501% 0.129813 84.141302 / 0.07376);
8579
+ --background-interaction-selection-warning: oklch(79.718501% 0.129813 84.141302 / 0.055716);
8580
+ --background-interaction-selection-warning-hover: oklch(79.718501% 0.129813 84.141302 / 0.082057);
8347
8581
  --color-interaction-selection-warning-ink: oklch(76.965573% 0.125137 84.129977 / 1);
8348
8582
  --color-interaction-hover: oklch(34.3079% 0.016055 196.427263 / 0.035);
8349
8583
  --color-interaction-pressed: oklch(46.196358% 0.002178 197.081633 / 0.055);
8350
- --color-interaction-selected: oklch(77.631661% 0.121666 245.605952 / 0.052868);
8351
- --color-interaction-selected-hover: oklch(77.631661% 0.121666 245.605952 / 0.078446);
8584
+ --color-interaction-selected: oklch(77.631661% 0.121666 245.605952 / 0.058873);
8585
+ --color-interaction-selected-hover: oklch(77.631661% 0.121666 245.605952 / 0.087255);
8586
+ --color-interaction-edge-hover: oklch(34.3079% 0.016055 196.427263 / 0.035);
8587
+ --color-interaction-edge-pressed: oklch(46.196358% 0.002178 197.081633 / 0.055);
8588
+ --color-interaction-edge-selected: oklch(77.631661% 0.121666 245.605952 / 0.058873);
8589
+ --color-interaction-edge-selected-hover: oklch(77.631661% 0.121666 245.605952 / 0.087255);
8352
8590
  --opacity-interaction-disabled: 0.5;
8353
8591
  --color-interaction-disabled: oklch(34.3079% 0.016055 196.427263 / 0.047);
8354
8592
  --color-interaction-disabled-edge: oklch(56.829515% 0.000719 197.137733 / 0.294);
8355
8593
  --color-interaction-disabled-ink: var(--ui-surface-ink-muted);
8356
8594
  --color-scrim: oklch(20.962653% 0 none / 0.55);
8595
+ --color-substrate-workspace: oklch(20.462653% 0 none / 1);
8596
+ --color-substrate-workspace-ink: oklch(92.184718% 0 none / 1);
8597
+ --color-substrate-workspace-ink-muted: oklch(76.561054% 0 none / 1);
8598
+ --color-surface-workspace-0: oklch(20.462653% 0 none / 1);
8599
+ --color-surface-workspace-0-ink: oklch(92.184718% 0 none / 1);
8600
+ --color-surface-workspace-0-ink-muted: oklch(76.561054% 0 none / 1);
8601
+ --color-surface-workspace-0-edge: oklch(23.462529% 0.000305 197.137169 / 1);
8602
+ --color-surface-workspace-0-edge-hover: oklch(24.962499% 0.000387 197.133078 / 1);
8603
+ --color-surface-workspace-0-edge-strong: oklch(26.462687% 0.000189 none / 1);
8604
+ --shadow-depth-workspace-0: 0 0 0 0 transparent;
8605
+ --color-surface-workspace-1: oklch(22.962653% 0 none / 1);
8606
+ --color-surface-workspace-1-ink: oklch(92.501588% 0 none / 1);
8607
+ --color-surface-workspace-1-ink-muted: oklch(76.93548% 0 none / 1);
8608
+ --color-surface-workspace-1-edge: oklch(25.962493% 0.000318 197.138375 / 1);
8609
+ --color-surface-workspace-1-edge-hover: oklch(27.462498% 0.000404 197.134346 / 1);
8610
+ --color-surface-workspace-1-edge-strong: oklch(28.962633% 0.000197 none / 1);
8611
+ --shadow-depth-workspace-1: 0 0 0 0 transparent;
8612
+ --color-surface-workspace-2: oklch(25.462653% 0.000386 251.779887 / 1);
8613
+ --color-surface-workspace-2-ink: oklch(92.908812% 0.000077 251.779887 / 1);
8614
+ --color-surface-workspace-2-ink-muted: oklch(77.415975% 0.000077 251.779887 / 1);
8615
+ --color-surface-workspace-2-edge: oklch(28.462523% 0.000556 222.391942 / 1);
8616
+ --color-surface-workspace-2-edge-hover: oklch(29.962519% 0.00061 217.143283 / 1);
8617
+ --color-surface-workspace-2-edge-strong: oklch(31.462634% 0.000388 226.187054 / 1);
8618
+ --shadow-depth-workspace-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.01);
8619
+ --color-surface-workspace-3: oklch(28.262653% 0.000579 251.779887 / 1);
8620
+ --color-surface-workspace-3-ink: oklch(93.477871% 0.000116 251.779887 / 1);
8621
+ --color-surface-workspace-3-ink-muted: oklch(78.08603% 0.000116 251.779887 / 1);
8622
+ --color-surface-workspace-3-edge: oklch(31.26252% 0.000707 227.458527 / 1);
8623
+ --color-surface-workspace-3-edge-hover: oklch(32.7625% 0.000745 222.113099 / 1);
8624
+ --color-surface-workspace-3-edge-strong: oklch(34.262654% 0.000508 231.447284 / 1);
8625
+ --shadow-depth-workspace-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
8626
+ --color-surface-workspace-4: oklch(31.262653% 0.000965 251.779887 / 1);
8627
+ --color-surface-workspace-4-ink: oklch(94.237603% 0.000193 251.779887 / 1);
8628
+ --color-surface-workspace-4-ink-muted: oklch(78.978204% 0.000193 251.779887 / 1);
8629
+ --color-surface-workspace-4-edge: oklch(34.262495% 0.001001 233.303998 / 1);
8630
+ --color-surface-workspace-4-edge-hover: oklch(35.76248% 0.001005 228.347129 / 1);
8631
+ --color-surface-workspace-4-edge-strong: oklch(37.262601% 0.000744 237.136646 / 1);
8632
+ --shadow-depth-workspace-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
8633
+ --color-surface-workspace-5: oklch(34.462653% 0.001351 251.779887 / 1);
8634
+ --color-surface-workspace-5-ink: oklch(95.30435% 0.00027 251.779887 / 1);
8635
+ --color-surface-workspace-5-ink-muted: oklch(80.226419% 0.00027 251.779887 / 1);
8636
+ --color-surface-workspace-5-edge: oklch(37.462422% 0.001296 235.782492 / 1);
8637
+ --color-surface-workspace-5-edge-hover: oklch(38.962419% 0.001266 231.218628 / 1);
8638
+ --color-surface-workspace-5-edge-strong: oklch(40.462488% 0.000975 239.703581 / 1);
8639
+ --shadow-depth-workspace-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
8640
+ --color-surface-workspace-6: oklch(37.862653% 0.001737 251.779887 / 1);
8641
+ --color-surface-workspace-6-ink: oklch(96.597068% 0.000347 251.779887 / 1);
8642
+ --color-surface-workspace-6-ink-muted: oklch(81.732335% 0.000347 251.779887 / 1);
8643
+ --color-surface-workspace-6-edge: oklch(40.862272% 0.001573 236.149111 / 1);
8644
+ --color-surface-workspace-6-edge-hover: oklch(42.362252% 0.001507 231.763263 / 1);
8645
+ --color-surface-workspace-6-edge-strong: oklch(43.862347% 0.00118 240.680589 / 1);
8646
+ --shadow-depth-workspace-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
8647
+ --color-surface-workspace-7: oklch(41.462653% 0.002316 251.779887 / 1);
8648
+ --color-surface-workspace-7-ink: oklch(98.092835% 0.000463 251.779887 / 1);
8649
+ --color-surface-workspace-7-ink-muted: oklch(83.46613% 0.000463 251.779887 / 1);
8650
+ --color-surface-workspace-7-edge: oklch(44.461748% 0.001909 234.987041 / 1);
8651
+ --color-surface-workspace-7-edge-hover: oklch(45.961728% 0.001786 230.699768 / 1);
8652
+ --color-surface-workspace-7-edge-strong: oklch(47.461907% 0.001423 241.125315 / 1);
8653
+ --shadow-depth-workspace-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
8654
+ --color-surface-workspace-8: oklch(45.262653% 0.002896 251.779887 / 1);
8655
+ --color-surface-workspace-8-ink: oklch(99.80618% 0.000579 251.779887 / 1);
8656
+ --color-surface-workspace-8-ink-muted: oklch(85.441382% 0.000579 251.779887 / 1);
8657
+ --color-surface-workspace-8-edge: oklch(48.259319% 0.001997 225.532443 / 1);
8658
+ --color-surface-workspace-8-edge-hover: oklch(49.759858% 0.001852 221.880992 / 1);
8659
+ --color-surface-workspace-8-edge-strong: oklch(51.26084% 0.001491 239.070665 / 1);
8660
+ --shadow-depth-workspace-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), 0px 96px 96px -48px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
8661
+ --color-substrate-chrome: oklch(22.462653% 0 none / 1);
8662
+ --color-substrate-chrome-ink: oklch(92.431093% 0 none / 1);
8663
+ --color-substrate-chrome-ink-muted: oklch(76.852224% 0 none / 1);
8664
+ --color-surface-chrome-0: oklch(22.462653% 0 none / 1);
8665
+ --color-surface-chrome-0-ink: oklch(92.431093% 0 none / 1);
8666
+ --color-surface-chrome-0-ink-muted: oklch(76.852224% 0 none / 1);
8667
+ --color-surface-chrome-0-edge: oklch(25.462509% 0.000315 197.138165 / 1);
8668
+ --color-surface-chrome-0-edge-hover: oklch(26.962476% 0.000401 197.134123 / 1);
8669
+ --color-surface-chrome-0-edge-strong: oklch(28.462668% 0.000195 none / 1);
8670
+ --shadow-depth-chrome-0: 0 0 0 0 transparent;
8671
+ --color-surface-chrome-1: oklch(24.962653% 0 none / 1);
8672
+ --color-surface-chrome-1-ink: oklch(92.819977% 0 none / 1);
8673
+ --color-surface-chrome-1-ink-muted: oklch(77.311197% 0 none / 1);
8674
+ --color-surface-chrome-1-edge: oklch(27.962487% 0.000331 197.139076 / 1);
8675
+ --color-surface-chrome-1-edge-hover: oklch(29.462476% 0.00042 197.135101 / 1);
8676
+ --color-surface-chrome-1-edge-strong: oklch(30.96262% 0.000204 none / 1);
8677
+ --shadow-depth-chrome-1: 0 0 0 0 transparent;
8678
+ --color-surface-chrome-2: oklch(27.462653% 0.000386 251.779887 / 1);
8679
+ --color-surface-chrome-2-ink: oklch(93.302555% 0.000077 251.779887 / 1);
8680
+ --color-surface-chrome-2-ink-muted: oklch(77.879753% 0.000077 251.779887 / 1);
8681
+ --color-surface-chrome-2-edge: oklch(30.462513% 0.000571 221.77183 / 1);
8682
+ --color-surface-chrome-2-edge-hover: oklch(31.962502% 0.000628 216.618278 / 1);
8683
+ --color-surface-chrome-2-edge-strong: oklch(33.462647% 0.000397 225.793124 / 1);
8684
+ --shadow-depth-chrome-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.01);
8685
+ --color-surface-chrome-3: oklch(30.262653% 0.000579 251.779887 / 1);
8686
+ --color-surface-chrome-3-ink: oklch(93.964672% 0.000116 251.779887 / 1);
8687
+ --color-surface-chrome-3-ink-muted: oklch(78.657981% 0.000116 251.779887 / 1);
8688
+ --color-surface-chrome-3-edge: oklch(33.262492% 0.000723 226.594365 / 1);
8689
+ --color-surface-chrome-3-edge-hover: oklch(34.762482% 0.000766 221.2992 / 1);
8690
+ --color-surface-chrome-3-edge-strong: oklch(36.262627% 0.000517 230.883702 / 1);
8691
+ --shadow-depth-chrome-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
8692
+ --color-surface-chrome-4: oklch(33.262653% 0.000965 251.779887 / 1);
8693
+ --color-surface-chrome-4-ink: oklch(94.876877% 0.000193 251.779887 / 1);
8694
+ --color-surface-chrome-4-ink-muted: oklch(79.72682% 0.000193 251.779887 / 1);
8695
+ --color-surface-chrome-4-edge: oklch(36.26246% 0.001017 232.202687 / 1);
8696
+ --color-surface-chrome-4-edge-hover: oklch(37.762464% 0.001024 227.196654 / 1);
8697
+ --color-surface-chrome-4-edge-strong: oklch(39.262572% 0.000749 236.454555 / 1);
8698
+ --shadow-depth-chrome-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
8699
+ --color-surface-chrome-5: oklch(36.462653% 0.001351 251.779887 / 1);
8700
+ --color-surface-chrome-5-ink: oklch(96.050221% 0.00027 251.779887 / 1);
8701
+ --color-surface-chrome-5-ink-muted: oklch(81.096153% 0.00027 251.779887 / 1);
8702
+ --color-surface-chrome-5-edge: oklch(39.462383% 0.001307 234.298071 / 1);
8703
+ --color-surface-chrome-5-edge-hover: oklch(40.962375% 0.001279 229.607436 / 1);
8704
+ --color-surface-chrome-5-edge-strong: oklch(42.462487% 0.00097 238.845262 / 1);
8705
+ --shadow-depth-chrome-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
8706
+ --color-surface-chrome-6: oklch(39.862653% 0.001737 251.779887 / 1);
8707
+ --color-surface-chrome-6-ink: oklch(97.412147% 0.000347 251.779887 / 1);
8708
+ --color-surface-chrome-6-ink-muted: oklch(82.678213% 0.000347 251.779887 / 1);
8709
+ --color-surface-chrome-6-edge: oklch(42.862164% 0.001571 233.821318 / 1);
8710
+ --color-surface-chrome-6-edge-hover: oklch(44.362153% 0.001508 229.256581 / 1);
8711
+ --color-surface-chrome-6-edge-strong: oklch(45.862305% 0.001155 239.47996 / 1);
8712
+ --shadow-depth-chrome-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
8713
+ --color-surface-chrome-7: oklch(43.462653% 0.002316 251.779887 / 1);
8714
+ --color-surface-chrome-7-ink: oklch(98.977631% 0.000463 251.779887 / 1);
8715
+ --color-surface-chrome-7-ink-muted: oklch(84.487538% 0.000463 251.779887 / 1);
8716
+ --color-surface-chrome-7-edge: oklch(46.461298% 0.001854 230.212094 / 1);
8717
+ --color-surface-chrome-7-edge-hover: oklch(47.961383% 0.001739 225.859971 / 1);
8718
+ --color-surface-chrome-7-edge-strong: oklch(49.461752% 0.001348 239.206648 / 1);
8719
+ --shadow-depth-chrome-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
8720
+ --color-surface-chrome-8: oklch(47.262653% 0.002896 251.779887 / 1);
8721
+ --color-surface-chrome-8-ink: oklch(100% 0 none / 1);
8722
+ --color-surface-chrome-8-ink-muted: oklch(86.636302% 0.000579 251.779887 / 1);
8723
+ --color-surface-chrome-8-edge: oklch(50.262655% 0.002731 251.779887 / 1);
8724
+ --color-surface-chrome-8-edge-hover: oklch(51.762631% 0.002649 251.779887 / 1);
8725
+ --color-surface-chrome-8-edge-strong: oklch(53.260215% 0.001288 234.367506 / 1);
8726
+ --shadow-depth-chrome-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), 0px 96px 96px -48px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
8357
8727
  --color-surface-0: oklch(20.462653% 0 none / 1);
8358
8728
  --color-surface-0-ink: oklch(92.184718% 0 none / 1);
8359
8729
  --color-surface-0-ink-muted: oklch(76.561054% 0 none / 1);
8360
- --shadow-elevation-0: 0 0 0 0 transparent;
8730
+ --shadow-elevation-0: var(--ui-local-elevation-0);
8361
8731
  --color-surface-1: oklch(22.962653% 0 none / 1);
8362
8732
  --color-surface-1-ink: oklch(92.501588% 0 none / 1);
8363
8733
  --color-surface-1-ink-muted: oklch(76.93548% 0 none / 1);
8364
- --shadow-elevation-1: inset 0px 0px 0px 1px oklch(100% 0 none / 0.02);
8734
+ --shadow-elevation-1: var(--ui-local-elevation-1);
8365
8735
  --color-surface-2: oklch(25.462653% 0.000386 251.779887 / 1);
8366
8736
  --color-surface-2-ink: oklch(92.908812% 0.000077 251.779887 / 1);
8367
8737
  --color-surface-2-ink-muted: oklch(77.415975% 0.000077 251.779887 / 1);
8368
- --shadow-elevation-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.01), inset 0px 0px 0px 1px oklch(100% 0 none / 0.02);
8738
+ --shadow-elevation-2: var(--ui-local-elevation-2);
8369
8739
  --color-surface-3: oklch(28.262653% 0.000579 251.779887 / 1);
8370
8740
  --color-surface-3-ink: oklch(93.477871% 0.000116 251.779887 / 1);
8371
8741
  --color-surface-3-ink-muted: oklch(78.08603% 0.000116 251.779887 / 1);
8372
- --shadow-elevation-3: 0px 0px 0px 1px oklch(0% 0 none / 0.12), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02), inset 0px 0px 0px 1px oklch(100% 0 none / 0.02);
8742
+ --shadow-elevation-3: var(--ui-local-elevation-3);
8373
8743
  --color-surface-4: oklch(31.262653% 0.000965 251.779887 / 1);
8374
8744
  --color-surface-4-ink: oklch(94.237603% 0.000193 251.779887 / 1);
8375
8745
  --color-surface-4-ink-muted: oklch(78.978204% 0.000193 251.779887 / 1);
8376
- --shadow-elevation-4: 0px 0px 0px 1px oklch(0% 0 none / 0.14), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02), inset 0px 0px 0px 1px oklch(100% 0 none / 0.04);
8746
+ --shadow-elevation-4: var(--ui-local-elevation-4);
8377
8747
  --color-surface-5: oklch(34.462653% 0.001351 251.779887 / 1);
8378
8748
  --color-surface-5-ink: oklch(95.30435% 0.00027 251.779887 / 1);
8379
8749
  --color-surface-5-ink-muted: oklch(80.226419% 0.00027 251.779887 / 1);
8380
- --shadow-elevation-5: 0px 0px 0px 1px oklch(0% 0 none / 0.16), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04), inset 0px 0px 0px 1px oklch(100% 0 none / 0.04);
8750
+ --shadow-elevation-5: var(--ui-local-elevation-5);
8381
8751
  --color-surface-6: oklch(37.862653% 0.001737 251.779887 / 1);
8382
8752
  --color-surface-6-ink: oklch(96.597068% 0.000347 251.779887 / 1);
8383
8753
  --color-surface-6-ink-muted: oklch(81.732335% 0.000347 251.779887 / 1);
8384
- --shadow-elevation-6: 0px 0px 0px 1px oklch(0% 0 none / 0.18), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04), inset 0px 0px 0px 1px oklch(100% 0 none / 0.06);
8754
+ --shadow-elevation-6: var(--ui-local-elevation-6);
8385
8755
  --color-surface-7: oklch(41.462653% 0.002316 251.779887 / 1);
8386
8756
  --color-surface-7-ink: oklch(98.092835% 0.000463 251.779887 / 1);
8387
8757
  --color-surface-7-ink-muted: oklch(83.46613% 0.000463 251.779887 / 1);
8388
- --shadow-elevation-7: 0px 0px 0px 1px oklch(0% 0 none / 0.2), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06), inset 0px 0px 0px 1px oklch(100% 0 none / 0.06);
8758
+ --shadow-elevation-7: var(--ui-local-elevation-7);
8389
8759
  --color-surface-8: oklch(45.262653% 0.002896 251.779887 / 1);
8390
8760
  --color-surface-8-ink: oklch(99.80618% 0.000579 251.779887 / 1);
8391
8761
  --color-surface-8-ink-muted: oklch(85.441382% 0.000579 251.779887 / 1);
8392
- --shadow-elevation-8: 0px 0px 0px 1px oklch(0% 0 none / 0.22), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), 0px 96px 96px -48px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06), inset 0px 0px 0px 1px oklch(100% 0 none / 0.06);
8762
+ --shadow-elevation-8: var(--ui-local-elevation-8);
8393
8763
  }
8394
8764
  @media (color-gamut: p3) {
8395
8765
  :root, .light {
@@ -8491,69 +8861,205 @@
8491
8861
  --color-intent-warning-edge-strong: oklch(52.159903% 0.123347 84.243859 / 0.469);
8492
8862
  --color-intent-warning-focus: oklch(71.848357% 0.119477 84.129977 / 0.42);
8493
8863
  --color-intent-warning-focus-width: 3px;
8494
- --background-interaction-selection-accent: oklch(50.510829% 0.192884 251.700212 / 0.114901);
8495
- --background-interaction-selection-accent-hover: oklch(50.510829% 0.192884 251.700212 / 0.161613);
8864
+ --background-interaction-selection-accent: oklch(50.510829% 0.192884 251.700212 / 0.118507);
8865
+ --background-interaction-selection-accent-hover: oklch(50.510829% 0.192884 251.700212 / 0.166624);
8496
8866
  --color-interaction-selection-accent-ink: oklch(55.080786% 0.171613 251.779887 / 1);
8497
- --background-interaction-selection-danger: oklch(49.039211% 0.226443 28.958133 / 0.114714);
8498
- --background-interaction-selection-danger-hover: oklch(49.039211% 0.226443 28.958133 / 0.161306);
8867
+ --background-interaction-selection-danger: oklch(49.039211% 0.226443 28.958133 / 0.118374);
8868
+ --background-interaction-selection-danger-hover: oklch(49.039211% 0.226443 28.958133 / 0.166375);
8499
8869
  --color-interaction-selection-danger-ink: oklch(56.831333% 0.171879 23.02606 / 1);
8500
- --background-interaction-selection-information: oklch(50.510829% 0.192884 251.700212 / 0.114901);
8501
- --background-interaction-selection-information-hover: oklch(50.510829% 0.192884 251.700212 / 0.161613);
8870
+ --background-interaction-selection-information: oklch(50.510829% 0.192884 251.700212 / 0.118507);
8871
+ --background-interaction-selection-information-hover: oklch(50.510829% 0.192884 251.700212 / 0.166624);
8502
8872
  --color-interaction-selection-information-ink: oklch(55.080786% 0.171613 251.779887 / 1);
8503
- --background-interaction-selection-neutral: oklch(0% 0 none / 0.074218);
8504
- --background-interaction-selection-neutral-hover: oklch(0% 0 none / 0.116935);
8873
+ --background-interaction-selection-neutral: oklch(0% 0 none / 0.0761);
8874
+ --background-interaction-selection-neutral-hover: oklch(0% 0 none / 0.119852);
8505
8875
  --color-interaction-selection-neutral-ink: oklch(18% 0 none / 1);
8506
- --background-interaction-selection-success: oklch(45.368413% 0.179612 148.854702 / 0.113315);
8507
- --background-interaction-selection-success-hover: oklch(45.368413% 0.179612 148.854702 / 0.15938);
8876
+ --background-interaction-selection-success: oklch(45.368413% 0.179612 148.854702 / 0.117039);
8877
+ --background-interaction-selection-success-hover: oklch(45.368413% 0.179612 148.854702 / 0.164546);
8508
8878
  --color-interaction-selection-success-ink: oklch(53.50073% 0.118126 157.679534 / 1);
8509
- --background-interaction-selection-warning: oklch(52.264559% 0.123557 84.489733 / 0.120375);
8510
- --background-interaction-selection-warning-hover: oklch(52.264559% 0.123557 84.489733 / 0.169313);
8879
+ --background-interaction-selection-warning: oklch(52.264559% 0.123557 84.489733 / 0.125041);
8880
+ --background-interaction-selection-warning-hover: oklch(52.264559% 0.123557 84.489733 / 0.1758);
8511
8881
  --color-interaction-selection-warning-ink: oklch(55.558425% 0.131808 82.201817 / 1);
8512
8882
  --color-interaction-hover: oklch(75.896553% 0.058885 301.418569 / 0.035);
8513
8883
  --color-interaction-pressed: oklch(61.543431% 0.02801 347.674878 / 0.055);
8514
- --color-interaction-selected: oklch(50.510829% 0.192884 251.700212 / 0.114901);
8515
- --color-interaction-selected-hover: oklch(50.510829% 0.192884 251.700212 / 0.161613);
8884
+ --color-interaction-selected: oklch(50.510829% 0.192884 251.700212 / 0.118507);
8885
+ --color-interaction-selected-hover: oklch(50.510829% 0.192884 251.700212 / 0.166624);
8886
+ --color-interaction-edge-hover: oklch(75.896553% 0.058885 301.418569 / 0.035);
8887
+ --color-interaction-edge-pressed: oklch(61.543431% 0.02801 347.674878 / 0.055);
8888
+ --color-interaction-edge-selected: oklch(50.510829% 0.192884 251.700212 / 0.118507);
8889
+ --color-interaction-edge-selected-hover: oklch(50.510829% 0.192884 251.700212 / 0.166624);
8516
8890
  --opacity-interaction-disabled: 0.5;
8517
8891
  --color-interaction-disabled: oklch(75.896553% 0.058885 301.418569 / 0.043);
8518
8892
  --color-interaction-disabled-edge: oklch(0% 0 none / 0.294);
8519
8893
  --color-interaction-disabled-ink: var(--ui-surface-ink-muted);
8520
8894
  --color-scrim: oklch(12.382253% 0 none / 0.35);
8895
+ --color-substrate-workspace: oklch(98.510365% 0 none / 1);
8896
+ --color-substrate-workspace-ink: oklch(20.93472% 0 none / 1);
8897
+ --color-substrate-workspace-ink-muted: oklch(55.779494% 0 none / 1);
8898
+ --color-surface-workspace-0: oklch(98.510365% 0 none / 1);
8899
+ --color-surface-workspace-0-ink: oklch(20.93472% 0 none / 1);
8900
+ --color-surface-workspace-0-ink-muted: oklch(55.779494% 0 none / 1);
8901
+ --color-surface-workspace-0-edge: oklch(95.511403% 0.000791 329.098761 / 1);
8902
+ --color-surface-workspace-0-edge-hover: oklch(94.011169% 0.000857 222.520688 / 1);
8903
+ --color-surface-workspace-0-edge-strong: oklch(92.510344% 0 none / 1);
8904
+ --shadow-depth-workspace-0: 0 0 0 0 transparent;
8905
+ --color-surface-workspace-1: oklch(99.110365% 0 none / 1);
8906
+ --color-surface-workspace-1-ink: oklch(21.693184% 0 none / 1);
8907
+ --color-surface-workspace-1-ink-muted: oklch(56.194798% 0 none / 1);
8908
+ --color-surface-workspace-1-edge: oklch(96.111346% 0.000774 329.098622 / 1);
8909
+ --color-surface-workspace-1-edge-hover: oklch(94.611135% 0.000841 222.522014 / 1);
8910
+ --color-surface-workspace-1-edge-strong: oklch(93.110343% 0 none / 1);
8911
+ --shadow-depth-workspace-1: 0 0 0 0 transparent;
8912
+ --color-surface-workspace-2: oklch(100% 0 none / 1);
8913
+ --color-surface-workspace-2-ink: oklch(22.74366% 0 none / 1);
8914
+ --color-surface-workspace-2-ink-muted: oklch(56.808564% 0 none / 1);
8915
+ --color-surface-workspace-2-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8916
+ --color-surface-workspace-2-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8917
+ --color-surface-workspace-2-edge-strong: oklch(93.999998% 0 none / 1);
8918
+ --shadow-depth-workspace-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06);
8919
+ --color-surface-workspace-3: oklch(100% 0 none / 1);
8920
+ --color-surface-workspace-3-ink: oklch(22.74366% 0 none / 1);
8921
+ --color-surface-workspace-3-ink-muted: oklch(56.808564% 0 none / 1);
8922
+ --color-surface-workspace-3-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8923
+ --color-surface-workspace-3-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8924
+ --color-surface-workspace-3-edge-strong: oklch(93.999998% 0 none / 1);
8925
+ --shadow-depth-workspace-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06);
8926
+ --color-surface-workspace-4: oklch(100% 0 none / 1);
8927
+ --color-surface-workspace-4-ink: oklch(22.74366% 0 none / 1);
8928
+ --color-surface-workspace-4-ink-muted: oklch(56.808564% 0 none / 1);
8929
+ --color-surface-workspace-4-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8930
+ --color-surface-workspace-4-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8931
+ --color-surface-workspace-4-edge-strong: oklch(93.999998% 0 none / 1);
8932
+ --shadow-depth-workspace-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06);
8933
+ --color-surface-workspace-5: oklch(100% 0 none / 1);
8934
+ --color-surface-workspace-5-ink: oklch(22.74366% 0 none / 1);
8935
+ --color-surface-workspace-5-ink-muted: oklch(56.808564% 0 none / 1);
8936
+ --color-surface-workspace-5-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8937
+ --color-surface-workspace-5-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8938
+ --color-surface-workspace-5-edge-strong: oklch(93.999998% 0 none / 1);
8939
+ --shadow-depth-workspace-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06);
8940
+ --color-surface-workspace-6: oklch(100% 0 none / 1);
8941
+ --color-surface-workspace-6-ink: oklch(22.74366% 0 none / 1);
8942
+ --color-surface-workspace-6-ink-muted: oklch(56.808564% 0 none / 1);
8943
+ --color-surface-workspace-6-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8944
+ --color-surface-workspace-6-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8945
+ --color-surface-workspace-6-edge-strong: oklch(93.999998% 0 none / 1);
8946
+ --shadow-depth-workspace-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06);
8947
+ --color-surface-workspace-7: oklch(100% 0 none / 1);
8948
+ --color-surface-workspace-7-ink: oklch(22.74366% 0 none / 1);
8949
+ --color-surface-workspace-7-ink-muted: oklch(56.808564% 0 none / 1);
8950
+ --color-surface-workspace-7-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8951
+ --color-surface-workspace-7-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8952
+ --color-surface-workspace-7-edge-strong: oklch(93.999998% 0 none / 1);
8953
+ --shadow-depth-workspace-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06);
8954
+ --color-surface-workspace-8: oklch(100% 0 none / 1);
8955
+ --color-surface-workspace-8-ink: oklch(22.74366% 0 none / 1);
8956
+ --color-surface-workspace-8-ink-muted: oklch(56.808564% 0 none / 1);
8957
+ --color-surface-workspace-8-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8958
+ --color-surface-workspace-8-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8959
+ --color-surface-workspace-8-edge-strong: oklch(93.999998% 0 none / 1);
8960
+ --shadow-depth-workspace-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06), 0px 96px 96px -48px oklch(0% 0 none / 0.06);
8961
+ --color-substrate-chrome: oklch(96.010365% 0 none / 1);
8962
+ --color-substrate-chrome-ink: oklch(17.101275% 0 none / 1);
8963
+ --color-substrate-chrome-ink-muted: oklch(54.036418% 0 none / 1);
8964
+ --color-surface-chrome-0: oklch(96.010365% 0 none / 1);
8965
+ --color-surface-chrome-0-ink: oklch(17.101275% 0 none / 1);
8966
+ --color-surface-chrome-0-ink-muted: oklch(54.036418% 0 none / 1);
8967
+ --color-surface-chrome-0-edge: oklch(93.011603% 0.000867 329.099395 / 1);
8968
+ --color-surface-chrome-0-edge-hover: oklch(91.511323% 0.000929 222.51468 / 1);
8969
+ --color-surface-chrome-0-edge-strong: oklch(90.010356% 0 none / 1);
8970
+ --shadow-depth-chrome-0: 0 0 0 0 transparent;
8971
+ --color-surface-chrome-1: oklch(96.610365% 0 none / 1);
8972
+ --color-surface-chrome-1-ink: oklch(18.154498% 0 none / 1);
8973
+ --color-surface-chrome-1-ink-muted: oklch(54.456699% 0 none / 1);
8974
+ --color-surface-chrome-1-edge: oklch(93.611548% 0.000848 329.099234 / 1);
8975
+ --color-surface-chrome-1-edge-hover: oklch(92.111267% 0.000911 222.516197 / 1);
8976
+ --color-surface-chrome-1-edge-strong: oklch(90.610362% 0 none / 1);
8977
+ --shadow-depth-chrome-1: 0 0 0 0 transparent;
8978
+ --color-surface-chrome-2: oklch(100% 0 none / 1);
8979
+ --color-surface-chrome-2-ink: oklch(22.74366% 0 none / 1);
8980
+ --color-surface-chrome-2-ink-muted: oklch(56.808564% 0 none / 1);
8981
+ --color-surface-chrome-2-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8982
+ --color-surface-chrome-2-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8983
+ --color-surface-chrome-2-edge-strong: oklch(93.999998% 0 none / 1);
8984
+ --shadow-depth-chrome-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06);
8985
+ --color-surface-chrome-3: oklch(100% 0 none / 1);
8986
+ --color-surface-chrome-3-ink: oklch(22.74366% 0 none / 1);
8987
+ --color-surface-chrome-3-ink-muted: oklch(56.808564% 0 none / 1);
8988
+ --color-surface-chrome-3-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8989
+ --color-surface-chrome-3-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8990
+ --color-surface-chrome-3-edge-strong: oklch(93.999998% 0 none / 1);
8991
+ --shadow-depth-chrome-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06);
8992
+ --color-surface-chrome-4: oklch(100% 0 none / 1);
8993
+ --color-surface-chrome-4-ink: oklch(22.74366% 0 none / 1);
8994
+ --color-surface-chrome-4-ink-muted: oklch(56.808564% 0 none / 1);
8995
+ --color-surface-chrome-4-edge: oklch(97.000922% 0.00075 329.098426 / 1);
8996
+ --color-surface-chrome-4-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
8997
+ --color-surface-chrome-4-edge-strong: oklch(93.999998% 0 none / 1);
8998
+ --shadow-depth-chrome-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06);
8999
+ --color-surface-chrome-5: oklch(100% 0 none / 1);
9000
+ --color-surface-chrome-5-ink: oklch(22.74366% 0 none / 1);
9001
+ --color-surface-chrome-5-ink-muted: oklch(56.808564% 0 none / 1);
9002
+ --color-surface-chrome-5-edge: oklch(97.000922% 0.00075 329.098426 / 1);
9003
+ --color-surface-chrome-5-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
9004
+ --color-surface-chrome-5-edge-strong: oklch(93.999998% 0 none / 1);
9005
+ --shadow-depth-chrome-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06);
9006
+ --color-surface-chrome-6: oklch(100% 0 none / 1);
9007
+ --color-surface-chrome-6-ink: oklch(22.74366% 0 none / 1);
9008
+ --color-surface-chrome-6-ink-muted: oklch(56.808564% 0 none / 1);
9009
+ --color-surface-chrome-6-edge: oklch(97.000922% 0.00075 329.098426 / 1);
9010
+ --color-surface-chrome-6-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
9011
+ --color-surface-chrome-6-edge-strong: oklch(93.999998% 0 none / 1);
9012
+ --shadow-depth-chrome-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06);
9013
+ --color-surface-chrome-7: oklch(100% 0 none / 1);
9014
+ --color-surface-chrome-7-ink: oklch(22.74366% 0 none / 1);
9015
+ --color-surface-chrome-7-ink-muted: oklch(56.808564% 0 none / 1);
9016
+ --color-surface-chrome-7-edge: oklch(97.000922% 0.00075 329.098426 / 1);
9017
+ --color-surface-chrome-7-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
9018
+ --color-surface-chrome-7-edge-strong: oklch(93.999998% 0 none / 1);
9019
+ --shadow-depth-chrome-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06);
9020
+ --color-surface-chrome-8: oklch(100% 0 none / 1);
9021
+ --color-surface-chrome-8-ink: oklch(22.74366% 0 none / 1);
9022
+ --color-surface-chrome-8-ink-muted: oklch(56.808564% 0 none / 1);
9023
+ --color-surface-chrome-8-edge: oklch(97.000922% 0.00075 329.098426 / 1);
9024
+ --color-surface-chrome-8-edge-hover: oklch(95.500737% 0.000818 222.523904 / 1);
9025
+ --color-surface-chrome-8-edge-strong: oklch(93.999998% 0 none / 1);
9026
+ --shadow-depth-chrome-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06), 0px 96px 96px -48px oklch(0% 0 none / 0.06);
8521
9027
  --color-surface-0: oklch(98.510365% 0 none / 1);
8522
9028
  --color-surface-0-ink: oklch(20.93472% 0 none / 1);
8523
9029
  --color-surface-0-ink-muted: oklch(55.779494% 0 none / 1);
8524
- --shadow-elevation-0: 0 0 0 0 transparent;
9030
+ --shadow-elevation-0: var(--ui-local-elevation-0);
8525
9031
  --color-surface-1: oklch(99.110365% 0 none / 1);
8526
9032
  --color-surface-1-ink: oklch(21.693184% 0 none / 1);
8527
9033
  --color-surface-1-ink-muted: oklch(56.194798% 0 none / 1);
8528
- --shadow-elevation-1: 0px 0px 0px 1px oklch(0% 0 none / 0.06);
9034
+ --shadow-elevation-1: var(--ui-local-elevation-1);
8529
9035
  --color-surface-2: oklch(100% 0 none / 1);
8530
9036
  --color-surface-2-ink: oklch(22.74366% 0 none / 1);
8531
9037
  --color-surface-2-ink-muted: oklch(56.808564% 0 none / 1);
8532
- --shadow-elevation-2: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06);
9038
+ --shadow-elevation-2: var(--ui-local-elevation-2);
8533
9039
  --color-surface-3: oklch(100% 0 none / 1);
8534
9040
  --color-surface-3-ink: oklch(22.74366% 0 none / 1);
8535
9041
  --color-surface-3-ink-muted: oklch(56.808564% 0 none / 1);
8536
- --shadow-elevation-3: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06);
9042
+ --shadow-elevation-3: var(--ui-local-elevation-3);
8537
9043
  --color-surface-4: oklch(100% 0 none / 1);
8538
9044
  --color-surface-4-ink: oklch(22.74366% 0 none / 1);
8539
9045
  --color-surface-4-ink-muted: oklch(56.808564% 0 none / 1);
8540
- --shadow-elevation-4: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06);
9046
+ --shadow-elevation-4: var(--ui-local-elevation-4);
8541
9047
  --color-surface-5: oklch(100% 0 none / 1);
8542
9048
  --color-surface-5-ink: oklch(22.74366% 0 none / 1);
8543
9049
  --color-surface-5-ink-muted: oklch(56.808564% 0 none / 1);
8544
- --shadow-elevation-5: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06);
9050
+ --shadow-elevation-5: var(--ui-local-elevation-5);
8545
9051
  --color-surface-6: oklch(100% 0 none / 1);
8546
9052
  --color-surface-6-ink: oklch(22.74366% 0 none / 1);
8547
9053
  --color-surface-6-ink-muted: oklch(56.808564% 0 none / 1);
8548
- --shadow-elevation-6: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06);
9054
+ --shadow-elevation-6: var(--ui-local-elevation-6);
8549
9055
  --color-surface-7: oklch(100% 0 none / 1);
8550
9056
  --color-surface-7-ink: oklch(22.74366% 0 none / 1);
8551
9057
  --color-surface-7-ink-muted: oklch(56.808564% 0 none / 1);
8552
- --shadow-elevation-7: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06);
9058
+ --shadow-elevation-7: var(--ui-local-elevation-7);
8553
9059
  --color-surface-8: oklch(100% 0 none / 1);
8554
9060
  --color-surface-8-ink: oklch(22.74366% 0 none / 1);
8555
9061
  --color-surface-8-ink-muted: oklch(56.808564% 0 none / 1);
8556
- --shadow-elevation-8: 0px 0px 0px 1px oklch(0% 0 none / 0.06), 0px 1px 1px -0.5px oklch(0% 0 none / 0.06), 0px 3px 3px -1.5px oklch(0% 0 none / 0.06), 0px 6px 6px -3px oklch(0% 0 none / 0.06), 0px 12px 12px -6px oklch(0% 0 none / 0.06), 0px 24px 24px -12px oklch(0% 0 none / 0.06), 0px 48px 48px -24px oklch(0% 0 none / 0.06), 0px 96px 96px -48px oklch(0% 0 none / 0.06);
9062
+ --shadow-elevation-8: var(--ui-local-elevation-8);
8557
9063
  }
8558
9064
  .dark {
8559
9065
  --color-separator: oklch(46.131669% 0.007996 241.953581 / 0.125);
@@ -8654,232 +9160,795 @@
8654
9160
  --color-intent-warning-edge-strong: oklch(65.085666% 0.133373 84.363137 / 0.373);
8655
9161
  --color-intent-warning-focus: oklch(56.020502% 0.113818 84.129977 / 0.42);
8656
9162
  --color-intent-warning-focus-width: 3px;
8657
- --background-interaction-selection-accent: oklch(77.965918% 0.129595 246.066304 / 0.051048);
8658
- --background-interaction-selection-accent-hover: oklch(77.965918% 0.129595 246.066304 / 0.075803);
9163
+ --background-interaction-selection-accent: oklch(77.965918% 0.129595 246.066304 / 0.056763);
9164
+ --background-interaction-selection-accent-hover: oklch(77.965918% 0.129595 246.066304 / 0.084192);
8659
9165
  --color-interaction-selection-accent-ink: oklch(76.009909% 0.139824 248.518651 / 1);
8660
- --background-interaction-selection-danger: oklch(80.016885% 0.147187 22.589407 / 0.044945);
8661
- --background-interaction-selection-danger-hover: oklch(80.016885% 0.147187 22.589407 / 0.06666);
9166
+ --background-interaction-selection-danger: oklch(80.016885% 0.147187 22.589407 / 0.049833);
9167
+ --background-interaction-selection-danger-hover: oklch(80.016885% 0.147187 22.589407 / 0.073809);
8662
9168
  --color-interaction-selection-danger-ink: oklch(78.331653% 0.153899 23.02606 / 1);
8663
- --background-interaction-selection-information: oklch(77.965918% 0.129595 246.066304 / 0.051048);
8664
- --background-interaction-selection-information-hover: oklch(77.965918% 0.129595 246.066304 / 0.075803);
9169
+ --background-interaction-selection-information: oklch(77.965918% 0.129595 246.066304 / 0.056763);
9170
+ --background-interaction-selection-information-hover: oklch(77.965918% 0.129595 246.066304 / 0.084192);
8665
9171
  --color-interaction-selection-information-ink: oklch(76.009909% 0.139824 248.518651 / 1);
8666
- --background-interaction-selection-neutral: oklch(89.093811% 0 none / 0.026409);
8667
- --background-interaction-selection-neutral-hover: oklch(89.093811% 0 none / 0.043644);
9172
+ --background-interaction-selection-neutral: oklch(89.093811% 0 none / 0.029342);
9173
+ --background-interaction-selection-neutral-hover: oklch(89.093811% 0 none / 0.048426);
8668
9174
  --color-interaction-selection-neutral-ink: oklch(86% 0 none / 1);
8669
- --background-interaction-selection-success: oklch(78.22263% 0.109703 157.679229 / 0.053901);
8670
- --background-interaction-selection-success-hover: oklch(78.22263% 0.109703 157.679229 / 0.07965);
9175
+ --background-interaction-selection-success: oklch(78.22263% 0.109703 157.679229 / 0.060166);
9176
+ --background-interaction-selection-success-hover: oklch(78.22263% 0.109703 157.679229 / 0.088788);
8671
9177
  --color-interaction-selection-success-ink: oklch(75.524628% 0.105769 157.679534 / 1);
8672
- --background-interaction-selection-warning: oklch(79.687573% 0.12976 84.141183 / 0.050078);
8673
- --background-interaction-selection-warning-hover: oklch(79.687573% 0.12976 84.141183 / 0.073862);
9178
+ --background-interaction-selection-warning: oklch(79.687573% 0.12976 84.141183 / 0.055794);
9179
+ --background-interaction-selection-warning-hover: oklch(79.687573% 0.12976 84.141183 / 0.082172);
8674
9180
  --color-interaction-selection-warning-ink: oklch(76.965573% 0.125137 84.129977 / 1);
8675
9181
  --color-interaction-hover: oklch(34.407394% 0.022601 220.579947 / 0.035);
8676
9182
  --color-interaction-pressed: oklch(46.131669% 0.007996 241.953581 / 0.055);
8677
- --color-interaction-selected: oklch(77.965918% 0.129595 246.066304 / 0.051048);
8678
- --color-interaction-selected-hover: oklch(77.965918% 0.129595 246.066304 / 0.075803);
9183
+ --color-interaction-selected: oklch(77.965918% 0.129595 246.066304 / 0.056763);
9184
+ --color-interaction-selected-hover: oklch(77.965918% 0.129595 246.066304 / 0.084192);
9185
+ --color-interaction-edge-hover: oklch(34.407394% 0.022601 220.579947 / 0.035);
9186
+ --color-interaction-edge-pressed: oklch(46.131669% 0.007996 241.953581 / 0.055);
9187
+ --color-interaction-edge-selected: oklch(77.965918% 0.129595 246.066304 / 0.056763);
9188
+ --color-interaction-edge-selected-hover: oklch(77.965918% 0.129595 246.066304 / 0.084192);
8679
9189
  --opacity-interaction-disabled: 0.5;
8680
9190
  --color-interaction-disabled: oklch(34.407394% 0.022601 220.579947 / 0.047);
8681
9191
  --color-interaction-disabled-edge: oklch(56.823866% 0.000911 195.877546 / 0.294);
8682
9192
  --color-interaction-disabled-ink: var(--ui-surface-ink-muted);
8683
9193
  --color-scrim: oklch(20.962653% 0 none / 0.55);
9194
+ --color-substrate-workspace: oklch(20.462653% 0 none / 1);
9195
+ --color-substrate-workspace-ink: oklch(92.184718% 0 none / 1);
9196
+ --color-substrate-workspace-ink-muted: oklch(76.561054% 0 none / 1);
9197
+ --color-surface-workspace-0: oklch(20.462653% 0 none / 1);
9198
+ --color-surface-workspace-0-ink: oklch(92.184718% 0 none / 1);
9199
+ --color-surface-workspace-0-ink-muted: oklch(76.561054% 0 none / 1);
9200
+ --color-surface-workspace-0-edge: oklch(23.462413% 0.000387 195.876895 / 1);
9201
+ --color-surface-workspace-0-edge-hover: oklch(24.962429% 0.000491 195.872274 / 1);
9202
+ --color-surface-workspace-0-edge-strong: oklch(26.462633% 0.000239 195.887719 / 1);
9203
+ --shadow-depth-workspace-0: 0 0 0 0 transparent;
9204
+ --color-surface-workspace-1: oklch(22.962653% 0 none / 1);
9205
+ --color-surface-workspace-1-ink: oklch(92.501588% 0 none / 1);
9206
+ --color-surface-workspace-1-ink-muted: oklch(76.93548% 0 none / 1);
9207
+ --color-surface-workspace-1-edge: oklch(25.962414% 0.000403 195.878259 / 1);
9208
+ --color-surface-workspace-1-edge-hover: oklch(27.462382% 0.000513 195.873707 / 1);
9209
+ --color-surface-workspace-1-edge-strong: oklch(28.962607% 0.000249 195.888347 / 1);
9210
+ --shadow-depth-workspace-1: 0 0 0 0 transparent;
9211
+ --color-surface-workspace-2: oklch(25.462653% 0.000386 251.779887 / 1);
9212
+ --color-surface-workspace-2-ink: oklch(92.908812% 0.000077 251.779887 / 1);
9213
+ --color-surface-workspace-2-ink-muted: oklch(77.415975% 0.000077 251.779887 / 1);
9214
+ --color-surface-workspace-2-edge: oklch(28.462436% 0.000635 218.168381 / 1);
9215
+ --color-surface-workspace-2-edge-hover: oklch(29.962417% 0.000714 213.116559 / 1);
9216
+ --color-surface-workspace-2-edge-strong: oklch(31.46266% 0.000434 222.000893 / 1);
9217
+ --shadow-depth-workspace-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.01);
9218
+ --color-surface-workspace-3: oklch(28.262653% 0.000579 251.779887 / 1);
9219
+ --color-surface-workspace-3-ink: oklch(93.477871% 0.000116 251.779887 / 1);
9220
+ --color-surface-workspace-3-ink-muted: oklch(78.08603% 0.000116 251.779887 / 1);
9221
+ --color-surface-workspace-3-edge: oklch(31.262414% 0.000786 223.30192 / 1);
9222
+ --color-surface-workspace-3-edge-hover: oklch(32.76239% 0.000852 217.890449 / 1);
9223
+ --color-surface-workspace-3-edge-strong: oklch(34.262637% 0.000554 227.546102 / 1);
9224
+ --shadow-depth-workspace-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
9225
+ --color-surface-workspace-4: oklch(31.262653% 0.000965 251.779887 / 1);
9226
+ --color-surface-workspace-4-ink: oklch(94.237603% 0.000193 251.779887 / 1);
9227
+ --color-surface-workspace-4-ink-muted: oklch(78.978204% 0.000193 251.779887 / 1);
9228
+ --color-surface-workspace-4-edge: oklch(34.262388% 0.001081 229.562549 / 1);
9229
+ --color-surface-workspace-4-edge-hover: oklch(35.762368% 0.001113 224.223973 / 1);
9230
+ --color-surface-workspace-4-edge-strong: oklch(37.262577% 0.000789 233.88028 / 1);
9231
+ --shadow-depth-workspace-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
9232
+ --color-surface-workspace-5: oklch(34.462653% 0.001351 251.779887 / 1);
9233
+ --color-surface-workspace-5-ink: oklch(95.30435% 0.00027 251.779887 / 1);
9234
+ --color-surface-workspace-5-ink-muted: oklch(80.226419% 0.00027 251.779887 / 1);
9235
+ --color-surface-workspace-5-edge: oklch(37.462306% 0.001383 232.326593 / 1);
9236
+ --color-surface-workspace-5-edge-hover: oklch(38.962289% 0.001381 227.27596 / 1);
9237
+ --color-surface-workspace-5-edge-strong: oklch(40.462502% 0.001021 236.850623 / 1);
9238
+ --shadow-depth-workspace-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
9239
+ --color-surface-workspace-6: oklch(37.862653% 0.001737 251.779887 / 1);
9240
+ --color-surface-workspace-6-ink: oklch(96.597068% 0.000347 251.779887 / 1);
9241
+ --color-surface-workspace-6-ink-muted: oklch(81.732335% 0.000347 251.779887 / 1);
9242
+ --color-surface-workspace-6-edge: oklch(40.862119% 0.001675 232.73309 / 1);
9243
+ --color-surface-workspace-6-edge-hover: oklch(42.362109% 0.00164 227.857087 / 1);
9244
+ --color-surface-workspace-6-edge-strong: oklch(43.862347% 0.00123 237.995612 / 1);
9245
+ --shadow-depth-workspace-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
9246
+ --color-surface-workspace-7: oklch(41.462653% 0.002316 251.779887 / 1);
9247
+ --color-surface-workspace-7-ink: oklch(98.092835% 0.000463 251.779887 / 1);
9248
+ --color-surface-workspace-7-ink-muted: oklch(83.46613% 0.000463 251.779887 / 1);
9249
+ --color-surface-workspace-7-edge: oklch(44.461544% 0.002044 231.400626 / 1);
9250
+ --color-surface-workspace-7-edge-hover: oklch(45.96156% 0.001955 226.688651 / 1);
9251
+ --color-surface-workspace-7-edge-strong: oklch(47.461928% 0.001481 238.511019 / 1);
9252
+ --shadow-depth-workspace-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
9253
+ --color-surface-workspace-8: oklch(45.262653% 0.002896 251.779887 / 1);
9254
+ --color-surface-workspace-8-ink: oklch(99.80618% 0.000579 251.779887 / 1);
9255
+ --color-surface-workspace-8-ink-muted: oklch(85.441382% 0.000579 251.779887 / 1);
9256
+ --color-surface-workspace-8-edge: oklch(48.258936% 0.002244 221.21104 / 1);
9257
+ --color-surface-workspace-8-edge-hover: oklch(49.759627% 0.00212 217.57581 / 1);
9258
+ --color-surface-workspace-8-edge-strong: oklch(51.260901% 0.001566 236.07467 / 1);
9259
+ --shadow-depth-workspace-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), 0px 96px 96px -48px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
9260
+ --color-substrate-chrome: oklch(22.462653% 0 none / 1);
9261
+ --color-substrate-chrome-ink: oklch(92.431093% 0 none / 1);
9262
+ --color-substrate-chrome-ink-muted: oklch(76.852224% 0 none / 1);
9263
+ --color-surface-chrome-0: oklch(22.462653% 0 none / 1);
9264
+ --color-surface-chrome-0-ink: oklch(92.431093% 0 none / 1);
9265
+ --color-surface-chrome-0-ink-muted: oklch(76.852224% 0 none / 1);
9266
+ --color-surface-chrome-0-edge: oklch(25.462422% 0.0004 195.87802 / 1);
9267
+ --color-surface-chrome-0-edge-hover: oklch(26.96239% 0.000508 195.873454 / 1);
9268
+ --color-surface-chrome-0-edge-strong: oklch(28.462655% 0.000247 195.888233 / 1);
9269
+ --shadow-depth-chrome-0: 0 0 0 0 transparent;
9270
+ --color-surface-chrome-1: oklch(24.962653% 0 none / 1);
9271
+ --color-surface-chrome-1-ink: oklch(92.819977% 0 none / 1);
9272
+ --color-surface-chrome-1-ink-muted: oklch(77.311197% 0 none / 1);
9273
+ --color-surface-chrome-1-edge: oklch(27.962371% 0.000419 195.87905 / 1);
9274
+ --color-surface-chrome-1-edge-hover: oklch(29.462366% 0.000533 195.87456 / 1);
9275
+ --color-surface-chrome-1-edge-strong: oklch(30.962624% 0.000258 195.888744 / 1);
9276
+ --shadow-depth-chrome-1: 0 0 0 0 transparent;
9277
+ --color-surface-chrome-2: oklch(27.462653% 0.000386 251.779887 / 1);
9278
+ --color-surface-chrome-2-ink: oklch(93.302555% 0.000077 251.779887 / 1);
9279
+ --color-surface-chrome-2-ink-muted: oklch(77.879753% 0.000077 251.779887 / 1);
9280
+ --color-surface-chrome-2-edge: oklch(30.462404% 0.000653 217.55758 / 1);
9281
+ --color-surface-chrome-2-edge-hover: oklch(31.9624% 0.000738 212.625245 / 1);
9282
+ --color-surface-chrome-2-edge-strong: oklch(33.462634% 0.000445 221.597802 / 1);
9283
+ --shadow-depth-chrome-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.01);
9284
+ --color-surface-chrome-3: oklch(30.262653% 0.000579 251.779887 / 1);
9285
+ --color-surface-chrome-3-ink: oklch(93.964672% 0.000116 251.779887 / 1);
9286
+ --color-surface-chrome-3-ink-muted: oklch(78.657981% 0.000116 251.779887 / 1);
9287
+ --color-surface-chrome-3-edge: oklch(33.262372% 0.000808 222.406407 / 1);
9288
+ --color-surface-chrome-3-edge-hover: oklch(34.762359% 0.000879 217.091644 / 1);
9289
+ --color-surface-chrome-3-edge-strong: oklch(36.262611% 0.000565 226.937884 / 1);
9290
+ --shadow-depth-chrome-3: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
9291
+ --color-surface-chrome-4: oklch(33.262653% 0.000965 251.779887 / 1);
9292
+ --color-surface-chrome-4-ink: oklch(94.876877% 0.000193 251.779887 / 1);
9293
+ --color-surface-chrome-4-ink-muted: oklch(79.72682% 0.000193 251.779887 / 1);
9294
+ --color-surface-chrome-4-edge: oklch(36.262334% 0.001104 228.352324 / 1);
9295
+ --color-surface-chrome-4-edge-hover: oklch(37.762335% 0.001141 223.022717 / 1);
9296
+ --color-surface-chrome-4-edge-strong: oklch(39.262565% 0.000796 233.102098 / 1);
9297
+ --shadow-depth-chrome-4: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02);
9298
+ --color-surface-chrome-5: oklch(36.462653% 0.001351 251.779887 / 1);
9299
+ --color-surface-chrome-5-ink: oklch(96.050221% 0.00027 251.779887 / 1);
9300
+ --color-surface-chrome-5-ink-muted: oklch(81.096153% 0.00027 251.779887 / 1);
9301
+ --color-surface-chrome-5-edge: oklch(39.462225% 0.001404 230.65698 / 1);
9302
+ --color-surface-chrome-5-edge-hover: oklch(40.962223% 0.001408 225.546896 / 1);
9303
+ --color-surface-chrome-5-edge-strong: oklch(42.462481% 0.00102 235.848082 / 1);
9304
+ --shadow-depth-chrome-5: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
9305
+ --color-surface-chrome-6: oklch(39.862653% 0.001737 251.779887 / 1);
9306
+ --color-surface-chrome-6-ink: oklch(97.412147% 0.000347 251.779887 / 1);
9307
+ --color-surface-chrome-6-ink-muted: oklch(82.678213% 0.000347 251.779887 / 1);
9308
+ --color-surface-chrome-6-edge: oklch(42.86196% 0.001692 230.11409 / 1);
9309
+ --color-surface-chrome-6-edge-hover: oklch(44.361968% 0.001662 225.16279 / 1);
9310
+ --color-surface-chrome-6-edge-strong: oklch(45.8623% 0.001211 236.581901 / 1);
9311
+ --shadow-depth-chrome-6: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04);
9312
+ --color-surface-chrome-7: oklch(43.462653% 0.002316 251.779887 / 1);
9313
+ --color-surface-chrome-7-ink: oklch(98.977631% 0.000463 251.779887 / 1);
9314
+ --color-surface-chrome-7-ink-muted: oklch(84.487538% 0.000463 251.779887 / 1);
9315
+ --color-surface-chrome-7-edge: oklch(46.460978% 0.002034 226.147767 / 1);
9316
+ --color-surface-chrome-7-edge-hover: oklch(47.961145% 0.001951 221.599303 / 1);
9317
+ --color-surface-chrome-7-edge-strong: oklch(49.461784% 0.001415 236.248506 / 1);
9318
+ --shadow-depth-chrome-7: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
9319
+ --color-surface-chrome-8: oklch(47.262653% 0.002896 251.779887 / 1);
9320
+ --color-surface-chrome-8-ink: oklch(100% 0 none / 1);
9321
+ --color-surface-chrome-8-ink-muted: oklch(86.636302% 0.000579 251.779887 / 1);
9322
+ --color-surface-chrome-8-edge: oklch(50.262655% 0.002731 251.779887 / 1);
9323
+ --color-surface-chrome-8-edge-hover: oklch(51.762631% 0.002649 251.779887 / 1);
9324
+ --color-surface-chrome-8-edge-strong: oklch(53.260302% 0.001384 230.701407 / 1);
9325
+ --shadow-depth-chrome-8: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), 0px 96px 96px -48px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06);
8684
9326
  --color-surface-0: oklch(20.462653% 0 none / 1);
8685
9327
  --color-surface-0-ink: oklch(92.184718% 0 none / 1);
8686
9328
  --color-surface-0-ink-muted: oklch(76.561054% 0 none / 1);
8687
- --shadow-elevation-0: 0 0 0 0 transparent;
9329
+ --shadow-elevation-0: var(--ui-local-elevation-0);
8688
9330
  --color-surface-1: oklch(22.962653% 0 none / 1);
8689
9331
  --color-surface-1-ink: oklch(92.501588% 0 none / 1);
8690
9332
  --color-surface-1-ink-muted: oklch(76.93548% 0 none / 1);
8691
- --shadow-elevation-1: inset 0px 0px 0px 1px oklch(100% 0 none / 0.02);
9333
+ --shadow-elevation-1: var(--ui-local-elevation-1);
8692
9334
  --color-surface-2: oklch(25.462653% 0.000386 251.779887 / 1);
8693
9335
  --color-surface-2-ink: oklch(92.908812% 0.000077 251.779887 / 1);
8694
9336
  --color-surface-2-ink-muted: oklch(77.415975% 0.000077 251.779887 / 1);
8695
- --shadow-elevation-2: 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.01), inset 0px 0px 0px 1px oklch(100% 0 none / 0.02);
9337
+ --shadow-elevation-2: var(--ui-local-elevation-2);
8696
9338
  --color-surface-3: oklch(28.262653% 0.000579 251.779887 / 1);
8697
9339
  --color-surface-3-ink: oklch(93.477871% 0.000116 251.779887 / 1);
8698
9340
  --color-surface-3-ink-muted: oklch(78.08603% 0.000116 251.779887 / 1);
8699
- --shadow-elevation-3: 0px 0px 0px 1px oklch(0% 0 none / 0.12), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02), inset 0px 0px 0px 1px oklch(100% 0 none / 0.02);
9341
+ --shadow-elevation-3: var(--ui-local-elevation-3);
8700
9342
  --color-surface-4: oklch(31.262653% 0.000965 251.779887 / 1);
8701
9343
  --color-surface-4-ink: oklch(94.237603% 0.000193 251.779887 / 1);
8702
9344
  --color-surface-4-ink-muted: oklch(78.978204% 0.000193 251.779887 / 1);
8703
- --shadow-elevation-4: 0px 0px 0px 1px oklch(0% 0 none / 0.14), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.02), inset 0px 0px 0px 1px oklch(100% 0 none / 0.04);
9345
+ --shadow-elevation-4: var(--ui-local-elevation-4);
8704
9346
  --color-surface-5: oklch(34.462653% 0.001351 251.779887 / 1);
8705
9347
  --color-surface-5-ink: oklch(95.30435% 0.00027 251.779887 / 1);
8706
9348
  --color-surface-5-ink-muted: oklch(80.226419% 0.00027 251.779887 / 1);
8707
- --shadow-elevation-5: 0px 0px 0px 1px oklch(0% 0 none / 0.16), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04), inset 0px 0px 0px 1px oklch(100% 0 none / 0.04);
9349
+ --shadow-elevation-5: var(--ui-local-elevation-5);
8708
9350
  --color-surface-6: oklch(37.862653% 0.001737 251.779887 / 1);
8709
9351
  --color-surface-6-ink: oklch(96.597068% 0.000347 251.779887 / 1);
8710
9352
  --color-surface-6-ink-muted: oklch(81.732335% 0.000347 251.779887 / 1);
8711
- --shadow-elevation-6: 0px 0px 0px 1px oklch(0% 0 none / 0.18), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.04), inset 0px 0px 0px 1px oklch(100% 0 none / 0.06);
9353
+ --shadow-elevation-6: var(--ui-local-elevation-6);
8712
9354
  --color-surface-7: oklch(41.462653% 0.002316 251.779887 / 1);
8713
9355
  --color-surface-7-ink: oklch(98.092835% 0.000463 251.779887 / 1);
8714
9356
  --color-surface-7-ink-muted: oklch(83.46613% 0.000463 251.779887 / 1);
8715
- --shadow-elevation-7: 0px 0px 0px 1px oklch(0% 0 none / 0.2), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06), inset 0px 0px 0px 1px oklch(100% 0 none / 0.06);
9357
+ --shadow-elevation-7: var(--ui-local-elevation-7);
8716
9358
  --color-surface-8: oklch(45.262653% 0.002896 251.779887 / 1);
8717
9359
  --color-surface-8-ink: oklch(99.80618% 0.000579 251.779887 / 1);
8718
9360
  --color-surface-8-ink-muted: oklch(85.441382% 0.000579 251.779887 / 1);
8719
- --shadow-elevation-8: 0px 0px 0px 1px oklch(0% 0 none / 0.22), 0px 1px 1px -0.5px oklch(0% 0 none / 0.18), 0px 3px 3px -1.5px oklch(0% 0 none / 0.18), 0px 6px 6px -3px oklch(0% 0 none / 0.18), 0px 12px 12px -6px oklch(0% 0 none / 0.18), 0px 24px 24px -12px oklch(0% 0 none / 0.18), 0px 48px 48px -24px oklch(0% 0 none / 0.18), 0px 96px 96px -48px oklch(0% 0 none / 0.18), inset 0px 1px 0px 0px oklch(100% 0 none / 0.06), inset 0px 0px 0px 1px oklch(100% 0 none / 0.06);
9361
+ --shadow-elevation-8: var(--ui-local-elevation-8);
8720
9362
  }
8721
9363
  }
8722
9364
  :root {
9365
+ --ui-local-surface-0: var(--color-surface-workspace-0);
9366
+ --ui-local-surface-0-ink: var(--color-surface-workspace-0-ink);
9367
+ --ui-local-surface-0-ink-muted: var(--color-surface-workspace-0-ink-muted);
9368
+ --ui-local-surface-0-edge: var(--color-surface-workspace-0-edge);
9369
+ --ui-local-surface-0-edge-hover: var(--color-surface-workspace-0-edge-hover);
9370
+ --ui-local-surface-0-edge-strong: var(--color-surface-workspace-0-edge-strong);
9371
+ --ui-local-surface-1: var(--color-surface-workspace-1);
9372
+ --ui-local-surface-1-ink: var(--color-surface-workspace-1-ink);
9373
+ --ui-local-surface-1-ink-muted: var(--color-surface-workspace-1-ink-muted);
9374
+ --ui-local-surface-1-edge: var(--color-surface-workspace-1-edge);
9375
+ --ui-local-surface-1-edge-hover: var(--color-surface-workspace-1-edge-hover);
9376
+ --ui-local-surface-1-edge-strong: var(--color-surface-workspace-1-edge-strong);
9377
+ --ui-local-surface-2: var(--color-surface-workspace-2);
9378
+ --ui-local-surface-2-ink: var(--color-surface-workspace-2-ink);
9379
+ --ui-local-surface-2-ink-muted: var(--color-surface-workspace-2-ink-muted);
9380
+ --ui-local-surface-2-edge: var(--color-surface-workspace-2-edge);
9381
+ --ui-local-surface-2-edge-hover: var(--color-surface-workspace-2-edge-hover);
9382
+ --ui-local-surface-2-edge-strong: var(--color-surface-workspace-2-edge-strong);
9383
+ --ui-local-surface-3: var(--color-surface-workspace-3);
9384
+ --ui-local-surface-3-ink: var(--color-surface-workspace-3-ink);
9385
+ --ui-local-surface-3-ink-muted: var(--color-surface-workspace-3-ink-muted);
9386
+ --ui-local-surface-3-edge: var(--color-surface-workspace-3-edge);
9387
+ --ui-local-surface-3-edge-hover: var(--color-surface-workspace-3-edge-hover);
9388
+ --ui-local-surface-3-edge-strong: var(--color-surface-workspace-3-edge-strong);
9389
+ --ui-local-surface-4: var(--color-surface-workspace-4);
9390
+ --ui-local-surface-4-ink: var(--color-surface-workspace-4-ink);
9391
+ --ui-local-surface-4-ink-muted: var(--color-surface-workspace-4-ink-muted);
9392
+ --ui-local-surface-4-edge: var(--color-surface-workspace-4-edge);
9393
+ --ui-local-surface-4-edge-hover: var(--color-surface-workspace-4-edge-hover);
9394
+ --ui-local-surface-4-edge-strong: var(--color-surface-workspace-4-edge-strong);
9395
+ --ui-local-surface-5: var(--color-surface-workspace-5);
9396
+ --ui-local-surface-5-ink: var(--color-surface-workspace-5-ink);
9397
+ --ui-local-surface-5-ink-muted: var(--color-surface-workspace-5-ink-muted);
9398
+ --ui-local-surface-5-edge: var(--color-surface-workspace-5-edge);
9399
+ --ui-local-surface-5-edge-hover: var(--color-surface-workspace-5-edge-hover);
9400
+ --ui-local-surface-5-edge-strong: var(--color-surface-workspace-5-edge-strong);
9401
+ --ui-local-surface-6: var(--color-surface-workspace-6);
9402
+ --ui-local-surface-6-ink: var(--color-surface-workspace-6-ink);
9403
+ --ui-local-surface-6-ink-muted: var(--color-surface-workspace-6-ink-muted);
9404
+ --ui-local-surface-6-edge: var(--color-surface-workspace-6-edge);
9405
+ --ui-local-surface-6-edge-hover: var(--color-surface-workspace-6-edge-hover);
9406
+ --ui-local-surface-6-edge-strong: var(--color-surface-workspace-6-edge-strong);
9407
+ --ui-local-surface-7: var(--color-surface-workspace-7);
9408
+ --ui-local-surface-7-ink: var(--color-surface-workspace-7-ink);
9409
+ --ui-local-surface-7-ink-muted: var(--color-surface-workspace-7-ink-muted);
9410
+ --ui-local-surface-7-edge: var(--color-surface-workspace-7-edge);
9411
+ --ui-local-surface-7-edge-hover: var(--color-surface-workspace-7-edge-hover);
9412
+ --ui-local-surface-7-edge-strong: var(--color-surface-workspace-7-edge-strong);
9413
+ --ui-local-surface-8: var(--color-surface-workspace-8);
9414
+ --ui-local-surface-8-ink: var(--color-surface-workspace-8-ink);
9415
+ --ui-local-surface-8-ink-muted: var(--color-surface-workspace-8-ink-muted);
9416
+ --ui-local-surface-8-edge: var(--color-surface-workspace-8-edge);
9417
+ --ui-local-surface-8-edge-hover: var(--color-surface-workspace-8-edge-hover);
9418
+ --ui-local-surface-8-edge-strong: var(--color-surface-workspace-8-edge-strong);
9419
+ --ui-local-elevation-0: 0 0 0 0 transparent;
9420
+ --ui-local-elevation-1: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-1);
9421
+ --ui-local-elevation-2: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-2);
9422
+ --ui-local-elevation-3: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-3);
9423
+ --ui-local-elevation-4: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-4);
9424
+ --ui-local-elevation-5: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-5);
9425
+ --ui-local-elevation-6: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-6);
9426
+ --ui-local-elevation-7: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-7);
9427
+ --ui-local-elevation-8: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-8);
8723
9428
  --ui-surface-level: 0;
8724
9429
  --ui-surface-color: var(--color-surface-0);
8725
9430
  --ui-surface-ink: var(--color-surface-0-ink);
8726
9431
  --ui-surface-ink-muted: var(--color-surface-0-ink-muted);
8727
- --ui-matched-elevation: var(--shadow-elevation-0);
9432
+ --ui-surface-edge: var(--ui-local-surface-0-edge);
9433
+ --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
9434
+ --ui-surface-edge-strong: var(--ui-local-surface-0-edge-strong);
9435
+ --ui-matched-elevation: var(--ui-local-elevation-0);
8728
9436
  background-color: var(--ui-surface-color);
8729
9437
  color: var(--ui-surface-ink);
8730
9438
  --ui-elevation-shadow-layers: var(--shadow-elevation-0);
8731
9439
  --ui-state-shadow-layers: var(--shadow-elevation-0);
8732
9440
  }
9441
+ :where(.light, .dark) {
9442
+ --ui-local-surface-0: var(--color-surface-workspace-0);
9443
+ --ui-local-surface-0-ink: var(--color-surface-workspace-0-ink);
9444
+ --ui-local-surface-0-ink-muted: var(--color-surface-workspace-0-ink-muted);
9445
+ --ui-local-surface-0-edge: var(--color-surface-workspace-0-edge);
9446
+ --ui-local-surface-0-edge-hover: var(--color-surface-workspace-0-edge-hover);
9447
+ --ui-local-surface-0-edge-strong: var(--color-surface-workspace-0-edge-strong);
9448
+ --ui-local-surface-1: var(--color-surface-workspace-1);
9449
+ --ui-local-surface-1-ink: var(--color-surface-workspace-1-ink);
9450
+ --ui-local-surface-1-ink-muted: var(--color-surface-workspace-1-ink-muted);
9451
+ --ui-local-surface-1-edge: var(--color-surface-workspace-1-edge);
9452
+ --ui-local-surface-1-edge-hover: var(--color-surface-workspace-1-edge-hover);
9453
+ --ui-local-surface-1-edge-strong: var(--color-surface-workspace-1-edge-strong);
9454
+ --ui-local-surface-2: var(--color-surface-workspace-2);
9455
+ --ui-local-surface-2-ink: var(--color-surface-workspace-2-ink);
9456
+ --ui-local-surface-2-ink-muted: var(--color-surface-workspace-2-ink-muted);
9457
+ --ui-local-surface-2-edge: var(--color-surface-workspace-2-edge);
9458
+ --ui-local-surface-2-edge-hover: var(--color-surface-workspace-2-edge-hover);
9459
+ --ui-local-surface-2-edge-strong: var(--color-surface-workspace-2-edge-strong);
9460
+ --ui-local-surface-3: var(--color-surface-workspace-3);
9461
+ --ui-local-surface-3-ink: var(--color-surface-workspace-3-ink);
9462
+ --ui-local-surface-3-ink-muted: var(--color-surface-workspace-3-ink-muted);
9463
+ --ui-local-surface-3-edge: var(--color-surface-workspace-3-edge);
9464
+ --ui-local-surface-3-edge-hover: var(--color-surface-workspace-3-edge-hover);
9465
+ --ui-local-surface-3-edge-strong: var(--color-surface-workspace-3-edge-strong);
9466
+ --ui-local-surface-4: var(--color-surface-workspace-4);
9467
+ --ui-local-surface-4-ink: var(--color-surface-workspace-4-ink);
9468
+ --ui-local-surface-4-ink-muted: var(--color-surface-workspace-4-ink-muted);
9469
+ --ui-local-surface-4-edge: var(--color-surface-workspace-4-edge);
9470
+ --ui-local-surface-4-edge-hover: var(--color-surface-workspace-4-edge-hover);
9471
+ --ui-local-surface-4-edge-strong: var(--color-surface-workspace-4-edge-strong);
9472
+ --ui-local-surface-5: var(--color-surface-workspace-5);
9473
+ --ui-local-surface-5-ink: var(--color-surface-workspace-5-ink);
9474
+ --ui-local-surface-5-ink-muted: var(--color-surface-workspace-5-ink-muted);
9475
+ --ui-local-surface-5-edge: var(--color-surface-workspace-5-edge);
9476
+ --ui-local-surface-5-edge-hover: var(--color-surface-workspace-5-edge-hover);
9477
+ --ui-local-surface-5-edge-strong: var(--color-surface-workspace-5-edge-strong);
9478
+ --ui-local-surface-6: var(--color-surface-workspace-6);
9479
+ --ui-local-surface-6-ink: var(--color-surface-workspace-6-ink);
9480
+ --ui-local-surface-6-ink-muted: var(--color-surface-workspace-6-ink-muted);
9481
+ --ui-local-surface-6-edge: var(--color-surface-workspace-6-edge);
9482
+ --ui-local-surface-6-edge-hover: var(--color-surface-workspace-6-edge-hover);
9483
+ --ui-local-surface-6-edge-strong: var(--color-surface-workspace-6-edge-strong);
9484
+ --ui-local-surface-7: var(--color-surface-workspace-7);
9485
+ --ui-local-surface-7-ink: var(--color-surface-workspace-7-ink);
9486
+ --ui-local-surface-7-ink-muted: var(--color-surface-workspace-7-ink-muted);
9487
+ --ui-local-surface-7-edge: var(--color-surface-workspace-7-edge);
9488
+ --ui-local-surface-7-edge-hover: var(--color-surface-workspace-7-edge-hover);
9489
+ --ui-local-surface-7-edge-strong: var(--color-surface-workspace-7-edge-strong);
9490
+ --ui-local-surface-8: var(--color-surface-workspace-8);
9491
+ --ui-local-surface-8-ink: var(--color-surface-workspace-8-ink);
9492
+ --ui-local-surface-8-ink-muted: var(--color-surface-workspace-8-ink-muted);
9493
+ --ui-local-surface-8-edge: var(--color-surface-workspace-8-edge);
9494
+ --ui-local-surface-8-edge-hover: var(--color-surface-workspace-8-edge-hover);
9495
+ --ui-local-surface-8-edge-strong: var(--color-surface-workspace-8-edge-strong);
9496
+ --ui-local-elevation-0: 0 0 0 0 transparent;
9497
+ --ui-local-elevation-1: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-1);
9498
+ --ui-local-elevation-2: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-2);
9499
+ --ui-local-elevation-3: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-3);
9500
+ --ui-local-elevation-4: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-4);
9501
+ --ui-local-elevation-5: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-5);
9502
+ --ui-local-elevation-6: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-6);
9503
+ --ui-local-elevation-7: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-7);
9504
+ --ui-local-elevation-8: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-8);
9505
+ }
9506
+ :where([data-ui-substrate="workspace"]) {
9507
+ --ui-local-surface-0: var(--color-surface-workspace-0);
9508
+ --ui-local-surface-0-ink: var(--color-surface-workspace-0-ink);
9509
+ --ui-local-surface-0-ink-muted: var(--color-surface-workspace-0-ink-muted);
9510
+ --ui-local-surface-0-edge: var(--color-surface-workspace-0-edge);
9511
+ --ui-local-surface-0-edge-hover: var(--color-surface-workspace-0-edge-hover);
9512
+ --ui-local-surface-0-edge-strong: var(--color-surface-workspace-0-edge-strong);
9513
+ --ui-local-surface-1: var(--color-surface-workspace-1);
9514
+ --ui-local-surface-1-ink: var(--color-surface-workspace-1-ink);
9515
+ --ui-local-surface-1-ink-muted: var(--color-surface-workspace-1-ink-muted);
9516
+ --ui-local-surface-1-edge: var(--color-surface-workspace-1-edge);
9517
+ --ui-local-surface-1-edge-hover: var(--color-surface-workspace-1-edge-hover);
9518
+ --ui-local-surface-1-edge-strong: var(--color-surface-workspace-1-edge-strong);
9519
+ --ui-local-surface-2: var(--color-surface-workspace-2);
9520
+ --ui-local-surface-2-ink: var(--color-surface-workspace-2-ink);
9521
+ --ui-local-surface-2-ink-muted: var(--color-surface-workspace-2-ink-muted);
9522
+ --ui-local-surface-2-edge: var(--color-surface-workspace-2-edge);
9523
+ --ui-local-surface-2-edge-hover: var(--color-surface-workspace-2-edge-hover);
9524
+ --ui-local-surface-2-edge-strong: var(--color-surface-workspace-2-edge-strong);
9525
+ --ui-local-surface-3: var(--color-surface-workspace-3);
9526
+ --ui-local-surface-3-ink: var(--color-surface-workspace-3-ink);
9527
+ --ui-local-surface-3-ink-muted: var(--color-surface-workspace-3-ink-muted);
9528
+ --ui-local-surface-3-edge: var(--color-surface-workspace-3-edge);
9529
+ --ui-local-surface-3-edge-hover: var(--color-surface-workspace-3-edge-hover);
9530
+ --ui-local-surface-3-edge-strong: var(--color-surface-workspace-3-edge-strong);
9531
+ --ui-local-surface-4: var(--color-surface-workspace-4);
9532
+ --ui-local-surface-4-ink: var(--color-surface-workspace-4-ink);
9533
+ --ui-local-surface-4-ink-muted: var(--color-surface-workspace-4-ink-muted);
9534
+ --ui-local-surface-4-edge: var(--color-surface-workspace-4-edge);
9535
+ --ui-local-surface-4-edge-hover: var(--color-surface-workspace-4-edge-hover);
9536
+ --ui-local-surface-4-edge-strong: var(--color-surface-workspace-4-edge-strong);
9537
+ --ui-local-surface-5: var(--color-surface-workspace-5);
9538
+ --ui-local-surface-5-ink: var(--color-surface-workspace-5-ink);
9539
+ --ui-local-surface-5-ink-muted: var(--color-surface-workspace-5-ink-muted);
9540
+ --ui-local-surface-5-edge: var(--color-surface-workspace-5-edge);
9541
+ --ui-local-surface-5-edge-hover: var(--color-surface-workspace-5-edge-hover);
9542
+ --ui-local-surface-5-edge-strong: var(--color-surface-workspace-5-edge-strong);
9543
+ --ui-local-surface-6: var(--color-surface-workspace-6);
9544
+ --ui-local-surface-6-ink: var(--color-surface-workspace-6-ink);
9545
+ --ui-local-surface-6-ink-muted: var(--color-surface-workspace-6-ink-muted);
9546
+ --ui-local-surface-6-edge: var(--color-surface-workspace-6-edge);
9547
+ --ui-local-surface-6-edge-hover: var(--color-surface-workspace-6-edge-hover);
9548
+ --ui-local-surface-6-edge-strong: var(--color-surface-workspace-6-edge-strong);
9549
+ --ui-local-surface-7: var(--color-surface-workspace-7);
9550
+ --ui-local-surface-7-ink: var(--color-surface-workspace-7-ink);
9551
+ --ui-local-surface-7-ink-muted: var(--color-surface-workspace-7-ink-muted);
9552
+ --ui-local-surface-7-edge: var(--color-surface-workspace-7-edge);
9553
+ --ui-local-surface-7-edge-hover: var(--color-surface-workspace-7-edge-hover);
9554
+ --ui-local-surface-7-edge-strong: var(--color-surface-workspace-7-edge-strong);
9555
+ --ui-local-surface-8: var(--color-surface-workspace-8);
9556
+ --ui-local-surface-8-ink: var(--color-surface-workspace-8-ink);
9557
+ --ui-local-surface-8-ink-muted: var(--color-surface-workspace-8-ink-muted);
9558
+ --ui-local-surface-8-edge: var(--color-surface-workspace-8-edge);
9559
+ --ui-local-surface-8-edge-hover: var(--color-surface-workspace-8-edge-hover);
9560
+ --ui-local-surface-8-edge-strong: var(--color-surface-workspace-8-edge-strong);
9561
+ --ui-local-elevation-0: 0 0 0 0 transparent;
9562
+ --ui-local-elevation-1: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-1);
9563
+ --ui-local-elevation-2: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-2);
9564
+ --ui-local-elevation-3: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-3);
9565
+ --ui-local-elevation-4: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-4);
9566
+ --ui-local-elevation-5: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-5);
9567
+ --ui-local-elevation-6: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-6);
9568
+ --ui-local-elevation-7: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-7);
9569
+ --ui-local-elevation-8: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-workspace-8);
9570
+ --ui-surface-level: 0;
9571
+ --ui-surface-color: var(--ui-local-surface-0);
9572
+ --ui-surface-ink: var(--ui-local-surface-0-ink);
9573
+ --ui-surface-ink-muted: var(--ui-local-surface-0-ink-muted);
9574
+ --ui-surface-edge: var(--ui-local-surface-0-edge);
9575
+ --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
9576
+ --ui-surface-edge-strong: var(--ui-local-surface-0-edge-strong);
9577
+ --ui-surface-separator: var(--ui-surface-edge);
9578
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9579
+ @supports (color: color-mix(in lab, red, red)) {
9580
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9581
+ }
9582
+ --ui-matched-elevation: var(--ui-local-elevation-0);
9583
+ background-color: var(--ui-surface-color);
9584
+ color: var(--ui-surface-ink);
9585
+ }
9586
+ :where([data-ui-substrate="chrome"]) {
9587
+ --ui-local-surface-0: var(--color-surface-chrome-0);
9588
+ --ui-local-surface-0-ink: var(--color-surface-chrome-0-ink);
9589
+ --ui-local-surface-0-ink-muted: var(--color-surface-chrome-0-ink-muted);
9590
+ --ui-local-surface-0-edge: var(--color-surface-chrome-0-edge);
9591
+ --ui-local-surface-0-edge-hover: var(--color-surface-chrome-0-edge-hover);
9592
+ --ui-local-surface-0-edge-strong: var(--color-surface-chrome-0-edge-strong);
9593
+ --ui-local-surface-1: var(--color-surface-chrome-1);
9594
+ --ui-local-surface-1-ink: var(--color-surface-chrome-1-ink);
9595
+ --ui-local-surface-1-ink-muted: var(--color-surface-chrome-1-ink-muted);
9596
+ --ui-local-surface-1-edge: var(--color-surface-chrome-1-edge);
9597
+ --ui-local-surface-1-edge-hover: var(--color-surface-chrome-1-edge-hover);
9598
+ --ui-local-surface-1-edge-strong: var(--color-surface-chrome-1-edge-strong);
9599
+ --ui-local-surface-2: var(--color-surface-chrome-2);
9600
+ --ui-local-surface-2-ink: var(--color-surface-chrome-2-ink);
9601
+ --ui-local-surface-2-ink-muted: var(--color-surface-chrome-2-ink-muted);
9602
+ --ui-local-surface-2-edge: var(--color-surface-chrome-2-edge);
9603
+ --ui-local-surface-2-edge-hover: var(--color-surface-chrome-2-edge-hover);
9604
+ --ui-local-surface-2-edge-strong: var(--color-surface-chrome-2-edge-strong);
9605
+ --ui-local-surface-3: var(--color-surface-chrome-3);
9606
+ --ui-local-surface-3-ink: var(--color-surface-chrome-3-ink);
9607
+ --ui-local-surface-3-ink-muted: var(--color-surface-chrome-3-ink-muted);
9608
+ --ui-local-surface-3-edge: var(--color-surface-chrome-3-edge);
9609
+ --ui-local-surface-3-edge-hover: var(--color-surface-chrome-3-edge-hover);
9610
+ --ui-local-surface-3-edge-strong: var(--color-surface-chrome-3-edge-strong);
9611
+ --ui-local-surface-4: var(--color-surface-chrome-4);
9612
+ --ui-local-surface-4-ink: var(--color-surface-chrome-4-ink);
9613
+ --ui-local-surface-4-ink-muted: var(--color-surface-chrome-4-ink-muted);
9614
+ --ui-local-surface-4-edge: var(--color-surface-chrome-4-edge);
9615
+ --ui-local-surface-4-edge-hover: var(--color-surface-chrome-4-edge-hover);
9616
+ --ui-local-surface-4-edge-strong: var(--color-surface-chrome-4-edge-strong);
9617
+ --ui-local-surface-5: var(--color-surface-chrome-5);
9618
+ --ui-local-surface-5-ink: var(--color-surface-chrome-5-ink);
9619
+ --ui-local-surface-5-ink-muted: var(--color-surface-chrome-5-ink-muted);
9620
+ --ui-local-surface-5-edge: var(--color-surface-chrome-5-edge);
9621
+ --ui-local-surface-5-edge-hover: var(--color-surface-chrome-5-edge-hover);
9622
+ --ui-local-surface-5-edge-strong: var(--color-surface-chrome-5-edge-strong);
9623
+ --ui-local-surface-6: var(--color-surface-chrome-6);
9624
+ --ui-local-surface-6-ink: var(--color-surface-chrome-6-ink);
9625
+ --ui-local-surface-6-ink-muted: var(--color-surface-chrome-6-ink-muted);
9626
+ --ui-local-surface-6-edge: var(--color-surface-chrome-6-edge);
9627
+ --ui-local-surface-6-edge-hover: var(--color-surface-chrome-6-edge-hover);
9628
+ --ui-local-surface-6-edge-strong: var(--color-surface-chrome-6-edge-strong);
9629
+ --ui-local-surface-7: var(--color-surface-chrome-7);
9630
+ --ui-local-surface-7-ink: var(--color-surface-chrome-7-ink);
9631
+ --ui-local-surface-7-ink-muted: var(--color-surface-chrome-7-ink-muted);
9632
+ --ui-local-surface-7-edge: var(--color-surface-chrome-7-edge);
9633
+ --ui-local-surface-7-edge-hover: var(--color-surface-chrome-7-edge-hover);
9634
+ --ui-local-surface-7-edge-strong: var(--color-surface-chrome-7-edge-strong);
9635
+ --ui-local-surface-8: var(--color-surface-chrome-8);
9636
+ --ui-local-surface-8-ink: var(--color-surface-chrome-8-ink);
9637
+ --ui-local-surface-8-ink-muted: var(--color-surface-chrome-8-ink-muted);
9638
+ --ui-local-surface-8-edge: var(--color-surface-chrome-8-edge);
9639
+ --ui-local-surface-8-edge-hover: var(--color-surface-chrome-8-edge-hover);
9640
+ --ui-local-surface-8-edge-strong: var(--color-surface-chrome-8-edge-strong);
9641
+ --ui-local-elevation-0: 0 0 0 0 transparent;
9642
+ --ui-local-elevation-1: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-1);
9643
+ --ui-local-elevation-2: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-2);
9644
+ --ui-local-elevation-3: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-3);
9645
+ --ui-local-elevation-4: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-4);
9646
+ --ui-local-elevation-5: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-5);
9647
+ --ui-local-elevation-6: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-6);
9648
+ --ui-local-elevation-7: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-7);
9649
+ --ui-local-elevation-8: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge), var(--shadow-depth-chrome-8);
9650
+ --ui-surface-level: 0;
9651
+ --ui-surface-color: var(--ui-local-surface-0);
9652
+ --ui-surface-ink: var(--ui-local-surface-0-ink);
9653
+ --ui-surface-ink-muted: var(--ui-local-surface-0-ink-muted);
9654
+ --ui-surface-edge: var(--ui-local-surface-0-edge);
9655
+ --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
9656
+ --ui-surface-edge-strong: var(--ui-local-surface-0-edge-strong);
9657
+ --ui-surface-separator: var(--ui-surface-edge);
9658
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9659
+ @supports (color: color-mix(in lab, red, red)) {
9660
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9661
+ }
9662
+ --ui-matched-elevation: var(--ui-local-elevation-0);
9663
+ background-color: var(--ui-surface-color);
9664
+ color: var(--ui-surface-ink);
9665
+ }
8733
9666
  :where([data-ui-surface="0"]) {
8734
9667
  --ui-surface-level: 0;
8735
- --ui-surface-color: var(--color-surface-0);
8736
- --ui-surface-ink: var(--color-surface-0-ink);
8737
- --ui-surface-ink-muted: var(--color-surface-0-ink-muted);
8738
- --ui-matched-elevation: var(--shadow-elevation-0);
9668
+ --ui-surface-color: var(--ui-local-surface-0);
9669
+ --ui-surface-ink: var(--ui-local-surface-0-ink);
9670
+ --ui-surface-ink-muted: var(--ui-local-surface-0-ink-muted);
9671
+ --ui-surface-edge: var(--ui-local-surface-0-edge);
9672
+ --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
9673
+ --ui-surface-edge-strong: var(--ui-local-surface-0-edge-strong);
9674
+ --ui-surface-separator: var(--ui-surface-edge);
9675
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9676
+ @supports (color: color-mix(in lab, red, red)) {
9677
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9678
+ }
9679
+ --ui-matched-elevation: var(--ui-local-elevation-0);
8739
9680
  background-color: var(--ui-surface-color);
8740
9681
  color: var(--ui-surface-ink);
8741
9682
  }
8742
9683
  :where([data-ui-surface="1"]) {
8743
9684
  --ui-surface-level: 1;
8744
- --ui-surface-color: var(--color-surface-1);
8745
- --ui-surface-ink: var(--color-surface-1-ink);
8746
- --ui-surface-ink-muted: var(--color-surface-1-ink-muted);
8747
- --ui-matched-elevation: var(--shadow-elevation-1);
9685
+ --ui-surface-color: var(--ui-local-surface-1);
9686
+ --ui-surface-ink: var(--ui-local-surface-1-ink);
9687
+ --ui-surface-ink-muted: var(--ui-local-surface-1-ink-muted);
9688
+ --ui-surface-edge: var(--ui-local-surface-1-edge);
9689
+ --ui-surface-edge-hover: var(--ui-local-surface-1-edge-hover);
9690
+ --ui-surface-edge-strong: var(--ui-local-surface-1-edge-strong);
9691
+ --ui-surface-separator: var(--ui-surface-edge);
9692
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9693
+ @supports (color: color-mix(in lab, red, red)) {
9694
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9695
+ }
9696
+ --ui-matched-elevation: var(--ui-local-elevation-1);
8748
9697
  background-color: var(--ui-surface-color);
8749
9698
  color: var(--ui-surface-ink);
8750
9699
  }
8751
9700
  :where([data-ui-surface="2"]) {
8752
9701
  --ui-surface-level: 2;
8753
- --ui-surface-color: var(--color-surface-2);
8754
- --ui-surface-ink: var(--color-surface-2-ink);
8755
- --ui-surface-ink-muted: var(--color-surface-2-ink-muted);
8756
- --ui-matched-elevation: var(--shadow-elevation-2);
9702
+ --ui-surface-color: var(--ui-local-surface-2);
9703
+ --ui-surface-ink: var(--ui-local-surface-2-ink);
9704
+ --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
9705
+ --ui-surface-edge: var(--ui-local-surface-2-edge);
9706
+ --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
9707
+ --ui-surface-edge-strong: var(--ui-local-surface-2-edge-strong);
9708
+ --ui-surface-separator: var(--ui-surface-edge);
9709
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9710
+ @supports (color: color-mix(in lab, red, red)) {
9711
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9712
+ }
9713
+ --ui-matched-elevation: var(--ui-local-elevation-2);
8757
9714
  background-color: var(--ui-surface-color);
8758
9715
  color: var(--ui-surface-ink);
8759
9716
  }
8760
9717
  :where([data-ui-surface="3"]) {
8761
9718
  --ui-surface-level: 3;
8762
- --ui-surface-color: var(--color-surface-3);
8763
- --ui-surface-ink: var(--color-surface-3-ink);
8764
- --ui-surface-ink-muted: var(--color-surface-3-ink-muted);
8765
- --ui-matched-elevation: var(--shadow-elevation-3);
9719
+ --ui-surface-color: var(--ui-local-surface-3);
9720
+ --ui-surface-ink: var(--ui-local-surface-3-ink);
9721
+ --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
9722
+ --ui-surface-edge: var(--ui-local-surface-3-edge);
9723
+ --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
9724
+ --ui-surface-edge-strong: var(--ui-local-surface-3-edge-strong);
9725
+ --ui-surface-separator: var(--ui-surface-edge);
9726
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9727
+ @supports (color: color-mix(in lab, red, red)) {
9728
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9729
+ }
9730
+ --ui-matched-elevation: var(--ui-local-elevation-3);
8766
9731
  background-color: var(--ui-surface-color);
8767
9732
  color: var(--ui-surface-ink);
8768
9733
  }
8769
9734
  :where([data-ui-surface="4"]) {
8770
9735
  --ui-surface-level: 4;
8771
- --ui-surface-color: var(--color-surface-4);
8772
- --ui-surface-ink: var(--color-surface-4-ink);
8773
- --ui-surface-ink-muted: var(--color-surface-4-ink-muted);
8774
- --ui-matched-elevation: var(--shadow-elevation-4);
9736
+ --ui-surface-color: var(--ui-local-surface-4);
9737
+ --ui-surface-ink: var(--ui-local-surface-4-ink);
9738
+ --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
9739
+ --ui-surface-edge: var(--ui-local-surface-4-edge);
9740
+ --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
9741
+ --ui-surface-edge-strong: var(--ui-local-surface-4-edge-strong);
9742
+ --ui-surface-separator: var(--ui-surface-edge);
9743
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9744
+ @supports (color: color-mix(in lab, red, red)) {
9745
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9746
+ }
9747
+ --ui-matched-elevation: var(--ui-local-elevation-4);
8775
9748
  background-color: var(--ui-surface-color);
8776
9749
  color: var(--ui-surface-ink);
8777
9750
  }
8778
9751
  :where([data-ui-surface="5"]) {
8779
9752
  --ui-surface-level: 5;
8780
- --ui-surface-color: var(--color-surface-5);
8781
- --ui-surface-ink: var(--color-surface-5-ink);
8782
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
8783
- --ui-matched-elevation: var(--shadow-elevation-5);
9753
+ --ui-surface-color: var(--ui-local-surface-5);
9754
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
9755
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
9756
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
9757
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
9758
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
9759
+ --ui-surface-separator: var(--ui-surface-edge);
9760
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9761
+ @supports (color: color-mix(in lab, red, red)) {
9762
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9763
+ }
9764
+ --ui-matched-elevation: var(--ui-local-elevation-5);
8784
9765
  background-color: var(--ui-surface-color);
8785
9766
  color: var(--ui-surface-ink);
8786
9767
  }
8787
9768
  :where([data-ui-surface="6"]) {
8788
9769
  --ui-surface-level: 6;
8789
- --ui-surface-color: var(--color-surface-6);
8790
- --ui-surface-ink: var(--color-surface-6-ink);
8791
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
8792
- --ui-matched-elevation: var(--shadow-elevation-6);
9770
+ --ui-surface-color: var(--ui-local-surface-6);
9771
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
9772
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
9773
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
9774
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
9775
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
9776
+ --ui-surface-separator: var(--ui-surface-edge);
9777
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9778
+ @supports (color: color-mix(in lab, red, red)) {
9779
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9780
+ }
9781
+ --ui-matched-elevation: var(--ui-local-elevation-6);
8793
9782
  background-color: var(--ui-surface-color);
8794
9783
  color: var(--ui-surface-ink);
8795
9784
  }
8796
9785
  :where([data-ui-surface="7"]) {
8797
9786
  --ui-surface-level: 7;
8798
- --ui-surface-color: var(--color-surface-7);
8799
- --ui-surface-ink: var(--color-surface-7-ink);
8800
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
8801
- --ui-matched-elevation: var(--shadow-elevation-7);
9787
+ --ui-surface-color: var(--ui-local-surface-7);
9788
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
9789
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
9790
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
9791
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
9792
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
9793
+ --ui-surface-separator: var(--ui-surface-edge);
9794
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9795
+ @supports (color: color-mix(in lab, red, red)) {
9796
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9797
+ }
9798
+ --ui-matched-elevation: var(--ui-local-elevation-7);
8802
9799
  background-color: var(--ui-surface-color);
8803
9800
  color: var(--ui-surface-ink);
8804
9801
  }
8805
9802
  :where([data-ui-surface="8"]) {
8806
9803
  --ui-surface-level: 8;
8807
- --ui-surface-color: var(--color-surface-8);
8808
- --ui-surface-ink: var(--color-surface-8-ink);
8809
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
8810
- --ui-matched-elevation: var(--shadow-elevation-8);
9804
+ --ui-surface-color: var(--ui-local-surface-8);
9805
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
9806
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
9807
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
9808
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
9809
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
9810
+ --ui-surface-separator: var(--ui-surface-edge);
9811
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9812
+ @supports (color: color-mix(in lab, red, red)) {
9813
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9814
+ }
9815
+ --ui-matched-elevation: var(--ui-local-elevation-8);
8811
9816
  background-color: var(--ui-surface-color);
8812
9817
  color: var(--ui-surface-ink);
8813
9818
  }
8814
9819
  :where([data-ui-surface="+1"]) {
8815
9820
  --ui-surface-level: 1;
8816
- --ui-surface-color: var(--color-surface-1);
8817
- --ui-surface-ink: var(--color-surface-1-ink);
8818
- --ui-surface-ink-muted: var(--color-surface-1-ink-muted);
8819
- --ui-matched-elevation: var(--shadow-elevation-1);
9821
+ --ui-surface-color: var(--ui-local-surface-1);
9822
+ --ui-surface-ink: var(--ui-local-surface-1-ink);
9823
+ --ui-surface-ink-muted: var(--ui-local-surface-1-ink-muted);
9824
+ --ui-surface-edge: var(--ui-local-surface-1-edge);
9825
+ --ui-surface-edge-hover: var(--ui-local-surface-1-edge-hover);
9826
+ --ui-surface-edge-strong: var(--ui-local-surface-1-edge-strong);
9827
+ --ui-surface-separator: var(--ui-surface-edge);
9828
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9829
+ @supports (color: color-mix(in lab, red, red)) {
9830
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9831
+ }
9832
+ --ui-matched-elevation: var(--ui-local-elevation-1);
8820
9833
  background-color: var(--ui-surface-color);
8821
9834
  color: var(--ui-surface-ink);
8822
9835
  }
8823
9836
  :where([data-ui-surface="+2"]) {
8824
9837
  --ui-surface-level: 2;
8825
- --ui-surface-color: var(--color-surface-2);
8826
- --ui-surface-ink: var(--color-surface-2-ink);
8827
- --ui-surface-ink-muted: var(--color-surface-2-ink-muted);
8828
- --ui-matched-elevation: var(--shadow-elevation-2);
9838
+ --ui-surface-color: var(--ui-local-surface-2);
9839
+ --ui-surface-ink: var(--ui-local-surface-2-ink);
9840
+ --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
9841
+ --ui-surface-edge: var(--ui-local-surface-2-edge);
9842
+ --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
9843
+ --ui-surface-edge-strong: var(--ui-local-surface-2-edge-strong);
9844
+ --ui-surface-separator: var(--ui-surface-edge);
9845
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9846
+ @supports (color: color-mix(in lab, red, red)) {
9847
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9848
+ }
9849
+ --ui-matched-elevation: var(--ui-local-elevation-2);
8829
9850
  background-color: var(--ui-surface-color);
8830
9851
  color: var(--ui-surface-ink);
8831
9852
  }
8832
9853
  :where([data-ui-surface="+3"]) {
8833
9854
  --ui-surface-level: 3;
8834
- --ui-surface-color: var(--color-surface-3);
8835
- --ui-surface-ink: var(--color-surface-3-ink);
8836
- --ui-surface-ink-muted: var(--color-surface-3-ink-muted);
8837
- --ui-matched-elevation: var(--shadow-elevation-3);
9855
+ --ui-surface-color: var(--ui-local-surface-3);
9856
+ --ui-surface-ink: var(--ui-local-surface-3-ink);
9857
+ --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
9858
+ --ui-surface-edge: var(--ui-local-surface-3-edge);
9859
+ --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
9860
+ --ui-surface-edge-strong: var(--ui-local-surface-3-edge-strong);
9861
+ --ui-surface-separator: var(--ui-surface-edge);
9862
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9863
+ @supports (color: color-mix(in lab, red, red)) {
9864
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9865
+ }
9866
+ --ui-matched-elevation: var(--ui-local-elevation-3);
8838
9867
  background-color: var(--ui-surface-color);
8839
9868
  color: var(--ui-surface-ink);
8840
9869
  }
8841
9870
  :where([data-ui-surface="+4"]) {
8842
9871
  --ui-surface-level: 4;
8843
- --ui-surface-color: var(--color-surface-4);
8844
- --ui-surface-ink: var(--color-surface-4-ink);
8845
- --ui-surface-ink-muted: var(--color-surface-4-ink-muted);
8846
- --ui-matched-elevation: var(--shadow-elevation-4);
9872
+ --ui-surface-color: var(--ui-local-surface-4);
9873
+ --ui-surface-ink: var(--ui-local-surface-4-ink);
9874
+ --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
9875
+ --ui-surface-edge: var(--ui-local-surface-4-edge);
9876
+ --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
9877
+ --ui-surface-edge-strong: var(--ui-local-surface-4-edge-strong);
9878
+ --ui-surface-separator: var(--ui-surface-edge);
9879
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9880
+ @supports (color: color-mix(in lab, red, red)) {
9881
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9882
+ }
9883
+ --ui-matched-elevation: var(--ui-local-elevation-4);
8847
9884
  background-color: var(--ui-surface-color);
8848
9885
  color: var(--ui-surface-ink);
8849
9886
  }
8850
9887
  :where([data-ui-surface="+5"]) {
8851
9888
  --ui-surface-level: 5;
8852
- --ui-surface-color: var(--color-surface-5);
8853
- --ui-surface-ink: var(--color-surface-5-ink);
8854
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
8855
- --ui-matched-elevation: var(--shadow-elevation-5);
9889
+ --ui-surface-color: var(--ui-local-surface-5);
9890
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
9891
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
9892
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
9893
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
9894
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
9895
+ --ui-surface-separator: var(--ui-surface-edge);
9896
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9897
+ @supports (color: color-mix(in lab, red, red)) {
9898
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9899
+ }
9900
+ --ui-matched-elevation: var(--ui-local-elevation-5);
8856
9901
  background-color: var(--ui-surface-color);
8857
9902
  color: var(--ui-surface-ink);
8858
9903
  }
8859
9904
  :where([data-ui-surface="+6"]) {
8860
9905
  --ui-surface-level: 6;
8861
- --ui-surface-color: var(--color-surface-6);
8862
- --ui-surface-ink: var(--color-surface-6-ink);
8863
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
8864
- --ui-matched-elevation: var(--shadow-elevation-6);
9906
+ --ui-surface-color: var(--ui-local-surface-6);
9907
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
9908
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
9909
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
9910
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
9911
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
9912
+ --ui-surface-separator: var(--ui-surface-edge);
9913
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9914
+ @supports (color: color-mix(in lab, red, red)) {
9915
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9916
+ }
9917
+ --ui-matched-elevation: var(--ui-local-elevation-6);
8865
9918
  background-color: var(--ui-surface-color);
8866
9919
  color: var(--ui-surface-ink);
8867
9920
  }
8868
9921
  :where([data-ui-surface="+7"]) {
8869
9922
  --ui-surface-level: 7;
8870
- --ui-surface-color: var(--color-surface-7);
8871
- --ui-surface-ink: var(--color-surface-7-ink);
8872
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
8873
- --ui-matched-elevation: var(--shadow-elevation-7);
9923
+ --ui-surface-color: var(--ui-local-surface-7);
9924
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
9925
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
9926
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
9927
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
9928
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
9929
+ --ui-surface-separator: var(--ui-surface-edge);
9930
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9931
+ @supports (color: color-mix(in lab, red, red)) {
9932
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9933
+ }
9934
+ --ui-matched-elevation: var(--ui-local-elevation-7);
8874
9935
  background-color: var(--ui-surface-color);
8875
9936
  color: var(--ui-surface-ink);
8876
9937
  }
8877
9938
  :where([data-ui-surface="+8"]) {
8878
9939
  --ui-surface-level: 8;
8879
- --ui-surface-color: var(--color-surface-8);
8880
- --ui-surface-ink: var(--color-surface-8-ink);
8881
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
8882
- --ui-matched-elevation: var(--shadow-elevation-8);
9940
+ --ui-surface-color: var(--ui-local-surface-8);
9941
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
9942
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
9943
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
9944
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
9945
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
9946
+ --ui-surface-separator: var(--ui-surface-edge);
9947
+ --ui-surface-separator-muted: var(--ui-surface-edge);
9948
+ @supports (color: color-mix(in lab, red, red)) {
9949
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
9950
+ }
9951
+ --ui-matched-elevation: var(--ui-local-elevation-8);
8883
9952
  background-color: var(--ui-surface-color);
8884
9953
  color: var(--ui-surface-ink);
8885
9954
  }
@@ -8921,10 +9990,18 @@
8921
9990
  @container style(--ui-surface-level: 0) {
8922
9991
  :where([data-ui-surface="+1"]) {
8923
9992
  --ui-surface-level: 1;
8924
- --ui-surface-color: var(--color-surface-1);
8925
- --ui-surface-ink: var(--color-surface-1-ink);
8926
- --ui-surface-ink-muted: var(--color-surface-1-ink-muted);
8927
- --ui-matched-elevation: var(--shadow-elevation-1);
9993
+ --ui-surface-color: var(--ui-local-surface-1);
9994
+ --ui-surface-ink: var(--ui-local-surface-1-ink);
9995
+ --ui-surface-ink-muted: var(--ui-local-surface-1-ink-muted);
9996
+ --ui-surface-edge: var(--ui-local-surface-1-edge);
9997
+ --ui-surface-edge-hover: var(--ui-local-surface-1-edge-hover);
9998
+ --ui-surface-edge-strong: var(--ui-local-surface-1-edge-strong);
9999
+ --ui-surface-separator: var(--ui-surface-edge);
10000
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10001
+ @supports (color: color-mix(in lab, red, red)) {
10002
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10003
+ }
10004
+ --ui-matched-elevation: var(--ui-local-elevation-1);
8928
10005
  background-color: var(--ui-surface-color);
8929
10006
  color: var(--ui-surface-ink);
8930
10007
  }
@@ -8932,10 +10009,18 @@
8932
10009
  @container style(--ui-surface-level: 0) {
8933
10010
  :where([data-ui-surface="+2"]) {
8934
10011
  --ui-surface-level: 2;
8935
- --ui-surface-color: var(--color-surface-2);
8936
- --ui-surface-ink: var(--color-surface-2-ink);
8937
- --ui-surface-ink-muted: var(--color-surface-2-ink-muted);
8938
- --ui-matched-elevation: var(--shadow-elevation-2);
10012
+ --ui-surface-color: var(--ui-local-surface-2);
10013
+ --ui-surface-ink: var(--ui-local-surface-2-ink);
10014
+ --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
10015
+ --ui-surface-edge: var(--ui-local-surface-2-edge);
10016
+ --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
10017
+ --ui-surface-edge-strong: var(--ui-local-surface-2-edge-strong);
10018
+ --ui-surface-separator: var(--ui-surface-edge);
10019
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10020
+ @supports (color: color-mix(in lab, red, red)) {
10021
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10022
+ }
10023
+ --ui-matched-elevation: var(--ui-local-elevation-2);
8939
10024
  background-color: var(--ui-surface-color);
8940
10025
  color: var(--ui-surface-ink);
8941
10026
  }
@@ -8943,10 +10028,18 @@
8943
10028
  @container style(--ui-surface-level: 0) {
8944
10029
  :where([data-ui-surface="+3"]) {
8945
10030
  --ui-surface-level: 3;
8946
- --ui-surface-color: var(--color-surface-3);
8947
- --ui-surface-ink: var(--color-surface-3-ink);
8948
- --ui-surface-ink-muted: var(--color-surface-3-ink-muted);
8949
- --ui-matched-elevation: var(--shadow-elevation-3);
10031
+ --ui-surface-color: var(--ui-local-surface-3);
10032
+ --ui-surface-ink: var(--ui-local-surface-3-ink);
10033
+ --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
10034
+ --ui-surface-edge: var(--ui-local-surface-3-edge);
10035
+ --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
10036
+ --ui-surface-edge-strong: var(--ui-local-surface-3-edge-strong);
10037
+ --ui-surface-separator: var(--ui-surface-edge);
10038
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10039
+ @supports (color: color-mix(in lab, red, red)) {
10040
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10041
+ }
10042
+ --ui-matched-elevation: var(--ui-local-elevation-3);
8950
10043
  background-color: var(--ui-surface-color);
8951
10044
  color: var(--ui-surface-ink);
8952
10045
  }
@@ -8954,10 +10047,18 @@
8954
10047
  @container style(--ui-surface-level: 0) {
8955
10048
  :where([data-ui-surface="+4"]) {
8956
10049
  --ui-surface-level: 4;
8957
- --ui-surface-color: var(--color-surface-4);
8958
- --ui-surface-ink: var(--color-surface-4-ink);
8959
- --ui-surface-ink-muted: var(--color-surface-4-ink-muted);
8960
- --ui-matched-elevation: var(--shadow-elevation-4);
10050
+ --ui-surface-color: var(--ui-local-surface-4);
10051
+ --ui-surface-ink: var(--ui-local-surface-4-ink);
10052
+ --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
10053
+ --ui-surface-edge: var(--ui-local-surface-4-edge);
10054
+ --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
10055
+ --ui-surface-edge-strong: var(--ui-local-surface-4-edge-strong);
10056
+ --ui-surface-separator: var(--ui-surface-edge);
10057
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10058
+ @supports (color: color-mix(in lab, red, red)) {
10059
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10060
+ }
10061
+ --ui-matched-elevation: var(--ui-local-elevation-4);
8961
10062
  background-color: var(--ui-surface-color);
8962
10063
  color: var(--ui-surface-ink);
8963
10064
  }
@@ -8965,10 +10066,18 @@
8965
10066
  @container style(--ui-surface-level: 0) {
8966
10067
  :where([data-ui-surface="+5"]) {
8967
10068
  --ui-surface-level: 5;
8968
- --ui-surface-color: var(--color-surface-5);
8969
- --ui-surface-ink: var(--color-surface-5-ink);
8970
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
8971
- --ui-matched-elevation: var(--shadow-elevation-5);
10069
+ --ui-surface-color: var(--ui-local-surface-5);
10070
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
10071
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
10072
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
10073
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
10074
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
10075
+ --ui-surface-separator: var(--ui-surface-edge);
10076
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10077
+ @supports (color: color-mix(in lab, red, red)) {
10078
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10079
+ }
10080
+ --ui-matched-elevation: var(--ui-local-elevation-5);
8972
10081
  background-color: var(--ui-surface-color);
8973
10082
  color: var(--ui-surface-ink);
8974
10083
  }
@@ -8976,10 +10085,18 @@
8976
10085
  @container style(--ui-surface-level: 0) {
8977
10086
  :where([data-ui-surface="+6"]) {
8978
10087
  --ui-surface-level: 6;
8979
- --ui-surface-color: var(--color-surface-6);
8980
- --ui-surface-ink: var(--color-surface-6-ink);
8981
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
8982
- --ui-matched-elevation: var(--shadow-elevation-6);
10088
+ --ui-surface-color: var(--ui-local-surface-6);
10089
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
10090
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
10091
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
10092
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
10093
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
10094
+ --ui-surface-separator: var(--ui-surface-edge);
10095
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10096
+ @supports (color: color-mix(in lab, red, red)) {
10097
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10098
+ }
10099
+ --ui-matched-elevation: var(--ui-local-elevation-6);
8983
10100
  background-color: var(--ui-surface-color);
8984
10101
  color: var(--ui-surface-ink);
8985
10102
  }
@@ -8987,10 +10104,18 @@
8987
10104
  @container style(--ui-surface-level: 0) {
8988
10105
  :where([data-ui-surface="+7"]) {
8989
10106
  --ui-surface-level: 7;
8990
- --ui-surface-color: var(--color-surface-7);
8991
- --ui-surface-ink: var(--color-surface-7-ink);
8992
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
8993
- --ui-matched-elevation: var(--shadow-elevation-7);
10107
+ --ui-surface-color: var(--ui-local-surface-7);
10108
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10109
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10110
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10111
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10112
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10113
+ --ui-surface-separator: var(--ui-surface-edge);
10114
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10115
+ @supports (color: color-mix(in lab, red, red)) {
10116
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10117
+ }
10118
+ --ui-matched-elevation: var(--ui-local-elevation-7);
8994
10119
  background-color: var(--ui-surface-color);
8995
10120
  color: var(--ui-surface-ink);
8996
10121
  }
@@ -8998,10 +10123,18 @@
8998
10123
  @container style(--ui-surface-level: 0) {
8999
10124
  :where([data-ui-surface="+8"]) {
9000
10125
  --ui-surface-level: 8;
9001
- --ui-surface-color: var(--color-surface-8);
9002
- --ui-surface-ink: var(--color-surface-8-ink);
9003
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9004
- --ui-matched-elevation: var(--shadow-elevation-8);
10126
+ --ui-surface-color: var(--ui-local-surface-8);
10127
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10128
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10129
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10130
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10131
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10132
+ --ui-surface-separator: var(--ui-surface-edge);
10133
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10134
+ @supports (color: color-mix(in lab, red, red)) {
10135
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10136
+ }
10137
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9005
10138
  background-color: var(--ui-surface-color);
9006
10139
  color: var(--ui-surface-ink);
9007
10140
  }
@@ -9009,10 +10142,18 @@
9009
10142
  @container style(--ui-surface-level: 1) {
9010
10143
  :where([data-ui-surface="+1"]) {
9011
10144
  --ui-surface-level: 2;
9012
- --ui-surface-color: var(--color-surface-2);
9013
- --ui-surface-ink: var(--color-surface-2-ink);
9014
- --ui-surface-ink-muted: var(--color-surface-2-ink-muted);
9015
- --ui-matched-elevation: var(--shadow-elevation-2);
10145
+ --ui-surface-color: var(--ui-local-surface-2);
10146
+ --ui-surface-ink: var(--ui-local-surface-2-ink);
10147
+ --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
10148
+ --ui-surface-edge: var(--ui-local-surface-2-edge);
10149
+ --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
10150
+ --ui-surface-edge-strong: var(--ui-local-surface-2-edge-strong);
10151
+ --ui-surface-separator: var(--ui-surface-edge);
10152
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10153
+ @supports (color: color-mix(in lab, red, red)) {
10154
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10155
+ }
10156
+ --ui-matched-elevation: var(--ui-local-elevation-2);
9016
10157
  background-color: var(--ui-surface-color);
9017
10158
  color: var(--ui-surface-ink);
9018
10159
  }
@@ -9020,10 +10161,18 @@
9020
10161
  @container style(--ui-surface-level: 1) {
9021
10162
  :where([data-ui-surface="+2"]) {
9022
10163
  --ui-surface-level: 3;
9023
- --ui-surface-color: var(--color-surface-3);
9024
- --ui-surface-ink: var(--color-surface-3-ink);
9025
- --ui-surface-ink-muted: var(--color-surface-3-ink-muted);
9026
- --ui-matched-elevation: var(--shadow-elevation-3);
10164
+ --ui-surface-color: var(--ui-local-surface-3);
10165
+ --ui-surface-ink: var(--ui-local-surface-3-ink);
10166
+ --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
10167
+ --ui-surface-edge: var(--ui-local-surface-3-edge);
10168
+ --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
10169
+ --ui-surface-edge-strong: var(--ui-local-surface-3-edge-strong);
10170
+ --ui-surface-separator: var(--ui-surface-edge);
10171
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10172
+ @supports (color: color-mix(in lab, red, red)) {
10173
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10174
+ }
10175
+ --ui-matched-elevation: var(--ui-local-elevation-3);
9027
10176
  background-color: var(--ui-surface-color);
9028
10177
  color: var(--ui-surface-ink);
9029
10178
  }
@@ -9031,10 +10180,18 @@
9031
10180
  @container style(--ui-surface-level: 1) {
9032
10181
  :where([data-ui-surface="+3"]) {
9033
10182
  --ui-surface-level: 4;
9034
- --ui-surface-color: var(--color-surface-4);
9035
- --ui-surface-ink: var(--color-surface-4-ink);
9036
- --ui-surface-ink-muted: var(--color-surface-4-ink-muted);
9037
- --ui-matched-elevation: var(--shadow-elevation-4);
10183
+ --ui-surface-color: var(--ui-local-surface-4);
10184
+ --ui-surface-ink: var(--ui-local-surface-4-ink);
10185
+ --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
10186
+ --ui-surface-edge: var(--ui-local-surface-4-edge);
10187
+ --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
10188
+ --ui-surface-edge-strong: var(--ui-local-surface-4-edge-strong);
10189
+ --ui-surface-separator: var(--ui-surface-edge);
10190
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10191
+ @supports (color: color-mix(in lab, red, red)) {
10192
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10193
+ }
10194
+ --ui-matched-elevation: var(--ui-local-elevation-4);
9038
10195
  background-color: var(--ui-surface-color);
9039
10196
  color: var(--ui-surface-ink);
9040
10197
  }
@@ -9042,10 +10199,18 @@
9042
10199
  @container style(--ui-surface-level: 1) {
9043
10200
  :where([data-ui-surface="+4"]) {
9044
10201
  --ui-surface-level: 5;
9045
- --ui-surface-color: var(--color-surface-5);
9046
- --ui-surface-ink: var(--color-surface-5-ink);
9047
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
9048
- --ui-matched-elevation: var(--shadow-elevation-5);
10202
+ --ui-surface-color: var(--ui-local-surface-5);
10203
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
10204
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
10205
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
10206
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
10207
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
10208
+ --ui-surface-separator: var(--ui-surface-edge);
10209
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10210
+ @supports (color: color-mix(in lab, red, red)) {
10211
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10212
+ }
10213
+ --ui-matched-elevation: var(--ui-local-elevation-5);
9049
10214
  background-color: var(--ui-surface-color);
9050
10215
  color: var(--ui-surface-ink);
9051
10216
  }
@@ -9053,10 +10218,18 @@
9053
10218
  @container style(--ui-surface-level: 1) {
9054
10219
  :where([data-ui-surface="+5"]) {
9055
10220
  --ui-surface-level: 6;
9056
- --ui-surface-color: var(--color-surface-6);
9057
- --ui-surface-ink: var(--color-surface-6-ink);
9058
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
9059
- --ui-matched-elevation: var(--shadow-elevation-6);
10221
+ --ui-surface-color: var(--ui-local-surface-6);
10222
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
10223
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
10224
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
10225
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
10226
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
10227
+ --ui-surface-separator: var(--ui-surface-edge);
10228
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10229
+ @supports (color: color-mix(in lab, red, red)) {
10230
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10231
+ }
10232
+ --ui-matched-elevation: var(--ui-local-elevation-6);
9060
10233
  background-color: var(--ui-surface-color);
9061
10234
  color: var(--ui-surface-ink);
9062
10235
  }
@@ -9064,10 +10237,18 @@
9064
10237
  @container style(--ui-surface-level: 1) {
9065
10238
  :where([data-ui-surface="+6"]) {
9066
10239
  --ui-surface-level: 7;
9067
- --ui-surface-color: var(--color-surface-7);
9068
- --ui-surface-ink: var(--color-surface-7-ink);
9069
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
9070
- --ui-matched-elevation: var(--shadow-elevation-7);
10240
+ --ui-surface-color: var(--ui-local-surface-7);
10241
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10242
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10243
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10244
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10245
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10246
+ --ui-surface-separator: var(--ui-surface-edge);
10247
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10248
+ @supports (color: color-mix(in lab, red, red)) {
10249
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10250
+ }
10251
+ --ui-matched-elevation: var(--ui-local-elevation-7);
9071
10252
  background-color: var(--ui-surface-color);
9072
10253
  color: var(--ui-surface-ink);
9073
10254
  }
@@ -9075,10 +10256,18 @@
9075
10256
  @container style(--ui-surface-level: 1) {
9076
10257
  :where([data-ui-surface="+7"]) {
9077
10258
  --ui-surface-level: 8;
9078
- --ui-surface-color: var(--color-surface-8);
9079
- --ui-surface-ink: var(--color-surface-8-ink);
9080
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9081
- --ui-matched-elevation: var(--shadow-elevation-8);
10259
+ --ui-surface-color: var(--ui-local-surface-8);
10260
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10261
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10262
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10263
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10264
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10265
+ --ui-surface-separator: var(--ui-surface-edge);
10266
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10267
+ @supports (color: color-mix(in lab, red, red)) {
10268
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10269
+ }
10270
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9082
10271
  background-color: var(--ui-surface-color);
9083
10272
  color: var(--ui-surface-ink);
9084
10273
  }
@@ -9086,10 +10275,18 @@
9086
10275
  @container style(--ui-surface-level: 1) {
9087
10276
  :where([data-ui-surface="+8"]) {
9088
10277
  --ui-surface-level: 8;
9089
- --ui-surface-color: var(--color-surface-8);
9090
- --ui-surface-ink: var(--color-surface-8-ink);
9091
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9092
- --ui-matched-elevation: var(--shadow-elevation-8);
10278
+ --ui-surface-color: var(--ui-local-surface-8);
10279
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10280
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10281
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10282
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10283
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10284
+ --ui-surface-separator: var(--ui-surface-edge);
10285
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10286
+ @supports (color: color-mix(in lab, red, red)) {
10287
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10288
+ }
10289
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9093
10290
  background-color: var(--ui-surface-color);
9094
10291
  color: var(--ui-surface-ink);
9095
10292
  }
@@ -9097,10 +10294,18 @@
9097
10294
  @container style(--ui-surface-level: 2) {
9098
10295
  :where([data-ui-surface="+1"]) {
9099
10296
  --ui-surface-level: 3;
9100
- --ui-surface-color: var(--color-surface-3);
9101
- --ui-surface-ink: var(--color-surface-3-ink);
9102
- --ui-surface-ink-muted: var(--color-surface-3-ink-muted);
9103
- --ui-matched-elevation: var(--shadow-elevation-3);
10297
+ --ui-surface-color: var(--ui-local-surface-3);
10298
+ --ui-surface-ink: var(--ui-local-surface-3-ink);
10299
+ --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
10300
+ --ui-surface-edge: var(--ui-local-surface-3-edge);
10301
+ --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
10302
+ --ui-surface-edge-strong: var(--ui-local-surface-3-edge-strong);
10303
+ --ui-surface-separator: var(--ui-surface-edge);
10304
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10305
+ @supports (color: color-mix(in lab, red, red)) {
10306
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10307
+ }
10308
+ --ui-matched-elevation: var(--ui-local-elevation-3);
9104
10309
  background-color: var(--ui-surface-color);
9105
10310
  color: var(--ui-surface-ink);
9106
10311
  }
@@ -9108,10 +10313,18 @@
9108
10313
  @container style(--ui-surface-level: 2) {
9109
10314
  :where([data-ui-surface="+2"]) {
9110
10315
  --ui-surface-level: 4;
9111
- --ui-surface-color: var(--color-surface-4);
9112
- --ui-surface-ink: var(--color-surface-4-ink);
9113
- --ui-surface-ink-muted: var(--color-surface-4-ink-muted);
9114
- --ui-matched-elevation: var(--shadow-elevation-4);
10316
+ --ui-surface-color: var(--ui-local-surface-4);
10317
+ --ui-surface-ink: var(--ui-local-surface-4-ink);
10318
+ --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
10319
+ --ui-surface-edge: var(--ui-local-surface-4-edge);
10320
+ --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
10321
+ --ui-surface-edge-strong: var(--ui-local-surface-4-edge-strong);
10322
+ --ui-surface-separator: var(--ui-surface-edge);
10323
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10324
+ @supports (color: color-mix(in lab, red, red)) {
10325
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10326
+ }
10327
+ --ui-matched-elevation: var(--ui-local-elevation-4);
9115
10328
  background-color: var(--ui-surface-color);
9116
10329
  color: var(--ui-surface-ink);
9117
10330
  }
@@ -9119,10 +10332,18 @@
9119
10332
  @container style(--ui-surface-level: 2) {
9120
10333
  :where([data-ui-surface="+3"]) {
9121
10334
  --ui-surface-level: 5;
9122
- --ui-surface-color: var(--color-surface-5);
9123
- --ui-surface-ink: var(--color-surface-5-ink);
9124
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
9125
- --ui-matched-elevation: var(--shadow-elevation-5);
10335
+ --ui-surface-color: var(--ui-local-surface-5);
10336
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
10337
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
10338
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
10339
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
10340
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
10341
+ --ui-surface-separator: var(--ui-surface-edge);
10342
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10343
+ @supports (color: color-mix(in lab, red, red)) {
10344
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10345
+ }
10346
+ --ui-matched-elevation: var(--ui-local-elevation-5);
9126
10347
  background-color: var(--ui-surface-color);
9127
10348
  color: var(--ui-surface-ink);
9128
10349
  }
@@ -9130,10 +10351,18 @@
9130
10351
  @container style(--ui-surface-level: 2) {
9131
10352
  :where([data-ui-surface="+4"]) {
9132
10353
  --ui-surface-level: 6;
9133
- --ui-surface-color: var(--color-surface-6);
9134
- --ui-surface-ink: var(--color-surface-6-ink);
9135
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
9136
- --ui-matched-elevation: var(--shadow-elevation-6);
10354
+ --ui-surface-color: var(--ui-local-surface-6);
10355
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
10356
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
10357
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
10358
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
10359
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
10360
+ --ui-surface-separator: var(--ui-surface-edge);
10361
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10362
+ @supports (color: color-mix(in lab, red, red)) {
10363
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10364
+ }
10365
+ --ui-matched-elevation: var(--ui-local-elevation-6);
9137
10366
  background-color: var(--ui-surface-color);
9138
10367
  color: var(--ui-surface-ink);
9139
10368
  }
@@ -9141,10 +10370,18 @@
9141
10370
  @container style(--ui-surface-level: 2) {
9142
10371
  :where([data-ui-surface="+5"]) {
9143
10372
  --ui-surface-level: 7;
9144
- --ui-surface-color: var(--color-surface-7);
9145
- --ui-surface-ink: var(--color-surface-7-ink);
9146
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
9147
- --ui-matched-elevation: var(--shadow-elevation-7);
10373
+ --ui-surface-color: var(--ui-local-surface-7);
10374
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10375
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10376
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10377
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10378
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10379
+ --ui-surface-separator: var(--ui-surface-edge);
10380
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10381
+ @supports (color: color-mix(in lab, red, red)) {
10382
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10383
+ }
10384
+ --ui-matched-elevation: var(--ui-local-elevation-7);
9148
10385
  background-color: var(--ui-surface-color);
9149
10386
  color: var(--ui-surface-ink);
9150
10387
  }
@@ -9152,10 +10389,18 @@
9152
10389
  @container style(--ui-surface-level: 2) {
9153
10390
  :where([data-ui-surface="+6"]) {
9154
10391
  --ui-surface-level: 8;
9155
- --ui-surface-color: var(--color-surface-8);
9156
- --ui-surface-ink: var(--color-surface-8-ink);
9157
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9158
- --ui-matched-elevation: var(--shadow-elevation-8);
10392
+ --ui-surface-color: var(--ui-local-surface-8);
10393
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10394
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10395
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10396
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10397
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10398
+ --ui-surface-separator: var(--ui-surface-edge);
10399
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10400
+ @supports (color: color-mix(in lab, red, red)) {
10401
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10402
+ }
10403
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9159
10404
  background-color: var(--ui-surface-color);
9160
10405
  color: var(--ui-surface-ink);
9161
10406
  }
@@ -9163,10 +10408,18 @@
9163
10408
  @container style(--ui-surface-level: 2) {
9164
10409
  :where([data-ui-surface="+7"]) {
9165
10410
  --ui-surface-level: 8;
9166
- --ui-surface-color: var(--color-surface-8);
9167
- --ui-surface-ink: var(--color-surface-8-ink);
9168
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9169
- --ui-matched-elevation: var(--shadow-elevation-8);
10411
+ --ui-surface-color: var(--ui-local-surface-8);
10412
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10413
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10414
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10415
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10416
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10417
+ --ui-surface-separator: var(--ui-surface-edge);
10418
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10419
+ @supports (color: color-mix(in lab, red, red)) {
10420
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10421
+ }
10422
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9170
10423
  background-color: var(--ui-surface-color);
9171
10424
  color: var(--ui-surface-ink);
9172
10425
  }
@@ -9174,10 +10427,18 @@
9174
10427
  @container style(--ui-surface-level: 2) {
9175
10428
  :where([data-ui-surface="+8"]) {
9176
10429
  --ui-surface-level: 8;
9177
- --ui-surface-color: var(--color-surface-8);
9178
- --ui-surface-ink: var(--color-surface-8-ink);
9179
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9180
- --ui-matched-elevation: var(--shadow-elevation-8);
10430
+ --ui-surface-color: var(--ui-local-surface-8);
10431
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10432
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10433
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10434
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10435
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10436
+ --ui-surface-separator: var(--ui-surface-edge);
10437
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10438
+ @supports (color: color-mix(in lab, red, red)) {
10439
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10440
+ }
10441
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9181
10442
  background-color: var(--ui-surface-color);
9182
10443
  color: var(--ui-surface-ink);
9183
10444
  }
@@ -9185,10 +10446,18 @@
9185
10446
  @container style(--ui-surface-level: 3) {
9186
10447
  :where([data-ui-surface="+1"]) {
9187
10448
  --ui-surface-level: 4;
9188
- --ui-surface-color: var(--color-surface-4);
9189
- --ui-surface-ink: var(--color-surface-4-ink);
9190
- --ui-surface-ink-muted: var(--color-surface-4-ink-muted);
9191
- --ui-matched-elevation: var(--shadow-elevation-4);
10449
+ --ui-surface-color: var(--ui-local-surface-4);
10450
+ --ui-surface-ink: var(--ui-local-surface-4-ink);
10451
+ --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
10452
+ --ui-surface-edge: var(--ui-local-surface-4-edge);
10453
+ --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
10454
+ --ui-surface-edge-strong: var(--ui-local-surface-4-edge-strong);
10455
+ --ui-surface-separator: var(--ui-surface-edge);
10456
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10457
+ @supports (color: color-mix(in lab, red, red)) {
10458
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10459
+ }
10460
+ --ui-matched-elevation: var(--ui-local-elevation-4);
9192
10461
  background-color: var(--ui-surface-color);
9193
10462
  color: var(--ui-surface-ink);
9194
10463
  }
@@ -9196,10 +10465,18 @@
9196
10465
  @container style(--ui-surface-level: 3) {
9197
10466
  :where([data-ui-surface="+2"]) {
9198
10467
  --ui-surface-level: 5;
9199
- --ui-surface-color: var(--color-surface-5);
9200
- --ui-surface-ink: var(--color-surface-5-ink);
9201
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
9202
- --ui-matched-elevation: var(--shadow-elevation-5);
10468
+ --ui-surface-color: var(--ui-local-surface-5);
10469
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
10470
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
10471
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
10472
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
10473
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
10474
+ --ui-surface-separator: var(--ui-surface-edge);
10475
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10476
+ @supports (color: color-mix(in lab, red, red)) {
10477
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10478
+ }
10479
+ --ui-matched-elevation: var(--ui-local-elevation-5);
9203
10480
  background-color: var(--ui-surface-color);
9204
10481
  color: var(--ui-surface-ink);
9205
10482
  }
@@ -9207,10 +10484,18 @@
9207
10484
  @container style(--ui-surface-level: 3) {
9208
10485
  :where([data-ui-surface="+3"]) {
9209
10486
  --ui-surface-level: 6;
9210
- --ui-surface-color: var(--color-surface-6);
9211
- --ui-surface-ink: var(--color-surface-6-ink);
9212
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
9213
- --ui-matched-elevation: var(--shadow-elevation-6);
10487
+ --ui-surface-color: var(--ui-local-surface-6);
10488
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
10489
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
10490
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
10491
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
10492
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
10493
+ --ui-surface-separator: var(--ui-surface-edge);
10494
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10495
+ @supports (color: color-mix(in lab, red, red)) {
10496
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10497
+ }
10498
+ --ui-matched-elevation: var(--ui-local-elevation-6);
9214
10499
  background-color: var(--ui-surface-color);
9215
10500
  color: var(--ui-surface-ink);
9216
10501
  }
@@ -9218,10 +10503,18 @@
9218
10503
  @container style(--ui-surface-level: 3) {
9219
10504
  :where([data-ui-surface="+4"]) {
9220
10505
  --ui-surface-level: 7;
9221
- --ui-surface-color: var(--color-surface-7);
9222
- --ui-surface-ink: var(--color-surface-7-ink);
9223
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
9224
- --ui-matched-elevation: var(--shadow-elevation-7);
10506
+ --ui-surface-color: var(--ui-local-surface-7);
10507
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10508
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10509
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10510
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10511
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10512
+ --ui-surface-separator: var(--ui-surface-edge);
10513
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10514
+ @supports (color: color-mix(in lab, red, red)) {
10515
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10516
+ }
10517
+ --ui-matched-elevation: var(--ui-local-elevation-7);
9225
10518
  background-color: var(--ui-surface-color);
9226
10519
  color: var(--ui-surface-ink);
9227
10520
  }
@@ -9229,10 +10522,18 @@
9229
10522
  @container style(--ui-surface-level: 3) {
9230
10523
  :where([data-ui-surface="+5"]) {
9231
10524
  --ui-surface-level: 8;
9232
- --ui-surface-color: var(--color-surface-8);
9233
- --ui-surface-ink: var(--color-surface-8-ink);
9234
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9235
- --ui-matched-elevation: var(--shadow-elevation-8);
10525
+ --ui-surface-color: var(--ui-local-surface-8);
10526
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10527
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10528
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10529
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10530
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10531
+ --ui-surface-separator: var(--ui-surface-edge);
10532
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10533
+ @supports (color: color-mix(in lab, red, red)) {
10534
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10535
+ }
10536
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9236
10537
  background-color: var(--ui-surface-color);
9237
10538
  color: var(--ui-surface-ink);
9238
10539
  }
@@ -9240,10 +10541,18 @@
9240
10541
  @container style(--ui-surface-level: 3) {
9241
10542
  :where([data-ui-surface="+6"]) {
9242
10543
  --ui-surface-level: 8;
9243
- --ui-surface-color: var(--color-surface-8);
9244
- --ui-surface-ink: var(--color-surface-8-ink);
9245
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9246
- --ui-matched-elevation: var(--shadow-elevation-8);
10544
+ --ui-surface-color: var(--ui-local-surface-8);
10545
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10546
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10547
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10548
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10549
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10550
+ --ui-surface-separator: var(--ui-surface-edge);
10551
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10552
+ @supports (color: color-mix(in lab, red, red)) {
10553
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10554
+ }
10555
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9247
10556
  background-color: var(--ui-surface-color);
9248
10557
  color: var(--ui-surface-ink);
9249
10558
  }
@@ -9251,10 +10560,18 @@
9251
10560
  @container style(--ui-surface-level: 3) {
9252
10561
  :where([data-ui-surface="+7"]) {
9253
10562
  --ui-surface-level: 8;
9254
- --ui-surface-color: var(--color-surface-8);
9255
- --ui-surface-ink: var(--color-surface-8-ink);
9256
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9257
- --ui-matched-elevation: var(--shadow-elevation-8);
10563
+ --ui-surface-color: var(--ui-local-surface-8);
10564
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10565
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10566
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10567
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10568
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10569
+ --ui-surface-separator: var(--ui-surface-edge);
10570
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10571
+ @supports (color: color-mix(in lab, red, red)) {
10572
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10573
+ }
10574
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9258
10575
  background-color: var(--ui-surface-color);
9259
10576
  color: var(--ui-surface-ink);
9260
10577
  }
@@ -9262,10 +10579,18 @@
9262
10579
  @container style(--ui-surface-level: 3) {
9263
10580
  :where([data-ui-surface="+8"]) {
9264
10581
  --ui-surface-level: 8;
9265
- --ui-surface-color: var(--color-surface-8);
9266
- --ui-surface-ink: var(--color-surface-8-ink);
9267
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9268
- --ui-matched-elevation: var(--shadow-elevation-8);
10582
+ --ui-surface-color: var(--ui-local-surface-8);
10583
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10584
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10585
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10586
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10587
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10588
+ --ui-surface-separator: var(--ui-surface-edge);
10589
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10590
+ @supports (color: color-mix(in lab, red, red)) {
10591
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10592
+ }
10593
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9269
10594
  background-color: var(--ui-surface-color);
9270
10595
  color: var(--ui-surface-ink);
9271
10596
  }
@@ -9273,10 +10598,18 @@
9273
10598
  @container style(--ui-surface-level: 4) {
9274
10599
  :where([data-ui-surface="+1"]) {
9275
10600
  --ui-surface-level: 5;
9276
- --ui-surface-color: var(--color-surface-5);
9277
- --ui-surface-ink: var(--color-surface-5-ink);
9278
- --ui-surface-ink-muted: var(--color-surface-5-ink-muted);
9279
- --ui-matched-elevation: var(--shadow-elevation-5);
10601
+ --ui-surface-color: var(--ui-local-surface-5);
10602
+ --ui-surface-ink: var(--ui-local-surface-5-ink);
10603
+ --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
10604
+ --ui-surface-edge: var(--ui-local-surface-5-edge);
10605
+ --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
10606
+ --ui-surface-edge-strong: var(--ui-local-surface-5-edge-strong);
10607
+ --ui-surface-separator: var(--ui-surface-edge);
10608
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10609
+ @supports (color: color-mix(in lab, red, red)) {
10610
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10611
+ }
10612
+ --ui-matched-elevation: var(--ui-local-elevation-5);
9280
10613
  background-color: var(--ui-surface-color);
9281
10614
  color: var(--ui-surface-ink);
9282
10615
  }
@@ -9284,10 +10617,18 @@
9284
10617
  @container style(--ui-surface-level: 4) {
9285
10618
  :where([data-ui-surface="+2"]) {
9286
10619
  --ui-surface-level: 6;
9287
- --ui-surface-color: var(--color-surface-6);
9288
- --ui-surface-ink: var(--color-surface-6-ink);
9289
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
9290
- --ui-matched-elevation: var(--shadow-elevation-6);
10620
+ --ui-surface-color: var(--ui-local-surface-6);
10621
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
10622
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
10623
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
10624
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
10625
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
10626
+ --ui-surface-separator: var(--ui-surface-edge);
10627
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10628
+ @supports (color: color-mix(in lab, red, red)) {
10629
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10630
+ }
10631
+ --ui-matched-elevation: var(--ui-local-elevation-6);
9291
10632
  background-color: var(--ui-surface-color);
9292
10633
  color: var(--ui-surface-ink);
9293
10634
  }
@@ -9295,10 +10636,18 @@
9295
10636
  @container style(--ui-surface-level: 4) {
9296
10637
  :where([data-ui-surface="+3"]) {
9297
10638
  --ui-surface-level: 7;
9298
- --ui-surface-color: var(--color-surface-7);
9299
- --ui-surface-ink: var(--color-surface-7-ink);
9300
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
9301
- --ui-matched-elevation: var(--shadow-elevation-7);
10639
+ --ui-surface-color: var(--ui-local-surface-7);
10640
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10641
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10642
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10643
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10644
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10645
+ --ui-surface-separator: var(--ui-surface-edge);
10646
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10647
+ @supports (color: color-mix(in lab, red, red)) {
10648
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10649
+ }
10650
+ --ui-matched-elevation: var(--ui-local-elevation-7);
9302
10651
  background-color: var(--ui-surface-color);
9303
10652
  color: var(--ui-surface-ink);
9304
10653
  }
@@ -9306,10 +10655,18 @@
9306
10655
  @container style(--ui-surface-level: 4) {
9307
10656
  :where([data-ui-surface="+4"]) {
9308
10657
  --ui-surface-level: 8;
9309
- --ui-surface-color: var(--color-surface-8);
9310
- --ui-surface-ink: var(--color-surface-8-ink);
9311
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9312
- --ui-matched-elevation: var(--shadow-elevation-8);
10658
+ --ui-surface-color: var(--ui-local-surface-8);
10659
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10660
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10661
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10662
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10663
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10664
+ --ui-surface-separator: var(--ui-surface-edge);
10665
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10666
+ @supports (color: color-mix(in lab, red, red)) {
10667
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10668
+ }
10669
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9313
10670
  background-color: var(--ui-surface-color);
9314
10671
  color: var(--ui-surface-ink);
9315
10672
  }
@@ -9317,10 +10674,18 @@
9317
10674
  @container style(--ui-surface-level: 4) {
9318
10675
  :where([data-ui-surface="+5"]) {
9319
10676
  --ui-surface-level: 8;
9320
- --ui-surface-color: var(--color-surface-8);
9321
- --ui-surface-ink: var(--color-surface-8-ink);
9322
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9323
- --ui-matched-elevation: var(--shadow-elevation-8);
10677
+ --ui-surface-color: var(--ui-local-surface-8);
10678
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10679
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10680
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10681
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10682
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10683
+ --ui-surface-separator: var(--ui-surface-edge);
10684
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10685
+ @supports (color: color-mix(in lab, red, red)) {
10686
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10687
+ }
10688
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9324
10689
  background-color: var(--ui-surface-color);
9325
10690
  color: var(--ui-surface-ink);
9326
10691
  }
@@ -9328,10 +10693,18 @@
9328
10693
  @container style(--ui-surface-level: 4) {
9329
10694
  :where([data-ui-surface="+6"]) {
9330
10695
  --ui-surface-level: 8;
9331
- --ui-surface-color: var(--color-surface-8);
9332
- --ui-surface-ink: var(--color-surface-8-ink);
9333
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9334
- --ui-matched-elevation: var(--shadow-elevation-8);
10696
+ --ui-surface-color: var(--ui-local-surface-8);
10697
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10698
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10699
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10700
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10701
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10702
+ --ui-surface-separator: var(--ui-surface-edge);
10703
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10704
+ @supports (color: color-mix(in lab, red, red)) {
10705
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10706
+ }
10707
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9335
10708
  background-color: var(--ui-surface-color);
9336
10709
  color: var(--ui-surface-ink);
9337
10710
  }
@@ -9339,10 +10712,18 @@
9339
10712
  @container style(--ui-surface-level: 4) {
9340
10713
  :where([data-ui-surface="+7"]) {
9341
10714
  --ui-surface-level: 8;
9342
- --ui-surface-color: var(--color-surface-8);
9343
- --ui-surface-ink: var(--color-surface-8-ink);
9344
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9345
- --ui-matched-elevation: var(--shadow-elevation-8);
10715
+ --ui-surface-color: var(--ui-local-surface-8);
10716
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10717
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10718
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10719
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10720
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10721
+ --ui-surface-separator: var(--ui-surface-edge);
10722
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10723
+ @supports (color: color-mix(in lab, red, red)) {
10724
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10725
+ }
10726
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9346
10727
  background-color: var(--ui-surface-color);
9347
10728
  color: var(--ui-surface-ink);
9348
10729
  }
@@ -9350,10 +10731,18 @@
9350
10731
  @container style(--ui-surface-level: 4) {
9351
10732
  :where([data-ui-surface="+8"]) {
9352
10733
  --ui-surface-level: 8;
9353
- --ui-surface-color: var(--color-surface-8);
9354
- --ui-surface-ink: var(--color-surface-8-ink);
9355
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9356
- --ui-matched-elevation: var(--shadow-elevation-8);
10734
+ --ui-surface-color: var(--ui-local-surface-8);
10735
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10736
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10737
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10738
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10739
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10740
+ --ui-surface-separator: var(--ui-surface-edge);
10741
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10742
+ @supports (color: color-mix(in lab, red, red)) {
10743
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10744
+ }
10745
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9357
10746
  background-color: var(--ui-surface-color);
9358
10747
  color: var(--ui-surface-ink);
9359
10748
  }
@@ -9361,10 +10750,18 @@
9361
10750
  @container style(--ui-surface-level: 5) {
9362
10751
  :where([data-ui-surface="+1"]) {
9363
10752
  --ui-surface-level: 6;
9364
- --ui-surface-color: var(--color-surface-6);
9365
- --ui-surface-ink: var(--color-surface-6-ink);
9366
- --ui-surface-ink-muted: var(--color-surface-6-ink-muted);
9367
- --ui-matched-elevation: var(--shadow-elevation-6);
10753
+ --ui-surface-color: var(--ui-local-surface-6);
10754
+ --ui-surface-ink: var(--ui-local-surface-6-ink);
10755
+ --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
10756
+ --ui-surface-edge: var(--ui-local-surface-6-edge);
10757
+ --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
10758
+ --ui-surface-edge-strong: var(--ui-local-surface-6-edge-strong);
10759
+ --ui-surface-separator: var(--ui-surface-edge);
10760
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10761
+ @supports (color: color-mix(in lab, red, red)) {
10762
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10763
+ }
10764
+ --ui-matched-elevation: var(--ui-local-elevation-6);
9368
10765
  background-color: var(--ui-surface-color);
9369
10766
  color: var(--ui-surface-ink);
9370
10767
  }
@@ -9372,10 +10769,18 @@
9372
10769
  @container style(--ui-surface-level: 5) {
9373
10770
  :where([data-ui-surface="+2"]) {
9374
10771
  --ui-surface-level: 7;
9375
- --ui-surface-color: var(--color-surface-7);
9376
- --ui-surface-ink: var(--color-surface-7-ink);
9377
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
9378
- --ui-matched-elevation: var(--shadow-elevation-7);
10772
+ --ui-surface-color: var(--ui-local-surface-7);
10773
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10774
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10775
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10776
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10777
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10778
+ --ui-surface-separator: var(--ui-surface-edge);
10779
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10780
+ @supports (color: color-mix(in lab, red, red)) {
10781
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10782
+ }
10783
+ --ui-matched-elevation: var(--ui-local-elevation-7);
9379
10784
  background-color: var(--ui-surface-color);
9380
10785
  color: var(--ui-surface-ink);
9381
10786
  }
@@ -9383,10 +10788,18 @@
9383
10788
  @container style(--ui-surface-level: 5) {
9384
10789
  :where([data-ui-surface="+3"]) {
9385
10790
  --ui-surface-level: 8;
9386
- --ui-surface-color: var(--color-surface-8);
9387
- --ui-surface-ink: var(--color-surface-8-ink);
9388
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9389
- --ui-matched-elevation: var(--shadow-elevation-8);
10791
+ --ui-surface-color: var(--ui-local-surface-8);
10792
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10793
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10794
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10795
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10796
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10797
+ --ui-surface-separator: var(--ui-surface-edge);
10798
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10799
+ @supports (color: color-mix(in lab, red, red)) {
10800
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10801
+ }
10802
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9390
10803
  background-color: var(--ui-surface-color);
9391
10804
  color: var(--ui-surface-ink);
9392
10805
  }
@@ -9394,10 +10807,18 @@
9394
10807
  @container style(--ui-surface-level: 5) {
9395
10808
  :where([data-ui-surface="+4"]) {
9396
10809
  --ui-surface-level: 8;
9397
- --ui-surface-color: var(--color-surface-8);
9398
- --ui-surface-ink: var(--color-surface-8-ink);
9399
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9400
- --ui-matched-elevation: var(--shadow-elevation-8);
10810
+ --ui-surface-color: var(--ui-local-surface-8);
10811
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10812
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10813
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10814
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10815
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10816
+ --ui-surface-separator: var(--ui-surface-edge);
10817
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10818
+ @supports (color: color-mix(in lab, red, red)) {
10819
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10820
+ }
10821
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9401
10822
  background-color: var(--ui-surface-color);
9402
10823
  color: var(--ui-surface-ink);
9403
10824
  }
@@ -9405,10 +10826,18 @@
9405
10826
  @container style(--ui-surface-level: 5) {
9406
10827
  :where([data-ui-surface="+5"]) {
9407
10828
  --ui-surface-level: 8;
9408
- --ui-surface-color: var(--color-surface-8);
9409
- --ui-surface-ink: var(--color-surface-8-ink);
9410
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9411
- --ui-matched-elevation: var(--shadow-elevation-8);
10829
+ --ui-surface-color: var(--ui-local-surface-8);
10830
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10831
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10832
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10833
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10834
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10835
+ --ui-surface-separator: var(--ui-surface-edge);
10836
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10837
+ @supports (color: color-mix(in lab, red, red)) {
10838
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10839
+ }
10840
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9412
10841
  background-color: var(--ui-surface-color);
9413
10842
  color: var(--ui-surface-ink);
9414
10843
  }
@@ -9416,10 +10845,18 @@
9416
10845
  @container style(--ui-surface-level: 5) {
9417
10846
  :where([data-ui-surface="+6"]) {
9418
10847
  --ui-surface-level: 8;
9419
- --ui-surface-color: var(--color-surface-8);
9420
- --ui-surface-ink: var(--color-surface-8-ink);
9421
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9422
- --ui-matched-elevation: var(--shadow-elevation-8);
10848
+ --ui-surface-color: var(--ui-local-surface-8);
10849
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10850
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10851
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10852
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10853
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10854
+ --ui-surface-separator: var(--ui-surface-edge);
10855
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10856
+ @supports (color: color-mix(in lab, red, red)) {
10857
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10858
+ }
10859
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9423
10860
  background-color: var(--ui-surface-color);
9424
10861
  color: var(--ui-surface-ink);
9425
10862
  }
@@ -9427,10 +10864,18 @@
9427
10864
  @container style(--ui-surface-level: 5) {
9428
10865
  :where([data-ui-surface="+7"]) {
9429
10866
  --ui-surface-level: 8;
9430
- --ui-surface-color: var(--color-surface-8);
9431
- --ui-surface-ink: var(--color-surface-8-ink);
9432
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9433
- --ui-matched-elevation: var(--shadow-elevation-8);
10867
+ --ui-surface-color: var(--ui-local-surface-8);
10868
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10869
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10870
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10871
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10872
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10873
+ --ui-surface-separator: var(--ui-surface-edge);
10874
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10875
+ @supports (color: color-mix(in lab, red, red)) {
10876
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10877
+ }
10878
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9434
10879
  background-color: var(--ui-surface-color);
9435
10880
  color: var(--ui-surface-ink);
9436
10881
  }
@@ -9438,10 +10883,18 @@
9438
10883
  @container style(--ui-surface-level: 5) {
9439
10884
  :where([data-ui-surface="+8"]) {
9440
10885
  --ui-surface-level: 8;
9441
- --ui-surface-color: var(--color-surface-8);
9442
- --ui-surface-ink: var(--color-surface-8-ink);
9443
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9444
- --ui-matched-elevation: var(--shadow-elevation-8);
10886
+ --ui-surface-color: var(--ui-local-surface-8);
10887
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10888
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10889
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10890
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10891
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10892
+ --ui-surface-separator: var(--ui-surface-edge);
10893
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10894
+ @supports (color: color-mix(in lab, red, red)) {
10895
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10896
+ }
10897
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9445
10898
  background-color: var(--ui-surface-color);
9446
10899
  color: var(--ui-surface-ink);
9447
10900
  }
@@ -9449,10 +10902,18 @@
9449
10902
  @container style(--ui-surface-level: 6) {
9450
10903
  :where([data-ui-surface="+1"]) {
9451
10904
  --ui-surface-level: 7;
9452
- --ui-surface-color: var(--color-surface-7);
9453
- --ui-surface-ink: var(--color-surface-7-ink);
9454
- --ui-surface-ink-muted: var(--color-surface-7-ink-muted);
9455
- --ui-matched-elevation: var(--shadow-elevation-7);
10905
+ --ui-surface-color: var(--ui-local-surface-7);
10906
+ --ui-surface-ink: var(--ui-local-surface-7-ink);
10907
+ --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
10908
+ --ui-surface-edge: var(--ui-local-surface-7-edge);
10909
+ --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
10910
+ --ui-surface-edge-strong: var(--ui-local-surface-7-edge-strong);
10911
+ --ui-surface-separator: var(--ui-surface-edge);
10912
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10913
+ @supports (color: color-mix(in lab, red, red)) {
10914
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10915
+ }
10916
+ --ui-matched-elevation: var(--ui-local-elevation-7);
9456
10917
  background-color: var(--ui-surface-color);
9457
10918
  color: var(--ui-surface-ink);
9458
10919
  }
@@ -9460,10 +10921,18 @@
9460
10921
  @container style(--ui-surface-level: 6) {
9461
10922
  :where([data-ui-surface="+2"]) {
9462
10923
  --ui-surface-level: 8;
9463
- --ui-surface-color: var(--color-surface-8);
9464
- --ui-surface-ink: var(--color-surface-8-ink);
9465
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9466
- --ui-matched-elevation: var(--shadow-elevation-8);
10924
+ --ui-surface-color: var(--ui-local-surface-8);
10925
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10926
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10927
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10928
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10929
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10930
+ --ui-surface-separator: var(--ui-surface-edge);
10931
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10932
+ @supports (color: color-mix(in lab, red, red)) {
10933
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10934
+ }
10935
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9467
10936
  background-color: var(--ui-surface-color);
9468
10937
  color: var(--ui-surface-ink);
9469
10938
  }
@@ -9471,10 +10940,18 @@
9471
10940
  @container style(--ui-surface-level: 6) {
9472
10941
  :where([data-ui-surface="+3"]) {
9473
10942
  --ui-surface-level: 8;
9474
- --ui-surface-color: var(--color-surface-8);
9475
- --ui-surface-ink: var(--color-surface-8-ink);
9476
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9477
- --ui-matched-elevation: var(--shadow-elevation-8);
10943
+ --ui-surface-color: var(--ui-local-surface-8);
10944
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10945
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10946
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10947
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10948
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10949
+ --ui-surface-separator: var(--ui-surface-edge);
10950
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10951
+ @supports (color: color-mix(in lab, red, red)) {
10952
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10953
+ }
10954
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9478
10955
  background-color: var(--ui-surface-color);
9479
10956
  color: var(--ui-surface-ink);
9480
10957
  }
@@ -9482,10 +10959,18 @@
9482
10959
  @container style(--ui-surface-level: 6) {
9483
10960
  :where([data-ui-surface="+4"]) {
9484
10961
  --ui-surface-level: 8;
9485
- --ui-surface-color: var(--color-surface-8);
9486
- --ui-surface-ink: var(--color-surface-8-ink);
9487
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9488
- --ui-matched-elevation: var(--shadow-elevation-8);
10962
+ --ui-surface-color: var(--ui-local-surface-8);
10963
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10964
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10965
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10966
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10967
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10968
+ --ui-surface-separator: var(--ui-surface-edge);
10969
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10970
+ @supports (color: color-mix(in lab, red, red)) {
10971
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10972
+ }
10973
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9489
10974
  background-color: var(--ui-surface-color);
9490
10975
  color: var(--ui-surface-ink);
9491
10976
  }
@@ -9493,10 +10978,18 @@
9493
10978
  @container style(--ui-surface-level: 6) {
9494
10979
  :where([data-ui-surface="+5"]) {
9495
10980
  --ui-surface-level: 8;
9496
- --ui-surface-color: var(--color-surface-8);
9497
- --ui-surface-ink: var(--color-surface-8-ink);
9498
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9499
- --ui-matched-elevation: var(--shadow-elevation-8);
10981
+ --ui-surface-color: var(--ui-local-surface-8);
10982
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
10983
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
10984
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
10985
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
10986
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
10987
+ --ui-surface-separator: var(--ui-surface-edge);
10988
+ --ui-surface-separator-muted: var(--ui-surface-edge);
10989
+ @supports (color: color-mix(in lab, red, red)) {
10990
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
10991
+ }
10992
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9500
10993
  background-color: var(--ui-surface-color);
9501
10994
  color: var(--ui-surface-ink);
9502
10995
  }
@@ -9504,10 +10997,18 @@
9504
10997
  @container style(--ui-surface-level: 6) {
9505
10998
  :where([data-ui-surface="+6"]) {
9506
10999
  --ui-surface-level: 8;
9507
- --ui-surface-color: var(--color-surface-8);
9508
- --ui-surface-ink: var(--color-surface-8-ink);
9509
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9510
- --ui-matched-elevation: var(--shadow-elevation-8);
11000
+ --ui-surface-color: var(--ui-local-surface-8);
11001
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11002
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11003
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11004
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11005
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11006
+ --ui-surface-separator: var(--ui-surface-edge);
11007
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11008
+ @supports (color: color-mix(in lab, red, red)) {
11009
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11010
+ }
11011
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9511
11012
  background-color: var(--ui-surface-color);
9512
11013
  color: var(--ui-surface-ink);
9513
11014
  }
@@ -9515,10 +11016,18 @@
9515
11016
  @container style(--ui-surface-level: 6) {
9516
11017
  :where([data-ui-surface="+7"]) {
9517
11018
  --ui-surface-level: 8;
9518
- --ui-surface-color: var(--color-surface-8);
9519
- --ui-surface-ink: var(--color-surface-8-ink);
9520
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9521
- --ui-matched-elevation: var(--shadow-elevation-8);
11019
+ --ui-surface-color: var(--ui-local-surface-8);
11020
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11021
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11022
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11023
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11024
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11025
+ --ui-surface-separator: var(--ui-surface-edge);
11026
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11027
+ @supports (color: color-mix(in lab, red, red)) {
11028
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11029
+ }
11030
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9522
11031
  background-color: var(--ui-surface-color);
9523
11032
  color: var(--ui-surface-ink);
9524
11033
  }
@@ -9526,10 +11035,18 @@
9526
11035
  @container style(--ui-surface-level: 6) {
9527
11036
  :where([data-ui-surface="+8"]) {
9528
11037
  --ui-surface-level: 8;
9529
- --ui-surface-color: var(--color-surface-8);
9530
- --ui-surface-ink: var(--color-surface-8-ink);
9531
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9532
- --ui-matched-elevation: var(--shadow-elevation-8);
11038
+ --ui-surface-color: var(--ui-local-surface-8);
11039
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11040
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11041
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11042
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11043
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11044
+ --ui-surface-separator: var(--ui-surface-edge);
11045
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11046
+ @supports (color: color-mix(in lab, red, red)) {
11047
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11048
+ }
11049
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9533
11050
  background-color: var(--ui-surface-color);
9534
11051
  color: var(--ui-surface-ink);
9535
11052
  }
@@ -9537,10 +11054,18 @@
9537
11054
  @container style(--ui-surface-level: 7) {
9538
11055
  :where([data-ui-surface="+1"]) {
9539
11056
  --ui-surface-level: 8;
9540
- --ui-surface-color: var(--color-surface-8);
9541
- --ui-surface-ink: var(--color-surface-8-ink);
9542
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9543
- --ui-matched-elevation: var(--shadow-elevation-8);
11057
+ --ui-surface-color: var(--ui-local-surface-8);
11058
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11059
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11060
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11061
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11062
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11063
+ --ui-surface-separator: var(--ui-surface-edge);
11064
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11065
+ @supports (color: color-mix(in lab, red, red)) {
11066
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11067
+ }
11068
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9544
11069
  background-color: var(--ui-surface-color);
9545
11070
  color: var(--ui-surface-ink);
9546
11071
  }
@@ -9548,10 +11073,18 @@
9548
11073
  @container style(--ui-surface-level: 7) {
9549
11074
  :where([data-ui-surface="+2"]) {
9550
11075
  --ui-surface-level: 8;
9551
- --ui-surface-color: var(--color-surface-8);
9552
- --ui-surface-ink: var(--color-surface-8-ink);
9553
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9554
- --ui-matched-elevation: var(--shadow-elevation-8);
11076
+ --ui-surface-color: var(--ui-local-surface-8);
11077
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11078
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11079
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11080
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11081
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11082
+ --ui-surface-separator: var(--ui-surface-edge);
11083
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11084
+ @supports (color: color-mix(in lab, red, red)) {
11085
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11086
+ }
11087
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9555
11088
  background-color: var(--ui-surface-color);
9556
11089
  color: var(--ui-surface-ink);
9557
11090
  }
@@ -9559,10 +11092,18 @@
9559
11092
  @container style(--ui-surface-level: 7) {
9560
11093
  :where([data-ui-surface="+3"]) {
9561
11094
  --ui-surface-level: 8;
9562
- --ui-surface-color: var(--color-surface-8);
9563
- --ui-surface-ink: var(--color-surface-8-ink);
9564
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9565
- --ui-matched-elevation: var(--shadow-elevation-8);
11095
+ --ui-surface-color: var(--ui-local-surface-8);
11096
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11097
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11098
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11099
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11100
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11101
+ --ui-surface-separator: var(--ui-surface-edge);
11102
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11103
+ @supports (color: color-mix(in lab, red, red)) {
11104
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11105
+ }
11106
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9566
11107
  background-color: var(--ui-surface-color);
9567
11108
  color: var(--ui-surface-ink);
9568
11109
  }
@@ -9570,10 +11111,18 @@
9570
11111
  @container style(--ui-surface-level: 7) {
9571
11112
  :where([data-ui-surface="+4"]) {
9572
11113
  --ui-surface-level: 8;
9573
- --ui-surface-color: var(--color-surface-8);
9574
- --ui-surface-ink: var(--color-surface-8-ink);
9575
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9576
- --ui-matched-elevation: var(--shadow-elevation-8);
11114
+ --ui-surface-color: var(--ui-local-surface-8);
11115
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11116
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11117
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11118
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11119
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11120
+ --ui-surface-separator: var(--ui-surface-edge);
11121
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11122
+ @supports (color: color-mix(in lab, red, red)) {
11123
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11124
+ }
11125
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9577
11126
  background-color: var(--ui-surface-color);
9578
11127
  color: var(--ui-surface-ink);
9579
11128
  }
@@ -9581,10 +11130,18 @@
9581
11130
  @container style(--ui-surface-level: 7) {
9582
11131
  :where([data-ui-surface="+5"]) {
9583
11132
  --ui-surface-level: 8;
9584
- --ui-surface-color: var(--color-surface-8);
9585
- --ui-surface-ink: var(--color-surface-8-ink);
9586
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9587
- --ui-matched-elevation: var(--shadow-elevation-8);
11133
+ --ui-surface-color: var(--ui-local-surface-8);
11134
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11135
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11136
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11137
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11138
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11139
+ --ui-surface-separator: var(--ui-surface-edge);
11140
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11141
+ @supports (color: color-mix(in lab, red, red)) {
11142
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11143
+ }
11144
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9588
11145
  background-color: var(--ui-surface-color);
9589
11146
  color: var(--ui-surface-ink);
9590
11147
  }
@@ -9592,10 +11149,18 @@
9592
11149
  @container style(--ui-surface-level: 7) {
9593
11150
  :where([data-ui-surface="+6"]) {
9594
11151
  --ui-surface-level: 8;
9595
- --ui-surface-color: var(--color-surface-8);
9596
- --ui-surface-ink: var(--color-surface-8-ink);
9597
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9598
- --ui-matched-elevation: var(--shadow-elevation-8);
11152
+ --ui-surface-color: var(--ui-local-surface-8);
11153
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11154
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11155
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11156
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11157
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11158
+ --ui-surface-separator: var(--ui-surface-edge);
11159
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11160
+ @supports (color: color-mix(in lab, red, red)) {
11161
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11162
+ }
11163
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9599
11164
  background-color: var(--ui-surface-color);
9600
11165
  color: var(--ui-surface-ink);
9601
11166
  }
@@ -9603,10 +11168,18 @@
9603
11168
  @container style(--ui-surface-level: 7) {
9604
11169
  :where([data-ui-surface="+7"]) {
9605
11170
  --ui-surface-level: 8;
9606
- --ui-surface-color: var(--color-surface-8);
9607
- --ui-surface-ink: var(--color-surface-8-ink);
9608
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9609
- --ui-matched-elevation: var(--shadow-elevation-8);
11171
+ --ui-surface-color: var(--ui-local-surface-8);
11172
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11173
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11174
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11175
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11176
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11177
+ --ui-surface-separator: var(--ui-surface-edge);
11178
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11179
+ @supports (color: color-mix(in lab, red, red)) {
11180
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11181
+ }
11182
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9610
11183
  background-color: var(--ui-surface-color);
9611
11184
  color: var(--ui-surface-ink);
9612
11185
  }
@@ -9614,10 +11187,18 @@
9614
11187
  @container style(--ui-surface-level: 7) {
9615
11188
  :where([data-ui-surface="+8"]) {
9616
11189
  --ui-surface-level: 8;
9617
- --ui-surface-color: var(--color-surface-8);
9618
- --ui-surface-ink: var(--color-surface-8-ink);
9619
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9620
- --ui-matched-elevation: var(--shadow-elevation-8);
11190
+ --ui-surface-color: var(--ui-local-surface-8);
11191
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11192
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11193
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11194
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11195
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11196
+ --ui-surface-separator: var(--ui-surface-edge);
11197
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11198
+ @supports (color: color-mix(in lab, red, red)) {
11199
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11200
+ }
11201
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9621
11202
  background-color: var(--ui-surface-color);
9622
11203
  color: var(--ui-surface-ink);
9623
11204
  }
@@ -9625,10 +11206,18 @@
9625
11206
  @container style(--ui-surface-level: 8) {
9626
11207
  :where([data-ui-surface="+1"]) {
9627
11208
  --ui-surface-level: 8;
9628
- --ui-surface-color: var(--color-surface-8);
9629
- --ui-surface-ink: var(--color-surface-8-ink);
9630
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9631
- --ui-matched-elevation: var(--shadow-elevation-8);
11209
+ --ui-surface-color: var(--ui-local-surface-8);
11210
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11211
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11212
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11213
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11214
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11215
+ --ui-surface-separator: var(--ui-surface-edge);
11216
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11217
+ @supports (color: color-mix(in lab, red, red)) {
11218
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11219
+ }
11220
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9632
11221
  background-color: var(--ui-surface-color);
9633
11222
  color: var(--ui-surface-ink);
9634
11223
  }
@@ -9636,10 +11225,18 @@
9636
11225
  @container style(--ui-surface-level: 8) {
9637
11226
  :where([data-ui-surface="+2"]) {
9638
11227
  --ui-surface-level: 8;
9639
- --ui-surface-color: var(--color-surface-8);
9640
- --ui-surface-ink: var(--color-surface-8-ink);
9641
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9642
- --ui-matched-elevation: var(--shadow-elevation-8);
11228
+ --ui-surface-color: var(--ui-local-surface-8);
11229
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11230
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11231
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11232
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11233
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11234
+ --ui-surface-separator: var(--ui-surface-edge);
11235
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11236
+ @supports (color: color-mix(in lab, red, red)) {
11237
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11238
+ }
11239
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9643
11240
  background-color: var(--ui-surface-color);
9644
11241
  color: var(--ui-surface-ink);
9645
11242
  }
@@ -9647,10 +11244,18 @@
9647
11244
  @container style(--ui-surface-level: 8) {
9648
11245
  :where([data-ui-surface="+3"]) {
9649
11246
  --ui-surface-level: 8;
9650
- --ui-surface-color: var(--color-surface-8);
9651
- --ui-surface-ink: var(--color-surface-8-ink);
9652
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9653
- --ui-matched-elevation: var(--shadow-elevation-8);
11247
+ --ui-surface-color: var(--ui-local-surface-8);
11248
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11249
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11250
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11251
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11252
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11253
+ --ui-surface-separator: var(--ui-surface-edge);
11254
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11255
+ @supports (color: color-mix(in lab, red, red)) {
11256
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11257
+ }
11258
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9654
11259
  background-color: var(--ui-surface-color);
9655
11260
  color: var(--ui-surface-ink);
9656
11261
  }
@@ -9658,10 +11263,18 @@
9658
11263
  @container style(--ui-surface-level: 8) {
9659
11264
  :where([data-ui-surface="+4"]) {
9660
11265
  --ui-surface-level: 8;
9661
- --ui-surface-color: var(--color-surface-8);
9662
- --ui-surface-ink: var(--color-surface-8-ink);
9663
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9664
- --ui-matched-elevation: var(--shadow-elevation-8);
11266
+ --ui-surface-color: var(--ui-local-surface-8);
11267
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11268
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11269
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11270
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11271
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11272
+ --ui-surface-separator: var(--ui-surface-edge);
11273
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11274
+ @supports (color: color-mix(in lab, red, red)) {
11275
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11276
+ }
11277
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9665
11278
  background-color: var(--ui-surface-color);
9666
11279
  color: var(--ui-surface-ink);
9667
11280
  }
@@ -9669,10 +11282,18 @@
9669
11282
  @container style(--ui-surface-level: 8) {
9670
11283
  :where([data-ui-surface="+5"]) {
9671
11284
  --ui-surface-level: 8;
9672
- --ui-surface-color: var(--color-surface-8);
9673
- --ui-surface-ink: var(--color-surface-8-ink);
9674
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9675
- --ui-matched-elevation: var(--shadow-elevation-8);
11285
+ --ui-surface-color: var(--ui-local-surface-8);
11286
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11287
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11288
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11289
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11290
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11291
+ --ui-surface-separator: var(--ui-surface-edge);
11292
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11293
+ @supports (color: color-mix(in lab, red, red)) {
11294
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11295
+ }
11296
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9676
11297
  background-color: var(--ui-surface-color);
9677
11298
  color: var(--ui-surface-ink);
9678
11299
  }
@@ -9680,10 +11301,18 @@
9680
11301
  @container style(--ui-surface-level: 8) {
9681
11302
  :where([data-ui-surface="+6"]) {
9682
11303
  --ui-surface-level: 8;
9683
- --ui-surface-color: var(--color-surface-8);
9684
- --ui-surface-ink: var(--color-surface-8-ink);
9685
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9686
- --ui-matched-elevation: var(--shadow-elevation-8);
11304
+ --ui-surface-color: var(--ui-local-surface-8);
11305
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11306
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11307
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11308
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11309
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11310
+ --ui-surface-separator: var(--ui-surface-edge);
11311
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11312
+ @supports (color: color-mix(in lab, red, red)) {
11313
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11314
+ }
11315
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9687
11316
  background-color: var(--ui-surface-color);
9688
11317
  color: var(--ui-surface-ink);
9689
11318
  }
@@ -9691,10 +11320,18 @@
9691
11320
  @container style(--ui-surface-level: 8) {
9692
11321
  :where([data-ui-surface="+7"]) {
9693
11322
  --ui-surface-level: 8;
9694
- --ui-surface-color: var(--color-surface-8);
9695
- --ui-surface-ink: var(--color-surface-8-ink);
9696
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9697
- --ui-matched-elevation: var(--shadow-elevation-8);
11323
+ --ui-surface-color: var(--ui-local-surface-8);
11324
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11325
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11326
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11327
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11328
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11329
+ --ui-surface-separator: var(--ui-surface-edge);
11330
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11331
+ @supports (color: color-mix(in lab, red, red)) {
11332
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11333
+ }
11334
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9698
11335
  background-color: var(--ui-surface-color);
9699
11336
  color: var(--ui-surface-ink);
9700
11337
  }
@@ -9702,10 +11339,18 @@
9702
11339
  @container style(--ui-surface-level: 8) {
9703
11340
  :where([data-ui-surface="+8"]) {
9704
11341
  --ui-surface-level: 8;
9705
- --ui-surface-color: var(--color-surface-8);
9706
- --ui-surface-ink: var(--color-surface-8-ink);
9707
- --ui-surface-ink-muted: var(--color-surface-8-ink-muted);
9708
- --ui-matched-elevation: var(--shadow-elevation-8);
11342
+ --ui-surface-color: var(--ui-local-surface-8);
11343
+ --ui-surface-ink: var(--ui-local-surface-8-ink);
11344
+ --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
11345
+ --ui-surface-edge: var(--ui-local-surface-8-edge);
11346
+ --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
11347
+ --ui-surface-edge-strong: var(--ui-local-surface-8-edge-strong);
11348
+ --ui-surface-separator: var(--ui-surface-edge);
11349
+ --ui-surface-separator-muted: var(--ui-surface-edge);
11350
+ @supports (color: color-mix(in lab, red, red)) {
11351
+ --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
11352
+ }
11353
+ --ui-matched-elevation: var(--ui-local-elevation-8);
9709
11354
  background-color: var(--ui-surface-color);
9710
11355
  color: var(--ui-surface-ink);
9711
11356
  }
@@ -10128,13 +11773,8 @@
10128
11773
  width: auto !important;
10129
11774
  }
10130
11775
  [data-ui-radio][data-variant="pills"][data-checked] {
10131
- background-color: var(--color-intent-accent-solid);
10132
- color: var(--color-intent-accent-solid-ink) !important;
10133
- box-shadow: var(--shadow-elevation-1);
10134
- }
10135
- [data-ui-radio][data-variant="pills"][data-checked]:hover:not([data-disabled]) {
10136
- background-color: var(--color-intent-accent-solid-hover);
10137
- box-shadow: var(--shadow-elevation-1);
11776
+ background-color: transparent;
11777
+ color: var(--ui-surface-ink);
10138
11778
  }
10139
11779
  [data-ui-radio][data-variant="pills"] [data-ui-radio-indicator] {
10140
11780
  display: none !important;
@@ -10183,6 +11823,10 @@
10183
11823
  right: 0.75rem;
10184
11824
  }
10185
11825
  }
11826
+ [data-ui-checkbox][data-variant="pills"]:is( [data-ui-interaction="tonal"], [data-ui-interaction="combined"] ) {
11827
+ background-color: var(--ui-interaction-fill);
11828
+ background-image: none;
11829
+ }
10186
11830
  @layer components {
10187
11831
  [data-ui-date-picker] {
10188
11832
  --ui-date-picker-selected-bg: var(--color-intent-neutral-solid);
@@ -10976,7 +12620,7 @@
10976
12620
  }
10977
12621
  @media (hover: hover) {
10978
12622
  [data-ui-elevation][data-ui-interactive="surface"]:hover {
10979
- --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--color-intent-neutral-edge-hover);
12623
+ --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge-hover);
10980
12624
  }
10981
12625
  }
10982
12626
  [data-ui-elevation][data-ui-interactive="surface"]:is( [data-selected="true"], [aria-selected="true"], [data-current], [aria-current]:not([aria-current="false"]), [data-checked], [aria-checked="true"], [data-pressed], [aria-pressed="true"] ) {
@@ -10985,12 +12629,79 @@
10985
12629
  [data-ui-elevation][data-ui-interactive="surface"]:is(:focus-visible, :has(:focus-visible)) {
10986
12630
  --ui-state-shadow-layers: 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
10987
12631
  }
12632
+ [data-ui-selection-color], [data-ui-interaction] {
12633
+ --ui-interaction-selected-fill: var(--background-interaction-selection-neutral);
12634
+ --ui-interaction-selected-fill-hover: var(--background-interaction-selection-neutral-hover);
12635
+ --ui-interaction-selected-ink: var(--color-interaction-selection-neutral-ink);
12636
+ --ui-interaction-selected-edge: var(--color-intent-neutral-edge);
12637
+ --ui-interaction-selected-edge-hover: var(--color-intent-neutral-edge-hover);
12638
+ --ui-interaction-selected-edge-strong: var(--color-intent-neutral-edge-strong);
12639
+ --ui-selection-solid: var(--color-intent-neutral-solid);
12640
+ --ui-selection-solid-ink: var(--color-intent-neutral-solid-ink);
12641
+ }
12642
+ :is([data-ui-selection-color], [data-ui-interaction])[data-color="accent"] {
12643
+ --ui-interaction-selected-fill: var(--background-interaction-selection-accent);
12644
+ --ui-interaction-selected-fill-hover: var(--background-interaction-selection-accent-hover);
12645
+ --ui-interaction-selected-ink: var(--color-interaction-selection-accent-ink);
12646
+ --ui-interaction-selected-edge: var(--color-intent-accent-edge);
12647
+ --ui-interaction-selected-edge-hover: var(--color-intent-accent-edge-hover);
12648
+ --ui-interaction-selected-edge-strong: var(--color-intent-accent-edge-strong);
12649
+ --ui-selection-solid: var(--color-intent-accent-solid);
12650
+ --ui-selection-solid-ink: var(--color-intent-accent-solid-ink);
12651
+ }
12652
+ [data-ui-interaction] {
12653
+ --ui-interaction-fill: transparent;
12654
+ --ui-interaction-edge: var(--ui-interaction-rest-edge, transparent);
12655
+ }
12656
+ :is([data-ui-interaction="tonal"], [data-ui-interaction="combined"]) {
12657
+ background-image: linear-gradient(var(--ui-interaction-fill), var(--ui-interaction-fill));
12658
+ }
12659
+ :is([data-ui-interaction="edge"], [data-ui-interaction="combined"]) {
12660
+ --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--ui-interaction-edge);
12661
+ }
12662
+ :is([data-ui-interaction="edge"], [data-ui-interaction="combined"]):not([data-ui-elevation]) {
12663
+ box-shadow: var(--ui-state-shadow-layers);
12664
+ }
12665
+ @media (hover: hover) {
12666
+ [data-ui-interaction]:hover {
12667
+ --ui-interaction-fill: var(--color-interaction-hover);
12668
+ --ui-interaction-edge: var(--ui-surface-edge-hover);
12669
+ }
12670
+ }
12671
+ [data-ui-interaction]:active {
12672
+ --ui-interaction-fill: var(--color-interaction-pressed);
12673
+ --ui-interaction-edge: var(--ui-surface-edge-strong);
12674
+ }
12675
+ [data-ui-interaction]:is( [data-selected="true"], [aria-selected="true"], [data-current], [aria-current]:not([aria-current="false"]), [data-checked], [aria-checked="true"], [data-pressed], [aria-pressed="true"] ) {
12676
+ --ui-interaction-fill: var(--ui-interaction-selected-fill);
12677
+ --ui-interaction-edge: var(--ui-interaction-selected-edge);
12678
+ }
12679
+ :is([data-ui-interaction="tonal"], [data-ui-interaction="combined"]):is( [data-selected="true"], [aria-selected="true"], [data-current], [aria-current]:not([aria-current="false"]), [data-checked], [aria-checked="true"], [data-pressed], [aria-pressed="true"] ) {
12680
+ color: var(--ui-interaction-selected-ink);
12681
+ }
12682
+ @media (hover: hover) {
12683
+ [data-ui-interaction]:is( [data-selected="true"], [aria-selected="true"], [data-current], [aria-current]:not([aria-current="false"]), [data-checked], [aria-checked="true"], [data-pressed], [aria-pressed="true"] ):hover {
12684
+ --ui-interaction-fill: var(--ui-interaction-selected-fill-hover);
12685
+ --ui-interaction-edge: var(--ui-interaction-selected-edge-hover);
12686
+ }
12687
+ }
12688
+ [data-ui-interaction]:is(:focus-visible, :has(:focus-visible)) {
12689
+ --ui-state-shadow-layers: 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
12690
+ }
10988
12691
  :root, .light, .dark {
10989
12692
  color-scheme: light;
10990
12693
  --ui-font-weight-normal: var(--font-weight-normal);
10991
12694
  --ui-font-weight-medium: var(--font-weight-medium);
10992
12695
  --ui-font-weight-semibold: var(--font-weight-semibold);
10993
12696
  --ui-letter-spacing: 0;
12697
+ --ui-label-ink: var(--ui-surface-ink-muted);
12698
+ @supports (color: color-mix(in lab, red, red)) {
12699
+ --ui-label-ink: color-mix(
12700
+ in oklab,
12701
+ var(--ui-surface-ink-muted),
12702
+ var(--ui-surface-ink) var(--label-ink-emphasis)
12703
+ );
12704
+ }
10994
12705
  --ui-control-height-xs: var(--spacing-control-xs);
10995
12706
  --ui-control-height-sm: var(--spacing-control-sm);
10996
12707
  --ui-control-height-md: var(--spacing-control-md);
@@ -11020,8 +12731,8 @@
11020
12731
  opacity: var(--opacity-interaction-disabled);
11021
12732
  }
11022
12733
  [data-ui-action-recipe] {
11023
- --ui-action-text: var(--color-intent-neutral-text);
11024
- --ui-action-text-hover: var(--color-intent-neutral-text-hover);
12734
+ --ui-action-text: var(--ui-surface-ink);
12735
+ --ui-action-text-hover: var(--ui-surface-ink);
11025
12736
  --ui-action-soft: var(--color-intent-neutral-soft);
11026
12737
  --ui-action-soft-hover: var(--color-intent-neutral-soft-hover);
11027
12738
  --ui-action-soft-pressed: var(--color-intent-neutral-soft-pressed);
@@ -11030,9 +12741,9 @@
11030
12741
  --ui-action-solid-hover: var(--color-intent-neutral-solid-hover);
11031
12742
  --ui-action-solid-pressed: var(--color-intent-neutral-solid-pressed);
11032
12743
  --ui-action-solid-ink: var(--color-intent-neutral-solid-ink);
11033
- --ui-action-edge: var(--color-intent-neutral-edge);
11034
- --ui-action-edge-hover: var(--color-intent-neutral-edge-hover);
11035
- --ui-action-edge-strong: var(--color-intent-neutral-edge-strong);
12744
+ --ui-action-edge: var(--ui-surface-edge);
12745
+ --ui-action-edge-hover: var(--ui-surface-edge-hover);
12746
+ --ui-action-edge-strong: var(--ui-surface-edge-strong);
11036
12747
  --ui-action-focus: var(--color-intent-neutral-focus);
11037
12748
  --ui-action-focus-width: var(--color-intent-neutral-focus-width);
11038
12749
  }
@@ -11172,14 +12883,14 @@
11172
12883
  box-shadow: 0 0 0 1px currentColor;
11173
12884
  }
11174
12885
  [data-ui-toast-recipe] {
11175
- --ui-toast-text: var(--color-intent-neutral-text);
12886
+ --ui-toast-text: var(--ui-surface-ink);
11176
12887
  --ui-toast-soft: var(--color-intent-neutral-soft);
11177
12888
  --ui-toast-soft-ink: var(--color-intent-neutral-soft-ink);
11178
12889
  --ui-toast-soft-ink-muted: var(--color-intent-neutral-soft-ink-muted);
11179
12890
  --ui-toast-solid: var(--color-intent-neutral-solid);
11180
12891
  --ui-toast-solid-ink: var(--color-intent-neutral-solid-ink);
11181
- --ui-toast-edge: var(--color-intent-neutral-edge);
11182
- --ui-toast-edge-strong: var(--color-intent-neutral-edge-strong);
12892
+ --ui-toast-edge: var(--ui-surface-edge);
12893
+ --ui-toast-edge-strong: var(--ui-surface-edge-strong);
11183
12894
  --ui-toast-focus: var(--color-intent-neutral-focus);
11184
12895
  --ui-toast-focus-width: var(--color-intent-neutral-focus-width);
11185
12896
  --ui-toast-ink: var(--ui-surface-ink);
@@ -11284,14 +12995,14 @@
11284
12995
  color: var(--ui-surface-ink);
11285
12996
  }
11286
12997
  [data-ui-tabs-list][data-variant="line"] {
11287
- box-shadow: inset 0 calc(var(--border-width-edge-separator) * -1) 0 var(--color-separator);
12998
+ box-shadow: inset 0 calc(var(--border-width-edge-separator) * -1) 0 var(--ui-surface-separator);
11288
12999
  }
11289
13000
  [data-ui-tabs-list][data-variant="line"][data-orientation="vertical"] {
11290
- box-shadow: inset var(--border-width-edge-separator) 0 0 var(--color-separator);
13001
+ box-shadow: inset var(--border-width-edge-separator) 0 0 var(--ui-surface-separator);
11291
13002
  }
11292
13003
  [data-ui-tabs-list][data-variant="segmented"] {
11293
13004
  background-color: var(--color-interaction-hover);
11294
- box-shadow: inset 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge);
13005
+ box-shadow: inset 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
11295
13006
  }
11296
13007
  [data-ui-tabs-tab] {
11297
13008
  color: var(--ui-surface-ink-muted);
@@ -11302,6 +13013,9 @@
11302
13013
  [data-ui-tabs-tab][data-selected] {
11303
13014
  color: var(--ui-surface-ink);
11304
13015
  }
13016
+ [data-ui-tabs-list]:where([data-variant="subtle"], [data-variant="pills"]) [data-ui-tabs-tab][data-selected] {
13017
+ color: var(--ui-interaction-selected-ink);
13018
+ }
11305
13019
  [data-ui-tabs-tab]:focus-visible {
11306
13020
  box-shadow: 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
11307
13021
  }
@@ -11309,10 +13023,10 @@
11309
13023
  color: var(--color-interaction-disabled-ink);
11310
13024
  }
11311
13025
  [data-ui-tabs-list][data-variant="subtle"] [data-ui-tabs-indicator], [data-ui-tabs-list][data-variant="pills"] [data-ui-tabs-indicator] {
11312
- background-color: var(--color-interaction-selected);
13026
+ background-color: transparent;
11313
13027
  }
11314
13028
  [data-ui-tabs-list][data-variant="line"] [data-ui-tabs-indicator] {
11315
- background-color: var(--color-intent-accent-solid);
13029
+ background-color: var(--ui-selection-solid);
11316
13030
  }
11317
13031
  [data-ui-tabs-list][data-variant="segmented"] [data-ui-tabs-indicator] {
11318
13032
  background-color: transparent;
@@ -11322,7 +13036,7 @@
11322
13036
  inset: var(--border-width-edge-control);
11323
13037
  border-radius: inherit;
11324
13038
  background-color: var(--ui-surface-color);
11325
- box-shadow: inset 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge);
13039
+ box-shadow: inset 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
11326
13040
  content: "";
11327
13041
  }
11328
13042
  [data-ui-tabs-panel] {
@@ -11337,7 +13051,7 @@
11337
13051
  --ui-option-active: var(--color-interaction-pressed);
11338
13052
  --ui-option-selected-background: var(--background-interaction-selection-neutral);
11339
13053
  --ui-option-selected-background-hover: var(--background-interaction-selection-neutral-hover);
11340
- --ui-option-selected-ink: var(--color-interaction-selection-neutral-ink);
13054
+ --ui-option-selected-ink: var(--ui-surface-ink);
11341
13055
  color: var(--ui-option-text);
11342
13056
  background-color: transparent;
11343
13057
  }
@@ -11367,8 +13081,8 @@
11367
13081
  }
11368
13082
  [data-ui-option-recipe][data-color="danger"] {
11369
13083
  --ui-option-text: var(--color-intent-danger-text);
11370
- --ui-option-hover: var(--color-intent-danger-soft);
11371
- --ui-option-active: var(--color-intent-danger-soft-pressed);
13084
+ --ui-option-hover: var(--background-interaction-selection-danger);
13085
+ --ui-option-active: var(--background-interaction-selection-danger-hover);
11372
13086
  --ui-option-selected-background: var(--background-interaction-selection-danger);
11373
13087
  --ui-option-selected-background-hover: var(--background-interaction-selection-danger-hover);
11374
13088
  --ui-option-selected-ink: var(--color-interaction-selection-danger-ink);
@@ -11406,32 +13120,32 @@
11406
13120
  color: var(--ui-surface-ink-muted);
11407
13121
  }
11408
13122
  [data-ui-select-search] {
11409
- box-shadow: inset 0 calc(var(--border-width-edge-separator) * -1) 0 var(--color-separator);
13123
+ box-shadow: inset 0 calc(var(--border-width-edge-separator) * -1) 0 var(--ui-surface-separator);
11410
13124
  }
11411
13125
  [data-ui-select-create], [data-ui-date-picker-footer] {
11412
- box-shadow: inset 0 var(--border-width-edge-separator) 0 var(--color-separator);
13126
+ box-shadow: inset 0 var(--border-width-edge-separator) 0 var(--ui-surface-separator);
11413
13127
  }
11414
13128
  @media (min-width: 40rem) {
11415
13129
  [data-ui-date-picker-presets][data-position="left"] {
11416
- box-shadow: inset calc(var(--border-width-edge-separator) * -1) 0 0 var(--color-separator);
13130
+ box-shadow: inset calc(var(--border-width-edge-separator) * -1) 0 0 var(--ui-surface-separator);
11417
13131
  }
11418
13132
  [data-ui-date-picker-presets][data-position="right"] {
11419
- box-shadow: inset var(--border-width-edge-separator) 0 0 var(--color-separator);
13133
+ box-shadow: inset var(--border-width-edge-separator) 0 0 var(--ui-surface-separator);
11420
13134
  }
11421
13135
  }
11422
13136
  [data-ui-date-picker-presets][data-position="top"] {
11423
- box-shadow: inset 0 calc(var(--border-width-edge-separator) * -1) 0 var(--color-separator);
13137
+ box-shadow: inset 0 calc(var(--border-width-edge-separator) * -1) 0 var(--ui-surface-separator);
11424
13138
  }
11425
13139
  [data-ui-date-picker-presets][data-position="bottom"] {
11426
- box-shadow: inset 0 var(--border-width-edge-separator) 0 var(--color-separator);
13140
+ box-shadow: inset 0 var(--border-width-edge-separator) 0 var(--ui-surface-separator);
11427
13141
  }
11428
13142
  :is([data-ui-menu-separator], [data-ui-select-separator]) > [role="separator"], [data-ui-select-separator] > div {
11429
- background-color: var(--color-separator);
13143
+ background-color: var(--ui-surface-separator);
11430
13144
  }
11431
13145
  [data-ui-control][data-ui-control-recipe="field"] {
11432
13146
  color: inherit;
11433
13147
  background-color: transparent;
11434
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge);
13148
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
11435
13149
  }
11436
13150
  [data-ui-control][data-ui-control-recipe="field"][data-variant="filled"] {
11437
13151
  background-color: var(--color-interaction-hover);
@@ -11441,19 +13155,19 @@
11441
13155
  background-color: var(--color-interaction-pressed);
11442
13156
  }
11443
13157
  [data-ui-control][data-ui-control-recipe="field"]:is(:hover, :active):not(:focus-within):not([data-state="open"]):not([data-disabled]):not(:disabled):not([data-invalid]):not([aria-invalid="true"]) {
11444
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge-hover);
13158
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge-hover);
11445
13159
  }
11446
13160
  [data-ui-control][data-ui-control-recipe="field"]:is(:focus-within, [data-state="open"]):not([data-disabled]):not(:disabled):not([data-invalid]):not([aria-invalid="true"]) {
11447
13161
  box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-accent-edge-strong), 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
11448
13162
  }
11449
13163
  [data-ui-control][data-ui-control-recipe="field"]:is([data-invalid], [aria-invalid="true"]) {
11450
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge, var(--color-intent-neutral-edge-strong));
13164
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge, var(--ui-surface-edge-strong));
11451
13165
  }
11452
13166
  [data-ui-control][data-ui-control-recipe="field"]:is([data-invalid], [aria-invalid="true"]):is(:hover, :active):not(:focus-within):not([data-state="open"]):not([data-disabled]):not(:disabled) {
11453
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge-hover, var(--color-intent-neutral-edge-strong));
13167
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge-hover, var(--ui-surface-edge-strong));
11454
13168
  }
11455
13169
  [data-ui-control][data-ui-control-recipe="field"]:is([data-invalid], [aria-invalid="true"]):is(:focus-within, [data-state="open"]):not([data-disabled]):not(:disabled) {
11456
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge-strong, var(--color-intent-neutral-edge-strong)), 0 0 0 var(--color-intent-danger-focus-width, var(--color-intent-accent-focus-width)) var(--color-intent-danger-focus, var(--color-intent-accent-focus));
13170
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-danger-edge-strong, var(--ui-surface-edge-strong)), 0 0 0 var(--color-intent-danger-focus-width, var(--color-intent-accent-focus-width)) var(--color-intent-danger-focus, var(--color-intent-accent-focus));
11457
13171
  }
11458
13172
  [data-ui-control][data-ui-control-recipe="field"] :is(input, textarea)::placeholder {
11459
13173
  color: var(--ui-surface-ink-muted);
@@ -11482,11 +13196,11 @@
11482
13196
  [data-ui-control][data-ui-control-recipe="dropzone"] {
11483
13197
  color: inherit;
11484
13198
  background-color: transparent;
11485
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge);
13199
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
11486
13200
  }
11487
13201
  [data-ui-control][data-ui-control-recipe="dropzone"]:is(:hover, :active):not(:focus-within):not([data-dragging]):not([data-disabled]):not([data-invalid]) {
11488
13202
  background-color: var(--color-interaction-hover);
11489
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge-hover);
13203
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge-hover);
11490
13204
  }
11491
13205
  [data-ui-control][data-ui-control-recipe="dropzone"]:is(:focus-within, [data-dragging]):not([data-disabled]):not([data-invalid]) {
11492
13206
  background-color: var(--color-intent-accent-soft);
@@ -11506,15 +13220,15 @@
11506
13220
  [data-ui-control][data-ui-control-recipe="dropzone"] [data-ui-file-upload-browse] {
11507
13221
  color: var(--color-intent-neutral-soft-ink);
11508
13222
  background-color: var(--color-intent-neutral-soft);
11509
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--color-intent-neutral-edge);
13223
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-surface-edge);
11510
13224
  }
11511
13225
  [data-ui-file-upload-item] {
11512
13226
  color: inherit;
11513
13227
  background-color: transparent;
11514
- box-shadow: 0 0 0 var(--border-width-edge-perimeter) var(--color-intent-neutral-edge);
13228
+ box-shadow: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge);
11515
13229
  }
11516
13230
  [data-ui-file-upload-item]:hover {
11517
- box-shadow: 0 0 0 var(--border-width-edge-perimeter) var(--color-intent-neutral-edge-hover);
13231
+ box-shadow: 0 0 0 var(--border-width-edge-perimeter) var(--ui-surface-edge-hover);
11518
13232
  }
11519
13233
  [data-ui-file-upload-item][data-invalid] {
11520
13234
  background-color: var(--color-intent-danger-soft);
@@ -11531,15 +13245,15 @@
11531
13245
  color: inherit;
11532
13246
  }
11533
13247
  [data-ui-selection-recipe="indicator"], [data-ui-selection-recipe="switch-track"], [data-ui-selection-recipe="slider-track"] {
11534
- --ui-selection-edge: var(--color-intent-neutral-edge);
13248
+ --ui-selection-edge: var(--ui-surface-edge);
11535
13249
  color: var(--color-intent-accent-solid-ink);
11536
13250
  background-color: var(--ui-surface-color);
11537
13251
  box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-selection-edge);
11538
13252
  }
11539
13253
  [data-ui-selection-recipe="indicator"]:is([data-checked], [data-indeterminate]), [data-ui-selection-recipe="switch-track"][data-checked] {
11540
- --ui-selection-edge: var(--color-intent-accent-edge);
11541
- color: var(--color-intent-accent-solid-ink);
11542
- background-color: var(--color-intent-accent-solid);
13254
+ --ui-selection-edge: var(--ui-interaction-selected-edge, var(--color-intent-accent-edge));
13255
+ color: var(--ui-selection-solid-ink, var(--color-intent-accent-solid-ink));
13256
+ background-color: var(--ui-selection-solid, var(--color-intent-accent-solid));
11543
13257
  }
11544
13258
  [data-ui-selection-recipe="switch-thumb"], [data-ui-selection-recipe="slider-thumb"] {
11545
13259
  background-color: var(--ui-surface-color);
@@ -11563,7 +13277,7 @@
11563
13277
  --ui-selection-edge: var(--color-intent-danger-edge-strong);
11564
13278
  }
11565
13279
  [data-ui-selection-root]:has(input:focus-visible) [data-ui-selection-recipe="indicator"], [data-ui-selection-root]:has(input:focus-visible) [data-ui-selection-recipe="switch-track"], [data-ui-selection-recipe="slider-thumb"][data-focus] {
11566
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-selection-edge, var(--color-intent-neutral-edge)), 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
13280
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-selection-edge, var(--ui-surface-edge)), 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus);
11567
13281
  }
11568
13282
  [data-ui-selection-recipe="slider-thumb"][data-focus] {
11569
13283
  box-shadow: 0 0 0 var(--color-intent-accent-focus-width) var(--color-intent-accent-focus), var(--shadow-elevation-1);