@vireo-ai/trellis-ui 0.1.56 → 0.1.58

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 (124) hide show
  1. package/package.json +2 -1
  2. package/packages/client/src/components/data-grid/styles.css +0 -16
  3. package/packages/client/src/components/panels/styles.css +2 -10
  4. package/packages/client/src/runtime/drag-and-drop/resize-handle.css +50 -0
  5. package/packages/client/src/styles/components.css +1 -1
  6. package/packages/client/src/styles/generated/theme-fonts.css +1 -1
  7. package/packages/client/src/styles/generated/theme-palette.css +275 -59
  8. package/packages/client/src/styles/generated/theme-runtime.css +1007 -24
  9. package/packages/client/src/styles/generated-sources.css +1 -1
  10. package/packages/client/src/styles/recipes/selection.css +62 -12
  11. package/packages/client/src/styles/theme-support.css +23 -2
  12. package/packages/client/types/components/accordion/index.d.ts +3 -3
  13. package/packages/client/types/components/accordion/machine.d.ts +11 -7
  14. package/packages/client/types/components/app/contract.d.ts +5 -5
  15. package/packages/client/types/components/box/contract.d.ts +2 -2
  16. package/packages/client/types/components/card/contract.d.ts +2 -2
  17. package/packages/client/types/components/common.d.ts +3 -3
  18. package/packages/client/types/components/container/contract.d.ts +1 -1
  19. package/packages/client/types/components/date-picker/contract.d.ts +2 -2
  20. package/packages/client/types/components/date-picker/machine.d.ts +2 -2
  21. package/packages/client/types/components/flex/contract.d.ts +1 -1
  22. package/packages/client/types/components/frame/contract.d.ts +2 -2
  23. package/packages/client/types/components/grid/contract.d.ts +1 -1
  24. package/packages/client/types/components/layout.d.ts +2 -2
  25. package/packages/client/types/components/menu/contract.d.ts +4 -2
  26. package/packages/client/types/components/modal/contract.d.ts +2 -2
  27. package/packages/client/types/components/section/contract.d.ts +1 -1
  28. package/packages/client/types/components/select/contract.d.ts +2 -2
  29. package/packages/client/types/components/select/machine.d.ts +2 -2
  30. package/packages/client/types/components/sidebar/contract.d.ts +3 -3
  31. package/packages/client/types/components/stack/contract.d.ts +1 -1
  32. package/packages/client/types/components/tooltip/contract.d.ts +2 -2
  33. package/packages/client/types/runtime/engine/stream.d.ts +1 -0
  34. package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.css +3278 -265
  35. package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.min.css +1 -1
  36. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/build-metadata.json +343 -342
  37. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/motion.js +1 -1
  38. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/capabilities/sortable.js +1 -1
  39. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{capability-motion-B7n3PcSH.js → capability-motion-BGVnZE_T.js} +2 -2
  40. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{capability-motion-B7n3PcSH.js.map → capability-motion-BGVnZE_T.js.map} +1 -1
  41. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{capability-sortable-BgPVyFfh.js → capability-sortable-ehmPfdn1.js} +2 -2
  42. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{capability-sortable-BgPVyFfh.js.map → capability-sortable-ehmPfdn1.js.map} +1 -1
  43. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/common-CBK89mIt.js +2 -0
  44. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/common-CBK89mIt.js.map +1 -0
  45. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{core-CYvnO__o.js → core-Ybm_WmKr.js} +2 -2
  46. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{core-CYvnO__o.js.map → core-Ybm_WmKr.js.map} +1 -1
  47. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BAghaHV-.js +2 -0
  48. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BAghaHV-.js.map +1 -0
  49. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-D-2vjhTV.js → entry.generated-BREj4oHG.js} +2 -2
  50. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BREj4oHG.js.map +1 -0
  51. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-DSWnCzSX.js → entry.generated-BZWdGtgg.js} +2 -2
  52. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-DSWnCzSX.js.map → entry.generated-BZWdGtgg.js.map} +1 -1
  53. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-CwuIK_Zx.js → entry.generated-COp9wMCd.js} +2 -2
  54. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-CwuIK_Zx.js.map → entry.generated-COp9wMCd.js.map} +1 -1
  55. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-Dfm1775-.js → entry.generated-CVOYoh61.js} +2 -2
  56. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-Dfm1775-.js.map → entry.generated-CVOYoh61.js.map} +1 -1
  57. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-d1MxpnFh.js → entry.generated-CVWqQEed.js} +2 -2
  58. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-d1MxpnFh.js.map → entry.generated-CVWqQEed.js.map} +1 -1
  59. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-BXvp4vUv.js → entry.generated-C_ObpRjR.js} +2 -2
  60. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-BXvp4vUv.js.map → entry.generated-C_ObpRjR.js.map} +1 -1
  61. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-BLduYCHm.js → entry.generated-C_SxTqg5.js} +2 -2
  62. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-BLduYCHm.js.map → entry.generated-C_SxTqg5.js.map} +1 -1
  63. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-B4lDxzh9.js → entry.generated-Cb-VMAE1.js} +2 -2
  64. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-B4lDxzh9.js.map → entry.generated-Cb-VMAE1.js.map} +1 -1
  65. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-DaC7gw-h.js → entry.generated-CfYgsDun.js} +2 -2
  66. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-DaC7gw-h.js.map → entry.generated-CfYgsDun.js.map} +1 -1
  67. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-Dcm3s3ey.js → entry.generated-D2es_Wi2.js} +2 -2
  68. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-Dcm3s3ey.js.map → entry.generated-D2es_Wi2.js.map} +1 -1
  69. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-D6ai6meC.js +2 -0
  70. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-D6ai6meC.js.map +1 -0
  71. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-CheA8dXD.js → entry.generated-DYQxGle9.js} +2 -2
  72. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-CheA8dXD.js.map → entry.generated-DYQxGle9.js.map} +1 -1
  73. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-D_jeOgRf.js +2 -0
  74. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-D_jeOgRf.js.map +1 -0
  75. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-DuY9bHje.js → entry.generated-DqL-zI7j.js} +2 -2
  76. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-DuY9bHje.js.map → entry.generated-DqL-zI7j.js.map} +1 -1
  77. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-C3y5qBcc.js → entry.generated-EqHVGr1d.js} +2 -2
  78. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-C3y5qBcc.js.map → entry.generated-EqHVGr1d.js.map} +1 -1
  79. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-z3EbXrD0.js +2 -0
  80. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-z3EbXrD0.js.map +1 -0
  81. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{flip-BGTjVnQy.js → flip-Bzn312Nc.js} +2 -2
  82. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{flip-BGTjVnQy.js.map → flip-Bzn312Nc.js.map} +1 -1
  83. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{motion-fU4E5Q4w.js → motion-DI5H1Js0.js} +3 -3
  84. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{motion-fU4E5Q4w.js.map → motion-DI5H1Js0.js.map} +1 -1
  85. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{styles-C9PrQrca.js → styles-CQDZhwd_.js} +2 -2
  86. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{styles-C9PrQrca.js.map → styles-CQDZhwd_.js.map} +1 -1
  87. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{ui-B3f-Nt9P.js → ui-CTQoglp3.js} +2 -2
  88. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/ui-CTQoglp3.js.map +1 -0
  89. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/accordion.js +1 -1
  90. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/checkbox.js +1 -1
  91. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/data-grid.js +1 -1
  92. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/date-picker.js +1 -1
  93. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/dropdown.js +1 -1
  94. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/field.js +1 -1
  95. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/index.js +1 -1
  96. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/input.js +1 -1
  97. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/modal.js +1 -1
  98. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/panels.js +1 -1
  99. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/radio.js +1 -1
  100. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/select.js +1 -1
  101. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/sidebar.js +1 -1
  102. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/slider.js +1 -1
  103. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/switch.js +1 -1
  104. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/tabs.js +1 -1
  105. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/toast.js +1 -1
  106. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/tooltip.js +1 -1
  107. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/core.js +1 -1
  108. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/index.js +1 -1
  109. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/logical-entry-manifest.json +129 -129
  110. package/packages/server/trellis_ui/static/trellis_ui/assets/js/trellis.js +5 -5
  111. package/packages/server/trellis_ui/static/trellis_ui/assets/js/trellis.min.js +5 -5
  112. package/packages/client/src/styles/layout-participation.css +0 -17
  113. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/common-De1R7Xh6.js +0 -2
  114. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/common-De1R7Xh6.js.map +0 -1
  115. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BlsLkwW8.js +0 -2
  116. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BlsLkwW8.js.map +0 -1
  117. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CC-C5gQn.js +0 -2
  118. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-CC-C5gQn.js.map +0 -1
  119. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-D-2vjhTV.js.map +0 -1
  120. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-QFVPoffg.js +0 -2
  121. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-QFVPoffg.js.map +0 -1
  122. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-pfUkaGe1.js +0 -2
  123. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-pfUkaGe1.js.map +0 -1
  124. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/ui-B3f-Nt9P.js.map +0 -1
@@ -1,5 +1,5 @@
1
1
  /* Generated by packages/theme-engine/scripts/generate-default-css.mjs. */
