@zylem/ui 0.1.0

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 (31) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +44 -0
  3. package/dist/chunk-3R5KFBTB.js +1 -0
  4. package/dist/index.css +1 -0
  5. package/dist/index.d.ts +350 -0
  6. package/dist/index.js +1 -0
  7. package/dist/styles.css +1 -0
  8. package/dist/styles.d.ts +2 -0
  9. package/dist/styles.js +1 -0
  10. package/package.json +74 -0
  11. package/src/components/Button.tsx +19 -0
  12. package/src/components/index.ts +9 -0
  13. package/src/css-side-effects.d.ts +5 -0
  14. package/src/editor/assets/zylem-logo.png +0 -0
  15. package/src/fonts.css +1 -0
  16. package/src/global/accordion.css.ts +89 -0
  17. package/src/global/checkbox.css.ts +74 -0
  18. package/src/global/common.css.ts +41 -0
  19. package/src/global/console.css.ts +43 -0
  20. package/src/global/detached-panel.css.ts +65 -0
  21. package/src/global/editor-base.css.ts +245 -0
  22. package/src/global/entities.css.ts +50 -0
  23. package/src/global/logo-data.ts +4 -0
  24. package/src/global/logo.css.ts +15 -0
  25. package/src/global/menu.css.ts +40 -0
  26. package/src/global/sidebar.css.ts +18 -0
  27. package/src/global/toolbar.css.ts +62 -0
  28. package/src/index.ts +14 -0
  29. package/src/sprinkles.css.ts +164 -0
  30. package/src/styles.ts +20 -0
  31. package/src/theme.css.ts +132 -0
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 Zylem Game Toolkit
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,44 @@
1
+ # @zylem/ui
2
+
3
+ Design tokens, global styles, and Solid components for Zylem, built with
4
+ [vanilla-extract](https://vanilla-extract.style/) and [Kobalte](https://kobalte.dev/).
5
+
6
+ ## Usage
7
+
8
+ ```ts
9
+ // Typed design tokens and atomic utilities
10
+ import { vars, sprinkles } from '@zylem/ui';
11
+
12
+ // CSS bundle (import once at app entry)
13
+ import '@zylem/ui/styles.css';
14
+
15
+ // Solid components (compiled by the consuming app's bundler)
16
+ import { Button } from '@zylem/ui/components';
17
+ ```
18
+
19
+ ## Development
20
+
21
+ Requires Node `v22.12.0` (see `.nvmrc`) and [pnpm](https://pnpm.io/).
22
+
23
+ ```bash
24
+ pnpm install
25
+
26
+ # Build the library (tsup) into dist/
27
+ pnpm build
28
+
29
+ # Watch mode
30
+ pnpm dev
31
+
32
+ # Run the showcase app at http://localhost:3030
33
+ pnpm showcase
34
+
35
+ # Lint
36
+ pnpm lint
37
+ ```
38
+
39
+ ## Showcase
40
+
41
+ The `showcase/` directory contains a Vite + Solid app demonstrating every
42
+ token group and component (colors, typography, buttons, panels, toolbar,
43
+ accordion, and more). It compiles the vanilla-extract sources live, so edits
44
+ to any `*.css.ts` file hot-reload without a library build.
package/dist/chunk-3R5KFBTB.js ADDED
@@ -0,0 +1 @@
1
+ var c={colors:{primary:"#61A6E8",primaryHover:"#3B8AD8",primaryActive:"#0C6EB8",accent:"#E64534",accentHover:"#C93A2C",accentActive:"#A82F24",background:"#11151C",backgroundTranslucent:"rgba(10, 20, 30, 0.46)",surface:"#1A1F27",surfaceHover:"#222831",border:"#2D3643",active:"rgba(20, 255, 60, 0.7)",activeHover:"rgba(20, 255, 60, 0.4)",successHover:"#2a6734b3",text:"#E6EBEF",textSecondary:"#88929E",consoleBackground:"rgba(20, 40, 60, 0.25)",consoleText:"#61A6E8"},spacing:{xxs:"0.125rem",xs:"0.25rem",sm:"0.5rem",md:"0.75rem",lg:"1rem",xl:"1.5rem",xxl:"2rem",xxxl:"3rem"},sizes:{icon:"28px",iconSm:"16px",iconLg:"96px"},typography:{fontFamily:"'Exo 2', sans-serif",fontSize:"14px"},borders:{radius:"12px",width:"1.5px"}},a={colors:{primary:"var(--zylem-color-primary)",primaryHover:"var(--zylem-color-primary-hover)",primaryActive:"var(--zylem-color-primary-active)",accent:"var(--zylem-color-accent)",accentHover:"var(--zylem-color-accent-hover)",accentActive:"var(--zylem-color-accent-active)",background:"var(--zylem-color-background)",backgroundTranslucent:"var(--zylem-color-background-translucent)",surface:"var(--zylem-color-surface)",surfaceHover:"var(--zylem-color-surface-hover)",border:"var(--zylem-color-border)",active:"var(--zylem-color-active)",activeHover:"var(--zylem-color-active-hover)",successHover:"var(--zylem-color-success-hover)",text:"var(--zylem-color-text)",textSecondary:"var(--zylem-color-text-secondary)",consoleBackground:"var(--zylem-color-console-background)",consoleText:"var(--zylem-color-console-text)"},spacing:{xxs:"var(--zylem-spacing-xxs)",xs:"var(--zylem-spacing-xs)",sm:"var(--zylem-spacing-sm)",md:"var(--zylem-spacing-md)",lg:"var(--zylem-spacing-lg)",xl:"var(--zylem-spacing-xl)",xxl:"var(--zylem-spacing-xxl)",xxxl:"var(--zylem-spacing-xxxl)"},sizes:{icon:"var(--zylem-size-icon)",iconSm:"var(--zylem-size-icon-sm)",iconLg:"var(--zylem-size-icon-lg)"},typography:{fontFamily:"var(--zylem-font-family)",fontSize:"var(--zylem-font-size)"},borders:{radius:"var(--zylem-radius)",width:"var(--zylem-border)"}};export{c as a,a as b};
package/dist/index.css ADDED
@@ -0,0 +1 @@
1
+ :root{--zylem-color-primary: #61A6E8;--zylem-color-primary-hover: #3B8AD8;--zylem-color-primary-active: #0C6EB8;--zylem-color-accent: #E64534;--zylem-color-accent-hover: #C93A2C;--zylem-color-accent-active: #A82F24;--zylem-color-background: #11151C;--zylem-color-background-translucent: rgba(10, 20, 30, .46);--zylem-color-surface: #1A1F27;--zylem-color-surface-hover: #222831;--zylem-color-border: #2D3643;--zylem-color-active: rgba(20, 255, 60, .7);--zylem-color-active-hover: rgba(20, 255, 60, .4);--zylem-color-success-hover: #2a6734b3;--zylem-color-text: #E6EBEF;--zylem-color-text-secondary: #88929E;--zylem-color-console-background: rgba(20, 40, 60, .25);--zylem-color-console-text: #61A6E8;--zylem-spacing-xxs: .125rem;--zylem-spacing-xs: .25rem;--zylem-spacing-sm: .5rem;--zylem-spacing-md: .75rem;--zylem-spacing-lg: 1rem;--zylem-spacing-xl: 1.5rem;--zylem-spacing-xxl: 2rem;--zylem-spacing-xxxl: 3rem;--zylem-size-icon: 28px;--zylem-size-icon-sm: 16px;--zylem-size-icon-lg: 96px;--zylem-font-family: "Exo 2", sans-serif;--zylem-font-size: 14px;--zylem-radius: 12px;--zylem-border: 1.5px}._3039pd0{display:none}._3039pd3{display:block}._3039pd6{display:inline}._3039pd9{display:inline-block}._3039pdc{display:flex}._3039pdf{display:inline-flex}._3039pdi{display:grid}._3039pdl{display:inline-grid}._3039pdo{position:static}._3039pdr{position:relative}._3039pdu{position:absolute}._3039pdx{position:fixed}._3039pd10{position:sticky}._3039pd13{flex-direction:row}._3039pd16{flex-direction:row-reverse}._3039pd19{flex-direction:column}._3039pd1c{flex-direction:column-reverse}._3039pd1f{flex-wrap:wrap}._3039pd1i{flex-wrap:nowrap}._3039pd1l{flex-wrap:wrap-reverse}._3039pd1o{align-items:stretch}._3039pd1r{align-items:flex-start}._3039pd1u{align-items:center}._3039pd1x{align-items:flex-end}._3039pd20{align-items:baseline}._3039pd23{justify-content:flex-start}._3039pd26{justify-content:center}._3039pd29{justify-content:flex-end}._3039pd2c{justify-content:space-between}._3039pd2f{justify-content:space-around}._3039pd2i{justify-content:space-evenly}._3039pd2l{flex:1}._3039pd2o{flex:none}._3039pd2r{flex:auto}._3039pd2u{text-align:left}._3039pd2x{text-align:center}._3039pd30{text-align:right}._3039pd33{text-align:justify}._3039pd36{text-transform:none}._3039pd39{text-transform:uppercase}._3039pd3c{text-transform:lowercase}._3039pd3f{text-transform:capitalize}._3039pd3i{font-weight:400}._3039pd3l{font-weight:500}._3039pd3o{font-weight:600}._3039pd3r{font-weight:700}._3039pd3u{font-weight:800}._3039pd3x{box-sizing:border-box}._3039pd40{box-sizing:content-box}._3039pd43{overflow:hidden}._3039pd46{overflow:auto}._3039pd49{overflow:scroll}._3039pd4c{overflow:visible}._3039pd4f{overflow-x:hidden}._3039pd4i{overflow-x:auto}._3039pd4l{overflow-x:scroll}._3039pd4o{overflow-x:visible}._3039pd4r{overflow-y:hidden}._3039pd4u{overflow-y:auto}._3039pd4x{overflow-y:scroll}._3039pd50{overflow-y:visible}._3039pd53{padding:var(--zylem-spacing-xxs)}._3039pd56{padding:var(--zylem-spacing-xs)}._3039pd59{padding:var(--zylem-spacing-sm)}._3039pd5c{padding:var(--zylem-spacing-md)}._3039pd5f{padding:var(--zylem-spacing-lg)}._3039pd5i{padding:var(--zylem-spacing-xl)}._3039pd5l{padding:var(--zylem-spacing-xxl)}._3039pd5o{padding:var(--zylem-spacing-xxxl)}._3039pd5r{padding:0}._3039pd5u{padding:auto}._3039pd5x{padding-top:var(--zylem-spacing-xxs)}._3039pd60{padding-top:var(--zylem-spacing-xs)}._3039pd63{padding-top:var(--zylem-spacing-sm)}._3039pd66{padding-top:var(--zylem-spacing-md)}._3039pd69{padding-top:var(--zylem-spacing-lg)}._3039pd6c{padding-top:var(--zylem-spacing-xl)}._3039pd6f{padding-top:var(--zylem-spacing-xxl)}._3039pd6i{padding-top:var(--zylem-spacing-xxxl)}._3039pd6l{padding-top:0}._3039pd6o{padding-top:auto}._3039pd6r{padding-right:var(--zylem-spacing-xxs)}._3039pd6u{padding-right:var(--zylem-spacing-xs)}._3039pd6x{padding-right:var(--zylem-spacing-sm)}._3039pd70{padding-right:var(--zylem-spacing-md)}._3039pd73{padding-right:var(--zylem-spacing-lg)}._3039pd76{padding-right:var(--zylem-spacing-xl)}._3039pd79{padding-right:var(--zylem-spacing-xxl)}._3039pd7c{padding-right:var(--zylem-spacing-xxxl)}._3039pd7f{padding-right:0}._3039pd7i{padding-right:auto}._3039pd7l{padding-bottom:var(--zylem-spacing-xxs)}._3039pd7o{padding-bottom:var(--zylem-spacing-xs)}._3039pd7r{padding-bottom:var(--zylem-spacing-sm)}._3039pd7u{padding-bottom:var(--zylem-spacing-md)}._3039pd7x{padding-bottom:var(--zylem-spacing-lg)}._3039pd80{padding-bottom:var(--zylem-spacing-xl)}._3039pd83{padding-bottom:var(--zylem-spacing-xxl)}._3039pd86{padding-bottom:var(--zylem-spacing-xxxl)}._3039pd89{padding-bottom:0}._3039pd8c{padding-bottom:auto}._3039pd8f{padding-left:var(--zylem-spacing-xxs)}._3039pd8i{padding-left:var(--zylem-spacing-xs)}._3039pd8l{padding-left:var(--zylem-spacing-sm)}._3039pd8o{padding-left:var(--zylem-spacing-md)}._3039pd8r{padding-left:var(--zylem-spacing-lg)}._3039pd8u{padding-left:var(--zylem-spacing-xl)}._3039pd8x{padding-left:var(--zylem-spacing-xxl)}._3039pd90{padding-left:var(--zylem-spacing-xxxl)}._3039pd93{padding-left:0}._3039pd96{padding-left:auto}._3039pd99{padding-inline:var(--zylem-spacing-xxs)}._3039pd9c{padding-inline:var(--zylem-spacing-xs)}._3039pd9f{padding-inline:var(--zylem-spacing-sm)}._3039pd9i{padding-inline:var(--zylem-spacing-md)}._3039pd9l{padding-inline:var(--zylem-spacing-lg)}._3039pd9o{padding-inline:var(--zylem-spacing-xl)}._3039pd9r{padding-inline:var(--zylem-spacing-xxl)}._3039pd9u{padding-inline:var(--zylem-spacing-xxxl)}._3039pd9x{padding-inline:0}._3039pda0{padding-inline:auto}._3039pda3{padding-block:var(--zylem-spacing-xxs)}._3039pda6{padding-block:var(--zylem-spacing-xs)}._3039pda9{padding-block:var(--zylem-spacing-sm)}._3039pdac{padding-block:var(--zylem-spacing-md)}._3039pdaf{padding-block:var(--zylem-spacing-lg)}._3039pdai{padding-block:var(--zylem-spacing-xl)}._3039pdal{padding-block:var(--zylem-spacing-xxl)}._3039pdao{padding-block:var(--zylem-spacing-xxxl)}._3039pdar{padding-block:0}._3039pdau{padding-block:auto}._3039pdax{margin:var(--zylem-spacing-xxs)}._3039pdb0{margin:var(--zylem-spacing-xs)}._3039pdb3{margin:var(--zylem-spacing-sm)}._3039pdb6{margin:var(--zylem-spacing-md)}._3039pdb9{margin:var(--zylem-spacing-lg)}._3039pdbc{margin:var(--zylem-spacing-xl)}._3039pdbf{margin:var(--zylem-spacing-xxl)}._3039pdbi{margin:var(--zylem-spacing-xxxl)}._3039pdbl{margin:0}._3039pdbo{margin:auto}._3039pdbr{margin-top:var(--zylem-spacing-xxs)}._3039pdbu{margin-top:var(--zylem-spacing-xs)}._3039pdbx{margin-top:var(--zylem-spacing-sm)}._3039pdc0{margin-top:var(--zylem-spacing-md)}._3039pdc3{margin-top:var(--zylem-spacing-lg)}._3039pdc6{margin-top:var(--zylem-spacing-xl)}._3039pdc9{margin-top:var(--zylem-spacing-xxl)}._3039pdcc{margin-top:var(--zylem-spacing-xxxl)}._3039pdcf{margin-top:0}._3039pdci{margin-top:auto}._3039pdcl{margin-right:var(--zylem-spacing-xxs)}._3039pdco{margin-right:var(--zylem-spacing-xs)}._3039pdcr{margin-right:var(--zylem-spacing-sm)}._3039pdcu{margin-right:var(--zylem-spacing-md)}._3039pdcx{margin-right:var(--zylem-spacing-lg)}._3039pdd0{margin-right:var(--zylem-spacing-xl)}._3039pdd3{margin-right:var(--zylem-spacing-xxl)}._3039pdd6{margin-right:var(--zylem-spacing-xxxl)}._3039pdd9{margin-right:0}._3039pddc{margin-right:auto}._3039pddf{margin-bottom:var(--zylem-spacing-xxs)}._3039pddi{margin-bottom:var(--zylem-spacing-xs)}._3039pddl{margin-bottom:var(--zylem-spacing-sm)}._3039pddo{margin-bottom:var(--zylem-spacing-md)}._3039pddr{margin-bottom:var(--zylem-spacing-lg)}._3039pddu{margin-bottom:var(--zylem-spacing-xl)}._3039pddx{margin-bottom:var(--zylem-spacing-xxl)}._3039pde0{margin-bottom:var(--zylem-spacing-xxxl)}._3039pde3{margin-bottom:0}._3039pde6{margin-bottom:auto}._3039pde9{margin-left:var(--zylem-spacing-xxs)}._3039pdec{margin-left:var(--zylem-spacing-xs)}._3039pdef{margin-left:var(--zylem-spacing-sm)}._3039pdei{margin-left:var(--zylem-spacing-md)}._3039pdel{margin-left:var(--zylem-spacing-lg)}._3039pdeo{margin-left:var(--zylem-spacing-xl)}._3039pder{margin-left:var(--zylem-spacing-xxl)}._3039pdeu{margin-left:var(--zylem-spacing-xxxl)}._3039pdex{margin-left:0}._3039pdf0{margin-left:auto}._3039pdf3{margin-inline:var(--zylem-spacing-xxs)}._3039pdf6{margin-inline:var(--zylem-spacing-xs)}._3039pdf9{margin-inline:var(--zylem-spacing-sm)}._3039pdfc{margin-inline:var(--zylem-spacing-md)}._3039pdff{margin-inline:var(--zylem-spacing-lg)}._3039pdfi{margin-inline:var(--zylem-spacing-xl)}._3039pdfl{margin-inline:var(--zylem-spacing-xxl)}._3039pdfo{margin-inline:var(--zylem-spacing-xxxl)}._3039pdfr{margin-inline:0}._3039pdfu{margin-inline:auto}._3039pdfx{margin-block:var(--zylem-spacing-xxs)}._3039pdg0{margin-block:var(--zylem-spacing-xs)}._3039pdg3{margin-block:var(--zylem-spacing-sm)}._3039pdg6{margin-block:var(--zylem-spacing-md)}._3039pdg9{margin-block:var(--zylem-spacing-lg)}._3039pdgc{margin-block:var(--zylem-spacing-xl)}._3039pdgf{margin-block:var(--zylem-spacing-xxl)}._3039pdgi{margin-block:var(--zylem-spacing-xxxl)}._3039pdgl{margin-block:0}._3039pdgo{margin-block:auto}._3039pdgr{gap:var(--zylem-spacing-xxs)}._3039pdgu{gap:var(--zylem-spacing-xs)}._3039pdgx{gap:var(--zylem-spacing-sm)}._3039pdh0{gap:var(--zylem-spacing-md)}._3039pdh3{gap:var(--zylem-spacing-lg)}._3039pdh6{gap:var(--zylem-spacing-xl)}._3039pdh9{gap:var(--zylem-spacing-xxl)}._3039pdhc{gap:var(--zylem-spacing-xxxl)}._3039pdhf{gap:0}._3039pdhi{gap:auto}._3039pdhl{row-gap:var(--zylem-spacing-xxs)}._3039pdho{row-gap:var(--zylem-spacing-xs)}._3039pdhr{row-gap:var(--zylem-spacing-sm)}._3039pdhu{row-gap:var(--zylem-spacing-md)}._3039pdhx{row-gap:var(--zylem-spacing-lg)}._3039pdi0{row-gap:var(--zylem-spacing-xl)}._3039pdi3{row-gap:var(--zylem-spacing-xxl)}._3039pdi6{row-gap:var(--zylem-spacing-xxxl)}._3039pdi9{row-gap:0}._3039pdic{row-gap:auto}._3039pdif{column-gap:var(--zylem-spacing-xxs)}._3039pdii{column-gap:var(--zylem-spacing-xs)}._3039pdil{column-gap:var(--zylem-spacing-sm)}._3039pdio{column-gap:var(--zylem-spacing-md)}._3039pdir{column-gap:var(--zylem-spacing-lg)}._3039pdiu{column-gap:var(--zylem-spacing-xl)}._3039pdix{column-gap:var(--zylem-spacing-xxl)}._3039pdj0{column-gap:var(--zylem-spacing-xxxl)}._3039pdj3{column-gap:0}._3039pdj6{column-gap:auto}._3039pdj9{width:var(--zylem-spacing-xxs)}._3039pdjc{width:var(--zylem-spacing-xs)}._3039pdjf{width:var(--zylem-spacing-sm)}._3039pdji{width:var(--zylem-spacing-md)}._3039pdjl{width:var(--zylem-spacing-lg)}._3039pdjo{width:var(--zylem-spacing-xl)}._3039pdjr{width:var(--zylem-spacing-xxl)}._3039pdju{width:var(--zylem-spacing-xxxl)}._3039pdjx{width:var(--zylem-size-icon)}._3039pdk0{width:var(--zylem-size-icon-sm)}._3039pdk3{width:var(--zylem-size-icon-lg)}._3039pdk6{width:0}._3039pdk9{width:auto}._3039pdkc{width:100%}._3039pdkf{width:100dvh}._3039pdki{height:var(--zylem-spacing-xxs)}._3039pdkl{height:var(--zylem-spacing-xs)}._3039pdko{height:var(--zylem-spacing-sm)}._3039pdkr{height:var(--zylem-spacing-md)}._3039pdku{height:var(--zylem-spacing-lg)}._3039pdkx{height:var(--zylem-spacing-xl)}._3039pdl0{height:var(--zylem-spacing-xxl)}._3039pdl3{height:var(--zylem-spacing-xxxl)}._3039pdl6{height:var(--zylem-size-icon)}._3039pdl9{height:var(--zylem-size-icon-sm)}._3039pdlc{height:var(--zylem-size-icon-lg)}._3039pdlf{height:0}._3039pdli{height:auto}._3039pdll{height:100%}._3039pdlo{height:100dvh}._3039pdlr{min-width:var(--zylem-spacing-xxs)}._3039pdlu{min-width:var(--zylem-spacing-xs)}._3039pdlx{min-width:var(--zylem-spacing-sm)}._3039pdm0{min-width:var(--zylem-spacing-md)}._3039pdm3{min-width:var(--zylem-spacing-lg)}._3039pdm6{min-width:var(--zylem-spacing-xl)}._3039pdm9{min-width:var(--zylem-spacing-xxl)}._3039pdmc{min-width:var(--zylem-spacing-xxxl)}._3039pdmf{min-width:var(--zylem-size-icon)}._3039pdmi{min-width:var(--zylem-size-icon-sm)}._3039pdml{min-width:var(--zylem-size-icon-lg)}._3039pdmo{min-width:0}._3039pdmr{min-width:auto}._3039pdmu{min-width:100%}._3039pdmx{min-width:100dvh}._3039pdn0{min-height:var(--zylem-spacing-xxs)}._3039pdn3{min-height:var(--zylem-spacing-xs)}._3039pdn6{min-height:var(--zylem-spacing-sm)}._3039pdn9{min-height:var(--zylem-spacing-md)}._3039pdnc{min-height:var(--zylem-spacing-lg)}._3039pdnf{min-height:var(--zylem-spacing-xl)}._3039pdni{min-height:var(--zylem-spacing-xxl)}._3039pdnl{min-height:var(--zylem-spacing-xxxl)}._3039pdno{min-height:var(--zylem-size-icon)}._3039pdnr{min-height:var(--zylem-size-icon-sm)}._3039pdnu{min-height:var(--zylem-size-icon-lg)}._3039pdnx{min-height:0}._3039pdo0{min-height:auto}._3039pdo3{min-height:100%}._3039pdo6{min-height:100dvh}._3039pdo9{max-width:var(--zylem-spacing-xxs)}._3039pdoc{max-width:var(--zylem-spacing-xs)}._3039pdof{max-width:var(--zylem-spacing-sm)}._3039pdoi{max-width:var(--zylem-spacing-md)}._3039pdol{max-width:var(--zylem-spacing-lg)}._3039pdoo{max-width:var(--zylem-spacing-xl)}._3039pdor{max-width:var(--zylem-spacing-xxl)}._3039pdou{max-width:var(--zylem-spacing-xxxl)}._3039pdox{max-width:var(--zylem-size-icon)}._3039pdp0{max-width:var(--zylem-size-icon-sm)}._3039pdp3{max-width:var(--zylem-size-icon-lg)}._3039pdp6{max-width:0}._3039pdp9{max-width:auto}._3039pdpc{max-width:100%}._3039pdpf{max-width:100dvh}._3039pdpi{max-height:var(--zylem-spacing-xxs)}._3039pdpl{max-height:var(--zylem-spacing-xs)}._3039pdpo{max-height:var(--zylem-spacing-sm)}._3039pdpr{max-height:var(--zylem-spacing-md)}._3039pdpu{max-height:var(--zylem-spacing-lg)}._3039pdpx{max-height:var(--zylem-spacing-xl)}._3039pdq0{max-height:var(--zylem-spacing-xxl)}._3039pdq3{max-height:var(--zylem-spacing-xxxl)}._3039pdq6{max-height:var(--zylem-size-icon)}._3039pdq9{max-height:var(--zylem-size-icon-sm)}._3039pdqc{max-height:var(--zylem-size-icon-lg)}._3039pdqf{max-height:0}._3039pdqi{max-height:auto}._3039pdql{max-height:100%}._3039pdqo{max-height:100dvh}._3039pdqr{color:var(--zylem-color-primary)}._3039pdqs{color:var(--zylem-color-primary-hover)}._3039pdqt{color:var(--zylem-color-primary-active)}._3039pdqu{color:var(--zylem-color-accent)}._3039pdqv{color:var(--zylem-color-accent-hover)}._3039pdqw{color:var(--zylem-color-accent-active)}._3039pdqx{color:var(--zylem-color-background)}._3039pdqy{color:var(--zylem-color-background-translucent)}._3039pdqz{color:var(--zylem-color-surface)}._3039pdr0{color:var(--zylem-color-surface-hover)}._3039pdr1{color:var(--zylem-color-border)}._3039pdr2{color:var(--zylem-color-active)}._3039pdr3{color:var(--zylem-color-active-hover)}._3039pdr4{color:var(--zylem-color-success-hover)}._3039pdr5{color:var(--zylem-color-text)}._3039pdr6{color:var(--zylem-color-text-secondary)}._3039pdr7{color:var(--zylem-color-console-background)}._3039pdr8{color:var(--zylem-color-console-text)}._3039pdr9{background:var(--zylem-color-primary)}._3039pdra{background:var(--zylem-color-primary-hover)}._3039pdrb{background:var(--zylem-color-primary-active)}._3039pdrc{background:var(--zylem-color-accent)}._3039pdrd{background:var(--zylem-color-accent-hover)}._3039pdre{background:var(--zylem-color-accent-active)}._3039pdrf{background:var(--zylem-color-background)}._3039pdrg{background:var(--zylem-color-background-translucent)}._3039pdrh{background:var(--zylem-color-surface)}._3039pdri{background:var(--zylem-color-surface-hover)}._3039pdrj{background:var(--zylem-color-border)}._3039pdrk{background:var(--zylem-color-active)}._3039pdrl{background:var(--zylem-color-active-hover)}._3039pdrm{background:var(--zylem-color-success-hover)}._3039pdrn{background:var(--zylem-color-text)}._3039pdro{background:var(--zylem-color-text-secondary)}._3039pdrp{background:var(--zylem-color-console-background)}._3039pdrq{background:var(--zylem-color-console-text)}._3039pdrr{background-color:var(--zylem-color-primary)}._3039pdrs{background-color:var(--zylem-color-primary-hover)}._3039pdrt{background-color:var(--zylem-color-primary-active)}._3039pdru{background-color:var(--zylem-color-accent)}._3039pdrv{background-color:var(--zylem-color-accent-hover)}._3039pdrw{background-color:var(--zylem-color-accent-active)}._3039pdrx{background-color:var(--zylem-color-background)}._3039pdry{background-color:var(--zylem-color-background-translucent)}._3039pdrz{background-color:var(--zylem-color-surface)}._3039pds0{background-color:var(--zylem-color-surface-hover)}._3039pds1{background-color:var(--zylem-color-border)}._3039pds2{background-color:var(--zylem-color-active)}._3039pds3{background-color:var(--zylem-color-active-hover)}._3039pds4{background-color:var(--zylem-color-success-hover)}._3039pds5{background-color:var(--zylem-color-text)}._3039pds6{background-color:var(--zylem-color-text-secondary)}._3039pds7{background-color:var(--zylem-color-console-background)}._3039pds8{background-color:var(--zylem-color-console-text)}._3039pds9{border-color:var(--zylem-color-primary)}._3039pdsa{border-color:var(--zylem-color-primary-hover)}._3039pdsb{border-color:var(--zylem-color-primary-active)}._3039pdsc{border-color:var(--zylem-color-accent)}._3039pdsd{border-color:var(--zylem-color-accent-hover)}._3039pdse{border-color:var(--zylem-color-accent-active)}._3039pdsf{border-color:var(--zylem-color-background)}._3039pdsg{border-color:var(--zylem-color-background-translucent)}._3039pdsh{border-color:var(--zylem-color-surface)}._3039pdsi{border-color:var(--zylem-color-surface-hover)}._3039pdsj{border-color:var(--zylem-color-border)}._3039pdsk{border-color:var(--zylem-color-active)}._3039pdsl{border-color:var(--zylem-color-active-hover)}._3039pdsm{border-color:var(--zylem-color-success-hover)}._3039pdsn{border-color:var(--zylem-color-text)}._3039pdso{border-color:var(--zylem-color-text-secondary)}._3039pdsp{border-color:var(--zylem-color-console-background)}._3039pdsq{border-color:var(--zylem-color-console-text)}._3039pdsr{border-radius:0}._3039pdss{border-radius:4px}._3039pdst{border-radius:8px}._3039pdsu{border-radius:var(--zylem-radius)}._3039pdsv{border-radius:16px}._3039pdsw{border-radius:20px}._3039pdsx{border-radius:999px}._3039pdsy{border-width:0}._3039pdsz{border-width:1px}._3039pdt0{border-width:var(--zylem-border)}._3039pdt1{border-width:2px}._3039pdt2{border-style:solid}._3039pdt3{border-style:dashed}._3039pdt4{border-style:dotted}._3039pdt5{border-style:none}._3039pdt6{font-family:var(--zylem-font-family)}._3039pdt7{font-size:var(--zylem-font-size)}._3039pdt8{line-height:1}._3039pdt9{line-height:1.2}._3039pdta{line-height:1.35}._3039pdtb{line-height:1.45}._3039pdtc{line-height:1.5}._3039pdtd{letter-spacing:-.01em}._3039pdte{letter-spacing:0}._3039pdtf{letter-spacing:.04em}._3039pdtg{letter-spacing:.08em}._3039pdth{letter-spacing:.2em}@media screen and (max-width:900px){._3039pd1{display:none}._3039pd4{display:block}._3039pd7{display:inline}._3039pda{display:inline-block}._3039pdd{display:flex}._3039pdg{display:inline-flex}._3039pdj{display:grid}._3039pdm{display:inline-grid}._3039pdp{position:static}._3039pds{position:relative}._3039pdv{position:absolute}._3039pdy{position:fixed}._3039pd11{position:sticky}._3039pd14{flex-direction:row}._3039pd17{flex-direction:row-reverse}._3039pd1a{flex-direction:column}._3039pd1d{flex-direction:column-reverse}._3039pd1g{flex-wrap:wrap}._3039pd1j{flex-wrap:nowrap}._3039pd1m{flex-wrap:wrap-reverse}._3039pd1p{align-items:stretch}._3039pd1s{align-items:flex-start}._3039pd1v{align-items:center}._3039pd1y{align-items:flex-end}._3039pd21{align-items:baseline}._3039pd24{justify-content:flex-start}._3039pd27{justify-content:center}._3039pd2a{justify-content:flex-end}._3039pd2d{justify-content:space-between}._3039pd2g{justify-content:space-around}._3039pd2j{justify-content:space-evenly}._3039pd2m{flex:1}._3039pd2p{flex:none}._3039pd2s{flex:auto}._3039pd2v{text-align:left}._3039pd2y{text-align:center}._3039pd31{text-align:right}._3039pd34{text-align:justify}._3039pd37{text-transform:none}._3039pd3a{text-transform:uppercase}._3039pd3d{text-transform:lowercase}._3039pd3g{text-transform:capitalize}._3039pd3j{font-weight:400}._3039pd3m{font-weight:500}._3039pd3p{font-weight:600}._3039pd3s{font-weight:700}._3039pd3v{font-weight:800}._3039pd3y{box-sizing:border-box}._3039pd41{box-sizing:content-box}._3039pd44{overflow:hidden}._3039pd47{overflow:auto}._3039pd4a{overflow:scroll}._3039pd4d{overflow:visible}._3039pd4g{overflow-x:hidden}._3039pd4j{overflow-x:auto}._3039pd4m{overflow-x:scroll}._3039pd4p{overflow-x:visible}._3039pd4s{overflow-y:hidden}._3039pd4v{overflow-y:auto}._3039pd4y{overflow-y:scroll}._3039pd51{overflow-y:visible}._3039pd54{padding:var(--zylem-spacing-xxs)}._3039pd57{padding:var(--zylem-spacing-xs)}._3039pd5a{padding:var(--zylem-spacing-sm)}._3039pd5d{padding:var(--zylem-spacing-md)}._3039pd5g{padding:var(--zylem-spacing-lg)}._3039pd5j{padding:var(--zylem-spacing-xl)}._3039pd5m{padding:var(--zylem-spacing-xxl)}._3039pd5p{padding:var(--zylem-spacing-xxxl)}._3039pd5s{padding:0}._3039pd5v{padding:auto}._3039pd5y{padding-top:var(--zylem-spacing-xxs)}._3039pd61{padding-top:var(--zylem-spacing-xs)}._3039pd64{padding-top:var(--zylem-spacing-sm)}._3039pd67{padding-top:var(--zylem-spacing-md)}._3039pd6a{padding-top:var(--zylem-spacing-lg)}._3039pd6d{padding-top:var(--zylem-spacing-xl)}._3039pd6g{padding-top:var(--zylem-spacing-xxl)}._3039pd6j{padding-top:var(--zylem-spacing-xxxl)}._3039pd6m{padding-top:0}._3039pd6p{padding-top:auto}._3039pd6s{padding-right:var(--zylem-spacing-xxs)}._3039pd6v{padding-right:var(--zylem-spacing-xs)}._3039pd6y{padding-right:var(--zylem-spacing-sm)}._3039pd71{padding-right:var(--zylem-spacing-md)}._3039pd74{padding-right:var(--zylem-spacing-lg)}._3039pd77{padding-right:var(--zylem-spacing-xl)}._3039pd7a{padding-right:var(--zylem-spacing-xxl)}._3039pd7d{padding-right:var(--zylem-spacing-xxxl)}._3039pd7g{padding-right:0}._3039pd7j{padding-right:auto}._3039pd7m{padding-bottom:var(--zylem-spacing-xxs)}._3039pd7p{padding-bottom:var(--zylem-spacing-xs)}._3039pd7s{padding-bottom:var(--zylem-spacing-sm)}._3039pd7v{padding-bottom:var(--zylem-spacing-md)}._3039pd7y{padding-bottom:var(--zylem-spacing-lg)}._3039pd81{padding-bottom:var(--zylem-spacing-xl)}._3039pd84{padding-bottom:var(--zylem-spacing-xxl)}._3039pd87{padding-bottom:var(--zylem-spacing-xxxl)}._3039pd8a{padding-bottom:0}._3039pd8d{padding-bottom:auto}._3039pd8g{padding-left:var(--zylem-spacing-xxs)}._3039pd8j{padding-left:var(--zylem-spacing-xs)}._3039pd8m{padding-left:var(--zylem-spacing-sm)}._3039pd8p{padding-left:var(--zylem-spacing-md)}._3039pd8s{padding-left:var(--zylem-spacing-lg)}._3039pd8v{padding-left:var(--zylem-spacing-xl)}._3039pd8y{padding-left:var(--zylem-spacing-xxl)}._3039pd91{padding-left:var(--zylem-spacing-xxxl)}._3039pd94{padding-left:0}._3039pd97{padding-left:auto}._3039pd9a{padding-inline:var(--zylem-spacing-xxs)}._3039pd9d{padding-inline:var(--zylem-spacing-xs)}._3039pd9g{padding-inline:var(--zylem-spacing-sm)}._3039pd9j{padding-inline:var(--zylem-spacing-md)}._3039pd9m{padding-inline:var(--zylem-spacing-lg)}._3039pd9p{padding-inline:var(--zylem-spacing-xl)}._3039pd9s{padding-inline:var(--zylem-spacing-xxl)}._3039pd9v{padding-inline:var(--zylem-spacing-xxxl)}._3039pd9y{padding-inline:0}._3039pda1{padding-inline:auto}._3039pda4{padding-block:var(--zylem-spacing-xxs)}._3039pda7{padding-block:var(--zylem-spacing-xs)}._3039pdaa{padding-block:var(--zylem-spacing-sm)}._3039pdad{padding-block:var(--zylem-spacing-md)}._3039pdag{padding-block:var(--zylem-spacing-lg)}._3039pdaj{padding-block:var(--zylem-spacing-xl)}._3039pdam{padding-block:var(--zylem-spacing-xxl)}._3039pdap{padding-block:var(--zylem-spacing-xxxl)}._3039pdas{padding-block:0}._3039pdav{padding-block:auto}._3039pday{margin:var(--zylem-spacing-xxs)}._3039pdb1{margin:var(--zylem-spacing-xs)}._3039pdb4{margin:var(--zylem-spacing-sm)}._3039pdb7{margin:var(--zylem-spacing-md)}._3039pdba{margin:var(--zylem-spacing-lg)}._3039pdbd{margin:var(--zylem-spacing-xl)}._3039pdbg{margin:var(--zylem-spacing-xxl)}._3039pdbj{margin:var(--zylem-spacing-xxxl)}._3039pdbm{margin:0}._3039pdbp{margin:auto}._3039pdbs{margin-top:var(--zylem-spacing-xxs)}._3039pdbv{margin-top:var(--zylem-spacing-xs)}._3039pdby{margin-top:var(--zylem-spacing-sm)}._3039pdc1{margin-top:var(--zylem-spacing-md)}._3039pdc4{margin-top:var(--zylem-spacing-lg)}._3039pdc7{margin-top:var(--zylem-spacing-xl)}._3039pdca{margin-top:var(--zylem-spacing-xxl)}._3039pdcd{margin-top:var(--zylem-spacing-xxxl)}._3039pdcg{margin-top:0}._3039pdcj{margin-top:auto}._3039pdcm{margin-right:var(--zylem-spacing-xxs)}._3039pdcp{margin-right:var(--zylem-spacing-xs)}._3039pdcs{margin-right:var(--zylem-spacing-sm)}._3039pdcv{margin-right:var(--zylem-spacing-md)}._3039pdcy{margin-right:var(--zylem-spacing-lg)}._3039pdd1{margin-right:var(--zylem-spacing-xl)}._3039pdd4{margin-right:var(--zylem-spacing-xxl)}._3039pdd7{margin-right:var(--zylem-spacing-xxxl)}._3039pdda{margin-right:0}._3039pddd{margin-right:auto}._3039pddg{margin-bottom:var(--zylem-spacing-xxs)}._3039pddj{margin-bottom:var(--zylem-spacing-xs)}._3039pddm{margin-bottom:var(--zylem-spacing-sm)}._3039pddp{margin-bottom:var(--zylem-spacing-md)}._3039pdds{margin-bottom:var(--zylem-spacing-lg)}._3039pddv{margin-bottom:var(--zylem-spacing-xl)}._3039pddy{margin-bottom:var(--zylem-spacing-xxl)}._3039pde1{margin-bottom:var(--zylem-spacing-xxxl)}._3039pde4{margin-bottom:0}._3039pde7{margin-bottom:auto}._3039pdea{margin-left:var(--zylem-spacing-xxs)}._3039pded{margin-left:var(--zylem-spacing-xs)}._3039pdeg{margin-left:var(--zylem-spacing-sm)}._3039pdej{margin-left:var(--zylem-spacing-md)}._3039pdem{margin-left:var(--zylem-spacing-lg)}._3039pdep{margin-left:var(--zylem-spacing-xl)}._3039pdes{margin-left:var(--zylem-spacing-xxl)}._3039pdev{margin-left:var(--zylem-spacing-xxxl)}._3039pdey{margin-left:0}._3039pdf1{margin-left:auto}._3039pdf4{margin-inline:var(--zylem-spacing-xxs)}._3039pdf7{margin-inline:var(--zylem-spacing-xs)}._3039pdfa{margin-inline:var(--zylem-spacing-sm)}._3039pdfd{margin-inline:var(--zylem-spacing-md)}._3039pdfg{margin-inline:var(--zylem-spacing-lg)}._3039pdfj{margin-inline:var(--zylem-spacing-xl)}._3039pdfm{margin-inline:var(--zylem-spacing-xxl)}._3039pdfp{margin-inline:var(--zylem-spacing-xxxl)}._3039pdfs{margin-inline:0}._3039pdfv{margin-inline:auto}._3039pdfy{margin-block:var(--zylem-spacing-xxs)}._3039pdg1{margin-block:var(--zylem-spacing-xs)}._3039pdg4{margin-block:var(--zylem-spacing-sm)}._3039pdg7{margin-block:var(--zylem-spacing-md)}._3039pdga{margin-block:var(--zylem-spacing-lg)}._3039pdgd{margin-block:var(--zylem-spacing-xl)}._3039pdgg{margin-block:var(--zylem-spacing-xxl)}._3039pdgj{margin-block:var(--zylem-spacing-xxxl)}._3039pdgm{margin-block:0}._3039pdgp{margin-block:auto}._3039pdgs{gap:var(--zylem-spacing-xxs)}._3039pdgv{gap:var(--zylem-spacing-xs)}._3039pdgy{gap:var(--zylem-spacing-sm)}._3039pdh1{gap:var(--zylem-spacing-md)}._3039pdh4{gap:var(--zylem-spacing-lg)}._3039pdh7{gap:var(--zylem-spacing-xl)}._3039pdha{gap:var(--zylem-spacing-xxl)}._3039pdhd{gap:var(--zylem-spacing-xxxl)}._3039pdhg{gap:0}._3039pdhj{gap:auto}._3039pdhm{row-gap:var(--zylem-spacing-xxs)}._3039pdhp{row-gap:var(--zylem-spacing-xs)}._3039pdhs{row-gap:var(--zylem-spacing-sm)}._3039pdhv{row-gap:var(--zylem-spacing-md)}._3039pdhy{row-gap:var(--zylem-spacing-lg)}._3039pdi1{row-gap:var(--zylem-spacing-xl)}._3039pdi4{row-gap:var(--zylem-spacing-xxl)}._3039pdi7{row-gap:var(--zylem-spacing-xxxl)}._3039pdia{row-gap:0}._3039pdid{row-gap:auto}._3039pdig{column-gap:var(--zylem-spacing-xxs)}._3039pdij{column-gap:var(--zylem-spacing-xs)}._3039pdim{column-gap:var(--zylem-spacing-sm)}._3039pdip{column-gap:var(--zylem-spacing-md)}._3039pdis{column-gap:var(--zylem-spacing-lg)}._3039pdiv{column-gap:var(--zylem-spacing-xl)}._3039pdiy{column-gap:var(--zylem-spacing-xxl)}._3039pdj1{column-gap:var(--zylem-spacing-xxxl)}._3039pdj4{column-gap:0}._3039pdj7{column-gap:auto}._3039pdja{width:var(--zylem-spacing-xxs)}._3039pdjd{width:var(--zylem-spacing-xs)}._3039pdjg{width:var(--zylem-spacing-sm)}._3039pdjj{width:var(--zylem-spacing-md)}._3039pdjm{width:var(--zylem-spacing-lg)}._3039pdjp{width:var(--zylem-spacing-xl)}._3039pdjs{width:var(--zylem-spacing-xxl)}._3039pdjv{width:var(--zylem-spacing-xxxl)}._3039pdjy{width:var(--zylem-size-icon)}._3039pdk1{width:var(--zylem-size-icon-sm)}._3039pdk4{width:var(--zylem-size-icon-lg)}._3039pdk7{width:0}._3039pdka{width:auto}._3039pdkd{width:100%}._3039pdkg{width:100dvh}._3039pdkj{height:var(--zylem-spacing-xxs)}._3039pdkm{height:var(--zylem-spacing-xs)}._3039pdkp{height:var(--zylem-spacing-sm)}._3039pdks{height:var(--zylem-spacing-md)}._3039pdkv{height:var(--zylem-spacing-lg)}._3039pdky{height:var(--zylem-spacing-xl)}._3039pdl1{height:var(--zylem-spacing-xxl)}._3039pdl4{height:var(--zylem-spacing-xxxl)}._3039pdl7{height:var(--zylem-size-icon)}._3039pdla{height:var(--zylem-size-icon-sm)}._3039pdld{height:var(--zylem-size-icon-lg)}._3039pdlg{height:0}._3039pdlj{height:auto}._3039pdlm{height:100%}._3039pdlp{height:100dvh}._3039pdls{min-width:var(--zylem-spacing-xxs)}._3039pdlv{min-width:var(--zylem-spacing-xs)}._3039pdly{min-width:var(--zylem-spacing-sm)}._3039pdm1{min-width:var(--zylem-spacing-md)}._3039pdm4{min-width:var(--zylem-spacing-lg)}._3039pdm7{min-width:var(--zylem-spacing-xl)}._3039pdma{min-width:var(--zylem-spacing-xxl)}._3039pdmd{min-width:var(--zylem-spacing-xxxl)}._3039pdmg{min-width:var(--zylem-size-icon)}._3039pdmj{min-width:var(--zylem-size-icon-sm)}._3039pdmm{min-width:var(--zylem-size-icon-lg)}._3039pdmp{min-width:0}._3039pdms{min-width:auto}._3039pdmv{min-width:100%}._3039pdmy{min-width:100dvh}._3039pdn1{min-height:var(--zylem-spacing-xxs)}._3039pdn4{min-height:var(--zylem-spacing-xs)}._3039pdn7{min-height:var(--zylem-spacing-sm)}._3039pdna{min-height:var(--zylem-spacing-md)}._3039pdnd{min-height:var(--zylem-spacing-lg)}._3039pdng{min-height:var(--zylem-spacing-xl)}._3039pdnj{min-height:var(--zylem-spacing-xxl)}._3039pdnm{min-height:var(--zylem-spacing-xxxl)}._3039pdnp{min-height:var(--zylem-size-icon)}._3039pdns{min-height:var(--zylem-size-icon-sm)}._3039pdnv{min-height:var(--zylem-size-icon-lg)}._3039pdny{min-height:0}._3039pdo1{min-height:auto}._3039pdo4{min-height:100%}._3039pdo7{min-height:100dvh}._3039pdoa{max-width:var(--zylem-spacing-xxs)}._3039pdod{max-width:var(--zylem-spacing-xs)}._3039pdog{max-width:var(--zylem-spacing-sm)}._3039pdoj{max-width:var(--zylem-spacing-md)}._3039pdom{max-width:var(--zylem-spacing-lg)}._3039pdop{max-width:var(--zylem-spacing-xl)}._3039pdos{max-width:var(--zylem-spacing-xxl)}._3039pdov{max-width:var(--zylem-spacing-xxxl)}._3039pdoy{max-width:var(--zylem-size-icon)}._3039pdp1{max-width:var(--zylem-size-icon-sm)}._3039pdp4{max-width:var(--zylem-size-icon-lg)}._3039pdp7{max-width:0}._3039pdpa{max-width:auto}._3039pdpd{max-width:100%}._3039pdpg{max-width:100dvh}._3039pdpj{max-height:var(--zylem-spacing-xxs)}._3039pdpm{max-height:var(--zylem-spacing-xs)}._3039pdpp{max-height:var(--zylem-spacing-sm)}._3039pdps{max-height:var(--zylem-spacing-md)}._3039pdpv{max-height:var(--zylem-spacing-lg)}._3039pdpy{max-height:var(--zylem-spacing-xl)}._3039pdq1{max-height:var(--zylem-spacing-xxl)}._3039pdq4{max-height:var(--zylem-spacing-xxxl)}._3039pdq7{max-height:var(--zylem-size-icon)}._3039pdqa{max-height:var(--zylem-size-icon-sm)}._3039pdqd{max-height:var(--zylem-size-icon-lg)}._3039pdqg{max-height:0}._3039pdqj{max-height:auto}._3039pdqm{max-height:100%}._3039pdqp{max-height:100dvh}}@media screen and (max-width:720px){._3039pd2{display:none}._3039pd5{display:block}._3039pd8{display:inline}._3039pdb{display:inline-block}._3039pde{display:flex}._3039pdh{display:inline-flex}._3039pdk{display:grid}._3039pdn{display:inline-grid}._3039pdq{position:static}._3039pdt{position:relative}._3039pdw{position:absolute}._3039pdz{position:fixed}._3039pd12{position:sticky}._3039pd15{flex-direction:row}._3039pd18{flex-direction:row-reverse}._3039pd1b{flex-direction:column}._3039pd1e{flex-direction:column-reverse}._3039pd1h{flex-wrap:wrap}._3039pd1k{flex-wrap:nowrap}._3039pd1n{flex-wrap:wrap-reverse}._3039pd1q{align-items:stretch}._3039pd1t{align-items:flex-start}._3039pd1w{align-items:center}._3039pd1z{align-items:flex-end}._3039pd22{align-items:baseline}._3039pd25{justify-content:flex-start}._3039pd28{justify-content:center}._3039pd2b{justify-content:flex-end}._3039pd2e{justify-content:space-between}._3039pd2h{justify-content:space-around}._3039pd2k{justify-content:space-evenly}._3039pd2n{flex:1}._3039pd2q{flex:none}._3039pd2t{flex:auto}._3039pd2w{text-align:left}._3039pd2z{text-align:center}._3039pd32{text-align:right}._3039pd35{text-align:justify}._3039pd38{text-transform:none}._3039pd3b{text-transform:uppercase}._3039pd3e{text-transform:lowercase}._3039pd3h{text-transform:capitalize}._3039pd3k{font-weight:400}._3039pd3n{font-weight:500}._3039pd3q{font-weight:600}._3039pd3t{font-weight:700}._3039pd3w{font-weight:800}._3039pd3z{box-sizing:border-box}._3039pd42{box-sizing:content-box}._3039pd45{overflow:hidden}._3039pd48{overflow:auto}._3039pd4b{overflow:scroll}._3039pd4e{overflow:visible}._3039pd4h{overflow-x:hidden}._3039pd4k{overflow-x:auto}._3039pd4n{overflow-x:scroll}._3039pd4q{overflow-x:visible}._3039pd4t{overflow-y:hidden}._3039pd4w{overflow-y:auto}._3039pd4z{overflow-y:scroll}._3039pd52{overflow-y:visible}._3039pd55{padding:var(--zylem-spacing-xxs)}._3039pd58{padding:var(--zylem-spacing-xs)}._3039pd5b{padding:var(--zylem-spacing-sm)}._3039pd5e{padding:var(--zylem-spacing-md)}._3039pd5h{padding:var(--zylem-spacing-lg)}._3039pd5k{padding:var(--zylem-spacing-xl)}._3039pd5n{padding:var(--zylem-spacing-xxl)}._3039pd5q{padding:var(--zylem-spacing-xxxl)}._3039pd5t{padding:0}._3039pd5w{padding:auto}._3039pd5z{padding-top:var(--zylem-spacing-xxs)}._3039pd62{padding-top:var(--zylem-spacing-xs)}._3039pd65{padding-top:var(--zylem-spacing-sm)}._3039pd68{padding-top:var(--zylem-spacing-md)}._3039pd6b{padding-top:var(--zylem-spacing-lg)}._3039pd6e{padding-top:var(--zylem-spacing-xl)}._3039pd6h{padding-top:var(--zylem-spacing-xxl)}._3039pd6k{padding-top:var(--zylem-spacing-xxxl)}._3039pd6n{padding-top:0}._3039pd6q{padding-top:auto}._3039pd6t{padding-right:var(--zylem-spacing-xxs)}._3039pd6w{padding-right:var(--zylem-spacing-xs)}._3039pd6z{padding-right:var(--zylem-spacing-sm)}._3039pd72{padding-right:var(--zylem-spacing-md)}._3039pd75{padding-right:var(--zylem-spacing-lg)}._3039pd78{padding-right:var(--zylem-spacing-xl)}._3039pd7b{padding-right:var(--zylem-spacing-xxl)}._3039pd7e{padding-right:var(--zylem-spacing-xxxl)}._3039pd7h{padding-right:0}._3039pd7k{padding-right:auto}._3039pd7n{padding-bottom:var(--zylem-spacing-xxs)}._3039pd7q{padding-bottom:var(--zylem-spacing-xs)}._3039pd7t{padding-bottom:var(--zylem-spacing-sm)}._3039pd7w{padding-bottom:var(--zylem-spacing-md)}._3039pd7z{padding-bottom:var(--zylem-spacing-lg)}._3039pd82{padding-bottom:var(--zylem-spacing-xl)}._3039pd85{padding-bottom:var(--zylem-spacing-xxl)}._3039pd88{padding-bottom:var(--zylem-spacing-xxxl)}._3039pd8b{padding-bottom:0}._3039pd8e{padding-bottom:auto}._3039pd8h{padding-left:var(--zylem-spacing-xxs)}._3039pd8k{padding-left:var(--zylem-spacing-xs)}._3039pd8n{padding-left:var(--zylem-spacing-sm)}._3039pd8q{padding-left:var(--zylem-spacing-md)}._3039pd8t{padding-left:var(--zylem-spacing-lg)}._3039pd8w{padding-left:var(--zylem-spacing-xl)}._3039pd8z{padding-left:var(--zylem-spacing-xxl)}._3039pd92{padding-left:var(--zylem-spacing-xxxl)}._3039pd95{padding-left:0}._3039pd98{padding-left:auto}._3039pd9b{padding-inline:var(--zylem-spacing-xxs)}._3039pd9e{padding-inline:var(--zylem-spacing-xs)}._3039pd9h{padding-inline:var(--zylem-spacing-sm)}._3039pd9k{padding-inline:var(--zylem-spacing-md)}._3039pd9n{padding-inline:var(--zylem-spacing-lg)}._3039pd9q{padding-inline:var(--zylem-spacing-xl)}._3039pd9t{padding-inline:var(--zylem-spacing-xxl)}._3039pd9w{padding-inline:var(--zylem-spacing-xxxl)}._3039pd9z{padding-inline:0}._3039pda2{padding-inline:auto}._3039pda5{padding-block:var(--zylem-spacing-xxs)}._3039pda8{padding-block:var(--zylem-spacing-xs)}._3039pdab{padding-block:var(--zylem-spacing-sm)}._3039pdae{padding-block:var(--zylem-spacing-md)}._3039pdah{padding-block:var(--zylem-spacing-lg)}._3039pdak{padding-block:var(--zylem-spacing-xl)}._3039pdan{padding-block:var(--zylem-spacing-xxl)}._3039pdaq{padding-block:var(--zylem-spacing-xxxl)}._3039pdat{padding-block:0}._3039pdaw{padding-block:auto}._3039pdaz{margin:var(--zylem-spacing-xxs)}._3039pdb2{margin:var(--zylem-spacing-xs)}._3039pdb5{margin:var(--zylem-spacing-sm)}._3039pdb8{margin:var(--zylem-spacing-md)}._3039pdbb{margin:var(--zylem-spacing-lg)}._3039pdbe{margin:var(--zylem-spacing-xl)}._3039pdbh{margin:var(--zylem-spacing-xxl)}._3039pdbk{margin:var(--zylem-spacing-xxxl)}._3039pdbn{margin:0}._3039pdbq{margin:auto}._3039pdbt{margin-top:var(--zylem-spacing-xxs)}._3039pdbw{margin-top:var(--zylem-spacing-xs)}._3039pdbz{margin-top:var(--zylem-spacing-sm)}._3039pdc2{margin-top:var(--zylem-spacing-md)}._3039pdc5{margin-top:var(--zylem-spacing-lg)}._3039pdc8{margin-top:var(--zylem-spacing-xl)}._3039pdcb{margin-top:var(--zylem-spacing-xxl)}._3039pdce{margin-top:var(--zylem-spacing-xxxl)}._3039pdch{margin-top:0}._3039pdck{margin-top:auto}._3039pdcn{margin-right:var(--zylem-spacing-xxs)}._3039pdcq{margin-right:var(--zylem-spacing-xs)}._3039pdct{margin-right:var(--zylem-spacing-sm)}._3039pdcw{margin-right:var(--zylem-spacing-md)}._3039pdcz{margin-right:var(--zylem-spacing-lg)}._3039pdd2{margin-right:var(--zylem-spacing-xl)}._3039pdd5{margin-right:var(--zylem-spacing-xxl)}._3039pdd8{margin-right:var(--zylem-spacing-xxxl)}._3039pddb{margin-right:0}._3039pdde{margin-right:auto}._3039pddh{margin-bottom:var(--zylem-spacing-xxs)}._3039pddk{margin-bottom:var(--zylem-spacing-xs)}._3039pddn{margin-bottom:var(--zylem-spacing-sm)}._3039pddq{margin-bottom:var(--zylem-spacing-md)}._3039pddt{margin-bottom:var(--zylem-spacing-lg)}._3039pddw{margin-bottom:var(--zylem-spacing-xl)}._3039pddz{margin-bottom:var(--zylem-spacing-xxl)}._3039pde2{margin-bottom:var(--zylem-spacing-xxxl)}._3039pde5{margin-bottom:0}._3039pde8{margin-bottom:auto}._3039pdeb{margin-left:var(--zylem-spacing-xxs)}._3039pdee{margin-left:var(--zylem-spacing-xs)}._3039pdeh{margin-left:var(--zylem-spacing-sm)}._3039pdek{margin-left:var(--zylem-spacing-md)}._3039pden{margin-left:var(--zylem-spacing-lg)}._3039pdeq{margin-left:var(--zylem-spacing-xl)}._3039pdet{margin-left:var(--zylem-spacing-xxl)}._3039pdew{margin-left:var(--zylem-spacing-xxxl)}._3039pdez{margin-left:0}._3039pdf2{margin-left:auto}._3039pdf5{margin-inline:var(--zylem-spacing-xxs)}._3039pdf8{margin-inline:var(--zylem-spacing-xs)}._3039pdfb{margin-inline:var(--zylem-spacing-sm)}._3039pdfe{margin-inline:var(--zylem-spacing-md)}._3039pdfh{margin-inline:var(--zylem-spacing-lg)}._3039pdfk{margin-inline:var(--zylem-spacing-xl)}._3039pdfn{margin-inline:var(--zylem-spacing-xxl)}._3039pdfq{margin-inline:var(--zylem-spacing-xxxl)}._3039pdft{margin-inline:0}._3039pdfw{margin-inline:auto}._3039pdfz{margin-block:var(--zylem-spacing-xxs)}._3039pdg2{margin-block:var(--zylem-spacing-xs)}._3039pdg5{margin-block:var(--zylem-spacing-sm)}._3039pdg8{margin-block:var(--zylem-spacing-md)}._3039pdgb{margin-block:var(--zylem-spacing-lg)}._3039pdge{margin-block:var(--zylem-spacing-xl)}._3039pdgh{margin-block:var(--zylem-spacing-xxl)}._3039pdgk{margin-block:var(--zylem-spacing-xxxl)}._3039pdgn{margin-block:0}._3039pdgq{margin-block:auto}._3039pdgt{gap:var(--zylem-spacing-xxs)}._3039pdgw{gap:var(--zylem-spacing-xs)}._3039pdgz{gap:var(--zylem-spacing-sm)}._3039pdh2{gap:var(--zylem-spacing-md)}._3039pdh5{gap:var(--zylem-spacing-lg)}._3039pdh8{gap:var(--zylem-spacing-xl)}._3039pdhb{gap:var(--zylem-spacing-xxl)}._3039pdhe{gap:var(--zylem-spacing-xxxl)}._3039pdhh{gap:0}._3039pdhk{gap:auto}._3039pdhn{row-gap:var(--zylem-spacing-xxs)}._3039pdhq{row-gap:var(--zylem-spacing-xs)}._3039pdht{row-gap:var(--zylem-spacing-sm)}._3039pdhw{row-gap:var(--zylem-spacing-md)}._3039pdhz{row-gap:var(--zylem-spacing-lg)}._3039pdi2{row-gap:var(--zylem-spacing-xl)}._3039pdi5{row-gap:var(--zylem-spacing-xxl)}._3039pdi8{row-gap:var(--zylem-spacing-xxxl)}._3039pdib{row-gap:0}._3039pdie{row-gap:auto}._3039pdih{column-gap:var(--zylem-spacing-xxs)}._3039pdik{column-gap:var(--zylem-spacing-xs)}._3039pdin{column-gap:var(--zylem-spacing-sm)}._3039pdiq{column-gap:var(--zylem-spacing-md)}._3039pdit{column-gap:var(--zylem-spacing-lg)}._3039pdiw{column-gap:var(--zylem-spacing-xl)}._3039pdiz{column-gap:var(--zylem-spacing-xxl)}._3039pdj2{column-gap:var(--zylem-spacing-xxxl)}._3039pdj5{column-gap:0}._3039pdj8{column-gap:auto}._3039pdjb{width:var(--zylem-spacing-xxs)}._3039pdje{width:var(--zylem-spacing-xs)}._3039pdjh{width:var(--zylem-spacing-sm)}._3039pdjk{width:var(--zylem-spacing-md)}._3039pdjn{width:var(--zylem-spacing-lg)}._3039pdjq{width:var(--zylem-spacing-xl)}._3039pdjt{width:var(--zylem-spacing-xxl)}._3039pdjw{width:var(--zylem-spacing-xxxl)}._3039pdjz{width:var(--zylem-size-icon)}._3039pdk2{width:var(--zylem-size-icon-sm)}._3039pdk5{width:var(--zylem-size-icon-lg)}._3039pdk8{width:0}._3039pdkb{width:auto}._3039pdke{width:100%}._3039pdkh{width:100dvh}._3039pdkk{height:var(--zylem-spacing-xxs)}._3039pdkn{height:var(--zylem-spacing-xs)}._3039pdkq{height:var(--zylem-spacing-sm)}._3039pdkt{height:var(--zylem-spacing-md)}._3039pdkw{height:var(--zylem-spacing-lg)}._3039pdkz{height:var(--zylem-spacing-xl)}._3039pdl2{height:var(--zylem-spacing-xxl)}._3039pdl5{height:var(--zylem-spacing-xxxl)}._3039pdl8{height:var(--zylem-size-icon)}._3039pdlb{height:var(--zylem-size-icon-sm)}._3039pdle{height:var(--zylem-size-icon-lg)}._3039pdlh{height:0}._3039pdlk{height:auto}._3039pdln{height:100%}._3039pdlq{height:100dvh}._3039pdlt{min-width:var(--zylem-spacing-xxs)}._3039pdlw{min-width:var(--zylem-spacing-xs)}._3039pdlz{min-width:var(--zylem-spacing-sm)}._3039pdm2{min-width:var(--zylem-spacing-md)}._3039pdm5{min-width:var(--zylem-spacing-lg)}._3039pdm8{min-width:var(--zylem-spacing-xl)}._3039pdmb{min-width:var(--zylem-spacing-xxl)}._3039pdme{min-width:var(--zylem-spacing-xxxl)}._3039pdmh{min-width:var(--zylem-size-icon)}._3039pdmk{min-width:var(--zylem-size-icon-sm)}._3039pdmn{min-width:var(--zylem-size-icon-lg)}._3039pdmq{min-width:0}._3039pdmt{min-width:auto}._3039pdmw{min-width:100%}._3039pdmz{min-width:100dvh}._3039pdn2{min-height:var(--zylem-spacing-xxs)}._3039pdn5{min-height:var(--zylem-spacing-xs)}._3039pdn8{min-height:var(--zylem-spacing-sm)}._3039pdnb{min-height:var(--zylem-spacing-md)}._3039pdne{min-height:var(--zylem-spacing-lg)}._3039pdnh{min-height:var(--zylem-spacing-xl)}._3039pdnk{min-height:var(--zylem-spacing-xxl)}._3039pdnn{min-height:var(--zylem-spacing-xxxl)}._3039pdnq{min-height:var(--zylem-size-icon)}._3039pdnt{min-height:var(--zylem-size-icon-sm)}._3039pdnw{min-height:var(--zylem-size-icon-lg)}._3039pdnz{min-height:0}._3039pdo2{min-height:auto}._3039pdo5{min-height:100%}._3039pdo8{min-height:100dvh}._3039pdob{max-width:var(--zylem-spacing-xxs)}._3039pdoe{max-width:var(--zylem-spacing-xs)}._3039pdoh{max-width:var(--zylem-spacing-sm)}._3039pdok{max-width:var(--zylem-spacing-md)}._3039pdon{max-width:var(--zylem-spacing-lg)}._3039pdoq{max-width:var(--zylem-spacing-xl)}._3039pdot{max-width:var(--zylem-spacing-xxl)}._3039pdow{max-width:var(--zylem-spacing-xxxl)}._3039pdoz{max-width:var(--zylem-size-icon)}._3039pdp2{max-width:var(--zylem-size-icon-sm)}._3039pdp5{max-width:var(--zylem-size-icon-lg)}._3039pdp8{max-width:0}._3039pdpb{max-width:auto}._3039pdpe{max-width:100%}._3039pdph{max-width:100dvh}._3039pdpk{max-height:var(--zylem-spacing-xxs)}._3039pdpn{max-height:var(--zylem-spacing-xs)}._3039pdpq{max-height:var(--zylem-spacing-sm)}._3039pdpt{max-height:var(--zylem-spacing-md)}._3039pdpw{max-height:var(--zylem-spacing-lg)}._3039pdpz{max-height:var(--zylem-spacing-xl)}._3039pdq2{max-height:var(--zylem-spacing-xxl)}._3039pdq5{max-height:var(--zylem-spacing-xxxl)}._3039pdq8{max-height:var(--zylem-size-icon)}._3039pdqb{max-height:var(--zylem-size-icon-sm)}._3039pdqe{max-height:var(--zylem-size-icon-lg)}._3039pdqh{max-height:0}._3039pdqk{max-height:auto}._3039pdqn{max-height:100%}._3039pdqq{max-height:100dvh}}
package/dist/index.d.ts ADDED
@@ -0,0 +1,350 @@
1
+ /**
2
+ * Typed `vars` contract — leaves resolve to `var(--zylem-*)` strings. Use
3
+ * inside `style()` / `globalStyle()` / `sprinkles()` to consume the design
4
+ * tokens with autocomplete and type safety.
5
+ */
6
+ declare const vars: {
7
+ readonly colors: {
8
+ readonly primary: `var(--${string})`;
9
+ readonly primaryHover: `var(--${string})`;
10
+ readonly primaryActive: `var(--${string})`;
11
+ readonly accent: `var(--${string})`;
12
+ readonly accentHover: `var(--${string})`;
13
+ readonly accentActive: `var(--${string})`;
14
+ readonly background: `var(--${string})`;
15
+ readonly backgroundTranslucent: `var(--${string})`;
16
+ readonly surface: `var(--${string})`;
17
+ readonly surfaceHover: `var(--${string})`;
18
+ readonly border: `var(--${string})`;
19
+ readonly active: `var(--${string})`;
20
+ readonly activeHover: `var(--${string})`;
21
+ readonly successHover: `var(--${string})`;
22
+ readonly text: `var(--${string})`;
23
+ readonly textSecondary: `var(--${string})`;
24
+ readonly consoleBackground: `var(--${string})`;
25
+ readonly consoleText: `var(--${string})`;
26
+ };
27
+ readonly spacing: {
28
+ readonly xxs: `var(--${string})`;
29
+ readonly xs: `var(--${string})`;
30
+ readonly sm: `var(--${string})`;
31
+ readonly md: `var(--${string})`;
32
+ readonly lg: `var(--${string})`;
33
+ readonly xl: `var(--${string})`;
34
+ readonly xxl: `var(--${string})`;
35
+ readonly xxxl: `var(--${string})`;
36
+ };
37
+ readonly sizes: {
38
+ readonly icon: `var(--${string})`;
39
+ readonly iconSm: `var(--${string})`;
40
+ readonly iconLg: `var(--${string})`;
41
+ };
42
+ readonly typography: {
43
+ readonly fontFamily: `var(--${string})`;
44
+ readonly fontSize: `var(--${string})`;
45
+ };
46
+ readonly borders: {
47
+ readonly radius: `var(--${string})`;
48
+ readonly width: `var(--${string})`;
49
+ };
50
+ };
51
+ /** Token values as a plain readonly object, exported for downstream tooling. */
52
+ declare const tokenValues: {
53
+ readonly colors: {
54
+ readonly primary: "#61A6E8";
55
+ readonly primaryHover: "#3B8AD8";
56
+ readonly primaryActive: "#0C6EB8";
57
+ readonly accent: "#E64534";
58
+ readonly accentHover: "#C93A2C";
59
+ readonly accentActive: "#A82F24";
60
+ readonly background: "#11151C";
61
+ readonly backgroundTranslucent: "rgba(10, 20, 30, 0.46)";
62
+ readonly surface: "#1A1F27";
63
+ readonly surfaceHover: "#222831";
64
+ readonly border: "#2D3643";
65
+ readonly active: "rgba(20, 255, 60, 0.7)";
66
+ readonly activeHover: "rgba(20, 255, 60, 0.4)";
67
+ readonly successHover: "#2a6734b3";
68
+ readonly text: "#E6EBEF";
69
+ readonly textSecondary: "#88929E";
70
+ readonly consoleBackground: "rgba(20, 40, 60, 0.25)";
71
+ readonly consoleText: "#61A6E8";
72
+ };
73
+ readonly spacing: {
74
+ readonly xxs: "0.125rem";
75
+ readonly xs: "0.25rem";
76
+ readonly sm: "0.5rem";
77
+ readonly md: "0.75rem";
78
+ readonly lg: "1rem";
79
+ readonly xl: "1.5rem";
80
+ readonly xxl: "2rem";
81
+ readonly xxxl: "3rem";
82
+ };
83
+ readonly sizes: {
84
+ readonly icon: "28px";
85
+ readonly iconSm: "16px";
86
+ readonly iconLg: "96px";
87
+ };
88
+ readonly typography: {
89
+ readonly fontFamily: "'Exo 2', sans-serif";
90
+ readonly fontSize: "14px";
91
+ };
92
+ readonly borders: {
93
+ readonly radius: "12px";
94
+ readonly width: "1.5px";
95
+ };
96
+ };
97
+
98
+ /**
99
+ * Atomic-utility function generated from the Zylem token system.
100
+ *
101
+ * Usage:
102
+ * ```ts
103
+ * import { sprinkles } from '@zylem/ui';
104
+ *
105
+ * const card = style([
106
+ * sprinkles({ padding: 'lg', borderRadius: 'default', color: 'text' }),
107
+ * ]);
108
+ * ```
109
+ */
110
+ declare const sprinkles: ((props: {
111
+ display?: "flex" | "grid" | "none" | "block" | "inline" | "inline-block" | "inline-flex" | "inline-grid" | {
112
+ readonly desktop?: "flex" | "grid" | "none" | "block" | "inline" | "inline-block" | "inline-flex" | "inline-grid" | undefined;
113
+ readonly tablet?: "flex" | "grid" | "none" | "block" | "inline" | "inline-block" | "inline-flex" | "inline-grid" | undefined;
114
+ readonly mobile?: "flex" | "grid" | "none" | "block" | "inline" | "inline-block" | "inline-flex" | "inline-grid" | undefined;
115
+ } | undefined;
116
+ position?: "fixed" | "absolute" | "relative" | "static" | "sticky" | {
117
+ readonly desktop?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
118
+ readonly tablet?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
119
+ readonly mobile?: "fixed" | "absolute" | "relative" | "static" | "sticky" | undefined;
120
+ } | undefined;
121
+ flexDirection?: "column" | "column-reverse" | "row" | "row-reverse" | {
122
+ readonly desktop?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
123
+ readonly tablet?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
124
+ readonly mobile?: "column" | "column-reverse" | "row" | "row-reverse" | undefined;
125
+ } | undefined;
126
+ flexWrap?: "nowrap" | "wrap" | "wrap-reverse" | {
127
+ readonly desktop?: "nowrap" | "wrap" | "wrap-reverse" | undefined;
128
+ readonly tablet?: "nowrap" | "wrap" | "wrap-reverse" | undefined;
129
+ readonly mobile?: "nowrap" | "wrap" | "wrap-reverse" | undefined;
130
+ } | undefined;
131
+ alignItems?: "stretch" | "center" | "flex-end" | "flex-start" | "baseline" | {
132
+ readonly desktop?: "stretch" | "center" | "flex-end" | "flex-start" | "baseline" | undefined;
133
+ readonly tablet?: "stretch" | "center" | "flex-end" | "flex-start" | "baseline" | undefined;
134
+ readonly mobile?: "stretch" | "center" | "flex-end" | "flex-start" | "baseline" | undefined;
135
+ } | undefined;
136
+ justifyContent?: "space-around" | "space-between" | "space-evenly" | "center" | "flex-end" | "flex-start" | {
137
+ readonly desktop?: "space-around" | "space-between" | "space-evenly" | "center" | "flex-end" | "flex-start" | undefined;
138
+ readonly tablet?: "space-around" | "space-between" | "space-evenly" | "center" | "flex-end" | "flex-start" | undefined;
139
+ readonly mobile?: "space-around" | "space-between" | "space-evenly" | "center" | "flex-end" | "flex-start" | undefined;
140
+ } | undefined;
141
+ flex?: "auto" | "none" | "1" | {
142
+ readonly desktop?: "auto" | "none" | "1" | undefined;
143
+ readonly tablet?: "auto" | "none" | "1" | undefined;
144
+ readonly mobile?: "auto" | "none" | "1" | undefined;
145
+ } | undefined;
146
+ textAlign?: "left" | "right" | "center" | "justify" | {
147
+ readonly desktop?: "left" | "right" | "center" | "justify" | undefined;
148
+ readonly tablet?: "left" | "right" | "center" | "justify" | undefined;
149
+ readonly mobile?: "left" | "right" | "center" | "justify" | undefined;
150
+ } | undefined;
151
+ textTransform?: "none" | "capitalize" | "lowercase" | "uppercase" | {
152
+ readonly desktop?: "none" | "capitalize" | "lowercase" | "uppercase" | undefined;
153
+ readonly tablet?: "none" | "capitalize" | "lowercase" | "uppercase" | undefined;
154
+ readonly mobile?: "none" | "capitalize" | "lowercase" | "uppercase" | undefined;
155
+ } | undefined;
156
+ fontWeight?: "400" | "500" | "600" | "700" | "800" | {
157
+ readonly desktop?: "400" | "500" | "600" | "700" | "800" | undefined;
158
+ readonly tablet?: "400" | "500" | "600" | "700" | "800" | undefined;
159
+ readonly mobile?: "400" | "500" | "600" | "700" | "800" | undefined;
160
+ } | undefined;
161
+ boxSizing?: "border-box" | "content-box" | {
162
+ readonly desktop?: "border-box" | "content-box" | undefined;
163
+ readonly tablet?: "border-box" | "content-box" | undefined;
164
+ readonly mobile?: "border-box" | "content-box" | undefined;
165
+ } | undefined;
166
+ overflow?: "auto" | "hidden" | "visible" | "scroll" | {
167
+ readonly desktop?: "auto" | "hidden" | "visible" | "scroll" | undefined;
168
+ readonly tablet?: "auto" | "hidden" | "visible" | "scroll" | undefined;
169
+ readonly mobile?: "auto" | "hidden" | "visible" | "scroll" | undefined;
170
+ } | undefined;
171
+ overflowX?: "auto" | "hidden" | "visible" | "scroll" | {
172
+ readonly desktop?: "auto" | "hidden" | "visible" | "scroll" | undefined;
173
+ readonly tablet?: "auto" | "hidden" | "visible" | "scroll" | undefined;
174
+ readonly mobile?: "auto" | "hidden" | "visible" | "scroll" | undefined;
175
+ } | undefined;
176
+ overflowY?: "auto" | "hidden" | "visible" | "scroll" | {
177
+ readonly desktop?: "auto" | "hidden" | "visible" | "scroll" | undefined;
178
+ readonly tablet?: "auto" | "hidden" | "visible" | "scroll" | undefined;
179
+ readonly mobile?: "auto" | "hidden" | "visible" | "scroll" | undefined;
180
+ } | undefined;
181
+ padding?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
182
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
183
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
184
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
185
+ } | undefined;
186
+ paddingTop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
187
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
188
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
189
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
190
+ } | undefined;
191
+ paddingRight?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
192
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
193
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
194
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
195
+ } | undefined;
196
+ paddingBottom?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
197
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
198
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
199
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
200
+ } | undefined;
201
+ paddingLeft?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
202
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
203
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
204
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
205
+ } | undefined;
206
+ paddingInline?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
207
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
208
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
209
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
210
+ } | undefined;
211
+ paddingBlock?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
212
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
213
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
214
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
215
+ } | undefined;
216
+ margin?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
217
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
218
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
219
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
220
+ } | undefined;
221
+ marginTop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
222
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
223
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
224
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
225
+ } | undefined;
226
+ marginRight?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
227
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
228
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
229
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
230
+ } | undefined;
231
+ marginBottom?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
232
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
233
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
234
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
235
+ } | undefined;
236
+ marginLeft?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
237
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
238
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
239
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
240
+ } | undefined;
241
+ marginInline?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
242
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
243
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
244
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
245
+ } | undefined;
246
+ marginBlock?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
247
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
248
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
249
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
250
+ } | undefined;
251
+ gap?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
252
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
253
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
254
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
255
+ } | undefined;
256
+ rowGap?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
257
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
258
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
259
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
260
+ } | undefined;
261
+ columnGap?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
262
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
263
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
264
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
265
+ } | undefined;
266
+ width?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
267
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
268
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
269
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
270
+ } | undefined;
271
+ height?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
272
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
273
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
274
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
275
+ } | undefined;
276
+ minWidth?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
277
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
278
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
279
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
280
+ } | undefined;
281
+ minHeight?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
282
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
283
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
284
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
285
+ } | undefined;
286
+ maxWidth?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
287
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
288
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
289
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
290
+ } | undefined;
291
+ maxHeight?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
292
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
293
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
294
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
295
+ } | undefined;
296
+ px?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
297
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
298
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
299
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
300
+ } | undefined;
301
+ py?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
302
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
303
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
304
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
305
+ } | undefined;
306
+ mx?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
307
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
308
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
309
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
310
+ } | undefined;
311
+ my?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | {
312
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
313
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
314
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "auto" | "none" | undefined;
315
+ } | undefined;
316
+ placeItems?: "center" | "flex-end" | "flex-start" | {
317
+ readonly desktop?: "center" | "flex-end" | "flex-start" | undefined;
318
+ readonly tablet?: "center" | "flex-end" | "flex-start" | undefined;
319
+ readonly mobile?: "center" | "flex-end" | "flex-start" | undefined;
320
+ } | undefined;
321
+ size?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | {
322
+ readonly desktop?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
323
+ readonly tablet?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
324
+ readonly mobile?: "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl" | "icon" | "iconSm" | "iconLg" | "auto" | "none" | "screen" | "full" | undefined;
325
+ } | undefined;
326
+ } & {
327
+ color?: "primary" | "primaryHover" | "primaryActive" | "accent" | "accentHover" | "accentActive" | "background" | "backgroundTranslucent" | "surface" | "surfaceHover" | "border" | "active" | "activeHover" | "successHover" | "text" | "textSecondary" | "consoleBackground" | "consoleText" | undefined;
328
+ background?: "primary" | "primaryHover" | "primaryActive" | "accent" | "accentHover" | "accentActive" | "background" | "backgroundTranslucent" | "surface" | "surfaceHover" | "border" | "active" | "activeHover" | "successHover" | "text" | "textSecondary" | "consoleBackground" | "consoleText" | undefined;
329
+ backgroundColor?: "primary" | "primaryHover" | "primaryActive" | "accent" | "accentHover" | "accentActive" | "background" | "backgroundTranslucent" | "surface" | "surfaceHover" | "border" | "active" | "activeHover" | "successHover" | "text" | "textSecondary" | "consoleBackground" | "consoleText" | undefined;
330
+ borderColor?: "primary" | "primaryHover" | "primaryActive" | "accent" | "accentHover" | "accentActive" | "background" | "backgroundTranslucent" | "surface" | "surfaceHover" | "border" | "active" | "activeHover" | "successHover" | "text" | "textSecondary" | "consoleBackground" | "consoleText" | undefined;
331
+ } & {
332
+ borderRadius?: "sm" | "md" | "lg" | "xl" | "none" | "default" | "pill" | undefined;
333
+ borderWidth?: "none" | "default" | "bold" | "hairline" | undefined;
334
+ borderStyle?: "none" | "dashed" | "dotted" | "solid" | undefined;
335
+ fontFamily?: "default" | undefined;
336
+ fontSize?: "default" | undefined;
337
+ lineHeight?: "1" | "1.2" | "1.35" | "1.45" | "1.5" | undefined;
338
+ letterSpacing?: "normal" | "tight" | "wide" | "wider" | "widest" | undefined;
339
+ }) => string) & {
340
+ properties: Set<"background" | "fontFamily" | "fontSize" | "width" | "alignItems" | "backgroundColor" | "boxSizing" | "color" | "columnGap" | "display" | "flexDirection" | "flexWrap" | "fontWeight" | "height" | "justifyContent" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "rowGap" | "textAlign" | "textTransform" | "borderColor" | "borderRadius" | "borderStyle" | "borderWidth" | "flex" | "gap" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "placeItems" | "size" | "px" | "py" | "mx" | "my">;
341
+ };
342
+ /** Inferred prop type of the sprinkles function — accept it on components. */
343
+ type Sprinkles = Parameters<typeof sprinkles>[0];
344
+ /** Responsive conditions exposed for documentation/tooling. */
345
+ declare const breakpoints: {
346
+ readonly tablet: "900px";
347
+ readonly mobile: "720px";
348
+ };
349
+
350
+ export { type Sprinkles, breakpoints, sprinkles, tokenValues, vars };