@nexus-cross/design-system 1.0.6-beta.2 → 1.0.7

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 (403) hide show
  1. package/DESIGN.md +185 -0
  2. package/cursor-rules/nexus-ui-api.mdc +223 -7
  3. package/cursor-rules/nexus-ui-components.mdc +44 -17
  4. package/dist/alert.js +16 -0
  5. package/dist/alert.mjs +3 -0
  6. package/dist/badge.js +16 -0
  7. package/dist/badge.mjs +3 -0
  8. package/dist/breadcrumb.js +12 -0
  9. package/dist/breadcrumb.mjs +3 -0
  10. package/dist/chunks/chunk-22O6YUYH.mjs +5 -0
  11. package/dist/chunks/chunk-2N2EPBO4.js +120 -0
  12. package/dist/chunks/{chunk-AFSEYJZT.js → chunk-2T7RUYEK.js} +175 -50
  13. package/dist/chunks/chunk-2UPGFY6E.mjs +76 -0
  14. package/dist/chunks/{chunk-VGO4Z2WH.js → chunk-3RK3UT2O.js} +50 -12
  15. package/dist/chunks/chunk-3ZWN66YH.js +53 -0
  16. package/dist/chunks/chunk-5PQ3UCKF.js +99 -0
  17. package/dist/chunks/chunk-6BWOKTVQ.mjs +87 -0
  18. package/dist/chunks/chunk-6DBRL6NA.mjs +81 -0
  19. package/dist/chunks/{chunk-HNLI646G.mjs → chunk-AAITRHED.mjs} +51 -13
  20. package/dist/chunks/chunk-B5O6W3Z4.mjs +73 -0
  21. package/dist/chunks/chunk-BJM3NDT2.mjs +368 -0
  22. package/dist/chunks/chunk-C2DSAJTL.js +109 -0
  23. package/dist/chunks/chunk-CUTMLBC3.mjs +86 -0
  24. package/dist/chunks/chunk-CV4GMFWP.js +174 -0
  25. package/dist/chunks/chunk-DICN6GKE.js +99 -0
  26. package/dist/chunks/chunk-DYPPVXQF.js +143 -0
  27. package/dist/chunks/chunk-EJY7IVSK.mjs +31 -0
  28. package/dist/chunks/chunk-FUIBYZZ4.mjs +98 -0
  29. package/dist/chunks/chunk-H2G5FMRN.mjs +75 -0
  30. package/dist/chunks/chunk-H2V7RHYV.mjs +120 -0
  31. package/dist/chunks/chunk-MMCA33FW.mjs +85 -0
  32. package/dist/chunks/chunk-NZHK76R3.js +109 -0
  33. package/dist/chunks/chunk-OE5BAEBE.js +7 -0
  34. package/dist/chunks/chunk-P73MEU7N.mjs +150 -0
  35. package/dist/chunks/chunk-PDJTSQOC.js +59 -0
  36. package/dist/chunks/chunk-S2GMEC43.js +109 -0
  37. package/dist/chunks/chunk-X3CTJ7TD.js +108 -0
  38. package/dist/chunks/chunk-XGIJZ3NZ.js +160 -0
  39. package/dist/chunks/chunk-YO5MSDPX.mjs +36 -0
  40. package/dist/chunks/chunk-ZI4LN2B2.js +96 -0
  41. package/dist/chunks/chunk-ZU4AWAFT.mjs +137 -0
  42. package/dist/component-tokens/button.d.ts +3 -0
  43. package/dist/component-tokens/button.d.ts.map +1 -0
  44. package/dist/component-tokens/index.d.ts +3 -0
  45. package/dist/component-tokens/index.d.ts.map +1 -0
  46. package/dist/component-tokens/types.d.ts +19 -0
  47. package/dist/component-tokens/types.d.ts.map +1 -0
  48. package/dist/{accordion.d.mts → components/Accordion.d.ts} +2 -3
  49. package/dist/components/Accordion.d.ts.map +1 -0
  50. package/dist/components/Alert.d.ts +16 -0
  51. package/dist/components/Alert.d.ts.map +1 -0
  52. package/dist/{avatar.d.mts → components/Avatar.d.ts} +5 -6
  53. package/dist/components/Avatar.d.ts.map +1 -0
  54. package/dist/components/Badge.d.ts +17 -0
  55. package/dist/components/Badge.d.ts.map +1 -0
  56. package/dist/components/Breadcrumb.d.ts +15 -0
  57. package/dist/components/Breadcrumb.d.ts.map +1 -0
  58. package/dist/{button.d.mts → components/Button.d.ts} +5 -6
  59. package/dist/components/Button.d.ts.map +1 -0
  60. package/dist/{carousel.d.mts → components/Carousel.d.ts} +5 -6
  61. package/dist/components/Carousel.d.ts.map +1 -0
  62. package/dist/{checkbox.d.mts → components/CheckBox.d.ts} +6 -7
  63. package/dist/components/CheckBox.d.ts.map +1 -0
  64. package/dist/{chip.d.mts → components/Chip.d.ts} +6 -7
  65. package/dist/components/Chip.d.ts.map +1 -0
  66. package/dist/{client-only.d.mts → components/ClientOnly.d.ts} +4 -5
  67. package/dist/components/ClientOnly.d.ts.map +1 -0
  68. package/dist/{countdown.d.mts → components/Countdown.d.ts} +3 -3
  69. package/dist/components/Countdown.d.ts.map +1 -0
  70. package/dist/{counter.d.mts → components/Counter.d.ts} +3 -3
  71. package/dist/components/Counter.d.ts.map +1 -0
  72. package/dist/{data-list.d.mts → components/DataList.d.ts} +4 -5
  73. package/dist/components/DataList.d.ts.map +1 -0
  74. package/dist/components/DatePicker.d.ts +17 -0
  75. package/dist/components/DatePicker.d.ts.map +1 -0
  76. package/dist/{divider.d.mts → components/Divider.d.ts} +5 -6
  77. package/dist/components/Divider.d.ts.map +1 -0
  78. package/dist/{drawer.d.mts → components/Drawer.d.ts} +13 -15
  79. package/dist/components/Drawer.d.ts.map +1 -0
  80. package/dist/components/DropdownMenu.d.ts +30 -0
  81. package/dist/components/DropdownMenu.d.ts.map +1 -0
  82. package/dist/{ellipsis.d.mts → components/Ellipsis.d.ts} +4 -5
  83. package/dist/components/Ellipsis.d.ts.map +1 -0
  84. package/dist/components/EmptyState.d.ts +15 -0
  85. package/dist/components/EmptyState.d.ts.map +1 -0
  86. package/dist/{error-boundary.d.mts → components/ErrorBoundary.d.ts} +4 -5
  87. package/dist/components/ErrorBoundary.d.ts.map +1 -0
  88. package/dist/{infinite-scroll.d.mts → components/InfiniteScroll.d.ts} +5 -6
  89. package/dist/components/InfiniteScroll.d.ts.map +1 -0
  90. package/dist/{marquee.d.mts → components/Marquee.d.ts} +3 -3
  91. package/dist/components/Marquee.d.ts.map +1 -0
  92. package/dist/{number-input.d.mts → components/NumberInput.d.ts} +10 -12
  93. package/dist/components/NumberInput.d.ts.map +1 -0
  94. package/dist/components/NxImage.d.ts +13 -0
  95. package/dist/components/NxImage.d.ts.map +1 -0
  96. package/dist/{pagination.d.mts → components/Pagination.d.ts} +6 -7
  97. package/dist/components/Pagination.d.ts.map +1 -0
  98. package/dist/components/Popover.d.ts +23 -0
  99. package/dist/components/Popover.d.ts.map +1 -0
  100. package/dist/{price-input.d.mts → components/PriceInput.d.ts} +5 -6
  101. package/dist/components/PriceInput.d.ts.map +1 -0
  102. package/dist/components/Progress.d.ts +17 -0
  103. package/dist/components/Progress.d.ts.map +1 -0
  104. package/dist/{radio-group.d.mts → components/RadioGroup.d.ts} +6 -7
  105. package/dist/components/RadioGroup.d.ts.map +1 -0
  106. package/dist/{select.d.mts → components/Select.d.ts} +7 -10
  107. package/dist/components/Select.d.ts.map +1 -0
  108. package/dist/{skeleton.d.mts → components/Skeleton.d.ts} +3 -3
  109. package/dist/components/Skeleton.d.ts.map +1 -0
  110. package/dist/components/Slider.d.ts +19 -0
  111. package/dist/components/Slider.d.ts.map +1 -0
  112. package/dist/{spinner.d.mts → components/Spinner.d.ts} +3 -3
  113. package/dist/components/Spinner.d.ts.map +1 -0
  114. package/dist/components/Stepper.d.ts +19 -0
  115. package/dist/components/Stepper.d.ts.map +1 -0
  116. package/dist/{switch.d.mts → components/Switch.d.ts} +5 -6
  117. package/dist/components/Switch.d.ts.map +1 -0
  118. package/dist/{tab.d.mts → components/Tab.d.ts} +7 -9
  119. package/dist/components/Tab.d.ts.map +1 -0
  120. package/dist/components/TagInput.d.ts +20 -0
  121. package/dist/components/TagInput.d.ts.map +1 -0
  122. package/dist/components/TextArea.d.ts +18 -0
  123. package/dist/components/TextArea.d.ts.map +1 -0
  124. package/dist/{text-input.d.mts → components/TextInput.d.ts} +5 -6
  125. package/dist/components/TextInput.d.ts.map +1 -0
  126. package/dist/{theme-provider.d.mts → components/ThemeProvider.d.ts} +3 -3
  127. package/dist/components/ThemeProvider.d.ts.map +1 -0
  128. package/dist/components/ToggleGroup.d.ts +35 -0
  129. package/dist/components/ToggleGroup.d.ts.map +1 -0
  130. package/dist/{tooltip.d.mts → components/Tooltip.d.ts} +6 -10
  131. package/dist/components/Tooltip.d.ts.map +1 -0
  132. package/dist/{virtual-scroll.d.mts → components/VirtualScroll.d.ts} +4 -4
  133. package/dist/components/VirtualScroll.d.ts.map +1 -0
  134. package/dist/date-picker.js +12 -0
  135. package/dist/date-picker.mjs +3 -0
  136. package/dist/dropdown-menu.js +32 -0
  137. package/dist/dropdown-menu.mjs +3 -0
  138. package/dist/empty-state.js +16 -0
  139. package/dist/empty-state.mjs +3 -0
  140. package/dist/hooks/useCheckDevice.d.ts +4 -4
  141. package/dist/hooks/useCheckDevice.d.ts.map +1 -0
  142. package/dist/hooks/useClickOutside.d.ts +2 -2
  143. package/dist/hooks/useClickOutside.d.ts.map +1 -0
  144. package/dist/hooks/useDraggableBottomSheet.d.ts +3 -3
  145. package/dist/hooks/useDraggableBottomSheet.d.ts.map +1 -0
  146. package/dist/hooks/useDraggableWindow.d.ts +5 -7
  147. package/dist/hooks/useDraggableWindow.d.ts.map +1 -0
  148. package/dist/hooks/useInView.d.ts +3 -3
  149. package/dist/hooks/useInView.d.ts.map +1 -0
  150. package/dist/hooks/useModal.d.ts +48 -2
  151. package/dist/hooks/useModal.d.ts.map +1 -0
  152. package/dist/index.d.ts +100 -77
  153. package/dist/index.d.ts.map +1 -0
  154. package/dist/index.js +269 -157
  155. package/dist/index.mjs +30 -18
  156. package/dist/modal/Modal.d.ts +52 -0
  157. package/dist/modal/Modal.d.ts.map +1 -0
  158. package/dist/modal/components/ModalComponent.d.ts +22 -0
  159. package/dist/modal/components/ModalComponent.d.ts.map +1 -0
  160. package/dist/modal/components/ModalContainer.d.ts +9 -0
  161. package/dist/modal/components/ModalContainer.d.ts.map +1 -0
  162. package/dist/modal/components/ModalPortal.d.ts +8 -0
  163. package/dist/modal/components/ModalPortal.d.ts.map +1 -0
  164. package/dist/modal/components/ModalPortalTarget.d.ts +7 -0
  165. package/dist/modal/components/ModalPortalTarget.d.ts.map +1 -0
  166. package/dist/modal/components/ModalTemplate.d.ts +20 -0
  167. package/dist/modal/components/ModalTemplate.d.ts.map +1 -0
  168. package/dist/modal/components/ModalTemplate.variants.d.ts +29 -0
  169. package/dist/modal/components/ModalTemplate.variants.d.ts.map +1 -0
  170. package/dist/modal/constants.d.ts +3 -0
  171. package/dist/modal/constants.d.ts.map +1 -0
  172. package/dist/modal/index.d.ts +11 -82
  173. package/dist/modal/index.d.ts.map +1 -0
  174. package/dist/modal/index.js +12 -12
  175. package/dist/modal/index.mjs +3 -3
  176. package/dist/modal/types.d.ts +90 -0
  177. package/dist/modal/types.d.ts.map +1 -0
  178. package/dist/number-input.js +4 -4
  179. package/dist/number-input.mjs +1 -1
  180. package/dist/nx-image.js +12 -0
  181. package/dist/nx-image.mjs +3 -0
  182. package/dist/progress.js +16 -0
  183. package/dist/progress.mjs +3 -0
  184. package/dist/schemas/_all.json +840 -13
  185. package/dist/schemas/accordion.d.ts +67 -0
  186. package/dist/schemas/accordion.d.ts.map +1 -0
  187. package/dist/schemas/alert.d.ts +30 -0
  188. package/dist/schemas/alert.d.ts.map +1 -0
  189. package/dist/schemas/alert.json +49 -0
  190. package/dist/schemas/avatar.d.ts +30 -0
  191. package/dist/schemas/avatar.d.ts.map +1 -0
  192. package/dist/schemas/badge.d.ts +33 -0
  193. package/dist/schemas/badge.d.ts.map +1 -0
  194. package/dist/schemas/badge.json +76 -0
  195. package/dist/schemas/breadcrumb.d.ts +38 -0
  196. package/dist/schemas/breadcrumb.d.ts.map +1 -0
  197. package/dist/schemas/breadcrumb.json +47 -0
  198. package/dist/schemas/button.d.ts +42 -0
  199. package/dist/schemas/button.d.ts.map +1 -0
  200. package/dist/schemas/carousel.d.ts +48 -0
  201. package/dist/schemas/carousel.d.ts.map +1 -0
  202. package/dist/schemas/checkbox.d.ts +48 -0
  203. package/dist/schemas/checkbox.d.ts.map +1 -0
  204. package/dist/schemas/chip.d.ts +30 -0
  205. package/dist/schemas/chip.d.ts.map +1 -0
  206. package/dist/schemas/client-only.d.ts +12 -0
  207. package/dist/schemas/client-only.d.ts.map +1 -0
  208. package/dist/schemas/countdown.d.ts +52 -0
  209. package/dist/schemas/countdown.d.ts.map +1 -0
  210. package/dist/schemas/counter.d.ts +36 -0
  211. package/dist/schemas/counter.d.ts.map +1 -0
  212. package/dist/schemas/data-list.d.ts +33 -0
  213. package/dist/schemas/data-list.d.ts.map +1 -0
  214. package/dist/schemas/date-picker.d.ts +36 -0
  215. package/dist/schemas/date-picker.d.ts.map +1 -0
  216. package/dist/schemas/datePicker.json +56 -0
  217. package/dist/schemas/divider.d.ts +21 -0
  218. package/dist/schemas/divider.d.ts.map +1 -0
  219. package/dist/schemas/drawer.d.ts +95 -0
  220. package/dist/schemas/drawer.d.ts.map +1 -0
  221. package/dist/schemas/dropdown-menu.d.ts +64 -0
  222. package/dist/schemas/dropdown-menu.d.ts.map +1 -0
  223. package/dist/schemas/dropdownMenu.json +83 -0
  224. package/dist/schemas/ellipsis.d.ts +30 -0
  225. package/dist/schemas/ellipsis.d.ts.map +1 -0
  226. package/dist/schemas/empty-state.d.ts +27 -0
  227. package/dist/schemas/empty-state.d.ts.map +1 -0
  228. package/dist/schemas/emptyState.json +44 -0
  229. package/dist/schemas/error-boundary.d.ts +15 -0
  230. package/dist/schemas/error-boundary.d.ts.map +1 -0
  231. package/dist/schemas/index.d.ts +47 -0
  232. package/dist/schemas/index.d.ts.map +1 -0
  233. package/dist/schemas/infinite-scroll.d.ts +39 -0
  234. package/dist/schemas/infinite-scroll.d.ts.map +1 -0
  235. package/dist/schemas/marquee.d.ts +27 -0
  236. package/dist/schemas/marquee.d.ts.map +1 -0
  237. package/dist/schemas/modal.d.ts +176 -0
  238. package/dist/schemas/modal.d.ts.map +1 -0
  239. package/dist/schemas/number-input.d.ts +72 -0
  240. package/dist/schemas/number-input.d.ts.map +1 -0
  241. package/dist/schemas/numberInput.json +27 -8
  242. package/dist/schemas/nx-image.d.ts +33 -0
  243. package/dist/schemas/nx-image.d.ts.map +1 -0
  244. package/dist/schemas/nxImage.json +56 -0
  245. package/dist/schemas/pagination.d.ts +27 -0
  246. package/dist/schemas/pagination.d.ts.map +1 -0
  247. package/dist/schemas/popover.d.ts +39 -0
  248. package/dist/schemas/popover.d.ts.map +1 -0
  249. package/dist/schemas/price-input.d.ts +63 -0
  250. package/dist/schemas/price-input.d.ts.map +1 -0
  251. package/dist/schemas/progress.d.ts +30 -0
  252. package/dist/schemas/progress.d.ts.map +1 -0
  253. package/dist/schemas/progress.json +63 -0
  254. package/dist/schemas/radio-group.d.ts +61 -0
  255. package/dist/schemas/radio-group.d.ts.map +1 -0
  256. package/dist/schemas/select.d.ts +52 -0
  257. package/dist/schemas/select.d.ts.map +1 -0
  258. package/dist/schemas/skeleton.d.ts +27 -0
  259. package/dist/schemas/skeleton.d.ts.map +1 -0
  260. package/dist/schemas/slider.d.ts +45 -0
  261. package/dist/schemas/slider.d.ts.map +1 -0
  262. package/dist/schemas/slider.json +78 -0
  263. package/dist/schemas/spinner.d.ts +21 -0
  264. package/dist/schemas/spinner.d.ts.map +1 -0
  265. package/dist/schemas/stepper.d.ts +39 -0
  266. package/dist/schemas/stepper.d.ts.map +1 -0
  267. package/dist/schemas/stepper.json +73 -0
  268. package/dist/schemas/switch.d.ts +33 -0
  269. package/dist/schemas/switch.d.ts.map +1 -0
  270. package/dist/schemas/tab.d.ts +61 -0
  271. package/dist/schemas/tab.d.ts.map +1 -0
  272. package/dist/schemas/table.d.ts +113 -0
  273. package/dist/schemas/table.d.ts.map +1 -0
  274. package/dist/schemas/tag-input.d.ts +39 -0
  275. package/dist/schemas/tag-input.d.ts.map +1 -0
  276. package/dist/schemas/tagInput.json +70 -0
  277. package/dist/schemas/text-area.d.ts +69 -0
  278. package/dist/schemas/text-area.d.ts.map +1 -0
  279. package/dist/schemas/text-input.d.ts +78 -0
  280. package/dist/schemas/text-input.d.ts.map +1 -0
  281. package/dist/schemas/textArea.json +26 -1
  282. package/dist/schemas/theme-provider.d.ts +36 -0
  283. package/dist/schemas/theme-provider.d.ts.map +1 -0
  284. package/dist/schemas/toast.d.ts +91 -0
  285. package/dist/schemas/toast.d.ts.map +1 -0
  286. package/dist/schemas/toggle-group.d.ts +58 -0
  287. package/dist/schemas/toggle-group.d.ts.map +1 -0
  288. package/dist/schemas/toggleGroup.json +88 -0
  289. package/dist/schemas/tooltip.d.ts +33 -0
  290. package/dist/schemas/tooltip.d.ts.map +1 -0
  291. package/dist/schemas/virtual-scroll.d.ts +67 -0
  292. package/dist/schemas/virtual-scroll.d.ts.map +1 -0
  293. package/dist/schemas.js +177 -7
  294. package/dist/schemas.mjs +166 -8
  295. package/dist/slider.js +16 -0
  296. package/dist/slider.mjs +3 -0
  297. package/dist/stepper.js +16 -0
  298. package/dist/stepper.mjs +3 -0
  299. package/dist/styles/.generated/built.d.ts +3 -0
  300. package/dist/styles/.generated/built.d.ts.map +1 -0
  301. package/dist/styles/inject-layer.d.ts +2 -0
  302. package/dist/styles/inject-layer.d.ts.map +1 -0
  303. package/dist/styles/inject.d.ts +2 -0
  304. package/dist/styles/inject.d.ts.map +1 -0
  305. package/dist/styles/layer.js +2 -2
  306. package/dist/styles/layer.mjs +1 -1
  307. package/dist/styles.css +1655 -162
  308. package/dist/styles.js +2 -2
  309. package/dist/styles.layered.css +1655 -162
  310. package/dist/styles.mjs +1 -1
  311. package/dist/table/Table.d.ts +20 -0
  312. package/dist/table/Table.d.ts.map +1 -0
  313. package/dist/table/TableHighlightContext.d.ts +11 -0
  314. package/dist/table/TableHighlightContext.d.ts.map +1 -0
  315. package/dist/table/TableRow.d.ts +17 -0
  316. package/dist/table/TableRow.d.ts.map +1 -0
  317. package/dist/table/TdColumn.d.ts +14 -0
  318. package/dist/table/TdColumn.d.ts.map +1 -0
  319. package/dist/table/index.d.ts +23 -0
  320. package/dist/table/index.d.ts.map +1 -0
  321. package/dist/table/types.d.ts +27 -0
  322. package/dist/table/types.d.ts.map +1 -0
  323. package/dist/table.js +7 -7
  324. package/dist/table.mjs +1 -1
  325. package/dist/tag-input.js +16 -0
  326. package/dist/tag-input.mjs +3 -0
  327. package/dist/text-area.js +3 -3
  328. package/dist/text-area.mjs +1 -1
  329. package/dist/toast/Toast.d.ts +8 -0
  330. package/dist/toast/Toast.d.ts.map +1 -0
  331. package/dist/toast/index.d.ts +6 -0
  332. package/dist/toast/index.d.ts.map +1 -0
  333. package/dist/{toast.d.ts → toast/useToast.d.ts} +4 -14
  334. package/dist/toast/useToast.d.ts.map +1 -0
  335. package/dist/toggle-group.js +16 -0
  336. package/dist/toggle-group.mjs +3 -0
  337. package/dist/utils/cn.d.ts +3 -5
  338. package/dist/utils/cn.d.ts.map +1 -0
  339. package/dist/utils/scroll.d.ts +3 -4
  340. package/dist/utils/scroll.d.ts.map +1 -0
  341. package/package.json +104 -38
  342. package/scripts/setup-cursor-rules.cjs +15 -1
  343. package/dist/accordion.d.ts +0 -28
  344. package/dist/avatar.d.ts +0 -17
  345. package/dist/button.d.ts +0 -17
  346. package/dist/carousel.d.ts +0 -36
  347. package/dist/checkbox.d.ts +0 -21
  348. package/dist/chip.d.ts +0 -16
  349. package/dist/chunks/chunk-26BUGBOY.mjs +0 -57
  350. package/dist/chunks/chunk-CLGH2RTS.js +0 -7
  351. package/dist/chunks/chunk-ECVAVQUY.mjs +0 -243
  352. package/dist/chunks/chunk-UPCWJWXR.mjs +0 -5
  353. package/dist/chunks/chunk-WR55D4ZS.js +0 -80
  354. package/dist/client-only.d.ts +0 -13
  355. package/dist/countdown.d.ts +0 -27
  356. package/dist/counter.d.ts +0 -15
  357. package/dist/data-list.d.ts +0 -33
  358. package/dist/divider.d.ts +0 -14
  359. package/dist/drawer.d.ts +0 -42
  360. package/dist/ellipsis.d.ts +0 -16
  361. package/dist/error-boundary.d.ts +0 -20
  362. package/dist/hooks/useCheckDevice.d.mts +0 -47
  363. package/dist/hooks/useClickOutside.d.mts +0 -12
  364. package/dist/hooks/useDraggableBottomSheet.d.mts +0 -24
  365. package/dist/hooks/useDraggableWindow.d.mts +0 -21
  366. package/dist/hooks/useInView.d.mts +0 -14
  367. package/dist/hooks/useModal.d.mts +0 -2
  368. package/dist/index.d.mts +0 -77
  369. package/dist/infinite-scroll.d.ts +0 -26
  370. package/dist/marquee.d.ts +0 -12
  371. package/dist/modal/index.d.mts +0 -87
  372. package/dist/number-input.d.ts +0 -38
  373. package/dist/pagination.d.ts +0 -22
  374. package/dist/popover.d.mts +0 -25
  375. package/dist/popover.d.ts +0 -25
  376. package/dist/price-input.d.ts +0 -36
  377. package/dist/radio-group.d.ts +0 -29
  378. package/dist/schemas.d.mts +0 -1689
  379. package/dist/schemas.d.ts +0 -1689
  380. package/dist/select.d.ts +0 -31
  381. package/dist/skeleton.d.ts +0 -15
  382. package/dist/spinner.d.ts +0 -9
  383. package/dist/styles/layer.d.mts +0 -3
  384. package/dist/styles/layer.d.ts +0 -3
  385. package/dist/styles.d.mts +0 -3
  386. package/dist/styles.d.ts +0 -3
  387. package/dist/switch.d.ts +0 -15
  388. package/dist/tab.d.ts +0 -36
  389. package/dist/table.d.mts +0 -80
  390. package/dist/table.d.ts +0 -80
  391. package/dist/text-area.d.mts +0 -15
  392. package/dist/text-area.d.ts +0 -15
  393. package/dist/text-input.d.ts +0 -21
  394. package/dist/theme-provider.d.ts +0 -25
  395. package/dist/toast.d.mts +0 -42
  396. package/dist/tooltip.d.ts +0 -24
  397. package/dist/useModal-BsGIcP8t.d.mts +0 -128
  398. package/dist/useModal-BsGIcP8t.d.ts +0 -128
  399. package/dist/utils/cn.d.mts +0 -5
  400. package/dist/utils/scroll.d.mts +0 -4
  401. package/dist/virtual-scroll.d.ts +0 -34
  402. package/dist/chunks/{chunk-3VFBPFZF.mjs → chunk-CWMLTXOH.mjs} +2 -2
  403. package/dist/chunks/{chunk-U53UA76K.js → chunk-HFBTS42N.js} +2 -2