2
- /* Theme fc84066faf886ebd; CSS ce102a5f6a7cd480. */
2
+ /* Theme 46d048b6ba6226ca; CSS 190e7b71526fff18. */
3
3
  @theme {
4
4
  --color-separator: transparent;
5
5
  --color-separator-muted: transparent;
@@ -113,144 +113,173 @@
113
113
  --color-substrate-workspace: transparent;
114
114
  --color-substrate-workspace-ink: transparent;
115
115
  --color-substrate-workspace-ink-muted: transparent;
116
+ --color-substrate-workspace-ink-subtle: transparent;
116
117
  --color-substrate-chrome: transparent;
117
118
  --color-substrate-chrome-ink: transparent;
118
119
  --color-substrate-chrome-ink-muted: transparent;
120
+ --color-substrate-chrome-ink-subtle: transparent;
119
121
  --color-surface-workspace-0: transparent;
120
122
  --color-surface-workspace-0-ink: transparent;
121
123
  --color-surface-workspace-0-ink-muted: transparent;
124
+ --color-surface-workspace-0-ink-subtle: transparent;
122
125
  --color-surface-workspace-0-edge: transparent;
123
126
  --color-surface-workspace-0-edge-hover: transparent;
124
127
  --color-surface-workspace-0-edge-strong: transparent;
125
128
  --color-surface-workspace-1: transparent;
126
129
  --color-surface-workspace-1-ink: transparent;
127
130
  --color-surface-workspace-1-ink-muted: transparent;
131
+ --color-surface-workspace-1-ink-subtle: transparent;
128
132
  --color-surface-workspace-1-edge: transparent;
129
133
  --color-surface-workspace-1-edge-hover: transparent;
130
134
  --color-surface-workspace-1-edge-strong: transparent;
131
135
  --color-surface-workspace-2: transparent;
132
136
  --color-surface-workspace-2-ink: transparent;
133
137
  --color-surface-workspace-2-ink-muted: transparent;
138
+ --color-surface-workspace-2-ink-subtle: transparent;
134
139
  --color-surface-workspace-2-edge: transparent;
135
140
  --color-surface-workspace-2-edge-hover: transparent;
136
141
  --color-surface-workspace-2-edge-strong: transparent;
137
142
  --color-surface-workspace-3: transparent;
138
143
  --color-surface-workspace-3-ink: transparent;
139
144
  --color-surface-workspace-3-ink-muted: transparent;
145
+ --color-surface-workspace-3-ink-subtle: transparent;
140
146
  --color-surface-workspace-3-edge: transparent;
141
147
  --color-surface-workspace-3-edge-hover: transparent;
142
148
  --color-surface-workspace-3-edge-strong: transparent;
143
149
  --color-surface-workspace-4: transparent;
144
150
  --color-surface-workspace-4-ink: transparent;
145
151
  --color-surface-workspace-4-ink-muted: transparent;
152
+ --color-surface-workspace-4-ink-subtle: transparent;
146
153
  --color-surface-workspace-4-edge: transparent;
147
154
  --color-surface-workspace-4-edge-hover: transparent;
148
155
  --color-surface-workspace-4-edge-strong: transparent;
149
156
  --color-surface-workspace-5: transparent;
150
157
  --color-surface-workspace-5-ink: transparent;
151
158
  --color-surface-workspace-5-ink-muted: transparent;
159
+ --color-surface-workspace-5-ink-subtle: transparent;
152
160
  --color-surface-workspace-5-edge: transparent;
153
161
  --color-surface-workspace-5-edge-hover: transparent;
154
162
  --color-surface-workspace-5-edge-strong: transparent;
155
163
  --color-surface-workspace-6: transparent;
156
164
  --color-surface-workspace-6-ink: transparent;
157
165
  --color-surface-workspace-6-ink-muted: transparent;
166
+ --color-surface-workspace-6-ink-subtle: transparent;
158
167
  --color-surface-workspace-6-edge: transparent;
159
168
  --color-surface-workspace-6-edge-hover: transparent;
160
169
  --color-surface-workspace-6-edge-strong: transparent;
161
170
  --color-surface-workspace-7: transparent;
162
171
  --color-surface-workspace-7-ink: transparent;
163
172
  --color-surface-workspace-7-ink-muted: transparent;
173
+ --color-surface-workspace-7-ink-subtle: transparent;
164
174
  --color-surface-workspace-7-edge: transparent;
165
175
  --color-surface-workspace-7-edge-hover: transparent;
166
176
  --color-surface-workspace-7-edge-strong: transparent;
167
177
  --color-surface-workspace-8: transparent;
168
178
  --color-surface-workspace-8-ink: transparent;
169
179
  --color-surface-workspace-8-ink-muted: transparent;
180
+ --color-surface-workspace-8-ink-subtle: transparent;
170
181
  --color-surface-workspace-8-edge: transparent;
171
182
  --color-surface-workspace-8-edge-hover: transparent;
172
183
  --color-surface-workspace-8-edge-strong: transparent;
173
184
  --color-surface-chrome-0: transparent;
174
185
  --color-surface-chrome-0-ink: transparent;
175
186
  --color-surface-chrome-0-ink-muted: transparent;
187
+ --color-surface-chrome-0-ink-subtle: transparent;
176
188
  --color-surface-chrome-0-edge: transparent;
177
189
  --color-surface-chrome-0-edge-hover: transparent;
178
190
  --color-surface-chrome-0-edge-strong: transparent;
179
191
  --color-surface-chrome-1: transparent;
180
192
  --color-surface-chrome-1-ink: transparent;
181
193
  --color-surface-chrome-1-ink-muted: transparent;
194
+ --color-surface-chrome-1-ink-subtle: transparent;
182
195
  --color-surface-chrome-1-edge: transparent;
183
196
  --color-surface-chrome-1-edge-hover: transparent;
184
197
  --color-surface-chrome-1-edge-strong: transparent;
185
198
  --color-surface-chrome-2: transparent;
186
199
  --color-surface-chrome-2-ink: transparent;
187
200
  --color-surface-chrome-2-ink-muted: transparent;
201
+ --color-surface-chrome-2-ink-subtle: transparent;
188
202
  --color-surface-chrome-2-edge: transparent;
189
203
  --color-surface-chrome-2-edge-hover: transparent;
190
204
  --color-surface-chrome-2-edge-strong: transparent;
191
205
  --color-surface-chrome-3: transparent;
192
206
  --color-surface-chrome-3-ink: transparent;
193
207
  --color-surface-chrome-3-ink-muted: transparent;
208
+ --color-surface-chrome-3-ink-subtle: transparent;
194
209
  --color-surface-chrome-3-edge: transparent;
195
210
  --color-surface-chrome-3-edge-hover: transparent;
196
211
  --color-surface-chrome-3-edge-strong: transparent;
197
212
  --color-surface-chrome-4: transparent;
198
213
  --color-surface-chrome-4-ink: transparent;
199
214
  --color-surface-chrome-4-ink-muted: transparent;
215
+ --color-surface-chrome-4-ink-subtle: transparent;
200
216
  --color-surface-chrome-4-edge: transparent;
201
217
  --color-surface-chrome-4-edge-hover: transparent;
202
218
  --color-surface-chrome-4-edge-strong: transparent;
203
219
  --color-surface-chrome-5: transparent;
204
220
  --color-surface-chrome-5-ink: transparent;
205
221
  --color-surface-chrome-5-ink-muted: transparent;
222
+ --color-surface-chrome-5-ink-subtle: transparent;
206
223
  --color-surface-chrome-5-edge: transparent;
207
224
  --color-surface-chrome-5-edge-hover: transparent;
208
225
  --color-surface-chrome-5-edge-strong: transparent;
209
226
  --color-surface-chrome-6: transparent;
210
227
  --color-surface-chrome-6-ink: transparent;
211
228
  --color-surface-chrome-6-ink-muted: transparent;
229
+ --color-surface-chrome-6-ink-subtle: transparent;
212
230
  --color-surface-chrome-6-edge: transparent;
213
231
  --color-surface-chrome-6-edge-hover: transparent;
214
232
  --color-surface-chrome-6-edge-strong: transparent;
215
233
  --color-surface-chrome-7: transparent;
216
234
  --color-surface-chrome-7-ink: transparent;
217
235
  --color-surface-chrome-7-ink-muted: transparent;
236
+ --color-surface-chrome-7-ink-subtle: transparent;
218
237
  --color-surface-chrome-7-edge: transparent;
219
238
  --color-surface-chrome-7-edge-hover: transparent;
220
239
  --color-surface-chrome-7-edge-strong: transparent;
221
240
  --color-surface-chrome-8: transparent;
222
241
  --color-surface-chrome-8-ink: transparent;
223
242
  --color-surface-chrome-8-ink-muted: transparent;
243
+ --color-surface-chrome-8-ink-subtle: transparent;
224
244
  --color-surface-chrome-8-edge: transparent;
225
245
  --color-surface-chrome-8-edge-hover: transparent;
226
246
  --color-surface-chrome-8-edge-strong: transparent;
227
247
  --color-surface-0: transparent;
228
248
  --color-surface-0-ink: transparent;
229
249
  --color-surface-0-ink-muted: transparent;
250
+ --color-surface-0-ink-subtle: transparent;
230
251
  --color-surface-1: transparent;
231
252
  --color-surface-1-ink: transparent;
232
253
  --color-surface-1-ink-muted: transparent;
254
+ --color-surface-1-ink-subtle: transparent;
233
255
  --color-surface-2: transparent;
234
256
  --color-surface-2-ink: transparent;
235
257
  --color-surface-2-ink-muted: transparent;
258
+ --color-surface-2-ink-subtle: transparent;
236
259
  --color-surface-3: transparent;
237
260
  --color-surface-3-ink: transparent;
238
261
  --color-surface-3-ink-muted: transparent;
262
+ --color-surface-3-ink-subtle: transparent;
239
263
  --color-surface-4: transparent;
240
264
  --color-surface-4-ink: transparent;
241
265
  --color-surface-4-ink-muted: transparent;
266
+ --color-surface-4-ink-subtle: transparent;
242
267
  --color-surface-5: transparent;
243
268
  --color-surface-5-ink: transparent;
244
269
  --color-surface-5-ink-muted: transparent;
270
+ --color-surface-5-ink-subtle: transparent;
245
271
  --color-surface-6: transparent;
246
272
  --color-surface-6-ink: transparent;
247
273
  --color-surface-6-ink-muted: transparent;
274
+ --color-surface-6-ink-subtle: transparent;
248
275
  --color-surface-7: transparent;
249
276
  --color-surface-7-ink: transparent;
250
277
  --color-surface-7-ink-muted: transparent;
278
+ --color-surface-7-ink-subtle: transparent;
251
279
  --color-surface-8: transparent;
252
280
  --color-surface-8-ink: transparent;
253
281
  --color-surface-8-ink-muted: transparent;
282
+ --color-surface-8-ink-subtle: transparent;
254
283
  --shadow-depth-workspace-0: none;
255
284
  --shadow-depth-workspace-1: none;
256
285
  --shadow-depth-workspace-2: none;
@@ -311,7 +340,7 @@
311
340
  --color-intent-accent-soft-ink: oklch(55.25987% 0.16965 252.857709 / 1);
312
341
  --color-intent-accent-soft-ink-muted: oklch(55.25987% 0.16965 252.857709 / 1);
313
342
  --color-intent-accent-solid: oklch(56.681703% 0.186805 255.023228 / 1);
314
- --color-intent-accent-solid-hover: oklch(53.708657% 0.183273 255.984773 / 1);
343
+ --color-intent-accent-solid-hover: oklch(53.708657% 0.183273 255.984774 / 1);
315
344
  --color-intent-accent-solid-pressed: oklch(52.228467% 0.182305 256.577313 / 1);
316
345
  --color-intent-accent-solid-ink: oklch(100% 0 none / 1);
317
346
  --color-intent-accent-edge: oklch(58.440777% 0.225295 258.885918 / 0.329);
@@ -326,7 +355,7 @@
326
355
  --color-intent-danger-soft-ink: oklch(56.831333% 0.171879 23.02606 / 1);
327
356
  --color-intent-danger-soft-ink-muted: oklch(56.831333% 0.171879 23.02606 / 1);
328
357
  --color-intent-danger-solid: oklch(58.635272% 0.19334 23.02606 / 1);
329
- --color-intent-danger-solid-hover: oklch(55.633546% 0.191407 23.02606 / 1);
358
+ --color-intent-danger-solid-hover: oklch(55.633545% 0.191407 23.02606 / 1);
330
359
  --color-intent-danger-solid-pressed: oklch(54.131096% 0.191407 23.02606 / 1);
331
360
  --color-intent-danger-solid-ink: oklch(100% 0 none / 1);
332
361
  --color-intent-danger-edge: oklch(62.795536% 0.257683 29.23388 / 0.329);
@@ -341,7 +370,7 @@
341
370
  --color-intent-information-soft-ink: oklch(55.25987% 0.16965 252.857709 / 1);
342
371
  --color-intent-information-soft-ink-muted: oklch(55.25987% 0.16965 252.857709 / 1);
343
372
  --color-intent-information-solid: oklch(56.681703% 0.186805 255.023228 / 1);
344
- --color-intent-information-solid-hover: oklch(53.708657% 0.183273 255.984773 / 1);
373
+ --color-intent-information-solid-hover: oklch(53.708657% 0.183273 255.984774 / 1);
345
374
  --color-intent-information-solid-pressed: oklch(52.228467% 0.182305 256.577313 / 1);
346
375
  --color-intent-information-solid-ink: oklch(100% 0 none / 1);
347
376
  --color-intent-information-edge: oklch(58.440777% 0.225295 258.885918 / 0.329);
@@ -358,7 +387,7 @@
358
387
  --color-intent-neutral-solid: oklch(12.382253% 0 none / 1);
359
388
  --color-intent-neutral-solid-hover: oklch(32.394043% 0 none / 1);
360
389
  --color-intent-neutral-solid-pressed: oklch(36.397949% 0 none / 1);
361
- --color-intent-neutral-solid-ink: oklch(94.063697% 0 none / 1);
390
+ --color-intent-neutral-solid-ink: oklch(94.063698% 0 none / 1);
362
391
  --color-intent-neutral-edge: oklch(52.289138% 0.032536 53.126276 / 0.161);
363
392
  --color-intent-neutral-edge-hover: oklch(29.765441% 0.053308 217.459714 / 0.229);
364
393
  --color-intent-neutral-edge-strong: oklch(0% 0 none / 0.294);
@@ -413,144 +442,173 @@
413
442
  --color-substrate-workspace: oklch(98.510365% 0 none / 1);
414
443
  --color-substrate-workspace-ink: oklch(20.93472% 0 none / 1);
415
444
  --color-substrate-workspace-ink-muted: oklch(55.779494% 0 none / 1);
445
+ --color-substrate-workspace-ink-subtle: oklch(36.986441% 0 none / 1);
416
446
  --color-substrate-chrome: oklch(96.010365% 0 none / 1);
417
447
  --color-substrate-chrome-ink: oklch(17.101275% 0 none / 1);
418
448
  --color-substrate-chrome-ink-muted: oklch(54.036418% 0 none / 1);
449
+ --color-substrate-chrome-ink-subtle: oklch(35.169857% 0 none / 1);
419
450
  --color-surface-workspace-0: oklch(98.510365% 0 none / 1);
420
451
  --color-surface-workspace-0-ink: oklch(20.93472% 0 none / 1);
421
452
  --color-surface-workspace-0-ink-muted: oklch(55.779494% 0 none / 1);
453
+ --color-surface-workspace-0-ink-subtle: oklch(36.986441% 0 none / 1);
422
454
  --color-surface-workspace-0-edge: oklch(95.012328% 0.001177 48.833534 / 1);
423
455
  --color-surface-workspace-0-edge-hover: oklch(94.010893% 0.000706 226.904518 / 1);
424
456
  --color-surface-workspace-0-edge-strong: oklch(92.510344% 0 none / 1);
425
457
  --color-surface-workspace-1: oklch(99.110365% 0 none / 1);
426
458
  --color-surface-workspace-1-ink: oklch(21.693184% 0 none / 1);
427
459
  --color-surface-workspace-1-ink-muted: oklch(56.194798% 0 none / 1);
460
+ --color-surface-workspace-1-ink-subtle: oklch(37.409802% 0 none / 1);
428
461
  --color-surface-workspace-1-edge: oklch(95.612259% 0.001152 48.831271 / 1);
429
462
  --color-surface-workspace-1-edge-hover: oklch(94.610885% 0.000692 226.905723 / 1);
430
463
  --color-surface-workspace-1-edge-strong: oklch(93.110343% 0 none / 1);
431
464
  --color-surface-workspace-2: oklch(100% 0 none / 1);
432
465
  --color-surface-workspace-2-ink: oklch(22.74366% 0 none / 1);
433
466
  --color-surface-workspace-2-ink-muted: oklch(56.808564% 0 none / 1);
467
+ --color-surface-workspace-2-ink-subtle: oklch(38.029524% 0 none / 1);
434
468
  --color-surface-workspace-2-edge: oklch(96.501777% 0.001116 48.828064 / 1);
435
469
  --color-surface-workspace-2-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
436
470
  --color-surface-workspace-2-edge-strong: oklch(93.999998% 0 none / 1);
437
471
  --color-surface-workspace-3: oklch(100% 0 none / 1);
438
472
  --color-surface-workspace-3-ink: oklch(22.74366% 0 none / 1);
439
473
  --color-surface-workspace-3-ink-muted: oklch(56.808564% 0 none / 1);
474
+ --color-surface-workspace-3-ink-subtle: oklch(38.029524% 0 none / 1);
440
475
  --color-surface-workspace-3-edge: oklch(96.501777% 0.001116 48.828064 / 1);
441
476
  --color-surface-workspace-3-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
442
477
  --color-surface-workspace-3-edge-strong: oklch(93.999998% 0 none / 1);
443
478
  --color-surface-workspace-4: oklch(100% 0 none / 1);
444
479
  --color-surface-workspace-4-ink: oklch(22.74366% 0 none / 1);
445
480
  --color-surface-workspace-4-ink-muted: oklch(56.808564% 0 none / 1);
481
+ --color-surface-workspace-4-ink-subtle: oklch(38.029524% 0 none / 1);
446
482
  --color-surface-workspace-4-edge: oklch(96.501777% 0.001116 48.828064 / 1);
447
483
  --color-surface-workspace-4-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
448
484
  --color-surface-workspace-4-edge-strong: oklch(93.999998% 0 none / 1);
449
485
  --color-surface-workspace-5: oklch(100% 0 none / 1);
450
486
  --color-surface-workspace-5-ink: oklch(22.74366% 0 none / 1);
451
487
  --color-surface-workspace-5-ink-muted: oklch(56.808564% 0 none / 1);
488
+ --color-surface-workspace-5-ink-subtle: oklch(38.029524% 0 none / 1);
452
489
  --color-surface-workspace-5-edge: oklch(96.501777% 0.001116 48.828064 / 1);
453
490
  --color-surface-workspace-5-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
454
491
  --color-surface-workspace-5-edge-strong: oklch(93.999998% 0 none / 1);
455
492
  --color-surface-workspace-6: oklch(100% 0 none / 1);
456
493
  --color-surface-workspace-6-ink: oklch(22.74366% 0 none / 1);
457
494
  --color-surface-workspace-6-ink-muted: oklch(56.808564% 0 none / 1);
495
+ --color-surface-workspace-6-ink-subtle: oklch(38.029524% 0 none / 1);
458
496
  --color-surface-workspace-6-edge: oklch(96.501777% 0.001116 48.828064 / 1);
459
497
  --color-surface-workspace-6-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
460
498
  --color-surface-workspace-6-edge-strong: oklch(93.999998% 0 none / 1);
461
499
  --color-surface-workspace-7: oklch(100% 0 none / 1);
462
500
  --color-surface-workspace-7-ink: oklch(22.74366% 0 none / 1);
463
501
  --color-surface-workspace-7-ink-muted: oklch(56.808564% 0 none / 1);
502
+ --color-surface-workspace-7-ink-subtle: oklch(38.029524% 0 none / 1);
464
503
  --color-surface-workspace-7-edge: oklch(96.501777% 0.001116 48.828064 / 1);
465
504
  --color-surface-workspace-7-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
466
505
  --color-surface-workspace-7-edge-strong: oklch(93.999998% 0 none / 1);
467
506
  --color-surface-workspace-8: oklch(100% 0 none / 1);
468
507
  --color-surface-workspace-8-ink: oklch(22.74366% 0 none / 1);
469
508
  --color-surface-workspace-8-ink-muted: oklch(56.808564% 0 none / 1);
509
+ --color-surface-workspace-8-ink-subtle: oklch(38.029524% 0 none / 1);
470
510
  --color-surface-workspace-8-edge: oklch(96.501777% 0.001116 48.828064 / 1);
471
511
  --color-surface-workspace-8-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
472
512
  --color-surface-workspace-8-edge-strong: oklch(93.999998% 0 none / 1);
473
513
  --color-surface-chrome-0: oklch(96.010365% 0 none / 1);
474
514
  --color-surface-chrome-0-ink: oklch(17.101275% 0 none / 1);
475
515
  --color-surface-chrome-0-ink-muted: oklch(54.036418% 0 none / 1);
516
+ --color-surface-chrome-0-ink-subtle: oklch(35.169857% 0 none / 1);
476
517
  --color-surface-chrome-0-edge: oklch(92.51274% 0.001291 48.84392 / 1);
477
518
  --color-surface-chrome-0-edge-hover: oklch(91.511% 0.000765 226.899059 / 1);
478
519
  --color-surface-chrome-0-edge-strong: oklch(90.010356% 0 none / 1);
479
520
  --color-surface-chrome-1: oklch(96.610365% 0 none / 1);
480
- --color-surface-chrome-1-ink: oklch(18.154498% 0 none / 1);
521
+ --color-surface-chrome-1-ink: oklch(18.154497% 0 none / 1);
481
522
  --color-surface-chrome-1-ink-muted: oklch(54.456699% 0 none / 1);
523
+ --color-surface-chrome-1-ink-subtle: oklch(35.614164% 0 none / 1);
482
524
  --color-surface-chrome-1-edge: oklch(93.112638% 0.001262 48.841277 / 1);
483
525
  --color-surface-chrome-1-edge-hover: oklch(92.11098% 0.00075 226.900438 / 1);
484
526
  --color-surface-chrome-1-edge-strong: oklch(90.610362% 0 none / 1);
485
527
  --color-surface-chrome-2: oklch(100% 0 none / 1);
486
528
  --color-surface-chrome-2-ink: oklch(22.74366% 0 none / 1);
487
529
  --color-surface-chrome-2-ink-muted: oklch(56.808564% 0 none / 1);
530
+ --color-surface-chrome-2-ink-subtle: oklch(38.029524% 0 none / 1);
488
531
  --color-surface-chrome-2-edge: oklch(96.501777% 0.001116 48.828064 / 1);
489
532
  --color-surface-chrome-2-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
490
533
  --color-surface-chrome-2-edge-strong: oklch(93.999998% 0 none / 1);
491
534
  --color-surface-chrome-3: oklch(100% 0 none / 1);
492
535
  --color-surface-chrome-3-ink: oklch(22.74366% 0 none / 1);
493
536
  --color-surface-chrome-3-ink-muted: oklch(56.808564% 0 none / 1);
537
+ --color-surface-chrome-3-ink-subtle: oklch(38.029524% 0 none / 1);
494
538
  --color-surface-chrome-3-edge: oklch(96.501777% 0.001116 48.828064 / 1);
495
539
  --color-surface-chrome-3-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
496
540
  --color-surface-chrome-3-edge-strong: oklch(93.999998% 0 none / 1);
497
541
  --color-surface-chrome-4: oklch(100% 0 none / 1);
498
542
  --color-surface-chrome-4-ink: oklch(22.74366% 0 none / 1);
499
543
  --color-surface-chrome-4-ink-muted: oklch(56.808564% 0 none / 1);
544
+ --color-surface-chrome-4-ink-subtle: oklch(38.029524% 0 none / 1);
500
545
  --color-surface-chrome-4-edge: oklch(96.501777% 0.001116 48.828064 / 1);
501
546
  --color-surface-chrome-4-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
502
547
  --color-surface-chrome-4-edge-strong: oklch(93.999998% 0 none / 1);
503
548
  --color-surface-chrome-5: oklch(100% 0 none / 1);
504
549
  --color-surface-chrome-5-ink: oklch(22.74366% 0 none / 1);
505
550
  --color-surface-chrome-5-ink-muted: oklch(56.808564% 0 none / 1);
551
+ --color-surface-chrome-5-ink-subtle: oklch(38.029524% 0 none / 1);
506
552
  --color-surface-chrome-5-edge: oklch(96.501777% 0.001116 48.828064 / 1);
507
553
  --color-surface-chrome-5-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
508
554
  --color-surface-chrome-5-edge-strong: oklch(93.999998% 0 none / 1);
509
555
  --color-surface-chrome-6: oklch(100% 0 none / 1);
510
556
  --color-surface-chrome-6-ink: oklch(22.74366% 0 none / 1);
511
557
  --color-surface-chrome-6-ink-muted: oklch(56.808564% 0 none / 1);
558
+ --color-surface-chrome-6-ink-subtle: oklch(38.029524% 0 none / 1);
512
559
  --color-surface-chrome-6-edge: oklch(96.501777% 0.001116 48.828064 / 1);
513
560
  --color-surface-chrome-6-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
514
561
  --color-surface-chrome-6-edge-strong: oklch(93.999998% 0 none / 1);
515
562
  --color-surface-chrome-7: oklch(100% 0 none / 1);
516
563
  --color-surface-chrome-7-ink: oklch(22.74366% 0 none / 1);
517
564
  --color-surface-chrome-7-ink-muted: oklch(56.808564% 0 none / 1);
565
+ --color-surface-chrome-7-ink-subtle: oklch(38.029524% 0 none / 1);
518
566
  --color-surface-chrome-7-edge: oklch(96.501777% 0.001116 48.828064 / 1);
519
567
  --color-surface-chrome-7-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
520
568
  --color-surface-chrome-7-edge-strong: oklch(93.999998% 0 none / 1);
521
569
  --color-surface-chrome-8: oklch(100% 0 none / 1);
522
570
  --color-surface-chrome-8-ink: oklch(22.74366% 0 none / 1);
523
571
  --color-surface-chrome-8-ink-muted: oklch(56.808564% 0 none / 1);
572
+ --color-surface-chrome-8-ink-subtle: oklch(38.029524% 0 none / 1);
524
573
  --color-surface-chrome-8-edge: oklch(96.501777% 0.001116 48.828064 / 1);
525
574
  --color-surface-chrome-8-edge-hover: oklch(95.500495% 0.000673 226.90744 / 1);
526
575
  --color-surface-chrome-8-edge-strong: oklch(93.999998% 0 none / 1);
527
576
  --color-surface-0: oklch(98.510365% 0 none / 1);
528
577
  --color-surface-0-ink: oklch(20.93472% 0 none / 1);
529
578
  --color-surface-0-ink-muted: oklch(55.779494% 0 none / 1);
579
+ --color-surface-0-ink-subtle: oklch(36.986441% 0 none / 1);
530
580
  --color-surface-1: oklch(99.110365% 0 none / 1);
531
581
  --color-surface-1-ink: oklch(21.693184% 0 none / 1);
532
582
  --color-surface-1-ink-muted: oklch(56.194798% 0 none / 1);
583
+ --color-surface-1-ink-subtle: oklch(37.409802% 0 none / 1);
533
584
  --color-surface-2: oklch(100% 0 none / 1);
534
585
  --color-surface-2-ink: oklch(22.74366% 0 none / 1);
535
586
  --color-surface-2-ink-muted: oklch(56.808564% 0 none / 1);
587
+ --color-surface-2-ink-subtle: oklch(38.029524% 0 none / 1);
536
588
  --color-surface-3: oklch(100% 0 none / 1);
537
589
  --color-surface-3-ink: oklch(22.74366% 0 none / 1);
538
590
  --color-surface-3-ink-muted: oklch(56.808564% 0 none / 1);
591
+ --color-surface-3-ink-subtle: oklch(38.029524% 0 none / 1);
539
592
  --color-surface-4: oklch(100% 0 none / 1);
540
593
  --color-surface-4-ink: oklch(22.74366% 0 none / 1);
541
594
  --color-surface-4-ink-muted: oklch(56.808564% 0 none / 1);
595
+ --color-surface-4-ink-subtle: oklch(38.029524% 0 none / 1);
542
596
  --color-surface-5: oklch(100% 0 none / 1);
543
597
  --color-surface-5-ink: oklch(22.74366% 0 none / 1);
544
598
  --color-surface-5-ink-muted: oklch(56.808564% 0 none / 1);
599
+ --color-surface-5-ink-subtle: oklch(38.029524% 0 none / 1);
545
600
  --color-surface-6: oklch(100% 0 none / 1);
546
601
  --color-surface-6-ink: oklch(22.74366% 0 none / 1);
547
602
  --color-surface-6-ink-muted: oklch(56.808564% 0 none / 1);
603
+ --color-surface-6-ink-subtle: oklch(38.029524% 0 none / 1);
548
604
  --color-surface-7: oklch(100% 0 none / 1);
549
605
  --color-surface-7-ink: oklch(22.74366% 0 none / 1);
550
606
  --color-surface-7-ink-muted: oklch(56.808564% 0 none / 1);
607
+ --color-surface-7-ink-subtle: oklch(38.029524% 0 none / 1);
551
608
  --color-surface-8: oklch(100% 0 none / 1);
552
609
  --color-surface-8-ink: oklch(22.74366% 0 none / 1);
553
610
  --color-surface-8-ink-muted: oklch(56.808564% 0 none / 1);
611
+ --color-surface-8-ink-subtle: oklch(38.029524% 0 none / 1);
554
612
  --color-intent-accent-focus-width: 1px;
555
613
  --color-intent-danger-focus-width: 1px;
556
614
  --color-intent-information-focus-width: 1px;
@@ -711,146 +769,175 @@
711
769
  --color-interaction-disabled-edge: oklch(56.829515% 0.000719 197.137733 / 0.294);
712
770
  --color-scrim: oklch(20.962653% 0 none / 0.55);
713
771
  --color-substrate-workspace: oklch(20.462653% 0 none / 1);
714
- --color-substrate-workspace-ink: oklch(92.184718% 0 none / 1);
715
- --color-substrate-workspace-ink-muted: oklch(76.561054% 0 none / 1);
772
+ --color-substrate-workspace-ink: oklch(92.184719% 0 none / 1);
773
+ --color-substrate-workspace-ink-muted: oklch(76.561055% 0 none / 1);
774
+ --color-substrate-workspace-ink-subtle: oklch(84.69858% 0 none / 1);
716
775
  --color-substrate-chrome: oklch(22.462653% 0 none / 1);
717
776
  --color-substrate-chrome-ink: oklch(92.431093% 0 none / 1);
718
- --color-substrate-chrome-ink-muted: oklch(76.852224% 0 none / 1);
777
+ --color-substrate-chrome-ink-muted: oklch(76.852225% 0 none / 1);
778
+ --color-substrate-chrome-ink-subtle: oklch(84.964401% 0 none / 1);
719
779
  --color-surface-workspace-0: oklch(20.462653% 0 none / 1);
720
- --color-surface-workspace-0-ink: oklch(92.184718% 0 none / 1);
721
- --color-surface-workspace-0-ink-muted: oklch(76.561054% 0 none / 1);
780
+ --color-surface-workspace-0-ink: oklch(92.184719% 0 none / 1);
781
+ --color-surface-workspace-0-ink-muted: oklch(76.561055% 0 none / 1);
782
+ --color-surface-workspace-0-ink-subtle: oklch(84.69858% 0 none / 1);
722
783
  --color-surface-workspace-0-edge: oklch(23.962493% 0.000349 197.134607 / 1);
723
784
  --color-surface-workspace-0-edge-hover: oklch(24.962499% 0.000387 197.133078 / 1);
724
785
  --color-surface-workspace-0-edge-strong: oklch(26.462687% 0.000189 none / 1);
725
786
  --color-surface-workspace-1: oklch(22.962653% 0 none / 1);
726
787
  --color-surface-workspace-1-ink: oklch(92.501588% 0 none / 1);
727
- --color-surface-workspace-1-ink-muted: oklch(76.93548% 0 none / 1);
788
+ --color-surface-workspace-1-ink-muted: oklch(76.935481% 0 none / 1);
789
+ --color-surface-workspace-1-ink-subtle: oklch(85.040439% 0 none / 1);
728
790
  --color-surface-workspace-1-edge: oklch(26.462469% 0.000365 197.135878 / 1);
729
791
  --color-surface-workspace-1-edge-hover: oklch(27.462498% 0.000404 197.134346 / 1);
730
792
  --color-surface-workspace-1-edge-strong: oklch(28.962633% 0.000197 none / 1);
731
793
  --color-surface-workspace-2: oklch(25.462653% 0.000386 251.779887 / 1);
732
794
  --color-surface-workspace-2-ink: oklch(92.908812% 0.000077 251.779887 / 1);
733
795
  --color-surface-workspace-2-ink-muted: oklch(77.415975% 0.000077 251.779887 / 1);
796
+ --color-surface-workspace-2-ink-subtle: oklch(85.47952% 0.000077 251.779887 / 1);
734
797
  --color-surface-workspace-2-edge: oklch(28.962508% 0.00059 219.703785 / 1);
735
798
  --color-surface-workspace-2-edge-hover: oklch(29.962519% 0.00061 217.143283 / 1);
736
799
  --color-surface-workspace-2-edge-strong: oklch(31.462634% 0.000388 226.187054 / 1);
737
800
  --color-surface-workspace-3: oklch(28.262653% 0.000579 251.779887 / 1);
738
801
  --color-surface-workspace-3-ink: oklch(93.477871% 0.000116 251.779887 / 1);
739
802
  --color-surface-workspace-3-ink-muted: oklch(78.08603% 0.000116 251.779887 / 1);
803
+ --color-surface-workspace-3-ink-subtle: oklch(86.092571% 0.000116 251.779887 / 1);
740
804
  --color-surface-workspace-3-edge: oklch(31.762502% 0.000736 224.710405 / 1);
741
805
  --color-surface-workspace-3-edge-hover: oklch(32.7625% 0.000745 222.113099 / 1);
742
806
  --color-surface-workspace-3-edge-strong: oklch(34.262654% 0.000508 231.447284 / 1);
743
807
  --color-surface-workspace-4: oklch(31.262653% 0.000965 251.779887 / 1);
744
808
  --color-surface-workspace-4-ink: oklch(94.237603% 0.000193 251.779887 / 1);
745
- --color-surface-workspace-4-ink-muted: oklch(78.978204% 0.000193 251.779887 / 1);
809
+ --color-surface-workspace-4-ink-muted: oklch(78.978205% 0.000193 251.779887 / 1);
810
+ --color-surface-workspace-4-ink-subtle: oklch(86.91013% 0.000193 251.779887 / 1);
746
811
  --color-surface-workspace-4-edge: oklch(34.762473% 0.001017 230.725454 / 1);
747
812
  --color-surface-workspace-4-edge-hover: oklch(35.76248% 0.001005 228.347129 / 1);
748
813
  --color-surface-workspace-4-edge-strong: oklch(37.262601% 0.000744 237.136646 / 1);
749
814
  --color-surface-workspace-5: oklch(34.462653% 0.001351 251.779887 / 1);
750
- --color-surface-workspace-5-ink: oklch(95.30435% 0.00027 251.779887 / 1);
815
+ --color-surface-workspace-5-ink: oklch(95.304351% 0.00027 251.779887 / 1);
751
816
  --color-surface-workspace-5-ink-muted: oklch(80.226419% 0.00027 251.779887 / 1);
817
+ --color-surface-workspace-5-ink-subtle: oklch(88.056364% 0.00027 251.779887 / 1);
752
818
  --color-surface-workspace-5-edge: oklch(37.962393% 0.001299 233.299247 / 1);
753
819
  --color-surface-workspace-5-edge-hover: oklch(38.962419% 0.001266 231.218628 / 1);
754
820
  --color-surface-workspace-5-edge-strong: oklch(40.462488% 0.000975 239.703581 / 1);
755
821
  --color-surface-workspace-6: oklch(37.862653% 0.001737 251.779887 / 1);
756
822
  --color-surface-workspace-6-ink: oklch(96.597068% 0.000347 251.779887 / 1);
757
823
  --color-surface-workspace-6-ink-muted: oklch(81.732335% 0.000347 251.779887 / 1);
824
+ --color-surface-workspace-6-ink-subtle: oklch(89.442837% 0.000347 251.779887 / 1);
758
825
  --color-surface-workspace-6-edge: oklch(41.362226% 0.001561 233.527095 / 1);
759
826
  --color-surface-workspace-6-edge-hover: oklch(42.362252% 0.001507 231.763263 / 1);
760
827
  --color-surface-workspace-6-edge-strong: oklch(43.862347% 0.00118 240.680589 / 1);
761
828
  --color-surface-workspace-7: oklch(41.462653% 0.002316 251.779887 / 1);
762
- --color-surface-workspace-7-ink: oklch(98.092835% 0.000463 251.779887 / 1);
829
+ --color-surface-workspace-7-ink: oklch(98.092836% 0.000463 251.779887 / 1);
763
830
  --color-surface-workspace-7-ink-muted: oklch(83.46613% 0.000463 251.779887 / 1);
831
+ --color-surface-workspace-7-ink-subtle: oklch(91.043742% 0.000463 251.779887 / 1);
764
832
  --color-surface-workspace-7-edge: oklch(44.961626% 0.001866 231.821819 / 1);
765
833
  --color-surface-workspace-7-edge-hover: oklch(45.961728% 0.001786 230.699768 / 1);
766
834
  --color-surface-workspace-7-edge-strong: oklch(47.461907% 0.001423 241.125315 / 1);
767
835
  --color-surface-workspace-8: oklch(45.262653% 0.002896 251.779887 / 1);
768
836
  --color-surface-workspace-8-ink: oklch(99.80618% 0.000579 251.779887 / 1);
769
837
  --color-surface-workspace-8-ink-muted: oklch(85.441382% 0.000579 251.779887 / 1);
838
+ --color-surface-workspace-8-ink-subtle: oklch(93.08733% 0.000579 251.779887 / 1);
770
839
  --color-surface-workspace-8-edge: oklch(48.762653% 0.002747 251.779887 / 1);
771
840
  --color-surface-workspace-8-edge-hover: oklch(49.759858% 0.001852 221.880992 / 1);
772
841
  --color-surface-workspace-8-edge-strong: oklch(51.26084% 0.001491 239.070665 / 1);
773
842
  --color-surface-chrome-0: oklch(22.462653% 0 none / 1);
774
843
  --color-surface-chrome-0-ink: oklch(92.431093% 0 none / 1);
775
- --color-surface-chrome-0-ink-muted: oklch(76.852224% 0 none / 1);
844
+ --color-surface-chrome-0-ink-muted: oklch(76.852225% 0 none / 1);
845
+ --color-surface-chrome-0-ink-subtle: oklch(84.964401% 0 none / 1);
776
846
  --color-surface-chrome-0-edge: oklch(25.962476% 0.000361 197.135656 / 1);
777
847
  --color-surface-chrome-0-edge-hover: oklch(26.962476% 0.000401 197.134123 / 1);
778
848
  --color-surface-chrome-0-edge-strong: oklch(28.462668% 0.000195 none / 1);
779
849
  --color-surface-chrome-1: oklch(24.962653% 0 none / 1);
780
- --color-surface-chrome-1-ink: oklch(92.819977% 0 none / 1);
850
+ --color-surface-chrome-1-ink: oklch(92.819978% 0 none / 1);
781
851
  --color-surface-chrome-1-ink-muted: oklch(77.311197% 0 none / 1);
852
+ --color-surface-chrome-1-ink-subtle: oklch(85.38375% 0 none / 1);
782
853
  --color-surface-chrome-1-edge: oklch(28.462474% 0.00038 197.136612 / 1);
783
854
  --color-surface-chrome-1-edge-hover: oklch(29.462476% 0.00042 197.135101 / 1);
784
855
  --color-surface-chrome-1-edge-strong: oklch(30.96262% 0.000204 none / 1);
785
856
  --color-surface-chrome-2: oklch(27.462653% 0.000386 251.779887 / 1);
786
857
  --color-surface-chrome-2-ink: oklch(93.302555% 0.000077 251.779887 / 1);
787
858
  --color-surface-chrome-2-ink-muted: oklch(77.879753% 0.000077 251.779887 / 1);
859
+ --color-surface-chrome-2-ink-subtle: oklch(85.903759% 0.000077 251.779887 / 1);
788
860
  --color-surface-chrome-2-edge: oklch(30.962479% 0.000607 219.086041 / 1);
789
861
  --color-surface-chrome-2-edge-hover: oklch(31.962502% 0.000628 216.618278 / 1);
790
862
  --color-surface-chrome-2-edge-strong: oklch(33.462647% 0.000397 225.793124 / 1);
791
863
  --color-surface-chrome-3: oklch(30.262653% 0.000579 251.779887 / 1);
792
864
  --color-surface-chrome-3-ink: oklch(93.964672% 0.000116 251.779887 / 1);
793
865
  --color-surface-chrome-3-ink-muted: oklch(78.657981% 0.000116 251.779887 / 1);
866
+ --color-surface-chrome-3-ink-subtle: oklch(86.616532% 0.000116 251.779887 / 1);
794
867
  --color-surface-chrome-3-edge: oklch(33.762476% 0.000755 223.806415 / 1);
795
868
  --color-surface-chrome-3-edge-hover: oklch(34.762482% 0.000766 221.2992 / 1);
796
869
  --color-surface-chrome-3-edge-strong: oklch(36.262627% 0.000517 230.883702 / 1);
797
870
  --color-surface-chrome-4: oklch(33.262653% 0.000965 251.779887 / 1);
798
871
  --color-surface-chrome-4-ink: oklch(94.876877% 0.000193 251.779887 / 1);
799
- --color-surface-chrome-4-ink-muted: oklch(79.72682% 0.000193 251.779887 / 1);
872
+ --color-surface-chrome-4-ink-muted: oklch(79.726821% 0.000193 251.779887 / 1);
873
+ --color-surface-chrome-4-ink-subtle: oklch(87.597263% 0.000193 251.779887 / 1);
800
874
  --color-surface-chrome-4-edge: oklch(36.762434% 0.001035 229.50762 / 1);
801
875
  --color-surface-chrome-4-edge-hover: oklch(37.762464% 0.001024 227.196654 / 1);
802
876
  --color-surface-chrome-4-edge-strong: oklch(39.262572% 0.000749 236.454555 / 1);
803
877
  --color-surface-chrome-5: oklch(36.462653% 0.001351 251.779887 / 1);
804
878
  --color-surface-chrome-5-ink: oklch(96.050221% 0.00027 251.779887 / 1);
805
879
  --color-surface-chrome-5-ink-muted: oklch(81.096153% 0.00027 251.779887 / 1);
880
+ --color-surface-chrome-5-ink-subtle: oklch(88.856656% 0.00027 251.779887 / 1);
806
881
  --color-surface-chrome-5-edge: oklch(39.962341% 0.001312 231.605166 / 1);
807
882
  --color-surface-chrome-5-edge-hover: oklch(40.962375% 0.001279 229.607436 / 1);
808
883
  --color-surface-chrome-5-edge-strong: oklch(42.462487% 0.00097 238.845262 / 1);
809
884
  --color-surface-chrome-6: oklch(39.862653% 0.001737 251.779887 / 1);
810
885
  --color-surface-chrome-6-ink: oklch(97.412147% 0.000347 251.779887 / 1);
811
886
  --color-surface-chrome-6-ink-muted: oklch(82.678213% 0.000347 251.779887 / 1);
887
+ --color-surface-chrome-6-ink-subtle: oklch(90.315631% 0.000347 251.779887 / 1);
812
888
  --color-surface-chrome-6-edge: oklch(43.362099% 0.001562 230.809286 / 1);
813
889
  --color-surface-chrome-6-edge-hover: oklch(44.362153% 0.001508 229.256581 / 1);
814
890
  --color-surface-chrome-6-edge-strong: oklch(45.862305% 0.001155 239.47996 / 1);
815
891
  --color-surface-chrome-7: oklch(43.462653% 0.002316 251.779887 / 1);
816
892
  --color-surface-chrome-7-ink: oklch(98.977631% 0.000463 251.779887 / 1);
817
893
  --color-surface-chrome-7-ink-muted: oklch(84.487538% 0.000463 251.779887 / 1);
894
+ --color-surface-chrome-7-ink-subtle: oklch(91.989098% 0.000463 251.779887 / 1);
818
895
  --color-surface-chrome-7-edge: oklch(46.961102% 0.001814 226.0527 / 1);
819
896
  --color-surface-chrome-7-edge-hover: oklch(47.961383% 0.001739 225.859971 / 1);
820
897
  --color-surface-chrome-7-edge-strong: oklch(49.461752% 0.001348 239.206648 / 1);
821
898
  --color-surface-chrome-8: oklch(47.262653% 0.002896 251.779887 / 1);
822
899
  --color-surface-chrome-8-ink: oklch(100% 0 none / 1);
823
900
  --color-surface-chrome-8-ink-muted: oklch(86.636302% 0.000579 251.779887 / 1);
901
+ --color-surface-chrome-8-ink-subtle: oklch(95.962844% 0.000579 251.779887 / 1);
824
902
  --color-surface-chrome-8-edge: oklch(50.76263% 0.002703 251.779887 / 1);
825
903
  --color-surface-chrome-8-edge-hover: oklch(51.762631% 0.002649 251.779887 / 1);
826
904
  --color-surface-chrome-8-edge-strong: oklch(53.260215% 0.001288 234.367506 / 1);
827
905
  --color-surface-0: oklch(20.462653% 0 none / 1);
828
- --color-surface-0-ink: oklch(92.184718% 0 none / 1);
829
- --color-surface-0-ink-muted: oklch(76.561054% 0 none / 1);
906
+ --color-surface-0-ink: oklch(92.184719% 0 none / 1);
907
+ --color-surface-0-ink-muted: oklch(76.561055% 0 none / 1);
908
+ --color-surface-0-ink-subtle: oklch(84.69858% 0 none / 1);
830
909
  --color-surface-1: oklch(22.962653% 0 none / 1);
831
910
  --color-surface-1-ink: oklch(92.501588% 0 none / 1);
832
- --color-surface-1-ink-muted: oklch(76.93548% 0 none / 1);
911
+ --color-surface-1-ink-muted: oklch(76.935481% 0 none / 1);
912
+ --color-surface-1-ink-subtle: oklch(85.040439% 0 none / 1);
833
913
  --color-surface-2: oklch(25.462653% 0.000386 251.779887 / 1);
834
914
  --color-surface-2-ink: oklch(92.908812% 0.000077 251.779887 / 1);
835
915
  --color-surface-2-ink-muted: oklch(77.415975% 0.000077 251.779887 / 1);
916
+ --color-surface-2-ink-subtle: oklch(85.47952% 0.000077 251.779887 / 1);
836
917
  --color-surface-3: oklch(28.262653% 0.000579 251.779887 / 1);
837
918
  --color-surface-3-ink: oklch(93.477871% 0.000116 251.779887 / 1);
838
919
  --color-surface-3-ink-muted: oklch(78.08603% 0.000116 251.779887 / 1);
920
+ --color-surface-3-ink-subtle: oklch(86.092571% 0.000116 251.779887 / 1);
839
921
  --color-surface-4: oklch(31.262653% 0.000965 251.779887 / 1);
840
922
  --color-surface-4-ink: oklch(94.237603% 0.000193 251.779887 / 1);
841
- --color-surface-4-ink-muted: oklch(78.978204% 0.000193 251.779887 / 1);
923
+ --color-surface-4-ink-muted: oklch(78.978205% 0.000193 251.779887 / 1);
924
+ --color-surface-4-ink-subtle: oklch(86.91013% 0.000193 251.779887 / 1);
842
925
  --color-surface-5: oklch(34.462653% 0.001351 251.779887 / 1);
843
- --color-surface-5-ink: oklch(95.30435% 0.00027 251.779887 / 1);
926
+ --color-surface-5-ink: oklch(95.304351% 0.00027 251.779887 / 1);
844
927
  --color-surface-5-ink-muted: oklch(80.226419% 0.00027 251.779887 / 1);
928
+ --color-surface-5-ink-subtle: oklch(88.056364% 0.00027 251.779887 / 1);
845
929
  --color-surface-6: oklch(37.862653% 0.001737 251.779887 / 1);
846
930
  --color-surface-6-ink: oklch(96.597068% 0.000347 251.779887 / 1);
847
931
  --color-surface-6-ink-muted: oklch(81.732335% 0.000347 251.779887 / 1);
932
+ --color-surface-6-ink-subtle: oklch(89.442837% 0.000347 251.779887 / 1);
848
933
  --color-surface-7: oklch(41.462653% 0.002316 251.779887 / 1);
849
- --color-surface-7-ink: oklch(98.092835% 0.000463 251.779887 / 1);
934
+ --color-surface-7-ink: oklch(98.092836% 0.000463 251.779887 / 1);
850
935
  --color-surface-7-ink-muted: oklch(83.46613% 0.000463 251.779887 / 1);
936
+ --color-surface-7-ink-subtle: oklch(91.043742% 0.000463 251.779887 / 1);
851
937
  --color-surface-8: oklch(45.262653% 0.002896 251.779887 / 1);
852
938
  --color-surface-8-ink: oklch(99.80618% 0.000579 251.779887 / 1);
853
939
  --color-surface-8-ink-muted: oklch(85.441382% 0.000579 251.779887 / 1);
940
+ --color-surface-8-ink-subtle: oklch(93.08733% 0.000579 251.779887 / 1);
854
941
  --color-intent-accent-focus-width: 1px;
855
942
  --color-intent-danger-focus-width: 1px;
856
943
  --color-intent-information-focus-width: 1px;
@@ -903,54 +990,63 @@
903
990
  :root {
904
991
  --ui-local-surface-0: var(--color-surface-workspace-0);
905
992
  --ui-local-surface-0-ink: var(--color-surface-workspace-0-ink);
993
+ --ui-local-surface-0-ink-subtle: var(--color-surface-workspace-0-ink-subtle);
906
994
  --ui-local-surface-0-ink-muted: var(--color-surface-workspace-0-ink-muted);
907
995
  --ui-local-surface-0-edge: var(--color-surface-workspace-0-edge);
908
996
  --ui-local-surface-0-edge-hover: var(--color-surface-workspace-0-edge-hover);
909
997
  --ui-local-surface-0-edge-strong: var(--color-surface-workspace-0-edge-strong);
910
998
  --ui-local-surface-1: var(--color-surface-workspace-1);
911
999
  --ui-local-surface-1-ink: var(--color-surface-workspace-1-ink);
1000
+ --ui-local-surface-1-ink-subtle: var(--color-surface-workspace-1-ink-subtle);
912
1001
  --ui-local-surface-1-ink-muted: var(--color-surface-workspace-1-ink-muted);
913
1002
  --ui-local-surface-1-edge: var(--color-surface-workspace-1-edge);
914
1003
  --ui-local-surface-1-edge-hover: var(--color-surface-workspace-1-edge-hover);
915
1004
  --ui-local-surface-1-edge-strong: var(--color-surface-workspace-1-edge-strong);
916
1005
  --ui-local-surface-2: var(--color-surface-workspace-2);
917
1006
  --ui-local-surface-2-ink: var(--color-surface-workspace-2-ink);
1007
+ --ui-local-surface-2-ink-subtle: var(--color-surface-workspace-2-ink-subtle);
918
1008
  --ui-local-surface-2-ink-muted: var(--color-surface-workspace-2-ink-muted);
919
1009
  --ui-local-surface-2-edge: var(--color-surface-workspace-2-edge);
920
1010
  --ui-local-surface-2-edge-hover: var(--color-surface-workspace-2-edge-hover);
921
1011
  --ui-local-surface-2-edge-strong: var(--color-surface-workspace-2-edge-strong);
922
1012
  --ui-local-surface-3: var(--color-surface-workspace-3);
923
1013
  --ui-local-surface-3-ink: var(--color-surface-workspace-3-ink);
1014
+ --ui-local-surface-3-ink-subtle: var(--color-surface-workspace-3-ink-subtle);
924
1015
  --ui-local-surface-3-ink-muted: var(--color-surface-workspace-3-ink-muted);
925
1016
  --ui-local-surface-3-edge: var(--color-surface-workspace-3-edge);
926
1017
  --ui-local-surface-3-edge-hover: var(--color-surface-workspace-3-edge-hover);
927
1018
  --ui-local-surface-3-edge-strong: var(--color-surface-workspace-3-edge-strong);
928
1019
  --ui-local-surface-4: var(--color-surface-workspace-4);
929
1020
  --ui-local-surface-4-ink: var(--color-surface-workspace-4-ink);
1021
+ --ui-local-surface-4-ink-subtle: var(--color-surface-workspace-4-ink-subtle);
930
1022
  --ui-local-surface-4-ink-muted: var(--color-surface-workspace-4-ink-muted);
931
1023
  --ui-local-surface-4-edge: var(--color-surface-workspace-4-edge);
932
1024
  --ui-local-surface-4-edge-hover: var(--color-surface-workspace-4-edge-hover);
933
1025
  --ui-local-surface-4-edge-strong: var(--color-surface-workspace-4-edge-strong);
934
1026
  --ui-local-surface-5: var(--color-surface-workspace-5);
935
1027
  --ui-local-surface-5-ink: var(--color-surface-workspace-5-ink);
1028
+ --ui-local-surface-5-ink-subtle: var(--color-surface-workspace-5-ink-subtle);
936
1029
  --ui-local-surface-5-ink-muted: var(--color-surface-workspace-5-ink-muted);
937
1030
  --ui-local-surface-5-edge: var(--color-surface-workspace-5-edge);
938
1031
  --ui-local-surface-5-edge-hover: var(--color-surface-workspace-5-edge-hover);
939
1032
  --ui-local-surface-5-edge-strong: var(--color-surface-workspace-5-edge-strong);
940
1033
  --ui-local-surface-6: var(--color-surface-workspace-6);
941
1034
  --ui-local-surface-6-ink: var(--color-surface-workspace-6-ink);
1035
+ --ui-local-surface-6-ink-subtle: var(--color-surface-workspace-6-ink-subtle);
942
1036
  --ui-local-surface-6-ink-muted: var(--color-surface-workspace-6-ink-muted);
943
1037
  --ui-local-surface-6-edge: var(--color-surface-workspace-6-edge);
944
1038
  --ui-local-surface-6-edge-hover: var(--color-surface-workspace-6-edge-hover);
945
1039
  --ui-local-surface-6-edge-strong: var(--color-surface-workspace-6-edge-strong);
946
1040
  --ui-local-surface-7: var(--color-surface-workspace-7);
947
1041
  --ui-local-surface-7-ink: var(--color-surface-workspace-7-ink);
1042
+ --ui-local-surface-7-ink-subtle: var(--color-surface-workspace-7-ink-subtle);
948
1043
  --ui-local-surface-7-ink-muted: var(--color-surface-workspace-7-ink-muted);
949
1044
  --ui-local-surface-7-edge: var(--color-surface-workspace-7-edge);
950
1045
  --ui-local-surface-7-edge-hover: var(--color-surface-workspace-7-edge-hover);
951
1046
  --ui-local-surface-7-edge-strong: var(--color-surface-workspace-7-edge-strong);
952
1047
  --ui-local-surface-8: var(--color-surface-workspace-8);
953
1048
  --ui-local-surface-8-ink: var(--color-surface-workspace-8-ink);
1049
+ --ui-local-surface-8-ink-subtle: var(--color-surface-workspace-8-ink-subtle);
954
1050
  --ui-local-surface-8-ink-muted: var(--color-surface-workspace-8-ink-muted);
955
1051
  --ui-local-surface-8-edge: var(--color-surface-workspace-8-edge);
956
1052
  --ui-local-surface-8-edge-hover: var(--color-surface-workspace-8-edge-hover);
@@ -967,11 +1063,20 @@
967
1063
  --ui-surface-level: 0;
968
1064
  --ui-surface-color: var(--color-surface-0);
969
1065
  --ui-surface-ink: var(--color-surface-0-ink);
1066
+ --ui-surface-ink-subtle: var(--color-surface-0-ink-subtle);
970
1067
  --ui-surface-ink-muted: var(--color-surface-0-ink-muted);
971
1068
  --ui-surface-edge: var(--ui-local-surface-0-edge);
972
1069
  --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
973
1070
  --ui-surface-edge-strong: var(--ui-local-surface-0-edge-strong);
974
1071
  --ui-matched-elevation: var(--ui-local-elevation-0);
1072
+ --ui-relative-elevation-1: var(--ui-local-elevation-1);
1073
+ --ui-relative-elevation-2: var(--ui-local-elevation-2);
1074
+ --ui-relative-elevation-3: var(--ui-local-elevation-3);
1075
+ --ui-relative-elevation-4: var(--ui-local-elevation-4);
1076
+ --ui-relative-elevation-5: var(--ui-local-elevation-5);
1077
+ --ui-relative-elevation-6: var(--ui-local-elevation-6);
1078
+ --ui-relative-elevation-7: var(--ui-local-elevation-7);
1079
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
975
1080
  background-color: var(--ui-surface-color);
976
1081
  color: var(--ui-surface-ink);
977
1082
  --ui-elevation-shadow-layers: var(--shadow-elevation-0);
@@ -981,54 +1086,63 @@
981
1086
  :where(.light, .dark) {
982
1087
  --ui-local-surface-0: var(--color-surface-workspace-0);
983
1088
  --ui-local-surface-0-ink: var(--color-surface-workspace-0-ink);
1089
+ --ui-local-surface-0-ink-subtle: var(--color-surface-workspace-0-ink-subtle);
984
1090
  --ui-local-surface-0-ink-muted: var(--color-surface-workspace-0-ink-muted);
985
1091
  --ui-local-surface-0-edge: var(--color-surface-workspace-0-edge);
986
1092
  --ui-local-surface-0-edge-hover: var(--color-surface-workspace-0-edge-hover);
987
1093
  --ui-local-surface-0-edge-strong: var(--color-surface-workspace-0-edge-strong);
988
1094
  --ui-local-surface-1: var(--color-surface-workspace-1);
989
1095
  --ui-local-surface-1-ink: var(--color-surface-workspace-1-ink);
1096
+ --ui-local-surface-1-ink-subtle: var(--color-surface-workspace-1-ink-subtle);
990
1097
  --ui-local-surface-1-ink-muted: var(--color-surface-workspace-1-ink-muted);
991
1098
  --ui-local-surface-1-edge: var(--color-surface-workspace-1-edge);
992
1099
  --ui-local-surface-1-edge-hover: var(--color-surface-workspace-1-edge-hover);
993
1100
  --ui-local-surface-1-edge-strong: var(--color-surface-workspace-1-edge-strong);
994
1101
  --ui-local-surface-2: var(--color-surface-workspace-2);
995
1102
  --ui-local-surface-2-ink: var(--color-surface-workspace-2-ink);
1103
+ --ui-local-surface-2-ink-subtle: var(--color-surface-workspace-2-ink-subtle);
996
1104
  --ui-local-surface-2-ink-muted: var(--color-surface-workspace-2-ink-muted);
997
1105
  --ui-local-surface-2-edge: var(--color-surface-workspace-2-edge);
998
1106
  --ui-local-surface-2-edge-hover: var(--color-surface-workspace-2-edge-hover);
999
1107
  --ui-local-surface-2-edge-strong: var(--color-surface-workspace-2-edge-strong);
1000
1108
  --ui-local-surface-3: var(--color-surface-workspace-3);
1001
1109
  --ui-local-surface-3-ink: var(--color-surface-workspace-3-ink);
1110
+ --ui-local-surface-3-ink-subtle: var(--color-surface-workspace-3-ink-subtle);
1002
1111
  --ui-local-surface-3-ink-muted: var(--color-surface-workspace-3-ink-muted);
1003
1112
  --ui-local-surface-3-edge: var(--color-surface-workspace-3-edge);
1004
1113
  --ui-local-surface-3-edge-hover: var(--color-surface-workspace-3-edge-hover);
1005
1114
  --ui-local-surface-3-edge-strong: var(--color-surface-workspace-3-edge-strong);
1006
1115
  --ui-local-surface-4: var(--color-surface-workspace-4);
1007
1116
  --ui-local-surface-4-ink: var(--color-surface-workspace-4-ink);
1117
+ --ui-local-surface-4-ink-subtle: var(--color-surface-workspace-4-ink-subtle);
1008
1118
  --ui-local-surface-4-ink-muted: var(--color-surface-workspace-4-ink-muted);
1009
1119
  --ui-local-surface-4-edge: var(--color-surface-workspace-4-edge);
1010
1120
  --ui-local-surface-4-edge-hover: var(--color-surface-workspace-4-edge-hover);
1011
1121
  --ui-local-surface-4-edge-strong: var(--color-surface-workspace-4-edge-strong);
1012
1122
  --ui-local-surface-5: var(--color-surface-workspace-5);
1013
1123
  --ui-local-surface-5-ink: var(--color-surface-workspace-5-ink);
1124
+ --ui-local-surface-5-ink-subtle: var(--color-surface-workspace-5-ink-subtle);
1014
1125
  --ui-local-surface-5-ink-muted: var(--color-surface-workspace-5-ink-muted);
1015
1126
  --ui-local-surface-5-edge: var(--color-surface-workspace-5-edge);
1016
1127
  --ui-local-surface-5-edge-hover: var(--color-surface-workspace-5-edge-hover);
1017
1128
  --ui-local-surface-5-edge-strong: var(--color-surface-workspace-5-edge-strong);
1018
1129
  --ui-local-surface-6: var(--color-surface-workspace-6);
1019
1130
  --ui-local-surface-6-ink: var(--color-surface-workspace-6-ink);
1131
+ --ui-local-surface-6-ink-subtle: var(--color-surface-workspace-6-ink-subtle);
1020
1132
  --ui-local-surface-6-ink-muted: var(--color-surface-workspace-6-ink-muted);
1021
1133
  --ui-local-surface-6-edge: var(--color-surface-workspace-6-edge);
1022
1134
  --ui-local-surface-6-edge-hover: var(--color-surface-workspace-6-edge-hover);
1023
1135
  --ui-local-surface-6-edge-strong: var(--color-surface-workspace-6-edge-strong);
1024
1136
  --ui-local-surface-7: var(--color-surface-workspace-7);
1025
1137
  --ui-local-surface-7-ink: var(--color-surface-workspace-7-ink);
1138
+ --ui-local-surface-7-ink-subtle: var(--color-surface-workspace-7-ink-subtle);
1026
1139
  --ui-local-surface-7-ink-muted: var(--color-surface-workspace-7-ink-muted);
1027
1140
  --ui-local-surface-7-edge: var(--color-surface-workspace-7-edge);
1028
1141
  --ui-local-surface-7-edge-hover: var(--color-surface-workspace-7-edge-hover);
1029
1142
  --ui-local-surface-7-edge-strong: var(--color-surface-workspace-7-edge-strong);
1030
1143
  --ui-local-surface-8: var(--color-surface-workspace-8);
1031
1144
  --ui-local-surface-8-ink: var(--color-surface-workspace-8-ink);
1145
+ --ui-local-surface-8-ink-subtle: var(--color-surface-workspace-8-ink-subtle);
1032
1146
  --ui-local-surface-8-ink-muted: var(--color-surface-workspace-8-ink-muted);
1033
1147
  --ui-local-surface-8-edge: var(--color-surface-workspace-8-edge);
1034
1148
  --ui-local-surface-8-edge-hover: var(--color-surface-workspace-8-edge-hover);
@@ -1047,54 +1161,63 @@
1047
1161
  :where([data-ui-substrate="workspace"]) {
1048
1162
  --ui-local-surface-0: var(--color-surface-workspace-0);
1049
1163
  --ui-local-surface-0-ink: var(--color-surface-workspace-0-ink);
1164
+ --ui-local-surface-0-ink-subtle: var(--color-surface-workspace-0-ink-subtle);
1050
1165
  --ui-local-surface-0-ink-muted: var(--color-surface-workspace-0-ink-muted);
1051
1166
  --ui-local-surface-0-edge: var(--color-surface-workspace-0-edge);
1052
1167
  --ui-local-surface-0-edge-hover: var(--color-surface-workspace-0-edge-hover);
1053
1168
  --ui-local-surface-0-edge-strong: var(--color-surface-workspace-0-edge-strong);
1054
1169
  --ui-local-surface-1: var(--color-surface-workspace-1);
1055
1170
  --ui-local-surface-1-ink: var(--color-surface-workspace-1-ink);
1171
+ --ui-local-surface-1-ink-subtle: var(--color-surface-workspace-1-ink-subtle);
1056
1172
  --ui-local-surface-1-ink-muted: var(--color-surface-workspace-1-ink-muted);
1057
1173
  --ui-local-surface-1-edge: var(--color-surface-workspace-1-edge);
1058
1174
  --ui-local-surface-1-edge-hover: var(--color-surface-workspace-1-edge-hover);
1059
1175
  --ui-local-surface-1-edge-strong: var(--color-surface-workspace-1-edge-strong);
1060
1176
  --ui-local-surface-2: var(--color-surface-workspace-2);
1061
1177
  --ui-local-surface-2-ink: var(--color-surface-workspace-2-ink);
1178
+ --ui-local-surface-2-ink-subtle: var(--color-surface-workspace-2-ink-subtle);
1062
1179
  --ui-local-surface-2-ink-muted: var(--color-surface-workspace-2-ink-muted);
1063
1180
  --ui-local-surface-2-edge: var(--color-surface-workspace-2-edge);
1064
1181
  --ui-local-surface-2-edge-hover: var(--color-surface-workspace-2-edge-hover);
1065
1182
  --ui-local-surface-2-edge-strong: var(--color-surface-workspace-2-edge-strong);
1066
1183
  --ui-local-surface-3: var(--color-surface-workspace-3);
1067
1184
  --ui-local-surface-3-ink: var(--color-surface-workspace-3-ink);
1185
+ --ui-local-surface-3-ink-subtle: var(--color-surface-workspace-3-ink-subtle);
1068
1186
  --ui-local-surface-3-ink-muted: var(--color-surface-workspace-3-ink-muted);
1069
1187
  --ui-local-surface-3-edge: var(--color-surface-workspace-3-edge);
1070
1188
  --ui-local-surface-3-edge-hover: var(--color-surface-workspace-3-edge-hover);
1071
1189
  --ui-local-surface-3-edge-strong: var(--color-surface-workspace-3-edge-strong);
1072
1190
  --ui-local-surface-4: var(--color-surface-workspace-4);
1073
1191
  --ui-local-surface-4-ink: var(--color-surface-workspace-4-ink);
1192
+ --ui-local-surface-4-ink-subtle: var(--color-surface-workspace-4-ink-subtle);
1074
1193
  --ui-local-surface-4-ink-muted: var(--color-surface-workspace-4-ink-muted);
1075
1194
  --ui-local-surface-4-edge: var(--color-surface-workspace-4-edge);
1076
1195
  --ui-local-surface-4-edge-hover: var(--color-surface-workspace-4-edge-hover);
1077
1196
  --ui-local-surface-4-edge-strong: var(--color-surface-workspace-4-edge-strong);
1078
1197
  --ui-local-surface-5: var(--color-surface-workspace-5);
1079
1198
  --ui-local-surface-5-ink: var(--color-surface-workspace-5-ink);
1199
+ --ui-local-surface-5-ink-subtle: var(--color-surface-workspace-5-ink-subtle);
1080
1200
  --ui-local-surface-5-ink-muted: var(--color-surface-workspace-5-ink-muted);
1081
1201
  --ui-local-surface-5-edge: var(--color-surface-workspace-5-edge);
1082
1202
  --ui-local-surface-5-edge-hover: var(--color-surface-workspace-5-edge-hover);
1083
1203
  --ui-local-surface-5-edge-strong: var(--color-surface-workspace-5-edge-strong);
1084
1204
  --ui-local-surface-6: var(--color-surface-workspace-6);
1085
1205
  --ui-local-surface-6-ink: var(--color-surface-workspace-6-ink);
1206
+ --ui-local-surface-6-ink-subtle: var(--color-surface-workspace-6-ink-subtle);
1086
1207
  --ui-local-surface-6-ink-muted: var(--color-surface-workspace-6-ink-muted);
1087
1208
  --ui-local-surface-6-edge: var(--color-surface-workspace-6-edge);
1088
1209
  --ui-local-surface-6-edge-hover: var(--color-surface-workspace-6-edge-hover);
1089
1210
  --ui-local-surface-6-edge-strong: var(--color-surface-workspace-6-edge-strong);
1090
1211
  --ui-local-surface-7: var(--color-surface-workspace-7);
1091
1212
  --ui-local-surface-7-ink: var(--color-surface-workspace-7-ink);
1213
+ --ui-local-surface-7-ink-subtle: var(--color-surface-workspace-7-ink-subtle);
1092
1214
  --ui-local-surface-7-ink-muted: var(--color-surface-workspace-7-ink-muted);
1093
1215
  --ui-local-surface-7-edge: var(--color-surface-workspace-7-edge);
1094
1216
  --ui-local-surface-7-edge-hover: var(--color-surface-workspace-7-edge-hover);
1095
1217
  --ui-local-surface-7-edge-strong: var(--color-surface-workspace-7-edge-strong);
1096
1218
  --ui-local-surface-8: var(--color-surface-workspace-8);
1097
1219
  --ui-local-surface-8-ink: var(--color-surface-workspace-8-ink);
1220
+ --ui-local-surface-8-ink-subtle: var(--color-surface-workspace-8-ink-subtle);
1098
1221
  --ui-local-surface-8-ink-muted: var(--color-surface-workspace-8-ink-muted);
1099
1222
  --ui-local-surface-8-edge: var(--color-surface-workspace-8-edge);
1100
1223
  --ui-local-surface-8-edge-hover: var(--color-surface-workspace-8-edge-hover);
@@ -1111,6 +1234,7 @@
1111
1234
  --ui-surface-level: 0;
1112
1235
  --ui-surface-color: var(--ui-local-surface-0);
1113
1236
  --ui-surface-ink: var(--ui-local-surface-0-ink);
1237
+ --ui-surface-ink-subtle: var(--ui-local-surface-0-ink-subtle);
1114
1238
  --ui-surface-ink-muted: var(--ui-local-surface-0-ink-muted);
1115
1239
  --ui-surface-edge: var(--ui-local-surface-0-edge);
1116
1240
  --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
@@ -1118,6 +1242,14 @@
1118
1242
  --ui-surface-separator: var(--ui-surface-edge);
1119
1243
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1120
1244
  --ui-matched-elevation: var(--ui-local-elevation-0);
1245
+ --ui-relative-elevation-1: var(--ui-local-elevation-1);
1246
+ --ui-relative-elevation-2: var(--ui-local-elevation-2);
1247
+ --ui-relative-elevation-3: var(--ui-local-elevation-3);
1248
+ --ui-relative-elevation-4: var(--ui-local-elevation-4);
1249
+ --ui-relative-elevation-5: var(--ui-local-elevation-5);
1250
+ --ui-relative-elevation-6: var(--ui-local-elevation-6);
1251
+ --ui-relative-elevation-7: var(--ui-local-elevation-7);
1252
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1121
1253
  background-color: var(--ui-surface-color);
1122
1254
  color: var(--ui-surface-ink);
1123
1255
  }
@@ -1125,54 +1257,63 @@
1125
1257
  :where([data-ui-substrate="chrome"]) {
1126
1258
  --ui-local-surface-0: var(--color-surface-chrome-0);
1127
1259
  --ui-local-surface-0-ink: var(--color-surface-chrome-0-ink);
1260
+ --ui-local-surface-0-ink-subtle: var(--color-surface-chrome-0-ink-subtle);
1128
1261
  --ui-local-surface-0-ink-muted: var(--color-surface-chrome-0-ink-muted);
1129
1262
  --ui-local-surface-0-edge: var(--color-surface-chrome-0-edge);
1130
1263
  --ui-local-surface-0-edge-hover: var(--color-surface-chrome-0-edge-hover);
1131
1264
  --ui-local-surface-0-edge-strong: var(--color-surface-chrome-0-edge-strong);
1132
1265
  --ui-local-surface-1: var(--color-surface-chrome-1);
1133
1266
  --ui-local-surface-1-ink: var(--color-surface-chrome-1-ink);
1267
+ --ui-local-surface-1-ink-subtle: var(--color-surface-chrome-1-ink-subtle);
1134
1268
  --ui-local-surface-1-ink-muted: var(--color-surface-chrome-1-ink-muted);
1135
1269
  --ui-local-surface-1-edge: var(--color-surface-chrome-1-edge);
1136
1270
  --ui-local-surface-1-edge-hover: var(--color-surface-chrome-1-edge-hover);
1137
1271
  --ui-local-surface-1-edge-strong: var(--color-surface-chrome-1-edge-strong);
1138
1272
  --ui-local-surface-2: var(--color-surface-chrome-2);
1139
1273
  --ui-local-surface-2-ink: var(--color-surface-chrome-2-ink);
1274
+ --ui-local-surface-2-ink-subtle: var(--color-surface-chrome-2-ink-subtle);
1140
1275
  --ui-local-surface-2-ink-muted: var(--color-surface-chrome-2-ink-muted);
1141
1276
  --ui-local-surface-2-edge: var(--color-surface-chrome-2-edge);
1142
1277
  --ui-local-surface-2-edge-hover: var(--color-surface-chrome-2-edge-hover);
1143
1278
  --ui-local-surface-2-edge-strong: var(--color-surface-chrome-2-edge-strong);
1144
1279
  --ui-local-surface-3: var(--color-surface-chrome-3);
1145
1280
  --ui-local-surface-3-ink: var(--color-surface-chrome-3-ink);
1281
+ --ui-local-surface-3-ink-subtle: var(--color-surface-chrome-3-ink-subtle);
1146
1282
  --ui-local-surface-3-ink-muted: var(--color-surface-chrome-3-ink-muted);
1147
1283
  --ui-local-surface-3-edge: var(--color-surface-chrome-3-edge);
1148
1284
  --ui-local-surface-3-edge-hover: var(--color-surface-chrome-3-edge-hover);
1149
1285
  --ui-local-surface-3-edge-strong: var(--color-surface-chrome-3-edge-strong);
1150
1286
  --ui-local-surface-4: var(--color-surface-chrome-4);
1151
1287
  --ui-local-surface-4-ink: var(--color-surface-chrome-4-ink);
1288
+ --ui-local-surface-4-ink-subtle: var(--color-surface-chrome-4-ink-subtle);
1152
1289
  --ui-local-surface-4-ink-muted: var(--color-surface-chrome-4-ink-muted);
1153
1290
  --ui-local-surface-4-edge: var(--color-surface-chrome-4-edge);
1154
1291
  --ui-local-surface-4-edge-hover: var(--color-surface-chrome-4-edge-hover);
1155
1292
  --ui-local-surface-4-edge-strong: var(--color-surface-chrome-4-edge-strong);
1156
1293
  --ui-local-surface-5: var(--color-surface-chrome-5);
1157
1294
  --ui-local-surface-5-ink: var(--color-surface-chrome-5-ink);
1295
+ --ui-local-surface-5-ink-subtle: var(--color-surface-chrome-5-ink-subtle);
1158
1296
  --ui-local-surface-5-ink-muted: var(--color-surface-chrome-5-ink-muted);
1159
1297
  --ui-local-surface-5-edge: var(--color-surface-chrome-5-edge);
1160
1298
  --ui-local-surface-5-edge-hover: var(--color-surface-chrome-5-edge-hover);
1161
1299
  --ui-local-surface-5-edge-strong: var(--color-surface-chrome-5-edge-strong);
1162
1300
  --ui-local-surface-6: var(--color-surface-chrome-6);
1163
1301
  --ui-local-surface-6-ink: var(--color-surface-chrome-6-ink);
1302
+ --ui-local-surface-6-ink-subtle: var(--color-surface-chrome-6-ink-subtle);
1164
1303
  --ui-local-surface-6-ink-muted: var(--color-surface-chrome-6-ink-muted);
1165
1304
  --ui-local-surface-6-edge: var(--color-surface-chrome-6-edge);
1166
1305
  --ui-local-surface-6-edge-hover: var(--color-surface-chrome-6-edge-hover);
1167
1306
  --ui-local-surface-6-edge-strong: var(--color-surface-chrome-6-edge-strong);
1168
1307
  --ui-local-surface-7: var(--color-surface-chrome-7);
1169
1308
  --ui-local-surface-7-ink: var(--color-surface-chrome-7-ink);
1309
+ --ui-local-surface-7-ink-subtle: var(--color-surface-chrome-7-ink-subtle);
1170
1310
  --ui-local-surface-7-ink-muted: var(--color-surface-chrome-7-ink-muted);
1171
1311
  --ui-local-surface-7-edge: var(--color-surface-chrome-7-edge);
1172
1312
  --ui-local-surface-7-edge-hover: var(--color-surface-chrome-7-edge-hover);
1173
1313
  --ui-local-surface-7-edge-strong: var(--color-surface-chrome-7-edge-strong);
1174
1314
  --ui-local-surface-8: var(--color-surface-chrome-8);
1175
1315
  --ui-local-surface-8-ink: var(--color-surface-chrome-8-ink);
1316
+ --ui-local-surface-8-ink-subtle: var(--color-surface-chrome-8-ink-subtle);
1176
1317
  --ui-local-surface-8-ink-muted: var(--color-surface-chrome-8-ink-muted);
1177
1318
  --ui-local-surface-8-edge: var(--color-surface-chrome-8-edge);
1178
1319
  --ui-local-surface-8-edge-hover: var(--color-surface-chrome-8-edge-hover);
@@ -1189,6 +1330,7 @@
1189
1330
  --ui-surface-level: 0;
1190
1331
  --ui-surface-color: var(--ui-local-surface-0);
1191
1332
  --ui-surface-ink: var(--ui-local-surface-0-ink);
1333
+ --ui-surface-ink-subtle: var(--ui-local-surface-0-ink-subtle);
1192
1334
  --ui-surface-ink-muted: var(--ui-local-surface-0-ink-muted);
1193
1335
  --ui-surface-edge: var(--ui-local-surface-0-edge);
1194
1336
  --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
@@ -1196,6 +1338,14 @@
1196
1338
  --ui-surface-separator: var(--ui-surface-edge);
1197
1339
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1198
1340
  --ui-matched-elevation: var(--ui-local-elevation-0);
1341
+ --ui-relative-elevation-1: var(--ui-local-elevation-1);
1342
+ --ui-relative-elevation-2: var(--ui-local-elevation-2);
1343
+ --ui-relative-elevation-3: var(--ui-local-elevation-3);
1344
+ --ui-relative-elevation-4: var(--ui-local-elevation-4);
1345
+ --ui-relative-elevation-5: var(--ui-local-elevation-5);
1346
+ --ui-relative-elevation-6: var(--ui-local-elevation-6);
1347
+ --ui-relative-elevation-7: var(--ui-local-elevation-7);
1348
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1199
1349
  background-color: var(--ui-surface-color);
1200
1350
  color: var(--ui-surface-ink);
1201
1351
  }
@@ -1204,6 +1354,7 @@
1204
1354
  --ui-surface-level: 0;
1205
1355
  --ui-surface-color: var(--ui-local-surface-0);
1206
1356
  --ui-surface-ink: var(--ui-local-surface-0-ink);
1357
+ --ui-surface-ink-subtle: var(--ui-local-surface-0-ink-subtle);
1207
1358
  --ui-surface-ink-muted: var(--ui-local-surface-0-ink-muted);
1208
1359
  --ui-surface-edge: var(--ui-local-surface-0-edge);
1209
1360
  --ui-surface-edge-hover: var(--ui-local-surface-0-edge-hover);
@@ -1211,6 +1362,14 @@
1211
1362
  --ui-surface-separator: var(--ui-surface-edge);
1212
1363
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1213
1364
  --ui-matched-elevation: var(--ui-local-elevation-0);
1365
+ --ui-relative-elevation-1: var(--ui-local-elevation-1);
1366
+ --ui-relative-elevation-2: var(--ui-local-elevation-2);
1367
+ --ui-relative-elevation-3: var(--ui-local-elevation-3);
1368
+ --ui-relative-elevation-4: var(--ui-local-elevation-4);
1369
+ --ui-relative-elevation-5: var(--ui-local-elevation-5);
1370
+ --ui-relative-elevation-6: var(--ui-local-elevation-6);
1371
+ --ui-relative-elevation-7: var(--ui-local-elevation-7);
1372
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1214
1373
  }
1215
1374
 
1216
1375
  :where([data-ui-surface="0"]:not([data-ui-semantic-surface])) {
@@ -1222,6 +1381,7 @@
1222
1381
  --ui-surface-level: 1;
1223
1382
  --ui-surface-color: var(--ui-local-surface-1);
1224
1383
  --ui-surface-ink: var(--ui-local-surface-1-ink);
1384
+ --ui-surface-ink-subtle: var(--ui-local-surface-1-ink-subtle);
1225
1385
  --ui-surface-ink-muted: var(--ui-local-surface-1-ink-muted);
1226
1386
  --ui-surface-edge: var(--ui-local-surface-1-edge);
1227
1387
  --ui-surface-edge-hover: var(--ui-local-surface-1-edge-hover);
@@ -1229,6 +1389,14 @@
1229
1389
  --ui-surface-separator: var(--ui-surface-edge);
1230
1390
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1231
1391
  --ui-matched-elevation: var(--ui-local-elevation-1);
1392
+ --ui-relative-elevation-1: var(--ui-local-elevation-2);
1393
+ --ui-relative-elevation-2: var(--ui-local-elevation-3);
1394
+ --ui-relative-elevation-3: var(--ui-local-elevation-4);
1395
+ --ui-relative-elevation-4: var(--ui-local-elevation-5);
1396
+ --ui-relative-elevation-5: var(--ui-local-elevation-6);
1397
+ --ui-relative-elevation-6: var(--ui-local-elevation-7);
1398
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1399
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1232
1400
  }
1233
1401
 
1234
1402
  :where([data-ui-surface="1"]:not([data-ui-semantic-surface])) {
@@ -1240,6 +1408,7 @@
1240
1408
  --ui-surface-level: 2;
1241
1409
  --ui-surface-color: var(--ui-local-surface-2);
1242
1410
  --ui-surface-ink: var(--ui-local-surface-2-ink);
1411
+ --ui-surface-ink-subtle: var(--ui-local-surface-2-ink-subtle);
1243
1412
  --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
1244
1413
  --ui-surface-edge: var(--ui-local-surface-2-edge);
1245
1414
  --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
@@ -1247,6 +1416,14 @@
1247
1416
  --ui-surface-separator: var(--ui-surface-edge);
1248
1417
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1249
1418
  --ui-matched-elevation: var(--ui-local-elevation-2);
1419
+ --ui-relative-elevation-1: var(--ui-local-elevation-3);
1420
+ --ui-relative-elevation-2: var(--ui-local-elevation-4);
1421
+ --ui-relative-elevation-3: var(--ui-local-elevation-5);
1422
+ --ui-relative-elevation-4: var(--ui-local-elevation-6);
1423
+ --ui-relative-elevation-5: var(--ui-local-elevation-7);
1424
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1425
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1426
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1250
1427
  }
1251
1428
 
1252
1429
  :where([data-ui-surface="2"]:not([data-ui-semantic-surface])) {
@@ -1258,6 +1435,7 @@
1258
1435
  --ui-surface-level: 3;
1259
1436
  --ui-surface-color: var(--ui-local-surface-3);
1260
1437
  --ui-surface-ink: var(--ui-local-surface-3-ink);
1438
+ --ui-surface-ink-subtle: var(--ui-local-surface-3-ink-subtle);
1261
1439
  --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
1262
1440
  --ui-surface-edge: var(--ui-local-surface-3-edge);
1263
1441
  --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
@@ -1265,6 +1443,14 @@
1265
1443
  --ui-surface-separator: var(--ui-surface-edge);
1266
1444
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1267
1445
  --ui-matched-elevation: var(--ui-local-elevation-3);
1446
+ --ui-relative-elevation-1: var(--ui-local-elevation-4);
1447
+ --ui-relative-elevation-2: var(--ui-local-elevation-5);
1448
+ --ui-relative-elevation-3: var(--ui-local-elevation-6);
1449
+ --ui-relative-elevation-4: var(--ui-local-elevation-7);
1450
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1451
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1452
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1453
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1268
1454
  }
1269
1455
 
1270
1456
  :where([data-ui-surface="3"]:not([data-ui-semantic-surface])) {
@@ -1276,6 +1462,7 @@
1276
1462
  --ui-surface-level: 4;
1277
1463
  --ui-surface-color: var(--ui-local-surface-4);
1278
1464
  --ui-surface-ink: var(--ui-local-surface-4-ink);
1465
+ --ui-surface-ink-subtle: var(--ui-local-surface-4-ink-subtle);
1279
1466
  --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
1280
1467
  --ui-surface-edge: var(--ui-local-surface-4-edge);
1281
1468
  --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
@@ -1283,6 +1470,14 @@
1283
1470
  --ui-surface-separator: var(--ui-surface-edge);
1284
1471
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1285
1472
  --ui-matched-elevation: var(--ui-local-elevation-4);
1473
+ --ui-relative-elevation-1: var(--ui-local-elevation-5);
1474
+ --ui-relative-elevation-2: var(--ui-local-elevation-6);
1475
+ --ui-relative-elevation-3: var(--ui-local-elevation-7);
1476
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1477
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1478
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1479
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1480
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1286
1481
  }
1287
1482
 
1288
1483
  :where([data-ui-surface="4"]:not([data-ui-semantic-surface])) {
@@ -1294,6 +1489,7 @@
1294
1489
  --ui-surface-level: 5;
1295
1490
  --ui-surface-color: var(--ui-local-surface-5);
1296
1491
  --ui-surface-ink: var(--ui-local-surface-5-ink);
1492
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
1297
1493
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
1298
1494
  --ui-surface-edge: var(--ui-local-surface-5-edge);
1299
1495
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -1301,6 +1497,14 @@
1301
1497
  --ui-surface-separator: var(--ui-surface-edge);
1302
1498
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1303
1499
  --ui-matched-elevation: var(--ui-local-elevation-5);
1500
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
1501
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
1502
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1503
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1504
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1505
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1506
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1507
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1304
1508
  }
1305
1509
 
1306
1510
  :where([data-ui-surface="5"]:not([data-ui-semantic-surface])) {
@@ -1312,6 +1516,7 @@
1312
1516
  --ui-surface-level: 6;
1313
1517
  --ui-surface-color: var(--ui-local-surface-6);
1314
1518
  --ui-surface-ink: var(--ui-local-surface-6-ink);
1519
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
1315
1520
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
1316
1521
  --ui-surface-edge: var(--ui-local-surface-6-edge);
1317
1522
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -1319,6 +1524,14 @@
1319
1524
  --ui-surface-separator: var(--ui-surface-edge);
1320
1525
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1321
1526
  --ui-matched-elevation: var(--ui-local-elevation-6);
1527
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
1528
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
1529
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1530
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1531
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1532
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1533
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1534
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1322
1535
  }
1323
1536
 
1324
1537
  :where([data-ui-surface="6"]:not([data-ui-semantic-surface])) {
@@ -1330,6 +1543,7 @@
1330
1543
  --ui-surface-level: 7;
1331
1544
  --ui-surface-color: var(--ui-local-surface-7);
1332
1545
  --ui-surface-ink: var(--ui-local-surface-7-ink);
1546
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
1333
1547
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
1334
1548
  --ui-surface-edge: var(--ui-local-surface-7-edge);
1335
1549
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -1337,6 +1551,14 @@
1337
1551
  --ui-surface-separator: var(--ui-surface-edge);
1338
1552
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1339
1553
  --ui-matched-elevation: var(--ui-local-elevation-7);
1554
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
1555
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
1556
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1557
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1558
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1559
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1560
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1561
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1340
1562
  }
1341
1563
 
1342
1564
  :where([data-ui-surface="7"]:not([data-ui-semantic-surface])) {
@@ -1348,6 +1570,7 @@
1348
1570
  --ui-surface-level: 8;
1349
1571
  --ui-surface-color: var(--ui-local-surface-8);
1350
1572
  --ui-surface-ink: var(--ui-local-surface-8-ink);
1573
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
1351
1574
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
1352
1575
  --ui-surface-edge: var(--ui-local-surface-8-edge);
1353
1576
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -1355,6 +1578,14 @@
1355
1578
  --ui-surface-separator: var(--ui-surface-edge);
1356
1579
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1357
1580
  --ui-matched-elevation: var(--ui-local-elevation-8);
1581
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
1582
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
1583
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1584
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1585
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1586
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1587
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1588
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1358
1589
  }
1359
1590
 
1360
1591
  :where([data-ui-surface="8"]:not([data-ui-semantic-surface])) {
@@ -1366,6 +1597,7 @@
1366
1597
  --ui-surface-level: 1;
1367
1598
  --ui-surface-color: var(--ui-local-surface-1);
1368
1599
  --ui-surface-ink: var(--ui-local-surface-1-ink);
1600
+ --ui-surface-ink-subtle: var(--ui-local-surface-1-ink-subtle);
1369
1601
  --ui-surface-ink-muted: var(--ui-local-surface-1-ink-muted);
1370
1602
  --ui-surface-edge: var(--ui-local-surface-1-edge);
1371
1603
  --ui-surface-edge-hover: var(--ui-local-surface-1-edge-hover);
@@ -1373,6 +1605,14 @@
1373
1605
  --ui-surface-separator: var(--ui-surface-edge);
1374
1606
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1375
1607
  --ui-matched-elevation: var(--ui-local-elevation-1);
1608
+ --ui-relative-elevation-1: var(--ui-local-elevation-2);
1609
+ --ui-relative-elevation-2: var(--ui-local-elevation-3);
1610
+ --ui-relative-elevation-3: var(--ui-local-elevation-4);
1611
+ --ui-relative-elevation-4: var(--ui-local-elevation-5);
1612
+ --ui-relative-elevation-5: var(--ui-local-elevation-6);
1613
+ --ui-relative-elevation-6: var(--ui-local-elevation-7);
1614
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1615
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1376
1616
  }
1377
1617
 
1378
1618
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -1384,6 +1624,7 @@
1384
1624
  --ui-surface-level: 2;
1385
1625
  --ui-surface-color: var(--ui-local-surface-2);
1386
1626
  --ui-surface-ink: var(--ui-local-surface-2-ink);
1627
+ --ui-surface-ink-subtle: var(--ui-local-surface-2-ink-subtle);
1387
1628
  --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
1388
1629
  --ui-surface-edge: var(--ui-local-surface-2-edge);
1389
1630
  --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
@@ -1391,6 +1632,14 @@
1391
1632
  --ui-surface-separator: var(--ui-surface-edge);
1392
1633
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1393
1634
  --ui-matched-elevation: var(--ui-local-elevation-2);
1635
+ --ui-relative-elevation-1: var(--ui-local-elevation-3);
1636
+ --ui-relative-elevation-2: var(--ui-local-elevation-4);
1637
+ --ui-relative-elevation-3: var(--ui-local-elevation-5);
1638
+ --ui-relative-elevation-4: var(--ui-local-elevation-6);
1639
+ --ui-relative-elevation-5: var(--ui-local-elevation-7);
1640
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1641
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1642
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1394
1643
  }
1395
1644
 
1396
1645
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -1402,6 +1651,7 @@
1402
1651
  --ui-surface-level: 3;
1403
1652
  --ui-surface-color: var(--ui-local-surface-3);
1404
1653
  --ui-surface-ink: var(--ui-local-surface-3-ink);
1654
+ --ui-surface-ink-subtle: var(--ui-local-surface-3-ink-subtle);
1405
1655
  --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
1406
1656
  --ui-surface-edge: var(--ui-local-surface-3-edge);
1407
1657
  --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
@@ -1409,6 +1659,14 @@
1409
1659
  --ui-surface-separator: var(--ui-surface-edge);
1410
1660
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1411
1661
  --ui-matched-elevation: var(--ui-local-elevation-3);
1662
+ --ui-relative-elevation-1: var(--ui-local-elevation-4);
1663
+ --ui-relative-elevation-2: var(--ui-local-elevation-5);
1664
+ --ui-relative-elevation-3: var(--ui-local-elevation-6);
1665
+ --ui-relative-elevation-4: var(--ui-local-elevation-7);
1666
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1667
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1668
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1669
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1412
1670
  }
