@threadlabs/looma 0.5.2 → 0.6.0-rc.1

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 (174) hide show
  1. package/components/shared/overlay.js +3 -0
  2. package/components/ui-button/ui-button.html +14 -14
  3. package/components/ui-callout/ui-callout.html +1 -1
  4. package/components/ui-checkbox/ui-checkbox.html +1 -1
  5. package/components/ui-cluster/ui-cluster.html +6 -6
  6. package/components/ui-combobox/ui-combobox.html +23 -23
  7. package/components/ui-container/ui-container.html +4 -4
  8. package/components/ui-context-menu/ui-context-menu.html +2 -2
  9. package/components/ui-dialog/ui-dialog.html +12 -12
  10. package/components/ui-disclosure/ui-disclosure.html +19 -4
  11. package/components/ui-editable/ui-editable.html +6 -6
  12. package/components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.html +20 -20
  13. package/components/ui-editor-mention-menu/ui-editor-mention-menu.html +25 -25
  14. package/components/ui-editor-slash-menu/ui-editor-slash-menu.html +39 -39
  15. package/components/ui-editor-table-context-menu/ui-editor-table-context-menu.html +20 -20
  16. package/components/ui-editor-table-overlay/ui-editor-table-overlay.html +48 -48
  17. package/components/ui-editor-table-toolbar/ui-editor-table-toolbar.html +34 -34
  18. package/components/ui-editor-toolbar/ui-editor-toolbar.html +9 -9
  19. package/components/ui-floating-action-button/ui-floating-action-button.html +16 -22
  20. package/components/ui-grid/ui-grid.html +6 -6
  21. package/components/ui-icon-button/ui-icon-button.html +42 -38
  22. package/components/ui-input/ui-input.html +2 -2
  23. package/components/ui-menu/ui-menu.html +15 -4
  24. package/components/ui-menu-item/ui-menu-item.html +5 -5
  25. package/components/ui-popover/ui-popover.html +3 -3
  26. package/components/ui-reel/ui-reel.html +6 -6
  27. package/components/ui-search-result-row/ui-search-result-row.html +9 -9
  28. package/components/ui-search-shell/ui-search-shell.html +3 -3
  29. package/components/ui-select/ui-select.html +2 -2
  30. package/components/ui-sidebar/ui-sidebar.html +11 -11
  31. package/components/ui-stack/ui-stack.html +6 -6
  32. package/components/ui-switcher/ui-switcher.html +6 -6
  33. package/components/ui-tabs/ui-tabs.html +18 -4
  34. package/components/ui-textarea/ui-textarea.html +2 -2
  35. package/components/ui-toast-region/ui-toast-region.html +2 -2
  36. package/components/ui-tooltip/ui-tooltip.html +1 -1
  37. package/components/ui-top-bar/ui-top-bar.html +5 -5
  38. package/components/ui-tree/ui-tree.html +7 -0
  39. package/components/ui-tree-item/ui-tree-item.html +15 -7
  40. package/dist/index.js +1 -1
  41. package/package.json +1 -1
  42. package/styles/ui-button.css +14 -14
  43. package/styles/ui-callout.css +1 -1
  44. package/styles/ui-checkbox.css +1 -1
  45. package/styles/ui-cluster.css +6 -6
  46. package/styles/ui-combobox.css +23 -23
  47. package/styles/ui-container.css +4 -4
  48. package/styles/ui-context-menu.css +2 -2
  49. package/styles/ui-dialog.css +12 -12
  50. package/styles/ui-disclosure.css +22 -6
  51. package/styles/ui-editable.css +6 -6
  52. package/styles/ui-editor-insert-table-grid.css +20 -20
  53. package/styles/ui-editor-mention-menu.css +25 -25
  54. package/styles/ui-editor-slash-menu.css +39 -39
  55. package/styles/ui-editor-table-context-menu.css +20 -20
  56. package/styles/ui-editor-table-overlay.css +48 -48
  57. package/styles/ui-editor-table-toolbar.css +34 -34
  58. package/styles/ui-editor-toolbar.css +9 -9
  59. package/styles/ui-floating-action-button.css +16 -22
  60. package/styles/ui-grid.css +6 -6
  61. package/styles/ui-icon-button.css +42 -38
  62. package/styles/ui-input.css +2 -2
  63. package/styles/ui-menu-item.css +5 -5
  64. package/styles/ui-menu.css +18 -6
  65. package/styles/ui-popover.css +3 -3
  66. package/styles/ui-reel.css +6 -6
  67. package/styles/ui-search-result-row.css +9 -9
  68. package/styles/ui-search-shell.css +3 -3
  69. package/styles/ui-select.css +2 -2
  70. package/styles/ui-sidebar.css +11 -11
  71. package/styles/ui-stack.css +6 -6
  72. package/styles/ui-switcher.css +6 -6
  73. package/styles/ui-tabs.css +20 -6
  74. package/styles/ui-textarea.css +2 -2
  75. package/styles/ui-toast-region.css +2 -2
  76. package/styles/ui-tooltip.css +1 -1
  77. package/styles/ui-top-bar.css +5 -5
  78. package/styles/ui-tree-item.css +21 -8
  79. package/styles/ui-tree.css +7 -1
  80. package/theme-dark.css +42 -103
  81. package/theme-high-contrast.css +18 -22
  82. package/theme-light.css +15 -41
  83. package/tokens.css +149 -201
  84. package/vanilla/UiDisclosure.d.ts +1 -0
  85. package/vanilla/UiDisclosure.js +1 -1
  86. package/vanilla/UiMenu.d.ts +1 -0
  87. package/vanilla/UiMenu.js +1 -1
  88. package/vanilla/UiTabs.d.ts +1 -0
  89. package/vanilla/UiTabs.js +1 -1
  90. package/vanilla/UiTree.d.ts +1 -0
  91. package/vanilla/UiTree.js +1 -1
  92. package/vue/UiButton.vue +20 -14
  93. package/vue/UiCallout.vue +1 -1
  94. package/vue/UiCheckbox.vue +1 -1
  95. package/vue/UiCluster.vue +6 -6
  96. package/vue/UiCombobox.vue +23 -23
  97. package/vue/UiContainer.vue +4 -4
  98. package/vue/UiContextMenu.vue +2 -2
  99. package/vue/UiDialog.vue +12 -12
  100. package/vue/UiDisclosure.d.ts +2 -0
  101. package/vue/UiDisclosure.vue +21 -4
  102. package/vue/UiEditable.vue +6 -6
  103. package/vue/UiEditorInsertTableGrid.vue +20 -20
  104. package/vue/UiEditorMentionMenu.vue +25 -25
  105. package/vue/UiEditorSlashMenu.vue +39 -39
  106. package/vue/UiEditorTableContextMenu.vue +20 -20
  107. package/vue/UiEditorTableOverlay.vue +48 -57
  108. package/vue/UiEditorTableToolbar.vue +34 -34
  109. package/vue/UiEditorToolbar.vue +9 -9
  110. package/vue/UiFloatingActionButton.vue +17 -22
  111. package/vue/UiGrid.vue +6 -6
  112. package/vue/UiIconButton.vue +46 -42
  113. package/vue/UiInput.vue +2 -2
  114. package/vue/UiMenu.d.ts +2 -0
  115. package/vue/UiMenu.vue +17 -7
  116. package/vue/UiMenuItem.vue +6 -5
  117. package/vue/UiPopover.vue +3 -3
  118. package/vue/UiReel.vue +6 -6
  119. package/vue/UiSearchResultRow.vue +10 -13
  120. package/vue/UiSearchShell.vue +3 -3
  121. package/vue/UiSelect.vue +2 -2
  122. package/vue/UiSidebar.vue +11 -16
  123. package/vue/UiStack.vue +6 -6
  124. package/vue/UiSwitcher.vue +6 -6
  125. package/vue/UiTabs.d.ts +2 -0
  126. package/vue/UiTabs.vue +21 -4
  127. package/vue/UiTextarea.vue +2 -2
  128. package/vue/UiToastRegion.vue +2 -2
  129. package/vue/UiTooltip.vue +1 -1
  130. package/vue/UiTopBar.vue +5 -5
  131. package/vue/UiTree.d.ts +2 -0
  132. package/vue/UiTree.vue +24 -1
  133. package/vue/UiTreeItem.vue +16 -8
  134. package/vue/chunks/UiButton.js +1 -1
  135. package/vue/chunks/UiCallout.js +1 -1
  136. package/vue/chunks/UiCheckbox.js +1 -1
  137. package/vue/chunks/UiCluster.js +1 -1
  138. package/vue/chunks/UiCombobox.js +1 -1
  139. package/vue/chunks/UiContainer.js +1 -1
  140. package/vue/chunks/UiContextMenu.js +1 -1
  141. package/vue/chunks/UiDialog.js +1 -1
  142. package/vue/chunks/UiDisclosure.js +3 -2
  143. package/vue/chunks/UiEditable.js +1 -1
  144. package/vue/chunks/UiEditorInsertTableGrid.js +1 -1
  145. package/vue/chunks/UiEditorMentionMenu.js +1 -1
  146. package/vue/chunks/UiEditorSlashMenu.js +1 -1
  147. package/vue/chunks/UiEditorTableContextMenu.js +1 -1
  148. package/vue/chunks/UiEditorTableOverlay.js +1 -1
  149. package/vue/chunks/UiEditorTableToolbar.js +1 -1
  150. package/vue/chunks/UiEditorToolbar.js +1 -1
  151. package/vue/chunks/UiFloatingActionButton.js +1 -1
  152. package/vue/chunks/UiGrid.js +1 -1
  153. package/vue/chunks/UiIconButton.js +1 -1
  154. package/vue/chunks/UiInput.js +1 -1
  155. package/vue/chunks/UiMenu.js +3 -2
  156. package/vue/chunks/UiMenuItem.js +1 -1
  157. package/vue/chunks/UiPopover.js +1 -1
  158. package/vue/chunks/UiReel.js +1 -1
  159. package/vue/chunks/UiSearchResultRow.js +1 -1
  160. package/vue/chunks/UiSearchShell.js +1 -1
  161. package/vue/chunks/UiSelect.js +1 -1
  162. package/vue/chunks/UiSidebar.js +1 -1
  163. package/vue/chunks/UiStack.js +1 -1
  164. package/vue/chunks/UiSwitcher.js +1 -1
  165. package/vue/chunks/UiTabs.js +7 -2
  166. package/vue/chunks/UiTextarea.js +1 -1
  167. package/vue/chunks/UiToastRegion.js +1 -1
  168. package/vue/chunks/UiTooltip.js +1 -1
  169. package/vue/chunks/UiTopBar.js +1 -1
  170. package/vue/chunks/UiTree.js +8 -2
  171. package/vue/chunks/UiTreeItem.js +1 -1
  172. package/vue/components.css +1082 -1048
  173. package/vue/editor/LoomaEditor.d.ts +11 -0
  174. package/vue/editor/index.js +9 -0
@@ -172,36 +172,36 @@
172
172
  display: none;
173
173
  }
174
174
 
