@lemmo-lab/tokens 1.0.0 → 2.0.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 (10) hide show
  1. package/README.md +9 -1
  2. package/dist/css/themes/index.css +1 -1
  3. package/dist/css/themes/light.css +59 -81
  4. package/dist/css/themes/midnight.css +66 -88
  5. package/dist/css/themes/neon.css +63 -85
  6. package/dist/css/variables.css +149 -236
  7. package/dist/js/tokens.d.ts +2 -1
  8. package/dist/js/tokens.js +436 -166
  9. package/dist/tailwind/preset.js +16 -14
  10. package/package.json +1 -1
package/dist/css/variables.css CHANGED
@@ -1,96 +1,62 @@
1
1
  /**
2
- * @lemmo-lab/tokens - Default Theme & Design Primitives (Dark Default)
3
- * Auto-generated by Style Dictionary pipeline. DO NOT EDIT DIRECTLY.
2
+ * @lemmo-lab/tokens (v2) - Default Theme & Primitives (Dark Default)
3
+ * Single Source of Truth for Lemmo Design System
4
+ * Governed strictly by AGENTS.md rules. DO NOT EDIT DIRECTLY.
4
5
  */
5
6
 
6
7
  :root {
7
- /* --- SPACING (4px ladder) --- */
8
+ /* ================================================================== */
9
+ /* SPACING (4px ladder) */
10
+ /* ================================================================== */
8
11
  --lemmo-space-0: 0;
9
- --lemu-space-0: 0;
10
12
  --lemmo-space-50: .125rem;
11
- --lemu-space-50: .125rem;
12
13
  --lemmo-space-100: .25rem;
13
- --lemu-space-100: .25rem;
14
14
  --lemmo-space-150: .375rem;
15
- --lemu-space-150: .375rem;
16
15
  --lemmo-space-200: .5rem;
17
- --lemu-space-200: .5rem;
18
16
  --lemmo-space-250: .625rem;
19
- --lemu-space-250: .625rem;
20
17
  --lemmo-space-300: .75rem;
21
- --lemu-space-300: .75rem;
22
18
  --lemmo-space-400: 1rem;
23
- --lemu-space-400: 1rem;
24
19
  --lemmo-space-500: 1.25rem;
25
- --lemu-space-500: 1.25rem;
26
20
  --lemmo-space-600: 1.5rem;
27
- --lemu-space-600: 1.5rem;
28
21
  --lemmo-space-700: 1.75rem;
29
- --lemu-space-700: 1.75rem;
30
22
  --lemmo-space-800: 2rem;
31
- --lemu-space-800: 2rem;
32
23
  --lemmo-space-1000: 2.5rem;
33
- --lemu-space-1000: 2.5rem;
34
24
  --lemmo-space-1200: 3rem;
35
- --lemu-space-1200: 3rem;
36
25
  --lemmo-space-1400: 3.5rem;
37
- --lemu-space-1400: 3.5rem;
38
26
  --lemmo-space-1600: 4rem;
39
- --lemu-space-1600: 4rem;
40
27
  --lemmo-space-2000: 5rem;
41
- --lemu-space-2000: 5rem;
42
28
  --lemmo-space-2400: 6rem;
43
- --lemu-space-2400: 6rem;
44
29
 
45
- /* --- GAPS --- */
30
+ /* ================================================================== */
31
+ /* GAPS */
32
+ /* ================================================================== */
46
33
  --lemmo-gap-1: .25rem;
47
- --lemu-gap-1: .25rem;
48
34
  --lemmo-gap-2: .5rem;
49
- --lemu-gap-2: .5rem;
50
35
  --lemmo-gap-3: .75rem;
51
- --lemu-gap-3: .75rem;
52
36
  --lemmo-gap-4: 1rem;
53
- --lemu-gap-4: 1rem;
54
37
  --lemmo-gap-0-5: .125rem;
55
- --lemu-gap-0-5: .125rem;
56
38
  --lemmo-gap-1-5: .375rem;
57
- --lemu-gap-1-5: .375rem;
58
39
  --lemmo-gap-2-5: .625rem;
59
- --lemu-gap-2-5: .625rem;
60
- --lemmo-gap-cardGrid: .5rem;
61
- --lemu-gap-cardGrid: .5rem;
62
- --lemmo-gap-cardInner: .5rem;
63
- --lemu-gap-cardInner: .5rem;
64
- --lemmo-gap-sectionSm: 2.5rem;
65
- --lemu-gap-sectionSm: 2.5rem;
66
- --lemmo-gap-sectionLg: 5rem;
67
- --lemu-gap-sectionLg: 5rem;
40
+ --lemmo-gap-card-grid: .5rem;
41
+ --lemmo-gap-card-inner: .5rem;
42
+ --lemmo-gap-section-sm: 2.5rem;
43
+ --lemmo-gap-section-lg: 5rem;
68
44
 
69
- /* --- RADIUS --- */
45
+ /* ================================================================== */
46
+ /* RADIUS (Relative Derived Scales) */
47
+ /* ================================================================== */
70
48
  --lemmo-radius-0: 0;
71
- --lemu-radius-0: 0;
72
49
  --lemmo-radius-100: .25rem;
73
- --lemu-radius-100: .25rem;
74
50
  --lemmo-radius-150: .375rem;
75
- --lemu-radius-150: .375rem;
76
51
  --lemmo-radius-200: .5rem;
77
- --lemu-radius-200: .5rem;
78
52
  --lemmo-radius-250: .625rem;
79
- --lemu-radius-250: .625rem;
80
53
  --lemmo-radius-300: .75rem;
81
- --lemu-radius-300: .75rem;
82
54
  --lemmo-radius-400: 1rem;
83
- --lemu-radius-400: 1rem;
84
55
  --lemmo-radius-500: 1.25rem;
85
- --lemu-radius-500: 1.25rem;
86
56
  --lemmo-radius-600: 1.5rem;
87
- --lemu-radius-600: 1.5rem;
88
57
  --lemmo-radius-base: .5rem;
89
- --lemu-radius-base: .5rem;
90
58
  --lemmo-radius-050: .125rem;
91
- --lemu-radius-050: .125rem;
92
59
  --lemmo-radius-full: 9999px;
93
- --lemu-radius-full: 9999px;
94
60
  --lemmo-radius-badge: calc(var(--lemmo-radius-base) * 0.75);
95
61
  --lemmo-radius-control: var(--lemmo-radius-base);
96
62
  --lemmo-radius-card: calc(var(--lemmo-radius-base) * 1.5);
@@ -99,312 +65,259 @@
99
65
  --lemmo-radius-media-lg: calc(var(--lemmo-radius-base) * 3);
100
66
  --lemmo-radius-pill: 9999px;
101
67
 
102
- /* --- TYPOGRAPHY FAMILIES & SCALES --- */
103
- --lemmo-font-satoshi: 'Satoshi', sans-serif;
104
- --lemu-font-satoshi: 'Satoshi', sans-serif;
105
- --lemmo-font-oddval: 'Oddval', 'Satoshi', sans-serif;
106
- --lemu-font-oddval: 'Oddval', 'Satoshi', sans-serif;
107
- --lemmo-font-morabba: 'Morabba', sans-serif;
108
- --lemu-font-morabba: 'Morabba', sans-serif;
109
- --lemmo-font-iransans: 'IRANSans', sans-serif;
110
- --lemu-font-iransans: 'IRANSans', sans-serif;
111
- --lemmo-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
112
- --lemu-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
68
+ /* ================================================================== */
69
+ /* TYPOGRAPHY (Decoupled Stacks & Unitless Line Heights) */
70
+ /* ================================================================== */
71
+ --lemmo-font-sans: Satoshi, system-ui, sans-serif;
72
+ --lemmo-font-sans-fa: IRANSansX, Tahoma, sans-serif;
73
+ --lemmo-font-display: Oddval, Satoshi, system-ui, sans-serif;
74
+ --lemmo-font-display-fa: Morabba, Tahoma, sans-serif;
75
+ --lemmo-font-heading: Satoshi, system-ui, sans-serif;
76
+ --lemmo-font-heading-fa: Morabba, Tahoma, sans-serif;
77
+ --lemmo-font-numeric: Satoshi, system-ui, sans-serif;
78
+ --lemmo-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
79
+ --lemmo-font-display: var(--lemmo-font-display);
80
+ --lemmo-font-heading: var(--lemmo-font-heading);
81
+ --lemmo-font-body: var(--lemmo-font-sans);
82
+ --lemmo-font-numeric: var(--lemmo-font-numeric);
83
+ --lemmo-leading-factor: 1;
113
84
  --lemmo-font-weight-regular: 400;
114
- --lemu-font-weight-regular: 400;
115
85
  --lemmo-font-weight-medium: 500;
116
- --lemu-font-weight-medium: 500;
117
86
  --lemmo-font-weight-cta: 510;
118
- --lemu-font-weight-cta: 510;
119
- --lemmo-font-weight-semiBold: 600;
120
- --lemu-font-weight-semiBold: 600;
87
+ --lemmo-font-weight-semi-bold: 600;
121
88
  --lemmo-font-weight-bold: 700;
122
- --lemu-font-weight-bold: 700;
123
89
  --lemmo-font-weight-black: 900;
124
- --lemu-font-weight-black: 900;
125
90
  --lemmo-type-size-100: .75rem;
126
- --lemu-type-size-100: .75rem;
127
91
  --lemmo-type-size-200: .875rem;
128
- --lemu-type-size-200: .875rem;
129
92
  --lemmo-type-size-300: 1rem;
130
- --lemu-type-size-300: 1rem;
131
93
  --lemmo-type-size-400: 1.125rem;
132
- --lemu-type-size-400: 1.125rem;
133
94
  --lemmo-type-size-500: 1.25rem;
134
- --lemu-type-size-500: 1.25rem;
135
95
  --lemmo-type-size-600: 1.5rem;
136
- --lemu-type-size-600: 1.5rem;
137
96
  --lemmo-type-size-700: 1.75rem;
138
- --lemu-type-size-700: 1.75rem;
139
97
  --lemmo-type-size-800: 2rem;
140
- --lemu-type-size-800: 2rem;
141
98
  --lemmo-type-size-900: 2.25rem;
142
- --lemu-type-size-900: 2.25rem;
143
99
  --lemmo-type-size-1000: 2.5rem;
144
- --lemu-type-size-1000: 2.5rem;
145
100
  --lemmo-type-size-1100: 3rem;
146
- --lemu-type-size-1100: 3rem;
147
101
  --lemmo-type-size-1200: 3.5rem;
148
- --lemu-type-size-1200: 3.5rem;
149
102
  --lemmo-type-size-1300: 4rem;
150
- --lemu-type-size-1300: 4rem;
151
103
  --lemmo-type-size-1400: 4.5rem;
152
- --lemu-type-size-1400: 4.5rem;
153
104
  --lemmo-type-size-050: .625rem;
154
- --lemu-type-size-050: .625rem;
155
- --lemmo-type-leading-300: 1rem;
156
- --lemu-type-leading-300: 1rem;
157
- --lemmo-type-leading-400: 1.125rem;
158
- --lemu-type-leading-400: 1.125rem;
159
- --lemmo-type-leading-500: 1.25rem;
160
- --lemu-type-leading-500: 1.25rem;
161
- --lemmo-type-leading-600: 1.5rem;
162
- --lemu-type-leading-600: 1.5rem;
163
- --lemmo-type-leading-700: 1.75rem;
164
- --lemu-type-leading-700: 1.75rem;
165
- --lemmo-type-leading-800: 2rem;
166
- --lemu-type-leading-800: 2rem;
167
- --lemmo-type-leading-900: 2.25rem;
168
- --lemu-type-leading-900: 2.25rem;
169
- --lemmo-type-leading-1000: 2.5rem;
170
- --lemu-type-leading-1000: 2.5rem;
171
- --lemmo-type-leading-1100: 2.75rem;
172
- --lemu-type-leading-1100: 2.75rem;
173
- --lemmo-type-leading-1200: 3rem;
174
- --lemu-type-leading-1200: 3rem;
175
- --lemmo-type-leading-1300: 4rem;
176
- --lemu-type-leading-1300: 4rem;
177
- --lemmo-type-leading-1400: 4.5rem;
178
- --lemu-type-leading-1400: 4.5rem;
105
+ --lemmo-type-leading-300: 1.25;
106
+ --lemmo-type-leading-400: 1.28;
107
+ --lemmo-type-leading-500: 1.43;
108
+ --lemmo-type-leading-600: 1.5;
109
+ --lemmo-type-leading-700: 1.4;
110
+ --lemmo-type-leading-800: 1.33;
111
+ --lemmo-type-leading-900: 1.25;
112
+ --lemmo-type-leading-1000: 1.2;
113
+ --lemmo-type-leading-1100: 1.15;
114
+ --lemmo-type-leading-1200: 1.1;
115
+ --lemmo-type-leading-1300: 1.05;
116
+ --lemmo-type-leading-1400: 1;
179
117
  --lemmo-type-track-none: 0;
180
- --lemu-type-track-none: 0;
181
118
  --lemmo-type-track-slight: -0.025rem;
182
- --lemu-type-track-slight: -0.025rem;
183
119
  --lemmo-type-track-tight: -0.075rem;
184
- --lemu-type-track-tight: -0.075rem;
185
120
  --lemmo-type-track-loose: 0.00625rem;
186
- --lemu-type-track-loose: 0.00625rem;
187
121
  --lemmo-type-track-wide: 0.0125rem;
188
- --lemu-type-track-wide: 0.0125rem;
189
122
  --lemmo-type-track-xxs: -0.3px;
190
- --lemu-type-track-xxs: -0.3px;
191
123
  --lemmo-type-track-5xl: -1.2px;
192
- --lemu-type-track-5xl: -1.2px;
193
124
  --lemmo-type-track-heading: -2%;
194
- --lemu-type-track-heading: -2%;
195
125
  --lemmo-type-track-caps: -4%;
196
- --lemu-type-track-caps: -4%;
197
126
  --lemmo-type-track-label: 0.2px;
198
- --lemu-type-track-label: 0.2px;
199
127
  --lemmo-type-track-caption: 0;
200
- --lemu-type-track-caption: 0;
201
- --lemmo-type-track-tableHead: -0.56px;
202
- --lemu-type-track-tableHead: -0.56px;
203
- --lemmo-leading-factor: 1;
204
- --lemu-leading-factor: 1;
128
+ --lemmo-type-track-table-head: -0.56px;
205
129
 
206
- /* --- BREAKPOINTS & SIZES --- */
130
+ /* ================================================================== */
131
+ /* BREAKPOINTS, SIZES & STROKES */
132
+ /* ================================================================== */
207
133
  --lemmo-bp-base: 20rem;
208
- --lemu-bp-base: 20rem;
209
134
  --lemmo-bp-sm: 40rem;
210
- --lemu-bp-sm: 40rem;
211
135
  --lemmo-bp-md: 48rem;
212
- --lemu-bp-md: 48rem;
213
136
  --lemmo-bp-lg: 64rem;
214
- --lemu-bp-lg: 64rem;
215
137
  --lemmo-bp-xl: 80rem;
216
- --lemu-bp-xl: 80rem;
217
138
  --lemmo-bp-2xl: 120rem;
218
- --lemu-bp-2xl: 120rem;
219
139
  --lemmo-bp-3xl: 158rem;
220
- --lemu-bp-3xl: 158rem;
140
+ --lemmo-bp-tablet: var(--lemmo-bp-md);
141
+ --lemmo-bp-desktop: var(--lemmo-bp-xl);
142
+ --lemmo-bp-wide: var(--lemmo-bp-2xl);
221
143
  --lemmo-stroke-none: 0;
222
- --lemu-stroke-none: 0;
223
144
  --lemmo-stroke-hairline: 0.5px;
224
- --lemu-stroke-hairline: 0.5px;
225
145
  --lemmo-stroke-thin: 1px;
226
- --lemu-stroke-thin: 1px;
227
146
  --lemmo-stroke-medium: 1.5px;
228
- --lemu-stroke-medium: 1.5px;
229
147
  --lemmo-stroke-thick: 2px;
230
- --lemu-stroke-thick: 2px;
148
+ --lemmo-stroke-rim: var(--lemmo-stroke-thin);
149
+ --lemmo-stroke-border: var(--lemmo-stroke-thin);
150
+ --lemmo-stroke-border-gradient: var(--lemmo-stroke-thick);
151
+ --lemmo-stroke-divider: var(--lemmo-stroke-hairline);
231
152
  --lemmo-size-control-xs: 2rem;
232
- --lemu-size-control-xs: 2rem;
233
153
  --lemmo-size-control-sm: 2.25rem;
234
- --lemu-size-control-sm: 2.25rem;
235
154
  --lemmo-size-control-md: 2.5rem;
236
- --lemu-size-control-md: 2.5rem;
237
155
  --lemmo-size-control-lg: 2.75rem;
238
- --lemu-size-control-lg: 2.75rem;
239
156
  --lemmo-size-control-xl: 3rem;
240
- --lemu-size-control-xl: 3rem;
241
157
  --lemmo-size-icon-xs: .75rem;
242
- --lemu-size-icon-xs: .75rem;
243
158
  --lemmo-size-icon-sm: 1rem;
244
- --lemu-size-icon-sm: 1rem;
245
159
  --lemmo-size-icon-md: 1.25rem;
246
- --lemu-size-icon-md: 1.25rem;
247
160
  --lemmo-size-icon-lg: 1.5rem;
248
- --lemu-size-icon-lg: 1.5rem;
249
161
  --lemmo-size-icon-xl: 1.75rem;
250
- --lemu-size-icon-xl: 1.75rem;
162
+ --lemmo-size-header: 3.25rem;
163
+ --lemmo-size-header-compact: 2.25rem;
164
+ --lemmo-size-gutter: 1rem;
165
+ --lemmo-size-container-base: 100%;
166
+ --lemmo-size-container-sm: 40rem;
167
+ --lemmo-size-container-md: 48rem;
168
+ --lemmo-size-container-lg: 64rem;
169
+ --lemmo-size-container-xl: 80rem;
170
+ --lemmo-size-container-2xl: 120rem;
171
+ --lemmo-size-container-3xl: 158rem;
172
+ --lemmo-size-container-media: calc(100vw - 2rem);
173
+ --lemmo-size-container-copy: 80rem;
174
+ --lemmo-size-container-content: 56rem;
175
+ --lemmo-size-container-wide: 96rem;
176
+ --lemmo-size-pricing-column-sm: 66.5rem;
177
+ --lemmo-size-pricing-column-lg: 89rem;
178
+ --lemmo-size-pricing-max-default: 90rem;
179
+ --lemmo-size-pricing-max-wide: 92rem;
180
+ --lemmo-size-pricing-pad-x: 1rem;
181
+ --lemmo-size-pricing-pad-x-lg: 3.75rem;
182
+ --lemmo-size-pricing-pad-y: 2rem;
251
183
 
252
- /* --- MOTION --- */
184
+ /* ================================================================== */
185
+ /* MOTION & ELEVATION */
186
+ /* ================================================================== */
253
187
  --lemmo-duration-fast: 100ms;
254
- --lemu-duration-fast: 100ms;
255
188
  --lemmo-duration-normal: 200ms;
256
- --lemu-duration-normal: 200ms;
257
189
  --lemmo-duration-slow: 300ms;
258
- --lemu-duration-slow: 300ms;
259
190
  --lemmo-duration-slower: 500ms;
260
- --lemu-duration-slower: 500ms;
261
191
  --lemmo-duration-slider: 150ms;
262
- --lemu-duration-slider: 150ms;
263
- --lemmo-duration-planSwap: 420ms;
264
- --lemu-duration-planSwap: 420ms;
192
+ --lemmo-duration-plan-swap: 420ms;
265
193
  --lemmo-duration-breathe: 1.8s;
266
- --lemu-duration-breathe: 1.8s;
267
194
  --lemmo-ease-out: ease-out;
268
- --lemu-ease-out: ease-out;
269
- --lemmo-ease-inOut: ease-in-out;
270
- --lemu-ease-inOut: ease-in-out;
195
+ --lemmo-ease-in-out: ease-in-out;
271
196
  --lemmo-ease-snap: cubic-bezier(0.77, 0, 0.175, 1);
272
- --lemu-ease-snap: cubic-bezier(0.77, 0, 0.175, 1);
273
197
  --lemmo-ease-spring: cubic-bezier(0.68, -0.55, 0.265, 1.55);
274
- --lemu-ease-spring: cubic-bezier(0.68, -0.55, 0.265, 1.55);
275
198
  --lemmo-ease-swift: cubic-bezier(0.55, 0, 0.1, 1);
276
- --lemu-ease-swift: cubic-bezier(0.55, 0, 0.1, 1);
277
199
  --lemmo-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
278
- --lemu-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
279
- --lemmo-ease-outExpo: cubic-bezier(0.16, 1, 0.3, 1);
280
- --lemu-ease-outExpo: cubic-bezier(0.16, 1, 0.3, 1);
281
- --lemmo-ease-outQuart: cubic-bezier(0.165, 0.84, 0.44, 1);
282
- --lemu-ease-outQuart: cubic-bezier(0.165, 0.84, 0.44, 1);
200
+ --lemmo-ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
201
+ --lemmo-ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
202
+ --lemmo-shadow-card-featured: 0 1.5rem 4rem rgba(0, 0, 0, 0.24);
203
+ --lemmo-shadow-card-base: 10px 34px 24px 0 rgba(0, 0, 0, 0.15);
204
+ --lemmo-shadow-button-brand-inset: inset 0 0.8px 0 0 #d1fe17, inset 0 -1.6px 0 0 #829b19, inset 0 -2.4px 0 0 #829b19;
205
+ --lemmo-shadow-button-brand: inset 0 0.8px 0 0 #d1fe17, inset 0 -1.6px 0 0 #829b19, inset 0 -2.4px 0 0 #829b19, 10px 34px 24px 0px rgba(0, 0, 0, 0.15);
206
+ --lemmo-shadow-gloss-inset: inset 0 -2px 2px 0 rgba(255, 255, 255, 0.4), inset 0 2px 2px 0 rgba(255, 255, 255, 0.4);
207
+ --lemmo-shadow-glow-brand: 0 0 0.4rem color-mix(in srgb, #d1fe17 56%, transparent);
283
208
 
284
- /* --- DEFAULT (DARK) THEME COLORS --- */
209
+ /* ================================================================== */
210
+ /* TIER 2 SEMANTIC CONTRACT (Default Dark Theme Colors & Roles) */
211
+ /* ================================================================== */
285
212
  --lemmo-page-background: #131517;
286
- --lemu-page-background: #131517;
287
213
  --lemmo-page-foreground: #e1e1e3;
288
- --lemu-page-foreground: #e1e1e3;
289
214
  --lemmo-surface-primary-background: #1c1e20;
290
- --lemu-surface-primary-background: #1c1e20;
291
215
  --lemmo-surface-primary-foreground: #e1e1e3;
292
- --lemu-surface-primary-foreground: #e1e1e3;
293
216
  --lemmo-surface-secondary-background: #23262a;
294
- --lemu-surface-secondary-background: #23262a;
295
217
  --lemmo-surface-secondary-foreground: #a1a1a5;
296
- --lemu-surface-secondary-foreground: #a1a1a5;
297
- --lemmo-surface-tertiary-background: #0f1113;
298
- --lemu-surface-tertiary-background: #0f1113;
218
+ --lemmo-surface-tertiary-background: #0a0c0e;
299
219
  --lemmo-surface-tertiary-foreground: #e1e1e3;
300
- --lemu-surface-tertiary-foreground: #e1e1e3;
301
220
  --lemmo-surface-elevated-background: #18191c;
302
- --lemu-surface-elevated-background: #18191c;
303
221
  --lemmo-surface-elevated-foreground: #e1e1e3;
304
- --lemu-surface-elevated-foreground: #e1e1e3;
305
222
  --lemmo-surface-glass-background: rgba(15, 17, 19, 0.88);
306
- --lemu-surface-glass-background: rgba(15, 17, 19, 0.88);
307
223
  --lemmo-surface-glass-foreground: #e1e1e3;
308
- --lemu-surface-glass-foreground: #e1e1e3;
309
224
  --lemmo-surface-brand-background: #d1fe17;
310
- --lemu-surface-brand-background: #d1fe17;
311
225
  --lemmo-surface-brand-foreground: #131517;
312
- --lemu-surface-brand-foreground: #131517;
313
226
  --lemmo-text-primary: #e1e1e3;
314
- --lemu-text-primary: #e1e1e3;
315
227
  --lemmo-text-secondary: #a1a1a5;
316
- --lemu-text-secondary: #a1a1a5;
317
228
  --lemmo-text-muted: #898a8b;
318
- --lemu-text-muted: #898a8b;
319
229
  --lemmo-text-faint: #737475;
320
- --lemu-text-faint: #737475;
321
- --lemmo-text-onBrand: #131517;
322
- --lemu-text-onBrand: #131517;
230
+ --lemmo-text-on-brand: #131517;
323
231
  --lemmo-text-reverted: #060515;
324
- --lemu-text-reverted: #060515;
325
232
  --lemmo-text-danger: #ff5462;
326
- --lemu-text-danger: #ff5462;
327
233
  --lemmo-text-warning: #dfab01;
328
- --lemu-text-warning: #dfab01;
329
234
  --lemmo-text-success: #4ee466;
330
- --lemu-text-success: #4ee466;
331
235
  --lemmo-text-info: #5b91fe;
332
- --lemu-text-info: #5b91fe;
333
- --lemmo-border-default: rgba(255, 255, 255, 0.1);
334
- --lemu-border-default: rgba(255, 255, 255, 0.1);
236
+ --lemmo-border-default: rgba(255, 255, 255, 0.15);
335
237
  --lemmo-border-subtle: rgba(255, 255, 255, 0.04);
336
- --lemu-border-subtle: rgba(255, 255, 255, 0.04);
337
- --lemmo-border-mid: rgba(255, 255, 255, 0.05);
338
- --lemu-border-mid: rgba(255, 255, 255, 0.05);
238
+ --lemmo-border-mid: rgba(255, 255, 255, 0.08);
339
239
  --lemmo-border-danger: #fa0019;
340
- --lemu-border-danger: #fa0019;
341
240
  --lemmo-border-warning: #dfab01;
342
- --lemu-border-warning: #dfab01;
343
241
  --lemmo-border-success: #2eb844;
344
- --lemu-border-success: #2eb844;
345
242
  --lemmo-border-info: #0256fe;
346
- --lemu-border-info: #0256fe;
347
243
  --lemmo-interactive-primary-background: #d1fe17;
348
- --lemu-interactive-primary-background: #d1fe17;
349
244
  --lemmo-interactive-primary-foreground: #131517;
350
- --lemu-interactive-primary-foreground: #131517;
351
245
  --lemmo-interactive-primary-hover: #c4ee0b;
352
- --lemu-interactive-primary-hover: #c4ee0b;
353
246
  --lemmo-interactive-secondary-background: #0256fe;
354
- --lemu-interactive-secondary-background: #0256fe;
355
- --lemmo-interactive-secondary-foreground: #e1e1e3;
356
- --lemu-interactive-secondary-foreground: #e1e1e3;
247
+ --lemmo-interactive-secondary-foreground: #ffffff;
357
248
  --lemmo-interactive-secondary-hover: #245ef1;
358
- --lemu-interactive-secondary-hover: #245ef1;
359
249
  --lemmo-status-danger-background: #5c000f;
360
- --lemu-status-danger-background: #5c000f;
361
250
  --lemmo-status-danger-foreground: #ff5462;
362
- --lemu-status-danger-foreground: #ff5462;
363
251
  --lemmo-status-danger-border: #fa0019;
364
- --lemu-status-danger-border: #fa0019;
365
- --lemmo-status-danger-glow: {color.status.danger.glow};
366
- --lemu-status-danger-glow: {color.status.danger.glow};
252
+ --lemmo-status-danger-glow: #ff1f2e;
367
253
  --lemmo-status-warning-background: #523f00;
368
- --lemu-status-warning-background: #523f00;
369
254
  --lemmo-status-warning-foreground: #ffef33;
370
- --lemu-status-warning-foreground: #ffef33;
371
255
  --lemmo-status-warning-border: #dfab01;
372
- --lemu-status-warning-border: #dfab01;
373
- --lemmo-status-warning-glow: {color.status.warning.glow};
374
- --lemu-status-warning-glow: {color.status.warning.glow};
256
+ --lemmo-status-warning-glow: #fff05a;
375
257
  --lemmo-status-success-background: #0d4a17;
376
- --lemu-status-success-background: #0d4a17;
377
258
  --lemmo-status-success-foreground: #4ee466;
378
- --lemu-status-success-foreground: #4ee466;
379
259
  --lemmo-status-success-border: #2eb844;
380
- --lemu-status-success-border: #2eb844;
381
- --lemmo-status-success-glow: {color.status.success.glow};
382
- --lemu-status-success-glow: {color.status.success.glow};
260
+ --lemmo-status-success-glow: #00e62e;
383
261
  --lemmo-status-info-background: #000d26;
384
- --lemu-status-info-background: #000d26;
385
262
  --lemmo-status-info-foreground: #5b91fe;
386
- --lemu-status-info-foreground: #5b91fe;
387
263
  --lemmo-status-info-border: #0256fe;
388
- --lemu-status-info-border: #0256fe;
389
- --lemmo-status-info-glow: {color.status.info.glow};
390
- --lemu-status-info-glow: {color.status.info.glow};
264
+ --lemmo-status-info-glow: #3cd8ff;
265
+
266
+ /* ================================================================== */
267
+ /* TIER 2 GRADIENTS (Default Dark Theme) */
268
+ /* ================================================================== */
269
+ --lemmo-gradient-surface-featured: linear-gradient(225deg, rgba(209, 254, 23, 0.16) 0%, rgba(209, 254, 23, 0.08) 28%, rgba(209, 254, 23, 0) 62%), #18191c;
270
+ --lemmo-gradient-surface-pink-haze: radial-gradient(145% 54% at 100% 0%, rgba(255, 0, 91, 0.32) 0%, rgba(255, 0, 91, 0.15) 42%, rgba(255, 0, 91, 0) 78%), #18191c;
271
+ --lemmo-gradient-surface-olive: linear-gradient(180deg, #1F2022 0%, #222420 55%, #272A20 100%);
272
+ --lemmo-gradient-surface-ocean: linear-gradient(180deg, #121D23 0%, #152026 45%, #1D282E 75%, #273238 100%);
273
+ --lemmo-gradient-surface-steel: linear-gradient(180deg, #1F2024 0%, #232428 40%, #343539 75%, #48494D 100%);
274
+ --lemmo-gradient-surface-base: linear-gradient(180deg, #1c1e20 0%, #131517 100%);
275
+ --lemmo-gradient-surface-soft: radial-gradient(58% 220% at 3% 42%, rgba(255, 255, 255, 0.095) 0%, rgba(255, 255, 255, 0.035) 42%, rgba(255, 255, 255, 0.012) 100%), linear-gradient(180deg, #1c1e20 0%, #131517 100%);
276
+ --lemmo-gradient-surface-lime-wash: radial-gradient(56.49% 230.73% at 2.37% 40.91%, rgba(187, 251, 12, 0.07) 0%, rgba(12, 251, 32, 0.01) 100%), radial-gradient(41.8% 183.68% at 10.4% 53.71%, rgba(197, 197, 197, 0.08) 0%, rgba(197, 197, 197, 0.01) 100%), linear-gradient(180deg, #1c1e20 0%, #131517 100%);
277
+ --lemmo-gradient-surface-pink-wash: radial-gradient(56.49% 230.73% at 2.37% 40.91%, rgba(237, 21, 114, 0.10) 0%, rgba(237, 21, 114, 0.01) 100%), linear-gradient(180deg, #1c1e20 0%, #131517 100%);
278
+ --lemmo-gradient-surface-blue-wash: radial-gradient(56.49% 230.73% at 2.37% 40.91%, rgba(21, 68, 237, 0.10) 0%, rgba(21, 68, 237, 0.01) 100%), linear-gradient(180deg, #1c1e20 0%, #131517 100%);
279
+ --lemmo-gradient-surface-steel-flat: linear-gradient(180deg, rgba(110, 145, 188, 0.02) 0%, rgba(110, 145, 188, 0.20) 100%), #1c1e20;
280
+ --lemmo-gradient-surface-plain: linear-gradient(180deg, #1c1e20 0%, #131517 100%);
281
+ --lemmo-gradient-rim-vertical: linear-gradient(180deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.09) 18%, rgba(255, 255, 255, 0.03) 38%, rgba(255, 255, 255, 0) 72%);
282
+ --lemmo-gradient-rim-diagonal: linear-gradient(225deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.10) 18%, rgba(255, 255, 255, 0.04) 42%, rgba(255, 255, 255, 0) 76%);
283
+ --lemmo-gradient-border-pink: radial-gradient(86.59% 115.91% at 50% 45.45%, #fb398c 0%, #ed1572 100%);
284
+ --lemmo-gradient-border-blue: radial-gradient(86.59% 115.91% at 50% 45.45%, #245ef1 0%, #1544ed 100%);
285
+ --lemmo-gradient-pill-lime: radial-gradient(ellipse 55% 95% at 73% 50%, rgba(117, 239, 29, 0.6) 0%, rgba(194, 237, 21, 0) 100%), radial-gradient(ellipse 25% 42% at 85% 37%, rgba(255, 255, 255, 0.6) 0%, rgba(209, 254, 23, 0) 100%), radial-gradient(ellipse 33% 70% at 12% 76%, rgba(200, 239, 29, 0.6) 0%, rgba(194, 237, 21, 0) 100%), linear-gradient(90deg, #d1fe17 0%, #d1fe17 100%);
286
+ --lemmo-gradient-pill-blue: radial-gradient(ellipse 75% 300% at 73% 50%, #1d63ef 0%, #5150d0 45%, rgba(237, 21, 114, 0) 100%), radial-gradient(ellipse 30% 120% at 85% 37%, rgba(255, 255, 255, 0.6) 0%, rgba(209, 254, 23, 0) 100%), #0256fe;
287
+ --lemmo-gradient-pill-ultraviolet: radial-gradient(ellipse 55% 95% at 73% 50%, rgba(29, 99, 239, 0.6) 0%, rgba(81, 80, 208, 0.45) 25%, rgba(133, 60, 176, 0.3) 50%, rgba(237, 21, 114, 0) 100%), radial-gradient(ellipse 25% 42% at 85% 37%, rgba(255, 255, 255, 0.6) 0%, rgba(209, 254, 23, 0) 100%), radial-gradient(ellipse 33% 70% at 12% 76%, rgba(29, 99, 239, 0.6) 0%, rgba(133, 60, 176, 0.3) 50%, rgba(237, 21, 114, 0) 100%), linear-gradient(90deg, #0256fe 0%, #0256fe 100%);
288
+ --lemmo-gradient-pill-pink: radial-gradient(ellipse 55% 95% at 73% 50%, rgba(239, 29, 186, 0.6) 0%, rgba(237, 21, 114, 0) 100%), radial-gradient(ellipse 25% 42% at 85% 37%, rgba(255, 255, 255, 0.6) 0%, rgba(209, 254, 23, 0) 100%), radial-gradient(ellipse 33% 70% at 12% 76%, rgba(176, 29, 239, 0.6) 0%, rgba(206, 25, 176, 0.3) 50%, rgba(237, 21, 114, 0) 100%), linear-gradient(90deg, #ff005b 0%, #ff005b 100%);
289
+ --lemmo-gradient-offer-base: radial-gradient(120% 90% at 50% 0%, #55142c 0%, #35101d 38%, #1e0c14 70%, #140a0f 100%);
290
+ --lemmo-gradient-offer-flash: linear-gradient(0deg, rgba(255, 0, 91, 0.32) 0%, rgba(255, 0, 91, 0.016) 100%), linear-gradient(90deg, #0a0c0e 0%, #0a0c0e 100%);
291
+ --lemmo-gradient-offer-dots: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.08) 1px, rgba(209, 254, 23, 0) 0);
292
+ --lemmo-gradient-offer-combo: linear-gradient(135deg, #ff005b 0%, #d1004e 40%, #8b006a 100%);
293
+ --lemmo-gradient-table-cyan: radial-gradient(211% 211% at 50.16% 100%, rgba(60, 140, 255, 0.20) 0%, rgba(60, 216, 255, 0.20) 100%), rgba(255, 255, 255, 0.05);
294
+ --lemmo-gradient-overlay-darken: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
391
295
  }
392
296
 
393
- /* Automatic language switching for Persian [lang='fa'] */
297
+ /* ================================================================== */
298
+ /* BILINGUAL LANGUAGE RULES: Automatic Font & Track Switching */
299
+ /* ================================================================== */
394
300
  :root[lang='fa'],
395
301
  [lang='fa'] {
396
- --lemmo-font-heading: var(--lemmo-font-morabba);
397
- --lemmo-font-body: var(--lemmo-font-iransans);
302
+ --lemmo-font-body: var(--lemmo-font-sans-fa);
303
+ --lemmo-font-heading: var(--lemmo-font-heading-fa);
304
+ --lemmo-font-display: var(--lemmo-font-display-fa);
398
305
  --lemmo-leading-factor: 1.15;
399
- --lemu-font-heading: var(--lemu-font-morabba);
400
- --lemu-font-body: var(--lemu-font-iransans);
401
- --lemu-leading-factor: 1.15;
306
+
307
+ /* Persian letters require normal tracking; negative tracking breaks glyph connections */
308
+ --lemmo-type-track-slight: normal;
309
+ --lemmo-type-track-tight: normal;
310
+ --lemmo-type-track-heading: normal;
311
+ --lemmo-type-track-caps: normal;
312
+ --lemmo-type-track-table-head: normal;
402
313
  }
403
314
 
404
- /* Numerals standard: Satoshi in tabular-nums isolate */
315
+ /* ================================================================== */
316
+ /* NUMERALS STANDARD: Satoshi Tabular Numerals (LTR Isolated) */
317
+ /* ================================================================== */
405
318
  .tabular-nums,
406
319
  [data-numeric] {
407
- font-family: var(--lemmo-font-satoshi);
320
+ font-family: var(--lemmo-font-numeric, 'Satoshi', sans-serif);
408
321
  font-feature-settings: 'tnum' 1;
409
322
  direction: ltr;
410
323
  unicode-bidi: isolate;
package/dist/js/tokens.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @lemmo-lab/tokens - TypeScript Definitions
2
+ * @lemmo-lab/tokens (v2) - TypeScript Definitions
3
3
  */
4
4
 
5
5
  export declare const core: typeof import('./tokens.js').core;
@@ -17,5 +17,6 @@ export declare const tokens: {
17
17
  themes: typeof themes;
18
18
  defaultTheme: any;
19
19
  lightTheme: any;
20
+ [key: string]: any;
20
21
  };
21
22
  export default tokens;