1413
1671
 
1414
1672
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -1420,6 +1678,7 @@
1420
1678
  --ui-surface-level: 4;
1421
1679
  --ui-surface-color: var(--ui-local-surface-4);
1422
1680
  --ui-surface-ink: var(--ui-local-surface-4-ink);
1681
+ --ui-surface-ink-subtle: var(--ui-local-surface-4-ink-subtle);
1423
1682
  --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
1424
1683
  --ui-surface-edge: var(--ui-local-surface-4-edge);
1425
1684
  --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
@@ -1427,6 +1686,14 @@
1427
1686
  --ui-surface-separator: var(--ui-surface-edge);
1428
1687
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1429
1688
  --ui-matched-elevation: var(--ui-local-elevation-4);
1689
+ --ui-relative-elevation-1: var(--ui-local-elevation-5);
1690
+ --ui-relative-elevation-2: var(--ui-local-elevation-6);
1691
+ --ui-relative-elevation-3: var(--ui-local-elevation-7);
1692
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1693
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1694
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1695
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1696
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1430
1697
  }
1431
1698
 
1432
1699
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -1438,6 +1705,7 @@
1438
1705
  --ui-surface-level: 5;
1439
1706
  --ui-surface-color: var(--ui-local-surface-5);
1440
1707
  --ui-surface-ink: var(--ui-local-surface-5-ink);
