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