175
- [data-component~="ui-button"][data-v-44d2f337] {
175
+ [data-component~="ui-button"][data-v-d0355403] {
176
176
  display: inline-flex;
177
177
  align-items: center;
178
178
  justify-content: center;
179
179
  vertical-align: middle;
180
180
  color: var(--ui-action-secondary-text, var(--ui-text-primary));
181
181
  }
182
- [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-44d2f337] {
182
+ [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-d0355403] {
183
183
  color: var(--ui-action-primary-text, var(--ui-text-on-accent));
184
184
  }
185
- [data-component~="ui-button"][data-ui-button-state~="align=start"][data-v-44d2f337] {
185
+ [data-component~="ui-button"][data-ui-button-state~="align=start"][data-v-d0355403] {
186
186
  justify-content: flex-start;
187
187
  text-align: start;
188
188
  }
189
- [data-component~="ui-button"][data-ui-button-state~="stretch"][data-v-44d2f337] {
189
+ [data-component~="ui-button"][data-ui-button-state~="stretch"][data-v-d0355403] {
190
190
  display: flex;
191
191
  inline-size: 100%;
192
192
  }
193
- [data-component~="ui-button"][data-v-44d2f337] {
193
+ [data-component~="ui-button"][data-v-d0355403] {
194
194
  appearance: none;
195
- min-block-size: var(--ui-button-min-block-size, var(--ui-control-size-md, 2.5rem));
195
+ min-block-size: var(--ui-button-min-block-size, var(--ui-control-size-md));
196
196
  border: 1px solid var(--ui-button-border, var(--ui-border-strong));
197
- border-radius: var(--ui-button-radius, var(--ui-radius-2));
197
+ border-radius: var(--ui-button-radius, var(--ui-radius-md));
198
198
  background: var(--ui-button-surface, var(--ui-surface-elevated));
199
199
  color: var(--ui-button-text, var(--ui-action-secondary-text, var(--ui-text-primary)));
200
200
  font: inherit;
201
- font-weight: var(--ui-font-medium, 500);
201
+ font-weight: var(--ui-font-medium);
202
202
  line-height: var(--ui-line-height-tight);
203
203
  padding: var(--ui-space-2) var(--ui-space-3);
204
- background-image: var(--ui-raised-highlight, none);
204
+ background-image: var(--ui-raised-highlight);
205
205
  box-shadow: var(--ui-button-shadow, var(--ui-raised, var(--ui-shadow-xs)));
206
206
  cursor: pointer;
207
207
  transition:
@@ -213,29 +213,29 @@
213
213
  margin: 0;
214
214
  }
215
215
  @supports (text-box-trim: trim-both) {
216
- [data-component~="ui-button"][data-v-44d2f337] {
216
+ [data-component~="ui-button"][data-v-d0355403] {
217
217
  text-box-trim: trim-both;
218
218
  text-box-edge: cap alphabetic;
219
219
  }
220
220
  }
221
- [data-component~="ui-button"][data-ui-button-state~="size=sm"][data-v-44d2f337] {
222
- min-block-size: var(--ui-control-size-sm, 2rem);
221
+ [data-component~="ui-button"][data-ui-button-state~="size=sm"][data-v-d0355403] {
222
+ min-block-size: var(--ui-control-size-sm);
223
223
  padding: var(--ui-space-1) var(--ui-space-2);
224
224
  font-size: 0.875rem;
225
225
  }
226
- [data-component~="ui-button"][data-ui-button-state~="size=lg"][data-v-44d2f337] {
227
- min-block-size: var(--ui-control-size-lg, 3rem);
226
+ [data-component~="ui-button"][data-ui-button-state~="size=lg"][data-v-d0355403] {
227
+ min-block-size: var(--ui-control-size-lg);
228
228
  padding: var(--ui-space-3) var(--ui-space-4);
229
229
  font-size: 1rem;
230
230
  }
231
- [data-component~="ui-button"][data-v-44d2f337]:hover:enabled {
231
+ [data-component~="ui-button"][data-v-d0355403]:hover:enabled {
232
232
  background: var(--ui-action-secondary-surface-hover, var(--ui-surface-muted));
233
233
  border-color: var(--ui-control-border-hover, var(--ui-border-strong));
234
234
  }
235
- [data-component~="ui-button"][data-v-44d2f337]:active:enabled {
235
+ [data-component~="ui-button"][data-v-d0355403]:active:enabled {
236
236
  background: var(--ui-surface-subtle);
237
237
  }
238
- [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-44d2f337] {
238
+ [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-d0355403] {
239
239
  border-color: var(--ui-action-primary-surface, var(--ui-accent-solid));
240
240
  background: var(--ui-action-primary-surface, var(--ui-accent-solid));
241
241
  color: var(--ui-action-primary-text, var(--ui-text-on-accent));
@@ -245,19 +245,19 @@
245
245
  var(--ui-shadow-xs)
246
246
  );
247
247
  }
248
- [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-44d2f337]:hover:enabled {
248
+ [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-d0355403]:hover:enabled {
249
249
  background: var(--ui-action-primary-surface-hover, var(--ui-accent-hover));
250
250
  border-color: var(--ui-action-primary-surface-hover, var(--ui-accent-hover));
251
251
  box-shadow: var(--ui-shadow-sm);
252
252
  transform: translateY(-1px);
253
253
  }
254
- [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-44d2f337]:active:enabled {
254
+ [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-d0355403]:active:enabled {
255
255
  background: var(--ui-action-primary-surface-active, var(--ui-accent-active));
256
256
  border-color: var(--ui-action-primary-surface-active, var(--ui-accent-active));
257
257
  box-shadow: none;
258
258
  transform: translateY(0);
259
259
  }
260
- [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-44d2f337] {
260
+ [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-d0355403] {
261
261
  border-color: var(--ui-danger-solid);
262
262
  background: var(--ui-danger-solid);
263
263
  color: var(--ui-text-on-accent);
@@ -267,17 +267,17 @@
267
267
  var(--ui-shadow-xs)
268
268
  );
269
269
  }
270
- [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-44d2f337]:hover:enabled {
270
+ [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-d0355403]:hover:enabled {
271
271
  background: var(--ui-danger-hover);
272
272
  border-color: var(--ui-danger-hover);
273
273
  box-shadow: var(--ui-shadow-sm);
274
274
  transform: translateY(-1px);
275
275
  }
276
- [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-44d2f337]:active:enabled {
276
+ [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-d0355403]:active:enabled {
277
277
  box-shadow: none;
278
278
  transform: translateY(0);
279
279
  }
280
- [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-44d2f337] {
280
+ [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-d0355403] {
281
281
  border-color: transparent;
282
282
  background: transparent;
283
283
  box-shadow: none;
@@ -285,30 +285,36 @@
285
285
  }
286
286
 
287
287
  /* Tints derive from the text colour, not a surface token, so hover and press show on any background. */
288
- [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-44d2f337]:hover:enabled {
289
- background: var(--ui-button-ghost-hover, color-mix(in srgb, currentColor 8%, transparent));
288
+ [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-d0355403]:hover:enabled {
289
+ background: var(
290
+ --ui-button-ghost-hover-surface,
291
+ color-mix(in srgb, currentColor 8%, transparent)
292
+ );
290
293
  border-color: transparent;
291
294
  }
292
- [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-44d2f337]:active:enabled {
293
- background: var(--ui-button-ghost-active, color-mix(in srgb, currentColor 14%, transparent));
295
+ [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-d0355403]:active:enabled {
296
+ background: var(
297
+ --ui-button-ghost-active-surface,
298
+ color-mix(in srgb, currentColor 14%, transparent)
299
+ );
294
300
  border-color: transparent;
295
301
  }
296
302
 
297
303
  /* A soft halo that transitions in with the other box-shadow changes, layered on the raised shadow. */
298
- [data-component~="ui-button"][data-v-44d2f337]:focus-visible {
304
+ [data-component~="ui-button"][data-v-d0355403]:focus-visible {
299
305
  outline: none;
300
306
  box-shadow:
301
307
  var(--ui-button-shadow, var(--ui-raised, var(--ui-shadow-xs))),
302
308
  var(--ui-focus-halo);
303
309
  }
304
- [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-44d2f337]:focus-visible {
310
+ [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-d0355403]:focus-visible {
305
311
  box-shadow:
306
312
  var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs)),
307
313
  var(--ui-focus-halo);
308
314
  }
309
315
 
310
316
  /* Disabled colours fall back to each variant's own; ghost and link take only the text colour. */
311
- [data-component~="ui-button"][data-v-44d2f337]:disabled {
317
+ [data-component~="ui-button"][data-v-d0355403]:disabled {
312
318
  opacity: var(--ui-button-disabled-opacity, 0.6);
313
319
  cursor: not-allowed;
314
320
  border-color: var(--ui-button-disabled-border, var(--ui-button-border, var(--ui-border-strong)));
@@ -321,7 +327,7 @@
321
327
  var(--ui-button-text, var(--ui-action-secondary-text, var(--ui-text-primary)))
322
328
  );
323
329
  }
324
- [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-44d2f337]:disabled {
330
+ [data-component~="ui-button"][data-ui-button-state~="variant=solid"][data-v-d0355403]:disabled {
325
331
  border-color: var(
326
332
  --ui-button-disabled-border,
327
333
  var(--ui-action-primary-surface, var(--ui-accent-solid))
@@ -332,12 +338,12 @@
332
338
  );
333
339
  color: var(--ui-button-disabled-text, var(--ui-action-primary-text, var(--ui-text-on-accent)));
334
340
  }
335
- [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-44d2f337]:disabled {
341
+ [data-component~="ui-button"][data-ui-button-state~="variant=danger"][data-v-d0355403]:disabled {
336
342
  border-color: var(--ui-button-disabled-border, var(--ui-danger-solid));
337
343
  background-color: var(--ui-button-disabled-surface, var(--ui-danger-solid));
338
344
  color: var(--ui-button-disabled-text, var(--ui-text-on-accent));
339
345
  }
340
- [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-44d2f337]:disabled {
346
+ [data-component~="ui-button"][data-ui-button-state~="variant=ghost"][data-v-d0355403]:disabled {
341
347
  border-color: transparent;
342
348
  background-color: transparent;
343
349
  color: var(
@@ -346,23 +352,23 @@
346
352
  );
347
353
  }
348
354
  @media (pointer: coarse) {
349
- [data-component~="ui-button"][data-v-44d2f337] {
350
- min-block-size: var(--ui-control-min-block-size, 2.75rem);
355
+ [data-component~="ui-button"][data-v-d0355403] {
356
+ min-block-size: var(--ui-control-min-block-size);
351
357
  }
352
358
  }
353
359
 
354
360
  /* Link: an inline text action. No box, padding, or minimum height (inline targets are exempt under
355
361
  WCAG 2.5.8); the inherited font; an underline that strengthens on hover; a visible focus ring. */
356
- [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-44d2f337] {
362
+ [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-d0355403] {
357
363
  display: inline;
358
364
  min-block-size: 0;
359
365
  padding: 0;
360
366
  border: 0;
361
- border-radius: var(--ui-radius-sm, 4px);
367
+ border-radius: var(--ui-radius-sm);
362
368
  background: none;
363
369
  box-shadow: none;
364
370
  font: inherit;
365
- color: var(--ui-button-link-color, var(--ui-text-secondary));
371
+ color: var(--ui-button-link-text, var(--ui-text-secondary));
366
372
  text-decoration-line: underline;
367
373
  text-decoration-thickness: 1px;
368
374
  text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
@@ -371,33 +377,33 @@
371
377
  color var(--ui-motion-fast) var(--ui-motion-ease),
372
378
  text-decoration-color var(--ui-motion-fast) var(--ui-motion-ease);
373
379
  }
374
- [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-44d2f337]:hover:enabled {
375
- color: var(--ui-button-link-hover-color, var(--ui-text-primary));
380
+ [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-d0355403]:hover:enabled {
381
+ color: var(--ui-button-link-hover-text, var(--ui-text-primary));
376
382
  text-decoration-color: currentColor;
377
383
  background: none;
378
384
  transform: none;
379
385
  }
380
- [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-44d2f337]:active:enabled {
386
+ [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-d0355403]:active:enabled {
381
387
  background: none;
382
388
  transform: none;
383
389
  }
384
- [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-44d2f337]:disabled {
390
+ [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-d0355403]:disabled {
385
391
  background: none;
386
- color: var(--ui-button-disabled-text, var(--ui-button-link-color, var(--ui-text-secondary)));
392
+ color: var(--ui-button-disabled-text, var(--ui-button-link-text, var(--ui-text-secondary)));
387
393
  }
388
- [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-44d2f337]:focus-visible {
394
+ [data-component~="ui-button"][data-ui-button-state~="variant=link"][data-v-d0355403]:focus-visible {
389
395
  box-shadow: none;
390
396
  /* Fallback keeps the ring if the token is missing: an unresolved var() would void the outline. */
391
- outline: 2px solid var(--ui-focus-ring, currentColor);
397
+ outline: 2px solid var(--ui-focus-ring);
392
398
  outline-offset: 2px;
393
399
  }
394
400
 
395
401
  /* A component that sets its display still honours the hidden attribute on its root. */
396
- [data-component~="ui-button"][hidden][data-v-44d2f337] {
402
+ [data-component~="ui-button"][hidden][data-v-d0355403] {
397
403
  display: none;
398
404
  }
399
405
 
400
- [data-component~="ui-callout"][data-v-c6ed30ab] {
406
+ [data-component~="ui-callout"][data-v-31ee6589] {
401
407
  --_callout-surface: var(--ui-info-soft);
402
408
  --_callout-border: var(--ui-info-solid);
403
409
  --_callout-icon: var(--ui-info-solid);
@@ -413,7 +419,7 @@
413
419
  color-mix(in srgb, var(--ui-callout-border, var(--_callout-border)) 35%, transparent);
414
420
  border-inline-start: var(--ui-callout-leading-border-width, 4px) solid
415
421
  var(--ui-callout-border, var(--_callout-border));
416
- border-radius: var(--ui-radius-2);
422
+ border-radius: var(--ui-radius-md);
417
423
  background: var(--ui-callout-surface, var(--_callout-surface));
418
424
  color: var(--ui-callout-text, var(--ui-text-primary));
419
425
  font-family: var(--ui-font-family-sans);
@@ -423,47 +429,47 @@
423
429
  }
424
430
 
425
431
  /* One line box tall, so the icon centres on the first line of text. */
426
- .icon[data-v-c6ed30ab] {
432
+ .icon[data-v-31ee6589] {
427
433
  display: grid;
428
434
  place-items: center;
429
435
  inline-size: var(--ui-callout-icon-column, 1.125rem);
430
436
  block-size: 1lh;
431
437
  color: var(--ui-callout-icon, var(--_callout-icon));
432
438
  }
433
- .icon svg[data-v-c6ed30ab] {
439
+ .icon svg[data-v-31ee6589] {
434
440
  inline-size: var(--ui-callout-icon-size, 1.125rem);
435
441
  block-size: var(--ui-callout-icon-size, 1.125rem);
436
442
  }
437
- .content[data-v-c6ed30ab] {
443
+ .content[data-v-31ee6589] {
438
444
  min-inline-size: 0;
439
445
  }
440
- [data-component~="ui-callout"][data-ui-callout-state~="tone=note"][data-v-c6ed30ab] {
446
+ [data-component~="ui-callout"][data-ui-callout-state~="tone=note"][data-v-31ee6589] {
441
447
  --_callout-surface: var(--ui-surface-muted);
442
448
  --_callout-border: var(--ui-border-strong);
443
449
  --_callout-icon: var(--ui-text-secondary);
444
450
  }
445
- [data-component~="ui-callout"][data-ui-callout-state~="tone=warning"][data-v-c6ed30ab] {
451
+ [data-component~="ui-callout"][data-ui-callout-state~="tone=warning"][data-v-31ee6589] {
446
452
  --_callout-surface: var(--ui-warning-soft);
447
453
  --_callout-border: var(--ui-warning-solid);
448
454
  --_callout-icon: var(--ui-warning-solid);
449
455
  }
450
- [data-component~="ui-callout"][data-ui-callout-state~="tone=success"][data-v-c6ed30ab] {
456
+ [data-component~="ui-callout"][data-ui-callout-state~="tone=success"][data-v-31ee6589] {
451
457
  --_callout-surface: var(--ui-success-soft);
452
458
  --_callout-border: var(--ui-success-solid);
453
459
  --_callout-icon: var(--ui-success-solid);
454
460
  }
455
- [data-component~="ui-callout"][data-ui-callout-state~="tone=danger"][data-v-c6ed30ab] {
461
+ [data-component~="ui-callout"][data-ui-callout-state~="tone=danger"][data-v-31ee6589] {
456
462
  --_callout-surface: var(--ui-danger-soft);
457
463
  --_callout-border: var(--ui-danger-solid);
458
464
  --_callout-icon: var(--ui-danger-solid);
459
465
  }
460
466
 
461
467
  /* A component that sets its display still honours the hidden attribute on its root. */
462
- [data-component~="ui-callout"][hidden][data-v-c6ed30ab] {
468
+ [data-component~="ui-callout"][hidden][data-v-31ee6589] {
463
469
  display: none;
464
470
  }
465
471
 
466
- [data-component~="ui-checkbox"][data-v-1e598fdb] {
472
+ [data-component~="ui-checkbox"][data-v-acf71232] {
467
473
  display: inline-flex;
468
474
  align-items: flex-start;
469
475
  gap: var(--ui-checkbox-gap, var(--ui-space-2));
@@ -471,11 +477,11 @@
471
477
  color: var(--ui-text-primary);
472
478
  cursor: pointer;
473
479
  }
474
- .label[data-v-1e598fdb] {
480
+ .label[data-v-acf71232] {
475
481
  min-inline-size: 0;
476
482
  line-height: var(--ui-line-height-md);
477
483
  }
478
- input[data-v-1e598fdb] {
484
+ input[data-v-acf71232] {
479
485
  appearance: none;
480
486
  -webkit-appearance: none;
481
487
  position: relative;
@@ -484,7 +490,7 @@ input[data-v-1e598fdb] {
484
490
  block-size: var(--ui-checkbox-size, 1.125rem);
485
491
  margin: 0.125em 0 0;
486
492
  border: 1px solid var(--ui-control-border-hover, var(--ui-border-strong));
487
- border-radius: var(--ui-radius-1);
493
+ border-radius: var(--ui-radius-sm);
488
494
  background: var(--ui-control-surface, var(--ui-surface-default));
489
495
  box-shadow: inset 0 1px 2px color-mix(in srgb, var(--ui-text-primary) 8%, transparent);
490
496
  cursor: pointer;
@@ -493,20 +499,20 @@ input[data-v-1e598fdb] {
493
499
  border-color var(--ui-motion-fast) var(--ui-motion-ease),
494
500
  box-shadow var(--ui-motion-fast) var(--ui-motion-ease);
495
501
  }
496
- input[data-v-1e598fdb]::after {
502
+ input[data-v-acf71232]::after {
497
503
  content: "";
498
504
  position: absolute;
499
505
  opacity: 0;
500
506
  }
501
- input[data-v-1e598fdb]:checked,
502
- input[data-v-1e598fdb]:indeterminate {
507
+ input[data-v-acf71232]:checked,
508
+ input[data-v-acf71232]:indeterminate {
503
509
  border-color: var(--ui-accent-solid);
504
510
  background: var(--ui-accent-solid);
505
511
  box-shadow: inset 0 1px 2px color-mix(in srgb, #000 16%, transparent);
506
512
  }
507
513
 
508
514
  /* Centre the tick's box, then lift it: a rotated L's ink sits ~0.11rem below its box centre. */
509
- input[data-v-1e598fdb]:checked::after {
515
+ input[data-v-acf71232]:checked::after {
510
516
  inset: 0;
511
517
  margin: auto;
512
518
  inline-size: 0.32rem;
@@ -516,7 +522,7 @@ input[data-v-1e598fdb]:checked::after {
516
522
  opacity: 1;
517
523
  transform: translateY(-0.11rem) rotate(45deg);
518
524
  }
519
- input[data-v-1e598fdb]:indeterminate::after {
525
+ input[data-v-acf71232]:indeterminate::after {
520
526
  inset: 50% 0.23rem auto;
521
527
  block-size: 0.125rem;
522
528
  border-radius: var(--ui-radius-round);
@@ -524,30 +530,30 @@ input[data-v-1e598fdb]:indeterminate::after {
524
530
  opacity: 1;
525
531
  transform: translateY(-50%);
526
532
  }
527
- input[data-v-1e598fdb]:hover:enabled {
533
+ input[data-v-acf71232]:hover:enabled {
528
534
  border-color: var(--ui-accent-solid);
529
535
  }
530
- input[data-v-1e598fdb]:focus-visible {
536
+ input[data-v-acf71232]:focus-visible {
531
537
  outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));
532
538
  outline-offset: 2px;
533
539
  }
534
- [data-component~="ui-checkbox"][data-ui-checkbox-state~="disabled"][data-v-1e598fdb] {
540
+ [data-component~="ui-checkbox"][data-ui-checkbox-state~="disabled"][data-v-acf71232] {
535
541
  color: var(--ui-text-muted);
536
542
  cursor: not-allowed;
537
543
  }
538
- [data-component~="ui-checkbox"][data-ui-checkbox-state~="disabled"] input[data-v-1e598fdb] {
544
+ [data-component~="ui-checkbox"][data-ui-checkbox-state~="disabled"] input[data-v-acf71232] {
539
545
  border-color: var(--ui-border-default);
540
546
  background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
541
547
  cursor: not-allowed;
542
548
  }
543
549
 
544
550
  /* A component that sets its display still honours the hidden attribute on its root. */
545
- [data-component~="ui-checkbox"][hidden][data-v-1e598fdb] {
551
+ [data-component~="ui-checkbox"][hidden][data-v-acf71232] {
546
552
  display: none;
547
553
  }
548
554
 
549
- [data-component~="ui-cluster"][data-v-2a9e690c] {
550
- --_layout-gap: var(--ui-space-3, 0.75rem);
555
+ [data-component~="ui-cluster"][data-v-06d4310a] {
556
+ --_layout-gap: var(--ui-space-3);
551
557
  display: flex;
552
558
  flex-wrap: wrap;
553
559
  align-items: center;
@@ -556,37 +562,37 @@ input[data-v-1e598fdb]:focus-visible {
556
562
  max-inline-size: 100%;
557
563
  margin: 0;
558
564
  }
559
- [data-component~="ui-cluster"][data-ui-cluster-state~="gap=xs"][data-v-2a9e690c] {
560
- --_layout-gap: var(--ui-space-2, 0.5rem);
565
+ [data-component~="ui-cluster"][data-ui-cluster-state~="gap=xs"][data-v-06d4310a] {
566
+ --_layout-gap: var(--ui-space-2);
561
567
  }
562
- [data-component~="ui-cluster"][data-ui-cluster-state~="gap=s"][data-v-2a9e690c] {
563
- --_layout-gap: var(--ui-space-3, 0.75rem);
568
+ [data-component~="ui-cluster"][data-ui-cluster-state~="gap=s"][data-v-06d4310a] {
569
+ --_layout-gap: var(--ui-space-3);
564
570
  }
565
- [data-component~="ui-cluster"][data-ui-cluster-state~="gap=m"][data-v-2a9e690c] {
566
- --_layout-gap: var(--ui-space-4, 1rem);
571
+ [data-component~="ui-cluster"][data-ui-cluster-state~="gap=m"][data-v-06d4310a] {
572
+ --_layout-gap: var(--ui-space-4);
567
573
  }
568
- [data-component~="ui-cluster"][data-ui-cluster-state~="gap=l"][data-v-2a9e690c] {
569
- --_layout-gap: var(--ui-space-5, 1.5rem);
574
+ [data-component~="ui-cluster"][data-ui-cluster-state~="gap=l"][data-v-06d4310a] {
575
+ --_layout-gap: var(--ui-space-5);
570
576
  }
571
- [data-component~="ui-cluster"][data-ui-cluster-state~="gap=xl"][data-v-2a9e690c] {
572
- --_layout-gap: var(--ui-space-6, 2rem);
577
+ [data-component~="ui-cluster"][data-ui-cluster-state~="gap=xl"][data-v-06d4310a] {
578
+ --_layout-gap: var(--ui-space-6);
573
579
  }
574
- [data-component~="ui-cluster"][data-ui-cluster-state~="align=start"][data-v-2a9e690c] {
580
+ [data-component~="ui-cluster"][data-ui-cluster-state~="align=start"][data-v-06d4310a] {
575
581
  align-items: flex-start;
576
582
  }
577
- [data-component~="ui-cluster"][data-ui-cluster-state~="align=end"][data-v-2a9e690c] {
583
+ [data-component~="ui-cluster"][data-ui-cluster-state~="align=end"][data-v-06d4310a] {
578
584
  align-items: flex-end;
579
585
  }
580
- [data-component~="ui-cluster"][data-ui-cluster-state~="align=stretch"][data-v-2a9e690c] {
586
+ [data-component~="ui-cluster"][data-ui-cluster-state~="align=stretch"][data-v-06d4310a] {
581
587
  align-items: stretch;
582
588
  }
583
589
 
584
590
  /* A component that sets its display still honours the hidden attribute on its root. */
585
- [data-component~="ui-cluster"][hidden][data-v-2a9e690c] {
591
+ [data-component~="ui-cluster"][hidden][data-v-06d4310a] {
586
592
  display: none;
587
593
  }
588
594
 
589
- [data-component~="ui-tooltip"][data-v-78626a50] {
595
+ [data-component~="ui-tooltip"][data-v-3099b119] {
590
596
  position: fixed;
591
597
  inset: auto;
592
598
  margin: 0;
@@ -607,13 +613,13 @@ input[data-v-1e598fdb]:focus-visible {
607
613
  display var(--ui-motion-fast) allow-discrete,
608
614
  overlay var(--ui-motion-fast) allow-discrete;
609
615
  }
610
- .surface[data-v-78626a50] {
616
+ .surface[data-v-3099b119] {
611
617
  --_tooltip-line: var(--ui-tooltip-border, var(--ui-border-default));
612
618
  position: relative;
613
619
  box-sizing: border-box;
614
620
  max-inline-size: var(--ui-tooltip-max-inline-size, 18rem);
615
621
  border: 1px solid var(--_tooltip-line);
616
- border-radius: var(--ui-tooltip-radius, var(--ui-radius-1));
622
+ border-radius: var(--ui-tooltip-radius, var(--ui-radius-sm));
617
623
  background: var(--ui-tooltip-surface, var(--ui-surface-elevated));
618
624
  color: var(--ui-tooltip-text, var(--ui-text-primary));
619
625
  padding: var(--ui-space-1) var(--ui-space-2);
@@ -622,7 +628,7 @@ input[data-v-1e598fdb]:focus-visible {
622
628
  line-height: var(--ui-line-height-tight);
623
629
  box-shadow: var(--ui-tooltip-shadow, var(--ui-elevation-tooltip, var(--ui-shadow-md)));
624
630
  }
625
- [data-component~="ui-tooltip"][data-ui-tooltip-state~="inverse"] .surface[data-v-78626a50] {
631
+ [data-component~="ui-tooltip"][data-ui-tooltip-state~="inverse"] .surface[data-v-3099b119] {
626
632
  --_tooltip-line: var(--ui-tooltip-inverse-surface, var(--ui-text-primary));
627
633
  background: var(--ui-tooltip-inverse-surface, var(--ui-text-primary));
628
634
  color: var(--ui-tooltip-inverse-text, var(--ui-surface-default));
@@ -630,7 +636,7 @@ input[data-v-1e598fdb]:focus-visible {
630
636
 
631
637
  /* A rotated square shares the surface fill and draws the two outward border edges. Its centre sits on
632
638
  * the surface border line, so the fill covers that stretch of border and the outline runs unbroken. */
633
- .surface[data-v-78626a50]::after {
639
+ .surface[data-v-3099b119]::after {
634
640
  content: "";
635
641
  position: absolute;
636
642
  z-index: 1;
@@ -647,7 +653,7 @@ input[data-v-1e598fdb]:focus-visible {
647
653
  transform: rotate(45deg);
648
654
  }
649
655
  :is([data-component~="ui-tooltip"][data-ui-tooltip-state~="placement=bottom"], [data-component~="ui-tooltip"][data-ui-tooltip-state~="placement=bottom-start"], [data-component~="ui-tooltip"][data-ui-tooltip-state~="placement=bottom-end"])
650
- .surface[data-v-78626a50]::after {
656
+ .surface[data-v-3099b119]::after {
651
657
  inset-block-start: calc(var(--ui-tooltip-arrow-size, 0.5rem) / -2 - 0.5px);
652
658
  inset-block-end: auto;
653
659
  border-inline-end-width: 0;
@@ -658,67 +664,67 @@ input[data-v-1e598fdb]:focus-visible {
658
664
  border-start-start-radius: 1px;
659
665
  }
660
666
  :is([data-component~="ui-tooltip"][data-ui-tooltip-state~="placement=top-end"], [data-component~="ui-tooltip"][data-ui-tooltip-state~="placement=bottom-end"])
661
- .surface[data-v-78626a50]::after {
667
+ .surface[data-v-3099b119]::after {
662
668
  inset-inline-start: auto;
663
669
  inset-inline-end: var(--ui-space-3);
664
670
  }
665
- [data-component~="ui-tooltip"][data-v-78626a50]:popover-open {
671
+ [data-component~="ui-tooltip"][data-v-3099b119]:popover-open {
666
672
  opacity: 1;
667
673
  transform: translateY(0);
668
674
  }
669
675
  @starting-style {
670
- [data-component~="ui-tooltip"][data-v-78626a50]:popover-open {
676
+ [data-component~="ui-tooltip"][data-v-3099b119]:popover-open {
671
677
  opacity: 0;
672
678
  transform: translateY(4px);
673
679
  }
674
680
  }
675
- [data-component~="ui-tooltip"][hidden][data-v-78626a50] {
681
+ [data-component~="ui-tooltip"][hidden][data-v-3099b119] {
676
682
  display: none;
677
683
  }
678
684
  @media (prefers-reduced-motion: reduce) {
679
- [data-component~="ui-tooltip"][data-v-78626a50] {
685
+ [data-component~="ui-tooltip"][data-v-3099b119] {
680
686
  transition: none;
681
687
  }
682
688
  }
683
689
 
684
- [data-component~="ui-combobox"][data-v-7eb73ca2] {
690
+ [data-component~="ui-combobox"][data-v-147b231f] {
685
691
  display: grid;
686
692
  gap: var(--ui-space-1);
687
693
  min-inline-size: 0;
688
694
  color: var(--ui-text-primary);
689
695
  font: inherit;
690
696
  }
691
- label[data-v-7eb73ca2] {
692
- color: var(--ui-field-label-color, var(--ui-text-primary));
693
- font-size: var(--ui-field-label-size, 0.875rem);
694
- font-weight: var(--ui-field-label-weight, 500);
697
+ label[data-v-147b231f] {
698
+ color: var(--ui-combobox-label-text, var(--ui-text-primary));
699
+ font-size: var(--ui-combobox-label-font-size, 0.875rem);
700
+ font-weight: 500;
695
701
  }
696
- .field[data-v-7eb73ca2] {
702
+ .field[data-v-147b231f] {
697
703
  display: flex;
698
704
  min-inline-size: 0;
699
705
  border: 1px solid var(--ui-control-border, var(--ui-border-default));
700
- border-radius: var(--ui-radius-2);
706
+ border-radius: var(--ui-radius-md);
701
707
  background: var(--ui-control-surface, var(--ui-surface-default));
702
708
  box-shadow: var(--ui-control-inset);
703
709
  transition:
704
710
  border-color var(--ui-motion-fast) var(--ui-motion-ease),
705
711
  box-shadow var(--ui-motion-fast) var(--ui-motion-ease);
706
712
  }
707
- .field[data-v-7eb73ca2]:focus-within {
713
+ .field[data-v-147b231f]:focus-within {
708
714
  border-color: var(--ui-control-focus, var(--ui-accent-solid));
709
715
  box-shadow:
710
716
  var(--ui-control-inset),
711
717
  var(--ui-control-focus-halo-shadow);
712
718
  }
713
- input[data-v-7eb73ca2]::selection {
719
+ input[data-v-147b231f]::selection {
714
720
  background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);
715
721
  color: inherit;
716
722
  }
717
- input[data-v-7eb73ca2] {
723
+ input[data-v-147b231f] {
718
724
  appearance: none;
719
725
  width: 100%;
720
726
  min-inline-size: 0;
721
- min-block-size: calc(var(--ui-control-size-md, 2.5rem) - 2px);
727
+ min-block-size: calc(var(--ui-control-size-md) - 2px);
722
728
  box-sizing: border-box;
723
729
  border: 0;
724
730
  border-radius: inherit;
@@ -730,50 +736,50 @@ input[data-v-7eb73ca2] {
730
736
  margin: 0;
731
737
  outline: none;
732
738
  }
733
- [data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"] input[data-v-7eb73ca2] {
734
- min-block-size: calc(var(--ui-field-compact-size, var(--ui-control-size-sm, 2rem)) - 2px);
739
+ [data-component~="ui-combobox"][data-ui-combobox-state~="size=sm"] input[data-v-147b231f] {
740
+ min-block-size: calc(var(--ui-control-size-sm) - 2px);
735
741
  padding: var(--ui-space-1) var(--ui-space-2);
736
742
  }
737
- button[data-v-7eb73ca2] {
743
+ button[data-v-147b231f] {
738
744
  appearance: none;
739
745
  display: inline-grid;
740
746
  place-items: center;
741
747
  align-self: stretch;
742
748
  border: 0;
743
- border-radius: var(--ui-radius-2);
749
+ border-radius: var(--ui-radius-md);
744
750
  background: transparent;
745
- color: var(--ui-field-affordance-color, var(--ui-text-secondary));
751
+ color: var(--ui-combobox-affordance-text, var(--ui-text-secondary));
746
752
  font: inherit;
747
- font-weight: var(--ui-field-affordance-weight, 400);
753
+ font-weight: 400;
748
754
  min-inline-size: 2rem;
749
755
  padding: 0 var(--ui-space-1);
750
756
  cursor: pointer;
751
757
  }
752
- .affordance-icon[data-v-7eb73ca2] {
758
+ .affordance-icon[data-v-147b231f] {
753
759
  display: block;
754
- inline-size: var(--ui-icon-size-sm, 1rem);
755
- block-size: var(--ui-icon-size-sm, 1rem);
760
+ inline-size: var(--ui-icon-size-sm);
761
+ block-size: var(--ui-icon-size-sm);
756
762
  }
757
- button[data-v-7eb73ca2]:hover:enabled {
763
+ button[data-v-147b231f]:hover:enabled {
758
764
  background: var(--ui-surface-muted);
759
765
  color: var(--ui-text-primary);
760
766
  }
761
- button[data-v-7eb73ca2]:focus-visible {
767
+ button[data-v-147b231f]:focus-visible {
762
768
  outline: none;
763
769
  background: var(--ui-surface-muted);
764
770
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);
765
771
  }
766
- input[data-v-7eb73ca2]:disabled, button[data-v-7eb73ca2]:disabled {
772
+ input[data-v-147b231f]:disabled, button[data-v-147b231f]:disabled {
767
773
  color: var(--ui-text-muted);
768
774
  cursor: not-allowed;
769
775
  }
770
- .field[data-v-7eb73ca2]:has(input:disabled) {
776
+ .field[data-v-147b231f]:has(input:disabled) {
771
777
  background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
772
778
  }
773
- [data-component~="ui-combobox"][data-ui-combobox-state~="validationStatus=error"] .field[data-v-7eb73ca2] {
779
+ [data-component~="ui-combobox"][data-ui-combobox-state~="validationStatus=error"] .field[data-v-147b231f] {
774
780
  border-color: var(--ui-danger-solid, var(--ui-accent-active));
775
781
  }
776
- .popup[data-v-7eb73ca2] {
782
+ .popup[data-v-147b231f] {
777
783
  box-sizing: border-box;
778
784
  min-inline-size: 12rem;
779
785
  max-inline-size: calc(100vw - 1rem);
@@ -782,45 +788,45 @@ input[data-v-7eb73ca2]:disabled, button[data-v-7eb73ca2]:disabled {
782
788
  margin: 0;
783
789
  padding: var(--ui-space-1);
784
790
  border: 1px solid var(--ui-border-default);
785
- border-radius: var(--ui-radius-2);
791
+ border-radius: var(--ui-radius-md);
786
792
  background: var(--ui-surface-elevated);
787
793
  color: var(--ui-text-primary);
788
794
  box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));
789
795
  }
790
- [hidden][data-v-7eb73ca2] {
796
+ [hidden][data-v-147b231f] {
791
797
  display: none;
792
798
  }
793
- .option[data-v-7eb73ca2] {
799
+ .option[data-v-147b231f] {
794
800
  padding: var(--ui-space-2) var(--ui-space-3);
795
- border-radius: var(--ui-radius-1);
801
+ border-radius: var(--ui-radius-sm);
796
802
  cursor: pointer;
797
803
  overflow-wrap: anywhere;
798
804
  }
799
- .option[data-v-7eb73ca2]:hover, .option.active[data-v-7eb73ca2] {
805
+ .option[data-v-147b231f]:hover, .option.active[data-v-147b231f] {
800
806
  background: var(--ui-surface-muted);
801
- outline: 1px solid var(--ui-focus-ring, currentColor);
807
+ outline: 1px solid var(--ui-focus-ring);
802
808
  outline-offset: -1px;
803
809
  }
804
- .option[aria-disabled="true"][data-v-7eb73ca2] {
810
+ .option[aria-disabled="true"][data-v-147b231f] {
805
811
  color: var(--ui-text-muted);
806
812
  cursor: not-allowed;
807
813
  }
808
- .primary[data-v-7eb73ca2] {
814
+ .primary[data-v-147b231f] {
809
815
  display: block;
810
- color: var(--ui-option-primary-color, var(--ui-text-primary));
811
- font-weight: var(--ui-option-primary-weight, 500);
816
+ color: var(--ui-combobox-option-text, var(--ui-text-primary));
817
+ font-weight: 500;
812
818
  }
813
- .message[data-v-7eb73ca2], .group[data-v-7eb73ca2] {
814
- color: var(--ui-field-message-color, var(--ui-text-secondary));
815
- font-weight: var(--ui-field-message-weight, 400);
819
+ .message[data-v-147b231f], .group[data-v-147b231f] {
820
+ color: var(--ui-combobox-message-text, var(--ui-text-secondary));
821
+ font-weight: 400;
816
822
  font-size: var(--ui-font-size-sm);
817
823
  line-height: var(--ui-line-height-md);
818
824
  overflow-wrap: anywhere;
819
825
  }
820
- .group[data-v-7eb73ca2], .popup .message[data-v-7eb73ca2] {
826
+ .group[data-v-147b231f], .popup .message[data-v-147b231f] {
821
827
  padding: var(--ui-space-2) var(--ui-space-3);
822
828
  }
823
- .sr-only[data-v-7eb73ca2] {
829
+ .sr-only[data-v-147b231f] {
824
830
  position: absolute;
825
831
  inline-size: 1px;
826
832
  block-size: 1px;
@@ -829,95 +835,95 @@ input[data-v-7eb73ca2]:disabled, button[data-v-7eb73ca2]:disabled {
829
835
  white-space: nowrap;
830
836
  }
831
837
  @media (pointer: coarse) {
832
- button[data-v-7eb73ca2] {
838
+ button[data-v-147b231f] {
833
839
  min-inline-size: 2.75rem;
834
840
  min-block-size: 2.75rem;
835
841
  }
836
842
  }
837
843
  @media (forced-colors: active) {
838
- .field[data-v-7eb73ca2], .popup[data-v-7eb73ca2] {
844
+ .field[data-v-147b231f], .popup[data-v-147b231f] {
839
845
  border-color: CanvasText;
840
846
  }
841
- .option.active[data-v-7eb73ca2] {
847
+ .option.active[data-v-147b231f] {
842
848
  outline-color: Highlight;
843
849
  }
844
850
  }
845
851
 
846
852
  /* Multiple mode: chips wrap before the cursor on one flexible field line. */
847
- [data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .field[data-v-7eb73ca2] {
853
+ [data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] .field[data-v-147b231f] {
848
854
  flex-wrap: wrap;
849
855
  align-items: center;
850
856
  gap: var(--ui-space-1);
851
- min-block-size: var(--ui-multi-combobox-min-block-size, 2.5rem);
857
+ min-block-size: var(--ui-combobox-item-min-block-size, 2.5rem);
852
858
  padding: var(--ui-space-1);
853
859
  }
854
- [data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] input[data-v-7eb73ca2] {
855
- flex: 1 0 var(--ui-multi-combobox-input-min-inline-size, 5rem);
860
+ [data-component~="ui-combobox"][data-ui-combobox-state~="multiple"] input[data-v-147b231f] {
861
+ flex: 1 0 var(--ui-combobox-item-input-min-inline-size, 5rem);
856
862
  width: auto;
857
863
  min-block-size: 1.75rem;
858
864
  padding: var(--ui-space-0-5) var(--ui-space-1);
859
865
  }
860
- .item[data-v-7eb73ca2] {
866
+ .item[data-v-147b231f] {
861
867
  appearance: none;
862
868
  display: inline-flex;
863
869
  min-inline-size: 0;
864
- max-inline-size: min(100%, var(--ui-multi-combobox-item-max-inline-size, 12rem));
870
+ max-inline-size: min(100%, var(--ui-combobox-item-item-max-inline-size, 12rem));
865
871
  overflow: hidden;
866
872
  padding: 0;
867
873
  border: 0;
868
- border-radius: var(--ui-radius-1);
874
+ border-radius: var(--ui-radius-sm);
869
875
  background: transparent;
870
876
  color: inherit;
871
877
  font: inherit;
872
878
  cursor: default;
873
879
  }
874
- .item[data-v-7eb73ca2]:focus-visible {
875
- outline: 2px solid var(--ui-focus-ring, currentColor);
880
+ .item[data-v-147b231f]:focus-visible {
881
+ outline: 2px solid var(--ui-focus-ring);
876
882
  outline-offset: 1px;
877
883
  }
878
- .item[data-v-7eb73ca2]:disabled {
884
+ .item[data-v-147b231f]:disabled {
879
885
  opacity: 0.6;
880
886
  }
881
887
 
882
888
  /* A component that sets its display still honours the hidden attribute on its root. */
883
- [data-component~="ui-combobox"][hidden][data-v-7eb73ca2] {
889
+ [data-component~="ui-combobox"][hidden][data-v-147b231f] {
884
890
  display: none;
885
891
  }
886
892
 
887
- [data-component~="ui-container"][data-v-bf6caa0d] {
893
+ [data-component~="ui-container"][data-v-4c7bb81d] {
888
894
  --_container-measure: 65ch;
889
- --_container-gutters: var(--ui-space-4, 1rem);
895
+ --_container-gutters: var(--ui-space-4);
890
896
  display: block;
891
897
  inline-size: 100%;
892
898
  max-inline-size: var(--ui-container-measure, var(--_container-measure));
893
899
  margin-inline: auto;
894
900
  padding-inline: var(--ui-container-gutters, var(--_container-gutters));
895
901
  }
896
- [data-component~="ui-container"][data-ui-container-state~="measure=narrow"][data-v-bf6caa0d] {
902
+ [data-component~="ui-container"][data-ui-container-state~="measure=narrow"][data-v-4c7bb81d] {
897
903
  --_container-measure: 45ch;
898
904
  }
899
- [data-component~="ui-container"][data-ui-container-state~="measure=wide"][data-v-bf6caa0d] {
905
+ [data-component~="ui-container"][data-ui-container-state~="measure=wide"][data-v-4c7bb81d] {
900
906
  --_container-measure: 80ch;
901
907
  }
902
- [data-component~="ui-container"][data-ui-container-state~="gutters=s"][data-v-bf6caa0d] {
903
- --_container-gutters: var(--ui-space-3, 0.75rem);
908
+ [data-component~="ui-container"][data-ui-container-state~="gutters=s"][data-v-4c7bb81d] {
909
+ --_container-gutters: var(--ui-space-3);
904
910
  }
905
- [data-component~="ui-container"][data-ui-container-state~="gutters=m"][data-v-bf6caa0d] {
906
- --_container-gutters: var(--ui-space-4, 1rem);
911
+ [data-component~="ui-container"][data-ui-container-state~="gutters=m"][data-v-4c7bb81d] {
912
+ --_container-gutters: var(--ui-space-4);
907
913
  }
908
- [data-component~="ui-container"][data-ui-container-state~="gutters=l"][data-v-bf6caa0d] {
909
- --_container-gutters: var(--ui-space-5, 1.5rem);
914
+ [data-component~="ui-container"][data-ui-container-state~="gutters=l"][data-v-4c7bb81d] {
915
+ --_container-gutters: var(--ui-space-5);
910
916
  }
911
917
 
912
918
  /* A component that sets its display still honours the hidden attribute on its root. */
913
- [data-component~="ui-container"][hidden][data-v-bf6caa0d] {
919
+ [data-component~="ui-container"][hidden][data-v-4c7bb81d] {
914
920
  display: none;
915
921
  }
916
922
 
917
- [data-component~="ui-context-menu"][data-v-9d2943e9] {
923
+ [data-component~="ui-context-menu"][data-v-39e418e5] {
918
924
  display: contents;
919
925
  }
920
- .menu[data-v-9d2943e9] {
926
+ .menu[data-v-39e418e5] {
921
927
  position: fixed;
922
928
  inset: auto;
923
929
  margin: 0;
@@ -927,11 +933,11 @@ button[data-v-7eb73ca2] {
927
933
  padding: var(--ui-space-1);
928
934
  background: var(--ui-surface-elevated);
929
935
  border: 1px solid var(--ui-border-default);
930
- border-radius: var(--ui-radius-3);
936
+ border-radius: var(--ui-radius-lg);
931
937
  box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));
932
938
  outline: 0;
933
939
  overflow: auto;
934
- z-index: var(--ui-z-overlay, 1000);
940
+ z-index: var(--ui-context-menu-z-index, 1000);
935
941
  min-width: 12rem;
936
942
  opacity: 0;
937
943
  transform: translateY(-4px) scale(0.99);
@@ -941,41 +947,41 @@ button[data-v-7eb73ca2] {
941
947
  display var(--ui-motion-fast) allow-discrete,
942
948
  overlay var(--ui-motion-fast) allow-discrete;
943
949
  }
944
- .menu[data-v-9d2943e9]:popover-open {
950
+ .menu[data-v-39e418e5]:popover-open {
945
951
  opacity: 1;
946
952
  transform: translateY(0) scale(1);
947
953
  }
948
954
  @starting-style {
949
- .menu[data-v-9d2943e9]:popover-open {
955
+ .menu[data-v-39e418e5]:popover-open {
950
956
  opacity: 0;
951
957
  transform: translateY(-4px) scale(0.99);
952
958
  }
953
959
  }
954
- .menu[hidden][data-v-9d2943e9],
955
- .menu[popover][data-v-9d2943e9]:not(:popover-open) {
960
+ .menu[hidden][data-v-39e418e5],
961
+ .menu[popover][data-v-39e418e5]:not(:popover-open) {
956
962
  display: none;
957
963
  }
958
964
  @media (prefers-reduced-motion: reduce) {
959
- .menu[data-v-9d2943e9] {
965
+ .menu[data-v-39e418e5] {
960
966
  transition: none;
961
967
  }
962
968
  }
963
969
 
964
970
  /* A component that sets its display still honours the hidden attribute on its root. */
965
- [data-component~="ui-context-menu"][hidden][data-v-9d2943e9] {
971
+ [data-component~="ui-context-menu"][hidden][data-v-39e418e5] {
966
972
  display: none;
967
973
  }
968
974
 
969
- [data-component~="ui-dialog"][data-v-e78fa426] {
975
+ [data-component~="ui-dialog"][data-v-05ac1756] {
970
976
  position: fixed;
971
977
  inset: 0;
972
978
  box-sizing: border-box;
973
979
  inline-size: min(
974
- calc(100% - var(--ui-dialog-viewport-gap, var(--ui-space-4, 1rem)) * 2),
980
+ calc(100% - var(--ui-dialog-viewport-gap, var(--ui-space-4)) * 2),
975
981
  var(--ui-dialog-max-width, 440px)
976
982
  );
977
983
  max-inline-size: none;
978
- max-block-size: calc(100dvh - var(--ui-dialog-viewport-gap, var(--ui-space-4, 1rem)) * 2);
984
+ max-block-size: calc(100dvh - var(--ui-dialog-viewport-gap, var(--ui-space-4)) * 2);
979
985
  margin: auto;
980
986
  padding: 0;
981
987
  overflow: hidden;
@@ -995,17 +1001,17 @@ button[data-v-7eb73ca2] {
995
1001
  display var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete,
996
1002
  overlay var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete;
997
1003
  }
998
- [data-component~="ui-dialog"][open][data-v-e78fa426] {
1004
+ [data-component~="ui-dialog"][open][data-v-05ac1756] {
999
1005
  display: flex;
1000
1006
  visibility: visible;
1001
1007
  pointer-events: auto;
1002
1008
  opacity: 1;
1003
1009
  transform: scale(1);
1004
- animation: ui-dialog-enter-e78fa426 var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease);
1010
+ animation: ui-dialog-enter-05ac1756 var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease);
1005
1011
  }
1006
1012
 
1007
1013
  /* Header and actions stay pinned; only the body scrolls when content is long. */
1008
- header[data-v-e78fa426] {
1014
+ header[data-v-05ac1756] {
1009
1015
  display: flex;
1010
1016
  align-items: center;
1011
1017
  gap: var(--ui-space-3);
@@ -1015,7 +1021,7 @@ header[data-v-e78fa426] {
1015
1021
  }
1016
1022
 
1017
1023
  /* :host-qualified so page heading rules that reach in cannot outrank the dialog chrome. */
1018
- [data-component~="ui-dialog"] .title[data-v-e78fa426] {
1024
+ [data-component~="ui-dialog"] .title[data-v-05ac1756] {
1019
1025
  flex: 1;
1020
1026
  min-inline-size: 0;
1021
1027
  margin: 0;
@@ -1023,20 +1029,20 @@ header[data-v-e78fa426] {
1023
1029
  border: 0;
1024
1030
  color: var(--ui-text-primary);
1025
1031
  letter-spacing: normal;
1026
- font-size: var(--ui-font-size-lg, 1.125rem);
1027
- font-weight: var(--ui-font-semibold, 600);
1032
+ font-size: var(--ui-font-size-lg);
1033
+ font-weight: var(--ui-font-semibold);
1028
1034
  line-height: var(--ui-line-height-tight);
1029
1035
  }
1030
- .close[data-v-e78fa426] {
1036
+ .close[data-v-05ac1756] {
1031
1037
  display: inline-grid;
1032
1038
  place-items: center;
1033
1039
  flex: none;
1034
1040
  margin-inline-start: auto;
1035
- inline-size: var(--ui-control-size-sm, 2rem);
1036
- block-size: var(--ui-control-size-sm, 2rem);
1041
+ inline-size: var(--ui-control-size-sm);
1042
+ block-size: var(--ui-control-size-sm);
1037
1043
  padding: 0;
1038
1044
  border: 0;
1039
- border-radius: var(--ui-radius-round, 999px);
1045
+ border-radius: var(--ui-radius-round);
1040
1046
  background: transparent;
1041
1047
  color: var(--ui-text-secondary);
1042
1048
  cursor: pointer;
@@ -1046,8 +1052,8 @@ header[data-v-e78fa426] {
1046
1052
  }
1047
1053
 
1048
1054
  /* A CSS-drawn X. */
1049
- .close[data-v-e78fa426]::before,
1050
- .close[data-v-e78fa426]::after {
1055
+ .close[data-v-05ac1756]::before,
1056
+ .close[data-v-05ac1756]::after {
1051
1057
  content: "";
1052
1058
  grid-area: 1 / 1;
1053
1059
  inline-size: 0.875rem;
@@ -1056,37 +1062,37 @@ header[data-v-e78fa426] {
1056
1062
  background: currentColor;
1057
1063
  transform: rotate(45deg);
1058
1064
  }
1059
- .close[data-v-e78fa426]::after {
1065
+ .close[data-v-05ac1756]::after {
1060
1066
  transform: rotate(-45deg);
1061
1067
  }
1062
- .close[data-v-e78fa426]:hover {
1068
+ .close[data-v-05ac1756]:hover {
1063
1069
  background: var(--ui-surface-muted);
1064
1070
  color: var(--ui-text-primary);
1065
1071
  }
1066
- .close[data-v-e78fa426]:focus-visible {
1067
- outline: 2px solid var(--ui-focus-ring, currentColor);
1072
+ .close[data-v-05ac1756]:focus-visible {
1073
+ outline: 2px solid var(--ui-focus-ring);
1068
1074
  outline-offset: 2px;
1069
1075
  }
1070
1076
 
1071
1077
  /* A touch target, like Button on coarse pointers. */
1072
1078
  @media (pointer: coarse) {
1073
- .close[data-v-e78fa426] {
1074
- inline-size: var(--ui-control-min-block-size, 2.75rem);
1075
- block-size: var(--ui-control-min-block-size, 2.75rem);
1079
+ .close[data-v-05ac1756] {
1080
+ inline-size: var(--ui-control-min-block-size);
1081
+ block-size: var(--ui-control-min-block-size);
1076
1082
  }
1077
1083
  }
1078
- html[data-ui-input-modality="touch"] [data-component~="ui-dialog"] .close[data-v-e78fa426] {
1079
- inline-size: var(--ui-control-min-block-size, 2.75rem);
1080
- block-size: var(--ui-control-min-block-size, 2.75rem);
1084
+ html[data-ui-input-modality="touch"] [data-component~="ui-dialog"] .close[data-v-05ac1756] {
1085
+ inline-size: var(--ui-control-min-block-size);
1086
+ block-size: var(--ui-control-min-block-size);
1081
1087
  }
1082
- .body[data-v-e78fa426] {
1088
+ .body[data-v-05ac1756] {
1083
1089
  flex: 1 1 auto;
1084
1090
  min-block-size: 0;
1085
1091
  overflow: auto;
1086
1092
  overscroll-behavior: contain;
1087
1093
  padding: var(--ui-space-5);
1088
1094
  }
1089
- footer[data-v-e78fa426] {
1095
+ footer[data-v-05ac1756] {
1090
1096
  display: flex;
1091
1097
  flex: none;
1092
1098
  flex-wrap: wrap;
@@ -1095,72 +1101,85 @@ footer[data-v-e78fa426] {
1095
1101
  padding: var(--ui-space-3) var(--ui-space-5);
1096
1102
  border-block-start: 1px solid var(--ui-border-default);
1097
1103
  }
1098
- footer[data-v-e78fa426]:empty {
1104
+ footer[data-v-05ac1756]:empty {
1099
1105
  display: none;
1100
1106
  }
1101
- @keyframes ui-dialog-enter-e78fa426 {
1107
+ @keyframes ui-dialog-enter-05ac1756 {
1102
1108
  from {
1103
1109
  opacity: 0;
1104
1110
  transform: scale(0.96);
1105
1111
  }
1106
1112
  }
1107
- [data-component~="ui-dialog"][data-v-e78fa426]::backdrop {
1113
+ [data-component~="ui-dialog"][data-v-05ac1756]::backdrop {
1108
1114
  background-color: transparent;
1109
1115
  transition:
1110
1116
  background-color var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),
1111
1117
  display var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete,
1112
1118
  overlay var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete;
1113
1119
  }
1114
- [data-component~="ui-dialog"][open][data-v-e78fa426]::backdrop {
1120
+ [data-component~="ui-dialog"][open][data-v-05ac1756]::backdrop {
1115
1121
  background-color: var(--ui-overlay-backdrop);
1116
- animation: ui-dialog-backdrop-enter-e78fa426 var(--ui-dialog-duration, var(--ui-motion-base))
1122
+ animation: ui-dialog-backdrop-enter-05ac1756 var(--ui-dialog-duration, var(--ui-motion-base))
1117
1123
  var(--ui-motion-ease);
1118
1124
  }
1119
- @keyframes ui-dialog-backdrop-enter-e78fa426 {
1125
+ @keyframes ui-dialog-backdrop-enter-05ac1756 {
1120
1126
  from {
1121
1127
  background-color: transparent;
1122
1128
  }
1123
1129
  }
1124
1130
 
1131
+ /* Density resolves into the summary row's own values; the public tokens still override them. */
1132
+ [data-component~="ui-disclosure"][data-v-d9a330a8] {
1133
+ --_trigger-min-block-size: var(--ui-control-size);
1134
+ --_trigger-padding-block: var(--ui-space-2);
1135
+ --_trigger-padding-inline: var(--ui-space-3);
1136
+ }
1137
+ [data-component~="ui-disclosure"][data-ui-disclosure-state~="density=compact"][data-v-d9a330a8] {
1138
+ --_trigger-min-block-size: var(--ui-control-size-sm);
1139
+ --_trigger-padding-block: var(--ui-space-1);
1140
+ --_trigger-padding-inline: var(--ui-space-2);
1141
+ }
1142
+
1125
1143
  /* An accordion row, not a field: no enclosing box, just a divider, so it never reads as a
1126
1144
  * select or combobox. Stacked disclosures share their dividers. */
1127
- [data-component~="ui-disclosure"][data-v-283377cf] {
1145
+ [data-component~="ui-disclosure"][data-v-d9a330a8] {
1128
1146
  display: block;
1129
1147
  inline-size: 100%;
1130
1148
  overflow: clip;
1131
1149
  border-block-end: 1px solid var(--ui-border-default);
1132
1150
  color: var(--ui-text-primary);
1133
1151
  }
1134
- .trigger[data-v-283377cf] {
1152
+ .trigger[data-v-d9a330a8] {
1135
1153
  display: grid;
1136
1154
  grid-template-columns: minmax(0, 1fr) auto;
1137
1155
  gap: var(--ui-space-3);
1138
1156
  align-items: center;
1139
1157
  inline-size: 100%;
1140
- min-block-size: 2.5rem;
1141
- padding: var(--ui-space-2) var(--ui-space-3);
1158
+ min-block-size: var(--ui-disclosure-trigger-min-block-size, var(--_trigger-min-block-size));
1159
+ padding: var(--ui-disclosure-trigger-padding-block, var(--_trigger-padding-block))
1160
+ var(--ui-disclosure-trigger-padding-inline, var(--_trigger-padding-inline));
1142
1161
  border: 0;
1143
1162
  background: transparent;
1144
1163
  color: inherit;
1145
1164
  font: inherit;
1146
- font-weight: var(--ui-font-semibold, 600);
1165
+ font-weight: var(--ui-font-semibold);
1147
1166
  text-align: start;
1148
1167
  cursor: pointer;
1149
- border-radius: var(--ui-radius-1);
1168
+ border-radius: var(--ui-radius-sm);
1150
1169
  transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);
1151
1170
  }
1152
- .trigger[data-v-283377cf]:hover:not(:disabled) {
1171
+ .trigger[data-v-d9a330a8]:hover:not(:disabled) {
1153
1172
  background: var(--ui-surface-muted);
1154
1173
  }
1155
- .trigger[data-v-283377cf]:focus-visible {
1174
+ .trigger[data-v-d9a330a8]:focus-visible {
1156
1175
  outline: none;
1157
1176
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);
1158
1177
  }
1159
- .trigger[data-v-283377cf]:disabled {
1178
+ .trigger[data-v-d9a330a8]:disabled {
1160
1179
  color: var(--ui-text-muted);
1161
1180
  cursor: not-allowed;
1162
1181
  }
1163
- .chevron[data-v-283377cf] {
1182
+ .chevron[data-v-d9a330a8] {
1164
1183
  inline-size: 0.5rem;
1165
1184
  block-size: 0.5rem;
1166
1185
  border-inline-end: 2px solid currentColor;
@@ -1168,39 +1187,39 @@ from {
1168
1187
  transform: rotate(45deg) translate(-1px, -1px);
1169
1188
  transition: transform var(--ui-motion-fast) var(--ui-motion-ease);
1170
1189
  }
1171
- .panel[data-v-283377cf] {
1190
+ .panel[data-v-d9a330a8] {
1172
1191
  display: grid;
1173
1192
  grid-template-rows: 0fr;
1174
1193
  transition: grid-template-rows var(--ui-motion-fast)
1175
1194
  var(--ui-motion-ease-out, var(--ui-motion-ease));
1176
1195
  }
1177
- .panel-inner[data-v-283377cf] {
1196
+ .panel-inner[data-v-d9a330a8] {
1178
1197
  min-block-size: 0;
1179
1198
  overflow: hidden;
1180
1199
  padding-inline: var(--ui-space-3);
1181
1200
  }
1182
- [data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel[data-v-283377cf] {
1201
+ [data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel[data-v-d9a330a8] {
1183
1202
  grid-template-rows: 1fr;
1184
1203
  }
1185
- [data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel-inner[data-v-283377cf] {
1204
+ [data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .panel-inner[data-v-d9a330a8] {
1186
1205
  padding-block: 0 var(--ui-space-3);
1187
1206
  }
1188
- [data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .chevron[data-v-283377cf] {
1207
+ [data-component~="ui-disclosure"][data-ui-disclosure-state~="internalOpen"] .chevron[data-v-d9a330a8] {
1189
1208
  transform: rotate(225deg) translate(-1px, -1px);
1190
1209
  }
1191
1210
  @media (prefers-reduced-motion: reduce) {
1192
- .panel[data-v-283377cf],
1193
- .chevron[data-v-283377cf] {
1211
+ .panel[data-v-d9a330a8],
1212
+ .chevron[data-v-d9a330a8] {
1194
1213
  transition: none;
1195
1214
  }
1196
1215
  }
1197
1216
 
1198
1217
  /* A component that sets its display still honours the hidden attribute on its root. */
1199
- [data-component~="ui-disclosure"][hidden][data-v-283377cf] {
1218
+ [data-component~="ui-disclosure"][hidden][data-v-d9a330a8] {
1200
1219
  display: none;
1201
1220
  }
1202
1221
 
1203
- [data-component~="ui-editable"][data-v-f4bef809] {
1222
+ [data-component~="ui-editable"][data-v-3707d050] {
1204
1223
  display: flex;
1205
1224
  flex-wrap: wrap;
1206
1225
  align-items: center;
@@ -1211,20 +1230,20 @@ from {
1211
1230
 
1212
1231
  /* The value and the input share one grid cell with identical box metrics, so switching between
1213
1232
  * display and edit never changes the control's size or moves the text. */
1214
- .field[data-v-f4bef809] {
1233
+ .field[data-v-3707d050] {
1215
1234
  display: inline-grid;
1216
1235
  min-inline-size: 8rem;
1217
1236
  max-inline-size: 100%;
1218
1237
  }
1219
- .preview[data-v-f4bef809],
1220
- .input[data-v-f4bef809] {
1238
+ .preview[data-v-3707d050],
1239
+ .input[data-v-3707d050] {
1221
1240
  grid-area: 1 / 1;
1222
1241
  box-sizing: border-box;
1223
- min-block-size: var(--ui-control-size-sm, 2rem);
1242
+ min-block-size: var(--ui-control-size-sm);
1224
1243
  margin: 0;
1225
1244
  padding: var(--ui-space-1) var(--ui-space-2);
1226
1245
  border: 1px solid transparent;
1227
- border-radius: var(--ui-radius-2);
1246
+ border-radius: var(--ui-radius-md);
1228
1247
  font: inherit;
1229
1248
  line-height: var(--ui-line-height-md);
1230
1249
  color: inherit;
@@ -1233,7 +1252,7 @@ from {
1233
1252
  border-color var(--ui-motion-fast) var(--ui-motion-ease),
1234
1253
  box-shadow var(--ui-motion-fast) var(--ui-motion-ease);
1235
1254
  }
1236
- .preview[data-v-f4bef809] {
1255
+ .preview[data-v-3707d050] {
1237
1256
  display: inline-flex;
1238
1257
  gap: var(--ui-space-2);
1239
1258
  align-items: center;
@@ -1241,233 +1260,233 @@ from {
1241
1260
  text-align: start;
1242
1261
  cursor: pointer;
1243
1262
  }
1244
- .preview[data-v-f4bef809]:hover:not(:disabled) {
1263
+ .preview[data-v-3707d050]:hover:not(:disabled) {
1245
1264
  background: var(--ui-surface-muted);
1246
1265
  }
1247
- .preview[data-v-f4bef809]:focus-visible {
1266
+ .preview[data-v-3707d050]:focus-visible {
1248
1267
  outline: none;
1249
1268
  box-shadow: var(--ui-focus-halo);
1250
1269
  }
1251
- .hint[data-v-f4bef809] {
1270
+ .hint[data-v-3707d050] {
1252
1271
  color: var(--ui-text-secondary);
1253
1272
  font-size: var(--ui-font-size-sm);
1254
1273
  }
1255
1274
 
1256
1275
  /* Contained so it takes the value's width instead of its own default input width. */
1257
- .input[data-v-f4bef809] {
1276
+ .input[data-v-3707d050] {
1258
1277
  contain: inline-size;
1259
1278
  inline-size: 100%;
1260
1279
  min-inline-size: 0;
1261
1280
  visibility: hidden;
1262
1281
  background: var(--ui-control-surface, var(--ui-surface-elevated));
1263
1282
  }
1264
- .input[data-v-f4bef809]:focus {
1283
+ .input[data-v-3707d050]:focus {
1265
1284
  outline: none;
1266
1285
  border-color: var(--ui-control-focus, var(--ui-accent-solid));
1267
1286
  box-shadow:
1268
1287
  var(--ui-control-inset),
1269
1288
  var(--ui-control-focus-halo-shadow);
1270
1289
  }
1271
- .input[data-v-f4bef809]::selection {
1290
+ .input[data-v-3707d050]::selection {
1272
1291
  background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);
1273
1292
  }
1274
- [data-component~="ui-editable"][data-ui-editable-state~="internalEdit"] .preview[data-v-f4bef809] {
1293
+ [data-component~="ui-editable"][data-ui-editable-state~="internalEdit"] .preview[data-v-3707d050] {
1275
1294
  visibility: hidden;
1276
1295
  }
1277
- [data-component~="ui-editable"][data-ui-editable-state~="internalEdit"] .input[data-v-f4bef809] {
1296
+ [data-component~="ui-editable"][data-ui-editable-state~="internalEdit"] .input[data-v-3707d050] {
1278
1297
  visibility: visible;
1279
1298
  }
1280
- .actions[data-v-f4bef809] {
1299
+ .actions[data-v-3707d050] {
1281
1300
  display: none;
1282
1301
  gap: var(--ui-space-1);
1283
1302
  }
1284
- [data-component~="ui-editable"][data-ui-editable-state~="internalEdit"] .actions[data-v-f4bef809] {
1303
+ [data-component~="ui-editable"][data-ui-editable-state~="internalEdit"] .actions[data-v-3707d050] {
1285
1304
  display: inline-flex;
1286
1305
  }
1287
- .actions button[data-v-f4bef809] {
1288
- min-block-size: var(--ui-control-size-sm, 2rem);
1306
+ .actions button[data-v-3707d050] {
1307
+ min-block-size: var(--ui-control-size-sm);
1289
1308
  padding: 0 var(--ui-space-3);
1290
1309
  border: 1px solid var(--ui-border-strong);
1291
- border-radius: var(--ui-radius-2);
1310
+ border-radius: var(--ui-radius-md);
1292
1311
  background: var(--ui-surface-elevated);
1293
- background-image: var(--ui-raised-highlight, none);
1294
- box-shadow: var(--ui-raised, none);
1312
+ background-image: var(--ui-raised-highlight);
1313
+ box-shadow: var(--ui-raised);
1295
1314
  color: inherit;
1296
1315
  font: inherit;
1297
1316
  font-size: var(--ui-font-size-sm);
1298
1317
  cursor: pointer;
1299
1318
  }
1300
- .actions .save[data-v-f4bef809] {
1319
+ .actions .save[data-v-3707d050] {
1301
1320
  border-color: var(--ui-accent-solid);
1302
1321
  background: var(--ui-accent-solid);
1303
1322
  color: var(--ui-text-on-accent);
1304
1323
  }
1305
- .actions button[data-v-f4bef809]:focus-visible {
1324
+ .actions button[data-v-3707d050]:focus-visible {
1306
1325
  outline: none;
1307
1326
  box-shadow: var(--ui-focus-halo);
1308
1327
  }
1309
- [data-component~="ui-editable"][data-ui-editable-state~="disabled"] .preview[data-v-f4bef809] {
1328
+ [data-component~="ui-editable"][data-ui-editable-state~="disabled"] .preview[data-v-3707d050] {
1310
1329
  color: var(--ui-text-muted);
1311
1330
  cursor: not-allowed;
1312
1331
  }
1313
1332
 
1314
1333
  /* A component that sets its display still honours the hidden attribute on its root. */
1315
- [data-component~="ui-editable"][hidden][data-v-f4bef809] {
1334
+ [data-component~="ui-editable"][hidden][data-v-3707d050] {
1316
1335
  display: none;
1317
1336
  }
1318
1337
 
1319
- [data-component~="ui-editor-insert-table-grid"][data-v-daf13b61] {
1320
- padding: var(--ui-space-3, 12px);
1321
- background: var(--ui-surface, #fff);
1322
- border: 1px solid var(--ui-border, #e5e7eb);
1323
- border-radius: var(--ui-radius-md, 6px);
1338
+ [data-component~="ui-editor-insert-table-grid"][data-v-c4064690] {
1339
+ padding: var(--ui-space-3);
1340
+ background: var(--ui-surface);
1341
+ border: 1px solid var(--ui-border);
1342
+ border-radius: var(--ui-radius-md);
1324
1343
  box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));
1325
1344
  }
1326
- .hint[data-v-daf13b61] {
1327
- margin: 0 0 var(--ui-space-2, 8px);
1328
- font-size: var(--ui-text-sm, 0.875rem);
1329
- color: var(--ui-text-muted, #6b7280);
1345
+ .hint[data-v-c4064690] {
1346
+ margin: 0 0 var(--ui-space-2);
1347
+ font-size: var(--ui-font-size-sm);
1348
+ color: var(--ui-text-muted);
1330
1349
  }
1331
- .grid[data-v-daf13b61] {
1350
+ .grid[data-v-c4064690] {
1332
1351
  display: grid;
1333
1352
  grid-template-columns: repeat(var(--ui-editor-table-grid-cols, 8), 1.25rem);
1334
1353
  grid-template-rows: repeat(var(--ui-editor-table-grid-rows, 8), 1.25rem);
1335
1354
  gap: 2px;
1336
- margin-bottom: var(--ui-space-2, 8px);
1355
+ margin-bottom: var(--ui-space-2);
1337
1356
  }
1338
- .cell[data-v-daf13b61] {
1357
+ .cell[data-v-c4064690] {
1339
1358
  width: 1.25rem;
1340
1359
  height: 1.25rem;
1341
1360
  padding: 0;
1342
- border: 1px solid var(--ui-border, #e5e7eb);
1361
+ border: 1px solid var(--ui-border);
1343
1362
  border-radius: 2px;
1344
- background: var(--ui-surface, #fff);
1363
+ background: var(--ui-surface);
1345
1364
  cursor: pointer;
1346
1365
  }
1347
- .cell.selected[data-v-daf13b61] {
1348
- background: var(--ui-accent-solid, var(--ui-accent, #0066cc));
1349
- border-color: var(--ui-accent-solid, var(--ui-accent, #0066cc));
1366
+ .cell.selected[data-v-c4064690] {
1367
+ background: var(--ui-accent-solid, var(--ui-accent));
1368
+ border-color: var(--ui-accent-solid, var(--ui-accent));
1350
1369
  }
1351
- .header[data-v-daf13b61] {
1370
+ .header[data-v-c4064690] {
1352
1371
  display: block;
1353
- margin-bottom: var(--ui-space-2, 8px);
1354
- font-size: var(--ui-text-sm, 0.875rem);
1372
+ margin-bottom: var(--ui-space-2);
1373
+ font-size: var(--ui-font-size-sm);
1355
1374
  cursor: pointer;
1356
1375
  }
1357
- [data-component~="ui-editor-insert-table-grid"] .insert[data-v-daf13b61] {
1376
+ [data-component~="ui-editor-insert-table-grid"] .insert[data-v-c4064690] {
1358
1377
  width: 100%;
1359
- padding: var(--ui-space-2, 8px) var(--ui-space-3, 12px);
1360
- border: 1px solid var(--ui-border, #e5e7eb);
1361
- border-radius: var(--ui-radius-sm, 4px);
1362
- background: var(--ui-accent-solid, var(--ui-accent, #0066cc));
1363
- color: var(--ui-accent-contrast, #fff);
1364
- font-size: var(--ui-text-sm, 0.875rem);
1378
+ padding: var(--ui-space-2) var(--ui-space-3);
1379
+ border: 1px solid var(--ui-border);
1380
+ border-radius: var(--ui-radius-sm);
1381
+ background: var(--ui-accent-solid, var(--ui-accent));
1382
+ color: var(--ui-accent-contrast);
1383
+ font-size: var(--ui-font-size-sm);
1365
1384
  cursor: pointer;
1366
1385
  }
1367
- [data-component~="ui-editor-insert-table-grid"] .insert[data-v-daf13b61]:hover {
1386
+ [data-component~="ui-editor-insert-table-grid"] .insert[data-v-c4064690]:hover {
1368
1387
  filter: brightness(1.05);
1369
1388
  }
1370
- [data-component~="ui-editor-insert-table-grid"][hidden][data-v-daf13b61] {
1389
+ [data-component~="ui-editor-insert-table-grid"][hidden][data-v-c4064690] {
1371
1390
  display: none;
1372
1391
  }
1373
1392
 
1374
- [data-component~="ui-editor-mention-menu"][data-v-e6ede828] {
1393
+ [data-component~="ui-editor-mention-menu"][data-v-2abe407e] {
1375
1394
  user-select: none;
1376
1395
  }
1377
- [data-component~="ui-editor-mention-menu"][data-v-e6ede828] {
1396
+ [data-component~="ui-editor-mention-menu"][data-v-2abe407e] {
1378
1397
  display: flex;
1379
1398
  overflow: hidden;
1380
1399
  flex-direction: column;
1381
- background: var(--ui-surface, #fff);
1382
- border: 1px solid var(--ui-border, #e5e7eb);
1383
- border-radius: var(--ui-radius-xl, 1rem);
1400
+ background: var(--ui-surface);
1401
+ border: 1px solid var(--ui-border);
1402
+ border-radius: var(--ui-radius-dialog);
1384
1403
  box-shadow: var(--ui-shadow-lg, 0 8px 24px rgb(0 0 0 / 0.12));
1385
1404
  }
1386
- .header[data-v-e6ede828] {
1405
+ .header[data-v-2abe407e] {
1387
1406
  display: flex;
1388
1407
  align-items: center;
1389
1408
  justify-content: space-between;
1390
- gap: var(--ui-space-3, 12px);
1391
- padding: var(--ui-space-2, 8px) var(--ui-space-3, 12px);
1392
- color: var(--ui-text-secondary, #4b5563);
1393
- border-bottom: 1px solid var(--ui-border, #e5e7eb);
1394
- font-size: var(--ui-font-size-xs, 0.75rem);
1395
- font-weight: var(--ui-font-semibold, 600);
1409
+ gap: var(--ui-space-3);
1410
+ padding: var(--ui-space-2) var(--ui-space-3);
1411
+ color: var(--ui-text-secondary);
1412
+ border-bottom: 1px solid var(--ui-border);
1413
+ font-size: var(--ui-font-size-xs);
1414
+ font-weight: var(--ui-font-semibold);
1396
1415
  }
1397
- .hint[data-v-e6ede828] {
1416
+ .hint[data-v-2abe407e] {
1398
1417
  overflow: hidden;
1399
- color: var(--ui-text-muted, #6b7280);
1400
- font-weight: var(--ui-font-normal, 400);
1418
+ color: var(--ui-text-muted);
1419
+ font-weight: var(--ui-font-normal);
1401
1420
  text-overflow: ellipsis;
1402
1421
  white-space: nowrap;
1403
1422
  }
1404
- .list[data-v-e6ede828] {
1423
+ .list[data-v-2abe407e] {
1405
1424
  max-height: 280px;
1406
- padding: var(--ui-space-1, 4px) 0;
1425
+ padding: var(--ui-space-1) 0;
1407
1426
  margin: 0;
1408
1427
  overflow-y: auto;
1409
1428
  overscroll-behavior: contain;
1410
1429
  list-style: none;
1411
1430
  }
1412
- .item[data-v-e6ede828] {
1431
+ .item[data-v-2abe407e] {
1413
1432
  display: flex;
1414
1433
  align-items: center;
1415
1434
  min-height: 44px;
1416
- padding: var(--ui-space-1-5, 6px) var(--ui-space-3, 12px);
1417
- gap: var(--ui-space-3, 12px);
1435
+ padding: var(--ui-space-2) var(--ui-space-3);
1436
+ gap: var(--ui-space-3);
1418
1437
  cursor: pointer;
1419
1438
  }
1420
- .item.active[data-v-e6ede828] {
1439
+ .item.active[data-v-2abe407e] {
1421
1440
  background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));
1422
1441
  }
1423
- .avatar[data-v-e6ede828] {
1442
+ .avatar[data-v-2abe407e] {
1424
1443
  display: inline-flex;
1425
1444
  align-items: center;
1426
1445
  justify-content: center;
1427
1446
  width: 32px;
1428
1447
  height: 32px;
1429
1448
  flex: 0 0 auto;
1430
- color: var(--ui-accent-active, var(--ui-accent-solid, #2563eb));
1431
- background: var(--ui-accent-soft, var(--ui-accent-subtle, #eff6ff));
1449
+ color: var(--ui-accent-active, var(--ui-accent-solid));
1450
+ background: var(--ui-accent-soft, var(--ui-accent-subtle));
1432
1451
  border-radius: 999px;
1433
- font-size: var(--ui-font-size-xs, 0.75rem);
1434
- font-weight: var(--ui-font-semibold, 600);
1452
+ font-size: var(--ui-font-size-xs);
1453
+ font-weight: var(--ui-font-semibold);
1435
1454
  }
1436
- .body[data-v-e6ede828] {
1455
+ .body[data-v-2abe407e] {
1437
1456
  display: flex;
1438
1457
  min-width: 0;
1439
1458
  flex-direction: column;
1440
1459
  }
1441
- .label[data-v-e6ede828],
1442
- .detail[data-v-e6ede828] {
1460
+ .label[data-v-2abe407e],
1461
+ .detail[data-v-2abe407e] {
1443
1462
  overflow: hidden;
1444
1463
  text-overflow: ellipsis;
1445
1464
  white-space: nowrap;
1446
1465
  }
1447
- .label[data-v-e6ede828] {
1448
- color: var(--ui-text-primary, #111827);
1449
- font-size: var(--ui-font-size-sm, 0.875rem);
1450
- font-weight: var(--ui-font-medium, 500);
1466
+ .label[data-v-2abe407e] {
1467
+ color: var(--ui-text-primary);
1468
+ font-size: var(--ui-font-size-sm);
1469
+ font-weight: var(--ui-font-medium);
1451
1470
  }
1452
- .detail[data-v-e6ede828],
1453
- .loading[data-v-e6ede828] {
1454
- color: var(--ui-text-muted, #6b7280);
1455
- font-size: var(--ui-font-size-xs, 0.75rem);
1471
+ .detail[data-v-2abe407e],
1472
+ .loading[data-v-2abe407e] {
1473
+ color: var(--ui-text-muted);
1474
+ font-size: var(--ui-font-size-xs);
1456
1475
  }
1457
- .loading[data-v-e6ede828] {
1476
+ .loading[data-v-2abe407e] {
1458
1477
  min-height: 44px;
1459
- padding: var(--ui-space-3, 12px);
1478
+ padding: var(--ui-space-3);
1460
1479
  }
1461
1480
  @media (max-width: 767px) {
1462
- [data-component~="ui-editor-mention-menu"][data-v-e6ede828] {
1481
+ [data-component~="ui-editor-mention-menu"][data-v-2abe407e] {
1463
1482
  border-bottom: 0;
1464
- border-radius: var(--ui-radius-xl, 1rem) var(--ui-radius-xl, 1rem) 0 0;
1483
+ border-radius: var(--ui-radius-dialog) var(--ui-radius-dialog) 0 0;
1465
1484
  }
1466
- .list[data-v-e6ede828] {
1485
+ .list[data-v-2abe407e] {
1467
1486
  max-height: calc(60dvh - 48px);
1468
1487
  }
1469
1488
  }
1470
- [data-component~="ui-editor-mention-menu"][hidden][data-v-e6ede828] {
1489
+ [data-component~="ui-editor-mention-menu"][hidden][data-v-2abe407e] {
1471
1490
  display: none;
1472
1491
  }
1473
1492
 
@@ -1488,159 +1507,159 @@ svg[data-v-b2b50d17] {
1488
1507
  display: none;
1489
1508
  }
1490
1509
 
1491
- [data-component~="ui-editor-slash-menu"][data-v-6616eea5] {
1510
+ [data-component~="ui-editor-slash-menu"][data-v-aeee1d4f] {
1492
1511
  user-select: none;
1493
1512
  }
1494
- [data-component~="ui-editor-slash-menu"][data-v-6616eea5] {
1495
- background: var(--ui-surface, #fff);
1496
- border: 1px solid var(--ui-border, #e5e7eb);
1497
- border-radius: var(--ui-radius-xl, 1rem);
1513
+ [data-component~="ui-editor-slash-menu"][data-v-aeee1d4f] {
1514
+ background: var(--ui-surface);
1515
+ border: 1px solid var(--ui-border);
1516
+ border-radius: var(--ui-radius-dialog);
1498
1517
  box-shadow: var(--ui-shadow-lg, 0 8px 24px rgb(0 0 0 / 0.12));
1499
1518
  overflow: hidden;
1500
1519
  display: flex;
1501
1520
  flex-direction: column;
1502
1521
  }
1503
1522
  @media (max-width: 767px) {
1504
- [data-component~="ui-editor-slash-menu"][data-v-6616eea5] {
1505
- border-radius: var(--ui-radius-xl, 1rem) var(--ui-radius-xl, 1rem) 0 0;
1523
+ [data-component~="ui-editor-slash-menu"][data-v-aeee1d4f] {
1524
+ border-radius: var(--ui-radius-dialog) var(--ui-radius-dialog) 0 0;
1506
1525
  border-bottom: none;
1507
1526
  }
1508
1527
  }
1509
- .header[data-v-6616eea5] {
1528
+ .header[data-v-aeee1d4f] {
1510
1529
  display: none;
1511
1530
  align-items: center;
1512
- gap: var(--ui-space-2, 8px);
1513
- padding: var(--ui-space-3, 12px) var(--ui-space-4, 16px);
1514
- border-bottom: 1px solid var(--ui-border, #e5e7eb);
1515
- font-size: var(--ui-font-size-xs, 0.75rem);
1516
- color: var(--ui-text-muted, #6b7280);
1517
- font-weight: var(--ui-font-semibold, 600);
1531
+ gap: var(--ui-space-2);
1532
+ padding: var(--ui-space-3) var(--ui-space-4);
1533
+ border-bottom: 1px solid var(--ui-border);
1534
+ font-size: var(--ui-font-size-xs);
1535
+ color: var(--ui-text-muted);
1536
+ font-weight: var(--ui-font-semibold);
1518
1537
  text-transform: uppercase;
1519
1538
  letter-spacing: 0.05em;
1520
1539
  }
1521
1540
  @media (max-width: 767px) {
1522
- .header[data-v-6616eea5] {
1541
+ .header[data-v-aeee1d4f] {
1523
1542
  display: flex;
1524
1543
  }
1525
1544
  }
1526
- .header-query[data-v-6616eea5] {
1527
- background: var(--ui-surface-hover, #f3f4f6);
1528
- border-radius: var(--ui-radius-sm, 4px);
1545
+ .header-query[data-v-aeee1d4f] {
1546
+ background: var(--ui-surface-hover);
1547
+ border-radius: var(--ui-radius-sm);
1529
1548
  padding: 0.1em 0.4em;
1530
1549
  font-family: var(--ui-font-family-mono, ui-monospace, monospace);
1531
- font-size: var(--ui-font-size-xs, 0.75rem);
1532
- color: var(--ui-accent, #3b82f6);
1550
+ font-size: var(--ui-font-size-xs);
1551
+ color: var(--ui-accent);
1533
1552
  text-transform: none;
1534
1553
  letter-spacing: 0;
1535
1554
  }
1536
- .list[data-v-6616eea5] {
1555
+ .list[data-v-aeee1d4f] {
1537
1556
  list-style: none;
1538
1557
  margin: 0;
1539
- padding: var(--ui-space-1, 4px) 0;
1558
+ padding: var(--ui-space-1) 0;
1540
1559
  overflow-y: auto;
1541
1560
  max-height: 280px;
1542
1561
  overscroll-behavior: contain;
1543
1562
  }
1544
1563
  @media (max-width: 767px) {
1545
- .list[data-v-6616eea5] {
1564
+ .list[data-v-aeee1d4f] {
1546
1565
  max-height: calc(60dvh - 80px);
1547
- padding: var(--ui-space-1, 4px) 0 var(--ui-space-2, 8px);
1566
+ padding: var(--ui-space-1) 0 var(--ui-space-2);
1548
1567
  }
1549
1568
  }
1550
- .item[data-v-6616eea5] {
1569
+ .item[data-v-aeee1d4f] {
1551
1570
  display: flex;
1552
1571
  align-items: center;
1553
- gap: var(--ui-space-3, 12px);
1554
- padding: var(--ui-space-2, 8px) var(--ui-space-3, 12px);
1572
+ gap: var(--ui-space-3);
1573
+ padding: var(--ui-space-2) var(--ui-space-3);
1555
1574
  min-height: 44px;
1556
1575
  cursor: pointer;
1557
1576
  transition: background-color 120ms ease;
1558
1577
  }
1559
- .item.active[data-v-6616eea5] {
1578
+ .item.active[data-v-aeee1d4f] {
1560
1579
  background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));
1561
1580
  }
1562
- .icon[data-v-6616eea5] {
1581
+ .icon[data-v-aeee1d4f] {
1563
1582
  display: flex;
1564
1583
  align-items: center;
1565
1584
  justify-content: center;
1566
1585
  width: 32px;
1567
1586
  height: 32px;
1568
- background: var(--ui-surface-hover, #f3f4f6);
1569
- border: 1px solid var(--ui-border, #e5e7eb);
1570
- border-radius: var(--ui-radius-md, 6px);
1571
- font-size: var(--ui-font-size-sm, 0.875rem);
1572
- font-weight: var(--ui-font-bold, 700);
1573
- color: var(--ui-text-secondary, #4b5563);
1587
+ background: var(--ui-surface-hover);
1588
+ border: 1px solid var(--ui-border);
1589
+ border-radius: var(--ui-radius-md);
1590
+ font-size: var(--ui-font-size-sm);
1591
+ font-weight: var(--ui-font-bold);
1592
+ color: var(--ui-text-secondary);
1574
1593
  font-family: var(--ui-font-family-mono, ui-monospace, monospace);
1575
1594
  flex-shrink: 0;
1576
1595
  line-height: 1;
1577
1596
  }
1578
- .item.active .icon[data-v-6616eea5] {
1579
- background: var(--ui-accent, #3b82f6);
1580
- border-color: var(--ui-accent, #3b82f6);
1581
- color: var(--ui-accent-contrast, #fff);
1597
+ .item.active .icon[data-v-aeee1d4f] {
1598
+ background: var(--ui-accent);
1599
+ border-color: var(--ui-accent);
1600
+ color: var(--ui-accent-contrast);
1582
1601
  }
1583
- .icon[data-v-6616eea5] {
1602
+ .icon[data-v-aeee1d4f] {
1584
1603
  --ui-icon-size: 1rem;
1585
1604
  --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);
1586
1605
  }
1587
- .body[data-v-6616eea5] {
1606
+ .body[data-v-aeee1d4f] {
1588
1607
  display: flex;
1589
1608
  min-width: 0;
1590
1609
  flex-direction: column;
1591
1610
  gap: 1px;
1592
1611
  }
1593
- .title[data-v-6616eea5] {
1594
- font-size: var(--ui-font-size-sm, 0.875rem);
1595
- font-weight: var(--ui-font-medium, 500);
1596
- color: var(--ui-text, #111827);
1612
+ .title[data-v-aeee1d4f] {
1613
+ font-size: var(--ui-font-size-sm);
1614
+ font-weight: var(--ui-font-medium);
1615
+ color: var(--ui-text);
1597
1616
  white-space: nowrap;
1598
1617
  overflow: hidden;
1599
1618
  text-overflow: ellipsis;
1600
1619
  }
1601
- .description[data-v-6616eea5] {
1602
- font-size: var(--ui-font-size-xs, 0.75rem);
1603
- color: var(--ui-text-muted, #6b7280);
1620
+ .description[data-v-aeee1d4f] {
1621
+ font-size: var(--ui-font-size-xs);
1622
+ color: var(--ui-text-muted);
1604
1623
  white-space: nowrap;
1605
1624
  overflow: hidden;
1606
1625
  text-overflow: ellipsis;
1607
1626
  }
1608
- .footer[data-v-6616eea5] {
1627
+ .footer[data-v-aeee1d4f] {
1609
1628
  display: none;
1610
- padding: var(--ui-space-2, 8px) var(--ui-space-3, 12px);
1611
- border-top: 1px solid var(--ui-border, #e5e7eb);
1612
- font-size: var(--ui-font-size-xs, 0.75rem);
1613
- color: var(--ui-text-muted, #6b7280);
1629
+ padding: var(--ui-space-2) var(--ui-space-3);
1630
+ border-top: 1px solid var(--ui-border);
1631
+ font-size: var(--ui-font-size-xs);
1632
+ color: var(--ui-text-muted);
1614
1633
  }
1615
1634
  @media (min-width: 768px) {
1616
- .footer[data-v-6616eea5] {
1635
+ .footer[data-v-aeee1d4f] {
1617
1636
  display: block;
1618
1637
  }
1619
1638
  }
1620
- [data-component~="ui-editor-slash-menu"] kbd[data-v-6616eea5] {
1639
+ [data-component~="ui-editor-slash-menu"] kbd[data-v-aeee1d4f] {
1621
1640
  display: inline-flex;
1622
1641
  align-items: center;
1623
1642
  justify-content: center;
1624
1643
  font-family: var(--ui-font-family-mono, ui-monospace, monospace);
1625
1644
  font-size: 10px;
1626
- background: var(--ui-surface-hover, #f3f4f6);
1627
- border: 1px solid var(--ui-border, #e5e7eb);
1645
+ background: var(--ui-surface-hover);
1646
+ border: 1px solid var(--ui-border);
1628
1647
  border-radius: 3px;
1629
1648
  padding: 0 3px;
1630
- color: var(--ui-text-secondary, #4b5563);
1649
+ color: var(--ui-text-secondary);
1631
1650
  }
1632
- [data-component~="ui-editor-slash-menu"][hidden][data-v-6616eea5] {
1651
+ [data-component~="ui-editor-slash-menu"][hidden][data-v-aeee1d4f] {
1633
1652
  display: none;
1634
1653
  }
1635
1654
 
1636
- [data-component~="ui-editor-table-context-menu"][data-v-db07efb3] {
1655
+ [data-component~="ui-editor-table-context-menu"][data-v-7c984caf] {
1637
1656
  min-width: 14rem;
1638
1657
  max-width: min(17rem, calc(100vw - 24px));
1639
1658
  max-height: min(28rem, calc(100vh - 24px));
1640
- padding: var(--ui-space-1-5, 6px);
1641
- background: var(--ui-surface, #fff);
1642
- border: 1px solid var(--ui-border, #e5e7eb);
1643
- border-radius: var(--ui-radius-lg, 10px);
1659
+ padding: var(--ui-space-2);
1660
+ background: var(--ui-surface);
1661
+ border: 1px solid var(--ui-border);
1662
+ border-radius: var(--ui-radius-lg);
1644
1663
  box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));
1645
1664
  display: flex;
1646
1665
  flex-direction: column;
@@ -1649,125 +1668,125 @@ svg[data-v-b2b50d17] {
1649
1668
  overscroll-behavior: contain;
1650
1669
  scrollbar-width: thin;
1651
1670
  }
1652
- .section[data-v-db07efb3] {
1671
+ .section[data-v-7c984caf] {
1653
1672
  display: flex;
1654
1673
  flex-direction: column;
1655
1674
  gap: 3px;
1656
1675
  }
1657
- [data-component~="ui-editor-table-context-menu"] button[data-v-db07efb3] {
1676
+ [data-component~="ui-editor-table-context-menu"] button[data-v-7c984caf] {
1658
1677
  display: flex;
1659
1678
  align-items: center;
1660
- gap: var(--ui-space-2, 8px);
1679
+ gap: var(--ui-space-2);
1661
1680
  width: 100%;
1662
1681
  text-align: left;
1663
1682
  min-height: 32px;
1664
- padding: var(--ui-space-1-5, 6px) var(--ui-space-2, 8px);
1683
+ padding: var(--ui-space-2) var(--ui-space-2);
1665
1684
  border: none;
1666
- border-radius: var(--ui-radius-sm, 4px);
1685
+ border-radius: var(--ui-radius-sm);
1667
1686
  background: none;
1668
- font-size: var(--ui-font-size-sm, 0.875rem);
1687
+ font-size: var(--ui-font-size-sm);
1669
1688
  cursor: pointer;
1670
- color: var(--ui-text, #111);
1689
+ color: var(--ui-text);
1671
1690
  }
1672
- [data-component~="ui-editor-table-context-menu"] button[data-v-db07efb3] {
1691
+ [data-component~="ui-editor-table-context-menu"] button[data-v-7c984caf] {
1673
1692
  --ui-icon-size: 1rem;
1674
1693
  --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);
1675
1694
  }
1676
- [data-component~="ui-editor-table-context-menu"] button[data-v-db07efb3]:hover:not(:disabled) {
1677
- background: var(--ui-surface-hover, #f3f4f6);
1695
+ [data-component~="ui-editor-table-context-menu"] button[data-v-7c984caf]:hover:not(:disabled) {
1696
+ background: var(--ui-surface-hover);
1678
1697
  }
1679
- [data-component~="ui-editor-table-context-menu"] button.selected[data-v-db07efb3] {
1698
+ [data-component~="ui-editor-table-context-menu"] button.selected[data-v-7c984caf] {
1680
1699
  background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));
1681
1700
  }
1682
- [data-component~="ui-editor-table-context-menu"] button.danger[data-v-db07efb3] {
1683
- color: var(--ui-danger, #dc2626);
1701
+ [data-component~="ui-editor-table-context-menu"] button.danger[data-v-7c984caf] {
1702
+ color: var(--ui-danger);
1684
1703
  }
1685
- .swatches[data-v-db07efb3] {
1704
+ .swatches[data-v-7c984caf] {
1686
1705
  display: grid;
1687
1706
  grid-template-columns: repeat(3, minmax(0, 1fr));
1688
1707
  gap: 3px;
1689
1708
  }
1690
- .swatch-button[data-v-db07efb3] {
1709
+ .swatch-button[data-v-7c984caf] {
1691
1710
  display: inline-flex;
1692
1711
  align-items: center;
1693
- gap: var(--ui-space-2, 8px);
1712
+ gap: var(--ui-space-2);
1694
1713
  }
1695
- .swatch[data-v-db07efb3] {
1714
+ .swatch[data-v-7c984caf] {
1696
1715
  display: inline-flex;
1697
1716
  width: 1rem;
1698
1717
  height: 1rem;
1699
1718
  border-radius: 999px;
1700
- border: 1px solid var(--ui-border, #d1d5db);
1719
+ border: 1px solid var(--ui-border);
1701
1720
  background: var(--ui-editor-table-context-swatch, #fff);
1702
1721
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.35);
1703
1722
  flex-shrink: 0;
1704
1723
  }
1705
- .swatch.default[data-v-db07efb3] {
1724
+ .swatch.default[data-v-7c984caf] {
1706
1725
  position: relative;
1707
1726
  background:
1708
1727
  linear-gradient(
1709
1728
  135deg,
1710
1729
  transparent calc(50% - 1px),
1711
- var(--ui-text-muted, #6b7280) calc(50% - 1px),
1712
- var(--ui-text-muted, #6b7280) calc(50% + 1px),
1730
+ var(--ui-text-muted) calc(50% - 1px),
1731
+ var(--ui-text-muted) calc(50% + 1px),
1713
1732
  transparent calc(50% + 1px)
1714
1733
  ),
1715
- var(--ui-surface, #fff);
1734
+ var(--ui-surface);
1716
1735
  }
1717
- .swatch-label[data-v-db07efb3] {
1736
+ .swatch-label[data-v-7c984caf] {
1718
1737
  min-width: 0;
1719
1738
  white-space: nowrap;
1720
1739
  }
1721
- .heading[data-v-db07efb3] {
1722
- padding: var(--ui-space-1, 4px) var(--ui-space-2, 8px);
1740
+ .heading[data-v-7c984caf] {
1741
+ padding: var(--ui-space-1) var(--ui-space-2);
1723
1742
  font-size: 0.6875rem;
1724
1743
  font-weight: 700;
1725
1744
  letter-spacing: 0.05em;
1726
1745
  text-transform: uppercase;
1727
- color: var(--ui-text-muted, #6b7280);
1746
+ color: var(--ui-text-muted);
1728
1747
  }
1729
- .sep[data-v-db07efb3] {
1748
+ .sep[data-v-7c984caf] {
1730
1749
  height: 1px;
1731
- background: var(--ui-border, #e5e7eb);
1732
- margin: var(--ui-space-1, 4px) 0;
1750
+ background: var(--ui-border);
1751
+ margin: var(--ui-space-1) 0;
1733
1752
  }
1734
- [data-component~="ui-editor-table-context-menu"][hidden][data-v-db07efb3] {
1753
+ [data-component~="ui-editor-table-context-menu"][hidden][data-v-7c984caf] {
1735
1754
  display: none;
1736
1755
  }
1737
1756
 
1738
- [data-component~="ui-editor-table-overlay"][data-v-a31eb11f] {
1757
+ [data-component~="ui-editor-table-overlay"][data-v-d5963c35] {
1739
1758
  display: block;
1740
1759
  width: 100%;
1741
1760
  height: 100%;
1742
1761
  overflow: visible;
1743
1762
  pointer-events: none;
1744
1763
  }
1745
- [data-component~="ui-editor-table-overlay"][data-v-a31eb11f] {
1764
+ [data-component~="ui-editor-table-overlay"][data-v-d5963c35] {
1746
1765
  position: relative;
1747
1766
  width: 100%;
1748
1767
  height: 100%;
1749
1768
  overflow: visible;
1750
1769
  pointer-events: none;
1751
1770
  }
1752
- .rows[data-v-a31eb11f],
1753
- .cols[data-v-a31eb11f] {
1771
+ .rows[data-v-d5963c35],
1772
+ .cols[data-v-d5963c35] {
1754
1773
  pointer-events: none;
1755
1774
  position: absolute;
1756
1775
  }
1757
- .rows[data-v-a31eb11f] {
1776
+ .rows[data-v-d5963c35] {
1758
1777
  inset: 0;
1759
1778
  width: 100%;
1760
1779
  }
1761
- .cols[data-v-a31eb11f] {
1780
+ .cols[data-v-d5963c35] {
1762
1781
  inset: 0;
1763
1782
  height: 100%;
1764
1783
  }
1765
- .control[data-v-a31eb11f] {
1784
+ .control[data-v-d5963c35] {
1766
1785
  position: absolute;
1767
1786
  z-index: 1;
1768
1787
  pointer-events: none;
1769
1788
  }
1770
- .handle[data-v-a31eb11f] {
1789
+ .handle[data-v-d5963c35] {
1771
1790
  position: absolute;
1772
1791
  display: inline-flex;
1773
1792
  align-items: center;
@@ -1775,10 +1794,10 @@ svg[data-v-b2b50d17] {
1775
1794
  width: 24px;
1776
1795
  height: 24px;
1777
1796
  padding: 0;
1778
- border: 1px solid var(--ui-affordance-near-color, var(--ui-border-strong, #c8c8c4));
1779
- border-radius: var(--ui-radius-round, 999px);
1780
- background: color-mix(in srgb, var(--ui-surface-elevated, #fff) 96%, transparent);
1781
- color: var(--ui-affordance-near-color, var(--ui-text-secondary, #5c5c5c));
1797
+ border: 1px solid var(--ui-affordance-near-color, var(--ui-border-strong));
1798
+ border-radius: var(--ui-radius-round);
1799
+ background: color-mix(in srgb, var(--ui-surface-elevated) 96%, transparent);
1800
+ color: var(--ui-affordance-near-color, var(--ui-text-secondary));
1782
1801
  font: inherit;
1783
1802
  font-size: 16px;
1784
1803
  line-height: 1;
@@ -1786,129 +1805,124 @@ svg[data-v-b2b50d17] {
1786
1805
  opacity: 0;
1787
1806
  scale: 0.72;
1788
1807
  transition:
1789
- opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease),
1790
- scale var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease),
1791
- color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease),
1792
- background-color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1793
- var(--ui-motion-ease, ease),
1794
- border-color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1795
- var(--ui-motion-ease, ease);
1808
+ opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1809
+ scale var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1810
+ color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1811
+ background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1812
+ border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1796
1813
  pointer-events: auto;
1797
1814
  cursor: pointer;
1798
1815
  }
1799
- .handle[data-v-a31eb11f] {
1816
+ .handle[data-v-d5963c35] {
1800
1817
  --ui-icon-size: 14px;
1801
- --ui-icon-stroke-width: var(--ui-editor-table-affordance-icon-stroke-width, 2);
1818
+ --ui-icon-stroke-width: 2;
1802
1819
  }
1803
- .handle[data-ui-proximity="near"][data-v-a31eb11f],
1804
- .control.active .handle[data-v-a31eb11f],
1805
- .handle[data-v-a31eb11f]:focus-visible {
1820
+ .handle[data-ui-proximity="near"][data-v-d5963c35],
1821
+ .control.active .handle[data-v-d5963c35],
1822
+ .handle[data-v-d5963c35]:focus-visible {
1806
1823
  opacity: 1;
1807
1824
  scale: 1;
1808
1825
  }
1809
- .control.active .handle[data-v-a31eb11f],
1810
- .handle[data-v-a31eb11f]:focus-visible {
1811
- border-color: var(--ui-affordance-direct-color, var(--ui-accent-solid, #5b55d6));
1812
- background: var(--ui-affordance-direct-color, var(--ui-accent-solid, #5b55d6));
1813
- color: var(--ui-text-on-accent, #fff);
1826
+ .control.active .handle[data-v-d5963c35],
1827
+ .handle[data-v-d5963c35]:focus-visible {
1828
+ border-color: var(--ui-affordance-direct-color, var(--ui-accent-solid));
1829
+ background: var(--ui-affordance-direct-color, var(--ui-accent-solid));
1830
+ color: var(--ui-text-on-accent);
1814
1831
  box-shadow: var(--ui-shadow-sm, 0 1px 3px rgb(0 0 0 / 0.1));
1815
1832
  }
1816
- .handle[data-v-a31eb11f]:focus-visible,
1817
- .selector[data-v-a31eb11f]:focus-visible,
1818
- .cell-menu[data-v-a31eb11f]:focus-visible {
1819
- outline: 2px solid var(--ui-focus-ring, #5b55d6);
1833
+ .handle[data-v-d5963c35]:focus-visible,
1834
+ .selector[data-v-d5963c35]:focus-visible,
1835
+ .cell-menu[data-v-d5963c35]:focus-visible {
1836
+ outline: 2px solid var(--ui-focus-ring);
1820
1837
  outline-offset: 2px;
1821
1838
  }
1822
- .control.row[data-v-a31eb11f] {
1839
+ .control.row[data-v-d5963c35] {
1823
1840
  left: 0;
1824
1841
  width: 100%;
1825
1842
  height: 0;
1826
1843
  }
1827
- .control.row .handle[data-v-a31eb11f] {
1844
+ .control.row .handle[data-v-d5963c35] {
1828
1845
  top: -12px;
1829
1846
  left: -30px;
1830
1847
  }
1831
- .control.col[data-v-a31eb11f] {
1848
+ .control.col[data-v-d5963c35] {
1832
1849
  top: 0;
1833
1850
  width: 0;
1834
1851
  height: 100%;
1835
1852
  }
1836
- .control.col .handle[data-v-a31eb11f] {
1853
+ .control.col .handle[data-v-d5963c35] {
1837
1854
  top: -30px;
1838
1855
  left: -12px;
1839
1856
  }
1840
- .line[data-v-a31eb11f] {
1857
+ .line[data-v-d5963c35] {
1841
1858
  position: absolute;
1842
- background: var(--ui-affordance-direct-color, var(--ui-accent-solid, #5b55d6));
1859
+ background: var(--ui-affordance-direct-color, var(--ui-accent-solid));
1843
1860
  opacity: 0;
1844
- transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1845
- var(--ui-motion-ease, ease);
1861
+ transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1846
1862
  }
1847
- .control.row .line[data-v-a31eb11f] {
1863
+ .control.row .line[data-v-d5963c35] {
1848
1864
  inset: -1px 0 auto;
1849
1865
  height: 2px;
1850
1866
  }
1851
- .control.col .line[data-v-a31eb11f] {
1867
+ .control.col .line[data-v-d5963c35] {
1852
1868
  inset: 0 auto 0 -1px;
1853
1869
  width: 2px;
1854
1870
  }
1855
- .control.active .line[data-v-a31eb11f] {
1871
+ .control.active .line[data-v-d5963c35] {
1856
1872
  opacity: 0.8;
1857
1873
  }
1858
- .guide[data-v-a31eb11f] {
1874
+ .guide[data-v-d5963c35] {
1859
1875
  position: absolute;
1860
- width: var(--ui-affordance-guide-size, 4px);
1861
- height: var(--ui-affordance-guide-size, 4px);
1862
- border-radius: var(--ui-radius-round, 999px);
1863
- background: var(--ui-affordance-guide-color, var(--ui-border-strong, #c8c8c4));
1864
- opacity: var(--ui-affordance-guide-opacity, 0.42);
1865
- transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1866
- var(--ui-motion-ease, ease);
1876
+ width: var(--ui-affordance-guide-size);
1877
+ height: var(--ui-affordance-guide-size);
1878
+ border-radius: var(--ui-radius-round);
1879
+ background: var(--ui-affordance-guide-color, var(--ui-border-strong));
1880
+ opacity: var(--ui-affordance-guide-opacity);
1881
+ transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1867
1882
  }
1868
- .control.row .guide[data-v-a31eb11f] {
1883
+ .control.row .guide[data-v-d5963c35] {
1869
1884
  left: -10px;
1870
1885
  top: -2px;
1871
1886
  }
1872
- .control.col .guide[data-v-a31eb11f] {
1887
+ .control.col .guide[data-v-d5963c35] {
1873
1888
  left: -2px;
1874
1889
  top: -10px;
1875
1890
  }
1876
- .control:has(.handle[data-ui-proximity="near"]) .guide[data-v-a31eb11f],
1877
- .control.active .guide[data-v-a31eb11f] {
1891
+ .control:has(.handle[data-ui-proximity="near"]) .guide[data-v-d5963c35],
1892
+ .control.active .guide[data-v-d5963c35] {
1878
1893
  opacity: 0;
1879
1894
  }
1880
- .tooltip[data-v-a31eb11f] {
1895
+ .tooltip[data-v-d5963c35] {
1881
1896
  position: absolute;
1882
1897
  z-index: 2;
1883
1898
  top: calc(100% + 6px);
1884
1899
  left: 50%;
1885
1900
  width: max-content;
1886
1901
  max-width: 14rem;
1887
- padding: var(--ui-space-1, 4px) var(--ui-space-2, 8px);
1888
- border-radius: var(--ui-radius-1, 4px);
1889
- background: var(--ui-text-primary, #1a1a1a);
1890
- color: var(--ui-surface-elevated, #fff);
1891
- font-size: var(--ui-font-size-xs, 0.75rem);
1892
- font-weight: var(--ui-font-medium, 500);
1893
- line-height: var(--ui-line-height-md, 1.4);
1902
+ padding: var(--ui-space-1) var(--ui-space-2);
1903
+ border-radius: var(--ui-radius-sm);
1904
+ background: var(--ui-text-primary);
1905
+ color: var(--ui-surface-elevated);
1906
+ font-size: var(--ui-font-size-xs);
1907
+ font-weight: var(--ui-font-medium);
1908
+ line-height: var(--ui-line-height-md);
1894
1909
  opacity: 0;
1895
1910
  transform: translateX(-50%);
1896
- transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1897
- var(--ui-motion-ease, ease);
1911
+ transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1898
1912
  pointer-events: none;
1899
1913
  }
1900
- .control.row .tooltip[data-v-a31eb11f] {
1914
+ .control.row .tooltip[data-v-d5963c35] {
1901
1915
  top: 50%;
1902
1916
  left: auto;
1903
1917
  right: calc(100% + 8px);
1904
1918
  transform: translateY(-50%);
1905
1919
  }
1906
- .control.active .tooltip[data-v-a31eb11f],
1907
- .handle:focus-visible .tooltip[data-v-a31eb11f] {
1920
+ .control.active .tooltip[data-v-d5963c35],
1921
+ .handle:focus-visible .tooltip[data-v-d5963c35] {
1908
1922
  opacity: 1;
1909
1923
  }
1910
- .selector[data-v-a31eb11f],
1911
- .cell-menu[data-v-a31eb11f] {
1924
+ .selector[data-v-d5963c35],
1925
+ .cell-menu[data-v-d5963c35] {
1912
1926
  position: absolute;
1913
1927
  z-index: 2;
1914
1928
  display: inline-flex;
@@ -1917,105 +1931,101 @@ svg[data-v-b2b50d17] {
1917
1931
  padding: 0;
1918
1932
  border: 1px solid transparent;
1919
1933
  background: transparent;
1920
- color: var(--ui-text-secondary, #5c5c5c);
1934
+ color: var(--ui-text-secondary);
1921
1935
  box-shadow: none;
1922
1936
  pointer-events: auto;
1923
1937
  cursor: pointer;
1924
1938
  transition:
1925
- color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease),
1926
- background-color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1927
- var(--ui-motion-ease, ease),
1928
- border-color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1929
- var(--ui-motion-ease, ease),
1930
- box-shadow var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1931
- var(--ui-motion-ease, ease);
1932
- }
1933
- .selector[data-v-a31eb11f]:hover,
1934
- .cell-menu[data-v-a31eb11f]:hover {
1935
- background: var(--ui-icon-button-hover-bg, var(--ui-surface-muted, #f3f4f6));
1936
- color: var(--ui-icon-button-hover-color, var(--ui-text-primary, #1a1a1a));
1939
+ color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1940
+ background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1941
+ border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1942
+ box-shadow var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1943
+ }
1944
+ .selector[data-v-d5963c35]:hover,
1945
+ .cell-menu[data-v-d5963c35]:hover {
1946
+ background: var(--ui-icon-button-hover-surface, var(--ui-surface-muted));
1947
+ color: var(--ui-icon-button-hover-text, var(--ui-text-primary));
1937
1948
  box-shadow: var(--ui-shadow-xs, 0 1px 2px rgb(0 0 0 / 0.05));
1938
1949
  }
1939
- .selector[data-v-a31eb11f] {
1940
- border-radius: var(--ui-radius-round, 999px);
1950
+ .selector[data-v-d5963c35] {
1951
+ border-radius: var(--ui-radius-round);
1941
1952
  }
1942
- .selector[data-v-a31eb11f]::before {
1953
+ .selector[data-v-d5963c35]::before {
1943
1954
  content: "";
1944
1955
  position: absolute;
1945
1956
  inset: 50% auto auto 50%;
1946
- border-radius: var(--ui-radius-round, 999px);
1947
- background: var(--ui-affordance-guide-color, var(--ui-border-strong, #c8c8c4));
1948
- opacity: var(--ui-affordance-guide-opacity, 0.42);
1957
+ border-radius: var(--ui-radius-round);
1958
+ background: var(--ui-affordance-guide-color, var(--ui-border-strong));
1959
+ opacity: var(--ui-affordance-guide-opacity);
1949
1960
  transform: translate(-50%, -50%);
1950
- transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
1951
- var(--ui-motion-ease, ease);
1961
+ transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1952
1962
  pointer-events: none;
1953
1963
  }
1954
- .selector .glyph[data-v-a31eb11f] {
1964
+ .selector .glyph[data-v-d5963c35] {
1955
1965
  display: block;
1956
1966
  width: 14px;
1957
1967
  height: 14px;
1958
1968
  --ui-icon-size: 14px;
1959
- --ui-icon-stroke-width: var(--ui-editor-table-affordance-icon-stroke-width, 2);
1969
+ --ui-icon-stroke-width: 2;
1960
1970
  opacity: 0;
1961
1971
  transform: scale(0.72);
1962
1972
  transition:
1963
- opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease),
1964
- transform var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease);
1973
+ opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
1974
+ transform var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
1965
1975
  }
1966
- .selector[data-v-a31eb11f]:hover::before,
1967
- .selector[data-v-a31eb11f]:focus-visible::before {
1976
+ .selector[data-v-d5963c35]:hover::before,
1977
+ .selector[data-v-d5963c35]:focus-visible::before {
1968
1978
  opacity: 0;
1969
1979
  }
1970
- .selector:hover .glyph[data-v-a31eb11f],
1971
- .selector:focus-visible .glyph[data-v-a31eb11f] {
1980
+ .selector:hover .glyph[data-v-d5963c35],
1981
+ .selector:focus-visible .glyph[data-v-d5963c35] {
1972
1982
  opacity: 1;
1973
1983
  transform: scale(1);
1974
1984
  }
1975
- .selector.row[data-v-a31eb11f] {
1985
+ .selector.row[data-v-d5963c35] {
1976
1986
  left: -9px;
1977
1987
  width: 18px;
1978
1988
  height: 32px;
1979
1989
  transform: translateY(-50%);
1980
1990
  }
1981
- .selector.row[data-v-a31eb11f]::before {
1991
+ .selector.row[data-v-d5963c35]::before {
1982
1992
  width: 2px;
1983
1993
  height: 16px;
1984
1994
  }
1985
- .selector.column[data-v-a31eb11f] {
1995
+ .selector.column[data-v-d5963c35] {
1986
1996
  top: -9px;
1987
1997
  width: 32px;
1988
1998
  height: 18px;
1989
1999
  transform: translateX(-50%);
1990
2000
  }
1991
- .selector.column[data-v-a31eb11f]::before {
2001
+ .selector.column[data-v-d5963c35]::before {
1992
2002
  width: 16px;
1993
2003
  height: 2px;
1994
2004
  }
1995
2005
  @media (hover: none), (pointer: coarse) {
1996
- .selector[data-v-a31eb11f]::before {
2006
+ .selector[data-v-d5963c35]::before {
1997
2007
  opacity: 0;
1998
2008
  }
1999
- .selector .glyph[data-v-a31eb11f] {
2009
+ .selector .glyph[data-v-d5963c35] {
2000
2010
  opacity: 1;
2001
2011
  transform: none;
2002
2012
  }
2003
2013
  }
2004
- .cell-menu[data-v-a31eb11f] {
2014
+ .cell-menu[data-v-d5963c35] {
2005
2015
  width: 24px;
2006
2016
  height: 24px;
2007
- border-radius: var(--ui-radius-1, 4px);
2008
- background: color-mix(in srgb, var(--ui-surface-muted, #f3f4f6) 78%, transparent);
2017
+ border-radius: var(--ui-radius-sm);
2018
+ background: color-mix(in srgb, var(--ui-surface-muted) 78%, transparent);
2009
2019
  }
2010
- .cell-menu[data-v-a31eb11f] {
2020
+ .cell-menu[data-v-d5963c35] {
2011
2021
  --ui-icon-size: 15px;
2012
- --ui-icon-stroke-width: var(--ui-editor-table-affordance-icon-stroke-width, 2);
2022
+ --ui-icon-stroke-width: 2;
2013
2023
  }
2014
- [data-component~="ui-editor-table-overlay"][hidden][data-v-a31eb11f] {
2024
+ [data-component~="ui-editor-table-overlay"][hidden][data-v-d5963c35] {
2015
2025
  display: none;
2016
2026
  }
2017
2027
 
2018
- .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"][data-v-b2b27930] {
2028
+ .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"][data-v-c7ed049b] {
2019
2029
  min-width: max-content;
2020
2030
  min-height: 100%;
2021
2031
  padding: 0;
@@ -2025,160 +2035,160 @@ svg[data-v-b2b50d17] {
2025
2035
  box-shadow: none;
2026
2036
  backdrop-filter: none;
2027
2037
  }
2028
- .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] button[data-v-b2b27930] {
2038
+ .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] button[data-v-c7ed049b] {
2029
2039
  min-height: 44px;
2030
2040
  background: transparent;
2031
2041
  }
2032
- .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] button.active[data-v-b2b27930],
2033
- .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] button.selected[data-v-b2b27930] {
2034
- background: var(--ui-accent-soft, var(--ui-accent-subtle, #e8f0fb));
2042
+ .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] button.active[data-v-c7ed049b],
2043
+ .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] button.selected[data-v-c7ed049b] {
2044
+ background: var(--ui-accent-soft, var(--ui-accent-subtle));
2035
2045
  }
2036
- .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] .menu[data-v-b2b27930] {
2046
+ .looma-editor__mobile-toolbar-shell [data-component~="ui-editor-table-toolbar"] .menu[data-v-c7ed049b] {
2037
2047
  top: auto;
2038
2048
  right: 0;
2039
- bottom: calc(100% + var(--ui-space-2, 8px));
2049
+ bottom: calc(100% + var(--ui-space-2));
2040
2050
  max-height: min(50dvh, 22rem);
2041
2051
  overflow-y: auto;
2042
2052
  overscroll-behavior: contain;
2043
2053
  }
2044
- [data-component~="ui-editor-table-toolbar"][data-v-b2b27930] {
2054
+ [data-component~="ui-editor-table-toolbar"][data-v-c7ed049b] {
2045
2055
  display: inline-flex;
2046
2056
  align-items: center;
2047
- gap: var(--ui-space-1, 4px);
2048
- padding: var(--ui-space-1, 4px);
2049
- background: color-mix(in srgb, var(--ui-surface, #fff) 94%, transparent);
2050
- border: 1px solid var(--ui-border, #e5e7eb);
2051
- border-radius: calc(var(--ui-radius-md, 6px) + 2px);
2057
+ gap: var(--ui-space-1);
2058
+ padding: var(--ui-space-1);
2059
+ background: color-mix(in srgb, var(--ui-surface) 94%, transparent);
2060
+ border: 1px solid var(--ui-border);
2061
+ border-radius: calc(var(--ui-radius-md) + 2px);
2052
2062
  box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));
2053
2063
  backdrop-filter: blur(10px);
2054
2064
  }
2055
- .group[data-v-b2b27930] {
2065
+ .group[data-v-c7ed049b] {
2056
2066
  display: inline-flex;
2057
2067
  align-items: center;
2058
2068
  gap: 2px;
2059
2069
  overflow: hidden;
2060
2070
  }
2061
- .sep[data-v-b2b27930] {
2071
+ .sep[data-v-c7ed049b] {
2062
2072
  width: 1px;
2063
2073
  align-self: stretch;
2064
- background: var(--ui-border, #e5e7eb);
2074
+ background: var(--ui-border);
2065
2075
  }
2066
- .overflow[data-v-b2b27930] {
2076
+ .overflow[data-v-c7ed049b] {
2067
2077
  position: relative;
2068
2078
  }
2069
- [data-component~="ui-editor-table-toolbar"] button[data-v-b2b27930] {
2079
+ [data-component~="ui-editor-table-toolbar"] button[data-v-c7ed049b] {
2070
2080
  display: inline-flex;
2071
2081
  align-items: center;
2072
2082
  justify-content: center;
2073
- gap: var(--ui-space-1-5, 6px);
2083
+ gap: var(--ui-space-2);
2074
2084
  min-height: 32px;
2075
2085
  border: 0;
2076
- border-radius: var(--ui-radius-sm, 4px);
2086
+ border-radius: var(--ui-radius-sm);
2077
2087
  background: transparent;
2078
- color: var(--ui-text-primary, #111827);
2088
+ color: var(--ui-text-primary);
2079
2089
  cursor: pointer;
2080
- font-size: var(--ui-text-sm, 0.875rem);
2090
+ font-size: var(--ui-font-size-sm);
2081
2091
  font-weight: 500;
2082
2092
  line-height: 1;
2083
- padding: var(--ui-space-1-5, 6px) var(--ui-space-2, 8px);
2093
+ padding: var(--ui-space-2) var(--ui-space-2);
2084
2094
  white-space: nowrap;
2085
2095
  }
2086
- [data-component~="ui-editor-table-toolbar"] button[data-v-b2b27930]:hover {
2087
- background: var(--ui-surface-hover, #f3f4f6);
2096
+ [data-component~="ui-editor-table-toolbar"] button[data-v-c7ed049b]:hover {
2097
+ background: var(--ui-surface-hover);
2088
2098
  }
2089
- [data-component~="ui-editor-table-toolbar"] button.active[data-v-b2b27930] {
2090
- background: var(--ui-accent-soft, var(--ui-accent-subtle, #e8f0fb));
2091
- color: var(--ui-accent-active, #003d7a);
2099
+ [data-component~="ui-editor-table-toolbar"] button.active[data-v-c7ed049b] {
2100
+ background: var(--ui-accent-soft, var(--ui-accent-subtle));
2101
+ color: var(--ui-accent-active);
2092
2102
  }
2093
- .group button[data-v-b2b27930] {
2094
- border-radius: var(--ui-radius-sm, 4px);
2103
+ .group button[data-v-c7ed049b] {
2104
+ border-radius: var(--ui-radius-sm);
2095
2105
  }
2096
- .group button + button[data-v-b2b27930] {
2106
+ .group button + button[data-v-c7ed049b] {
2097
2107
  border-left: 0;
2098
2108
  }
2099
- [data-component~="ui-editor-table-toolbar"] .more[data-v-b2b27930] {
2109
+ [data-component~="ui-editor-table-toolbar"] .more[data-v-c7ed049b] {
2100
2110
  border: 0;
2101
- border-radius: var(--ui-radius-sm, 4px);
2111
+ border-radius: var(--ui-radius-sm);
2102
2112
  }
2103
- [data-component~="ui-editor-table-toolbar"] button.danger[data-v-b2b27930] {
2104
- color: var(--ui-danger, #dc2626);
2113
+ [data-component~="ui-editor-table-toolbar"] button.danger[data-v-c7ed049b] {
2114
+ color: var(--ui-danger);
2105
2115
  }
2106
- [data-component~="ui-editor-table-toolbar"][data-v-b2b27930] {
2116
+ [data-component~="ui-editor-table-toolbar"][data-v-c7ed049b] {
2107
2117
  --ui-icon-size: var(--ui-editor-toolbar-icon-size, 1rem);
2108
2118
  --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);
2109
2119
  }
2110
- .chevron[data-v-b2b27930] {
2120
+ .chevron[data-v-c7ed049b] {
2111
2121
  display: inline-flex;
2112
2122
  --ui-icon-size: 0.875rem;
2113
2123
  }
2114
- [data-component~="ui-editor-table-toolbar"] .icon-button[data-v-b2b27930] {
2124
+ [data-component~="ui-editor-table-toolbar"] .icon-button[data-v-c7ed049b] {
2115
2125
  width: 32px;
2116
2126
  padding-inline: 0;
2117
2127
  }
2118
- .menu[data-v-b2b27930] {
2128
+ .menu[data-v-c7ed049b] {
2119
2129
  position: absolute;
2120
- top: calc(100% + var(--ui-space-2, 8px));
2130
+ top: calc(100% + var(--ui-space-2));
2121
2131
  right: 0;
2122
2132
  min-width: 12rem;
2123
- padding: var(--ui-space-1, 4px);
2124
- background: var(--ui-surface, #fff);
2125
- border: 1px solid var(--ui-border, #e5e7eb);
2126
- border-radius: var(--ui-radius-md, 6px);
2133
+ padding: var(--ui-space-1);
2134
+ background: var(--ui-surface);
2135
+ border: 1px solid var(--ui-border);
2136
+ border-radius: var(--ui-radius-md);
2127
2137
  box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));
2128
2138
  display: flex;
2129
2139
  flex-direction: column;
2130
2140
  gap: 2px;
2131
2141
  z-index: 2;
2132
2142
  }
2133
- .menu-section + .menu-section[data-v-b2b27930] {
2134
- margin-top: var(--ui-space-1, 4px);
2135
- padding-top: var(--ui-space-1, 4px);
2136
- border-top: 1px solid color-mix(in srgb, var(--ui-border, #e5e7eb) 80%, transparent);
2143
+ .menu-section + .menu-section[data-v-c7ed049b] {
2144
+ margin-top: var(--ui-space-1);
2145
+ padding-top: var(--ui-space-1);
2146
+ border-top: 1px solid color-mix(in srgb, var(--ui-border) 80%, transparent);
2137
2147
  }
2138
- .menu-heading[data-v-b2b27930] {
2139
- padding: var(--ui-space-1, 4px) var(--ui-space-2, 8px);
2148
+ .menu-heading[data-v-c7ed049b] {
2149
+ padding: var(--ui-space-1) var(--ui-space-2);
2140
2150
  font-size: 0.6875rem;
2141
2151
  font-weight: 700;
2142
2152
  letter-spacing: 0.05em;
2143
2153
  text-transform: uppercase;
2144
- color: var(--ui-text-muted, #6b7280);
2154
+ color: var(--ui-text-muted);
2145
2155
  }
2146
- .menu button[data-v-b2b27930] {
2156
+ .menu button[data-v-c7ed049b] {
2147
2157
  display: flex;
2148
2158
  justify-content: flex-start;
2149
2159
  width: 100%;
2150
2160
  text-align: left;
2151
2161
  }
2152
- .swatches[data-v-b2b27930] {
2162
+ .swatches[data-v-c7ed049b] {
2153
2163
  display: grid;
2154
2164
  grid-template-columns: repeat(3, minmax(0, 1fr));
2155
2165
  gap: 2px;
2156
2166
  }
2157
- [data-component~="ui-editor-table-toolbar"] .swatch-button[data-v-b2b27930] {
2158
- gap: var(--ui-space-1, 4px);
2167
+ [data-component~="ui-editor-table-toolbar"] .swatch-button[data-v-c7ed049b] {
2168
+ gap: var(--ui-space-1);
2159
2169
  justify-content: flex-start;
2160
2170
  }
2161
- .swatch[data-v-b2b27930] {
2171
+ .swatch[data-v-c7ed049b] {
2162
2172
  width: 14px;
2163
2173
  height: 14px;
2164
2174
  flex: 0 0 14px;
2165
- border: 1px solid color-mix(in srgb, var(--ui-border, #e5e7eb) 80%, #000);
2175
+ border: 1px solid color-mix(in srgb, var(--ui-border) 80%, #000);
2166
2176
  border-radius: 3px;
2167
2177
  background: var(--ui-editor-table-toolbar-swatch);
2168
2178
  }
2169
- .swatch.default[data-v-b2b27930] {
2179
+ .swatch.default[data-v-c7ed049b] {
2170
2180
  background:
2171
- linear-gradient(135deg, transparent 44%, var(--ui-danger, #dc2626) 46% 54%, transparent 56%),
2172
- var(--ui-surface, #fff);
2181
+ linear-gradient(135deg, transparent 44%, var(--ui-danger) 46% 54%, transparent 56%),
2182
+ var(--ui-surface);
2173
2183
  }
2174
- .swatch-button.selected[data-v-b2b27930] {
2175
- background: var(--ui-accent-soft, var(--ui-accent-subtle, #e8f0fb));
2184
+ .swatch-button.selected[data-v-c7ed049b] {
2185
+ background: var(--ui-accent-soft, var(--ui-accent-subtle));
2176
2186
  }
2177
- [data-component~="ui-editor-table-toolbar"][hidden][data-v-b2b27930] {
2187
+ [data-component~="ui-editor-table-toolbar"][hidden][data-v-c7ed049b] {
2178
2188
  display: none;
2179
2189
  }
2180
2190
 
2181
- [data-component~="ui-editor-toolbar"][data-v-890a1e69] {
2191
+ [data-component~="ui-editor-toolbar"][data-v-472b5c16] {
2182
2192
  position: sticky;
2183
2193
  top: 0;
2184
2194
  z-index: var(--ui-editor-toolbar-z-index, 10);
@@ -2192,23 +2202,23 @@ svg[data-v-b2b50d17] {
2192
2202
  overflow-x: auto;
2193
2203
  scrollbar-width: none;
2194
2204
  white-space: nowrap;
2195
- background: var(--ui-editor-toolbar-bg, var(--ui-surface, #fff));
2196
- border-bottom: 1px solid var(--ui-editor-toolbar-border, var(--ui-border, #e5e7eb));
2205
+ background: var(--ui-editor-toolbar-surface, var(--ui-surface));
2206
+ border-bottom: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));
2197
2207
  }
2198
- [data-component~="ui-editor-toolbar"][data-v-890a1e69]::-webkit-scrollbar {
2208
+ [data-component~="ui-editor-toolbar"][data-v-472b5c16]::-webkit-scrollbar {
2199
2209
  display: none;
2200
2210
  }
2201
- [data-component~="ui-editor-toolbar"] > [data-v-890a1e69-s] {
2211
+ [data-component~="ui-editor-toolbar"] > [data-v-472b5c16-s] {
2202
2212
  flex: 0 0 auto;
2203
2213
  }
2204
- .divider[data-v-890a1e69-s] {
2214
+ .divider[data-v-472b5c16-s] {
2205
2215
  width: 1px;
2206
2216
  height: 20px;
2207
- background: var(--ui-editor-toolbar-divider, var(--ui-border, #e5e7eb));
2217
+ background: var(--ui-editor-toolbar-divider, var(--ui-border));
2208
2218
  flex-shrink: 0;
2209
2219
  margin: 0 var(--ui-editor-toolbar-divider-margin, 4px);
2210
2220
  }
2211
- [data-component~="ui-editor-toolbar"][data-ui-editor-toolbar-state~="floating"][data-v-890a1e69] {
2221
+ [data-component~="ui-editor-toolbar"][data-ui-editor-toolbar-state~="floating"][data-v-472b5c16] {
2212
2222
  position: static;
2213
2223
  top: auto;
2214
2224
  width: max-content;
@@ -2218,11 +2228,11 @@ svg[data-v-b2b50d17] {
2218
2228
  overflow-x: visible;
2219
2229
  background: color-mix(
2220
2230
  in srgb,
2221
- var(--ui-editor-toolbar-bg, var(--ui-surface, #fff)) 96%,
2231
+ var(--ui-editor-toolbar-surface, var(--ui-surface)) 96%,
2222
2232
  transparent
2223
2233
  );
2224
- border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border, #e5e7eb));
2225
- border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg, 10px));
2234
+ border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));
2235
+ border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));
2226
2236
  box-shadow: var(
2227
2237
  --ui-editor-toolbar-floating-shadow,
2228
2238
  var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12))
@@ -2230,23 +2240,23 @@ svg[data-v-b2b50d17] {
2230
2240
  backdrop-filter: blur(10px);
2231
2241
  }
2232
2242
  @media (max-width: 767px) {
2233
- [data-component~="ui-editor-toolbar"][data-v-890a1e69] {
2243
+ [data-component~="ui-editor-toolbar"][data-v-472b5c16] {
2234
2244
  position: fixed;
2235
2245
  top: auto;
2236
2246
  bottom: env(safe-area-inset-bottom);
2237
2247
  left: 0;
2238
2248
  right: 0;
2239
2249
  min-height: var(--ui-editor-toolbar-mobile-min-height, 56px);
2240
- border-top: 1px solid var(--ui-editor-toolbar-border, var(--ui-border, #e5e7eb));
2250
+ border-top: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));
2241
2251
  border-bottom: none;
2242
2252
  box-shadow: var(--ui-editor-toolbar-mobile-shadow, 0 -2px 8px rgb(0 0 0 / 0.06));
2243
2253
  }
2244
- [data-component~="ui-editor-toolbar"][data-ui-editor-toolbar-state~="floating"][data-v-890a1e69] {
2254
+ [data-component~="ui-editor-toolbar"][data-ui-editor-toolbar-state~="floating"][data-v-472b5c16] {
2245
2255
  position: static;
2246
2256
  inset: auto;
2247
2257
  min-height: auto;
2248
- border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border, #e5e7eb));
2249
- border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg, 10px));
2258
+ border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));
2259
+ border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));
2250
2260
  box-shadow: var(
2251
2261
  --ui-editor-toolbar-floating-shadow,
2252
2262
  var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12))
@@ -2255,7 +2265,7 @@ svg[data-v-b2b50d17] {
2255
2265
  }
2256
2266
 
2257
2267
  /* Inside LoomaEditor's sticky shell, the shell is the sticky surface. */
2258
- .looma-editor__sticky-toolbar-shell [data-component~="ui-editor-toolbar"][data-v-890a1e69] {
2268
+ .looma-editor__sticky-toolbar-shell [data-component~="ui-editor-toolbar"][data-v-472b5c16] {
2259
2269
  position: static;
2260
2270
  min-height: var(--ui-editor-toolbar-min-height, 48px);
2261
2271
  overscroll-behavior-inline: contain;
@@ -2266,7 +2276,7 @@ svg[data-v-b2b50d17] {
2266
2276
 
2267
2277
  /* Inside LoomaEditor's mobile shell, the toolbar is a scroll-snapping strip. */
2268
2278
  .looma-editor__mobile-toolbar-shell
2269
- [data-component~="ui-editor-toolbar"][data-ui-editor-toolbar-state~="floating"][data-v-890a1e69] {
2279
+ [data-component~="ui-editor-toolbar"][data-ui-editor-toolbar-state~="floating"][data-v-472b5c16] {
2270
2280
  width: 100%;
2271
2281
  max-width: none;
2272
2282
  min-height: 100%;
@@ -2283,25 +2293,26 @@ svg[data-v-b2b50d17] {
2283
2293
  }
2284
2294
 
2285
2295
  /* A component that sets its display still honours the hidden attribute on its root. */
2286
- [data-component~="ui-editor-toolbar"][hidden][data-v-890a1e69] {
2296
+ [data-component~="ui-editor-toolbar"][hidden][data-v-472b5c16] {
2287
2297
  display: none;
2288
2298
  }
2289
2299
 
2290
- [data-component~="ui-floating-action-button"][data-v-a6b9e9ca] {
2300
+ [data-component~="ui-floating-action-button"][data-v-b66a2428] {
2291
2301
  position: fixed;
2292
2302
  inset-block-end: calc(
2293
- var(--ui-floating-action-button-bottom, var(--ui-space-6, 1.5rem)) + env(safe-area-inset-bottom)
2303
+ var(--ui-floating-action-button-inset-block-end, var(--ui-space-6)) +
2304
+ env(safe-area-inset-bottom)
2294
2305
  );
2295
2306
  inset-inline-end: max(
2296
- var(--ui-floating-action-button-inline-end, var(--ui-space-5, 1.25rem)),
2307
+ var(--ui-floating-action-button-inset-inline-end, var(--ui-space-5)),
2297
2308
  env(safe-area-inset-right)
2298
2309
  );
2299
- inline-size: var(--ui-floating-action-button-size, 56px);
2300
- block-size: var(--ui-floating-action-button-size, 56px);
2310
+ inline-size: var(--ui-control-min-block-size);
2311
+ block-size: var(--ui-control-min-block-size);
2301
2312
  display: inline-flex;
2302
2313
  z-index: var(--ui-floating-action-button-z-index, 100);
2303
2314
  }
2304
- [data-component~="ui-floating-action-button"][data-v-a6b9e9ca] {
2315
+ [data-component~="ui-floating-action-button"][data-v-b66a2428] {
2305
2316
  appearance: none;
2306
2317
  border: none;
2307
2318
  border-radius: 999px;
@@ -2310,49 +2321,43 @@ svg[data-v-b2b50d17] {
2310
2321
  display: inline-flex;
2311
2322
  align-items: center;
2312
2323
  justify-content: center;
2313
- background: var(--ui-floating-action-button-bg, var(--ui-accent-solid));
2314
- color: var(--ui-floating-action-button-color, var(--ui-text-on-accent));
2315
- box-shadow: var(
2316
- --ui-floating-action-button-shadow,
2317
- 0 4px 12px color-mix(in srgb, var(--ui-accent-solid) 40%, transparent)
2318
- );
2324
+ background: var(--ui-accent);
2325
+ color: var(--ui-on-accent);
2326
+ box-shadow: 0 4px 12px color-mix(in srgb, var(--ui-accent) 40%, transparent);
2319
2327
  cursor: pointer;
2320
2328
  transition:
2321
- background-color var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease),
2322
- transform var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease),
2323
- box-shadow var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease);
2329
+ background-color var(--ui-motion-fast) var(--ui-motion-ease),
2330
+ transform var(--ui-motion-fast) var(--ui-motion-ease),
2331
+ box-shadow var(--ui-motion-fast) var(--ui-motion-ease);
2324
2332
  }
2325
- [data-component~="ui-floating-action-button"][data-v-a6b9e9ca]:hover:enabled {
2326
- background: var(--ui-floating-action-button-hover-bg, var(--ui-accent-hover));
2327
- box-shadow: var(
2328
- --ui-floating-action-button-hover-shadow,
2329
- 0 6px 16px color-mix(in srgb, var(--ui-accent-solid) 50%, transparent)
2330
- );
2333
+ [data-component~="ui-floating-action-button"][data-v-b66a2428]:hover:enabled {
2334
+ background: var(--ui-accent-hover);
2335
+ box-shadow: 0 6px 16px color-mix(in srgb, var(--ui-accent) 50%, transparent);
2331
2336
  }
2332
- [data-component~="ui-floating-action-button"][data-v-a6b9e9ca]:active:enabled {
2333
- transform: scale(var(--ui-floating-action-button-active-scale, 0.94));
2337
+ [data-component~="ui-floating-action-button"][data-v-b66a2428]:active:enabled {
2338
+ transform: scale(0.94);
2334
2339
  }
2335
- [data-component~="ui-floating-action-button"][data-v-a6b9e9ca]:focus-visible {
2336
- outline: 2px solid var(--ui-focus-ring, currentColor);
2340
+ [data-component~="ui-floating-action-button"][data-v-b66a2428]:focus-visible {
2341
+ outline: 2px solid var(--ui-focus-ring);
2337
2342
  outline-offset: 2px;
2338
2343
  }
2339
- [data-component~="ui-floating-action-button"][data-v-a6b9e9ca]:disabled {
2344
+ [data-component~="ui-floating-action-button"][data-v-b66a2428]:disabled {
2340
2345
  opacity: 0.6;
2341
2346
  cursor: not-allowed;
2342
2347
  }
2343
- svg[data-v-a6b9e9ca-s] {
2344
- inline-size: var(--ui-floating-action-button-icon-size, 24px);
2345
- block-size: var(--ui-floating-action-button-icon-size, 24px);
2348
+ svg[data-v-b66a2428-s] {
2349
+ inline-size: var(--ui-icon-size-lg);
2350
+ block-size: var(--ui-icon-size-lg);
2346
2351
  flex-shrink: 0;
2347
2352
  }
2348
2353
  @media (min-width: 768px) {
2349
- [data-component~="ui-floating-action-button"][data-ui-floating-action-button-state~="mobileOnly"][data-v-a6b9e9ca] {
2354
+ [data-component~="ui-floating-action-button"][data-ui-floating-action-button-state~="mobileOnly"][data-v-b66a2428] {
2350
2355
  display: none;
2351
2356
  }
2352
2357
  }
2353
2358
 
2354
2359
  /* A component that sets its display still honours the hidden attribute on its root. */
2355
- [data-component~="ui-floating-action-button"][hidden][data-v-a6b9e9ca] {
2360
+ [data-component~="ui-floating-action-button"][hidden][data-v-b66a2428] {
2356
2361
  display: none;
2357
2362
  }
2358
2363
 
@@ -2393,8 +2398,8 @@ svg[data-v-a6b9e9ca-s] {
2393
2398
  display: none;
2394
2399
  }
2395
2400
 
2396
- [data-component~="ui-grid"][data-v-c390a71d] {
2397
- --_grid-gap: var(--ui-space-4, 1rem);
2401
+ [data-component~="ui-grid"][data-v-356b2957] {
2402
+ --_grid-gap: var(--ui-space-4);
2398
2403
  --_grid-min: 12rem;
2399
2404
  display: grid;
2400
2405
  gap: var(--ui-grid-gap, var(--_grid-gap));
@@ -2404,50 +2409,50 @@ svg[data-v-a6b9e9ca-s] {
2404
2409
  max-inline-size: 100%;
2405
2410
  margin: 0;
2406
2411
  }
2407
- [data-component~="ui-grid"][data-ui-grid-state~="gap=xs"][data-v-c390a71d] {
2408
- --_grid-gap: var(--ui-space-2, 0.5rem);
2412
+ [data-component~="ui-grid"][data-ui-grid-state~="gap=xs"][data-v-356b2957] {
2413
+ --_grid-gap: var(--ui-space-2);
2409
2414
  }
2410
- [data-component~="ui-grid"][data-ui-grid-state~="gap=s"][data-v-c390a71d] {
2411
- --_grid-gap: var(--ui-space-3, 0.75rem);
2415
+ [data-component~="ui-grid"][data-ui-grid-state~="gap=s"][data-v-356b2957] {
2416
+ --_grid-gap: var(--ui-space-3);
2412
2417
  }
2413
- [data-component~="ui-grid"][data-ui-grid-state~="gap=m"][data-v-c390a71d] {
2414
- --_grid-gap: var(--ui-space-4, 1rem);
2418
+ [data-component~="ui-grid"][data-ui-grid-state~="gap=m"][data-v-356b2957] {
2419
+ --_grid-gap: var(--ui-space-4);
2415
2420
  }
2416
- [data-component~="ui-grid"][data-ui-grid-state~="gap=l"][data-v-c390a71d] {
2417
- --_grid-gap: var(--ui-space-5, 1.5rem);
2421
+ [data-component~="ui-grid"][data-ui-grid-state~="gap=l"][data-v-356b2957] {
2422
+ --_grid-gap: var(--ui-space-5);
2418
2423
  }
2419
- [data-component~="ui-grid"][data-ui-grid-state~="gap=xl"][data-v-c390a71d] {
2420
- --_grid-gap: var(--ui-space-6, 2rem);
2424
+ [data-component~="ui-grid"][data-ui-grid-state~="gap=xl"][data-v-356b2957] {
2425
+ --_grid-gap: var(--ui-space-6);
2421
2426
  }
2422
- [data-component~="ui-grid"][data-ui-grid-state~="min=md"][data-v-c390a71d] {
2427
+ [data-component~="ui-grid"][data-ui-grid-state~="min=md"][data-v-356b2957] {
2423
2428
  --_grid-min: 16rem;
2424
2429
  }
2425
- [data-component~="ui-grid"][data-ui-grid-state~="min=lg"][data-v-c390a71d] {
2430
+ [data-component~="ui-grid"][data-ui-grid-state~="min=lg"][data-v-356b2957] {
2426
2431
  --_grid-min: 20rem;
2427
2432
  }
2428
2433
 
2429
2434
  /* A component that sets its display still honours the hidden attribute on its root. */
2430
- [data-component~="ui-grid"][hidden][data-v-c390a71d] {
2435
+ [data-component~="ui-grid"][hidden][data-v-356b2957] {
2431
2436
  display: none;
2432
2437
  }
2433
2438
 
2434
- [data-component~="ui-icon-button"][data-v-9ff7e192] {
2439
+ [data-component~="ui-icon-button"][data-v-ab2df1cc] {
2435
2440
  display: inline-flex;
2436
2441
  color: var(--ui-text-secondary);
2437
2442
  }
2438
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-9ff7e192] {
2443
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-ab2df1cc] {
2439
2444
  position: relative;
2440
2445
  }
2441
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-9ff7e192]::before {
2446
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-ab2df1cc]::before {
2442
2447
  content: "";
2443
2448
  position: absolute;
2444
2449
  inset: 50% auto auto 50%;
2445
2450
  z-index: 1;
2446
- inline-size: var(--ui-affordance-guide-size, 0.25rem);
2447
- block-size: var(--ui-affordance-guide-size, 0.25rem);
2448
- border-radius: var(--ui-radius-round, 999px);
2451
+ inline-size: var(--ui-affordance-guide-size);
2452
+ block-size: var(--ui-affordance-guide-size);
2453
+ border-radius: var(--ui-radius-round);
2449
2454
  background: var(--ui-affordance-guide-color, var(--ui-border-strong));
2450
- opacity: var(--ui-affordance-guide-opacity, 0.42);
2455
+ opacity: var(--ui-affordance-guide-opacity);
2451
2456
  transform: translate(-50%, -50%);
2452
2457
  transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
2453
2458
  pointer-events: none;
@@ -2457,27 +2462,29 @@ svg[data-v-a6b9e9ca-s] {
2457
2462
  * surface and icon. The root is the native button, so hiding it outright would hide the dot
2458
2463
  * too, and slotted icons sit outside this scope; `color: transparent` hides currentColor icons. */
2459
2464
  @media (hover: hover) and (pointer: fine) {
2460
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-9ff7e192]:not([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible) {
2465
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-ab2df1cc]:not([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible) {
2461
2466
  border-color: transparent;
2462
2467
  background: transparent;
2463
2468
  box-shadow: none;
2464
2469
  color: transparent;
2465
2470
  }
2466
2471
  }
2467
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-9ff7e192]:is([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible)::before {
2472
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-ab2df1cc]:is([data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"], [data-ui-proximity="near"], :hover, :focus-visible)::before {
2468
2473
  opacity: 0;
2469
2474
  }
2470
- [data-component~="ui-icon-button"][data-v-9ff7e192] {
2475
+ [data-component~="ui-icon-button"][data-v-ab2df1cc] {
2476
+ /* The size prop resolves here; --ui-icon-button-size overrides it on an element. */
2477
+ --_size: 2rem;
2471
2478
  appearance: none;
2472
- inline-size: var(--ui-icon-button-size, 2rem);
2473
- block-size: var(--ui-icon-button-size, 2rem);
2474
- min-inline-size: var(--ui-icon-button-size, 2rem);
2475
- min-block-size: var(--ui-icon-button-size, 2rem);
2479
+ inline-size: var(--ui-icon-button-size, var(--_size));
2480
+ block-size: var(--ui-icon-button-size, var(--_size));
2481
+ min-inline-size: var(--ui-icon-button-size, var(--_size));
2482
+ min-block-size: var(--ui-icon-button-size, var(--_size));
2476
2483
  padding: 0;
2477
2484
  margin: 0;
2478
2485
  border: 1px solid transparent;
2479
- border-radius: var(--ui-icon-button-radius, var(--ui-radius-2));
2480
- background: var(--ui-icon-button-bg, transparent);
2486
+ border-radius: var(--ui-icon-button-radius, var(--ui-radius-md));
2487
+ background: var(--ui-icon-button-surface, transparent);
2481
2488
  color: inherit;
2482
2489
  display: inline-flex;
2483
2490
  align-items: center;
@@ -2491,7 +2498,7 @@ svg[data-v-a6b9e9ca-s] {
2491
2498
  transform var(--ui-motion-fast) var(--ui-motion-ease);
2492
2499
  }
2493
2500
  @media (hover: none), (pointer: coarse) {
2494
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-9ff7e192]::before {
2501
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="anticipatory"][data-v-ab2df1cc]::before {
2495
2502
  opacity: 0;
2496
2503
  }
2497
2504
  }
@@ -2499,116 +2506,118 @@ svg[data-v-a6b9e9ca-s] {
2499
2506
  /* A touch target without a bigger button: an invisible hit area, at least the control
2500
2507
  minimum, centred on the button (::before is the anticipatory guide). */
2501
2508
  @media (pointer: coarse) {
2502
- [data-component~="ui-icon-button"][data-v-9ff7e192] {
2509
+ [data-component~="ui-icon-button"][data-v-ab2df1cc] {
2503
2510
  position: relative;
2504
2511
  }
2505
- [data-component~="ui-icon-button"][data-v-9ff7e192]::after {
2512
+ [data-component~="ui-icon-button"][data-v-ab2df1cc]::after {
2506
2513
  content: "";
2507
2514
  position: absolute;
2508
2515
  inset: 50% auto auto 50%;
2509
- inline-size: max(100%, var(--ui-control-min-block-size, 2.75rem));
2510
- block-size: max(100%, var(--ui-control-min-block-size, 2.75rem));
2516
+ inline-size: max(100%, var(--ui-control-min-block-size));
2517
+ block-size: max(100%, var(--ui-control-min-block-size));
2511
2518
  transform: translate(-50%, -50%);
2512
2519
  }
2513
2520
  }
2514
- html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-9ff7e192] {
2521
+ html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-ab2df1cc] {
2515
2522
  position: relative;
2516
2523
  }
2517
- html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-9ff7e192]::after {
2524
+ html[data-ui-input-modality="touch"] [data-component~="ui-icon-button"][data-v-ab2df1cc]::after {
2518
2525
  content: "";
2519
2526
  position: absolute;
2520
2527
  inset: 50% auto auto 50%;
2521
- inline-size: max(100%, var(--ui-control-min-block-size, 2.75rem));
2522
- block-size: max(100%, var(--ui-control-min-block-size, 2.75rem));
2528
+ inline-size: max(100%, var(--ui-control-min-block-size));
2529
+ block-size: max(100%, var(--ui-control-min-block-size));
2523
2530
  transform: translate(-50%, -50%);
2524
2531
  }
2525
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-9ff7e192] {
2526
- inline-size: var(--ui-icon-button-size-sm, 1.75rem);
2527
- block-size: var(--ui-icon-button-size-sm, 1.75rem);
2528
- min-inline-size: var(--ui-icon-button-size-sm, 1.75rem);
2529
- min-block-size: var(--ui-icon-button-size-sm, 1.75rem);
2530
- }
2531
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-9ff7e192] {
2532
- inline-size: var(--ui-icon-button-size-lg, 2.5rem);
2533
- block-size: var(--ui-icon-button-size-lg, 2.5rem);
2534
- min-inline-size: var(--ui-icon-button-size-lg, 2.5rem);
2535
- min-block-size: var(--ui-icon-button-size-lg, 2.5rem);
2536
- }
2537
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="round"][data-v-9ff7e192] {
2538
- border-radius: var(--ui-radius-round, 999px);
2532
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-ab2df1cc] {
2533
+ --_size: 1.75rem;
2534
+ inline-size: var(--ui-icon-button-size, var(--_size));
2535
+ block-size: var(--ui-icon-button-size, var(--_size));
2536
+ min-inline-size: var(--ui-icon-button-size, var(--_size));
2537
+ min-block-size: var(--ui-icon-button-size, var(--_size));
2538
+ }
2539
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-ab2df1cc] {
2540
+ --_size: 2.5rem;
2541
+ inline-size: var(--ui-icon-button-size, var(--_size));
2542
+ block-size: var(--ui-icon-button-size, var(--_size));
2543
+ min-inline-size: var(--ui-icon-button-size, var(--_size));
2544
+ min-block-size: var(--ui-icon-button-size, var(--_size));
2545
+ }
2546
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="round"][data-v-ab2df1cc] {
2547
+ border-radius: var(--ui-radius-round);
2539
2548
  }
2540
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-9ff7e192] {
2549
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-ab2df1cc] {
2541
2550
  border-color: var(--ui-icon-button-border, var(--ui-border-default));
2542
- background: var(--ui-icon-button-outline-bg, var(--ui-surface-default));
2543
- color: var(--ui-icon-button-outline-color, var(--ui-text-primary));
2551
+ background: var(--ui-icon-button-outline-surface, var(--ui-surface-default));
2552
+ color: var(--ui-icon-button-outline-text, var(--ui-text-primary));
2544
2553
  }
2545
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-9ff7e192] {
2546
- background: var(--ui-icon-button-solid-bg, var(--ui-accent-solid));
2547
- color: var(--ui-icon-button-solid-color, var(--ui-text-on-accent));
2554
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-ab2df1cc] {
2555
+ background: var(--ui-icon-button-solid-surface, var(--ui-accent-solid));
2556
+ color: var(--ui-icon-button-solid-text, var(--ui-text-on-accent));
2548
2557
  box-shadow: var(
2549
2558
  --ui-icon-button-solid-shadow,
2550
2559
  0 1px 2px color-mix(in srgb, var(--ui-accent-solid) 18%, transparent)
2551
2560
  );
2552
2561
  }
2553
- [data-component~="ui-icon-button"][data-v-9ff7e192]:hover:enabled {
2562
+ [data-component~="ui-icon-button"][data-v-ab2df1cc]:hover:enabled {
2554
2563
  /* Derived from the text colour so the ghost hover shows on any background. */
2555
- background: var(--ui-icon-button-hover-bg, color-mix(in srgb, currentColor 8%, transparent));
2556
- color: var(--ui-icon-button-hover-color, var(--ui-text-primary));
2564
+ background: var(--ui-icon-button-hover-surface, color-mix(in srgb, currentColor 8%, transparent));
2565
+ color: var(--ui-icon-button-hover-text, var(--ui-text-primary));
2557
2566
  }
2558
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-9ff7e192]:hover:enabled {
2567
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-ab2df1cc]:hover:enabled {
2559
2568
  border-color: var(--ui-icon-button-hover-border, var(--ui-border-strong));
2560
2569
  }
2561
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-9ff7e192]:hover:enabled {
2562
- background: var(--ui-icon-button-solid-hover-bg, var(--ui-accent-hover));
2570
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-ab2df1cc]:hover:enabled {
2571
+ background: var(--ui-icon-button-solid-hover-surface, var(--ui-accent-hover));
2563
2572
  }
2564
- [data-component~="ui-icon-button"][data-v-9ff7e192]:active:enabled {
2573
+ [data-component~="ui-icon-button"][data-v-ab2df1cc]:active:enabled {
2565
2574
  transform: scale(var(--ui-icon-button-active-scale, 0.96));
2566
2575
  }
2567
- [data-component~="ui-icon-button"][data-v-9ff7e192]:focus-visible {
2576
+ [data-component~="ui-icon-button"][data-v-ab2df1cc]:focus-visible {
2568
2577
  outline: none;
2569
2578
  box-shadow: var(--ui-focus-halo);
2570
2579
  }
2571
2580
 
2572
2581
  /* Disabled colours fall back to each variant's own; ghost takes only the icon colour. */
2573
- [data-component~="ui-icon-button"][data-v-9ff7e192]:disabled {
2582
+ [data-component~="ui-icon-button"][data-v-ab2df1cc]:disabled {
2574
2583
  opacity: var(--ui-icon-button-disabled-opacity, 0.6);
2575
- color: var(--ui-icon-button-disabled-color, inherit);
2584
+ color: var(--ui-icon-button-disabled-text, inherit);
2576
2585
  cursor: not-allowed;
2577
2586
  }
2578
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-9ff7e192]:disabled {
2587
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=outline"][data-v-ab2df1cc]:disabled {
2579
2588
  border-color: var(
2580
2589
  --ui-icon-button-disabled-border,
2581
2590
  var(--ui-icon-button-border, var(--ui-border-default))
2582
2591
  );
2583
2592
  background-color: var(
2584
- --ui-icon-button-disabled-bg,
2585
- var(--ui-icon-button-outline-bg, var(--ui-surface-default))
2593
+ --ui-icon-button-disabled-surface,
2594
+ var(--ui-icon-button-outline-surface, var(--ui-surface-default))
2586
2595
  );
2587
2596
  color: var(
2588
- --ui-icon-button-disabled-color,
2589
- var(--ui-icon-button-outline-color, var(--ui-text-primary))
2597
+ --ui-icon-button-disabled-text,
2598
+ var(--ui-icon-button-outline-text, var(--ui-text-primary))
2590
2599
  );
2591
2600
  }
2592
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-9ff7e192]:disabled {
2601
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="variant=solid"][data-v-ab2df1cc]:disabled {
2593
2602
  background-color: var(
2594
- --ui-icon-button-disabled-bg,
2595
- var(--ui-icon-button-solid-bg, var(--ui-accent-solid))
2603
+ --ui-icon-button-disabled-surface,
2604
+ var(--ui-icon-button-solid-surface, var(--ui-accent-solid))
2596
2605
  );
2597
2606
  color: var(
2598
- --ui-icon-button-disabled-color,
2599
- var(--ui-icon-button-solid-color, var(--ui-text-on-accent))
2607
+ --ui-icon-button-disabled-text,
2608
+ var(--ui-icon-button-solid-text, var(--ui-text-on-accent))
2600
2609
  );
2601
2610
  }
2602
- [data-component~="ui-icon-button"][data-v-9ff7e192] {
2603
- --_icon-button-icon-default: var(--ui-icon-size-md, 1.25rem);
2611
+ [data-component~="ui-icon-button"][data-v-ab2df1cc] {
2612
+ --_icon-button-icon-default: var(--ui-icon-size-md);
2604
2613
  }
2605
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-9ff7e192] {
2606
- --_icon-button-icon-default: var(--ui-icon-size-sm, 1rem);
2614
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=sm"][data-v-ab2df1cc] {
2615
+ --_icon-button-icon-default: var(--ui-icon-size-sm);
2607
2616
  }
2608
- [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-9ff7e192] {
2609
- --_icon-button-icon-default: var(--ui-icon-size-lg, 1.5rem);
2617
+ [data-component~="ui-icon-button"][data-ui-icon-button-state~="size=lg"][data-v-ab2df1cc] {
2618
+ --_icon-button-icon-default: var(--ui-icon-size-lg);
2610
2619
  }
2611
- svg[data-v-9ff7e192-s] {
2620
+ svg[data-v-ab2df1cc-s] {
2612
2621
  inline-size: var(--ui-icon-button-icon-size, var(--_icon-button-icon-default));
2613
2622
  block-size: var(--ui-icon-button-icon-size, var(--_icon-button-icon-default));
2614
2623
  flex-shrink: 0;
@@ -2616,21 +2625,21 @@ svg[data-v-9ff7e192-s] {
2616
2625
  }
2617
2626
 
2618
2627
  /* A component that sets its display still honours the hidden attribute on its root. */
2619
- [data-component~="ui-icon-button"][hidden][data-v-9ff7e192] {
2628
+ [data-component~="ui-icon-button"][hidden][data-v-ab2df1cc] {
2620
2629
  display: none;
2621
2630
  }
2622
2631
 
2623
- [data-component~="ui-input"][data-v-e80b5857] {
2632
+ [data-component~="ui-input"][data-v-f00d6a51] {
2624
2633
  box-sizing: border-box;
2625
2634
  display: inline-block;
2626
2635
  inline-size: 100%;
2627
2636
  min-inline-size: 0;
2628
- min-block-size: var(--ui-control-size-md, 2.5rem);
2637
+ min-block-size: var(--ui-control-size-md);
2629
2638
  margin: 0;
2630
2639
  padding: var(--ui-space-2) var(--ui-space-3);
2631
2640
  appearance: none;
2632
2641
  border: 1px solid var(--ui-control-border, var(--ui-border-strong));
2633
- border-radius: var(--ui-input-radius, var(--ui-radius-2));
2642
+ border-radius: var(--ui-input-radius, var(--ui-radius-md));
2634
2643
  background: var(--ui-control-surface, var(--ui-surface-elevated));
2635
2644
  color: var(--ui-text-primary);
2636
2645
  font: inherit;
@@ -2643,18 +2652,18 @@ svg[data-v-9ff7e192-s] {
2643
2652
  }
2644
2653
 
2645
2654
  /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */
2646
- [data-component~="ui-input"][data-v-e80b5857]::selection {
2655
+ [data-component~="ui-input"][data-v-f00d6a51]::selection {
2647
2656
  background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);
2648
2657
  color: inherit;
2649
2658
  }
2650
- [data-component~="ui-input"][data-v-e80b5857]::placeholder {
2659
+ [data-component~="ui-input"][data-v-f00d6a51]::placeholder {
2651
2660
  color: var(--ui-control-placeholder, var(--ui-text-secondary));
2652
2661
  opacity: 1;
2653
2662
  }
2654
- [data-component~="ui-input"][data-v-e80b5857]:hover:not(:focus):not(:disabled) {
2663
+ [data-component~="ui-input"][data-v-f00d6a51]:hover:not(:focus):not(:disabled) {
2655
2664
  border-color: var(--ui-control-border-hover, var(--ui-text-secondary));
2656
2665
  }
2657
- [data-component~="ui-input"][data-v-e80b5857]:focus-visible {
2666
+ [data-component~="ui-input"][data-v-f00d6a51]:focus-visible {
2658
2667
  border-color: var(--ui-control-focus, var(--ui-accent-solid));
2659
2668
  outline: none;
2660
2669
  box-shadow: var(
@@ -2665,16 +2674,16 @@ svg[data-v-9ff7e192-s] {
2665
2674
  }
2666
2675
 
2667
2676
  /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */
2668
- [data-component~="ui-input"][aria-invalid="true"][data-v-e80b5857],
2669
- [data-component~="ui-input"][data-v-e80b5857]:is(:user-invalid, [data-user-invalid]) {
2677
+ [data-component~="ui-input"][aria-invalid="true"][data-v-f00d6a51],
2678
+ [data-component~="ui-input"][data-v-f00d6a51]:is(:user-invalid, [data-user-invalid]) {
2670
2679
  border-color: var(--ui-danger-solid);
2671
2680
  }
2672
- [data-component~="ui-input"][data-v-e80b5857]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
2681
+ [data-component~="ui-input"][data-v-f00d6a51]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
2673
2682
  box-shadow:
2674
2683
  var(--ui-control-inset),
2675
2684
  0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);
2676
2685
  }
2677
- [data-component~="ui-input"][data-v-e80b5857]:disabled {
2686
+ [data-component~="ui-input"][data-v-f00d6a51]:disabled {
2678
2687
  background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
2679
2688
  color: var(--ui-text-muted);
2680
2689
  box-shadow: none;
@@ -2685,20 +2694,26 @@ svg[data-v-9ff7e192-s] {
2685
2694
  * scroll vertically inside the field. Native inputs already center their single line. */
2686
2695
 
2687
2696
  /* A component that sets its display still honours the hidden attribute on its root. */
2688
- [data-component~="ui-input"][hidden][data-v-e80b5857] {
2697
+ [data-component~="ui-input"][hidden][data-v-f00d6a51] {
2689
2698
  display: none;
2690
2699
  }
2691
2700
 
2692
- [data-component~="ui-menu"][data-v-3174acee] {
2701
+ /* Compact sets the part tokens its items read, so nothing has to rescale a global. */
2702
+ [data-component~="ui-menu"][data-ui-menu-state~="density=compact"][data-v-09be9e37] {
2703
+ --ui-menu-item-padding-block: var(--ui-space-1);
2704
+ --ui-menu-item-padding-inline: var(--ui-space-2);
2705
+ --ui-menu-item-font-size: var(--ui-font-size-sm);
2706
+ --ui-menu-item-radius: var(--ui-radius-sm);
2707
+ padding: var(--ui-space-1);
2708
+ gap: 0;
2709
+ }
2710
+ [data-component~="ui-menu"][data-v-09be9e37] {
2693
2711
  display: flex;
2694
2712
  flex-direction: column;
2695
2713
  box-sizing: border-box;
2696
2714
  inline-size: max-content;
2697
- min-inline-size: min(
2698
- 12rem,
2699
- calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2, 0.5rem)) * 2)
2700
- );
2701
- max-inline-size: calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2, 0.5rem)) * 2);
2715
+ min-inline-size: min(12rem, calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2));
2716
+ max-inline-size: calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2);
2702
2717
  padding: 0;
2703
2718
  border: 0;
2704
2719
  outline: 0;
@@ -2707,7 +2722,7 @@ svg[data-v-9ff7e192-s] {
2707
2722
  box-shadow: none;
2708
2723
  overflow: visible;
2709
2724
  }
2710
- .surface[data-v-3174acee] {
2725
+ .surface[data-v-09be9e37] {
2711
2726
  display: flex;
2712
2727
  flex-direction: column;
2713
2728
  box-sizing: border-box;
@@ -2715,20 +2730,20 @@ svg[data-v-9ff7e192-s] {
2715
2730
  padding: var(--ui-space-1);
2716
2731
  background: var(--ui-surface-elevated);
2717
2732
  border: 1px solid var(--ui-border-default);
2718
- border-radius: var(--ui-radius-3);
2733
+ border-radius: var(--ui-radius-lg);
2719
2734
  box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));
2720
2735
  max-block-size: inherit;
2721
2736
  overflow: auto;
2722
2737
  }
2723
- [data-component~="ui-menu"][data-v-3174acee]:not([data-component~="ui-menu"][data-ui-menu-state~="internalOpen"]) {
2738
+ [data-component~="ui-menu"][data-v-09be9e37]:not([data-component~="ui-menu"][data-ui-menu-state~="internalOpen"]) {
2724
2739
  display: none;
2725
2740
  }
2726
- [data-component~="ui-menu"][popover][data-v-3174acee] {
2741
+ [data-component~="ui-menu"][popover][data-v-09be9e37] {
2727
2742
  position: fixed;
2728
2743
  inset: auto;
2729
2744
  margin: 0;
2730
2745
  overflow: visible;
2731
- max-block-size: calc(100dvh - var(--ui-menu-viewport-gap, var(--ui-space-2, 0.5rem)) * 2);
2746
+ max-block-size: calc(100dvh - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2);
2732
2747
  opacity: 0;
2733
2748
  transform: translateY(-4px) scale(0.99);
2734
2749
  transition:
@@ -2737,61 +2752,62 @@ svg[data-v-9ff7e192-s] {
2737
2752
  display var(--ui-motion-fast) allow-discrete,
2738
2753
  overlay var(--ui-motion-fast) allow-discrete;
2739
2754
  }
2740
- [data-component~="ui-menu"][popover][data-v-3174acee]:popover-open {
2755
+ [data-component~="ui-menu"][popover][data-v-09be9e37]:popover-open {
2741
2756
  opacity: 1;
2742
2757
  transform: translateY(0) scale(1);
2743
2758
  }
2744
2759
  @starting-style {
2745
- [data-component~="ui-menu"][popover][data-v-3174acee]:popover-open {
2760
+ [data-component~="ui-menu"][popover][data-v-09be9e37]:popover-open {
2746
2761
  opacity: 0;
2747
2762
  transform: translateY(-4px) scale(0.99);
2748
2763
  }
2749
2764
  }
2750
- [data-component~="ui-menu"][hidden][data-v-3174acee] {
2765
+ [data-component~="ui-menu"][hidden][data-v-09be9e37] {
2751
2766
  display: none;
2752
2767
  }
2753
2768
  @media (prefers-reduced-motion: reduce) {
2754
- [data-component~="ui-menu"][popover][data-v-3174acee] {
2769
+ [data-component~="ui-menu"][popover][data-v-09be9e37] {
2755
2770
  transition: none;
2756
2771
  }
2757
2772
  }
2758
2773
 
2759
- [data-component~="ui-menu-item"][data-v-732d4711] {
2774
+ [data-component~="ui-menu-item"][data-v-deb5a674] {
2760
2775
  display: block;
2761
2776
  box-sizing: border-box;
2762
2777
  width: 100%;
2763
- padding: var(--ui-space-2) var(--ui-space-3);
2778
+ padding: var(--ui-menu-item-padding-block, var(--ui-space-2))
2779
+ var(--ui-menu-item-padding-inline, var(--ui-space-3));
2764
2780
  text-align: left;
2765
- border-radius: var(--ui-radius-2);
2781
+ border-radius: var(--ui-menu-item-radius, var(--ui-radius-md));
2766
2782
  color: var(--ui-text-primary);
2767
- font-size: var(--ui-font-size-md);
2768
- font-weight: var(--ui-font-medium, 500);
2783
+ font-size: var(--ui-menu-item-font-size, var(--ui-font-size-md));
2784
+ font-weight: var(--ui-font-medium);
2769
2785
  cursor: pointer;
2770
2786
  outline: none;
2771
2787
  transition:
2772
2788
  background-color var(--ui-motion-fast) var(--ui-motion-ease),
2773
2789
  color var(--ui-motion-fast) var(--ui-motion-ease);
2774
2790
  }
2775
- [data-component~="ui-menu-item"][data-v-732d4711]:is(:hover, :focus-visible):not([aria-disabled="true"]) {
2776
- background: var(--ui-surface-subtle);
2791
+ [data-component~="ui-menu-item"][data-v-deb5a674]:is(:hover, :focus-visible):not([aria-disabled="true"]) {
2792
+ background: var(--ui-menu-item-hover-surface, var(--ui-surface-subtle));
2777
2793
  }
2778
- [data-component~="ui-menu-item"][aria-disabled="true"][data-v-732d4711] {
2794
+ [data-component~="ui-menu-item"][aria-disabled="true"][data-v-deb5a674] {
2779
2795
  opacity: 0.6;
2780
2796
  cursor: not-allowed;
2781
2797
  }
2782
2798
 
2783
2799
  /* A component that sets its display still honours the hidden attribute on its root. */
2784
- [data-component~="ui-menu-item"][hidden][data-v-732d4711] {
2800
+ [data-component~="ui-menu-item"][hidden][data-v-deb5a674] {
2785
2801
  display: none;
2786
2802
  }
2787
2803
 
2788
- [data-component~="ui-popover"][data-v-49809509] {
2804
+ [data-component~="ui-popover"][data-v-c16079f0] {
2789
2805
  box-sizing: border-box;
2790
2806
  max-inline-size: min(
2791
2807
  20rem,
2792
- calc(100vw - var(--ui-popover-viewport-gap, var(--ui-space-2, 0.5rem)) * 2)
2808
+ calc(100vw - var(--ui-popover-viewport-gap, var(--ui-space-2)) * 2)
2793
2809
  );
2794
- max-block-size: calc(100dvh - var(--ui-popover-viewport-gap, var(--ui-space-2, 0.5rem)) * 2);
2810
+ max-block-size: calc(100dvh - var(--ui-popover-viewport-gap, var(--ui-space-2)) * 2);
2795
2811
  overflow: visible;
2796
2812
  padding: 0;
2797
2813
  border: 0;
@@ -2800,7 +2816,7 @@ svg[data-v-9ff7e192-s] {
2800
2816
  background: transparent;
2801
2817
  box-shadow: none;
2802
2818
  }
2803
- .surface[data-v-49809509] {
2819
+ .surface[data-v-c16079f0] {
2804
2820
  box-sizing: border-box;
2805
2821
  max-inline-size: inherit;
2806
2822
  max-block-size: inherit;
@@ -2808,13 +2824,13 @@ svg[data-v-9ff7e192-s] {
2808
2824
  padding: var(--ui-space-3);
2809
2825
  background: var(--ui-surface-elevated);
2810
2826
  border: 1px solid var(--ui-border-default);
2811
- border-radius: var(--ui-radius-3);
2827
+ border-radius: var(--ui-radius-lg);
2812
2828
  box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));
2813
2829
  }
2814
- [data-component~="ui-popover"][data-v-49809509]:not([data-component~="ui-popover"][data-ui-popover-state~="internalOpen"]) {
2830
+ [data-component~="ui-popover"][data-v-c16079f0]:not([data-component~="ui-popover"][data-ui-popover-state~="internalOpen"]) {
2815
2831
  display: none;
2816
2832
  }
2817
- [data-component~="ui-popover"][popover][data-v-49809509] {
2833
+ [data-component~="ui-popover"][popover][data-v-c16079f0] {
2818
2834
  position: fixed;
2819
2835
  inset: auto;
2820
2836
  margin: 0;
@@ -2826,21 +2842,21 @@ svg[data-v-9ff7e192-s] {
2826
2842
  display var(--ui-motion-fast) allow-discrete,
2827
2843
  overlay var(--ui-motion-fast) allow-discrete;
2828
2844
  }
2829
- [data-component~="ui-popover"][popover][data-v-49809509]:popover-open {
2845
+ [data-component~="ui-popover"][popover][data-v-c16079f0]:popover-open {
2830
2846
  opacity: 1;
2831
2847
  transform: translateY(0) scale(1);
2832
2848
  }
2833
2849
  @starting-style {
2834
- [data-component~="ui-popover"][popover][data-v-49809509]:popover-open {
2850
+ [data-component~="ui-popover"][popover][data-v-c16079f0]:popover-open {
2835
2851
  opacity: 0;
2836
2852
  transform: translateY(-4px) scale(0.99);
2837
2853
  }
2838
2854
  }
2839
- [data-component~="ui-popover"][hidden][data-v-49809509] {
2855
+ [data-component~="ui-popover"][hidden][data-v-c16079f0] {
2840
2856
  display: none;
2841
2857
  }
2842
2858
  @media (prefers-reduced-motion: reduce) {
2843
- [data-component~="ui-popover"][popover][data-v-49809509] {
2859
+ [data-component~="ui-popover"][popover][data-v-c16079f0] {
2844
2860
  transition: none;
2845
2861
  }
2846
2862
  }
@@ -2912,8 +2928,8 @@ legend[data-v-df092584] + * {
2912
2928
  display: none;
2913
2929
  }
2914
2930
 
2915
- [data-component~="ui-reel"][data-v-8cc08968] {
2916
- --_reel-gap: var(--ui-space-4, 1rem);
2931
+ [data-component~="ui-reel"][data-v-0dde8279] {
2932
+ --_reel-gap: var(--ui-space-4);
2917
2933
  --_reel-item-width: auto;
2918
2934
  display: flex;
2919
2935
  inline-size: 100%;
@@ -2925,133 +2941,130 @@ legend[data-v-df092584] + * {
2925
2941
  overflow-y: hidden;
2926
2942
  overscroll-behavior-inline: contain;
2927
2943
  }
2928
- [data-component~="ui-reel"] > [data-v-8cc08968-s] {
2944
+ [data-component~="ui-reel"] > [data-v-0dde8279-s] {
2929
2945
  min-inline-size: 0;
2930
2946
  flex: 0 0 var(--ui-reel-item-width, var(--_reel-item-width));
2931
2947
  }
2932
- [data-component~="ui-reel"][data-ui-reel-state~="gap=xs"][data-v-8cc08968] {
2933
- --_reel-gap: var(--ui-space-2, 0.5rem);
2948
+ [data-component~="ui-reel"][data-ui-reel-state~="gap=xs"][data-v-0dde8279] {
2949
+ --_reel-gap: var(--ui-space-2);
2934
2950
  }
2935
- [data-component~="ui-reel"][data-ui-reel-state~="gap=s"][data-v-8cc08968] {
2936
- --_reel-gap: var(--ui-space-3, 0.75rem);
2951
+ [data-component~="ui-reel"][data-ui-reel-state~="gap=s"][data-v-0dde8279] {
2952
+ --_reel-gap: var(--ui-space-3);
2937
2953
  }
2938
- [data-component~="ui-reel"][data-ui-reel-state~="gap=m"][data-v-8cc08968] {
2939
- --_reel-gap: var(--ui-space-4, 1rem);
2954
+ [data-component~="ui-reel"][data-ui-reel-state~="gap=m"][data-v-0dde8279] {
2955
+ --_reel-gap: var(--ui-space-4);
2940
2956
  }
2941
- [data-component~="ui-reel"][data-ui-reel-state~="gap=l"][data-v-8cc08968] {
2942
- --_reel-gap: var(--ui-space-5, 1.5rem);
2957
+ [data-component~="ui-reel"][data-ui-reel-state~="gap=l"][data-v-0dde8279] {
2958
+ --_reel-gap: var(--ui-space-5);
2943
2959
  }
2944
- [data-component~="ui-reel"][data-ui-reel-state~="gap=xl"][data-v-8cc08968] {
2945
- --_reel-gap: var(--ui-space-6, 2rem);
2960
+ [data-component~="ui-reel"][data-ui-reel-state~="gap=xl"][data-v-0dde8279] {
2961
+ --_reel-gap: var(--ui-space-6);
2946
2962
  }
2947
- [data-component~="ui-reel"][data-ui-reel-state~="itemWidth=sm"][data-v-8cc08968] {
2963
+ [data-component~="ui-reel"][data-ui-reel-state~="itemWidth=sm"][data-v-0dde8279] {
2948
2964
  --_reel-item-width: 12rem;
2949
2965
  }
2950
- [data-component~="ui-reel"][data-ui-reel-state~="itemWidth=md"][data-v-8cc08968] {
2966
+ [data-component~="ui-reel"][data-ui-reel-state~="itemWidth=md"][data-v-0dde8279] {
2951
2967
  --_reel-item-width: 16rem;
2952
2968
  }
2953
- [data-component~="ui-reel"][data-ui-reel-state~="itemWidth=lg"][data-v-8cc08968] {
2969
+ [data-component~="ui-reel"][data-ui-reel-state~="itemWidth=lg"][data-v-0dde8279] {
2954
2970
  --_reel-item-width: 20rem;
2955
2971
  }
2956
- [data-component~="ui-reel"][data-ui-reel-state~="snap"][data-v-8cc08968] {
2972
+ [data-component~="ui-reel"][data-ui-reel-state~="snap"][data-v-0dde8279] {
2957
2973
  scroll-snap-type: inline mandatory;
2958
2974
  }
2959
- [data-component~="ui-reel"][data-ui-reel-state~="snap=start"] > [data-v-8cc08968-s] {
2975
+ [data-component~="ui-reel"][data-ui-reel-state~="snap=start"] > [data-v-0dde8279-s] {
2960
2976
  scroll-snap-align: start;
2961
2977
  }
2962
- [data-component~="ui-reel"][data-ui-reel-state~="snap=center"] > [data-v-8cc08968-s] {
2978
+ [data-component~="ui-reel"][data-ui-reel-state~="snap=center"] > [data-v-0dde8279-s] {
2963
2979
  scroll-snap-align: center;
2964
2980
  }
2965
2981
 
2966
2982
  /* A component that sets its display still honours the hidden attribute on its root. */
2967
- [data-component~="ui-reel"][hidden][data-v-8cc08968] {
2983
+ [data-component~="ui-reel"][hidden][data-v-0dde8279] {
2968
2984
  display: none;
2969
2985
  }
2970
2986
 
2971
- [data-component~="ui-search-result-row"][data-v-d2414aa2] {
2987
+ [data-component~="ui-search-result-row"][data-v-7d88a5d4] {
2972
2988
  appearance: none;
2973
2989
  inline-size: 100%;
2974
2990
  min-block-size: var(--ui-search-result-row-min-height, 56px);
2975
2991
  margin: 0;
2976
- padding-block: var(--ui-search-result-row-padding-block, var(--ui-space-3, 0.75rem));
2977
- padding-inline: var(--ui-search-result-row-padding-inline, var(--ui-space-4, 1rem));
2992
+ padding-block: var(--ui-search-result-row-padding-block, var(--ui-space-3));
2993
+ padding-inline: var(--ui-search-result-row-padding-inline, var(--ui-space-4));
2978
2994
  display: flex;
2979
2995
  align-items: flex-start;
2980
- gap: var(--ui-search-result-row-gap, var(--ui-space-3, 0.75rem));
2981
- background: var(--ui-search-result-row-bg, transparent);
2996
+ gap: var(--ui-search-result-row-gap, var(--ui-space-3));
2997
+ background: var(--ui-search-result-row-surface, transparent);
2982
2998
  border: none;
2983
- border-block-end: 1px solid var(--ui-search-result-row-border, var(--ui-border, #e5e7eb));
2999
+ border-block-end: 1px solid var(--ui-search-result-row-border, var(--ui-border));
2984
3000
  color: inherit;
2985
3001
  cursor: pointer;
2986
3002
  text-align: left;
2987
- transition: background-color var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease);
3003
+ transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);
2988
3004
  }
2989
- [data-component~="ui-search-result-row"][data-v-d2414aa2]:last-child {
3005
+ [data-component~="ui-search-result-row"][data-v-7d88a5d4]:last-child {
2990
3006
  border-block-end: none;
2991
3007
  }
2992
- [data-component~="ui-search-result-row"][data-v-d2414aa2]:hover:enabled {
3008
+ [data-component~="ui-search-result-row"][data-v-7d88a5d4]:hover:enabled {
2993
3009
  background: var(
2994
- --ui-search-result-row-hover-bg,
2995
- color-mix(in srgb, var(--ui-surface, #ffffff) 85%, black 3%)
3010
+ --ui-search-result-row-hover-surface,
3011
+ color-mix(in srgb, var(--ui-surface) 85%, black 3%)
2996
3012
  );
2997
3013
  }
2998
- [data-component~="ui-search-result-row"][data-ui-search-result-row-state~="selected"][data-v-d2414aa2] {
3014
+ [data-component~="ui-search-result-row"][data-ui-search-result-row-state~="selected"][data-v-7d88a5d4] {
2999
3015
  background: var(
3000
3016
  --ui-search-result-row-selected-bg,
3001
- var(
3002
- --ui-search-result-row-hover-bg,
3003
- color-mix(in srgb, var(--ui-surface, #ffffff) 85%, black 3%)
3004
- )
3017
+ var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%))
3005
3018
  );
3006
3019
  }
3007
- [data-component~="ui-search-result-row"][data-v-d2414aa2]:focus-visible {
3008
- outline: 2px solid var(--ui-focus-ring, #2563eb);
3020
+ [data-component~="ui-search-result-row"][data-v-7d88a5d4]:focus-visible {
3021
+ outline: 2px solid var(--ui-focus-ring);
3009
3022
  outline-offset: -2px;
3010
3023
  }
3011
- [data-component~="ui-search-result-row"][data-v-d2414aa2]:disabled {
3024
+ [data-component~="ui-search-result-row"][data-v-7d88a5d4]:disabled {
3012
3025
  opacity: 0.6;
3013
3026
  cursor: not-allowed;
3014
3027
  }
3015
- .leading[data-v-d2414aa2],
3016
- .trailing[data-v-d2414aa2] {
3028
+ .leading[data-v-7d88a5d4],
3029
+ .trailing[data-v-7d88a5d4] {
3017
3030
  display: inline-flex;
3018
3031
  align-items: flex-start;
3019
3032
  flex-shrink: 0;
3020
3033
  }
3021
- .content[data-v-d2414aa2] {
3034
+ .content[data-v-7d88a5d4] {
3022
3035
  min-inline-size: 0;
3023
3036
  flex: 1;
3024
3037
  display: flex;
3025
3038
  flex-direction: column;
3026
3039
  }
3027
- .title[data-v-d2414aa2],
3028
- .meta[data-v-d2414aa2],
3029
- .excerpt[data-v-d2414aa2] {
3040
+ .title[data-v-7d88a5d4],
3041
+ .meta[data-v-7d88a5d4],
3042
+ .excerpt[data-v-7d88a5d4] {
3030
3043
  display: block;
3031
3044
  min-inline-size: 0;
3032
3045
  }
3033
3046
 
3034
3047
  /* An unused region takes no space. */
3035
- .leading[data-v-d2414aa2]:empty,
3036
- .meta[data-v-d2414aa2]:empty,
3037
- .excerpt[data-v-d2414aa2]:empty,
3038
- .trailing[data-v-d2414aa2]:empty {
3048
+ .leading[data-v-7d88a5d4]:empty,
3049
+ .meta[data-v-7d88a5d4]:empty,
3050
+ .excerpt[data-v-7d88a5d4]:empty,
3051
+ .trailing[data-v-7d88a5d4]:empty {
3039
3052
  display: none;
3040
3053
  }
3041
- [slot="title"][data-v-d2414aa2-s],[slot="meta"][data-v-d2414aa2-s],[slot="excerpt"][data-v-d2414aa2-s] {
3054
+ [slot="title"][data-v-7d88a5d4-s],[slot="meta"][data-v-7d88a5d4-s],[slot="excerpt"][data-v-7d88a5d4-s] {
3042
3055
  display: block;
3043
3056
  margin: 0;
3044
3057
  }
3045
3058
 
3046
3059
  /* A component that sets its display still honours the hidden attribute on its root. */
3047
- [data-component~="ui-search-result-row"][hidden][data-v-d2414aa2] {
3060
+ [data-component~="ui-search-result-row"][hidden][data-v-7d88a5d4] {
3048
3061
  display: none;
3049
3062
  }
3050
3063
 
3051
- [data-component~="ui-search-shell"][data-v-7aa92a93] {
3064
+ [data-component~="ui-search-shell"][data-v-976b649d] {
3052
3065
  display: contents;
3053
3066
  }
3054
- dialog[data-v-7aa92a93] {
3067
+ dialog[data-v-976b649d] {
3055
3068
  position: fixed;
3056
3069
  inset: 0;
3057
3070
  z-index: var(--ui-search-shell-z-index, 400);
@@ -3069,10 +3082,10 @@ dialog[data-v-7aa92a93] {
3069
3082
  background: var(--ui-overlay-backdrop);
3070
3083
  color: var(--ui-text-primary);
3071
3084
  }
3072
- dialog[data-v-7aa92a93]::backdrop {
3085
+ dialog[data-v-976b649d]::backdrop {
3073
3086
  background: var(--ui-overlay-backdrop);
3074
3087
  }
3075
- .panel[data-v-7aa92a93] {
3088
+ .panel[data-v-976b649d] {
3076
3089
  position: relative;
3077
3090
  display: flex;
3078
3091
  flex-direction: column;
@@ -3080,12 +3093,12 @@ dialog[data-v-7aa92a93]::backdrop {
3080
3093
  max-block-size: var(--ui-search-shell-max-height, 80vh);
3081
3094
  margin-inline: auto;
3082
3095
  overflow: hidden;
3083
- background: var(--ui-search-shell-bg, var(--ui-surface-elevated));
3096
+ background: var(--ui-search-shell-surface, var(--ui-surface-elevated));
3084
3097
  border: 1px solid var(--ui-search-shell-border, var(--ui-border-default));
3085
3098
  border-radius: var(--ui-search-shell-radius, var(--ui-radius-dialog));
3086
3099
  box-shadow: var(--ui-search-shell-shadow, var(--ui-elevation-dialog, var(--ui-shadow-xl)));
3087
3100
  }
3088
- .search[data-v-7aa92a93] {
3101
+ .search[data-v-976b649d] {
3089
3102
  padding: var(--ui-space-3);
3090
3103
  border-block-end: 1px solid var(--ui-border-default);
3091
3104
  transition:
@@ -3094,40 +3107,40 @@ dialog[data-v-7aa92a93]::backdrop {
3094
3107
  }
3095
3108
 
3096
3109
  /* The search region shows where typing goes, whatever the author put in it. */
3097
- .search[data-v-7aa92a93]:focus-within {
3110
+ .search[data-v-976b649d]:focus-within {
3098
3111
  border-block-end-color: var(--ui-search-shell-focus-color, var(--ui-control-focus));
3099
3112
  box-shadow: inset 0 -1px 0 var(--ui-search-shell-focus-color, var(--ui-control-focus));
3100
3113
  }
3101
- input[slot="search"][data-v-7aa92a93-s] {
3114
+ input[slot="search"][data-v-976b649d-s] {
3102
3115
  box-sizing: border-box;
3103
3116
  inline-size: 100%;
3104
3117
  min-block-size: var(--ui-control-min-block-size);
3105
3118
  padding: var(--ui-space-2) var(--ui-space-3);
3106
3119
  border: 1px solid var(--ui-control-border);
3107
- border-radius: var(--ui-radius-2);
3120
+ border-radius: var(--ui-radius-md);
3108
3121
  background: var(--ui-control-surface);
3109
3122
  color: var(--ui-text-primary);
3110
3123
  font: inherit;
3111
3124
  box-shadow: var(--ui-shadow-xs);
3112
3125
  }
3113
- input[slot="search"][data-v-7aa92a93-s]:focus-visible {
3126
+ input[slot="search"][data-v-976b649d-s]:focus-visible {
3114
3127
  border-color: var(--ui-control-focus);
3115
- outline: 2px solid var(--ui-focus-ring, currentColor);
3128
+ outline: 2px solid var(--ui-focus-ring);
3116
3129
  outline-offset: 2px;
3117
3130
  }
3118
- .status[data-v-7aa92a93],
3119
- .footer[data-v-7aa92a93] {
3131
+ .status[data-v-976b649d],
3132
+ .footer[data-v-976b649d] {
3120
3133
  flex-shrink: 0;
3121
3134
  padding: var(--ui-space-2) var(--ui-space-4);
3122
3135
  color: var(--ui-text-secondary);
3123
3136
  font-size: var(--ui-font-size-sm);
3124
3137
  }
3125
- .status[data-v-7aa92a93] {
3138
+ .status[data-v-976b649d] {
3126
3139
  border-block-end: 1px solid var(--ui-border-default);
3127
3140
  }
3128
3141
 
3129
3142
  /* Laid out like the dialog's action row: actions right-aligned, spaced as buttons, no fill. */
3130
- .footer[data-v-7aa92a93] {
3143
+ .footer[data-v-976b649d] {
3131
3144
  display: flex;
3132
3145
  flex-wrap: wrap;
3133
3146
  align-items: center;
@@ -3136,21 +3149,21 @@ input[slot="search"][data-v-7aa92a93-s]:focus-visible {
3136
3149
  padding: var(--ui-space-3) var(--ui-space-4);
3137
3150
  border-block-start: 1px solid var(--ui-border-default);
3138
3151
  }
3139
- .status[data-v-7aa92a93]:empty,
3140
- .footer[data-v-7aa92a93]:empty {
3152
+ .status[data-v-976b649d]:empty,
3153
+ .footer[data-v-976b649d]:empty {
3141
3154
  display: none;
3142
3155
  }
3143
- .body[data-v-7aa92a93] {
3156
+ .body[data-v-976b649d] {
3144
3157
  flex: 1;
3145
3158
  min-block-size: 0;
3146
3159
  overflow: auto;
3147
3160
  padding: var(--ui-space-2);
3148
3161
  }
3149
3162
  @media (max-width: 47.9375rem) {
3150
- dialog[data-v-7aa92a93] {
3163
+ dialog[data-v-976b649d] {
3151
3164
  padding: 0;
3152
3165
  }
3153
- .panel[data-v-7aa92a93] {
3166
+ .panel[data-v-976b649d] {
3154
3167
  inline-size: 100%;
3155
3168
  min-block-size: 100dvh;
3156
3169
  max-block-size: none;
@@ -3160,20 +3173,20 @@ dialog[data-v-7aa92a93] {
3160
3173
  }
3161
3174
 
3162
3175
  /* A component that sets its display still honours the hidden attribute on its root. */
3163
- [data-component~="ui-search-shell"][hidden][data-v-7aa92a93] {
3176
+ [data-component~="ui-search-shell"][hidden][data-v-976b649d] {
3164
3177
  display: none;
3165
3178
  }
3166
3179
 
3167
- [data-component~="ui-select"][data-v-b52cc131] {
3180
+ [data-component~="ui-select"][data-v-01335c35] {
3168
3181
  box-sizing: border-box;
3169
3182
  display: inline-block;
3170
3183
  inline-size: 100%;
3171
3184
  min-inline-size: 0;
3172
- min-block-size: var(--ui-control-size-md, 2.5rem);
3185
+ min-block-size: var(--ui-control-size-md);
3173
3186
  margin: 0;
3174
3187
  padding: var(--ui-space-2) var(--ui-space-3);
3175
3188
  border: 1px solid var(--ui-control-border, var(--ui-border-strong));
3176
- border-radius: var(--ui-select-radius, var(--ui-radius-2));
3189
+ border-radius: var(--ui-select-radius, var(--ui-radius-md));
3177
3190
  background-color: var(--ui-control-surface, var(--ui-surface-elevated));
3178
3191
  color: var(--ui-text-primary);
3179
3192
  color-scheme: light dark;
@@ -3188,7 +3201,7 @@ dialog[data-v-7aa92a93] {
3188
3201
 
3189
3202
  /* Single selects draw their own chevron: the native caret cannot be inset or sized consistently.
3190
3203
  * The root stays a native <s-lect>, so the icon is a background image rather than an element. */
3191
- [data-component~="ui-select"][data-v-b52cc131]:not([multiple]) {
3204
+ [data-component~="ui-select"][data-v-01335c35]:not([multiple]) {
3192
3205
  appearance: none;
3193
3206
  padding-inline-end: calc(var(--ui-space-3) + 1.5rem);
3194
3207
  background-image: var(
@@ -3199,10 +3212,10 @@ dialog[data-v-7aa92a93] {
3199
3212
  background-position: right var(--ui-space-3) center;
3200
3213
  background-size: 1.125rem 1.125rem;
3201
3214
  }
3202
- [data-component~="ui-select"][data-v-b52cc131]:hover:not(:focus):not(:disabled) {
3215
+ [data-component~="ui-select"][data-v-01335c35]:hover:not(:focus):not(:disabled) {
3203
3216
  border-color: var(--ui-control-border-hover, var(--ui-text-secondary));
3204
3217
  }
3205
- [data-component~="ui-select"][data-v-b52cc131]:focus-visible {
3218
+ [data-component~="ui-select"][data-v-01335c35]:focus-visible {
3206
3219
  border-color: var(--ui-control-focus, var(--ui-accent-solid));
3207
3220
  outline: none;
3208
3221
  box-shadow: var(
@@ -3213,29 +3226,29 @@ dialog[data-v-7aa92a93] {
3213
3226
  }
3214
3227
 
3215
3228
  /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */
3216
- [data-component~="ui-select"][aria-invalid="true"][data-v-b52cc131],
3217
- [data-component~="ui-select"][data-v-b52cc131]:is(:user-invalid, [data-user-invalid]) {
3229
+ [data-component~="ui-select"][aria-invalid="true"][data-v-01335c35],
3230
+ [data-component~="ui-select"][data-v-01335c35]:is(:user-invalid, [data-user-invalid]) {
3218
3231
  border-color: var(--ui-danger-solid);
3219
3232
  }
3220
- [data-component~="ui-select"][data-v-b52cc131]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
3233
+ [data-component~="ui-select"][data-v-01335c35]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
3221
3234
  box-shadow:
3222
3235
  var(--ui-control-inset),
3223
3236
  0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);
3224
3237
  }
3225
- [data-component~="ui-select"][data-v-b52cc131]:disabled {
3238
+ [data-component~="ui-select"][data-v-01335c35]:disabled {
3226
3239
  background-color: var(--ui-control-surface-disabled, var(--ui-surface-muted));
3227
3240
  color: var(--ui-text-muted);
3228
3241
  box-shadow: none;
3229
3242
  cursor: not-allowed;
3230
3243
  }
3231
- [data-component~="ui-select"][multiple][data-v-b52cc131],
3232
- [data-component~="ui-select"][size][data-v-b52cc131]:not([size="1"]) {
3244
+ [data-component~="ui-select"][multiple][data-v-01335c35],
3245
+ [data-component~="ui-select"][size][data-v-01335c35]:not([size="1"]) {
3233
3246
  min-block-size: 7rem;
3234
3247
  padding: var(--ui-space-2);
3235
3248
  }
3236
3249
 
3237
3250
  /* A component that sets its display still honours the hidden attribute on its root. */
3238
- [data-component~="ui-select"][hidden][data-v-b52cc131] {
3251
+ [data-component~="ui-select"][hidden][data-v-01335c35] {
3239
3252
  display: none;
3240
3253
  }
3241
3254
 
@@ -3252,7 +3265,7 @@ hr[aria-orientation="vertical"][data-v-f0034397] {
3252
3265
  border-inline-start: 1px solid var(--ui-separator-color, var(--ui-border-default));
3253
3266
  }
3254
3267
 
3255
- [data-component~="ui-sidebar"][data-v-fe11c9df] {
3268
+ [data-component~="ui-sidebar"][data-v-a2e22569] {
3256
3269
  position: relative;
3257
3270
  box-sizing: border-box;
3258
3271
  display: flex;
@@ -3264,21 +3277,21 @@ hr[aria-orientation="vertical"][data-v-f0034397] {
3264
3277
  background: var(--ui-sidebar-surface, var(--ui-surface-default));
3265
3278
  border-inline-end: 1px solid var(--ui-sidebar-border, var(--ui-border-default));
3266
3279
  }
3267
- [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][data-v-fe11c9df] {
3280
+ [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][data-v-a2e22569] {
3268
3281
  border-inline-end: 0;
3269
3282
  border-inline-start: 1px solid var(--ui-sidebar-border, var(--ui-border-default));
3270
3283
  }
3271
- .content[data-v-fe11c9df] {
3284
+ .content[data-v-a2e22569] {
3272
3285
  flex: 1;
3273
3286
  min-block-size: 0;
3274
3287
  overflow: auto;
3275
3288
  }
3276
3289
 
3277
3290
  /* Collapsed while docked. */
3278
- [data-component~="ui-sidebar"][data-ui-sidebar-state~="internalCollapsed"][data-v-fe11c9df]:not([popover]) {
3291
+ [data-component~="ui-sidebar"][data-ui-sidebar-state~="internalCollapsed"][data-v-a2e22569]:not([popover]) {
3279
3292
  display: none;
3280
3293
  }
3281
- .resizer[data-v-fe11c9df] {
3294
+ .resizer[data-v-a2e22569] {
3282
3295
  position: absolute;
3283
3296
  z-index: 1;
3284
3297
  inset-block: 0;
@@ -3291,15 +3304,15 @@ hr[aria-orientation="vertical"][data-v-f0034397] {
3291
3304
  touch-action: none;
3292
3305
  outline: none;
3293
3306
  }
3294
- .resizer[hidden][data-v-fe11c9df] {
3307
+ .resizer[hidden][data-v-a2e22569] {
3295
3308
  display: none;
3296
3309
  }
3297
- [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"] .resizer[data-v-fe11c9df] {
3310
+ [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"] .resizer[data-v-a2e22569] {
3298
3311
  inset-inline-end: auto;
3299
3312
  inset-inline-start: 0;
3300
3313
  transform: translateX(-50%);
3301
3314
  }
3302
- .resizer[data-v-fe11c9df]::after {
3315
+ .resizer[data-v-a2e22569]::after {
3303
3316
  content: "";
3304
3317
  position: absolute;
3305
3318
  inset-block: 0;
@@ -3310,40 +3323,35 @@ hr[aria-orientation="vertical"][data-v-f0034397] {
3310
3323
  var(--ui-affordance-guide-color, var(--ui-border-strong)) 45%,
3311
3324
  transparent
3312
3325
  );
3313
- opacity: var(--ui-affordance-guide-opacity, 0.42);
3326
+ opacity: var(--ui-affordance-guide-opacity);
3314
3327
  transition:
3315
- background-color var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
3316
- var(--ui-motion-ease, ease),
3317
- opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms)) var(--ui-motion-ease, ease);
3328
+ background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),
3329
+ opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
3318
3330
  }
3319
- .guide[data-v-fe11c9df] {
3331
+ .guide[data-v-a2e22569] {
3320
3332
  position: absolute;
3321
3333
  inset-block-start: 50%;
3322
3334
  inset-inline-start: 50%;
3323
3335
  inline-size: 6px;
3324
3336
  block-size: 22px;
3325
- border: 1px solid var(--ui-border-strong, #c8c8c4);
3326
- border-radius: var(--ui-radius-round, 999px);
3327
- background: var(--ui-surface-elevated, #fff);
3337
+ border: 1px solid var(--ui-border-strong);
3338
+ border-radius: var(--ui-radius-round);
3339
+ background: var(--ui-surface-elevated);
3328
3340
  opacity: 0;
3329
3341
  transform: translate(-50%, -50%);
3330
- transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast, 120ms))
3331
- var(--ui-motion-ease, ease);
3342
+ transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);
3332
3343
  pointer-events: none;
3333
3344
  }
3334
- .resizer[data-v-fe11c9df]:is(:hover, :focus-visible)::after {
3335
- background: var(
3336
- --ui-affordance-direct-color,
3337
- var(--ui-accent-solid, var(--ui-color-focus, Highlight))
3338
- );
3345
+ .resizer[data-v-a2e22569]:is(:hover, :focus-visible)::after {
3346
+ background: var(--ui-affordance-direct-color, var(--ui-accent-solid, var(--ui-focus-ring)));
3339
3347
  opacity: 1;
3340
3348
  }
3341
- .resizer:is(:hover, :focus-visible) > .guide[data-v-fe11c9df] {
3349
+ .resizer:is(:hover, :focus-visible) > .guide[data-v-a2e22569] {
3342
3350
  opacity: 1;
3343
3351
  }
3344
3352
 
3345
3353
  /* Drawer: a popover in the top layer, sliding in from its edge. Closed popovers are hidden by the UA. */
3346
- [data-component~="ui-sidebar"][popover][data-v-fe11c9df] {
3354
+ [data-component~="ui-sidebar"][popover][data-v-a2e22569] {
3347
3355
  position: fixed;
3348
3356
  inset-block: 0;
3349
3357
  inset-inline-start: 0;
@@ -3357,47 +3365,47 @@ hr[aria-orientation="vertical"][data-v-f0034397] {
3357
3365
  box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));
3358
3366
  transform: translateX(0);
3359
3367
  transition:
3360
- transform var(--ui-motion-base, 0.2s) var(--ui-motion-ease-out, ease-out),
3361
- display var(--ui-motion-base, 0.2s) allow-discrete,
3362
- overlay var(--ui-motion-base, 0.2s) allow-discrete;
3368
+ transform var(--ui-motion-base) var(--ui-motion-ease-out),
3369
+ display var(--ui-motion-base) allow-discrete,
3370
+ overlay var(--ui-motion-base) allow-discrete;
3363
3371
  }
3364
3372
 
3365
3373
  /* The author display above would otherwise override the UA rule that hides a closed popover. */
3366
- [data-component~="ui-sidebar"][popover][data-v-fe11c9df]:not(:popover-open) {
3374
+ [data-component~="ui-sidebar"][popover][data-v-a2e22569]:not(:popover-open) {
3367
3375
  display: none;
3368
3376
  transform: translateX(-100%);
3369
3377
  }
3370
- [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-fe11c9df] {
3378
+ [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-a2e22569] {
3371
3379
  inset-inline-start: auto;
3372
3380
  inset-inline-end: 0;
3373
3381
  }
3374
- [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-fe11c9df]:not(:popover-open) {
3382
+ [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-a2e22569]:not(:popover-open) {
3375
3383
  transform: translateX(100%);
3376
3384
  }
3377
3385
  @starting-style {
3378
- [data-component~="ui-sidebar"][popover][data-v-fe11c9df]:popover-open {
3386
+ [data-component~="ui-sidebar"][popover][data-v-a2e22569]:popover-open {
3379
3387
  transform: translateX(-100%);
3380
3388
  }
3381
- [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-fe11c9df]:popover-open {
3389
+ [data-component~="ui-sidebar"][data-ui-sidebar-state~="side=end"][popover][data-v-a2e22569]:popover-open {
3382
3390
  transform: translateX(100%);
3383
3391
  }
3384
3392
  }
3385
- [data-component~="ui-sidebar"][popover][data-v-fe11c9df]::backdrop {
3393
+ [data-component~="ui-sidebar"][popover][data-v-a2e22569]::backdrop {
3386
3394
  background: var(--ui-sidebar-backdrop, rgb(0 0 0 / 0.32));
3387
3395
  }
3388
3396
  @media (prefers-reduced-motion: reduce) {
3389
- [data-component~="ui-sidebar"][popover][data-v-fe11c9df] {
3397
+ [data-component~="ui-sidebar"][popover][data-v-a2e22569] {
3390
3398
  transition: none;
3391
3399
  }
3392
3400
  }
3393
3401
 
3394
3402
  /* A component that sets its display still honours the hidden attribute on its root. */
3395
- [data-component~="ui-sidebar"][hidden][data-v-fe11c9df] {
3403
+ [data-component~="ui-sidebar"][hidden][data-v-a2e22569] {
3396
3404
  display: none;
3397
3405
  }
3398
3406
 
3399
- [data-component~="ui-stack"][data-v-8ab460be] {
3400
- --_layout-gap: var(--ui-space-4, 1rem);
3407
+ [data-component~="ui-stack"][data-v-aa8062a9] {
3408
+ --_layout-gap: var(--ui-space-4);
3401
3409
  display: flex;
3402
3410
  flex-direction: column;
3403
3411
  align-items: stretch;
@@ -3406,42 +3414,42 @@ hr[aria-orientation="vertical"][data-v-f0034397] {
3406
3414
  max-inline-size: 100%;
3407
3415
  margin: 0;
3408
3416
  }
3409
- [data-component~="ui-stack"][data-ui-stack-state~="gap=xs"][data-v-8ab460be] {
3410
- --_layout-gap: var(--ui-space-2, 0.5rem);
3417
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=xs"][data-v-aa8062a9] {
3418
+ --_layout-gap: var(--ui-space-2);
3411
3419
  }
3412
- [data-component~="ui-stack"][data-ui-stack-state~="gap=s"][data-v-8ab460be] {
3413
- --_layout-gap: var(--ui-space-3, 0.75rem);
3420
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=s"][data-v-aa8062a9] {
3421
+ --_layout-gap: var(--ui-space-3);
3414
3422
  }
3415
- [data-component~="ui-stack"][data-ui-stack-state~="gap=m"][data-v-8ab460be] {
3416
- --_layout-gap: var(--ui-space-4, 1rem);
3423
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=m"][data-v-aa8062a9] {
3424
+ --_layout-gap: var(--ui-space-4);
3417
3425
  }
3418
- [data-component~="ui-stack"][data-ui-stack-state~="gap=l"][data-v-8ab460be] {
3419
- --_layout-gap: var(--ui-space-5, 1.5rem);
3426
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=l"][data-v-aa8062a9] {
3427
+ --_layout-gap: var(--ui-space-5);
3420
3428
  }
3421
- [data-component~="ui-stack"][data-ui-stack-state~="gap=xl"][data-v-8ab460be] {
3422
- --_layout-gap: var(--ui-space-6, 2rem);
3429
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=xl"][data-v-aa8062a9] {
3430
+ --_layout-gap: var(--ui-space-6);
3423
3431
  }
3424
- [data-component~="ui-stack"][data-ui-stack-state~="align=start"][data-v-8ab460be] {
3432
+ [data-component~="ui-stack"][data-ui-stack-state~="align=start"][data-v-aa8062a9] {
3425
3433
  align-items: flex-start;
3426
3434
  }
3427
- [data-component~="ui-stack"][data-ui-stack-state~="align=center"][data-v-8ab460be] {
3435
+ [data-component~="ui-stack"][data-ui-stack-state~="align=center"][data-v-aa8062a9] {
3428
3436
  align-items: center;
3429
3437
  }
3430
- [data-component~="ui-stack"][data-ui-stack-state~="align=end"][data-v-8ab460be] {
3438
+ [data-component~="ui-stack"][data-ui-stack-state~="align=end"][data-v-aa8062a9] {
3431
3439
  align-items: flex-end;
3432
3440
  }
3433
- [data-component~="ui-stack"][data-ui-stack-state~="justify=center"][data-v-8ab460be] {
3441
+ [data-component~="ui-stack"][data-ui-stack-state~="justify=center"][data-v-aa8062a9] {
3434
3442
  justify-content: center;
3435
3443
  }
3436
- [data-component~="ui-stack"][data-ui-stack-state~="justify=end"][data-v-8ab460be] {
3444
+ [data-component~="ui-stack"][data-ui-stack-state~="justify=end"][data-v-aa8062a9] {
3437
3445
  justify-content: flex-end;
3438
3446
  }
3439
- [data-component~="ui-stack"][data-ui-stack-state~="justify=between"][data-v-8ab460be] {
3447
+ [data-component~="ui-stack"][data-ui-stack-state~="justify=between"][data-v-aa8062a9] {
3440
3448
  justify-content: space-between;
3441
3449
  }
3442
3450
 
3443
3451
  /* A component that sets its display still honours the hidden attribute on its root. */
3444
- [data-component~="ui-stack"][hidden][data-v-8ab460be] {
3452
+ [data-component~="ui-stack"][hidden][data-v-aa8062a9] {
3445
3453
  display: none;
3446
3454
  }
3447
3455
 
@@ -3519,8 +3527,8 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3519
3527
  display: none;
3520
3528
  }
3521
3529
 
3522
- [data-component~="ui-switcher"][data-v-4c7859e6] {
3523
- --_switcher-gap: var(--ui-space-4, 1rem);
3530
+ [data-component~="ui-switcher"][data-v-4ba623e1] {
3531
+ --_switcher-gap: var(--ui-space-4);
3524
3532
  display: flex;
3525
3533
  flex-wrap: wrap;
3526
3534
  gap: var(--ui-switcher-gap, var(--_switcher-gap));
@@ -3528,57 +3536,68 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3528
3536
  max-inline-size: 100%;
3529
3537
  margin: 0;
3530
3538
  }
3531
- [data-component~="ui-switcher"] > [data-v-4c7859e6-s] {
3539
+ [data-component~="ui-switcher"] > [data-v-4ba623e1-s] {
3532
3540
  min-inline-size: 0;
3533
3541
  flex-grow: 1;
3534
3542
  /* The large multiplier makes the basis flip as a group at the intrinsic threshold. */
3535
3543
  flex-basis: calc((var(--ui-switcher-threshold, 30rem) - 100%) * 999);
3536
3544
  }
3537
- [data-component~="ui-switcher"][data-ui-switcher-state~="gap=xs"][data-v-4c7859e6] {
3538
- --_switcher-gap: var(--ui-space-2, 0.5rem);
3545
+ [data-component~="ui-switcher"][data-ui-switcher-state~="gap=xs"][data-v-4ba623e1] {
3546
+ --_switcher-gap: var(--ui-space-2);
3539
3547
  }
3540
- [data-component~="ui-switcher"][data-ui-switcher-state~="gap=s"][data-v-4c7859e6] {
3541
- --_switcher-gap: var(--ui-space-3, 0.75rem);
3548
+ [data-component~="ui-switcher"][data-ui-switcher-state~="gap=s"][data-v-4ba623e1] {
3549
+ --_switcher-gap: var(--ui-space-3);
3542
3550
  }
3543
- [data-component~="ui-switcher"][data-ui-switcher-state~="gap=m"][data-v-4c7859e6] {
3544
- --_switcher-gap: var(--ui-space-4, 1rem);
3551
+ [data-component~="ui-switcher"][data-ui-switcher-state~="gap=m"][data-v-4ba623e1] {
3552
+ --_switcher-gap: var(--ui-space-4);
3545
3553
  }
3546
- [data-component~="ui-switcher"][data-ui-switcher-state~="gap=l"][data-v-4c7859e6] {
3547
- --_switcher-gap: var(--ui-space-5, 1.5rem);
3554
+ [data-component~="ui-switcher"][data-ui-switcher-state~="gap=l"][data-v-4ba623e1] {
3555
+ --_switcher-gap: var(--ui-space-5);
3548
3556
  }
3549
- [data-component~="ui-switcher"][data-ui-switcher-state~="gap=xl"][data-v-4c7859e6] {
3550
- --_switcher-gap: var(--ui-space-6, 2rem);
3557
+ [data-component~="ui-switcher"][data-ui-switcher-state~="gap=xl"][data-v-4ba623e1] {
3558
+ --_switcher-gap: var(--ui-space-6);
3551
3559
  }
3552
- [data-component~="ui-switcher"][data-ui-switcher-state~="threshold=xs"] > [data-v-4c7859e6-s] {
3560
+ [data-component~="ui-switcher"][data-ui-switcher-state~="threshold=xs"] > [data-v-4ba623e1-s] {
3553
3561
  flex-basis: calc((var(--ui-switcher-threshold, 20rem) - 100%) * 999);
3554
3562
  }
3555
- [data-component~="ui-switcher"][data-ui-switcher-state~="threshold=md"] > [data-v-4c7859e6-s] {
3563
+ [data-component~="ui-switcher"][data-ui-switcher-state~="threshold=md"] > [data-v-4ba623e1-s] {
3556
3564
  flex-basis: calc((var(--ui-switcher-threshold, 45rem) - 100%) * 999);
3557
3565
  }
3558
- [data-component~="ui-switcher"][data-ui-switcher-state~="threshold=lg"] > [data-v-4c7859e6-s] {
3566
+ [data-component~="ui-switcher"][data-ui-switcher-state~="threshold=lg"] > [data-v-4ba623e1-s] {
3559
3567
  flex-basis: calc((var(--ui-switcher-threshold, 60rem) - 100%) * 999);
3560
3568
  }
3561
- [data-component~="ui-switcher"][data-ui-switcher-state~="align=start"][data-v-4c7859e6] {
3569
+ [data-component~="ui-switcher"][data-ui-switcher-state~="align=start"][data-v-4ba623e1] {
3562
3570
  align-items: flex-start;
3563
3571
  }
3564
- [data-component~="ui-switcher"][data-ui-switcher-state~="align=center"][data-v-4c7859e6] {
3572
+ [data-component~="ui-switcher"][data-ui-switcher-state~="align=center"][data-v-4ba623e1] {
3565
3573
  align-items: center;
3566
3574
  }
3567
- [data-component~="ui-switcher"][data-ui-switcher-state~="align=end"][data-v-4c7859e6] {
3575
+ [data-component~="ui-switcher"][data-ui-switcher-state~="align=end"][data-v-4ba623e1] {
3568
3576
  align-items: flex-end;
3569
3577
  }
3570
3578
 
3571
3579
  /* A component that sets its display still honours the hidden attribute on its root. */
3572
- [data-component~="ui-switcher"][hidden][data-v-4c7859e6] {
3580
+ [data-component~="ui-switcher"][hidden][data-v-4ba623e1] {
3573
3581
  display: none;
3574
3582
  }
3575
3583
 
3576
- [data-component~="ui-tabs"][data-v-d4ecb8b6] {
3584
+ /* Density resolves into the tab row's own values; the public tokens still override them. */
3585
+ [data-component~="ui-tabs"][data-v-b9e876c6] {
3586
+ --_tab-min-block-size: var(--ui-control-size);
3587
+ --_tab-padding-block: var(--ui-space-2);
3588
+ --_tab-padding-inline: var(--ui-space-3);
3589
+ }
3590
+ [data-component~="ui-tabs"][data-ui-tabs-state~="density=compact"][data-v-b9e876c6] {
3591
+ --_tab-min-block-size: var(--ui-control-size-sm);
3592
+ --_tab-padding-block: var(--ui-space-1);
3593
+ --_tab-padding-inline: var(--ui-space-2);
3594
+ }
3595
+ [data-component~="ui-tabs"][data-v-b9e876c6] {
3577
3596
  display: grid;
3578
3597
  inline-size: 100%;
3579
3598
  min-inline-size: 0;
3580
3599
  }
3581
- .list[data-v-d4ecb8b6] {
3600
+ .list[data-v-b9e876c6] {
3582
3601
  display: grid;
3583
3602
  grid-auto-flow: column;
3584
3603
  grid-auto-columns: max-content;
@@ -3594,60 +3613,61 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3594
3613
  scrollbar-width: thin;
3595
3614
  border-block-end: 1px solid var(--ui-border-default);
3596
3615
  }
3597
- .list button[data-v-d4ecb8b6] {
3598
- min-block-size: 2.5rem;
3616
+ .list button[data-v-b9e876c6] {
3617
+ min-block-size: var(--ui-tabs-tab-min-block-size, var(--_tab-min-block-size));
3599
3618
  margin: 0 0 -1px;
3600
- padding: var(--ui-space-2) var(--ui-space-3);
3619
+ padding: var(--ui-tabs-tab-padding-block, var(--_tab-padding-block))
3620
+ var(--ui-tabs-tab-padding-inline, var(--_tab-padding-inline));
3601
3621
  border: 0;
3602
3622
  border-block-end: 2px solid transparent;
3603
3623
  background: transparent;
3604
3624
  color: var(--ui-text-secondary);
3605
3625
  font: inherit;
3606
3626
  font-size: var(--ui-font-size-sm);
3607
- font-weight: var(--ui-font-medium, 500);
3627
+ font-weight: var(--ui-font-medium);
3608
3628
  cursor: pointer;
3609
3629
  transition:
3610
3630
  color var(--ui-motion-fast) var(--ui-motion-ease),
3611
3631
  background-color var(--ui-motion-fast) var(--ui-motion-ease),
3612
3632
  border-color var(--ui-motion-fast) var(--ui-motion-ease);
3613
3633
  }
3614
- [data-component~="ui-tabs"][data-ui-tabs-state~="stretch"] .list[data-v-d4ecb8b6] {
3634
+ [data-component~="ui-tabs"][data-ui-tabs-state~="stretch"] .list[data-v-b9e876c6] {
3615
3635
  grid-auto-columns: minmax(max-content, 1fr);
3616
3636
  }
3617
- .list button[data-v-d4ecb8b6] {
3637
+ .list button[data-v-b9e876c6] {
3618
3638
  white-space: nowrap;
3619
3639
  }
3620
- .list button[data-v-d4ecb8b6]:hover {
3640
+ .list button[data-v-b9e876c6]:hover {
3621
3641
  color: var(--ui-text-primary);
3622
3642
  background: var(--ui-surface-muted);
3623
3643
  }
3624
- .list button[aria-selected="true"][data-v-d4ecb8b6] {
3644
+ .list button[aria-selected="true"][data-v-b9e876c6] {
3625
3645
  color: var(--ui-accent-solid);
3626
3646
  border-block-end-color: var(--ui-accent-solid);
3627
3647
  }
3628
- .list button[data-v-d4ecb8b6]:focus-visible {
3648
+ .list button[data-v-b9e876c6]:focus-visible {
3629
3649
  position: relative;
3630
3650
  outline: none;
3631
3651
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);
3632
- border-radius: var(--ui-radius-1);
3652
+ border-radius: var(--ui-radius-sm);
3633
3653
  }
3634
- .panels[data-v-d4ecb8b6] {
3654
+ .panels[data-v-b9e876c6] {
3635
3655
  min-inline-size: 0;
3636
3656
  }
3637
- [data-v-d4ecb8b6-s] {
3657
+ [data-v-b9e876c6-s] {
3638
3658
  padding: var(--ui-space-4);
3639
3659
  }
3640
- [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"][data-v-d4ecb8b6] {
3660
+ [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"][data-v-b9e876c6] {
3641
3661
  grid-template-columns: max-content minmax(0, 1fr);
3642
3662
  align-items: start;
3643
3663
  }
3644
- [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"] .list[data-v-d4ecb8b6] {
3664
+ [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"] .list[data-v-b9e876c6] {
3645
3665
  grid-auto-flow: row;
3646
3666
  grid-auto-columns: auto;
3647
3667
  border-block-end: 0;
3648
3668
  border-inline-end: 1px solid var(--ui-border-default);
3649
3669
  }
3650
- [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"] .list button[data-v-d4ecb8b6] {
3670
+ [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"] .list button[data-v-b9e876c6] {
3651
3671
  margin: 0 -1px 0 0;
3652
3672
  border-block-end: 0;
3653
3673
  border-inline-end: 2px solid transparent;
@@ -3655,32 +3675,32 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3655
3675
  }
3656
3676
  [data-component~="ui-tabs"][data-ui-tabs-state~="orientation=vertical"]
3657
3677
  .list
3658
- button[aria-selected="true"][data-v-d4ecb8b6] {
3678
+ button[aria-selected="true"][data-v-b9e876c6] {
3659
3679
  border-inline-end-color: var(--ui-accent-solid);
3660
3680
  }
3661
3681
  @media (prefers-reduced-motion: reduce) {
3662
- .list button[data-v-d4ecb8b6] {
3682
+ .list button[data-v-b9e876c6] {
3663
3683
  transition: none;
3664
3684
  }
3665
3685
  }
3666
3686
 
3667
3687
  /* A component that sets its display still honours the hidden attribute on its root. */
3668
- [data-component~="ui-tabs"][hidden][data-v-d4ecb8b6] {
3688
+ [data-component~="ui-tabs"][hidden][data-v-b9e876c6] {
3669
3689
  display: none;
3670
3690
  }
3671
3691
 
3672
- [data-component~="ui-textarea"][data-v-3c990207] {
3692
+ [data-component~="ui-textarea"][data-v-2b01ccc0] {
3673
3693
  box-sizing: border-box;
3674
3694
  display: inline-block;
3675
3695
  inline-size: 100%;
3676
3696
  min-inline-size: 0;
3677
- min-block-size: calc(var(--ui-space-12, 3rem) * 2);
3697
+ min-block-size: calc(3rem * 2);
3678
3698
  margin: 0;
3679
3699
  padding: var(--ui-space-2) var(--ui-space-3);
3680
3700
  appearance: none;
3681
3701
  resize: vertical;
3682
3702
  border: 1px solid var(--ui-control-border, var(--ui-border-strong));
3683
- border-radius: var(--ui-textarea-radius, var(--ui-radius-2));
3703
+ border-radius: var(--ui-textarea-radius, var(--ui-radius-md));
3684
3704
  background: var(--ui-control-surface, var(--ui-surface-elevated));
3685
3705
  color: var(--ui-text-primary);
3686
3706
  font: inherit;
@@ -3693,18 +3713,18 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3693
3713
  }
3694
3714
 
3695
3715
  /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */
3696
- [data-component~="ui-textarea"][data-v-3c990207]::selection {
3716
+ [data-component~="ui-textarea"][data-v-2b01ccc0]::selection {
3697
3717
  background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);
3698
3718
  color: inherit;
3699
3719
  }
3700
- [data-component~="ui-textarea"][data-v-3c990207]::placeholder {
3720
+ [data-component~="ui-textarea"][data-v-2b01ccc0]::placeholder {
3701
3721
  color: var(--ui-control-placeholder, var(--ui-text-secondary));
3702
3722
  opacity: 1;
3703
3723
  }
3704
- [data-component~="ui-textarea"][data-v-3c990207]:hover:not(:focus):not(:disabled) {
3724
+ [data-component~="ui-textarea"][data-v-2b01ccc0]:hover:not(:focus):not(:disabled) {
3705
3725
  border-color: var(--ui-control-border-hover, var(--ui-text-secondary));
3706
3726
  }
3707
- [data-component~="ui-textarea"][data-v-3c990207]:focus-visible {
3727
+ [data-component~="ui-textarea"][data-v-2b01ccc0]:focus-visible {
3708
3728
  border-color: var(--ui-control-focus, var(--ui-accent-solid));
3709
3729
  outline: none;
3710
3730
  box-shadow: var(
@@ -3715,16 +3735,16 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3715
3735
  }
3716
3736
 
3717
3737
  /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */
3718
- [data-component~="ui-textarea"][aria-invalid="true"][data-v-3c990207],
3719
- [data-component~="ui-textarea"][data-v-3c990207]:is(:user-invalid, [data-user-invalid]) {
3738
+ [data-component~="ui-textarea"][aria-invalid="true"][data-v-2b01ccc0],
3739
+ [data-component~="ui-textarea"][data-v-2b01ccc0]:is(:user-invalid, [data-user-invalid]) {
3720
3740
  border-color: var(--ui-danger-solid);
3721
3741
  }
3722
- [data-component~="ui-textarea"][data-v-3c990207]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
3742
+ [data-component~="ui-textarea"][data-v-2b01ccc0]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
3723
3743
  box-shadow:
3724
3744
  var(--ui-control-inset),
3725
3745
  0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);
3726
3746
  }
3727
- [data-component~="ui-textarea"][data-v-3c990207]:disabled {
3747
+ [data-component~="ui-textarea"][data-v-2b01ccc0]:disabled {
3728
3748
  background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
3729
3749
  color: var(--ui-text-muted);
3730
3750
  box-shadow: none;
@@ -3732,11 +3752,11 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3732
3752
  }
3733
3753
 
3734
3754
  /* A component that sets its display still honours the hidden attribute on its root. */
3735
- [data-component~="ui-textarea"][hidden][data-v-3c990207] {
3755
+ [data-component~="ui-textarea"][hidden][data-v-2b01ccc0] {
3736
3756
  display: none;
3737
3757
  }
3738
3758
 
3739
- [data-component~="ui-toast-region"][data-v-d98878bd] {
3759
+ [data-component~="ui-toast-region"][data-v-7d8dab78] {
3740
3760
  position: fixed;
3741
3761
  top: calc(var(--ui-space-4) + env(safe-area-inset-top));
3742
3762
  right: auto;
@@ -3758,34 +3778,34 @@ input[data-v-44eb48fd], input[data-v-44eb48fd]::after {
3758
3778
  box-shadow: none;
3759
3779
  pointer-events: none;
3760
3780
  }
3761
- [data-component~="ui-toast-region"][data-v-d98878bd]:not(:popover-open) {
3781
+ [data-component~="ui-toast-region"][data-v-7d8dab78]:not(:popover-open) {
3762
3782
  display: none;
3763
3783
  }
3764
- [data-component~="ui-toast-region"] > .toast[data-v-d98878bd],
3765
- [data-component~="ui-toast-region"] > [data-v-d98878bd-s] {
3784
+ [data-component~="ui-toast-region"] > .toast[data-v-7d8dab78],
3785
+ [data-component~="ui-toast-region"] > [data-v-7d8dab78-s] {
3766
3786
  pointer-events: auto;
3767
3787
  }
3768
- .toast[data-v-d98878bd] {
3788
+ .toast[data-v-7d8dab78] {
3769
3789
  display: grid;
3770
3790
  grid-template-columns: 1fr auto;
3771
3791
  gap: var(--ui-space-2);
3772
3792
  align-items: start;
3773
3793
  border: 1px solid var(--ui-border-default);
3774
- border-radius: var(--ui-radius-3);
3794
+ border-radius: var(--ui-radius-lg);
3775
3795
  padding: var(--ui-space-3) var(--ui-space-4);
3776
3796
  background: var(--ui-surface-elevated);
3777
3797
  color: var(--ui-text-primary);
3778
3798
  box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));
3779
- animation: ui-toast-enter-d98878bd var(--ui-toast-enter-duration, 0.32s)
3799
+ animation: ui-toast-enter-7d8dab78 var(--ui-toast-enter-duration, 0.32s)
3780
3800
  var(--ui-motion-ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both;
3781
3801
  }
3782
3802
 
3783
3803
  /* Leaving slides on down and fades; the controller removes the toast when this ends. */
3784
- .toast.closing[data-v-d98878bd] {
3785
- animation: ui-toast-exit-d98878bd var(--ui-toast-exit-duration, 0.22s) var(--ui-motion-ease, ease) both;
3804
+ .toast.closing[data-v-7d8dab78] {
3805
+ animation: ui-toast-exit-7d8dab78 var(--ui-toast-exit-duration, 0.22s) var(--ui-motion-ease) both;
3786
3806
  pointer-events: none;
3787
3807
  }
3788
- @keyframes ui-toast-enter-d98878bd {
3808
+ @keyframes ui-toast-enter-7d8dab78 {
3789
3809
  from {
3790
3810
  opacity: 0;
3791
3811
  transform: translateY(-1rem);
@@ -3795,7 +3815,7 @@ to {
3795
3815
  transform: translateY(0);
3796
3816
  }
3797
3817
  }
3798
- @keyframes ui-toast-exit-d98878bd {
3818
+ @keyframes ui-toast-exit-7d8dab78 {
3799
3819
  from {
3800
3820
  opacity: 1;
3801
3821
  transform: translateY(0);
@@ -3806,83 +3826,88 @@ to {
3806
3826
  }
3807
3827
  }
3808
3828
  @media (prefers-reduced-motion: reduce) {
3809
- .toast[data-v-d98878bd], .toast.closing[data-v-d98878bd] {
3829
+ .toast[data-v-7d8dab78], .toast.closing[data-v-7d8dab78] {
3810
3830
  animation: none;
3811
3831
  }
3812
3832
  }
3813
- .message[data-v-d98878bd] {
3833
+ .message[data-v-7d8dab78] {
3814
3834
  min-inline-size: 0;
3815
3835
  align-self: center;
3816
3836
  }
3817
- .dismiss[data-v-d98878bd] {
3837
+ .dismiss[data-v-7d8dab78] {
3818
3838
  align-self: center;
3819
3839
  margin-inline-end: calc(var(--ui-space-2) * -1);
3820
3840
  }
3821
3841
 
3822
3842
  /* A component that sets its display still honours the hidden attribute on its root. */
3823
- [data-component~="ui-toast-region"][hidden][data-v-d98878bd] {
3843
+ [data-component~="ui-toast-region"][hidden][data-v-7d8dab78] {
3824
3844
  display: none;
3825
3845
  }
3826
3846
 
3827
- [data-component~="ui-top-bar"][data-v-e785cef9] {
3847
+ [data-component~="ui-top-bar"][data-v-88437f08] {
3828
3848
  position: sticky;
3829
3849
  inset-block-start: 0;
3830
3850
  z-index: var(--ui-top-bar-z-index, 100);
3831
3851
  min-block-size: calc(var(--ui-top-bar-height, 56px) + env(safe-area-inset-top));
3832
3852
  display: flex;
3833
3853
  align-items: center;
3834
- gap: var(--ui-top-bar-gap, var(--ui-space-3, 0.75rem));
3854
+ gap: var(--ui-top-bar-gap, var(--ui-space-3));
3835
3855
  padding-block-start: env(safe-area-inset-top);
3836
3856
  padding-inline-start: max(
3837
- var(--ui-top-bar-padding-inline, var(--ui-space-4, 1rem)),
3857
+ var(--ui-top-bar-padding-inline, var(--ui-space-4)),
3838
3858
  env(safe-area-inset-left)
3839
3859
  );
3840
3860
  padding-inline-end: max(
3841
- var(--ui-top-bar-padding-inline, var(--ui-space-4, 1rem)),
3861
+ var(--ui-top-bar-padding-inline, var(--ui-space-4)),
3842
3862
  env(safe-area-inset-right)
3843
3863
  );
3844
- background: var(--ui-top-bar-bg, var(--ui-surface-elevated));
3864
+ background: var(--ui-top-bar-surface, var(--ui-surface-elevated));
3845
3865
  border-block-end: 1px solid var(--ui-top-bar-border, var(--ui-border-default));
3846
3866
  }
3847
- .leading[data-v-e785cef9],
3848
- .search[data-v-e785cef9],
3849
- .actions[data-v-e785cef9] {
3867
+ .leading[data-v-88437f08],
3868
+ .search[data-v-88437f08],
3869
+ .actions[data-v-88437f08] {
3850
3870
  display: flex;
3851
3871
  align-items: center;
3852
3872
  flex-shrink: 0;
3853
3873
  }
3854
- .actions[data-v-e785cef9] {
3855
- gap: var(--ui-top-bar-actions-gap, var(--ui-space-1, 0.25rem));
3874
+ .actions[data-v-88437f08] {
3875
+ gap: var(--ui-top-bar-actions-gap, var(--ui-space-1));
3856
3876
  }
3857
- .title[data-v-e785cef9] {
3877
+ .title[data-v-88437f08] {
3858
3878
  min-inline-size: 0;
3859
3879
  flex: 1;
3860
3880
  }
3861
3881
 
3862
3882
  /* An unused region takes no space, so it adds no gap. */
3863
- .leading[data-v-e785cef9]:empty,
3864
- .search[data-v-e785cef9]:empty,
3865
- .actions[data-v-e785cef9]:empty {
3883
+ .leading[data-v-88437f08]:empty,
3884
+ .search[data-v-88437f08]:empty,
3885
+ .actions[data-v-88437f08]:empty {
3866
3886
  display: none;
3867
3887
  }
3868
3888
 
3869
3889
  /* A component that sets its display still honours the hidden attribute on its root. */
3870
- [data-component~="ui-top-bar"][hidden][data-v-e785cef9] {
3890
+ [data-component~="ui-top-bar"][hidden][data-v-88437f08] {
3871
3891
  display: none;
3872
3892
  }
3873
3893
 
3874
- [data-component~="ui-tree"][data-v-abe57610] {
3894
+ [data-component~="ui-tree"][data-ui-tree-state~="density=compact"][data-v-e94f7a5c] {
3895
+ --ui-tree-item-min-block-size: var(--ui-control-size-sm);
3896
+ --ui-tree-item-font-size: var(--ui-font-size-sm);
3897
+ --ui-tree-item-label-padding-block: 0;
3898
+ }
3899
+ [data-component~="ui-tree"][data-v-e94f7a5c] {
3875
3900
  display: block;
3876
3901
  min-inline-size: 0;
3877
3902
  padding-inline-start: var(--ui-tree-gutter, 0px);
3878
3903
  }
3879
3904
 
3880
3905
  /* A component that sets its display still honours the hidden attribute on its root. */
3881
- [data-component~="ui-tree"][hidden][data-v-abe57610] {
3906
+ [data-component~="ui-tree"][hidden][data-v-e94f7a5c] {
3882
3907
  display: none;
3883
3908
  }
3884
3909
 
3885
- [data-component~="ui-tree-item"][data-v-554c49dd] {
3910
+ [data-component~="ui-tree-item"][data-v-b57a29c6] {
3886
3911
  --_tree-row-min-height: 32px;
3887
3912
 
3888
3913
  position: relative;
@@ -3890,14 +3915,14 @@ to {
3890
3915
  min-inline-size: 0;
3891
3916
  margin-inline-start: calc(var(--ui-tree-item-depth, 0) * var(--ui-tree-indent, 16px));
3892
3917
  }
3893
- .row[data-v-554c49dd] {
3918
+ .row[data-v-b57a29c6] {
3894
3919
  position: relative;
3895
3920
  display: grid;
3896
3921
  grid-template-columns: 20px auto minmax(0, 1fr) auto;
3897
3922
  align-items: center;
3898
- min-block-size: var(--ui-tree-row-min-height, var(--_tree-row-min-height));
3923
+ min-block-size: var(--ui-tree-item-min-block-size, var(--_tree-row-min-height));
3899
3924
  min-inline-size: 0;
3900
- font-size: var(--ui-tree-font-size, var(--ui-font-size-ui, 0.9375rem));
3925
+ font-size: var(--ui-tree-item-font-size, var(--ui-font-size-ui));
3901
3926
  border-radius: var(--ui-radius-md);
3902
3927
  color: var(--ui-text-secondary);
3903
3928
  transition:
@@ -3907,36 +3932,38 @@ to {
3907
3932
  box-shadow var(--ui-motion-fast) var(--ui-motion-ease),
3908
3933
  min-block-size var(--ui-motion-base) var(--ui-motion-ease);
3909
3934
  }
3910
- .row[data-v-554c49dd]:hover,
3911
- [data-component~="ui-tree-item"][data-ui-tree-item-state~="selected"] .row[data-v-554c49dd],
3912
- .row[data-v-554c49dd]:focus-within {
3935
+ .row[data-v-b57a29c6]:hover,
3936
+ [data-component~="ui-tree-item"][data-ui-tree-item-state~="selected"] .row[data-v-b57a29c6],
3937
+ .row[data-v-b57a29c6]:focus-within {
3913
3938
  color: var(--ui-text-primary);
3914
3939
  background: var(--ui-surface-muted);
3915
3940
  }
3916
- [data-component~="ui-tree-item"][data-ui-tree-item-state~="disabled"] .row[data-v-554c49dd] {
3941
+ [data-component~="ui-tree-item"][data-ui-tree-item-state~="disabled"] .row[data-v-b57a29c6] {
3917
3942
  opacity: 0.55;
3918
3943
  }
3919
- [data-component~="ui-tree-item"][data-dragging] .row[data-v-554c49dd] {
3944
+ [data-component~="ui-tree-item"][data-dragging] .row[data-v-b57a29c6] {
3920
3945
  opacity: 0.42;
3921
3946
  }
3922
- [data-component~="ui-tree-item"][data-v-554c49dd]:focus {
3947
+ [data-component~="ui-tree-item"][data-v-b57a29c6]:focus {
3923
3948
  outline: none;
3924
3949
  }
3925
- [data-component~="ui-tree-item"]:focus-visible .row[data-v-554c49dd] {
3950
+ [data-component~="ui-tree-item"]:focus-visible .row[data-v-b57a29c6] {
3926
3951
  box-shadow: 0 0 0 2px var(--ui-focus-ring);
3927
3952
  }
3928
- [data-component~="ui-tree-item"][data-drop-position="inside"] .row[data-v-554c49dd] {
3953
+
3954
+ /* Child combinators: drop feedback belongs to this item's own row, not the rows nested in it. */
3955
+ [data-component~="ui-tree-item"][data-drop-position="inside"] > .row[data-v-b57a29c6] {
3929
3956
  background: var(--ui-accent-subtle);
3930
3957
  box-shadow: inset 0 0 0 1px var(--ui-tree-drop-color, var(--ui-accent-solid));
3931
3958
  }
3932
- .disclosure[data-v-554c49dd],
3933
- .disclosure-spacer[data-v-554c49dd] {
3959
+ .disclosure[data-v-b57a29c6],
3960
+ .disclosure-spacer[data-v-b57a29c6] {
3934
3961
  grid-column: 1;
3935
3962
  grid-row: 1;
3936
3963
  inline-size: 20px;
3937
3964
  block-size: 28px;
3938
3965
  }
3939
- .disclosure[data-v-554c49dd] {
3966
+ .disclosure[data-v-b57a29c6] {
3940
3967
  display: grid;
3941
3968
  place-items: center;
3942
3969
  padding: 0;
@@ -3946,14 +3973,14 @@ to {
3946
3973
  border-radius: var(--ui-radius-sm);
3947
3974
  cursor: pointer;
3948
3975
  }
3949
- .disclosure[hidden][data-v-554c49dd] {
3976
+ .disclosure[hidden][data-v-b57a29c6] {
3950
3977
  display: none;
3951
3978
  }
3952
- .disclosure[data-v-554c49dd]:hover {
3979
+ .disclosure[data-v-b57a29c6]:hover {
3953
3980
  color: var(--ui-text-primary);
3954
3981
  background: var(--ui-surface-elevated);
3955
3982
  }
3956
- .disclosure-icon[data-v-554c49dd] {
3983
+ .disclosure-icon[data-v-b57a29c6] {
3957
3984
  display: grid;
3958
3985
  place-items: center;
3959
3986
  inline-size: 14px;
@@ -3961,7 +3988,7 @@ to {
3961
3988
  transform: rotate(-90deg);
3962
3989
  transition: transform var(--ui-motion-fast) var(--ui-motion-ease);
3963
3990
  }
3964
- .disclosure-icon[data-v-554c49dd]::before {
3991
+ .disclosure-icon[data-v-b57a29c6]::before {
3965
3992
  display: block;
3966
3993
  inline-size: 0.45rem;
3967
3994
  block-size: 0.45rem;
@@ -3971,19 +3998,19 @@ to {
3971
3998
  /* A chevron's ink sits below its box centre; lift it so it centres optically (in either rotation). */
3972
3999
  transform: translateY(-20%) rotate(45deg);
3973
4000
  }
3974
- [data-component~="ui-tree-item"][aria-expanded="true"] .disclosure-icon[data-v-554c49dd] {
4001
+ [data-component~="ui-tree-item"][aria-expanded="true"] .disclosure-icon[data-v-b57a29c6] {
3975
4002
  transform: rotate(0deg);
3976
4003
  }
3977
4004
 
3978
4005
  /* Lucide grip-vertical, filling the handle as in Looma 0.2. */
3979
- .drag-handle svg[data-v-554c49dd] {
4006
+ .drag-handle svg[data-v-b57a29c6] {
3980
4007
  display: block;
3981
4008
  inline-size: 100%;
3982
4009
  block-size: 100%;
3983
4010
  }
3984
4011
 
3985
4012
  /* Slotted content is outside this scope, so :has() cannot see it; hide only a truly empty slot. */
3986
- .leading[data-v-554c49dd] {
4013
+ .leading[data-v-b57a29c6] {
3987
4014
  display: inline-grid;
3988
4015
  place-items: center;
3989
4016
  grid-column: 2;
@@ -3993,12 +4020,12 @@ to {
3993
4020
  margin-inline-start: var(--ui-space-1);
3994
4021
  color: var(--ui-text-muted);
3995
4022
  }
3996
- .leading[data-v-554c49dd]:empty {
4023
+ .leading[data-v-b57a29c6]:empty {
3997
4024
  display: none;
3998
4025
  }
3999
4026
 
4000
4027
  /* Icons match the label's size (as in Knit's tree): an unsized SVG would otherwise render 300×150. */
4001
- svg[data-v-554c49dd-s],img[data-v-554c49dd-s] {
4028
+ svg[data-v-b57a29c6-s],img[data-v-b57a29c6-s] {
4002
4029
  display: block;
4003
4030
  inline-size: 1em;
4004
4031
  block-size: 1em;
@@ -4007,24 +4034,31 @@ svg[data-v-554c49dd-s],img[data-v-554c49dd-s] {
4007
4034
 
4008
4035
  /* The label spans the row's height and centres its content, so slotted content (a link) can
4009
4036
  stretch to fill the row as its own hit area; the padding tokens remove the inset. */
4010
- .label[data-v-554c49dd] {
4037
+ .label[data-v-b57a29c6] {
4011
4038
  grid-column: 3;
4012
4039
  grid-row: 1;
4013
4040
  align-self: stretch;
4014
4041
  display: flex;
4015
4042
  align-items: center;
4016
4043
  min-inline-size: 0;
4017
- padding: var(--ui-tree-label-padding-block, var(--ui-space-1))
4018
- var(--ui-tree-label-padding-inline, var(--ui-space-2));
4044
+ padding: var(--ui-tree-item-label-padding-block, var(--ui-space-1))
4045
+ var(--ui-tree-item-label-padding-inline, var(--ui-space-2));
4046
+ }
4047
+
4048
+ /* Slotted label content fills the cell, so a link is the row's hit area rather than sizing to
4049
+ its own text and reading as overflow. */
4050
+ .label > [data-v-b57a29c6-s] {
4051
+ flex: 1 1 auto;
4052
+ min-inline-size: 0;
4019
4053
  }
4020
- .actions[data-v-554c49dd] {
4054
+ .actions[data-v-b57a29c6] {
4021
4055
  grid-column: 4;
4022
4056
  grid-row: 1;
4023
4057
  display: inline-flex;
4024
4058
  align-items: center;
4025
4059
  min-inline-size: 0;
4026
4060
  }
4027
- .drag-handle[data-v-554c49dd] {
4061
+ .drag-handle[data-v-b57a29c6] {
4028
4062
  position: absolute;
4029
4063
  z-index: 2;
4030
4064
  inset-block-start: 50%;
@@ -4045,16 +4079,16 @@ svg[data-v-554c49dd-s],img[data-v-554c49dd-s] {
4045
4079
  transform: translateY(-50%);
4046
4080
  transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);
4047
4081
  }
4048
- .row:hover .drag-handle[data-v-554c49dd],
4049
- .drag-handle[data-v-554c49dd]:hover,
4050
- .drag-handle[data-v-554c49dd]:focus-visible,
4051
- [data-component~="ui-tree-item"][data-dragging] .drag-handle[data-v-554c49dd] {
4082
+ .row:hover .drag-handle[data-v-b57a29c6],
4083
+ .drag-handle[data-v-b57a29c6]:hover,
4084
+ .drag-handle[data-v-b57a29c6]:focus-visible,
4085
+ [data-component~="ui-tree-item"][data-dragging] > .row > .drag-handle[data-v-b57a29c6] {
4052
4086
  opacity: 1;
4053
4087
  }
4054
- .drag-handle[data-v-554c49dd]:active {
4088
+ .drag-handle[data-v-b57a29c6]:active {
4055
4089
  cursor: grabbing;
4056
4090
  }
4057
- .drop-indicator[data-v-554c49dd] {
4091
+ .drop-indicator[data-v-b57a29c6] {
4058
4092
  position: absolute;
4059
4093
  z-index: 3;
4060
4094
  inset-inline: 1px;
@@ -4064,8 +4098,8 @@ svg[data-v-554c49dd-s],img[data-v-554c49dd-s] {
4064
4098
  background: var(--ui-tree-drop-color, var(--ui-accent-solid));
4065
4099
  pointer-events: none;
4066
4100
  }
4067
- .drop-indicator[data-v-554c49dd]::before,
4068
- .drop-indicator[data-v-554c49dd]::after {
4101
+ .drop-indicator[data-v-b57a29c6]::before,
4102
+ .drop-indicator[data-v-b57a29c6]::after {
4069
4103
  content: "";
4070
4104
  position: absolute;
4071
4105
  inset-block-start: 50%;
@@ -4076,39 +4110,39 @@ svg[data-v-554c49dd-s],img[data-v-554c49dd-s] {
4076
4110
  background: var(--ui-surface-elevated);
4077
4111
  transform: translateY(-50%);
4078
4112
  }
4079
- .drop-indicator[data-v-554c49dd]::before {
4113
+ .drop-indicator[data-v-b57a29c6]::before {
4080
4114
  inset-inline-start: -1px;
4081
4115
  }
4082
- .drop-indicator[data-v-554c49dd]::after {
4116
+ .drop-indicator[data-v-b57a29c6]::after {
4083
4117
  inset-inline-end: -1px;
4084
4118
  }
4085
- [data-component~="ui-tree-item"][data-drop-position="before"] .row-drop-indicator[data-v-554c49dd] {
4119
+ [data-component~="ui-tree-item"][data-drop-position="before"] > .row > .row-drop-indicator[data-v-b57a29c6] {
4086
4120
  display: block;
4087
4121
  inset-block-start: -1px;
4088
4122
  }
4089
- [data-component~="ui-tree-item"][data-drop-position="after"] .subtree-drop-indicator[data-v-554c49dd] {
4123
+ [data-component~="ui-tree-item"][data-drop-position="after"] > .subtree-drop-indicator[data-v-b57a29c6] {
4090
4124
  display: block;
4091
4125
  inset-block-end: -1px;
4092
4126
  }
4093
- .children[hidden][data-v-554c49dd] {
4127
+ .children[hidden][data-v-b57a29c6] {
4094
4128
  display: none;
4095
4129
  }
4096
- html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"][data-v-554c49dd] {
4130
+ html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"][data-v-b57a29c6] {
4097
4131
  --_tree-row-min-height: 44px;
4098
4132
  }
4099
- html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .drag-handle[data-v-554c49dd] {
4133
+ html[data-ui-input-modality="touch"] [data-component~="ui-tree-item"] .drag-handle[data-v-b57a29c6] {
4100
4134
  display: none;
4101
4135
  }
4102
4136
  @media (prefers-reduced-motion: reduce) {
4103
- .row[data-v-554c49dd],
4104
- .disclosure-icon[data-v-554c49dd],
4105
- .drag-handle[data-v-554c49dd] {
4137
+ .row[data-v-b57a29c6],
4138
+ .disclosure-icon[data-v-b57a29c6],
4139
+ .drag-handle[data-v-b57a29c6] {
4106
4140
  transition: none;
4107
4141
  }
4108
4142
  }
4109
4143
 
4110
4144
  /* A component that sets its display still honours the hidden attribute on its root. */
4111
- [data-component~="ui-tree-item"][hidden][data-v-554c49dd] {
4145
+ [data-component~="ui-tree-item"][hidden][data-v-b57a29c6] {
4112
4146
  display: none;
4113
4147
  }
4114
4148
  /**