1708
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
1441
1709
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
1442
1710
  --ui-surface-edge: var(--ui-local-surface-5-edge);
1443
1711
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -1445,6 +1713,14 @@
1445
1713
  --ui-surface-separator: var(--ui-surface-edge);
1446
1714
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1447
1715
  --ui-matched-elevation: var(--ui-local-elevation-5);
1716
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
1717
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
1718
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1719
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1720
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1721
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1722
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1723
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1448
1724
  }
1449
1725
 
1450
1726
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -1456,6 +1732,7 @@
1456
1732
  --ui-surface-level: 6;
1457
1733
  --ui-surface-color: var(--ui-local-surface-6);
1458
1734
  --ui-surface-ink: var(--ui-local-surface-6-ink);
1735
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
1459
1736
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
1460
1737
  --ui-surface-edge: var(--ui-local-surface-6-edge);
1461
1738
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -1463,6 +1740,14 @@
1463
1740
  --ui-surface-separator: var(--ui-surface-edge);
1464
1741
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1465
1742
  --ui-matched-elevation: var(--ui-local-elevation-6);
1743
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
1744
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
1745
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1746
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1747
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1748
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1749
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1750
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1466
1751
  }
1467
1752
 
1468
1753
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -1474,6 +1759,7 @@
1474
1759
  --ui-surface-level: 7;