package/dist/chunks/chunk-CLGH2RTS.js DELETED
@@ -1,7 +0,0 @@
1
- 'use strict';
2
-
3
- // src/styles/.generated/built.ts
4
- var css = "/*\n * @nexus-cross/design-system \u2014 Pure CSS\n *\n * BEM \uD074\uB798\uC2A4 \uB124\uC774\uBC0D(.nexus-*)\uC73C\uB85C CSS specificity \uAE30\uBC18 \uB3D9\uC791.\n * \uC18C\uBE44\uC790 CSS\uB294 \uB514\uC790\uC778 \uC2DC\uC2A4\uD15C \uC774\uD6C4\uC5D0 \uB85C\uB4DC\uB418\uBBC0\uB85C className\uC73C\uB85C \uC624\uBC84\uB77C\uC774\uB4DC \uAC00\uB2A5.\n */\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Component Tokens (:root)\n \uC18C\uBE44\uC790\uAC00 :root\uC5D0\uC11C \uC624\uBC84\uB77C\uC774\uB4DC \uAC00\uB2A5\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n:root {\n /* \u2500\u2500 Button: Color \u2500\u2500 */\n --color-comp-btn-focus-ring: var(--color-accent-primary);\n\n --color-comp-btn-primary-base: var(--color-accent-primary);\n --color-comp-btn-primary-hover: var(--color-accent-primary-hover);\n --color-comp-btn-primary-pressed: var(--color-accent-primary-pressed);\n --color-comp-btn-primary-on: var(--color-accent-on-primary);\n --color-comp-btn-primary-text: var(\n --color-accent-primary-intense,\n var(--color-accent-primary)\n );\n --color-comp-btn-primary-subtle-fill: var(--color-accent-primary-disabled);\n --color-comp-btn-primary-subtle-bg: var(--color-accent-primary-bg);\n\n --color-comp-btn-secondary-base: var(--color-accent-secondary);\n --color-comp-btn-secondary-hover: var(--color-accent-secondary-hover);\n --color-comp-btn-secondary-pressed: var(--color-accent-secondary-pressed);\n --color-comp-btn-secondary-on: var(--color-accent-on-secondary);\n --color-comp-btn-secondary-text: var(\n --color-accent-secondary-intense,\n var(--color-accent-secondary)\n );\n --color-comp-btn-secondary-subtle-fill: var(\n --color-accent-secondary-disabled\n );\n --color-comp-btn-secondary-subtle-bg: var(--color-accent-secondary-bg);\n\n --color-comp-btn-normal-base: var(--color-surface-subtle);\n --color-comp-btn-normal-hover: var(--color-surface-subtle-hover);\n --color-comp-btn-normal-pressed: var(--color-surface-subtle-hover);\n --color-comp-btn-normal-on: var(--color-text-primary);\n --color-comp-btn-normal-text: var(--color-text-primary);\n --color-comp-btn-normal-subtle-fill: var(--color-surface-subtle);\n --color-comp-btn-normal-subtle-bg: var(--color-surface-subtle-hover);\n --color-comp-btn-normal-border: var(--color-border-default);\n --color-comp-btn-normal-border-hover: var(\n --color-border-default-hover,\n var(--color-border-default)\n );\n\n --color-comp-btn-danger-base: var(--color-status-danger);\n --color-comp-btn-danger-hover: var(--color-status-danger-hover);\n --color-comp-btn-danger-pressed: var(--color-status-danger-pressed);\n --color-comp-btn-danger-on: var(--color-static-white);\n --color-comp-btn-danger-text: var(\n --color-status-danger-intense,\n var(--color-status-danger)\n );\n --color-comp-btn-danger-subtle-fill: var(--color-status-danger-disabled);\n --color-comp-btn-danger-subtle-bg: var(--color-status-danger-bg);\n\n /* \u2500\u2500 Button: Radius \u2500\u2500 */\n --radius-comp-btn-xl: 0.75rem;\n --radius-comp-btn-lg: 0.5rem;\n --radius-comp-btn-md: 0.5rem;\n --radius-comp-btn-sm: 0.25rem;\n\n /* \u2500\u2500 Button: Spacing \u2500\u2500 */\n --spacing-comp-btn-gap: var(--spacing-gap-sm, 0.5rem);\n --spacing-comp-btn-xl-h: 3rem;\n --spacing-comp-btn-xl-px: var(--spacing-padding-lg, 1.5rem);\n --spacing-comp-btn-lg-h: 2.5rem;\n --spacing-comp-btn-lg-px: var(--spacing-padding-lg, 1.5rem);\n --spacing-comp-btn-md-h: 1.875rem;\n --spacing-comp-btn-md-px: var(--spacing-padding-sm, 0.75rem);\n --spacing-comp-btn-sm-px: var(--spacing-padding-xs, 0.5rem);\n --spacing-comp-btn-sm-py: var(--spacing-padding-2xs, 0.25rem);\n\n /* \u2500\u2500 Button: Font \u2500\u2500 */\n --text-comp-btn-xl: var(--text-text-base, 1rem);\n --text-comp-btn-lg: var(--text-text-base, 1rem);\n --text-comp-btn-md: var(--text-text-sm, 0.875rem);\n --text-comp-btn-sm: var(--text-text-xs, 0.75rem);\n\n /* \u2500\u2500 Button: Misc \u2500\u2500 */\n --shadow-comp-btn: none;\n --opacity-comp-btn-disabled: 0.5;\n\n /* \u2500\u2500 Shared: Shadow \u2500\u2500 */\n --shadow-comp-sm: var(--shadow-elevation-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));\n --shadow-comp-md: var(--shadow-elevation-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));\n --shadow-comp-lg: var(--shadow-elevation-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n\n /* \u2500\u2500 Shared: Overlay \u2500\u2500 */\n --color-comp-overlay: var(--color-overlay-dim, rgba(0, 0, 0, 0.6));\n\n /* \u2500\u2500 ErrorBoundary \u2500\u2500 */\n --color-comp-error-border: var(--color-status-danger);\n --color-comp-error-bg: var(--color-status-danger-bg, #fef2f2);\n --color-comp-error-text: var(--color-status-danger-intense, #991b1b);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n \uCEF4\uD3EC\uB10C\uD2B8 \uC2A4\uD0C0\uC77C\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* \u2500\u2500\u2500 Shared: sr-only \u2500\u2500\u2500 */\n.nexus-sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Button\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-comp-btn-gap);\n white-space: nowrap;\n user-select: none;\n box-shadow: var(--shadow-comp-btn);\n transition-property: color, background-color, border-color;\n transition-duration: 200ms;\n}\n.nexus-btn:disabled,\n.nexus-btn[aria-disabled='true'] {\n pointer-events: none;\n opacity: var(--opacity-comp-btn-disabled);\n}\n.nexus-btn:focus-visible {\n outline: 2px solid\n color-mix(in srgb, var(--color-comp-btn-focus-ring) 50%, transparent);\n outline-offset: 2px;\n}\n\n/* Variant: contained */\n.nexus-btn--contained {\n background: var(--_btn-base);\n color: var(--_btn-on);\n}\n.nexus-btn--contained:hover {\n background: var(--_btn-hover);\n}\n.nexus-btn--contained:active {\n background: var(--_btn-pressed);\n}\n\n/* Variant: outlined */\n.nexus-btn--outlined {\n border: 1px solid var(--_btn-border);\n color: var(--_btn-text);\n background: var(--_btn-outlined-bg);\n}\n.nexus-btn--outlined:hover {\n background: var(--_btn-outlined-hover-bg);\n border-color: var(--_btn-border-hover);\n}\n.nexus-btn--outlined:active {\n background: var(--_btn-outlined-pressed-bg);\n border-color: var(--_btn-border-hover);\n}\n\n/* Variant: subtle */\n.nexus-btn--subtle {\n background: var(--_btn-subtle-fill);\n color: var(--_btn-text);\n}\n.nexus-btn--subtle:hover {\n background: var(--_btn-light-bg);\n}\n.nexus-btn--subtle:active {\n background: var(--_btn-light-bg);\n}\n\n/* Variant: ghost */\n.nexus-btn--ghost {\n background: transparent;\n color: var(--_btn-text);\n}\n.nexus-btn--ghost:hover {\n background: var(--_btn-ghost-hover-bg);\n}\n.nexus-btn--ghost:active {\n background: var(--_btn-ghost-pressed-bg);\n}\n\n/* Sizes */\n.nexus-btn--xl {\n height: var(--spacing-comp-btn-xl-h);\n padding-inline: var(--spacing-comp-btn-xl-px);\n font-size: var(--text-comp-btn-xl);\n font-weight: 600;\n border-radius: var(--radius-comp-btn-xl);\n}\n.nexus-btn--lg {\n height: var(--spacing-comp-btn-lg-h);\n padding-inline: var(--spacing-comp-btn-lg-px);\n font-size: var(--text-comp-btn-lg);\n font-weight: 600;\n border-radius: var(--radius-comp-btn-lg);\n}\n.nexus-btn--md {\n height: var(--spacing-comp-btn-md-h);\n padding-inline: var(--spacing-comp-btn-md-px);\n font-size: var(--text-comp-btn-md);\n font-weight: 500;\n border-radius: var(--radius-comp-btn-md);\n}\n.nexus-btn--sm {\n padding-inline: var(--spacing-comp-btn-sm-px);\n padding-block: var(--spacing-comp-btn-sm-py);\n font-size: var(--text-comp-btn-sm);\n font-weight: 500;\n border-radius: var(--radius-comp-btn-sm);\n}\n\n/* Radius override */\n.nexus-btn--circle {\n border-radius: 9999px !important;\n}\n\n/* Semantic palette \u2014 compound selectors (cascade \uBC29\uC9C0) */\n.nexus-btn--primary {\n --_btn-base: var(--color-comp-btn-primary-base);\n --_btn-hover: var(--color-comp-btn-primary-hover);\n --_btn-pressed: var(--color-comp-btn-primary-pressed);\n --_btn-on: var(--color-comp-btn-primary-on);\n --_btn-text: var(--color-comp-btn-primary-text);\n --_btn-subtle-fill: var(--color-comp-btn-primary-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-primary-subtle-bg);\n --_btn-border: var(--color-accent-primary-focus, var(--color-accent-primary));\n --_btn-border-hover: var(\n --color-accent-primary-focus,\n var(--color-accent-primary)\n );\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-primary-subtle-bg);\n --_btn-outlined-pressed-bg: var(--color-surface-default);\n --_btn-ghost-hover-bg: var(--color-comp-btn-primary-subtle-bg);\n --_btn-ghost-pressed-bg: var(--color-comp-btn-primary-subtle-fill);\n}\n.nexus-btn--secondary {\n --_btn-base: var(--color-comp-btn-secondary-base);\n --_btn-hover: var(--color-comp-btn-secondary-hover);\n --_btn-pressed: var(--color-comp-btn-secondary-pressed);\n --_btn-on: var(--color-comp-btn-secondary-on);\n --_btn-text: var(--color-comp-btn-secondary-text);\n --_btn-subtle-fill: var(--color-comp-btn-secondary-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-secondary-subtle-bg);\n --_btn-border: var(\n --color-accent-secondary-focus,\n var(--color-accent-secondary)\n );\n --_btn-border-hover: var(\n --color-accent-secondary-focus,\n var(--color-accent-secondary)\n );\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-secondary-subtle-bg);\n --_btn-outlined-pressed-bg: var(--color-surface-default);\n --_btn-ghost-hover-bg: var(--color-comp-btn-secondary-subtle-bg);\n --_btn-ghost-pressed-bg: var(--color-comp-btn-secondary-subtle-fill);\n}\n.nexus-btn--normal {\n --_btn-base: var(--color-comp-btn-normal-base);\n --_btn-hover: var(--color-comp-btn-normal-hover);\n --_btn-pressed: var(--color-comp-btn-normal-pressed);\n --_btn-on: var(--color-comp-btn-normal-on);\n --_btn-text: var(--color-comp-btn-normal-text);\n --_btn-subtle-fill: var(--color-comp-btn-normal-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-normal-subtle-bg);\n --_btn-border: var(--color-comp-btn-normal-border);\n --_btn-border-hover: var(--color-comp-btn-normal-border-hover);\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-normal-subtle-bg);\n --_btn-outlined-pressed-bg: var(\n --color-surface-pressed,\n var(--color-surface-strong)\n );\n --_btn-ghost-hover-bg: var(--color-comp-btn-normal-subtle-bg);\n --_btn-ghost-pressed-bg: var(\n --color-surface-pressed,\n var(--color-surface-strong)\n );\n}\n.nexus-btn--danger {\n --_btn-base: var(--color-comp-btn-danger-base);\n --_btn-hover: var(--color-comp-btn-danger-hover);\n --_btn-pressed: var(--color-comp-btn-danger-pressed);\n --_btn-on: var(--color-comp-btn-danger-on);\n --_btn-text: var(--color-comp-btn-danger-text);\n --_btn-subtle-fill: var(--color-comp-btn-danger-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-danger-subtle-bg);\n --_btn-border: var(--color-status-danger-focus, var(--color-status-danger));\n --_btn-border-hover: var(\n --color-status-danger-focus,\n var(--color-status-danger)\n );\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-danger-subtle-bg);\n --_btn-outlined-pressed-bg: var(--color-surface-default);\n --_btn-ghost-hover-bg: var(--color-comp-btn-danger-subtle-bg);\n --_btn-ghost-pressed-bg: var(--color-comp-btn-danger-subtle-fill);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n TextInput\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* \u2500\u2500 Field wrapper \u2500\u2500 */\n.nexus-text-input-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n}\n.nexus-text-input-field__label {\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 600;\n color: var(--color-text-muted);\n line-height: 1;\n}\n.nexus-text-input-field__footer {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.nexus-text-input-field__description {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-muted);\n line-height: 1.5;\n letter-spacing: -0.12px;\n}\n.nexus-text-input-field__description--error {\n color: var(--color-status-danger);\n}\n.nexus-text-input-field__count {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-muted);\n margin-left: auto;\n flex-shrink: 0;\n}\n.nexus-text-input-field__count--error {\n color: var(--color-status-danger);\n}\n\n/* \u2500\u2500 Input box \u2500\u2500 */\n.nexus-text-input {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: var(--radius-corner-md, 0.5rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 500;\n line-height: 1;\n color: var(--color-text-primary);\n transition: border-color 200ms, box-shadow 200ms;\n}\n:where(.nexus-text-input) {\n width: 100%;\n}\n.nexus-text-input:hover:not(.nexus-text-input--disabled):not(:focus-within) {\n border-color: var(--color-border-default-hover);\n box-shadow: 0 0 0 0.5px var(--color-border-default-hover);\n}\n.nexus-text-input--default:focus-within {\n border-color: var(--color-accent-primary);\n box-shadow: 0 0 0 0.5px var(--color-accent-primary);\n}\n.nexus-text-input--error {\n border-color: var(--color-status-danger);\n}\n.nexus-text-input--error:focus-within {\n border-color: var(--color-status-danger);\n box-shadow: 0 0 0 0.5px var(--color-status-danger);\n}\n.nexus-text-input--disabled {\n cursor: not-allowed;\n background: var(--color-surface-strong);\n border-color: var(--color-border-medium);\n color: var(--color-text-muted);\n}\n\n/* \u2500\u2500 Sizes \u2500\u2500 */\n.nexus-text-input--xl {\n padding: calc(var(--spacing-padding-md, 1rem) - 1px) var(--spacing-padding-md, 1rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-text-input--lg {\n padding: calc(var(--spacing-padding-sm, 0.75rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-text-input--md {\n padding: calc(var(--spacing-padding-xs, 0.5rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n\n/* \u2500\u2500 Inner elements \u2500\u2500 */\n.nexus-text-input__inner {\n flex: 1;\n min-width: 0;\n padding: 0;\n background: transparent;\n border: none;\n outline: none;\n color: inherit;\n font: inherit;\n}\n.nexus-text-input__inner:focus-visible {\n outline: none;\n}\n.nexus-text-input__inner::placeholder {\n color: var(--color-text-muted);\n}\n.nexus-text-input__icon {\n display: flex;\n flex-shrink: 0;\n color: var(--color-text-muted);\n}\n.nexus-text-input__clear {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1rem;\n height: 1rem;\n border: none;\n background: transparent;\n color: var(--color-text-muted);\n cursor: pointer;\n padding: 0;\n transition: color 150ms;\n}\n.nexus-text-input__clear:hover {\n color: var(--color-icon-tertiary-hover);\n background: transparent;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n PriceInput\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* \u2500\u2500 Field wrapper \u2500\u2500 */\n.nexus-price-input-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n}\n.nexus-price-input-field__header {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.nexus-price-input-field__label {\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 600;\n color: var(--color-text-tertiary);\n line-height: 1;\n}\n.nexus-price-input-field__balance {\n display: inline-flex;\n align-items: baseline;\n gap: 0.375rem;\n margin-left: auto;\n padding: 0;\n border: none;\n background: transparent;\n font-size: var(--text-text-xs, 0.75rem);\n font-weight: 400;\n color: var(--color-text-tertiary);\n cursor: pointer;\n line-height: 1.5;\n letter-spacing: -0.12px;\n transition: color 150ms;\n}\n.nexus-price-input-field__balance:hover {\n color: var(--color-text-tertiary);\n}\n.nexus-price-input-field__balance:disabled {\n cursor: not-allowed;\n opacity: var(--opacity-disabled-text, 0.5);\n}\n.nexus-price-input-field__balance-value {\n font-weight: 400;\n color: var(--color-text-secondary);\n text-decoration: underline;\n transition: color 150ms;\n}\n.nexus-price-input-field__balance:hover .nexus-price-input-field__balance-value {\n color: var(--color-text-primary);\n}\n.nexus-price-input-field__balance-value--exceeded {\n color: var(--color-status-danger);\n}\n.nexus-price-input-field__balance:hover .nexus-price-input-field__balance-value--exceeded {\n color: var(--color-status-danger);\n}\n.nexus-price-input-field__description {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-tertiary);\n line-height: 1.5;\n letter-spacing: -0.12px;\n}\n.nexus-price-input-field__description--error {\n color: var(--color-status-danger);\n}\n\n/* \u2500\u2500 Input box \u2500\u2500 */\n.nexus-price-input {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: var(--radius-corner-md, 0.5rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 500;\n line-height: 1;\n color: var(--color-text-primary);\n transition: border-color 200ms, box-shadow 200ms;\n}\n:where(.nexus-price-input) {\n width: 100%;\n}\n.nexus-price-input:hover:not(.nexus-price-input--disabled):not(:focus-within) {\n border-color: var(--color-border-default-hover);\n box-shadow: 0 0 0 0.5px var(--color-border-default-hover);\n}\n.nexus-price-input--default:focus-within {\n border-color: var(--color-accent-primary);\n box-shadow: 0 0 0 0.5px var(--color-accent-primary);\n}\n.nexus-price-input--error {\n border-color: var(--color-status-danger);\n}\n.nexus-price-input--error:focus-within {\n border-color: var(--color-status-danger);\n box-shadow: 0 0 0 0.5px var(--color-status-danger);\n}\n.nexus-price-input--disabled {\n cursor: not-allowed;\n background: var(--color-surface-strong);\n border-color: var(--color-border-medium);\n color: var(--color-text-muted);\n}\n\n/* \u2500\u2500 Sizes \u2500\u2500 */\n.nexus-price-input--xl {\n padding: calc(var(--spacing-padding-md, 1rem) - 1px) var(--spacing-padding-md, 1rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-price-input--lg {\n padding: calc(var(--spacing-padding-sm, 0.75rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-price-input--md {\n padding: calc(var(--spacing-padding-xs, 0.5rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n\n/* \u2500\u2500 Inner elements \u2500\u2500 */\n.nexus-price-input__prefix {\n flex-shrink: 0;\n color: var(--color-text-secondary);\n font: inherit;\n user-select: none;\n}\n.nexus-price-input__suffix {\n flex-shrink: 0;\n color: var(--color-text-secondary);\n font: inherit;\n white-space: nowrap;\n user-select: none;\n}\n.nexus-price-input__inner {\n flex: 1;\n min-width: 0;\n padding: 0;\n background: transparent;\n border: none;\n outline: none;\n color: inherit;\n font: inherit;\n}\n.nexus-price-input__inner:focus-visible {\n outline: none;\n}\n.nexus-price-input__inner::placeholder {\n color: var(--color-text-muted);\n}\n.nexus-price-input__inner--right {\n text-align: right;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n TextArea\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-textarea {\n border-radius: var(--radius-corner-md, 0.375rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-primary);\n transition-property: border-color;\n transition-duration: 200ms;\n resize: none;\n}\n:where(.nexus-textarea) {\n width: 100%;\n}\n.nexus-textarea::placeholder {\n color: var(--color-text-tertiary);\n}\n.nexus-textarea:focus-visible {\n outline: none;\n}\n.nexus-textarea:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-textarea--default:focus {\n border-color: var(--color-text-primary);\n}\n.nexus-textarea--error {\n border-color: var(--color-status-danger);\n}\n.nexus-textarea--error:focus {\n border-color: var(--color-status-danger);\n}\n.nexus-textarea-wrap {\n display: flex;\n flex-direction: column;\n}\n.nexus-textarea-count {\n margin-top: 0.25rem;\n text-align: right;\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-tertiary);\n}\n.nexus-textarea-count__current {\n color: var(--color-text-primary);\n font-weight: 500;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n NumberInput\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-number-input {\n display: flex;\n align-items: center;\n border-radius: var(--radius-corner-md, 0.375rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n transition: border-color 200ms, box-shadow 200ms;\n}\n:where(.nexus-number-input) {\n width: 100%;\n}\n.nexus-number-input:hover:not(.nexus-number-input--disabled):not(:focus-within) {\n box-shadow: 0 0 0 0.5px var(--color-border-default);\n}\n.nexus-number-input--default:focus-within {\n border-color: var(--color-accent-primary);\n box-shadow: 0 0 0 0.5px var(--color-accent-primary);\n}\n.nexus-number-input--error {\n border-color: var(--color-status-danger);\n}\n.nexus-number-input--error:focus-within {\n border-color: var(--color-status-danger);\n box-shadow: 0 0 0 0.5px var(--color-status-danger);\n}\n.nexus-number-input--xl {\n height: 3.5rem;\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-number-input--lg {\n height: 3rem;\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-number-input--md {\n height: 2.5rem;\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-number-input--sm {\n height: 2rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-number-input--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.nexus-number-input__field {\n height: 100%;\n width: 100%;\n min-width: 0;\n flex: 1;\n background: transparent;\n outline: none;\n}\n.nexus-number-input__field::placeholder {\n color: var(--color-text-tertiary);\n}\n.nexus-number-input__field:focus-visible {\n outline: none;\n}\n.nexus-number-input__field--xl {\n padding-inline: var(--spacing-padding-lg, 1.25rem);\n}\n.nexus-number-input__field--lg {\n padding-inline: var(--spacing-padding-md, 1rem);\n}\n.nexus-number-input__field--md {\n padding-inline: var(--spacing-padding-sm, 0.75rem);\n}\n.nexus-number-input__field--sm {\n padding-inline: 0.625rem;\n}\n.nexus-number-input__buttons {\n display: flex;\n flex-direction: column;\n border-left: 1px solid var(--color-border-default);\n height: 100%;\n flex-shrink: 0;\n}\n.nexus-number-input__step {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n padding-inline: 0.375rem;\n color: var(--color-text-tertiary);\n transition-property: color, background-color;\n transition-duration: 150ms;\n}\n.nexus-number-input__step:hover {\n color: var(--color-text-primary);\n background: var(--color-surface-hover);\n}\n.nexus-number-input__step:disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n.nexus-number-input__step--up {\n border-top-right-radius: var(--radius-corner-md, 0.375rem);\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-number-input__step--down {\n border-bottom-right-radius: var(--radius-corner-md, 0.375rem);\n}\n.nexus-number-input__step-icon {\n width: 0.75rem;\n height: 0.75rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Divider\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-divider {\n flex-shrink: 0;\n border-color: var(--color-border-default);\n}\n.nexus-divider--horizontal {\n width: 100%;\n border-top-width: 1px;\n}\n.nexus-divider--vertical {\n align-self: stretch;\n border-left-width: 1px;\n}\n.nexus-divider--solid {\n border-style: solid;\n}\n.nexus-divider--dashed {\n border-style: dashed;\n}\n.nexus-divider--dotted {\n border-style: dotted;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Avatar\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-avatar {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n background: var(--color-surface-hover);\n color: var(--color-text-tertiary);\n}\n.nexus-avatar--xs {\n width: 1.5rem;\n height: 1.5rem;\n font-size: 10px;\n}\n.nexus-avatar--sm {\n width: 2rem;\n height: 2rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-avatar--md {\n width: 2.5rem;\n height: 2.5rem;\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-avatar--lg {\n width: 3rem;\n height: 3rem;\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-avatar--xl {\n width: 4rem;\n height: 4rem;\n font-size: var(--text-text-lg, 1.125rem);\n}\n.nexus-avatar--circle {\n border-radius: 9999px;\n}\n.nexus-avatar--square {\n border-radius: var(--radius-corner-md, 0.375rem);\n}\n.nexus-avatar__icon--xs {\n width: 1rem;\n height: 1rem;\n}\n.nexus-avatar__icon--sm {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-avatar__icon--md {\n width: 1.5rem;\n height: 1.5rem;\n}\n.nexus-avatar__icon--lg {\n width: 2rem;\n height: 2rem;\n}\n.nexus-avatar__icon--xl {\n width: 2.5rem;\n height: 2.5rem;\n}\n.nexus-avatar__img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Switch\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-switch {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n cursor: pointer;\n border-radius: 9999px;\n transition-property: background-color;\n transition-duration: 200ms;\n border: 2px solid transparent;\n}\n.nexus-switch:has(input:disabled) {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-switch--sm {\n height: 1.25rem;\n width: 2.25rem;\n}\n.nexus-switch--md {\n height: 1.5rem;\n width: 2.75rem;\n}\n.nexus-switch--checked {\n background: var(--color-accent-primary);\n}\n.nexus-switch--unchecked {\n background: var(--color-border-default);\n}\n.nexus-switch__thumb {\n pointer-events: none;\n display: block;\n border-radius: 9999px;\n background: var(--color-static-white);\n box-shadow: var(--shadow-comp-sm);\n transition-property: transform;\n transition-duration: 200ms;\n}\n.nexus-switch__thumb--sm {\n width: 1rem;\n height: 1rem;\n}\n.nexus-switch__thumb--md {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-switch__thumb--sm-on {\n transform: translateX(1rem);\n}\n.nexus-switch__thumb--md-on {\n transform: translateX(1.25rem);\n}\n.nexus-switch__thumb--off {\n transform: translateX(0);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n CheckBox\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-checkbox {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-sm, 0.5rem);\n user-select: none;\n}\n.nexus-checkbox--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-checkbox--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-checkbox--pointer {\n cursor: pointer;\n}\n.nexus-checkbox--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-checkbox__box {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border: 1px solid var(--color-border-default);\n transition-property: border-color, background-color;\n transition-duration: 150ms;\n}\n.nexus-checkbox__box:has(~ .nexus-sr-only:disabled) {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.nexus-checkbox__box--sm {\n width: 1rem;\n height: 1rem;\n}\n.nexus-checkbox__box--md {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-checkbox__box--square {\n border-radius: var(--radius-corner-sm, 0.25rem);\n}\n.nexus-checkbox__box--round {\n border-radius: 9999px;\n}\n.nexus-checkbox__box--checked {\n border-color: var(--color-accent-primary);\n background: var(--color-accent-primary);\n color: var(--color-static-white);\n}\n.nexus-checkbox__box--unchecked {\n border-color: var(--color-border-default);\n background: var(--color-surface-default);\n}\n.nexus-checkbox__icon--sm {\n width: 0.75rem;\n height: 0.75rem;\n}\n.nexus-checkbox__icon--md {\n width: 0.875rem;\n height: 0.875rem;\n}\n.nexus-checkbox__label {\n color: var(--color-text-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n RadioGroup\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-radio-group {\n display: flex;\n}\n.nexus-radio-group--horizontal {\n flex-direction: row;\n gap: var(--spacing-gap-lg, 1rem);\n}\n.nexus-radio-group--vertical {\n flex-direction: column;\n gap: var(--spacing-gap-sm, 0.5rem);\n}\n.nexus-radio-item {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-sm, 0.5rem);\n user-select: none;\n}\n.nexus-radio-item--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-radio-item--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-radio-item--pointer {\n cursor: pointer;\n}\n.nexus-radio-item--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-radio__circle {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n border: 1px solid var(--color-border-default);\n transition-property: border-color;\n transition-duration: 150ms;\n}\n.nexus-radio__circle:has(~ .nexus-sr-only:disabled) {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.nexus-radio__circle--sm {\n width: 1rem;\n height: 1rem;\n}\n.nexus-radio__circle--md {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-radio__circle--checked {\n border-color: var(--color-accent-primary);\n color: var(--color-accent-primary);\n}\n.nexus-radio__circle--unchecked {\n border-color: var(--color-border-default);\n background: var(--color-surface-default);\n}\n.nexus-radio__dot {\n border-radius: 9999px;\n background: currentColor;\n}\n.nexus-radio__dot--sm {\n width: 0.375rem;\n height: 0.375rem;\n}\n.nexus-radio__dot--md {\n width: 0.5rem;\n height: 0.5rem;\n}\n.nexus-radio__label {\n color: var(--color-text-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Chip\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-chip {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n white-space: nowrap;\n font-weight: 500;\n transition-property: color, background-color, border-color;\n transition-duration: 150ms;\n user-select: none;\n border-radius: 9999px;\n border: 1px solid transparent;\n}\n.nexus-chip[aria-disabled='true'] {\n opacity: 0.5;\n pointer-events: none;\n}\n.nexus-chip--default {\n border-color: var(--color-border-default);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n}\n.nexus-chip--filled {\n border-color: transparent;\n background: var(--color-surface-hover);\n color: var(--color-text-primary);\n}\n.nexus-chip--outline {\n border-color: var(--color-border-default);\n background: transparent;\n color: var(--color-text-primary);\n}\n.nexus-chip--accent {\n border-color: transparent;\n background: color-mix(in srgb, var(--color-accent-primary) 10%, transparent);\n color: var(--color-accent-primary);\n}\n.nexus-chip--sm {\n height: 1.5rem;\n padding-inline: var(--spacing-padding-xs, 0.5rem);\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-chip--md {\n height: 1.75rem;\n padding-inline: 0.625rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-chip--lg {\n height: 2rem;\n padding-inline: var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-chip__close {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n padding: 0.125rem;\n opacity: 0.6;\n transition-property: opacity;\n transition-duration: 150ms;\n}\n.nexus-chip__close:hover {\n opacity: 1;\n}\n.nexus-chip__close-icon {\n width: 0.75rem;\n height: 0.75rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Pagination\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-pagination {\n display: flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n}\n.nexus-pagination--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-pagination--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-page-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-corner-md, 0.375rem);\n font-weight: 500;\n transition-property: color, background-color;\n transition-duration: 150ms;\n user-select: none;\n border: 1px solid transparent;\n}\n.nexus-page-btn:disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n.nexus-page-btn--sm {\n width: 1.75rem;\n height: 1.75rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-page-btn--md {\n width: 2.25rem;\n height: 2.25rem;\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-page-btn--active {\n background: var(--color-accent-primary);\n color: var(--color-static-white);\n border-color: var(--color-accent-primary);\n}\n.nexus-page-btn--inactive {\n color: var(--color-text-primary);\n}\n.nexus-page-btn--inactive:hover {\n background: var(--color-surface-hover);\n}\n.nexus-page-icon--sm {\n width: 0.875rem;\n height: 0.875rem;\n}\n.nexus-page-icon--md {\n width: 1rem;\n height: 1rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Tab\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-tab-list {\n position: relative;\n display: flex;\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-tab-list--pill {\n gap: var(--spacing-gap-xs, 0.25rem);\n border-bottom: none;\n background: var(--color-surface-hover);\n border-radius: var(--radius-corner-lg, 0.5rem);\n padding: 0.25rem;\n}\n.nexus-tab-trigger {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n white-space: nowrap;\n font-weight: 500;\n user-select: none;\n outline: none;\n transition-property: color, background-color, border-color;\n transition-duration: 150ms;\n}\n.nexus-tab-trigger--line {\n padding: 0.625rem var(--spacing-padding-md, 1rem);\n color: var(--color-text-tertiary);\n border-bottom: 2px solid transparent;\n margin-bottom: -1px;\n}\n.nexus-tab-trigger--line:hover {\n color: var(--color-text-primary);\n}\n.nexus-tab-trigger--line-active {\n color: var(--color-text-primary);\n border-bottom-color: var(--color-accent-primary);\n}\n.nexus-tab-trigger--pill {\n padding: 0.375rem var(--spacing-padding-sm, 0.75rem);\n border-radius: var(--radius-corner-md, 0.375rem);\n color: var(--color-text-tertiary);\n}\n.nexus-tab-trigger--pill:hover {\n color: var(--color-text-primary);\n}\n.nexus-tab-trigger--pill-active {\n color: var(--color-text-primary);\n background: var(--color-surface-default);\n box-shadow: var(--shadow-comp-sm);\n}\n.nexus-tab-trigger--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-tab-trigger--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-tab-trigger--disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Skeleton\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-skeleton {\n position: relative;\n overflow: hidden;\n background: linear-gradient(\n to right,\n var(--color-surface-hover),\n var(--color-surface-default),\n var(--color-surface-hover)\n );\n background-size: 300% 100%;\n animation: nexus-skeleton-shimmer 2.5s ease-in-out infinite;\n}\n.nexus-skeleton--rect {\n border-radius: var(--radius-corner-md, 0.375rem);\n}\n.nexus-skeleton--circle {\n border-radius: 9999px;\n}\n.nexus-skeleton__children {\n opacity: 0;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Spinner\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-spinner {\n animation: nexus-spin 1s linear infinite;\n color: currentColor;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n ErrorBoundary\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-error-boundary {\n padding: 1rem;\n border-radius: var(--radius-corner-lg, 0.5rem);\n border: 1px solid var(--color-comp-error-border);\n background: var(--color-comp-error-bg);\n color: var(--color-comp-error-text);\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-error-boundary__title {\n margin: 0;\n font-weight: 600;\n}\n.nexus-error-boundary__message {\n margin: 0.5rem 0 0;\n opacity: 0.8;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Divider & Simple components\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-virtual-scroll {\n overflow: auto;\n}\n.nexus-modal-portal-target {\n position: absolute;\n z-index: 9999;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n DataList\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-datalist-center {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: var(--spacing-padding-xl, 2rem);\n}\n.nexus-datalist-empty {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: var(--spacing-padding-xl, 2rem);\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-tertiary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n InfiniteScroll\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-infinite-scroll {\n position: relative;\n}\n.nexus-infinite-sentinel {\n position: relative;\n height: 1px;\n width: 100%;\n}\n.nexus-infinite-spinner {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: var(--spacing-padding-md, 1rem);\n}\n.nexus-infinite-spinner-icon {\n width: 1.5rem;\n height: 1.5rem;\n animation: nexus-spin 1s linear infinite;\n border-radius: 9999px;\n border: 2px solid var(--color-border-default);\n border-top-color: var(--color-accent-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Countdown\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-countdown {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n font-variant-numeric: tabular-nums;\n}\n.nexus-countdown__separator {\n color: var(--color-text-tertiary);\n margin-inline: 0.125rem;\n}\n.nexus-countdown__label {\n color: var(--color-text-tertiary);\n font-size: var(--text-text-xs, 0.75rem);\n margin-left: 0.125rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Select\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-select-trigger {\n position: relative;\n display: flex;\n height: 2.5rem;\n align-items: center;\n justify-content: space-between;\n border-radius: var(--radius-corner-sm, 0.25rem);\n border: 1px solid var(--color-border-default);\n color: var(--color-text-primary);\n font-size: var(--text-text-sm, 0.875rem);\n transition-property: border-color;\n transition-duration: 200ms;\n}\n.nexus-select-trigger:hover {\n border-color: var(--color-border-strong);\n}\n.nexus-select-trigger:has(:disabled) {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-select-trigger::placeholder {\n color: var(--color-text-tertiary);\n}\n.nexus-select-trigger--default {\n background: var(--color-surface-hover);\n}\n.nexus-select-trigger--outline {\n background: var(--color-surface-default);\n}\n.nexus-select-trigger--sm {\n width: 4rem;\n}\n.nexus-select-trigger--md {\n width: 8rem;\n}\n.nexus-select-trigger--lg {\n width: 12rem;\n}\n.nexus-select-trigger--full {\n width: 100%;\n}\n.nexus-select-trigger--justify-end {\n justify-content: flex-end;\n}\n.nexus-select-trigger__display {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n height: 100%;\n width: calc(100% - 30px);\n align-items: center;\n}\n.nexus-select-trigger__inner {\n display: flex;\n height: 100%;\n width: 100%;\n flex-direction: row-reverse;\n align-items: center;\n justify-content: space-between;\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n}\n.nexus-select-trigger__inner:focus {\n outline: none;\n}\n.nexus-select-chevron {\n width: 0.75rem;\n height: 0.75rem;\n opacity: 0.5;\n transition: transform 200ms;\n}\n.nexus-select-chevron--open {\n transform: rotate(180deg);\n}\n\n.nexus-select-content {\n position: relative;\n z-index: 50;\n max-height: 24rem;\n overflow: hidden;\n border-radius: var(--radius-corner-sm, 0.25rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n box-shadow: var(--shadow-comp-lg);\n transform-origin: top center;\n will-change: transform, opacity;\n}\n.nexus-select-content[data-state='open'] {\n animation: nexus-select-slide-in 150ms ease-out;\n}\n.nexus-select-content[data-state='closed'] {\n animation: nexus-select-slide-out 100ms ease-in forwards;\n}\n@keyframes nexus-select-slide-in {\n from { opacity: 0; transform: translateY(-4px) scaleY(0.96); }\n to { opacity: 1; transform: translateY(0) scaleY(1); }\n}\n@keyframes nexus-select-slide-out {\n from { opacity: 1; transform: translateY(0) scaleY(1); }\n to { opacity: 0; transform: translateY(-4px) scaleY(0.96); }\n}\n.nexus-select-content--sm {\n width: 4rem;\n}\n.nexus-select-content--md {\n width: 8rem;\n}\n.nexus-select-content--lg {\n width: 12rem;\n}\n.nexus-select-content--full {\n width: var(--radix-popper-anchor-width);\n}\n.nexus-select-viewport {\n padding: 0.25rem;\n}\n\n.nexus-select-item {\n position: relative;\n display: flex;\n width: 100%;\n cursor: pointer;\n align-items: center;\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n color: var(--color-text-primary);\n font-size: var(--text-text-sm, 0.875rem);\n transition-property: background-color;\n transition-duration: 150ms;\n outline: none;\n user-select: none;\n}\n.nexus-select-item:hover,\n.nexus-select-item:focus,\n.nexus-select-item[data-highlighted] {\n background: var(--color-surface-hover);\n}\n.nexus-select-item[data-disabled] {\n pointer-events: none;\n opacity: 0.5;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Tooltip\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-tooltip-content {\n z-index: 50;\n display: flex;\n overflow: hidden;\n border-radius: var(--radius-corner-md, 0.375rem);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-tooltip--light {\n border: 1px solid var(--color-border-default);\n background: var(--color-static-white);\n color: var(--color-static-black);\n box-shadow: var(--shadow-comp-md);\n}\n.nexus-tooltip--dark {\n border: none;\n background: var(--color-static-black);\n color: var(--color-static-white);\n}\n.nexus-tooltip-arrow--dark {\n fill: var(--color-static-black);\n}\n.nexus-tooltip-arrow--light {\n fill: var(--color-static-white);\n}\n.nexus-tooltip-trigger {\n cursor: default;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Popover\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-popover-content {\n z-index: 50;\n border-radius: var(--radius-corner-lg, 0.5rem);\n border: 1px solid var(--color-border-default);\n padding: var(--spacing-padding-md, 1rem);\n box-shadow: var(--shadow-comp-lg);\n outline: none;\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n transform-origin: var(--radix-popover-content-transform-origin);\n will-change: transform, opacity;\n}\n.nexus-popover-content[data-state='open'] {\n animation: nexus-popover-in 150ms ease-out;\n}\n.nexus-popover-content[data-state='closed'] {\n animation: nexus-popover-out 100ms ease-in forwards;\n}\n@keyframes nexus-popover-in {\n from { opacity: 0; transform: scale(0.95); }\n to { opacity: 1; transform: scale(1); }\n}\n@keyframes nexus-popover-out {\n from { opacity: 1; transform: scale(1); }\n to { opacity: 0; transform: scale(0.95); }\n}\n.nexus-popover-arrow {\n fill: var(--color-surface-default);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Drawer\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-drawer-overlay {\n position: fixed;\n inset: 0;\n z-index: 50;\n background: var(--color-comp-overlay);\n}\n.nexus-drawer-overlay--blur-sm {\n backdrop-filter: blur(4px);\n}\n.nexus-drawer-overlay--blur-md {\n backdrop-filter: blur(12px);\n}\n.nexus-drawer-content {\n position: fixed;\n z-index: 50;\n display: flex;\n flex-direction: column;\n background: var(--color-surface-default);\n}\n.nexus-drawer-content--bottom {\n inset-inline: 0;\n bottom: 0;\n margin-top: 6rem;\n border-top-left-radius: 1rem;\n border-top-right-radius: 1rem;\n border-top: 1px solid var(--color-border-default);\n}\n.nexus-drawer-content--top {\n inset-inline: 0;\n top: 0;\n margin-bottom: 6rem;\n border-bottom-left-radius: 1rem;\n border-bottom-right-radius: 1rem;\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-drawer-content--left {\n inset-block: 0;\n left: 0;\n margin-right: 6rem;\n width: 85vw;\n max-width: 24rem;\n border-top-right-radius: 1rem;\n border-bottom-right-radius: 1rem;\n border-right: 1px solid var(--color-border-default);\n}\n.nexus-drawer-content--right {\n inset-block: 0;\n right: 0;\n margin-left: 6rem;\n width: 85vw;\n max-width: 24rem;\n border-top-left-radius: 1rem;\n border-bottom-left-radius: 1rem;\n border-left: 1px solid var(--color-border-default);\n}\n.nexus-drawer-handle {\n display: flex;\n justify-content: center;\n}\n.nexus-drawer-handle--bottom {\n padding-top: var(--spacing-padding-md, 1rem);\n}\n.nexus-drawer-handle--top {\n padding-bottom: var(--spacing-padding-md, 1rem);\n}\n.nexus-drawer-handle__bar {\n background: var(--color-border-strong);\n height: 0.375rem;\n width: 3rem;\n border-radius: 9999px;\n}\n.nexus-drawer-title {\n font-size: var(--text-text-lg, 1.125rem);\n font-weight: 600;\n color: var(--color-text-primary);\n}\n.nexus-drawer-description {\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-secondary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Accordion\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-accordion-item {\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-accordion-header {\n display: flex;\n}\n.nexus-accordion-trigger {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: space-between;\n padding-block: var(--spacing-padding-md, 1rem);\n transition: all 150ms;\n}\n.nexus-accordion-trigger[data-state='open'] > .nexus-accordion-chevron {\n transform: rotate(180deg);\n}\n.nexus-accordion-chevron {\n width: 0.75rem;\n height: 0.75rem;\n flex-shrink: 0;\n transition: transform 200ms;\n}\n.nexus-accordion-content {\n overflow: hidden;\n transition: all 200ms;\n}\n.nexus-accordion-content[data-state='open'] {\n animation: nexus-accordion-down 200ms ease-out;\n}\n.nexus-accordion-content[data-state='closed'] {\n animation: nexus-accordion-up 200ms ease-in;\n}\n.nexus-accordion-content__inner {\n padding-top: 0;\n padding-bottom: var(--spacing-padding-md, 1rem);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Ellipsis\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-ellipsis {\n position: relative;\n}\n.nexus-ellipsis__content {\n overflow: hidden;\n transition: height 300ms;\n}\n.nexus-ellipsis__trigger {\n margin-top: 0.25rem;\n display: flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-secondary);\n transition-property: color;\n transition-duration: 150ms;\n}\n.nexus-ellipsis__trigger:hover {\n color: var(--color-text-primary);\n}\n.nexus-ellipsis__trigger--expanded > svg {\n transform: rotate(180deg);\n}\n.nexus-ellipsis__chevron {\n width: 0.875rem;\n height: 0.875rem;\n transition: transform 200ms;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Marquee\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-marquee {\n overflow: hidden;\n}\n.nexus-marquee--pause-on-hover:hover > div {\n animation-play-state: paused !important;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Carousel\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-carousel {\n position: relative;\n}\n.nexus-carousel__viewport {\n overflow: hidden;\n}\n.nexus-carousel__container {\n display: flex;\n}\n.nexus-carousel-slide {\n min-width: 0;\n flex-shrink: 0;\n flex-grow: 0;\n flex-basis: 100%;\n}\n.nexus-carousel-btn {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n z-index: 10;\n width: 2rem;\n height: 2rem;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n background: var(--color-surface-default);\n border: 1px solid var(--color-border-default);\n box-shadow: var(--shadow-comp-sm);\n color: var(--color-text-primary);\n transition-property: background-color;\n transition-duration: 150ms;\n}\n.nexus-carousel-btn:hover {\n background: var(--color-surface-hover);\n}\n.nexus-carousel-btn:disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n.nexus-carousel-btn--prev {\n left: 0.5rem;\n}\n.nexus-carousel-btn--next {\n right: 0.5rem;\n}\n.nexus-carousel-btn__icon {\n width: 1rem;\n height: 1rem;\n}\n.nexus-carousel-dots {\n display: flex;\n justify-content: center;\n gap: 0.375rem;\n margin-top: var(--spacing-padding-sm, 0.75rem);\n}\n.nexus-carousel-dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 9999px;\n transition-property: background-color;\n transition-duration: 150ms;\n}\n.nexus-carousel-dot--active {\n background: var(--color-accent-primary);\n}\n.nexus-carousel-dot--inactive {\n background: var(--color-border-default);\n}\n.nexus-carousel-dot--inactive:hover {\n background: var(--color-text-tertiary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Toast\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-toast {\n display: flex;\n align-items: center;\n gap: var(--spacing-gap-sm, 0.75rem);\n border-radius: var(--radius-corner-lg, 0.5rem);\n border: 1px solid var(--color-border-default);\n padding: var(--spacing-padding-sm, 0.75rem) var(--spacing-padding-md, 1rem);\n box-shadow: var(--shadow-comp-lg);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n}\n.nexus-toast__title {\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 500;\n}\n.nexus-toast__desc {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-secondary);\n}\n.nexus-toast--success {\n border-color: color-mix(\n in srgb,\n var(--color-status-positive) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-status-positive) 10%, transparent);\n color: var(--color-status-positive);\n}\n.nexus-toast--error {\n border-color: color-mix(\n in srgb,\n var(--color-status-danger) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-status-danger) 10%, transparent);\n color: var(--color-status-danger);\n}\n.nexus-toast--warning {\n border-color: color-mix(\n in srgb,\n var(--color-status-caution) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-status-caution) 10%, transparent);\n color: var(--color-status-caution);\n}\n.nexus-toast--info {\n border-color: color-mix(\n in srgb,\n var(--color-accent-primary) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-accent-primary) 10%, transparent);\n color: var(--color-accent-primary);\n}\n.nexus-toast__action-btn {\n background: var(--color-accent-primary);\n color: var(--color-accent-on-primary);\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: 0.375rem var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-xs, 0.75rem);\n font-weight: 500;\n}\n.nexus-toast__cancel-btn {\n background: var(--color-surface-hover);\n color: var(--color-text-secondary);\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: 0.375rem var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-xs, 0.75rem);\n font-weight: 500;\n}\n.nexus-toast__close-btn {\n color: var(--color-text-tertiary);\n}\n.nexus-toast__close-btn:hover {\n color: var(--color-text-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Table\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-table-wrap {\n overflow-x: auto;\n}\n.nexus-table {\n width: 100%;\n}\n.nexus-table-thead {\n display: flex;\n background: var(--color-surface-default);\n}\n.nexus-table-th {\n display: flex;\n}\n.nexus-table-th--sortable {\n cursor: pointer;\n}\n.nexus-table-th__sort-btn {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n background: none;\n border: none;\n padding: 0;\n margin: 0;\n font: inherit;\n color: inherit;\n cursor: pointer;\n text-align: inherit;\n width: 100%;\n}\n.nexus-table-sort-icon {\n width: 1rem;\n height: 1rem;\n}\n.nexus-table-center {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: 3rem;\n}\n.nexus-table-nodata {\n color: var(--color-text-tertiary);\n}\n.nexus-table-loading-icon {\n width: 2rem;\n height: 2rem;\n animation: nexus-spin 1s linear infinite;\n border-radius: 9999px;\n border: 2px solid var(--color-border-default);\n border-top-color: var(--color-accent-primary);\n}\n.nexus-table-skeleton-row {\n display: flex;\n cursor: default;\n}\n.nexus-table-skeleton-td {\n height: 100%;\n width: 100%;\n padding-block: var(--spacing-padding-md, 1rem);\n}\n.nexus-table-skeleton-bar {\n height: 1rem;\n width: 100%;\n}\n\n/* TableRow */\n.nexus-table-row {\n border-bottom: 1px solid var(--color-border-default);\n display: flex;\n min-width: 0;\n}\n.nexus-table-row::-webkit-scrollbar {\n display: none;\n}\n.nexus-table-row--default:hover {\n background: var(--color-surface-hover);\n}\n.nexus-table-row--accent:hover {\n background: color-mix(in srgb, var(--color-accent-primary) 5%, transparent);\n}\n\n/* TdColumn */\n.nexus-td {\n min-width: 0;\n width: 100%;\n}\n.nexus-td__inner {\n border-radius: var(--radius-corner-md, 0.375rem);\n padding: 2px 0.25rem;\n transition-property: background-color;\n transition-duration: 150ms;\n}\n.nexus-td__inner--flex {\n display: flex;\n}\n.nexus-td__inner--highlight {\n background: color-mix(in srgb, var(--color-accent-primary) 10%, transparent);\n outline: 1px dashed var(--color-accent-primary);\n outline-offset: -1px;\n}\n.nexus-td--nowrap {\n white-space: nowrap;\n}\n.nexus-td--truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.nexus-td--wrap {\n white-space: normal;\n overflow-wrap: break-word;\n}\n.nexus-td--break-all {\n white-space: normal;\n word-break: break-all;\n}\n.nexus-td--center {\n text-align: center;\n justify-content: center;\n}\n.nexus-td--left {\n text-align: left;\n justify-content: flex-start;\n}\n.nexus-td--right {\n text-align: right;\n justify-content: flex-end;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Modal\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-modal-wrap {\n pointer-events: none;\n position: fixed;\n inset: 0;\n z-index: 99999;\n display: flex;\n height: 100%;\n align-items: center;\n justify-content: center;\n color: var(--color-text-primary);\n}\n.nexus-modal-wrap--bottom-sheet {\n align-items: flex-end;\n}\n.nexus-modal-wrap--slide-left {\n height: 100%;\n justify-content: flex-start;\n}\n.nexus-modal-wrap--slide-right {\n height: 100%;\n justify-content: flex-end;\n}\n.nexus-modal-wrap--full-page,\n.nexus-modal-wrap--full-page-reverse {\n height: 100%;\n justify-content: flex-start;\n}\n\n.nexus-modal-inner {\n position: relative;\n z-index: 2;\n overflow: hidden;\n pointer-events: auto;\n border-radius: var(--radius-corner-lg, 12px);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n}\n:where(.nexus-modal-inner) {\n width: 100%;\n min-height: 200px;\n}\n.nexus-modal-inner > div {\n display: contents;\n}\n@media (min-width: 640px) {\n :where(.nexus-modal-inner) {\n width: 480px;\n min-height: auto;\n }\n}\n.nexus-modal-inner--bottom-sheet {\n margin: 0;\n width: 100%;\n border-top-left-radius: 1rem;\n border-top-right-radius: 1rem;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n border-top: 1px solid var(--color-border-default);\n padding: 1.5rem 1rem 0;\n}\n.nexus-modal-inner--slide-left,\n.nexus-modal-inner--slide-right {\n height: 100%;\n border-radius: 0;\n}\n.nexus-modal-inner--full-page,\n.nexus-modal-inner--full-page-reverse {\n height: 100%;\n width: 100%;\n border-radius: 0;\n border-color: transparent;\n}\n@media (min-width: 640px) {\n .nexus-modal-inner--full-page,\n .nexus-modal-inner--full-page-reverse {\n width: 100%;\n }\n}\n.nexus-modal-inner--draggable {\n min-width: 320px;\n overflow: visible;\n}\n.nexus-modal-inner--has-footer {\n padding-bottom: 88px;\n}\n.nexus-modal-inner--bottom-sheet.nexus-modal-inner--has-footer {\n padding-bottom: 5rem;\n}\n\n.nexus-modal-header {\n position: relative;\n padding: 1.5rem 1.25rem 0;\n}\n.nexus-modal-header--bottom-sheet {\n padding: 0;\n}\n.nexus-modal-header--draggable {\n cursor: grab;\n user-select: none;\n}\n.nexus-modal-header--draggable:active {\n cursor: grabbing;\n}\n\n.nexus-modal-close-btn {\n position: absolute;\n top: 1.5rem;\n right: 1.25rem;\n z-index: 1;\n margin-left: auto;\n display: flex;\n cursor: pointer;\n align-items: center;\n justify-content: flex-end;\n}\n.nexus-modal-close-btn--bottom-sheet {\n position: relative;\n top: 0;\n right: 0;\n}\n.nexus-modal-close-icon {\n width: 1.25rem;\n height: 1.25rem;\n color: var(--color-text-muted);\n}\n\n.nexus-modal-title {\n margin: 0;\n padding-right: 42px;\n font-size: var(--text-text-lg, 1.125rem);\n font-weight: 600;\n line-height: 26px;\n letter-spacing: -0.002em;\n color: var(--color-text-primary);\n}\n.nexus-modal-title--bottom-sheet {\n padding-top: 0.375rem;\n line-height: 1.75rem;\n letter-spacing: -0.012em;\n}\n.nexus-modal-desc {\n color: var(--color-text-muted);\n font-size: var(--text-text-xs, 0.75rem);\n margin-top: 0.25rem;\n}\n\n.nexus-modal-body {\n position: relative;\n overflow-y: auto;\n padding: 1.5rem 1.25rem 0;\n}\n.nexus-modal-body::-webkit-scrollbar {\n display: none;\n}\n.nexus-modal-body--no-footer {\n padding-bottom: 1.5rem;\n}\n.nexus-modal-body--bottom-sheet {\n margin-top: 1.5rem;\n max-height: calc(100vh - 108px);\n padding: 0 0 1.5rem;\n}\n.nexus-modal-body--slide,\n.nexus-modal-body--full-page {\n height: 100%;\n max-height: 100%;\n overflow-y: auto;\n}\n.nexus-modal-body--full-page {\n padding-bottom: 0;\n}\n\n.nexus-modal-footer {\n position: absolute;\n bottom: 0;\n left: 0;\n z-index: 2;\n display: flex;\n width: 100%;\n padding: 1.5rem 1.25rem 1.25rem;\n}\n.nexus-modal-footer button {\n height: 3rem;\n flex: 1;\n}\n.nexus-modal-footer--bottom-sheet {\n padding: 0.75rem 1rem 1.5rem;\n}\n.nexus-modal-footer--draggable {\n position: relative;\n}\n\n.nexus-modal-dim {\n pointer-events: auto;\n position: fixed;\n inset: 0;\n z-index: 1;\n display: block;\n height: 100vh;\n width: 100vw;\n background: color-mix(\n in srgb,\n var(--color-static-black, #000) 75%,\n transparent\n );\n}\n.nexus-modal-dim--hidden {\n display: none;\n}\n.nexus-modal-dim--draggable {\n background: color-mix(\n in srgb,\n var(--color-static-black, #000) 30%,\n transparent\n );\n}\n\n.nexus-modal-bottom-sheet-handle {\n display: flex;\n width: 100%;\n justify-content: center;\n padding-top: 0.75rem;\n padding-bottom: 0.5rem;\n}\n.nexus-modal-bottom-sheet-bar {\n background: var(--color-border-default);\n height: 0.375rem;\n width: 4rem;\n border-radius: 9999px;\n}\n\n.nexus-modal-component {\n opacity: 0;\n}\n.nexus-modal-component--visible {\n opacity: 1;\n}\n.nexus-modal-component--portal {\n position: relative;\n}\n.nexus-modal-component--enter .nexus-modal-inner {\n animation-direction: var(--modal-animation-direction);\n animation-duration: var(--modal-animation-duration);\n animation-name: var(--modal-animation-name);\n animation-timing-function: var(--modal-animation-timing-function);\n}\n.nexus-modal-component--leave .nexus-modal-inner {\n animation-direction: reverse;\n animation-duration: var(--modal-animation-duration);\n animation-fill-mode: var(--modal-animation-fill-mode);\n animation-name: var(--modal-animation-name);\n animation-timing-function: var(--modal-animation-timing-function);\n}\n\n.nexus-contents {\n display: contents;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Animation utilities (Radix enter/exit)\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-animate-in {\n animation: nexus-enter 200ms ease-out;\n --nx-enter-opacity: 1;\n --nx-enter-scale: 1;\n --nx-enter-translate-x: 0;\n --nx-enter-translate-y: 0;\n}\n.nexus-animate-out {\n animation: nexus-exit 150ms ease-in forwards;\n --nx-exit-opacity: 1;\n --nx-exit-scale: 1;\n --nx-exit-translate-x: 0;\n --nx-exit-translate-y: 0;\n}\n.nexus-fade-in-0 {\n --nx-enter-opacity: 0;\n}\n.nexus-fade-out-0 {\n --nx-exit-opacity: 0;\n}\n.nexus-zoom-in-95 {\n --nx-enter-scale: 0.95;\n}\n.nexus-zoom-out-95 {\n --nx-exit-scale: 0.95;\n}\n.nexus-slide-in-from-top-2 {\n --nx-enter-translate-y: -0.5rem;\n}\n.nexus-slide-in-from-bottom-2 {\n --nx-enter-translate-y: 0.5rem;\n}\n.nexus-slide-in-from-left-2 {\n --nx-enter-translate-x: -0.5rem;\n}\n.nexus-slide-in-from-right-2 {\n --nx-enter-translate-x: 0.5rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Keyframes\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n@keyframes nexus-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n@keyframes nexus-enter {\n from {\n opacity: var(--nx-enter-opacity, 1);\n transform: translate3d(\n var(--nx-enter-translate-x, 0),\n var(--nx-enter-translate-y, 0),\n 0\n )\n scale3d(\n var(--nx-enter-scale, 1),\n var(--nx-enter-scale, 1),\n var(--nx-enter-scale, 1)\n );\n }\n}\n\n@keyframes nexus-exit {\n to {\n opacity: var(--nx-exit-opacity, 1);\n transform: translate3d(\n var(--nx-exit-translate-x, 0),\n var(--nx-exit-translate-y, 0),\n 0\n )\n scale3d(\n var(--nx-exit-scale, 1),\n var(--nx-exit-scale, 1),\n var(--nx-exit-scale, 1)\n );\n }\n}\n\n@keyframes nexus-accordion-down {\n from {\n height: 0;\n }\n to {\n height: var(--radix-accordion-content-height);\n }\n}\n\n@keyframes nexus-accordion-up {\n from {\n height: var(--radix-accordion-content-height);\n }\n to {\n height: 0;\n }\n}\n\n@keyframes nexus-skeleton-shimmer {\n 0% {\n background-position: 300% 0;\n }\n 100% {\n background-position: -300% 0;\n }\n}\n\n@keyframes modal-fade {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes modal-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes modal-scale {\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n}\n\n@keyframes modal-small-scale {\n from {\n transform: scale(0.9);\n }\n to {\n transform: scale(1);\n }\n}\n\n@keyframes modal-pop-fade {\n 0% {\n transform: scale(0.95);\n opacity: 0;\n }\n 60% {\n transform: scale(1.03);\n opacity: 1;\n }\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n\n@keyframes modal-bottom-sheet {\n from {\n transform: translateY(calc(100% + 60px));\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes modal-slide-left {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes modal-slide-right {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes modal-full-page {\n from {\n transform: translateY(60%);\n opacity: 0.5;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n@keyframes modal-full-page-reverse {\n from {\n transform: translateY(-60%);\n opacity: 0.5;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n";
5
- var built_default = css;
6
-
7
- exports.built_default = built_default;
package/dist/chunks/chunk-ECVAVQUY.mjs DELETED
@@ -1,243 +0,0 @@
1
- import { cn } from './chunk-MCKOWMLS.mjs';
2
- import * as React from 'react';
3
- import { cva } from 'class-variance-authority';
4
- import { jsxs, jsx } from 'react/jsx-runtime';
5
-
6
- var numberInputVariants = cva("nexus-number-input", {
7
- variants: {
8
- size: {
9
- sm: "nexus-number-input--sm",
10
- md: "nexus-number-input--md",
11
- lg: "nexus-number-input--lg",
12
- xl: "nexus-number-input--xl"
13
- },
14
- state: {
15
- default: "nexus-number-input--default",
16
- error: "nexus-number-input--error"
17
- }
18
- },
19
- defaultVariants: { size: "md", state: "default" }
20
- });
21
- var ChevronUp = () => /* @__PURE__ */ jsx("svg", { className: "nexus-number-input__step-icon", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: /* @__PURE__ */ jsx("path", { d: "M3 7.5L6 4.5l3 3" }) });
22
- var ChevronDown = () => /* @__PURE__ */ jsx("svg", { className: "nexus-number-input__step-icon", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: /* @__PURE__ */ jsx("path", { d: "M3 4.5L6 7.5l3-3" }) });
23
- function clampValue(val, min, max) {
24
- let result = val;
25
- if (min !== void 0) result = Math.max(min, result);
26
- if (max !== void 0) result = Math.min(max, result);
27
- return result;
28
- }
29
- function roundToDigit(val, digit) {
30
- const factor = Math.pow(10, digit);
31
- return Math.round(val * factor) / factor;
32
- }
33
- function numberInputBind(ref, direction) {
34
- return {
35
- onPointerDown: (e) => {
36
- if (direction === "increment") ref.current?.startIncrement(e);
37
- else ref.current?.startDecrement(e);
38
- },
39
- onPointerUp: () => ref.current?.stop(),
40
- onPointerLeave: () => ref.current?.stop()
41
- };
42
- }
43
- var NumberInput = React.forwardRef(
44
- ({
45
- className,
46
- size,
47
- error,
48
- value,
49
- min,
50
- max,
51
- step = 1,
52
- digit = 0,
53
- hideButtons = false,
54
- disabled,
55
- readOnly,
56
- onValueChange,
57
- placeholder,
58
- ...props
59
- }, ref) => {
60
- const inputRef = React.useRef(null);
61
- const state = error ? "error" : "default";
62
- const [internalValue, setInternalValue] = React.useState(value?.toString() ?? "");
63
- const internalValueRef = React.useRef(internalValue);
64
- const timeoutRef = React.useRef(null);
65
- const pressCountRef = React.useRef(0);
66
- React.useEffect(() => {
67
- internalValueRef.current = internalValue;
68
- }, [internalValue]);
69
- React.useEffect(() => {
70
- setInternalValue(value?.toString() ?? "");
71
- }, [value]);
72
- const commitValue = React.useCallback(
73
- (raw) => {
74
- if (raw === "" || raw === "-") {
75
- setInternalValue(raw);
76
- onValueChange?.(void 0);
77
- return;
78
- }
79
- const parsed = parseFloat(raw);
80
- if (isNaN(parsed)) return;
81
- const clamped = clampValue(roundToDigit(parsed, digit), min, max);
82
- setInternalValue(clamped.toString());
83
- onValueChange?.(clamped);
84
- },
85
- [digit, min, max, onValueChange]
86
- );
87
- const handleInputChange = React.useCallback(
88
- (e) => {
89
- const raw = e.target.value;
90
- const regex = digit > 0 ? /^-?\d*\.?\d*$/ : /^-?\d*$/;
91
- if (!regex.test(raw)) return;
92
- setInternalValue(raw);
93
- },
94
- [digit]
95
- );
96
- const handleBlur = React.useCallback(() => {
97
- commitValue(internalValue);
98
- }, [internalValue, commitValue]);
99
- const adjust = React.useCallback(
100
- (delta) => {
101
- const current = parseFloat(internalValueRef.current) || 0;
102
- const next = clampValue(roundToDigit(current + delta, digit), min, max);
103
- const nextStr = next.toString();
104
- internalValueRef.current = nextStr;
105
- setInternalValue(nextStr);
106
- onValueChange?.(next);
107
- },
108
- [digit, min, max, onValueChange]
109
- );
110
- const handleKeyDown = React.useCallback(
111
- (e) => {
112
- if (e.key === "Enter") commitValue(internalValue);
113
- if (e.key === "ArrowUp") {
114
- e.preventDefault();
115
- adjust(step);
116
- }
117
- if (e.key === "ArrowDown") {
118
- e.preventDefault();
119
- adjust(-step);
120
- }
121
- },
122
- [internalValue, commitValue, step, adjust]
123
- );
124
- const stopRepeat = React.useCallback(() => {
125
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
126
- timeoutRef.current = null;
127
- pressCountRef.current = 0;
128
- }, []);
129
- const startRepeat = React.useCallback(
130
- (delta, e) => {
131
- e.preventDefault();
132
- adjust(delta);
133
- pressCountRef.current = 0;
134
- timeoutRef.current = setTimeout(() => {
135
- const accelerate = () => {
136
- adjust(delta);
137
- pressCountRef.current += 1;
138
- let delay = 100;
139
- if (pressCountRef.current > 20) delay = 30;
140
- else if (pressCountRef.current > 10) delay = 50;
141
- else if (pressCountRef.current > 5) delay = 75;
142
- timeoutRef.current = setTimeout(accelerate, delay);
143
- };
144
- accelerate();
145
- }, 400);
146
- },
147
- [adjust]
148
- );
149
- React.useEffect(() => () => stopRepeat(), [stopRepeat]);
150
- const startRepeatRef = React.useRef(startRepeat);
151
- startRepeatRef.current = startRepeat;
152
- const stopRepeatRef = React.useRef(stopRepeat);
153
- stopRepeatRef.current = stopRepeat;
154
- const adjustRef = React.useRef(adjust);
155
- adjustRef.current = adjust;
156
- React.useImperativeHandle(
157
- ref,
158
- () => ({
159
- get input() {
160
- return inputRef.current;
161
- },
162
- increment: () => adjustRef.current(step),
163
- decrement: () => adjustRef.current(-step),
164
- startIncrement: (e) => startRepeatRef.current(step, e),
165
- startDecrement: (e) => startRepeatRef.current(-step, e),
166
- stop: () => stopRepeatRef.current()
167
- }),
168
- [step]
169
- );
170
- const padSize = size === "sm" ? "nexus-number-input__field--sm" : size === "xl" ? "nexus-number-input__field--xl" : size === "lg" ? "nexus-number-input__field--lg" : "nexus-number-input__field--md";
171
- const showButtons = !hideButtons && !readOnly && !disabled;
172
- const numValue = parseFloat(internalValue) || 0;
173
- const isMinDisabled = min !== void 0 && numValue <= min;
174
- const isMaxDisabled = max !== void 0 && numValue >= max;
175
- return /* @__PURE__ */ jsxs(
176
- "div",
177
- {
178
- className: cn(
179
- numberInputVariants({ size, state }),
180
- disabled && "nexus-number-input--disabled",
181
- className
182
- ),
183
- children: [
184
- /* @__PURE__ */ jsx(
185
- "input",
186
- {
187
- ref: inputRef,
188
- type: "text",
189
- inputMode: "decimal",
190
- role: "spinbutton",
191
- className: cn("nexus-number-input__field", padSize),
192
- value: internalValue,
193
- disabled,
194
- readOnly,
195
- placeholder,
196
- "aria-invalid": error || void 0,
197
- "aria-valuemin": min,
198
- "aria-valuemax": max,
199
- "aria-valuenow": internalValue ? parseFloat(internalValue) || void 0 : void 0,
200
- onChange: handleInputChange,
201
- onBlur: handleBlur,
202
- onKeyDown: handleKeyDown,
203
- ...props
204
- }
205
- ),
206
- showButtons && /* @__PURE__ */ jsxs("div", { className: "nexus-number-input__buttons", children: [
207
- /* @__PURE__ */ jsx(
208
- "button",
209
- {
210
- type: "button",
211
- tabIndex: -1,
212
- disabled: isMaxDisabled,
213
- className: "nexus-number-input__step nexus-number-input__step--up",
214
- onPointerDown: (e) => startRepeat(step, e),
215
- onPointerUp: stopRepeat,
216
- onPointerLeave: stopRepeat,
217
- "aria-label": "Increase",
218
- children: /* @__PURE__ */ jsx(ChevronUp, {})
219
- }
220
- ),
221
- /* @__PURE__ */ jsx(
222
- "button",
223
- {
224
- type: "button",
225
- tabIndex: -1,
226
- disabled: isMinDisabled,
227
- className: "nexus-number-input__step nexus-number-input__step--down",
228
- onPointerDown: (e) => startRepeat(-step, e),
229
- onPointerUp: stopRepeat,
230
- onPointerLeave: stopRepeat,
231
- "aria-label": "Decrease",
232
- children: /* @__PURE__ */ jsx(ChevronDown, {})
233
- }
234
- )
235
- ] })
236
- ]
237
- }
238
- );
239
- }
240
- );
241
- NumberInput.displayName = "NumberInput";
242
-
243
- export { NumberInput, numberInputBind, numberInputVariants };
package/dist/chunks/chunk-UPCWJWXR.mjs DELETED
@@ -1,5 +0,0 @@
1
- // src/styles/.generated/built.ts
2
- var css = "/*\n * @nexus-cross/design-system \u2014 Pure CSS\n *\n * BEM \uD074\uB798\uC2A4 \uB124\uC774\uBC0D(.nexus-*)\uC73C\uB85C CSS specificity \uAE30\uBC18 \uB3D9\uC791.\n * \uC18C\uBE44\uC790 CSS\uB294 \uB514\uC790\uC778 \uC2DC\uC2A4\uD15C \uC774\uD6C4\uC5D0 \uB85C\uB4DC\uB418\uBBC0\uB85C className\uC73C\uB85C \uC624\uBC84\uB77C\uC774\uB4DC \uAC00\uB2A5.\n */\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Component Tokens (:root)\n \uC18C\uBE44\uC790\uAC00 :root\uC5D0\uC11C \uC624\uBC84\uB77C\uC774\uB4DC \uAC00\uB2A5\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n:root {\n /* \u2500\u2500 Button: Color \u2500\u2500 */\n --color-comp-btn-focus-ring: var(--color-accent-primary);\n\n --color-comp-btn-primary-base: var(--color-accent-primary);\n --color-comp-btn-primary-hover: var(--color-accent-primary-hover);\n --color-comp-btn-primary-pressed: var(--color-accent-primary-pressed);\n --color-comp-btn-primary-on: var(--color-accent-on-primary);\n --color-comp-btn-primary-text: var(\n --color-accent-primary-intense,\n var(--color-accent-primary)\n );\n --color-comp-btn-primary-subtle-fill: var(--color-accent-primary-disabled);\n --color-comp-btn-primary-subtle-bg: var(--color-accent-primary-bg);\n\n --color-comp-btn-secondary-base: var(--color-accent-secondary);\n --color-comp-btn-secondary-hover: var(--color-accent-secondary-hover);\n --color-comp-btn-secondary-pressed: var(--color-accent-secondary-pressed);\n --color-comp-btn-secondary-on: var(--color-accent-on-secondary);\n --color-comp-btn-secondary-text: var(\n --color-accent-secondary-intense,\n var(--color-accent-secondary)\n );\n --color-comp-btn-secondary-subtle-fill: var(\n --color-accent-secondary-disabled\n );\n --color-comp-btn-secondary-subtle-bg: var(--color-accent-secondary-bg);\n\n --color-comp-btn-normal-base: var(--color-surface-subtle);\n --color-comp-btn-normal-hover: var(--color-surface-subtle-hover);\n --color-comp-btn-normal-pressed: var(--color-surface-subtle-hover);\n --color-comp-btn-normal-on: var(--color-text-primary);\n --color-comp-btn-normal-text: var(--color-text-primary);\n --color-comp-btn-normal-subtle-fill: var(--color-surface-subtle);\n --color-comp-btn-normal-subtle-bg: var(--color-surface-subtle-hover);\n --color-comp-btn-normal-border: var(--color-border-default);\n --color-comp-btn-normal-border-hover: var(\n --color-border-default-hover,\n var(--color-border-default)\n );\n\n --color-comp-btn-danger-base: var(--color-status-danger);\n --color-comp-btn-danger-hover: var(--color-status-danger-hover);\n --color-comp-btn-danger-pressed: var(--color-status-danger-pressed);\n --color-comp-btn-danger-on: var(--color-static-white);\n --color-comp-btn-danger-text: var(\n --color-status-danger-intense,\n var(--color-status-danger)\n );\n --color-comp-btn-danger-subtle-fill: var(--color-status-danger-disabled);\n --color-comp-btn-danger-subtle-bg: var(--color-status-danger-bg);\n\n /* \u2500\u2500 Button: Radius \u2500\u2500 */\n --radius-comp-btn-xl: 0.75rem;\n --radius-comp-btn-lg: 0.5rem;\n --radius-comp-btn-md: 0.5rem;\n --radius-comp-btn-sm: 0.25rem;\n\n /* \u2500\u2500 Button: Spacing \u2500\u2500 */\n --spacing-comp-btn-gap: var(--spacing-gap-sm, 0.5rem);\n --spacing-comp-btn-xl-h: 3rem;\n --spacing-comp-btn-xl-px: var(--spacing-padding-lg, 1.5rem);\n --spacing-comp-btn-lg-h: 2.5rem;\n --spacing-comp-btn-lg-px: var(--spacing-padding-lg, 1.5rem);\n --spacing-comp-btn-md-h: 1.875rem;\n --spacing-comp-btn-md-px: var(--spacing-padding-sm, 0.75rem);\n --spacing-comp-btn-sm-px: var(--spacing-padding-xs, 0.5rem);\n --spacing-comp-btn-sm-py: var(--spacing-padding-2xs, 0.25rem);\n\n /* \u2500\u2500 Button: Font \u2500\u2500 */\n --text-comp-btn-xl: var(--text-text-base, 1rem);\n --text-comp-btn-lg: var(--text-text-base, 1rem);\n --text-comp-btn-md: var(--text-text-sm, 0.875rem);\n --text-comp-btn-sm: var(--text-text-xs, 0.75rem);\n\n /* \u2500\u2500 Button: Misc \u2500\u2500 */\n --shadow-comp-btn: none;\n --opacity-comp-btn-disabled: 0.5;\n\n /* \u2500\u2500 Shared: Shadow \u2500\u2500 */\n --shadow-comp-sm: var(--shadow-elevation-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));\n --shadow-comp-md: var(--shadow-elevation-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));\n --shadow-comp-lg: var(--shadow-elevation-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n\n /* \u2500\u2500 Shared: Overlay \u2500\u2500 */\n --color-comp-overlay: var(--color-overlay-dim, rgba(0, 0, 0, 0.6));\n\n /* \u2500\u2500 ErrorBoundary \u2500\u2500 */\n --color-comp-error-border: var(--color-status-danger);\n --color-comp-error-bg: var(--color-status-danger-bg, #fef2f2);\n --color-comp-error-text: var(--color-status-danger-intense, #991b1b);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n \uCEF4\uD3EC\uB10C\uD2B8 \uC2A4\uD0C0\uC77C\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* \u2500\u2500\u2500 Shared: sr-only \u2500\u2500\u2500 */\n.nexus-sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Button\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-comp-btn-gap);\n white-space: nowrap;\n user-select: none;\n box-shadow: var(--shadow-comp-btn);\n transition-property: color, background-color, border-color;\n transition-duration: 200ms;\n}\n.nexus-btn:disabled,\n.nexus-btn[aria-disabled='true'] {\n pointer-events: none;\n opacity: var(--opacity-comp-btn-disabled);\n}\n.nexus-btn:focus-visible {\n outline: 2px solid\n color-mix(in srgb, var(--color-comp-btn-focus-ring) 50%, transparent);\n outline-offset: 2px;\n}\n\n/* Variant: contained */\n.nexus-btn--contained {\n background: var(--_btn-base);\n color: var(--_btn-on);\n}\n.nexus-btn--contained:hover {\n background: var(--_btn-hover);\n}\n.nexus-btn--contained:active {\n background: var(--_btn-pressed);\n}\n\n/* Variant: outlined */\n.nexus-btn--outlined {\n border: 1px solid var(--_btn-border);\n color: var(--_btn-text);\n background: var(--_btn-outlined-bg);\n}\n.nexus-btn--outlined:hover {\n background: var(--_btn-outlined-hover-bg);\n border-color: var(--_btn-border-hover);\n}\n.nexus-btn--outlined:active {\n background: var(--_btn-outlined-pressed-bg);\n border-color: var(--_btn-border-hover);\n}\n\n/* Variant: subtle */\n.nexus-btn--subtle {\n background: var(--_btn-subtle-fill);\n color: var(--_btn-text);\n}\n.nexus-btn--subtle:hover {\n background: var(--_btn-light-bg);\n}\n.nexus-btn--subtle:active {\n background: var(--_btn-light-bg);\n}\n\n/* Variant: ghost */\n.nexus-btn--ghost {\n background: transparent;\n color: var(--_btn-text);\n}\n.nexus-btn--ghost:hover {\n background: var(--_btn-ghost-hover-bg);\n}\n.nexus-btn--ghost:active {\n background: var(--_btn-ghost-pressed-bg);\n}\n\n/* Sizes */\n.nexus-btn--xl {\n height: var(--spacing-comp-btn-xl-h);\n padding-inline: var(--spacing-comp-btn-xl-px);\n font-size: var(--text-comp-btn-xl);\n font-weight: 600;\n border-radius: var(--radius-comp-btn-xl);\n}\n.nexus-btn--lg {\n height: var(--spacing-comp-btn-lg-h);\n padding-inline: var(--spacing-comp-btn-lg-px);\n font-size: var(--text-comp-btn-lg);\n font-weight: 600;\n border-radius: var(--radius-comp-btn-lg);\n}\n.nexus-btn--md {\n height: var(--spacing-comp-btn-md-h);\n padding-inline: var(--spacing-comp-btn-md-px);\n font-size: var(--text-comp-btn-md);\n font-weight: 500;\n border-radius: var(--radius-comp-btn-md);\n}\n.nexus-btn--sm {\n padding-inline: var(--spacing-comp-btn-sm-px);\n padding-block: var(--spacing-comp-btn-sm-py);\n font-size: var(--text-comp-btn-sm);\n font-weight: 500;\n border-radius: var(--radius-comp-btn-sm);\n}\n\n/* Radius override */\n.nexus-btn--circle {\n border-radius: 9999px !important;\n}\n\n/* Semantic palette \u2014 compound selectors (cascade \uBC29\uC9C0) */\n.nexus-btn--primary {\n --_btn-base: var(--color-comp-btn-primary-base);\n --_btn-hover: var(--color-comp-btn-primary-hover);\n --_btn-pressed: var(--color-comp-btn-primary-pressed);\n --_btn-on: var(--color-comp-btn-primary-on);\n --_btn-text: var(--color-comp-btn-primary-text);\n --_btn-subtle-fill: var(--color-comp-btn-primary-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-primary-subtle-bg);\n --_btn-border: var(--color-accent-primary-focus, var(--color-accent-primary));\n --_btn-border-hover: var(\n --color-accent-primary-focus,\n var(--color-accent-primary)\n );\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-primary-subtle-bg);\n --_btn-outlined-pressed-bg: var(--color-surface-default);\n --_btn-ghost-hover-bg: var(--color-comp-btn-primary-subtle-bg);\n --_btn-ghost-pressed-bg: var(--color-comp-btn-primary-subtle-fill);\n}\n.nexus-btn--secondary {\n --_btn-base: var(--color-comp-btn-secondary-base);\n --_btn-hover: var(--color-comp-btn-secondary-hover);\n --_btn-pressed: var(--color-comp-btn-secondary-pressed);\n --_btn-on: var(--color-comp-btn-secondary-on);\n --_btn-text: var(--color-comp-btn-secondary-text);\n --_btn-subtle-fill: var(--color-comp-btn-secondary-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-secondary-subtle-bg);\n --_btn-border: var(\n --color-accent-secondary-focus,\n var(--color-accent-secondary)\n );\n --_btn-border-hover: var(\n --color-accent-secondary-focus,\n var(--color-accent-secondary)\n );\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-secondary-subtle-bg);\n --_btn-outlined-pressed-bg: var(--color-surface-default);\n --_btn-ghost-hover-bg: var(--color-comp-btn-secondary-subtle-bg);\n --_btn-ghost-pressed-bg: var(--color-comp-btn-secondary-subtle-fill);\n}\n.nexus-btn--normal {\n --_btn-base: var(--color-comp-btn-normal-base);\n --_btn-hover: var(--color-comp-btn-normal-hover);\n --_btn-pressed: var(--color-comp-btn-normal-pressed);\n --_btn-on: var(--color-comp-btn-normal-on);\n --_btn-text: var(--color-comp-btn-normal-text);\n --_btn-subtle-fill: var(--color-comp-btn-normal-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-normal-subtle-bg);\n --_btn-border: var(--color-comp-btn-normal-border);\n --_btn-border-hover: var(--color-comp-btn-normal-border-hover);\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-normal-subtle-bg);\n --_btn-outlined-pressed-bg: var(\n --color-surface-pressed,\n var(--color-surface-strong)\n );\n --_btn-ghost-hover-bg: var(--color-comp-btn-normal-subtle-bg);\n --_btn-ghost-pressed-bg: var(\n --color-surface-pressed,\n var(--color-surface-strong)\n );\n}\n.nexus-btn--danger {\n --_btn-base: var(--color-comp-btn-danger-base);\n --_btn-hover: var(--color-comp-btn-danger-hover);\n --_btn-pressed: var(--color-comp-btn-danger-pressed);\n --_btn-on: var(--color-comp-btn-danger-on);\n --_btn-text: var(--color-comp-btn-danger-text);\n --_btn-subtle-fill: var(--color-comp-btn-danger-subtle-fill);\n --_btn-light-bg: var(--color-comp-btn-danger-subtle-bg);\n --_btn-border: var(--color-status-danger-focus, var(--color-status-danger));\n --_btn-border-hover: var(\n --color-status-danger-focus,\n var(--color-status-danger)\n );\n --_btn-outlined-bg: var(--color-surface-default);\n --_btn-outlined-hover-bg: var(--color-comp-btn-danger-subtle-bg);\n --_btn-outlined-pressed-bg: var(--color-surface-default);\n --_btn-ghost-hover-bg: var(--color-comp-btn-danger-subtle-bg);\n --_btn-ghost-pressed-bg: var(--color-comp-btn-danger-subtle-fill);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n TextInput\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* \u2500\u2500 Field wrapper \u2500\u2500 */\n.nexus-text-input-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n}\n.nexus-text-input-field__label {\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 600;\n color: var(--color-text-muted);\n line-height: 1;\n}\n.nexus-text-input-field__footer {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.nexus-text-input-field__description {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-muted);\n line-height: 1.5;\n letter-spacing: -0.12px;\n}\n.nexus-text-input-field__description--error {\n color: var(--color-status-danger);\n}\n.nexus-text-input-field__count {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-muted);\n margin-left: auto;\n flex-shrink: 0;\n}\n.nexus-text-input-field__count--error {\n color: var(--color-status-danger);\n}\n\n/* \u2500\u2500 Input box \u2500\u2500 */\n.nexus-text-input {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: var(--radius-corner-md, 0.5rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 500;\n line-height: 1;\n color: var(--color-text-primary);\n transition: border-color 200ms, box-shadow 200ms;\n}\n:where(.nexus-text-input) {\n width: 100%;\n}\n.nexus-text-input:hover:not(.nexus-text-input--disabled):not(:focus-within) {\n border-color: var(--color-border-default-hover);\n box-shadow: 0 0 0 0.5px var(--color-border-default-hover);\n}\n.nexus-text-input--default:focus-within {\n border-color: var(--color-accent-primary);\n box-shadow: 0 0 0 0.5px var(--color-accent-primary);\n}\n.nexus-text-input--error {\n border-color: var(--color-status-danger);\n}\n.nexus-text-input--error:focus-within {\n border-color: var(--color-status-danger);\n box-shadow: 0 0 0 0.5px var(--color-status-danger);\n}\n.nexus-text-input--disabled {\n cursor: not-allowed;\n background: var(--color-surface-strong);\n border-color: var(--color-border-medium);\n color: var(--color-text-muted);\n}\n\n/* \u2500\u2500 Sizes \u2500\u2500 */\n.nexus-text-input--xl {\n padding: calc(var(--spacing-padding-md, 1rem) - 1px) var(--spacing-padding-md, 1rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-text-input--lg {\n padding: calc(var(--spacing-padding-sm, 0.75rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-text-input--md {\n padding: calc(var(--spacing-padding-xs, 0.5rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n\n/* \u2500\u2500 Inner elements \u2500\u2500 */\n.nexus-text-input__inner {\n flex: 1;\n min-width: 0;\n padding: 0;\n background: transparent;\n border: none;\n outline: none;\n color: inherit;\n font: inherit;\n}\n.nexus-text-input__inner:focus-visible {\n outline: none;\n}\n.nexus-text-input__inner::placeholder {\n color: var(--color-text-muted);\n}\n.nexus-text-input__icon {\n display: flex;\n flex-shrink: 0;\n color: var(--color-text-muted);\n}\n.nexus-text-input__clear {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1rem;\n height: 1rem;\n border: none;\n background: transparent;\n color: var(--color-text-muted);\n cursor: pointer;\n padding: 0;\n transition: color 150ms;\n}\n.nexus-text-input__clear:hover {\n color: var(--color-icon-tertiary-hover);\n background: transparent;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n PriceInput\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* \u2500\u2500 Field wrapper \u2500\u2500 */\n.nexus-price-input-field {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n}\n.nexus-price-input-field__header {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.nexus-price-input-field__label {\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 600;\n color: var(--color-text-tertiary);\n line-height: 1;\n}\n.nexus-price-input-field__balance {\n display: inline-flex;\n align-items: baseline;\n gap: 0.375rem;\n margin-left: auto;\n padding: 0;\n border: none;\n background: transparent;\n font-size: var(--text-text-xs, 0.75rem);\n font-weight: 400;\n color: var(--color-text-tertiary);\n cursor: pointer;\n line-height: 1.5;\n letter-spacing: -0.12px;\n transition: color 150ms;\n}\n.nexus-price-input-field__balance:hover {\n color: var(--color-text-tertiary);\n}\n.nexus-price-input-field__balance:disabled {\n cursor: not-allowed;\n opacity: var(--opacity-disabled-text, 0.5);\n}\n.nexus-price-input-field__balance-value {\n font-weight: 400;\n color: var(--color-text-secondary);\n text-decoration: underline;\n transition: color 150ms;\n}\n.nexus-price-input-field__balance:hover .nexus-price-input-field__balance-value {\n color: var(--color-text-primary);\n}\n.nexus-price-input-field__balance-value--exceeded {\n color: var(--color-status-danger);\n}\n.nexus-price-input-field__balance:hover .nexus-price-input-field__balance-value--exceeded {\n color: var(--color-status-danger);\n}\n.nexus-price-input-field__description {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-tertiary);\n line-height: 1.5;\n letter-spacing: -0.12px;\n}\n.nexus-price-input-field__description--error {\n color: var(--color-status-danger);\n}\n\n/* \u2500\u2500 Input box \u2500\u2500 */\n.nexus-price-input {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: var(--radius-corner-md, 0.5rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 500;\n line-height: 1;\n color: var(--color-text-primary);\n transition: border-color 200ms, box-shadow 200ms;\n}\n:where(.nexus-price-input) {\n width: 100%;\n}\n.nexus-price-input:hover:not(.nexus-price-input--disabled):not(:focus-within) {\n border-color: var(--color-border-default-hover);\n box-shadow: 0 0 0 0.5px var(--color-border-default-hover);\n}\n.nexus-price-input--default:focus-within {\n border-color: var(--color-accent-primary);\n box-shadow: 0 0 0 0.5px var(--color-accent-primary);\n}\n.nexus-price-input--error {\n border-color: var(--color-status-danger);\n}\n.nexus-price-input--error:focus-within {\n border-color: var(--color-status-danger);\n box-shadow: 0 0 0 0.5px var(--color-status-danger);\n}\n.nexus-price-input--disabled {\n cursor: not-allowed;\n background: var(--color-surface-strong);\n border-color: var(--color-border-medium);\n color: var(--color-text-muted);\n}\n\n/* \u2500\u2500 Sizes \u2500\u2500 */\n.nexus-price-input--xl {\n padding: calc(var(--spacing-padding-md, 1rem) - 1px) var(--spacing-padding-md, 1rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-price-input--lg {\n padding: calc(var(--spacing-padding-sm, 0.75rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-price-input--md {\n padding: calc(var(--spacing-padding-xs, 0.5rem) - 1px) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n\n/* \u2500\u2500 Inner elements \u2500\u2500 */\n.nexus-price-input__prefix {\n flex-shrink: 0;\n color: var(--color-text-secondary);\n font: inherit;\n user-select: none;\n}\n.nexus-price-input__suffix {\n flex-shrink: 0;\n color: var(--color-text-secondary);\n font: inherit;\n white-space: nowrap;\n user-select: none;\n}\n.nexus-price-input__inner {\n flex: 1;\n min-width: 0;\n padding: 0;\n background: transparent;\n border: none;\n outline: none;\n color: inherit;\n font: inherit;\n}\n.nexus-price-input__inner:focus-visible {\n outline: none;\n}\n.nexus-price-input__inner::placeholder {\n color: var(--color-text-muted);\n}\n.nexus-price-input__inner--right {\n text-align: right;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n TextArea\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-textarea {\n border-radius: var(--radius-corner-md, 0.375rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-primary);\n transition-property: border-color;\n transition-duration: 200ms;\n resize: none;\n}\n:where(.nexus-textarea) {\n width: 100%;\n}\n.nexus-textarea::placeholder {\n color: var(--color-text-tertiary);\n}\n.nexus-textarea:focus-visible {\n outline: none;\n}\n.nexus-textarea:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-textarea--default:focus {\n border-color: var(--color-text-primary);\n}\n.nexus-textarea--error {\n border-color: var(--color-status-danger);\n}\n.nexus-textarea--error:focus {\n border-color: var(--color-status-danger);\n}\n.nexus-textarea-wrap {\n display: flex;\n flex-direction: column;\n}\n.nexus-textarea-count {\n margin-top: 0.25rem;\n text-align: right;\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-tertiary);\n}\n.nexus-textarea-count__current {\n color: var(--color-text-primary);\n font-weight: 500;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n NumberInput\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-number-input {\n display: flex;\n align-items: center;\n border-radius: var(--radius-corner-md, 0.375rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n transition: border-color 200ms, box-shadow 200ms;\n}\n:where(.nexus-number-input) {\n width: 100%;\n}\n.nexus-number-input:hover:not(.nexus-number-input--disabled):not(:focus-within) {\n box-shadow: 0 0 0 0.5px var(--color-border-default);\n}\n.nexus-number-input--default:focus-within {\n border-color: var(--color-accent-primary);\n box-shadow: 0 0 0 0.5px var(--color-accent-primary);\n}\n.nexus-number-input--error {\n border-color: var(--color-status-danger);\n}\n.nexus-number-input--error:focus-within {\n border-color: var(--color-status-danger);\n box-shadow: 0 0 0 0.5px var(--color-status-danger);\n}\n.nexus-number-input--xl {\n height: 3.5rem;\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-number-input--lg {\n height: 3rem;\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-number-input--md {\n height: 2.5rem;\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-number-input--sm {\n height: 2rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-number-input--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.nexus-number-input__field {\n height: 100%;\n width: 100%;\n min-width: 0;\n flex: 1;\n background: transparent;\n outline: none;\n}\n.nexus-number-input__field::placeholder {\n color: var(--color-text-tertiary);\n}\n.nexus-number-input__field:focus-visible {\n outline: none;\n}\n.nexus-number-input__field--xl {\n padding-inline: var(--spacing-padding-lg, 1.25rem);\n}\n.nexus-number-input__field--lg {\n padding-inline: var(--spacing-padding-md, 1rem);\n}\n.nexus-number-input__field--md {\n padding-inline: var(--spacing-padding-sm, 0.75rem);\n}\n.nexus-number-input__field--sm {\n padding-inline: 0.625rem;\n}\n.nexus-number-input__buttons {\n display: flex;\n flex-direction: column;\n border-left: 1px solid var(--color-border-default);\n height: 100%;\n flex-shrink: 0;\n}\n.nexus-number-input__step {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n padding-inline: 0.375rem;\n color: var(--color-text-tertiary);\n transition-property: color, background-color;\n transition-duration: 150ms;\n}\n.nexus-number-input__step:hover {\n color: var(--color-text-primary);\n background: var(--color-surface-hover);\n}\n.nexus-number-input__step:disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n.nexus-number-input__step--up {\n border-top-right-radius: var(--radius-corner-md, 0.375rem);\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-number-input__step--down {\n border-bottom-right-radius: var(--radius-corner-md, 0.375rem);\n}\n.nexus-number-input__step-icon {\n width: 0.75rem;\n height: 0.75rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Divider\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-divider {\n flex-shrink: 0;\n border-color: var(--color-border-default);\n}\n.nexus-divider--horizontal {\n width: 100%;\n border-top-width: 1px;\n}\n.nexus-divider--vertical {\n align-self: stretch;\n border-left-width: 1px;\n}\n.nexus-divider--solid {\n border-style: solid;\n}\n.nexus-divider--dashed {\n border-style: dashed;\n}\n.nexus-divider--dotted {\n border-style: dotted;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Avatar\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-avatar {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n background: var(--color-surface-hover);\n color: var(--color-text-tertiary);\n}\n.nexus-avatar--xs {\n width: 1.5rem;\n height: 1.5rem;\n font-size: 10px;\n}\n.nexus-avatar--sm {\n width: 2rem;\n height: 2rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-avatar--md {\n width: 2.5rem;\n height: 2.5rem;\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-avatar--lg {\n width: 3rem;\n height: 3rem;\n font-size: var(--text-text-base, 1rem);\n}\n.nexus-avatar--xl {\n width: 4rem;\n height: 4rem;\n font-size: var(--text-text-lg, 1.125rem);\n}\n.nexus-avatar--circle {\n border-radius: 9999px;\n}\n.nexus-avatar--square {\n border-radius: var(--radius-corner-md, 0.375rem);\n}\n.nexus-avatar__icon--xs {\n width: 1rem;\n height: 1rem;\n}\n.nexus-avatar__icon--sm {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-avatar__icon--md {\n width: 1.5rem;\n height: 1.5rem;\n}\n.nexus-avatar__icon--lg {\n width: 2rem;\n height: 2rem;\n}\n.nexus-avatar__icon--xl {\n width: 2.5rem;\n height: 2.5rem;\n}\n.nexus-avatar__img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Switch\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-switch {\n position: relative;\n display: inline-flex;\n flex-shrink: 0;\n cursor: pointer;\n border-radius: 9999px;\n transition-property: background-color;\n transition-duration: 200ms;\n border: 2px solid transparent;\n}\n.nexus-switch:has(input:disabled) {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-switch--sm {\n height: 1.25rem;\n width: 2.25rem;\n}\n.nexus-switch--md {\n height: 1.5rem;\n width: 2.75rem;\n}\n.nexus-switch--checked {\n background: var(--color-accent-primary);\n}\n.nexus-switch--unchecked {\n background: var(--color-border-default);\n}\n.nexus-switch__thumb {\n pointer-events: none;\n display: block;\n border-radius: 9999px;\n background: var(--color-static-white);\n box-shadow: var(--shadow-comp-sm);\n transition-property: transform;\n transition-duration: 200ms;\n}\n.nexus-switch__thumb--sm {\n width: 1rem;\n height: 1rem;\n}\n.nexus-switch__thumb--md {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-switch__thumb--sm-on {\n transform: translateX(1rem);\n}\n.nexus-switch__thumb--md-on {\n transform: translateX(1.25rem);\n}\n.nexus-switch__thumb--off {\n transform: translateX(0);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n CheckBox\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-checkbox {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-sm, 0.5rem);\n user-select: none;\n}\n.nexus-checkbox--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-checkbox--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-checkbox--pointer {\n cursor: pointer;\n}\n.nexus-checkbox--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-checkbox__box {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border: 1px solid var(--color-border-default);\n transition-property: border-color, background-color;\n transition-duration: 150ms;\n}\n.nexus-checkbox__box:has(~ .nexus-sr-only:disabled) {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.nexus-checkbox__box--sm {\n width: 1rem;\n height: 1rem;\n}\n.nexus-checkbox__box--md {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-checkbox__box--square {\n border-radius: var(--radius-corner-sm, 0.25rem);\n}\n.nexus-checkbox__box--round {\n border-radius: 9999px;\n}\n.nexus-checkbox__box--checked {\n border-color: var(--color-accent-primary);\n background: var(--color-accent-primary);\n color: var(--color-static-white);\n}\n.nexus-checkbox__box--unchecked {\n border-color: var(--color-border-default);\n background: var(--color-surface-default);\n}\n.nexus-checkbox__icon--sm {\n width: 0.75rem;\n height: 0.75rem;\n}\n.nexus-checkbox__icon--md {\n width: 0.875rem;\n height: 0.875rem;\n}\n.nexus-checkbox__label {\n color: var(--color-text-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n RadioGroup\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-radio-group {\n display: flex;\n}\n.nexus-radio-group--horizontal {\n flex-direction: row;\n gap: var(--spacing-gap-lg, 1rem);\n}\n.nexus-radio-group--vertical {\n flex-direction: column;\n gap: var(--spacing-gap-sm, 0.5rem);\n}\n.nexus-radio-item {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-sm, 0.5rem);\n user-select: none;\n}\n.nexus-radio-item--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-radio-item--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-radio-item--pointer {\n cursor: pointer;\n}\n.nexus-radio-item--disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-radio__circle {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n border: 1px solid var(--color-border-default);\n transition-property: border-color;\n transition-duration: 150ms;\n}\n.nexus-radio__circle:has(~ .nexus-sr-only:disabled) {\n opacity: 0.5;\n cursor: not-allowed;\n}\n.nexus-radio__circle--sm {\n width: 1rem;\n height: 1rem;\n}\n.nexus-radio__circle--md {\n width: 1.25rem;\n height: 1.25rem;\n}\n.nexus-radio__circle--checked {\n border-color: var(--color-accent-primary);\n color: var(--color-accent-primary);\n}\n.nexus-radio__circle--unchecked {\n border-color: var(--color-border-default);\n background: var(--color-surface-default);\n}\n.nexus-radio__dot {\n border-radius: 9999px;\n background: currentColor;\n}\n.nexus-radio__dot--sm {\n width: 0.375rem;\n height: 0.375rem;\n}\n.nexus-radio__dot--md {\n width: 0.5rem;\n height: 0.5rem;\n}\n.nexus-radio__label {\n color: var(--color-text-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Chip\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-chip {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n white-space: nowrap;\n font-weight: 500;\n transition-property: color, background-color, border-color;\n transition-duration: 150ms;\n user-select: none;\n border-radius: 9999px;\n border: 1px solid transparent;\n}\n.nexus-chip[aria-disabled='true'] {\n opacity: 0.5;\n pointer-events: none;\n}\n.nexus-chip--default {\n border-color: var(--color-border-default);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n}\n.nexus-chip--filled {\n border-color: transparent;\n background: var(--color-surface-hover);\n color: var(--color-text-primary);\n}\n.nexus-chip--outline {\n border-color: var(--color-border-default);\n background: transparent;\n color: var(--color-text-primary);\n}\n.nexus-chip--accent {\n border-color: transparent;\n background: color-mix(in srgb, var(--color-accent-primary) 10%, transparent);\n color: var(--color-accent-primary);\n}\n.nexus-chip--sm {\n height: 1.5rem;\n padding-inline: var(--spacing-padding-xs, 0.5rem);\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-chip--md {\n height: 1.75rem;\n padding-inline: 0.625rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-chip--lg {\n height: 2rem;\n padding-inline: var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-chip__close {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n padding: 0.125rem;\n opacity: 0.6;\n transition-property: opacity;\n transition-duration: 150ms;\n}\n.nexus-chip__close:hover {\n opacity: 1;\n}\n.nexus-chip__close-icon {\n width: 0.75rem;\n height: 0.75rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Pagination\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-pagination {\n display: flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n}\n.nexus-pagination--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-pagination--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-page-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--radius-corner-md, 0.375rem);\n font-weight: 500;\n transition-property: color, background-color;\n transition-duration: 150ms;\n user-select: none;\n border: 1px solid transparent;\n}\n.nexus-page-btn:disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n.nexus-page-btn--sm {\n width: 1.75rem;\n height: 1.75rem;\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-page-btn--md {\n width: 2.25rem;\n height: 2.25rem;\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-page-btn--active {\n background: var(--color-accent-primary);\n color: var(--color-static-white);\n border-color: var(--color-accent-primary);\n}\n.nexus-page-btn--inactive {\n color: var(--color-text-primary);\n}\n.nexus-page-btn--inactive:hover {\n background: var(--color-surface-hover);\n}\n.nexus-page-icon--sm {\n width: 0.875rem;\n height: 0.875rem;\n}\n.nexus-page-icon--md {\n width: 1rem;\n height: 1rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Tab\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-tab-list {\n position: relative;\n display: flex;\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-tab-list--pill {\n gap: var(--spacing-gap-xs, 0.25rem);\n border-bottom: none;\n background: var(--color-surface-hover);\n border-radius: var(--radius-corner-lg, 0.5rem);\n padding: 0.25rem;\n}\n.nexus-tab-trigger {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n white-space: nowrap;\n font-weight: 500;\n user-select: none;\n outline: none;\n transition-property: color, background-color, border-color;\n transition-duration: 150ms;\n}\n.nexus-tab-trigger--line {\n padding: 0.625rem var(--spacing-padding-md, 1rem);\n color: var(--color-text-tertiary);\n border-bottom: 2px solid transparent;\n margin-bottom: -1px;\n}\n.nexus-tab-trigger--line:hover {\n color: var(--color-text-primary);\n}\n.nexus-tab-trigger--line-active {\n color: var(--color-text-primary);\n border-bottom-color: var(--color-accent-primary);\n}\n.nexus-tab-trigger--pill {\n padding: 0.375rem var(--spacing-padding-sm, 0.75rem);\n border-radius: var(--radius-corner-md, 0.375rem);\n color: var(--color-text-tertiary);\n}\n.nexus-tab-trigger--pill:hover {\n color: var(--color-text-primary);\n}\n.nexus-tab-trigger--pill-active {\n color: var(--color-text-primary);\n background: var(--color-surface-default);\n box-shadow: var(--shadow-comp-sm);\n}\n.nexus-tab-trigger--sm {\n font-size: var(--text-text-xs, 0.75rem);\n}\n.nexus-tab-trigger--md {\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-tab-trigger--disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Skeleton\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-skeleton {\n position: relative;\n overflow: hidden;\n background: linear-gradient(\n to right,\n var(--color-surface-hover),\n var(--color-surface-default),\n var(--color-surface-hover)\n );\n background-size: 300% 100%;\n animation: nexus-skeleton-shimmer 2.5s ease-in-out infinite;\n}\n.nexus-skeleton--rect {\n border-radius: var(--radius-corner-md, 0.375rem);\n}\n.nexus-skeleton--circle {\n border-radius: 9999px;\n}\n.nexus-skeleton__children {\n opacity: 0;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Spinner\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-spinner {\n animation: nexus-spin 1s linear infinite;\n color: currentColor;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n ErrorBoundary\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-error-boundary {\n padding: 1rem;\n border-radius: var(--radius-corner-lg, 0.5rem);\n border: 1px solid var(--color-comp-error-border);\n background: var(--color-comp-error-bg);\n color: var(--color-comp-error-text);\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-error-boundary__title {\n margin: 0;\n font-weight: 600;\n}\n.nexus-error-boundary__message {\n margin: 0.5rem 0 0;\n opacity: 0.8;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Divider & Simple components\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-virtual-scroll {\n overflow: auto;\n}\n.nexus-modal-portal-target {\n position: absolute;\n z-index: 9999;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n DataList\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-datalist-center {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: var(--spacing-padding-xl, 2rem);\n}\n.nexus-datalist-empty {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: var(--spacing-padding-xl, 2rem);\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-tertiary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n InfiniteScroll\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-infinite-scroll {\n position: relative;\n}\n.nexus-infinite-sentinel {\n position: relative;\n height: 1px;\n width: 100%;\n}\n.nexus-infinite-spinner {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: var(--spacing-padding-md, 1rem);\n}\n.nexus-infinite-spinner-icon {\n width: 1.5rem;\n height: 1.5rem;\n animation: nexus-spin 1s linear infinite;\n border-radius: 9999px;\n border: 2px solid var(--color-border-default);\n border-top-color: var(--color-accent-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Countdown\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-countdown {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n font-variant-numeric: tabular-nums;\n}\n.nexus-countdown__separator {\n color: var(--color-text-tertiary);\n margin-inline: 0.125rem;\n}\n.nexus-countdown__label {\n color: var(--color-text-tertiary);\n font-size: var(--text-text-xs, 0.75rem);\n margin-left: 0.125rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Select\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-select-trigger {\n position: relative;\n display: flex;\n height: 2.5rem;\n align-items: center;\n justify-content: space-between;\n border-radius: var(--radius-corner-sm, 0.25rem);\n border: 1px solid var(--color-border-default);\n color: var(--color-text-primary);\n font-size: var(--text-text-sm, 0.875rem);\n transition-property: border-color;\n transition-duration: 200ms;\n}\n.nexus-select-trigger:hover {\n border-color: var(--color-border-strong);\n}\n.nexus-select-trigger:has(:disabled) {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.nexus-select-trigger::placeholder {\n color: var(--color-text-tertiary);\n}\n.nexus-select-trigger--default {\n background: var(--color-surface-hover);\n}\n.nexus-select-trigger--outline {\n background: var(--color-surface-default);\n}\n.nexus-select-trigger--sm {\n width: 4rem;\n}\n.nexus-select-trigger--md {\n width: 8rem;\n}\n.nexus-select-trigger--lg {\n width: 12rem;\n}\n.nexus-select-trigger--full {\n width: 100%;\n}\n.nexus-select-trigger--justify-end {\n justify-content: flex-end;\n}\n.nexus-select-trigger__display {\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n height: 100%;\n width: calc(100% - 30px);\n align-items: center;\n}\n.nexus-select-trigger__inner {\n display: flex;\n height: 100%;\n width: 100%;\n flex-direction: row-reverse;\n align-items: center;\n justify-content: space-between;\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n}\n.nexus-select-trigger__inner:focus {\n outline: none;\n}\n.nexus-select-chevron {\n width: 0.75rem;\n height: 0.75rem;\n opacity: 0.5;\n transition: transform 200ms;\n}\n.nexus-select-chevron--open {\n transform: rotate(180deg);\n}\n\n.nexus-select-content {\n position: relative;\n z-index: 50;\n max-height: 24rem;\n overflow: hidden;\n border-radius: var(--radius-corner-sm, 0.25rem);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n box-shadow: var(--shadow-comp-lg);\n transform-origin: top center;\n will-change: transform, opacity;\n}\n.nexus-select-content[data-state='open'] {\n animation: nexus-select-slide-in 150ms ease-out;\n}\n.nexus-select-content[data-state='closed'] {\n animation: nexus-select-slide-out 100ms ease-in forwards;\n}\n@keyframes nexus-select-slide-in {\n from { opacity: 0; transform: translateY(-4px) scaleY(0.96); }\n to { opacity: 1; transform: translateY(0) scaleY(1); }\n}\n@keyframes nexus-select-slide-out {\n from { opacity: 1; transform: translateY(0) scaleY(1); }\n to { opacity: 0; transform: translateY(-4px) scaleY(0.96); }\n}\n.nexus-select-content--sm {\n width: 4rem;\n}\n.nexus-select-content--md {\n width: 8rem;\n}\n.nexus-select-content--lg {\n width: 12rem;\n}\n.nexus-select-content--full {\n width: var(--radix-popper-anchor-width);\n}\n.nexus-select-viewport {\n padding: 0.25rem;\n}\n\n.nexus-select-item {\n position: relative;\n display: flex;\n width: 100%;\n cursor: pointer;\n align-items: center;\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n color: var(--color-text-primary);\n font-size: var(--text-text-sm, 0.875rem);\n transition-property: background-color;\n transition-duration: 150ms;\n outline: none;\n user-select: none;\n}\n.nexus-select-item:hover,\n.nexus-select-item:focus,\n.nexus-select-item[data-highlighted] {\n background: var(--color-surface-hover);\n}\n.nexus-select-item[data-disabled] {\n pointer-events: none;\n opacity: 0.5;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Tooltip\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-tooltip-content {\n z-index: 50;\n display: flex;\n overflow: hidden;\n border-radius: var(--radius-corner-md, 0.375rem);\n padding: var(--spacing-padding-xs, 0.5rem) var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-sm, 0.875rem);\n}\n.nexus-tooltip--light {\n border: 1px solid var(--color-border-default);\n background: var(--color-static-white);\n color: var(--color-static-black);\n box-shadow: var(--shadow-comp-md);\n}\n.nexus-tooltip--dark {\n border: none;\n background: var(--color-static-black);\n color: var(--color-static-white);\n}\n.nexus-tooltip-arrow--dark {\n fill: var(--color-static-black);\n}\n.nexus-tooltip-arrow--light {\n fill: var(--color-static-white);\n}\n.nexus-tooltip-trigger {\n cursor: default;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Popover\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-popover-content {\n z-index: 50;\n border-radius: var(--radius-corner-lg, 0.5rem);\n border: 1px solid var(--color-border-default);\n padding: var(--spacing-padding-md, 1rem);\n box-shadow: var(--shadow-comp-lg);\n outline: none;\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n transform-origin: var(--radix-popover-content-transform-origin);\n will-change: transform, opacity;\n}\n.nexus-popover-content[data-state='open'] {\n animation: nexus-popover-in 150ms ease-out;\n}\n.nexus-popover-content[data-state='closed'] {\n animation: nexus-popover-out 100ms ease-in forwards;\n}\n@keyframes nexus-popover-in {\n from { opacity: 0; transform: scale(0.95); }\n to { opacity: 1; transform: scale(1); }\n}\n@keyframes nexus-popover-out {\n from { opacity: 1; transform: scale(1); }\n to { opacity: 0; transform: scale(0.95); }\n}\n.nexus-popover-arrow {\n fill: var(--color-surface-default);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Drawer\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-drawer-overlay {\n position: fixed;\n inset: 0;\n z-index: 50;\n background: var(--color-comp-overlay);\n}\n.nexus-drawer-overlay--blur-sm {\n backdrop-filter: blur(4px);\n}\n.nexus-drawer-overlay--blur-md {\n backdrop-filter: blur(12px);\n}\n.nexus-drawer-content {\n position: fixed;\n z-index: 50;\n display: flex;\n flex-direction: column;\n background: var(--color-surface-default);\n}\n.nexus-drawer-content--bottom {\n inset-inline: 0;\n bottom: 0;\n margin-top: 6rem;\n border-top-left-radius: 1rem;\n border-top-right-radius: 1rem;\n border-top: 1px solid var(--color-border-default);\n}\n.nexus-drawer-content--top {\n inset-inline: 0;\n top: 0;\n margin-bottom: 6rem;\n border-bottom-left-radius: 1rem;\n border-bottom-right-radius: 1rem;\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-drawer-content--left {\n inset-block: 0;\n left: 0;\n margin-right: 6rem;\n width: 85vw;\n max-width: 24rem;\n border-top-right-radius: 1rem;\n border-bottom-right-radius: 1rem;\n border-right: 1px solid var(--color-border-default);\n}\n.nexus-drawer-content--right {\n inset-block: 0;\n right: 0;\n margin-left: 6rem;\n width: 85vw;\n max-width: 24rem;\n border-top-left-radius: 1rem;\n border-bottom-left-radius: 1rem;\n border-left: 1px solid var(--color-border-default);\n}\n.nexus-drawer-handle {\n display: flex;\n justify-content: center;\n}\n.nexus-drawer-handle--bottom {\n padding-top: var(--spacing-padding-md, 1rem);\n}\n.nexus-drawer-handle--top {\n padding-bottom: var(--spacing-padding-md, 1rem);\n}\n.nexus-drawer-handle__bar {\n background: var(--color-border-strong);\n height: 0.375rem;\n width: 3rem;\n border-radius: 9999px;\n}\n.nexus-drawer-title {\n font-size: var(--text-text-lg, 1.125rem);\n font-weight: 600;\n color: var(--color-text-primary);\n}\n.nexus-drawer-description {\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-secondary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Accordion\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-accordion-item {\n border-bottom: 1px solid var(--color-border-default);\n}\n.nexus-accordion-header {\n display: flex;\n}\n.nexus-accordion-trigger {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: space-between;\n padding-block: var(--spacing-padding-md, 1rem);\n transition: all 150ms;\n}\n.nexus-accordion-trigger[data-state='open'] > .nexus-accordion-chevron {\n transform: rotate(180deg);\n}\n.nexus-accordion-chevron {\n width: 0.75rem;\n height: 0.75rem;\n flex-shrink: 0;\n transition: transform 200ms;\n}\n.nexus-accordion-content {\n overflow: hidden;\n transition: all 200ms;\n}\n.nexus-accordion-content[data-state='open'] {\n animation: nexus-accordion-down 200ms ease-out;\n}\n.nexus-accordion-content[data-state='closed'] {\n animation: nexus-accordion-up 200ms ease-in;\n}\n.nexus-accordion-content__inner {\n padding-top: 0;\n padding-bottom: var(--spacing-padding-md, 1rem);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Ellipsis\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-ellipsis {\n position: relative;\n}\n.nexus-ellipsis__content {\n overflow: hidden;\n transition: height 300ms;\n}\n.nexus-ellipsis__trigger {\n margin-top: 0.25rem;\n display: flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n font-size: var(--text-text-sm, 0.875rem);\n color: var(--color-text-secondary);\n transition-property: color;\n transition-duration: 150ms;\n}\n.nexus-ellipsis__trigger:hover {\n color: var(--color-text-primary);\n}\n.nexus-ellipsis__trigger--expanded > svg {\n transform: rotate(180deg);\n}\n.nexus-ellipsis__chevron {\n width: 0.875rem;\n height: 0.875rem;\n transition: transform 200ms;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Marquee\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-marquee {\n overflow: hidden;\n}\n.nexus-marquee--pause-on-hover:hover > div {\n animation-play-state: paused !important;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Carousel\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-carousel {\n position: relative;\n}\n.nexus-carousel__viewport {\n overflow: hidden;\n}\n.nexus-carousel__container {\n display: flex;\n}\n.nexus-carousel-slide {\n min-width: 0;\n flex-shrink: 0;\n flex-grow: 0;\n flex-basis: 100%;\n}\n.nexus-carousel-btn {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n z-index: 10;\n width: 2rem;\n height: 2rem;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 9999px;\n background: var(--color-surface-default);\n border: 1px solid var(--color-border-default);\n box-shadow: var(--shadow-comp-sm);\n color: var(--color-text-primary);\n transition-property: background-color;\n transition-duration: 150ms;\n}\n.nexus-carousel-btn:hover {\n background: var(--color-surface-hover);\n}\n.nexus-carousel-btn:disabled {\n opacity: 0.4;\n pointer-events: none;\n}\n.nexus-carousel-btn--prev {\n left: 0.5rem;\n}\n.nexus-carousel-btn--next {\n right: 0.5rem;\n}\n.nexus-carousel-btn__icon {\n width: 1rem;\n height: 1rem;\n}\n.nexus-carousel-dots {\n display: flex;\n justify-content: center;\n gap: 0.375rem;\n margin-top: var(--spacing-padding-sm, 0.75rem);\n}\n.nexus-carousel-dot {\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 9999px;\n transition-property: background-color;\n transition-duration: 150ms;\n}\n.nexus-carousel-dot--active {\n background: var(--color-accent-primary);\n}\n.nexus-carousel-dot--inactive {\n background: var(--color-border-default);\n}\n.nexus-carousel-dot--inactive:hover {\n background: var(--color-text-tertiary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Toast\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-toast {\n display: flex;\n align-items: center;\n gap: var(--spacing-gap-sm, 0.75rem);\n border-radius: var(--radius-corner-lg, 0.5rem);\n border: 1px solid var(--color-border-default);\n padding: var(--spacing-padding-sm, 0.75rem) var(--spacing-padding-md, 1rem);\n box-shadow: var(--shadow-comp-lg);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n}\n.nexus-toast__title {\n font-size: var(--text-text-sm, 0.875rem);\n font-weight: 500;\n}\n.nexus-toast__desc {\n font-size: var(--text-text-xs, 0.75rem);\n color: var(--color-text-secondary);\n}\n.nexus-toast--success {\n border-color: color-mix(\n in srgb,\n var(--color-status-positive) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-status-positive) 10%, transparent);\n color: var(--color-status-positive);\n}\n.nexus-toast--error {\n border-color: color-mix(\n in srgb,\n var(--color-status-danger) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-status-danger) 10%, transparent);\n color: var(--color-status-danger);\n}\n.nexus-toast--warning {\n border-color: color-mix(\n in srgb,\n var(--color-status-caution) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-status-caution) 10%, transparent);\n color: var(--color-status-caution);\n}\n.nexus-toast--info {\n border-color: color-mix(\n in srgb,\n var(--color-accent-primary) 30%,\n transparent\n );\n background: color-mix(in srgb, var(--color-accent-primary) 10%, transparent);\n color: var(--color-accent-primary);\n}\n.nexus-toast__action-btn {\n background: var(--color-accent-primary);\n color: var(--color-accent-on-primary);\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: 0.375rem var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-xs, 0.75rem);\n font-weight: 500;\n}\n.nexus-toast__cancel-btn {\n background: var(--color-surface-hover);\n color: var(--color-text-secondary);\n border-radius: var(--radius-corner-sm, 0.25rem);\n padding: 0.375rem var(--spacing-padding-sm, 0.75rem);\n font-size: var(--text-text-xs, 0.75rem);\n font-weight: 500;\n}\n.nexus-toast__close-btn {\n color: var(--color-text-tertiary);\n}\n.nexus-toast__close-btn:hover {\n color: var(--color-text-primary);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Table\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-table-wrap {\n overflow-x: auto;\n}\n.nexus-table {\n width: 100%;\n}\n.nexus-table-thead {\n display: flex;\n background: var(--color-surface-default);\n}\n.nexus-table-th {\n display: flex;\n}\n.nexus-table-th--sortable {\n cursor: pointer;\n}\n.nexus-table-th__sort-btn {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-gap-xs, 0.25rem);\n background: none;\n border: none;\n padding: 0;\n margin: 0;\n font: inherit;\n color: inherit;\n cursor: pointer;\n text-align: inherit;\n width: 100%;\n}\n.nexus-table-sort-icon {\n width: 1rem;\n height: 1rem;\n}\n.nexus-table-center {\n display: flex;\n align-items: center;\n justify-content: center;\n padding-block: 3rem;\n}\n.nexus-table-nodata {\n color: var(--color-text-tertiary);\n}\n.nexus-table-loading-icon {\n width: 2rem;\n height: 2rem;\n animation: nexus-spin 1s linear infinite;\n border-radius: 9999px;\n border: 2px solid var(--color-border-default);\n border-top-color: var(--color-accent-primary);\n}\n.nexus-table-skeleton-row {\n display: flex;\n cursor: default;\n}\n.nexus-table-skeleton-td {\n height: 100%;\n width: 100%;\n padding-block: var(--spacing-padding-md, 1rem);\n}\n.nexus-table-skeleton-bar {\n height: 1rem;\n width: 100%;\n}\n\n/* TableRow */\n.nexus-table-row {\n border-bottom: 1px solid var(--color-border-default);\n display: flex;\n min-width: 0;\n}\n.nexus-table-row::-webkit-scrollbar {\n display: none;\n}\n.nexus-table-row--default:hover {\n background: var(--color-surface-hover);\n}\n.nexus-table-row--accent:hover {\n background: color-mix(in srgb, var(--color-accent-primary) 5%, transparent);\n}\n\n/* TdColumn */\n.nexus-td {\n min-width: 0;\n width: 100%;\n}\n.nexus-td__inner {\n border-radius: var(--radius-corner-md, 0.375rem);\n padding: 2px 0.25rem;\n transition-property: background-color;\n transition-duration: 150ms;\n}\n.nexus-td__inner--flex {\n display: flex;\n}\n.nexus-td__inner--highlight {\n background: color-mix(in srgb, var(--color-accent-primary) 10%, transparent);\n outline: 1px dashed var(--color-accent-primary);\n outline-offset: -1px;\n}\n.nexus-td--nowrap {\n white-space: nowrap;\n}\n.nexus-td--truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.nexus-td--wrap {\n white-space: normal;\n overflow-wrap: break-word;\n}\n.nexus-td--break-all {\n white-space: normal;\n word-break: break-all;\n}\n.nexus-td--center {\n text-align: center;\n justify-content: center;\n}\n.nexus-td--left {\n text-align: left;\n justify-content: flex-start;\n}\n.nexus-td--right {\n text-align: right;\n justify-content: flex-end;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Modal\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-modal-wrap {\n pointer-events: none;\n position: fixed;\n inset: 0;\n z-index: 99999;\n display: flex;\n height: 100%;\n align-items: center;\n justify-content: center;\n color: var(--color-text-primary);\n}\n.nexus-modal-wrap--bottom-sheet {\n align-items: flex-end;\n}\n.nexus-modal-wrap--slide-left {\n height: 100%;\n justify-content: flex-start;\n}\n.nexus-modal-wrap--slide-right {\n height: 100%;\n justify-content: flex-end;\n}\n.nexus-modal-wrap--full-page,\n.nexus-modal-wrap--full-page-reverse {\n height: 100%;\n justify-content: flex-start;\n}\n\n.nexus-modal-inner {\n position: relative;\n z-index: 2;\n overflow: hidden;\n pointer-events: auto;\n border-radius: var(--radius-corner-lg, 12px);\n border: 1px solid var(--color-border-default);\n background: var(--color-surface-default);\n color: var(--color-text-primary);\n}\n:where(.nexus-modal-inner) {\n width: 100%;\n min-height: 200px;\n}\n.nexus-modal-inner > div {\n display: contents;\n}\n@media (min-width: 640px) {\n :where(.nexus-modal-inner) {\n width: 480px;\n min-height: auto;\n }\n}\n.nexus-modal-inner--bottom-sheet {\n margin: 0;\n width: 100%;\n border-top-left-radius: 1rem;\n border-top-right-radius: 1rem;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n border-top: 1px solid var(--color-border-default);\n padding: 1.5rem 1rem 0;\n}\n.nexus-modal-inner--slide-left,\n.nexus-modal-inner--slide-right {\n height: 100%;\n border-radius: 0;\n}\n.nexus-modal-inner--full-page,\n.nexus-modal-inner--full-page-reverse {\n height: 100%;\n width: 100%;\n border-radius: 0;\n border-color: transparent;\n}\n@media (min-width: 640px) {\n .nexus-modal-inner--full-page,\n .nexus-modal-inner--full-page-reverse {\n width: 100%;\n }\n}\n.nexus-modal-inner--draggable {\n min-width: 320px;\n overflow: visible;\n}\n.nexus-modal-inner--has-footer {\n padding-bottom: 88px;\n}\n.nexus-modal-inner--bottom-sheet.nexus-modal-inner--has-footer {\n padding-bottom: 5rem;\n}\n\n.nexus-modal-header {\n position: relative;\n padding: 1.5rem 1.25rem 0;\n}\n.nexus-modal-header--bottom-sheet {\n padding: 0;\n}\n.nexus-modal-header--draggable {\n cursor: grab;\n user-select: none;\n}\n.nexus-modal-header--draggable:active {\n cursor: grabbing;\n}\n\n.nexus-modal-close-btn {\n position: absolute;\n top: 1.5rem;\n right: 1.25rem;\n z-index: 1;\n margin-left: auto;\n display: flex;\n cursor: pointer;\n align-items: center;\n justify-content: flex-end;\n}\n.nexus-modal-close-btn--bottom-sheet {\n position: relative;\n top: 0;\n right: 0;\n}\n.nexus-modal-close-icon {\n width: 1.25rem;\n height: 1.25rem;\n color: var(--color-text-muted);\n}\n\n.nexus-modal-title {\n margin: 0;\n padding-right: 42px;\n font-size: var(--text-text-lg, 1.125rem);\n font-weight: 600;\n line-height: 26px;\n letter-spacing: -0.002em;\n color: var(--color-text-primary);\n}\n.nexus-modal-title--bottom-sheet {\n padding-top: 0.375rem;\n line-height: 1.75rem;\n letter-spacing: -0.012em;\n}\n.nexus-modal-desc {\n color: var(--color-text-muted);\n font-size: var(--text-text-xs, 0.75rem);\n margin-top: 0.25rem;\n}\n\n.nexus-modal-body {\n position: relative;\n overflow-y: auto;\n padding: 1.5rem 1.25rem 0;\n}\n.nexus-modal-body::-webkit-scrollbar {\n display: none;\n}\n.nexus-modal-body--no-footer {\n padding-bottom: 1.5rem;\n}\n.nexus-modal-body--bottom-sheet {\n margin-top: 1.5rem;\n max-height: calc(100vh - 108px);\n padding: 0 0 1.5rem;\n}\n.nexus-modal-body--slide,\n.nexus-modal-body--full-page {\n height: 100%;\n max-height: 100%;\n overflow-y: auto;\n}\n.nexus-modal-body--full-page {\n padding-bottom: 0;\n}\n\n.nexus-modal-footer {\n position: absolute;\n bottom: 0;\n left: 0;\n z-index: 2;\n display: flex;\n width: 100%;\n padding: 1.5rem 1.25rem 1.25rem;\n}\n.nexus-modal-footer button {\n height: 3rem;\n flex: 1;\n}\n.nexus-modal-footer--bottom-sheet {\n padding: 0.75rem 1rem 1.5rem;\n}\n.nexus-modal-footer--draggable {\n position: relative;\n}\n\n.nexus-modal-dim {\n pointer-events: auto;\n position: fixed;\n inset: 0;\n z-index: 1;\n display: block;\n height: 100vh;\n width: 100vw;\n background: color-mix(\n in srgb,\n var(--color-static-black, #000) 75%,\n transparent\n );\n}\n.nexus-modal-dim--hidden {\n display: none;\n}\n.nexus-modal-dim--draggable {\n background: color-mix(\n in srgb,\n var(--color-static-black, #000) 30%,\n transparent\n );\n}\n\n.nexus-modal-bottom-sheet-handle {\n display: flex;\n width: 100%;\n justify-content: center;\n padding-top: 0.75rem;\n padding-bottom: 0.5rem;\n}\n.nexus-modal-bottom-sheet-bar {\n background: var(--color-border-default);\n height: 0.375rem;\n width: 4rem;\n border-radius: 9999px;\n}\n\n.nexus-modal-component {\n opacity: 0;\n}\n.nexus-modal-component--visible {\n opacity: 1;\n}\n.nexus-modal-component--portal {\n position: relative;\n}\n.nexus-modal-component--enter .nexus-modal-inner {\n animation-direction: var(--modal-animation-direction);\n animation-duration: var(--modal-animation-duration);\n animation-name: var(--modal-animation-name);\n animation-timing-function: var(--modal-animation-timing-function);\n}\n.nexus-modal-component--leave .nexus-modal-inner {\n animation-direction: reverse;\n animation-duration: var(--modal-animation-duration);\n animation-fill-mode: var(--modal-animation-fill-mode);\n animation-name: var(--modal-animation-name);\n animation-timing-function: var(--modal-animation-timing-function);\n}\n\n.nexus-contents {\n display: contents;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Animation utilities (Radix enter/exit)\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.nexus-animate-in {\n animation: nexus-enter 200ms ease-out;\n --nx-enter-opacity: 1;\n --nx-enter-scale: 1;\n --nx-enter-translate-x: 0;\n --nx-enter-translate-y: 0;\n}\n.nexus-animate-out {\n animation: nexus-exit 150ms ease-in forwards;\n --nx-exit-opacity: 1;\n --nx-exit-scale: 1;\n --nx-exit-translate-x: 0;\n --nx-exit-translate-y: 0;\n}\n.nexus-fade-in-0 {\n --nx-enter-opacity: 0;\n}\n.nexus-fade-out-0 {\n --nx-exit-opacity: 0;\n}\n.nexus-zoom-in-95 {\n --nx-enter-scale: 0.95;\n}\n.nexus-zoom-out-95 {\n --nx-exit-scale: 0.95;\n}\n.nexus-slide-in-from-top-2 {\n --nx-enter-translate-y: -0.5rem;\n}\n.nexus-slide-in-from-bottom-2 {\n --nx-enter-translate-y: 0.5rem;\n}\n.nexus-slide-in-from-left-2 {\n --nx-enter-translate-x: -0.5rem;\n}\n.nexus-slide-in-from-right-2 {\n --nx-enter-translate-x: 0.5rem;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n Keyframes\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n@keyframes nexus-spin {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}\n\n@keyframes nexus-enter {\n from {\n opacity: var(--nx-enter-opacity, 1);\n transform: translate3d(\n var(--nx-enter-translate-x, 0),\n var(--nx-enter-translate-y, 0),\n 0\n )\n scale3d(\n var(--nx-enter-scale, 1),\n var(--nx-enter-scale, 1),\n var(--nx-enter-scale, 1)\n );\n }\n}\n\n@keyframes nexus-exit {\n to {\n opacity: var(--nx-exit-opacity, 1);\n transform: translate3d(\n var(--nx-exit-translate-x, 0),\n var(--nx-exit-translate-y, 0),\n 0\n )\n scale3d(\n var(--nx-exit-scale, 1),\n var(--nx-exit-scale, 1),\n var(--nx-exit-scale, 1)\n );\n }\n}\n\n@keyframes nexus-accordion-down {\n from {\n height: 0;\n }\n to {\n height: var(--radix-accordion-content-height);\n }\n}\n\n@keyframes nexus-accordion-up {\n from {\n height: var(--radix-accordion-content-height);\n }\n to {\n height: 0;\n }\n}\n\n@keyframes nexus-skeleton-shimmer {\n 0% {\n background-position: 300% 0;\n }\n 100% {\n background-position: -300% 0;\n }\n}\n\n@keyframes modal-fade {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes modal-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes modal-scale {\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n}\n\n@keyframes modal-small-scale {\n from {\n transform: scale(0.9);\n }\n to {\n transform: scale(1);\n }\n}\n\n@keyframes modal-pop-fade {\n 0% {\n transform: scale(0.95);\n opacity: 0;\n }\n 60% {\n transform: scale(1.03);\n opacity: 1;\n }\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n\n@keyframes modal-bottom-sheet {\n from {\n transform: translateY(calc(100% + 60px));\n }\n to {\n transform: translateY(0);\n }\n}\n\n@keyframes modal-slide-left {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes modal-slide-right {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n\n@keyframes modal-full-page {\n from {\n transform: translateY(60%);\n opacity: 0.5;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n@keyframes modal-full-page-reverse {\n from {\n transform: translateY(-60%);\n opacity: 0.5;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n";
3
- var built_default = css;
4
-
5
- export { built_default };