1475
1760
  --ui-surface-color: var(--ui-local-surface-7);
1476
1761
  --ui-surface-ink: var(--ui-local-surface-7-ink);
1762
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
1477
1763
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
1478
1764
  --ui-surface-edge: var(--ui-local-surface-7-edge);
1479
1765
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -1481,6 +1767,14 @@
1481
1767
  --ui-surface-separator: var(--ui-surface-edge);
1482
1768
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1483
1769
  --ui-matched-elevation: var(--ui-local-elevation-7);
1770
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
1771
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
1772
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1773
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1774
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1775
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1776
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1777
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1484
1778
  }
1485
1779
 
1486
1780
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -1492,6 +1786,7 @@
1492
1786
  --ui-surface-level: 8;
1493
1787
  --ui-surface-color: var(--ui-local-surface-8);
1494
1788
  --ui-surface-ink: var(--ui-local-surface-8-ink);
1789
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
1495
1790
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
1496
1791
  --ui-surface-edge: var(--ui-local-surface-8-edge);
1497
1792
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -1499,6 +1794,14 @@
1499
1794
  --ui-surface-separator: var(--ui-surface-edge);
1500
1795
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1501
1796
  --ui-matched-elevation: var(--ui-local-elevation-8);
1797
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
1798
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
1799
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
1800
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1801
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1802
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1803
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1804
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1502
1805
  }
1503
1806
 
1504
1807
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -1524,39 +1827,72 @@
1524
1827
  --ui-elevation-shadow-layers: var(--shadow-elevation-1);
1525
1828
  }
1526
1829
 
1830
+ :where([data-ui-elevation="+1"]) {
1831
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-1);
1832
+ }
1833
+
1527
1834
  :where([data-ui-elevation="2"]) {
1528
1835
  --ui-elevation-shadow-layers: var(--shadow-elevation-2);
1529
1836
  }
1530
1837
 
1838
+ :where([data-ui-elevation="+2"]) {
1839
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-2);
1840
+ }
1841
+
1531
1842
  :where([data-ui-elevation="3"]) {
1532
1843
  --ui-elevation-shadow-layers: var(--shadow-elevation-3);
1533
1844
  }
1534
1845
 
1846
+ :where([data-ui-elevation="+3"]) {
1847
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-3);
1848
+ }
1849
+
1535
1850
  :where([data-ui-elevation="4"]) {
1536
1851
  --ui-elevation-shadow-layers: var(--shadow-elevation-4);
1537
1852
  }
1538
1853
 
1854
+ :where([data-ui-elevation="+4"]) {
1855
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-4);
1856
+ }
1857
+
1539
1858
  :where([data-ui-elevation="5"]) {
1540
1859
  --ui-elevation-shadow-layers: var(--shadow-elevation-5);
1541
1860
  }
1542
1861
 
1862
+ :where([data-ui-elevation="+5"]) {
1863
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-5);
1864
+ }
1865
+
1543
1866
  :where([data-ui-elevation="6"]) {
1544
1867
  --ui-elevation-shadow-layers: var(--shadow-elevation-6);
1545
1868
  }
1546
1869
 
1870
+ :where([data-ui-elevation="+6"]) {
1871
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-6);
1872
+ }
1873
+
1547
1874
  :where([data-ui-elevation="7"]) {
1548
1875
  --ui-elevation-shadow-layers: var(--shadow-elevation-7);
1549
1876
  }
1550
1877
 
1878
+ :where([data-ui-elevation="+7"]) {
1879
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-7);
1880
+ }
1881
+
1551
1882
  :where([data-ui-elevation="8"]) {
1552
1883
  --ui-elevation-shadow-layers: var(--shadow-elevation-8);
1553
1884
  }
1554
1885
 
1886
+ :where([data-ui-elevation="+8"]) {
1887
+ --ui-elevation-shadow-layers: var(--ui-relative-elevation-8);
1888
+ }
1889
+
1555
1890
  @container style(--ui-surface-level: 0) {
1556
1891
  :where([data-ui-surface="+1"]) {
1557
1892
  --ui-surface-level: 1;
1558
1893
  --ui-surface-color: var(--ui-local-surface-1);
1559
1894
  --ui-surface-ink: var(--ui-local-surface-1-ink);
1895
+ --ui-surface-ink-subtle: var(--ui-local-surface-1-ink-subtle);
1560
1896
  --ui-surface-ink-muted: var(--ui-local-surface-1-ink-muted);
1561
1897
  --ui-surface-edge: var(--ui-local-surface-1-edge);
1562
1898
  --ui-surface-edge-hover: var(--ui-local-surface-1-edge-hover);
@@ -1564,6 +1900,14 @@
1564
1900
  --ui-surface-separator: var(--ui-surface-edge);
1565
1901
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1566
1902
  --ui-matched-elevation: var(--ui-local-elevation-1);
1903
+ --ui-relative-elevation-1: var(--ui-local-elevation-2);
1904
+ --ui-relative-elevation-2: var(--ui-local-elevation-3);
1905
+ --ui-relative-elevation-3: var(--ui-local-elevation-4);
1906
+ --ui-relative-elevation-4: var(--ui-local-elevation-5);
1907
+ --ui-relative-elevation-5: var(--ui-local-elevation-6);
1908
+ --ui-relative-elevation-6: var(--ui-local-elevation-7);
1909
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1910
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1567
1911
  }
1568
1912
 
1569
1913
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -1577,6 +1921,7 @@
1577
1921
  --ui-surface-level: 2;
1578
1922
  --ui-surface-color: var(--ui-local-surface-2);
1579
1923
  --ui-surface-ink: var(--ui-local-surface-2-ink);
1924
+ --ui-surface-ink-subtle: var(--ui-local-surface-2-ink-subtle);
1580
1925
  --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
1581
1926
  --ui-surface-edge: var(--ui-local-surface-2-edge);
1582
1927
  --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
@@ -1584,6 +1929,14 @@
1584
1929
  --ui-surface-separator: var(--ui-surface-edge);
1585
1930
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1586
1931
  --ui-matched-elevation: var(--ui-local-elevation-2);
1932
+ --ui-relative-elevation-1: var(--ui-local-elevation-3);
1933
+ --ui-relative-elevation-2: var(--ui-local-elevation-4);
1934
+ --ui-relative-elevation-3: var(--ui-local-elevation-5);
1935
+ --ui-relative-elevation-4: var(--ui-local-elevation-6);
1936
+ --ui-relative-elevation-5: var(--ui-local-elevation-7);
1937
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1938
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1939
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1587
1940
  }
1588
1941
 
1589
1942
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -1597,6 +1950,7 @@
1597
1950
  --ui-surface-level: 3;
1598
1951
  --ui-surface-color: var(--ui-local-surface-3);
1599
1952
  --ui-surface-ink: var(--ui-local-surface-3-ink);
1953
+ --ui-surface-ink-subtle: var(--ui-local-surface-3-ink-subtle);
1600
1954
  --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
1601
1955
  --ui-surface-edge: var(--ui-local-surface-3-edge);
1602
1956
  --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
@@ -1604,6 +1958,14 @@
1604
1958
  --ui-surface-separator: var(--ui-surface-edge);
1605
1959
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1606
1960
  --ui-matched-elevation: var(--ui-local-elevation-3);
1961
+ --ui-relative-elevation-1: var(--ui-local-elevation-4);
1962
+ --ui-relative-elevation-2: var(--ui-local-elevation-5);
1963
+ --ui-relative-elevation-3: var(--ui-local-elevation-6);
1964
+ --ui-relative-elevation-4: var(--ui-local-elevation-7);
1965
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1966
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1967
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1968
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1607
1969
  }
1608
1970
 
1609
1971
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -1617,6 +1979,7 @@
1617
1979
  --ui-surface-level: 4;
1618
1980
  --ui-surface-color: var(--ui-local-surface-4);
1619
1981
  --ui-surface-ink: var(--ui-local-surface-4-ink);
1982
+ --ui-surface-ink-subtle: var(--ui-local-surface-4-ink-subtle);
1620
1983
  --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
1621
1984
  --ui-surface-edge: var(--ui-local-surface-4-edge);
1622
1985
  --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
@@ -1624,6 +1987,14 @@
1624
1987
  --ui-surface-separator: var(--ui-surface-edge);
1625
1988
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1626
1989
  --ui-matched-elevation: var(--ui-local-elevation-4);
1990
+ --ui-relative-elevation-1: var(--ui-local-elevation-5);
1991
+ --ui-relative-elevation-2: var(--ui-local-elevation-6);
1992
+ --ui-relative-elevation-3: var(--ui-local-elevation-7);
1993
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
1994
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
1995
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
1996
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
1997
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1627
1998
  }
1628
1999
 
1629
2000
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -1637,6 +2008,7 @@
1637
2008
  --ui-surface-level: 5;
1638
2009
  --ui-surface-color: var(--ui-local-surface-5);
1639
2010
  --ui-surface-ink: var(--ui-local-surface-5-ink);
2011
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
1640
2012
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
1641
2013
  --ui-surface-edge: var(--ui-local-surface-5-edge);
1642
2014
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -1644,6 +2016,14 @@
1644
2016
  --ui-surface-separator: var(--ui-surface-edge);
1645
2017
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1646
2018
  --ui-matched-elevation: var(--ui-local-elevation-5);
2019
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
2020
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
2021
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2022
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2023
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2024
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2025
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2026
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1647
2027
  }
1648
2028
 
1649
2029
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -1657,6 +2037,7 @@
1657
2037
  --ui-surface-level: 6;
1658
2038
  --ui-surface-color: var(--ui-local-surface-6);
1659
2039
  --ui-surface-ink: var(--ui-local-surface-6-ink);
2040
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
1660
2041
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
1661
2042
  --ui-surface-edge: var(--ui-local-surface-6-edge);
1662
2043
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -1664,6 +2045,14 @@
1664
2045
  --ui-surface-separator: var(--ui-surface-edge);
1665
2046
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1666
2047
  --ui-matched-elevation: var(--ui-local-elevation-6);
2048
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
2049
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2050
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2051
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2052
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2053
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2054
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2055
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1667
2056
  }
1668
2057
 
1669
2058
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -1677,6 +2066,7 @@
1677
2066
  --ui-surface-level: 7;
1678
2067
  --ui-surface-color: var(--ui-local-surface-7);
1679
2068
  --ui-surface-ink: var(--ui-local-surface-7-ink);
2069
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
1680
2070
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
1681
2071
  --ui-surface-edge: var(--ui-local-surface-7-edge);
1682
2072
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -1684,6 +2074,14 @@
1684
2074
  --ui-surface-separator: var(--ui-surface-edge);
1685
2075
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1686
2076
  --ui-matched-elevation: var(--ui-local-elevation-7);
2077
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2078
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2079
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2080
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2081
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2082
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2083
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2084
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1687
2085
  }
1688
2086
 
1689
2087
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -1697,6 +2095,7 @@
1697
2095
  --ui-surface-level: 8;
1698
2096
  --ui-surface-color: var(--ui-local-surface-8);
1699
2097
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2098
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
1700
2099
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
1701
2100
  --ui-surface-edge: var(--ui-local-surface-8-edge);
1702
2101
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -1704,6 +2103,14 @@
1704
2103
  --ui-surface-separator: var(--ui-surface-edge);
1705
2104
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1706
2105
  --ui-matched-elevation: var(--ui-local-elevation-8);
2106
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2107
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2108
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2109
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2110
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2111
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2112
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2113
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1707
2114
  }
1708
2115
 
1709
2116
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -1717,6 +2124,7 @@
1717
2124
  --ui-surface-level: 2;
1718
2125
  --ui-surface-color: var(--ui-local-surface-2);
1719
2126
  --ui-surface-ink: var(--ui-local-surface-2-ink);
2127
+ --ui-surface-ink-subtle: var(--ui-local-surface-2-ink-subtle);
1720
2128
  --ui-surface-ink-muted: var(--ui-local-surface-2-ink-muted);
1721
2129
  --ui-surface-edge: var(--ui-local-surface-2-edge);
1722
2130
  --ui-surface-edge-hover: var(--ui-local-surface-2-edge-hover);
@@ -1724,6 +2132,14 @@
1724
2132
  --ui-surface-separator: var(--ui-surface-edge);
1725
2133
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1726
2134
  --ui-matched-elevation: var(--ui-local-elevation-2);
2135
+ --ui-relative-elevation-1: var(--ui-local-elevation-3);
2136
+ --ui-relative-elevation-2: var(--ui-local-elevation-4);
2137
+ --ui-relative-elevation-3: var(--ui-local-elevation-5);
2138
+ --ui-relative-elevation-4: var(--ui-local-elevation-6);
2139
+ --ui-relative-elevation-5: var(--ui-local-elevation-7);
2140
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2141
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2142
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1727
2143
  }
1728
2144
 
1729
2145
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -1737,6 +2153,7 @@
1737
2153
  --ui-surface-level: 3;
1738
2154
  --ui-surface-color: var(--ui-local-surface-3);
1739
2155
  --ui-surface-ink: var(--ui-local-surface-3-ink);
2156
+ --ui-surface-ink-subtle: var(--ui-local-surface-3-ink-subtle);
1740
2157
  --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
1741
2158
  --ui-surface-edge: var(--ui-local-surface-3-edge);
1742
2159
  --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
@@ -1744,6 +2161,14 @@
1744
2161
  --ui-surface-separator: var(--ui-surface-edge);
1745
2162
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1746
2163
  --ui-matched-elevation: var(--ui-local-elevation-3);
2164
+ --ui-relative-elevation-1: var(--ui-local-elevation-4);
2165
+ --ui-relative-elevation-2: var(--ui-local-elevation-5);
2166
+ --ui-relative-elevation-3: var(--ui-local-elevation-6);
2167
+ --ui-relative-elevation-4: var(--ui-local-elevation-7);
2168
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2169
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2170
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2171
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1747
2172
  }
1748
2173
 
1749
2174
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -1757,6 +2182,7 @@
1757
2182
  --ui-surface-level: 4;
1758
2183
  --ui-surface-color: var(--ui-local-surface-4);
1759
2184
  --ui-surface-ink: var(--ui-local-surface-4-ink);
2185
+ --ui-surface-ink-subtle: var(--ui-local-surface-4-ink-subtle);
1760
2186
  --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
1761
2187
  --ui-surface-edge: var(--ui-local-surface-4-edge);
1762
2188
  --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
@@ -1764,6 +2190,14 @@
1764
2190
  --ui-surface-separator: var(--ui-surface-edge);
1765
2191
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1766
2192
  --ui-matched-elevation: var(--ui-local-elevation-4);
2193
+ --ui-relative-elevation-1: var(--ui-local-elevation-5);
2194
+ --ui-relative-elevation-2: var(--ui-local-elevation-6);
2195
+ --ui-relative-elevation-3: var(--ui-local-elevation-7);
2196
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2197
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2198
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2199
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2200
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1767
2201
  }
1768
2202
 
1769
2203
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -1777,6 +2211,7 @@
1777
2211
  --ui-surface-level: 5;
1778
2212
  --ui-surface-color: var(--ui-local-surface-5);
1779
2213
  --ui-surface-ink: var(--ui-local-surface-5-ink);
2214
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
1780
2215
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
1781
2216
  --ui-surface-edge: var(--ui-local-surface-5-edge);
1782
2217
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -1784,6 +2219,14 @@
1784
2219
  --ui-surface-separator: var(--ui-surface-edge);
1785
2220
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1786
2221
  --ui-matched-elevation: var(--ui-local-elevation-5);
2222
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
2223
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
2224
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2225
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2226
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2227
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2228
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2229
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1787
2230
  }
1788
2231
 
1789
2232
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -1797,6 +2240,7 @@
1797
2240
  --ui-surface-level: 6;
1798
2241
  --ui-surface-color: var(--ui-local-surface-6);
1799
2242
  --ui-surface-ink: var(--ui-local-surface-6-ink);
2243
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
1800
2244
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
1801
2245
  --ui-surface-edge: var(--ui-local-surface-6-edge);
1802
2246
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -1804,6 +2248,14 @@
1804
2248
  --ui-surface-separator: var(--ui-surface-edge);
1805
2249
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1806
2250
  --ui-matched-elevation: var(--ui-local-elevation-6);
2251
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
2252
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2253
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2254
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2255
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2256
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2257
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2258
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1807
2259
  }
1808
2260
 
1809
2261
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -1817,6 +2269,7 @@
1817
2269
  --ui-surface-level: 7;
1818
2270
  --ui-surface-color: var(--ui-local-surface-7);
1819
2271
  --ui-surface-ink: var(--ui-local-surface-7-ink);
2272
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
1820
2273
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
1821
2274
  --ui-surface-edge: var(--ui-local-surface-7-edge);
1822
2275
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -1824,6 +2277,14 @@
1824
2277
  --ui-surface-separator: var(--ui-surface-edge);
1825
2278
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1826
2279
  --ui-matched-elevation: var(--ui-local-elevation-7);
2280
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2281
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2282
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2283
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2284
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2285
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2286
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2287
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1827
2288
  }
1828
2289
 
1829
2290
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -1837,6 +2298,7 @@
1837
2298
  --ui-surface-level: 8;
1838
2299
  --ui-surface-color: var(--ui-local-surface-8);
1839
2300
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2301
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
1840
2302
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
1841
2303
  --ui-surface-edge: var(--ui-local-surface-8-edge);
1842
2304
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -1844,6 +2306,14 @@
1844
2306
  --ui-surface-separator: var(--ui-surface-edge);
1845
2307
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1846
2308
  --ui-matched-elevation: var(--ui-local-elevation-8);
2309
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2310
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2311
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2312
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2313
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2314
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2315
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2316
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1847
2317
  }
1848
2318
 
1849
2319
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -1857,6 +2327,7 @@
1857
2327
  --ui-surface-level: 8;
1858
2328
  --ui-surface-color: var(--ui-local-surface-8);
1859
2329
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2330
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
1860
2331
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
1861
2332
  --ui-surface-edge: var(--ui-local-surface-8-edge);
1862
2333
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -1864,6 +2335,14 @@
1864
2335
  --ui-surface-separator: var(--ui-surface-edge);
1865
2336
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1866
2337
  --ui-matched-elevation: var(--ui-local-elevation-8);
2338
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2339
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2340
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2341
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2342
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2343
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2344
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2345
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1867
2346
  }
1868
2347
 
1869
2348
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -1877,6 +2356,7 @@
1877
2356
  --ui-surface-level: 3;
1878
2357
  --ui-surface-color: var(--ui-local-surface-3);
1879
2358
  --ui-surface-ink: var(--ui-local-surface-3-ink);
2359
+ --ui-surface-ink-subtle: var(--ui-local-surface-3-ink-subtle);
1880
2360
  --ui-surface-ink-muted: var(--ui-local-surface-3-ink-muted);
1881
2361
  --ui-surface-edge: var(--ui-local-surface-3-edge);
1882
2362
  --ui-surface-edge-hover: var(--ui-local-surface-3-edge-hover);
@@ -1884,6 +2364,14 @@
1884
2364
  --ui-surface-separator: var(--ui-surface-edge);
1885
2365
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1886
2366
  --ui-matched-elevation: var(--ui-local-elevation-3);
2367
+ --ui-relative-elevation-1: var(--ui-local-elevation-4);
2368
+ --ui-relative-elevation-2: var(--ui-local-elevation-5);
2369
+ --ui-relative-elevation-3: var(--ui-local-elevation-6);
2370
+ --ui-relative-elevation-4: var(--ui-local-elevation-7);
2371
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2372
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2373
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2374
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1887
2375
  }
1888
2376
 
1889
2377
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -1897,6 +2385,7 @@
1897
2385
  --ui-surface-level: 4;
1898
2386
  --ui-surface-color: var(--ui-local-surface-4);
1899
2387
  --ui-surface-ink: var(--ui-local-surface-4-ink);
2388
+ --ui-surface-ink-subtle: var(--ui-local-surface-4-ink-subtle);
1900
2389
  --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
1901
2390
  --ui-surface-edge: var(--ui-local-surface-4-edge);
1902
2391
  --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
@@ -1904,6 +2393,14 @@
1904
2393
  --ui-surface-separator: var(--ui-surface-edge);
1905
2394
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1906
2395
  --ui-matched-elevation: var(--ui-local-elevation-4);
2396
+ --ui-relative-elevation-1: var(--ui-local-elevation-5);
2397
+ --ui-relative-elevation-2: var(--ui-local-elevation-6);
2398
+ --ui-relative-elevation-3: var(--ui-local-elevation-7);
2399
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2400
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2401
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2402
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2403
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1907
2404
  }
1908
2405
 
1909
2406
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -1917,6 +2414,7 @@
1917
2414
  --ui-surface-level: 5;
1918
2415
  --ui-surface-color: var(--ui-local-surface-5);
1919
2416
  --ui-surface-ink: var(--ui-local-surface-5-ink);
2417
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
1920
2418
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
1921
2419
  --ui-surface-edge: var(--ui-local-surface-5-edge);
1922
2420
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -1924,6 +2422,14 @@
1924
2422
  --ui-surface-separator: var(--ui-surface-edge);
1925
2423
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1926
2424
  --ui-matched-elevation: var(--ui-local-elevation-5);
2425
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
2426
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
2427
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2428
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2429
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2430
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2431
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2432
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1927
2433
  }
1928
2434
 
1929
2435
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -1937,6 +2443,7 @@
1937
2443
  --ui-surface-level: 6;
1938
2444
  --ui-surface-color: var(--ui-local-surface-6);
1939
2445
  --ui-surface-ink: var(--ui-local-surface-6-ink);
2446
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
1940
2447
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
1941
2448
  --ui-surface-edge: var(--ui-local-surface-6-edge);
1942
2449
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -1944,6 +2451,14 @@
1944
2451
  --ui-surface-separator: var(--ui-surface-edge);
1945
2452
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1946
2453
  --ui-matched-elevation: var(--ui-local-elevation-6);
2454
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
2455
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2456
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2457
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2458
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2459
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2460
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2461
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1947
2462
  }
1948
2463
 
1949
2464
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -1957,6 +2472,7 @@
1957
2472
  --ui-surface-level: 7;
1958
2473
  --ui-surface-color: var(--ui-local-surface-7);
1959
2474
  --ui-surface-ink: var(--ui-local-surface-7-ink);
2475
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
1960
2476
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
1961
2477
  --ui-surface-edge: var(--ui-local-surface-7-edge);
1962
2478
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -1964,6 +2480,14 @@
1964
2480
  --ui-surface-separator: var(--ui-surface-edge);
1965
2481
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1966
2482
  --ui-matched-elevation: var(--ui-local-elevation-7);
2483
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2484
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2485
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2486
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2487
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2488
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2489
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2490
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1967
2491
  }
1968
2492
 
1969
2493
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -1977,6 +2501,7 @@
1977
2501
  --ui-surface-level: 8;
1978
2502
  --ui-surface-color: var(--ui-local-surface-8);
1979
2503
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2504
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
1980
2505
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
1981
2506
  --ui-surface-edge: var(--ui-local-surface-8-edge);
1982
2507
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -1984,6 +2509,14 @@
1984
2509
  --ui-surface-separator: var(--ui-surface-edge);
1985
2510
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
1986
2511
  --ui-matched-elevation: var(--ui-local-elevation-8);
2512
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2513
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2514
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2515
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2516
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2517
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2518
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2519
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
1987
2520
  }
1988
2521
 
1989
2522
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -1997,6 +2530,7 @@
1997
2530
  --ui-surface-level: 8;
1998
2531
  --ui-surface-color: var(--ui-local-surface-8);
1999
2532
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2533
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2000
2534
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2001
2535
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2002
2536
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2004,6 +2538,14 @@
2004
2538
  --ui-surface-separator: var(--ui-surface-edge);
2005
2539
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2006
2540
  --ui-matched-elevation: var(--ui-local-elevation-8);
2541
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2542
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2543
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2544
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2545
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2546
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2547
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2548
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2007
2549
  }
2008
2550
 
2009
2551
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2017,6 +2559,7 @@
2017
2559
  --ui-surface-level: 8;
2018
2560
  --ui-surface-color: var(--ui-local-surface-8);
2019
2561
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2562
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2020
2563
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2021
2564
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2022
2565
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2024,6 +2567,14 @@
2024
2567
  --ui-surface-separator: var(--ui-surface-edge);
2025
2568
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2026
2569
  --ui-matched-elevation: var(--ui-local-elevation-8);
2570
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2571
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2572
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2573
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2574
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2575
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2576
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2577
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2027
2578
  }
2028
2579
 
2029
2580
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -2037,6 +2588,7 @@
2037
2588
  --ui-surface-level: 4;
2038
2589
  --ui-surface-color: var(--ui-local-surface-4);
2039
2590
  --ui-surface-ink: var(--ui-local-surface-4-ink);
2591
+ --ui-surface-ink-subtle: var(--ui-local-surface-4-ink-subtle);
2040
2592
  --ui-surface-ink-muted: var(--ui-local-surface-4-ink-muted);
2041
2593
  --ui-surface-edge: var(--ui-local-surface-4-edge);
2042
2594
  --ui-surface-edge-hover: var(--ui-local-surface-4-edge-hover);
@@ -2044,6 +2596,14 @@
2044
2596
  --ui-surface-separator: var(--ui-surface-edge);
2045
2597
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2046
2598
  --ui-matched-elevation: var(--ui-local-elevation-4);
2599
+ --ui-relative-elevation-1: var(--ui-local-elevation-5);
2600
+ --ui-relative-elevation-2: var(--ui-local-elevation-6);
2601
+ --ui-relative-elevation-3: var(--ui-local-elevation-7);
2602
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2603
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2604
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2605
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2606
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2047
2607
  }
2048
2608
 
2049
2609
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -2057,6 +2617,7 @@
2057
2617
  --ui-surface-level: 5;
2058
2618
  --ui-surface-color: var(--ui-local-surface-5);
2059
2619
  --ui-surface-ink: var(--ui-local-surface-5-ink);
2620
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
2060
2621
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
2061
2622
  --ui-surface-edge: var(--ui-local-surface-5-edge);
2062
2623
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -2064,6 +2625,14 @@
2064
2625
  --ui-surface-separator: var(--ui-surface-edge);
2065
2626
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2066
2627
  --ui-matched-elevation: var(--ui-local-elevation-5);
2628
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
2629
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
2630
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2631
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2632
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2633
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2634
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2635
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2067
2636
  }
2068
2637
 
2069
2638
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -2077,6 +2646,7 @@
2077
2646
  --ui-surface-level: 6;
2078
2647
  --ui-surface-color: var(--ui-local-surface-6);
2079
2648
  --ui-surface-ink: var(--ui-local-surface-6-ink);
2649
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
2080
2650
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
2081
2651
  --ui-surface-edge: var(--ui-local-surface-6-edge);
2082
2652
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -2084,6 +2654,14 @@
2084
2654
  --ui-surface-separator: var(--ui-surface-edge);
2085
2655
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2086
2656
  --ui-matched-elevation: var(--ui-local-elevation-6);
2657
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
2658
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2659
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2660
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2661
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2662
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2663
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2664
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2087
2665
  }
2088
2666
 
2089
2667
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -2097,6 +2675,7 @@
2097
2675
  --ui-surface-level: 7;
2098
2676
  --ui-surface-color: var(--ui-local-surface-7);
2099
2677
  --ui-surface-ink: var(--ui-local-surface-7-ink);
2678
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
2100
2679
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
2101
2680
  --ui-surface-edge: var(--ui-local-surface-7-edge);
2102
2681
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -2104,6 +2683,14 @@
2104
2683
  --ui-surface-separator: var(--ui-surface-edge);
2105
2684
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2106
2685
  --ui-matched-elevation: var(--ui-local-elevation-7);
2686
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2687
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2688
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2689
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2690
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2691
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2692
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2693
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2107
2694
  }
2108
2695
 
2109
2696
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -2117,6 +2704,7 @@
2117
2704
  --ui-surface-level: 8;
2118
2705
  --ui-surface-color: var(--ui-local-surface-8);
2119
2706
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2707
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2120
2708
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2121
2709
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2122
2710
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2124,6 +2712,14 @@
2124
2712
  --ui-surface-separator: var(--ui-surface-edge);
2125
2713
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2126
2714
  --ui-matched-elevation: var(--ui-local-elevation-8);
2715
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2716
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2717
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2718
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2719
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2720
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2721
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2722
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2127
2723
  }
2128
2724
 
2129
2725
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -2137,6 +2733,7 @@
2137
2733
  --ui-surface-level: 8;
2138
2734
  --ui-surface-color: var(--ui-local-surface-8);
2139
2735
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2736
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2140
2737
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2141
2738
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2142
2739
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2144,6 +2741,14 @@
2144
2741
  --ui-surface-separator: var(--ui-surface-edge);
2145
2742
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2146
2743
  --ui-matched-elevation: var(--ui-local-elevation-8);
2744
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2745
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2746
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2747
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2748
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2749
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2750
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2751
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2147
2752
  }
2148
2753
 
2149
2754
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -2157,6 +2762,7 @@
2157
2762
  --ui-surface-level: 8;
2158
2763
  --ui-surface-color: var(--ui-local-surface-8);
2159
2764
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2765
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2160
2766
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2161
2767
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2162
2768
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2164,6 +2770,14 @@
2164
2770
  --ui-surface-separator: var(--ui-surface-edge);
2165
2771
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2166
2772
  --ui-matched-elevation: var(--ui-local-elevation-8);
2773
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2774
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2775
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2776
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2777
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2778
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2779
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2780
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2167
2781
  }
2168
2782
 
2169
2783
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2177,6 +2791,7 @@
2177
2791
  --ui-surface-level: 8;
2178
2792
  --ui-surface-color: var(--ui-local-surface-8);
2179
2793
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2794
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2180
2795
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2181
2796
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2182
2797
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2184,6 +2799,14 @@
2184
2799
  --ui-surface-separator: var(--ui-surface-edge);
2185
2800
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2186
2801
  --ui-matched-elevation: var(--ui-local-elevation-8);
2802
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2803
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2804
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2805
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2806
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2807
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2808
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2809
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2187
2810
  }
2188
2811
 
2189
2812
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -2197,6 +2820,7 @@
2197
2820
  --ui-surface-level: 5;
2198
2821
  --ui-surface-color: var(--ui-local-surface-5);
2199
2822
  --ui-surface-ink: var(--ui-local-surface-5-ink);
2823
+ --ui-surface-ink-subtle: var(--ui-local-surface-5-ink-subtle);
2200
2824
  --ui-surface-ink-muted: var(--ui-local-surface-5-ink-muted);
2201
2825
  --ui-surface-edge: var(--ui-local-surface-5-edge);
2202
2826
  --ui-surface-edge-hover: var(--ui-local-surface-5-edge-hover);
@@ -2204,6 +2828,14 @@
2204
2828
  --ui-surface-separator: var(--ui-surface-edge);
2205
2829
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2206
2830
  --ui-matched-elevation: var(--ui-local-elevation-5);
2831
+ --ui-relative-elevation-1: var(--ui-local-elevation-6);
2832
+ --ui-relative-elevation-2: var(--ui-local-elevation-7);
2833
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2834
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2835
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2836
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2837
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2838
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2207
2839
  }
2208
2840
 
2209
2841
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -2217,6 +2849,7 @@
2217
2849
  --ui-surface-level: 6;
2218
2850
  --ui-surface-color: var(--ui-local-surface-6);
2219
2851
  --ui-surface-ink: var(--ui-local-surface-6-ink);
2852
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
2220
2853
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
2221
2854
  --ui-surface-edge: var(--ui-local-surface-6-edge);
2222
2855
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -2224,6 +2857,14 @@
2224
2857
  --ui-surface-separator: var(--ui-surface-edge);
2225
2858
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2226
2859
  --ui-matched-elevation: var(--ui-local-elevation-6);
2860
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
2861
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2862
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2863
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2864
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2865
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2866
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2867
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2227
2868
  }
2228
2869
 
2229
2870
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -2237,6 +2878,7 @@
2237
2878
  --ui-surface-level: 7;
2238
2879
  --ui-surface-color: var(--ui-local-surface-7);
2239
2880
  --ui-surface-ink: var(--ui-local-surface-7-ink);
2881
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
2240
2882
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
2241
2883
  --ui-surface-edge: var(--ui-local-surface-7-edge);
2242
2884
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -2244,6 +2886,14 @@
2244
2886
  --ui-surface-separator: var(--ui-surface-edge);
2245
2887
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2246
2888
  --ui-matched-elevation: var(--ui-local-elevation-7);
2889
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2890
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2891
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2892
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2893
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2894
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2895
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2896
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2247
2897
  }
2248
2898
 
2249
2899
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -2257,6 +2907,7 @@
2257
2907
  --ui-surface-level: 8;
2258
2908
  --ui-surface-color: var(--ui-local-surface-8);
2259
2909
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2910
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2260
2911
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2261
2912
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2262
2913
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2264,6 +2915,14 @@
2264
2915
  --ui-surface-separator: var(--ui-surface-edge);
2265
2916
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2266
2917
  --ui-matched-elevation: var(--ui-local-elevation-8);
2918
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2919
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2920
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2921
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2922
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2923
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2924
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2925
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2267
2926
  }
2268
2927
 
2269
2928
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -2277,6 +2936,7 @@
2277
2936
  --ui-surface-level: 8;
2278
2937
  --ui-surface-color: var(--ui-local-surface-8);
2279
2938
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2939
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2280
2940
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2281
2941
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2282
2942
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2284,6 +2944,14 @@
2284
2944
  --ui-surface-separator: var(--ui-surface-edge);
2285
2945
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2286
2946
  --ui-matched-elevation: var(--ui-local-elevation-8);
2947
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2948
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2949
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2950
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2951
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2952
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2953
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2954
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2287
2955
  }
2288
2956
 
2289
2957
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -2297,6 +2965,7 @@
2297
2965
  --ui-surface-level: 8;
2298
2966
  --ui-surface-color: var(--ui-local-surface-8);
2299
2967
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2968
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2300
2969
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2301
2970
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2302
2971
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2304,6 +2973,14 @@
2304
2973
  --ui-surface-separator: var(--ui-surface-edge);
2305
2974
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2306
2975
  --ui-matched-elevation: var(--ui-local-elevation-8);
2976
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
2977
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
2978
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
2979
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
2980
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
2981
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
2982
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
2983
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2307
2984
  }
2308
2985
 
2309
2986
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -2317,6 +2994,7 @@
2317
2994
  --ui-surface-level: 8;
2318
2995
  --ui-surface-color: var(--ui-local-surface-8);
2319
2996
  --ui-surface-ink: var(--ui-local-surface-8-ink);
2997
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2320
2998
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2321
2999
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2322
3000
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2324,6 +3002,14 @@
2324
3002
  --ui-surface-separator: var(--ui-surface-edge);
2325
3003
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2326
3004
  --ui-matched-elevation: var(--ui-local-elevation-8);
3005
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3006
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3007
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3008
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3009
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3010
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3011
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3012
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2327
3013
  }
2328
3014
 
2329
3015
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2337,6 +3023,7 @@
2337
3023
  --ui-surface-level: 8;
2338
3024
  --ui-surface-color: var(--ui-local-surface-8);
2339
3025
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3026
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2340
3027
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2341
3028
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2342
3029
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2344,6 +3031,14 @@
2344
3031
  --ui-surface-separator: var(--ui-surface-edge);
2345
3032
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2346
3033
  --ui-matched-elevation: var(--ui-local-elevation-8);
3034
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3035
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3036
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3037
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3038
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3039
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3040
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3041
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2347
3042
  }
2348
3043
 
2349
3044
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -2357,6 +3052,7 @@
2357
3052
  --ui-surface-level: 6;
2358
3053
  --ui-surface-color: var(--ui-local-surface-6);
2359
3054
  --ui-surface-ink: var(--ui-local-surface-6-ink);
3055
+ --ui-surface-ink-subtle: var(--ui-local-surface-6-ink-subtle);
2360
3056
  --ui-surface-ink-muted: var(--ui-local-surface-6-ink-muted);
2361
3057
  --ui-surface-edge: var(--ui-local-surface-6-edge);
2362
3058
  --ui-surface-edge-hover: var(--ui-local-surface-6-edge-hover);
@@ -2364,6 +3060,14 @@
2364
3060
  --ui-surface-separator: var(--ui-surface-edge);
2365
3061
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2366
3062
  --ui-matched-elevation: var(--ui-local-elevation-6);
3063
+ --ui-relative-elevation-1: var(--ui-local-elevation-7);
3064
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3065
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3066
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3067
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3068
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3069
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3070
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2367
3071
  }
2368
3072
 
2369
3073
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -2377,6 +3081,7 @@
2377
3081
  --ui-surface-level: 7;
2378
3082
  --ui-surface-color: var(--ui-local-surface-7);
2379
3083
  --ui-surface-ink: var(--ui-local-surface-7-ink);
3084
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
2380
3085
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
2381
3086
  --ui-surface-edge: var(--ui-local-surface-7-edge);
2382
3087
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -2384,6 +3089,14 @@
2384
3089
  --ui-surface-separator: var(--ui-surface-edge);
2385
3090
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2386
3091
  --ui-matched-elevation: var(--ui-local-elevation-7);
3092
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3093
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3094
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3095
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3096
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3097
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3098
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3099
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2387
3100
  }
2388
3101
 
2389
3102
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -2397,6 +3110,7 @@
2397
3110
  --ui-surface-level: 8;
2398
3111
  --ui-surface-color: var(--ui-local-surface-8);
2399
3112
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3113
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2400
3114
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2401
3115
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2402
3116
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2404,6 +3118,14 @@
2404
3118
  --ui-surface-separator: var(--ui-surface-edge);
2405
3119
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2406
3120
  --ui-matched-elevation: var(--ui-local-elevation-8);
3121
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3122
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3123
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3124
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3125
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3126
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3127
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3128
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2407
3129
  }
2408
3130
 
2409
3131
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -2417,6 +3139,7 @@
2417
3139
  --ui-surface-level: 8;
2418
3140
  --ui-surface-color: var(--ui-local-surface-8);
2419
3141
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3142
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2420
3143
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2421
3144
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2422
3145
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2424,6 +3147,14 @@
2424
3147
  --ui-surface-separator: var(--ui-surface-edge);
2425
3148
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2426
3149
  --ui-matched-elevation: var(--ui-local-elevation-8);
3150
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3151
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3152
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3153
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3154
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3155
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3156
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3157
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2427
3158
  }
2428
3159
 
2429
3160
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -2437,6 +3168,7 @@
2437
3168
  --ui-surface-level: 8;
2438
3169
  --ui-surface-color: var(--ui-local-surface-8);
2439
3170
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3171
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2440
3172
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2441
3173
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2442
3174
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2444,6 +3176,14 @@
2444
3176
  --ui-surface-separator: var(--ui-surface-edge);
2445
3177
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2446
3178
  --ui-matched-elevation: var(--ui-local-elevation-8);
3179
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3180
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3181
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3182
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3183
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3184
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3185
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3186
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2447
3187
  }
2448
3188
 
2449
3189
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -2457,6 +3197,7 @@
2457
3197
  --ui-surface-level: 8;
2458
3198
  --ui-surface-color: var(--ui-local-surface-8);
2459
3199
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3200
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2460
3201
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2461
3202
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2462
3203
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2464,6 +3205,14 @@
2464
3205
  --ui-surface-separator: var(--ui-surface-edge);
2465
3206
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2466
3207
  --ui-matched-elevation: var(--ui-local-elevation-8);
3208
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3209
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3210
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3211
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3212
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3213
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3214
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3215
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2467
3216
  }
2468
3217
 
2469
3218
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -2477,6 +3226,7 @@
2477
3226
  --ui-surface-level: 8;
2478
3227
  --ui-surface-color: var(--ui-local-surface-8);
2479
3228
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3229
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2480
3230
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2481
3231
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2482
3232
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2484,6 +3234,14 @@
2484
3234
  --ui-surface-separator: var(--ui-surface-edge);
2485
3235
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2486
3236
  --ui-matched-elevation: var(--ui-local-elevation-8);
3237
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3238
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3239
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3240
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3241
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3242
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3243
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3244
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2487
3245
  }
2488
3246
 
2489
3247
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2497,6 +3255,7 @@
2497
3255
  --ui-surface-level: 8;
2498
3256
  --ui-surface-color: var(--ui-local-surface-8);
2499
3257
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3258
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2500
3259
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2501
3260
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2502
3261
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2504,6 +3263,14 @@
2504
3263
  --ui-surface-separator: var(--ui-surface-edge);
2505
3264
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2506
3265
  --ui-matched-elevation: var(--ui-local-elevation-8);
3266
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3267
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3268
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3269
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3270
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3271
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3272
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3273
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2507
3274
  }
2508
3275
 
2509
3276
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -2517,6 +3284,7 @@
2517
3284
  --ui-surface-level: 7;
2518
3285
  --ui-surface-color: var(--ui-local-surface-7);
2519
3286
  --ui-surface-ink: var(--ui-local-surface-7-ink);
3287
+ --ui-surface-ink-subtle: var(--ui-local-surface-7-ink-subtle);
2520
3288
  --ui-surface-ink-muted: var(--ui-local-surface-7-ink-muted);
2521
3289
  --ui-surface-edge: var(--ui-local-surface-7-edge);
2522
3290
  --ui-surface-edge-hover: var(--ui-local-surface-7-edge-hover);
@@ -2524,6 +3292,14 @@
2524
3292
  --ui-surface-separator: var(--ui-surface-edge);
2525
3293
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2526
3294
  --ui-matched-elevation: var(--ui-local-elevation-7);
3295
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3296
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3297
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3298
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3299
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3300
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3301
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3302
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2527
3303
  }
2528
3304
 
2529
3305
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -2537,6 +3313,7 @@
2537
3313
  --ui-surface-level: 8;
2538
3314
  --ui-surface-color: var(--ui-local-surface-8);
2539
3315
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3316
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2540
3317
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2541
3318
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2542
3319
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2544,6 +3321,14 @@
2544
3321
  --ui-surface-separator: var(--ui-surface-edge);
2545
3322
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2546
3323
  --ui-matched-elevation: var(--ui-local-elevation-8);
3324
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3325
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3326
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3327
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3328
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3329
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3330
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3331
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2547
3332
  }
2548
3333
 
2549
3334
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -2557,6 +3342,7 @@
2557
3342
  --ui-surface-level: 8;
2558
3343
  --ui-surface-color: var(--ui-local-surface-8);
2559
3344
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3345
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2560
3346
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2561
3347
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2562
3348
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2564,6 +3350,14 @@
2564
3350
  --ui-surface-separator: var(--ui-surface-edge);
2565
3351
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2566
3352
  --ui-matched-elevation: var(--ui-local-elevation-8);
3353
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3354
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3355
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3356
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3357
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3358
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3359
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3360
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2567
3361
  }
2568
3362
 
2569
3363
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -2577,6 +3371,7 @@
2577
3371
  --ui-surface-level: 8;
2578
3372
  --ui-surface-color: var(--ui-local-surface-8);
2579
3373
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3374
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2580
3375
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2581
3376
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2582
3377
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2584,6 +3379,14 @@
2584
3379
  --ui-surface-separator: var(--ui-surface-edge);
2585
3380
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2586
3381
  --ui-matched-elevation: var(--ui-local-elevation-8);
3382
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3383
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3384
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3385
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3386
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3387
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3388
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3389
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2587
3390
  }
2588
3391
 
2589
3392
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -2597,6 +3400,7 @@
2597
3400
  --ui-surface-level: 8;
2598
3401
  --ui-surface-color: var(--ui-local-surface-8);
2599
3402
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3403
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2600
3404
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2601
3405
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2602
3406
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2604,6 +3408,14 @@
2604
3408
  --ui-surface-separator: var(--ui-surface-edge);
2605
3409
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2606
3410
  --ui-matched-elevation: var(--ui-local-elevation-8);
3411
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3412
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3413
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3414
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3415
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3416
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3417
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3418
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2607
3419
  }
2608
3420
 
2609
3421
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -2617,6 +3429,7 @@
2617
3429
  --ui-surface-level: 8;
2618
3430
  --ui-surface-color: var(--ui-local-surface-8);
2619
3431
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3432
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2620
3433
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2621
3434
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2622
3435
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2624,6 +3437,14 @@
2624
3437
  --ui-surface-separator: var(--ui-surface-edge);
2625
3438
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2626
3439
  --ui-matched-elevation: var(--ui-local-elevation-8);
3440
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3441
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3442
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3443
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3444
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3445
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3446
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3447
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2627
3448
  }
2628
3449
 
2629
3450
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -2637,6 +3458,7 @@
2637
3458
  --ui-surface-level: 8;
2638
3459
  --ui-surface-color: var(--ui-local-surface-8);
2639
3460
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3461
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2640
3462
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2641
3463
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2642
3464
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2644,6 +3466,14 @@
2644
3466
  --ui-surface-separator: var(--ui-surface-edge);
2645
3467
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2646
3468
  --ui-matched-elevation: var(--ui-local-elevation-8);
3469
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3470
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3471
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3472
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3473
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3474
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3475
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3476
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2647
3477
  }
2648
3478
 
2649
3479
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2657,6 +3487,7 @@
2657
3487
  --ui-surface-level: 8;
2658
3488
  --ui-surface-color: var(--ui-local-surface-8);
2659
3489
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3490
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2660
3491
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2661
3492
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2662
3493
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2664,6 +3495,14 @@
2664
3495
  --ui-surface-separator: var(--ui-surface-edge);
2665
3496
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2666
3497
  --ui-matched-elevation: var(--ui-local-elevation-8);
3498
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3499
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3500
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3501
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3502
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3503
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3504
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3505
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2667
3506
  }
2668
3507
 
2669
3508
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -2677,6 +3516,7 @@
2677
3516
  --ui-surface-level: 8;
2678
3517
  --ui-surface-color: var(--ui-local-surface-8);
2679
3518
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3519
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2680
3520
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2681
3521
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2682
3522
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2684,6 +3524,14 @@
2684
3524
  --ui-surface-separator: var(--ui-surface-edge);
2685
3525
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2686
3526
  --ui-matched-elevation: var(--ui-local-elevation-8);
3527
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3528
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3529
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3530
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3531
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3532
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3533
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3534
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2687
3535
  }
2688
3536
 
2689
3537
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -2697,6 +3545,7 @@
2697
3545
  --ui-surface-level: 8;
2698
3546
  --ui-surface-color: var(--ui-local-surface-8);
2699
3547
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3548
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2700
3549
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2701
3550
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2702
3551
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2704,6 +3553,14 @@
2704
3553
  --ui-surface-separator: var(--ui-surface-edge);
2705
3554
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2706
3555
  --ui-matched-elevation: var(--ui-local-elevation-8);
3556
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3557
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3558
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3559
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3560
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3561
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3562
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3563
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2707
3564
  }
2708
3565
 
2709
3566
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -2717,6 +3574,7 @@
2717
3574
  --ui-surface-level: 8;
2718
3575
  --ui-surface-color: var(--ui-local-surface-8);
2719
3576
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3577
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2720
3578
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2721
3579
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2722
3580
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2724,6 +3582,14 @@
2724
3582
  --ui-surface-separator: var(--ui-surface-edge);
2725
3583
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2726
3584
  --ui-matched-elevation: var(--ui-local-elevation-8);
3585
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3586
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3587
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3588
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3589
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3590
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3591
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3592
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2727
3593
  }
2728
3594
 
2729
3595
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -2737,6 +3603,7 @@
2737
3603
  --ui-surface-level: 8;
2738
3604
  --ui-surface-color: var(--ui-local-surface-8);
2739
3605
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3606
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2740
3607
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2741
3608
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2742
3609
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2744,6 +3611,14 @@
2744
3611
  --ui-surface-separator: var(--ui-surface-edge);
2745
3612
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2746
3613
  --ui-matched-elevation: var(--ui-local-elevation-8);
3614
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3615
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3616
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3617
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3618
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3619
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3620
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3621
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2747
3622
  }
2748
3623
 
2749
3624
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -2757,6 +3632,7 @@
2757
3632
  --ui-surface-level: 8;
2758
3633
  --ui-surface-color: var(--ui-local-surface-8);
2759
3634
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3635
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2760
3636
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2761
3637
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2762
3638
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2764,6 +3640,14 @@
2764
3640
  --ui-surface-separator: var(--ui-surface-edge);
2765
3641
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2766
3642
  --ui-matched-elevation: var(--ui-local-elevation-8);
3643
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3644
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3645
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3646
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3647
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3648
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3649
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3650
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2767
3651
  }
2768
3652
 
2769
3653
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -2777,6 +3661,7 @@
2777
3661
  --ui-surface-level: 8;
2778
3662
  --ui-surface-color: var(--ui-local-surface-8);
2779
3663
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3664
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2780
3665
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2781
3666
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2782
3667
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2784,6 +3669,14 @@
2784
3669
  --ui-surface-separator: var(--ui-surface-edge);
2785
3670
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2786
3671
  --ui-matched-elevation: var(--ui-local-elevation-8);
3672
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3673
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3674
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3675
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3676
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3677
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3678
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3679
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2787
3680
  }
2788
3681
 
2789
3682
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -2797,6 +3690,7 @@
2797
3690
  --ui-surface-level: 8;
2798
3691
  --ui-surface-color: var(--ui-local-surface-8);
2799
3692
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3693
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2800
3694
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2801
3695
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2802
3696
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2804,6 +3698,14 @@
2804
3698
  --ui-surface-separator: var(--ui-surface-edge);
2805
3699
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2806
3700
  --ui-matched-elevation: var(--ui-local-elevation-8);
3701
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3702
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3703
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3704
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3705
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3706
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3707
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3708
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2807
3709
  }
2808
3710
 
2809
3711
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2817,6 +3719,7 @@
2817
3719
  --ui-surface-level: 8;
2818
3720
  --ui-surface-color: var(--ui-local-surface-8);
2819
3721
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3722
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2820
3723
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2821
3724
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2822
3725
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2824,6 +3727,14 @@
2824
3727
  --ui-surface-separator: var(--ui-surface-edge);
2825
3728
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2826
3729
  --ui-matched-elevation: var(--ui-local-elevation-8);
3730
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3731
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3732
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3733
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3734
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3735
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3736
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3737
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2827
3738
  }
2828
3739
 
2829
3740
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {
@@ -2837,6 +3748,7 @@
2837
3748
  --ui-surface-level: 8;
2838
3749
  --ui-surface-color: var(--ui-local-surface-8);
2839
3750
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3751
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2840
3752
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2841
3753
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2842
3754
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2844,6 +3756,14 @@
2844
3756
  --ui-surface-separator: var(--ui-surface-edge);
2845
3757
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2846
3758
  --ui-matched-elevation: var(--ui-local-elevation-8);
3759
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3760
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3761
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3762
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3763
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3764
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3765
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3766
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2847
3767
  }
2848
3768
 
2849
3769
  :where([data-ui-surface="+1"]:not([data-ui-semantic-surface])) {
@@ -2857,6 +3777,7 @@
2857
3777
  --ui-surface-level: 8;
2858
3778
  --ui-surface-color: var(--ui-local-surface-8);
2859
3779
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3780
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2860
3781
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2861
3782
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2862
3783
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2864,6 +3785,14 @@
2864
3785
  --ui-surface-separator: var(--ui-surface-edge);
2865
3786
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2866
3787
  --ui-matched-elevation: var(--ui-local-elevation-8);
3788
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3789
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3790
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3791
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3792
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3793
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3794
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3795
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2867
3796
  }
2868
3797
 
2869
3798
  :where([data-ui-surface="+2"]:not([data-ui-semantic-surface])) {
@@ -2877,6 +3806,7 @@
2877
3806
  --ui-surface-level: 8;
2878
3807
  --ui-surface-color: var(--ui-local-surface-8);
2879
3808
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3809
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2880
3810
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2881
3811
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2882
3812
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2884,6 +3814,14 @@
2884
3814
  --ui-surface-separator: var(--ui-surface-edge);
2885
3815
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2886
3816
  --ui-matched-elevation: var(--ui-local-elevation-8);
3817
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3818
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3819
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3820
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3821
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3822
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3823
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3824
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2887
3825
  }
2888
3826
 
2889
3827
  :where([data-ui-surface="+3"]:not([data-ui-semantic-surface])) {
@@ -2897,6 +3835,7 @@
2897
3835
  --ui-surface-level: 8;
2898
3836
  --ui-surface-color: var(--ui-local-surface-8);
2899
3837
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3838
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2900
3839
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2901
3840
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2902
3841
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2904,6 +3843,14 @@
2904
3843
  --ui-surface-separator: var(--ui-surface-edge);
2905
3844
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2906
3845
  --ui-matched-elevation: var(--ui-local-elevation-8);
3846
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3847
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3848
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3849
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3850
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3851
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3852
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3853
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2907
3854
  }
2908
3855
 
2909
3856
  :where([data-ui-surface="+4"]:not([data-ui-semantic-surface])) {
@@ -2917,6 +3864,7 @@
2917
3864
  --ui-surface-level: 8;
2918
3865
  --ui-surface-color: var(--ui-local-surface-8);
2919
3866
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3867
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2920
3868
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2921
3869
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2922
3870
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2924,6 +3872,14 @@
2924
3872
  --ui-surface-separator: var(--ui-surface-edge);
2925
3873
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2926
3874
  --ui-matched-elevation: var(--ui-local-elevation-8);
3875
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3876
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3877
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3878
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3879
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3880
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3881
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3882
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2927
3883
  }
2928
3884
 
2929
3885
  :where([data-ui-surface="+5"]:not([data-ui-semantic-surface])) {
@@ -2937,6 +3893,7 @@
2937
3893
  --ui-surface-level: 8;
2938
3894
  --ui-surface-color: var(--ui-local-surface-8);
2939
3895
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3896
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2940
3897
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2941
3898
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2942
3899
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2944,6 +3901,14 @@
2944
3901
  --ui-surface-separator: var(--ui-surface-edge);
2945
3902
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2946
3903
  --ui-matched-elevation: var(--ui-local-elevation-8);
3904
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3905
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3906
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3907
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3908
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3909
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3910
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3911
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2947
3912
  }
2948
3913
 
2949
3914
  :where([data-ui-surface="+6"]:not([data-ui-semantic-surface])) {
@@ -2957,6 +3922,7 @@
2957
3922
  --ui-surface-level: 8;
2958
3923
  --ui-surface-color: var(--ui-local-surface-8);
2959
3924
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3925
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2960
3926
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2961
3927
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2962
3928
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2964,6 +3930,14 @@
2964
3930
  --ui-surface-separator: var(--ui-surface-edge);
2965
3931
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2966
3932
  --ui-matched-elevation: var(--ui-local-elevation-8);
3933
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3934
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3935
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3936
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3937
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3938
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3939
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3940
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2967
3941
  }
2968
3942
 
2969
3943
  :where([data-ui-surface="+7"]:not([data-ui-semantic-surface])) {
@@ -2977,6 +3951,7 @@
2977
3951
  --ui-surface-level: 8;
2978
3952
  --ui-surface-color: var(--ui-local-surface-8);
2979
3953
  --ui-surface-ink: var(--ui-local-surface-8-ink);
3954
+ --ui-surface-ink-subtle: var(--ui-local-surface-8-ink-subtle);
2980
3955
  --ui-surface-ink-muted: var(--ui-local-surface-8-ink-muted);
2981
3956
  --ui-surface-edge: var(--ui-local-surface-8-edge);
2982
3957
  --ui-surface-edge-hover: var(--ui-local-surface-8-edge-hover);
@@ -2984,6 +3959,14 @@
2984
3959
  --ui-surface-separator: var(--ui-surface-edge);
2985
3960
  --ui-surface-separator-muted: color-mix(in oklab, var(--ui-surface-edge) 60%, transparent);
2986
3961
  --ui-matched-elevation: var(--ui-local-elevation-8);
3962
+ --ui-relative-elevation-1: var(--ui-local-elevation-8);
3963
+ --ui-relative-elevation-2: var(--ui-local-elevation-8);
3964
+ --ui-relative-elevation-3: var(--ui-local-elevation-8);
3965
+ --ui-relative-elevation-4: var(--ui-local-elevation-8);
3966
+ --ui-relative-elevation-5: var(--ui-local-elevation-8);
3967
+ --ui-relative-elevation-6: var(--ui-local-elevation-8);
3968
+ --ui-relative-elevation-7: var(--ui-local-elevation-8);
3969
+ --ui-relative-elevation-8: var(--ui-local-elevation-8);
2987
3970
  }
2988
3971
 
2989
3972
  :where([data-ui-surface="+8"]:not([data-ui-semantic-surface])) {