@lemmo-lab/tokens 1.0.1 → 2.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 (21) hide show
  1. package/README.md +186 -57
  2. package/dist/css/themes/index.css +1 -1
  3. package/dist/css/themes/light.css +57 -190
  4. package/dist/css/themes/midnight.css +66 -142
  5. package/dist/css/themes/neon.css +63 -139
  6. package/dist/css/variables.css +286 -575
  7. package/dist/js/tokens.d.ts +1 -1
  8. package/dist/js/tokens.js +398 -180
  9. package/dist/tailwind/preset.js +13 -11
  10. package/package.json +1 -2
  11. package/dist/css/system-design/lemmo.breakpoints.css +0 -19
  12. package/dist/css/system-design/lemmo.colors.css +0 -196
  13. package/dist/css/system-design/lemmo.elevation.css +0 -23
  14. package/dist/css/system-design/lemmo.gradients.css +0 -62
  15. package/dist/css/system-design/lemmo.motion.css +0 -28
  16. package/dist/css/system-design/lemmo.radius.css +0 -27
  17. package/dist/css/system-design/lemmo.sizes.css +0 -54
  18. package/dist/css/system-design/lemmo.spacing.css +0 -42
  19. package/dist/css/system-design/lemmo.strokes.css +0 -18
  20. package/dist/css/system-design/lemmo.tokens.css +0 -14
  21. package/dist/css/system-design/lemmo.typography.css +0 -120
package/dist/css/themes/midnight.css CHANGED
@@ -1,171 +1,95 @@
1
1
  /**
2
- * @lemmo-lab/tokens - MIDNIGHT Theme Preset
3
- * Auto-generated by Style Dictionary pipeline. DO NOT EDIT DIRECTLY.
2
+ * @lemmo-lab/tokens (v2) - MIDNIGHT Theme Preset
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
  [data-theme='midnight'],
7
8
  :root[data-theme='midnight'],
8
9
  .theme-midnight {
9
- --page-background: #000000;
10
+ /* Colors & Roles */
10
11
  --lemmo-page-background: #000000;
11
- --lemu-page-background: #000000;
12
- --page-foreground: #ffffff;
13
12
  --lemmo-page-foreground: #ffffff;
14
- --lemu-page-foreground: #ffffff;
15
- --surface-primary-background: #0c0c0c;
16
13
  --lemmo-surface-primary-background: #0c0c0c;
17
- --lemu-surface-primary-background: #0c0c0c;
18
- --surface-primary-foreground: #ffffff;
19
14
  --lemmo-surface-primary-foreground: #ffffff;
20
- --lemu-surface-primary-foreground: #ffffff;
21
- --surface-secondary-background: #161616;
22
15
  --lemmo-surface-secondary-background: #161616;
23
- --lemu-surface-secondary-background: #161616;
24
- --surface-secondary-foreground: #999999;
25
16
  --lemmo-surface-secondary-foreground: #999999;
26
- --lemu-surface-secondary-foreground: #999999;
27
- --surface-tertiary-background: #050505;
28
- --lemmo-surface-tertiary-background: #050505;
29
- --lemu-surface-tertiary-background: #050505;
30
- --surface-tertiary-foreground: #ffffff;
17
+ --lemmo-surface-tertiary-background: #040404;
31
18
  --lemmo-surface-tertiary-foreground: #ffffff;
32
- --lemu-surface-tertiary-foreground: #ffffff;
33
- --surface-elevated-background: #1e1e1e;
34
19
  --lemmo-surface-elevated-background: #1e1e1e;
35
- --lemu-surface-elevated-background: #1e1e1e;
36
- --surface-elevated-foreground: #ffffff;
37
20
  --lemmo-surface-elevated-foreground: #ffffff;
38
- --lemu-surface-elevated-foreground: #ffffff;
39
- --surface-glass-background: rgba(0, 0, 0, 0.92);
40
21
  --lemmo-surface-glass-background: rgba(0, 0, 0, 0.92);
41
- --lemu-surface-glass-background: rgba(0, 0, 0, 0.92);
42
- --surface-glass-foreground: #ffffff;
43
22
  --lemmo-surface-glass-foreground: #ffffff;
44
- --lemu-surface-glass-foreground: #ffffff;
45
- --surface-brand-background: #ffffff;
46
- --lemmo-surface-brand-background: #ffffff;
47
- --lemu-surface-brand-background: #ffffff;
48
- --surface-brand-foreground: #000000;
23
+ --lemmo-surface-brand-background: #d1fe17;
49
24
  --lemmo-surface-brand-foreground: #000000;
50
- --lemu-surface-brand-foreground: #000000;
51
- --text-primary: #ffffff;
52
25
  --lemmo-text-primary: #ffffff;
53
- --lemu-text-primary: #ffffff;
54
- --text-secondary: #999999;
55
26
  --lemmo-text-secondary: #999999;
56
- --lemu-text-secondary: #999999;
57
- --text-muted: #666666;
58
27
  --lemmo-text-muted: #666666;
59
- --lemu-text-muted: #666666;
60
- --text-faint: #444444;
61
28
  --lemmo-text-faint: #444444;
62
- --lemu-text-faint: #444444;
63
- --text-onBrand: #000000;
64
- --lemmo-text-onBrand: #000000;
65
- --lemu-text-onBrand: #000000;
66
- --text-reverted: #000000;
29
+ --lemmo-text-on-brand: #000000;
67
30
  --lemmo-text-reverted: #000000;
68
- --lemu-text-reverted: #000000;
69
- --text-danger: #ff4d4f;
70
- --lemmo-text-danger: #ff4d4f;
71
- --lemu-text-danger: #ff4d4f;
72
- --text-warning: #faad14;
73
- --lemmo-text-warning: #faad14;
74
- --lemu-text-warning: #faad14;
75
- --text-success: #52c41a;
76
- --lemmo-text-success: #52c41a;
77
- --lemu-text-success: #52c41a;
78
- --text-info: #1890ff;
79
- --lemmo-text-info: #1890ff;
80
- --lemu-text-info: #1890ff;
81
- --border-default: rgba(255, 255, 255, 0.2);
31
+ --lemmo-text-danger: #ff5462;
32
+ --lemmo-text-warning: #dfab01;
33
+ --lemmo-text-success: #4ee466;
34
+ --lemmo-text-info: #5b91fe;
82
35
  --lemmo-border-default: rgba(255, 255, 255, 0.2);
83
- --lemu-border-default: rgba(255, 255, 255, 0.2);
84
- --border-subtle: rgba(255, 255, 255, 0.08);
85
36
  --lemmo-border-subtle: rgba(255, 255, 255, 0.08);
86
- --lemu-border-subtle: rgba(255, 255, 255, 0.08);
87
- --border-mid: rgba(255, 255, 255, 0.12);
88
37
  --lemmo-border-mid: rgba(255, 255, 255, 0.12);
89
- --lemu-border-mid: rgba(255, 255, 255, 0.12);
90
- --border-danger: #ff4d4f;
91
- --lemmo-border-danger: #ff4d4f;
92
- --lemu-border-danger: #ff4d4f;
93
- --border-warning: #faad14;
94
- --lemmo-border-warning: #faad14;
95
- --lemu-border-warning: #faad14;
96
- --border-success: #52c41a;
97
- --lemmo-border-success: #52c41a;
98
- --lemu-border-success: #52c41a;
99
- --border-info: #1890ff;
100
- --lemmo-border-info: #1890ff;
101
- --lemu-border-info: #1890ff;
102
- --interactive-primary-background: #ffffff;
103
- --lemmo-interactive-primary-background: #ffffff;
104
- --lemu-interactive-primary-background: #ffffff;
105
- --interactive-primary-foreground: #000000;
38
+ --lemmo-border-danger: #fa0019;
39
+ --lemmo-border-warning: #dfab01;
40
+ --lemmo-border-success: #2eb844;
41
+ --lemmo-border-info: #0256fe;
42
+ --lemmo-interactive-primary-background: #d1fe17;
106
43
  --lemmo-interactive-primary-foreground: #000000;
107
- --lemu-interactive-primary-foreground: #000000;
108
- --interactive-primary-hover: #e6e6e6;
109
- --lemmo-interactive-primary-hover: #e6e6e6;
110
- --lemu-interactive-primary-hover: #e6e6e6;
111
- --interactive-secondary-background: #1f1f1f;
112
- --lemmo-interactive-secondary-background: #1f1f1f;
113
- --lemu-interactive-secondary-background: #1f1f1f;
114
- --interactive-secondary-foreground: #ffffff;
44
+ --lemmo-interactive-primary-hover: #c4ee0b;
45
+ --lemmo-interactive-secondary-background: #0256fe;
115
46
  --lemmo-interactive-secondary-foreground: #ffffff;
116
- --lemu-interactive-secondary-foreground: #ffffff;
117
- --interactive-secondary-hover: #2a2a2a;
118
- --lemmo-interactive-secondary-hover: #2a2a2a;
119
- --lemu-interactive-secondary-hover: #2a2a2a;
120
- --status-danger-background: #2a0a0a;
121
- --lemmo-status-danger-background: #2a0a0a;
122
- --lemu-status-danger-background: #2a0a0a;
123
- --status-danger-foreground: #ff7875;
124
- --lemmo-status-danger-foreground: #ff7875;
125
- --lemu-status-danger-foreground: #ff7875;
126
- --status-danger-border: #ff4d4f;
127
- --lemmo-status-danger-border: #ff4d4f;
128
- --lemu-status-danger-border: #ff4d4f;
129
- --status-danger-glow: #ff4d4f;
130
- --lemmo-status-danger-glow: #ff4d4f;
131
- --lemu-status-danger-glow: #ff4d4f;
132
- --status-warning-background: #2b1d00;
133
- --lemmo-status-warning-background: #2b1d00;
134
- --lemu-status-warning-background: #2b1d00;
135
- --status-warning-foreground: #ffc53d;
136
- --lemmo-status-warning-foreground: #ffc53d;
137
- --lemu-status-warning-foreground: #ffc53d;
138
- --status-warning-border: #faad14;
139
- --lemmo-status-warning-border: #faad14;
140
- --lemu-status-warning-border: #faad14;
141
- --status-warning-glow: #faad14;
142
- --lemmo-status-warning-glow: #faad14;
143
- --lemu-status-warning-glow: #faad14;
144
- --status-success-background: #092b00;
145
- --lemmo-status-success-background: #092b00;
146
- --lemu-status-success-background: #092b00;
147
- --status-success-foreground: #73d13d;
148
- --lemmo-status-success-foreground: #73d13d;
149
- --lemu-status-success-foreground: #73d13d;
150
- --status-success-border: #52c41a;
151
- --lemmo-status-success-border: #52c41a;
152
- --lemu-status-success-border: #52c41a;
153
- --status-success-glow: #52c41a;
154
- --lemmo-status-success-glow: #52c41a;
155
- --lemu-status-success-glow: #52c41a;
156
- --status-info-background: #001d40;
157
- --lemmo-status-info-background: #001d40;
158
- --lemu-status-info-background: #001d40;
159
- --status-info-foreground: #40a9ff;
160
- --lemmo-status-info-foreground: #40a9ff;
161
- --lemu-status-info-foreground: #40a9ff;
162
- --status-info-border: #1890ff;
163
- --lemmo-status-info-border: #1890ff;
164
- --lemu-status-info-border: #1890ff;
165
- --status-info-glow: #1890ff;
166
- --lemmo-status-info-glow: #1890ff;
167
- --lemu-status-info-glow: #1890ff;
168
- --radius-base: 0px;
169
- --lemmo-radius-base: 0px;
170
- --lemu-radius-base: 0px;
47
+ --lemmo-interactive-secondary-hover: #245ef1;
48
+ --lemmo-status-danger-background: #5c000f;
49
+ --lemmo-status-danger-foreground: #ff5462;
50
+ --lemmo-status-danger-border: #fa0019;
51
+ --lemmo-status-danger-glow: #ff1f2e;
52
+ --lemmo-status-warning-background: #523f00;
53
+ --lemmo-status-warning-foreground: #ffef33;
54
+ --lemmo-status-warning-border: #dfab01;
55
+ --lemmo-status-warning-glow: #fff05a;
56
+ --lemmo-status-success-background: #0d4a17;
57
+ --lemmo-status-success-foreground: #4ee466;
58
+ --lemmo-status-success-border: #2eb844;
59
+ --lemmo-status-success-glow: #00e62e;
60
+ --lemmo-status-info-background: #000d26;
61
+ --lemmo-status-info-foreground: #5b91fe;
62
+ --lemmo-status-info-border: #0256fe;
63
+ --lemmo-status-info-glow: #3cd8ff;
64
+
65
+ /* Radius Base */
66
+ --lemmo-radius-base: .5rem;
67
+
68
+ /* Per-Theme Gradients */
69
+ --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%), #1e1e1e;
70
+ --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%), #1e1e1e;
71
+ --lemmo-gradient-surface-olive: linear-gradient(180deg, #1F2022 0%, #222420 55%, #272A20 100%);
72
+ --lemmo-gradient-surface-ocean: linear-gradient(180deg, #121D23 0%, #152026 45%, #1D282E 75%, #273238 100%);
73
+ --lemmo-gradient-surface-steel: linear-gradient(180deg, #1F2024 0%, #232428 40%, #343539 75%, #48494D 100%);
74
+ --lemmo-gradient-surface-base: linear-gradient(180deg, #0c0c0c 0%, #000000 100%);
75
+ --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, #0c0c0c 0%, #000000 100%);
76
+ --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, #0c0c0c 0%, #000000 100%);
77
+ --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, #0c0c0c 0%, #000000 100%);
78
+ --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, #0c0c0c 0%, #000000 100%);
79
+ --lemmo-gradient-surface-steel-flat: linear-gradient(180deg, rgba(110, 145, 188, 0.02) 0%, rgba(110, 145, 188, 0.20) 100%), #0c0c0c;
80
+ --lemmo-gradient-surface-plain: linear-gradient(180deg, #0c0c0c 0%, #000000 100%);
81
+ --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%);
82
+ --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%);
83
+ --lemmo-gradient-border-pink: radial-gradient(86.59% 115.91% at 50% 45.45%, #fb398c 0%, #ed1572 100%);
84
+ --lemmo-gradient-border-blue: radial-gradient(86.59% 115.91% at 50% 45.45%, #245ef1 0%, #1544ed 100%);
85
+ --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%);
86
+ --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;
87
+ --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%);
88
+ --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%);
89
+ --lemmo-gradient-offer-base: radial-gradient(120% 90% at 50% 0%, #55142c 0%, #35101d 38%, #1e0c14 70%, #140a0f 100%);
90
+ --lemmo-gradient-offer-flash: linear-gradient(0deg, rgba(255, 0, 91, 0.32) 0%, rgba(255, 0, 91, 0.016) 100%), linear-gradient(90deg, #040404 0%, #040404 100%);
91
+ --lemmo-gradient-offer-dots: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.08) 1px, rgba(209, 254, 23, 0) 0);
92
+ --lemmo-gradient-offer-combo: linear-gradient(135deg, #ff005b 0%, #d1004e 40%, #8b006a 100%);
93
+ --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.08);
94
+ --lemmo-gradient-overlay-darken: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
171
95
  }
package/dist/css/themes/neon.css CHANGED
@@ -1,171 +1,95 @@
1
1
  /**
2
- * @lemmo-lab/tokens - NEON Theme Preset
3
- * Auto-generated by Style Dictionary pipeline. DO NOT EDIT DIRECTLY.
2
+ * @lemmo-lab/tokens (v2) - NEON Theme Preset
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
  [data-theme='neon'],
7
8
  :root[data-theme='neon'],
8
9
  .theme-neon {
9
- --page-background: #08090a;
10
+ /* Colors & Roles */
10
11
  --lemmo-page-background: #08090a;
11
- --lemu-page-background: #08090a;
12
- --page-foreground: #f0f6fc;
13
12
  --lemmo-page-foreground: #f0f6fc;
14
- --lemu-page-foreground: #f0f6fc;
15
- --surface-primary-background: #12151a;
16
13
  --lemmo-surface-primary-background: #12151a;
17
- --lemu-surface-primary-background: #12151a;
18
- --surface-primary-foreground: #f0f6fc;
19
14
  --lemmo-surface-primary-foreground: #f0f6fc;
20
- --lemu-surface-primary-foreground: #f0f6fc;
21
- --surface-secondary-background: #181c24;
22
15
  --lemmo-surface-secondary-background: #181c24;
23
- --lemu-surface-secondary-background: #181c24;
24
- --surface-secondary-foreground: #9db1c5;
25
16
  --lemmo-surface-secondary-foreground: #9db1c5;
26
- --lemu-surface-secondary-foreground: #9db1c5;
27
- --surface-tertiary-background: #060708;
28
- --lemmo-surface-tertiary-background: #060708;
29
- --lemu-surface-tertiary-background: #060708;
30
- --surface-tertiary-foreground: #f0f6fc;
17
+ --lemmo-surface-tertiary-background: #040506;
31
18
  --lemmo-surface-tertiary-foreground: #f0f6fc;
32
- --lemu-surface-tertiary-foreground: #f0f6fc;
33
- --surface-elevated-background: #1c212b;
34
19
  --lemmo-surface-elevated-background: #1c212b;
35
- --lemu-surface-elevated-background: #1c212b;
36
- --surface-elevated-foreground: #f0f6fc;
37
20
  --lemmo-surface-elevated-foreground: #f0f6fc;
38
- --lemu-surface-elevated-foreground: #f0f6fc;
39
- --surface-glass-background: rgba(8, 9, 10, 0.9);
40
21
  --lemmo-surface-glass-background: rgba(8, 9, 10, 0.9);
41
- --lemu-surface-glass-background: rgba(8, 9, 10, 0.9);
42
- --surface-glass-foreground: #f0f6fc;
43
22
  --lemmo-surface-glass-foreground: #f0f6fc;
44
- --lemu-surface-glass-foreground: #f0f6fc;
45
- --surface-brand-background: #00ff66;
46
23
  --lemmo-surface-brand-background: #00ff66;
47
- --lemu-surface-brand-background: #00ff66;
48
- --surface-brand-foreground: #000000;
49
- --lemmo-surface-brand-foreground: #000000;
50
- --lemu-surface-brand-foreground: #000000;
51
- --text-primary: #f0f6fc;
24
+ --lemmo-surface-brand-foreground: #131517;
52
25
  --lemmo-text-primary: #f0f6fc;
53
- --lemu-text-primary: #f0f6fc;
54
- --text-secondary: #9db1c5;
55
26
  --lemmo-text-secondary: #9db1c5;
56
- --lemu-text-secondary: #9db1c5;
57
- --text-muted: #697e94;
58
27
  --lemmo-text-muted: #697e94;
59
- --lemu-text-muted: #697e94;
60
- --text-faint: #465668;
61
28
  --lemmo-text-faint: #465668;
62
- --lemu-text-faint: #465668;
63
- --text-onBrand: #000000;
64
- --lemmo-text-onBrand: #000000;
65
- --lemu-text-onBrand: #000000;
66
- --text-reverted: #000000;
67
- --lemmo-text-reverted: #000000;
68
- --lemu-text-reverted: #000000;
69
- --text-danger: #ff0055;
70
- --lemmo-text-danger: #ff0055;
71
- --lemu-text-danger: #ff0055;
72
- --text-warning: #ffcc00;
73
- --lemmo-text-warning: #ffcc00;
74
- --lemu-text-warning: #ffcc00;
75
- --text-success: #00ff88;
76
- --lemmo-text-success: #00ff88;
77
- --lemu-text-success: #00ff88;
78
- --text-info: #00f0ff;
29
+ --lemmo-text-on-brand: #131517;
30
+ --lemmo-text-reverted: #ffffff;
31
+ --lemmo-text-danger: #ff007f;
32
+ --lemmo-text-warning: #ffef33;
33
+ --lemmo-text-success: #00ff66;
79
34
  --lemmo-text-info: #00f0ff;
80
- --lemu-text-info: #00f0ff;
81
- --border-default: rgba(0, 240, 255, 0.45);
82
35
  --lemmo-border-default: rgba(0, 240, 255, 0.45);
83
- --lemu-border-default: rgba(0, 240, 255, 0.45);
84
- --border-subtle: rgba(0, 240, 255, 0.15);
85
36
  --lemmo-border-subtle: rgba(0, 240, 255, 0.15);
86
- --lemu-border-subtle: rgba(0, 240, 255, 0.15);
87
- --border-mid: rgba(0, 240, 255, 0.25);
88
37
  --lemmo-border-mid: rgba(0, 240, 255, 0.25);
89
- --lemu-border-mid: rgba(0, 240, 255, 0.25);
90
- --border-danger: #ff0055;
91
- --lemmo-border-danger: #ff0055;
92
- --lemu-border-danger: #ff0055;
93
- --border-warning: #ffcc00;
94
- --lemmo-border-warning: #ffcc00;
95
- --lemu-border-warning: #ffcc00;
96
- --border-success: #00ff88;
97
- --lemmo-border-success: #00ff88;
98
- --lemu-border-success: #00ff88;
99
- --border-info: #00f0ff;
38
+ --lemmo-border-danger: #ff007f;
39
+ --lemmo-border-warning: #dfab01;
40
+ --lemmo-border-success: #00ff66;
100
41
  --lemmo-border-info: #00f0ff;
101
- --lemu-border-info: #00f0ff;
102
- --interactive-primary-background: #00ff66;
103
42
  --lemmo-interactive-primary-background: #00ff66;
104
- --lemu-interactive-primary-background: #00ff66;
105
- --interactive-primary-foreground: #000000;
106
- --lemmo-interactive-primary-foreground: #000000;
107
- --lemu-interactive-primary-foreground: #000000;
108
- --interactive-primary-hover: #33ff85;
109
- --lemmo-interactive-primary-hover: #33ff85;
110
- --lemu-interactive-primary-hover: #33ff85;
111
- --interactive-secondary-background: #00f0ff;
43
+ --lemmo-interactive-primary-foreground: #131517;
44
+ --lemmo-interactive-primary-hover: #c4ee0b;
112
45
  --lemmo-interactive-secondary-background: #00f0ff;
113
- --lemu-interactive-secondary-background: #00f0ff;
114
- --interactive-secondary-foreground: #000000;
115
- --lemmo-interactive-secondary-foreground: #000000;
116
- --lemu-interactive-secondary-foreground: #000000;
117
- --interactive-secondary-hover: #4df4ff;
118
- --lemmo-interactive-secondary-hover: #4df4ff;
119
- --lemu-interactive-secondary-hover: #4df4ff;
120
- --status-danger-background: rgba(255, 0, 85, 0.15);
121
- --lemmo-status-danger-background: rgba(255, 0, 85, 0.15);
122
- --lemu-status-danger-background: rgba(255, 0, 85, 0.15);
123
- --status-danger-foreground: #ff3377;
124
- --lemmo-status-danger-foreground: #ff3377;
125
- --lemu-status-danger-foreground: #ff3377;
126
- --status-danger-border: #ff0055;
127
- --lemmo-status-danger-border: #ff0055;
128
- --lemu-status-danger-border: #ff0055;
129
- --status-danger-glow: #ff0055;
130
- --lemmo-status-danger-glow: #ff0055;
131
- --lemu-status-danger-glow: #ff0055;
132
- --status-warning-background: rgba(255, 204, 0, 0.15);
133
- --lemmo-status-warning-background: rgba(255, 204, 0, 0.15);
134
- --lemu-status-warning-background: rgba(255, 204, 0, 0.15);
135
- --status-warning-foreground: #ffdd33;
136
- --lemmo-status-warning-foreground: #ffdd33;
137
- --lemu-status-warning-foreground: #ffdd33;
138
- --status-warning-border: #ffcc00;
139
- --lemmo-status-warning-border: #ffcc00;
140
- --lemu-status-warning-border: #ffcc00;
141
- --status-warning-glow: #ffcc00;
142
- --lemmo-status-warning-glow: #ffcc00;
143
- --lemu-status-warning-glow: #ffcc00;
144
- --status-success-background: rgba(0, 255, 136, 0.15);
145
- --lemmo-status-success-background: rgba(0, 255, 136, 0.15);
146
- --lemu-status-success-background: rgba(0, 255, 136, 0.15);
147
- --status-success-foreground: #33ffa3;
148
- --lemmo-status-success-foreground: #33ffa3;
149
- --lemu-status-success-foreground: #33ffa3;
150
- --status-success-border: #00ff88;
151
- --lemmo-status-success-border: #00ff88;
152
- --lemu-status-success-border: #00ff88;
153
- --status-success-glow: #00ff88;
154
- --lemmo-status-success-glow: #00ff88;
155
- --lemu-status-success-glow: #00ff88;
156
- --status-info-background: rgba(0, 240, 255, 0.15);
157
- --lemmo-status-info-background: rgba(0, 240, 255, 0.15);
158
- --lemu-status-info-background: rgba(0, 240, 255, 0.15);
159
- --status-info-foreground: #4df4ff;
160
- --lemmo-status-info-foreground: #4df4ff;
161
- --lemu-status-info-foreground: #4df4ff;
162
- --status-info-border: #00f0ff;
46
+ --lemmo-interactive-secondary-foreground: #131517;
47
+ --lemmo-interactive-secondary-hover: #9ce6f3;
48
+ --lemmo-status-danger-background: #5c000f;
49
+ --lemmo-status-danger-foreground: #ff5462;
50
+ --lemmo-status-danger-border: #ff007f;
51
+ --lemmo-status-danger-glow: #ff007f;
52
+ --lemmo-status-warning-background: #523f00;
53
+ --lemmo-status-warning-foreground: #ffef33;
54
+ --lemmo-status-warning-border: #dfab01;
55
+ --lemmo-status-warning-glow: #fff05a;
56
+ --lemmo-status-success-background: #0d4a17;
57
+ --lemmo-status-success-foreground: #00ff66;
58
+ --lemmo-status-success-border: #00ff66;
59
+ --lemmo-status-success-glow: #00ff66;
60
+ --lemmo-status-info-background: #000d26;
61
+ --lemmo-status-info-foreground: #00f0ff;
163
62
  --lemmo-status-info-border: #00f0ff;
164
- --lemu-status-info-border: #00f0ff;
165
- --status-info-glow: #00f0ff;
166
63
  --lemmo-status-info-glow: #00f0ff;
167
- --lemu-status-info-glow: #00f0ff;
168
- --radius-base: .25rem;
169
- --lemmo-radius-base: .25rem;
170
- --lemu-radius-base: .25rem;
64
+
65
+ /* Radius Base */
66
+ --lemmo-radius-base: .5rem;
67
+
68
+ /* Per-Theme Gradients */
69
+ --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%), #1c212b;
70
+ --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%), #1c212b;
71
+ --lemmo-gradient-surface-olive: linear-gradient(180deg, #1F2022 0%, #222420 55%, #272A20 100%);
72
+ --lemmo-gradient-surface-ocean: linear-gradient(180deg, #121D23 0%, #152026 45%, #1D282E 75%, #273238 100%);
73
+ --lemmo-gradient-surface-steel: linear-gradient(180deg, #1F2024 0%, #232428 40%, #343539 75%, #48494D 100%);
74
+ --lemmo-gradient-surface-base: linear-gradient(180deg, #12151a 0%, #08090a 100%);
75
+ --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, #12151a 0%, #08090a 100%);
76
+ --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, #12151a 0%, #08090a 100%);
77
+ --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, #12151a 0%, #08090a 100%);
78
+ --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, #12151a 0%, #08090a 100%);
79
+ --lemmo-gradient-surface-steel-flat: linear-gradient(180deg, rgba(110, 145, 188, 0.02) 0%, rgba(110, 145, 188, 0.20) 100%), #12151a;
80
+ --lemmo-gradient-surface-plain: linear-gradient(180deg, #12151a 0%, #08090a 100%);
81
+ --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%);
82
+ --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%);
83
+ --lemmo-gradient-border-pink: radial-gradient(86.59% 115.91% at 50% 45.45%, #ff007f 0%, #ed1572 100%);
84
+ --lemmo-gradient-border-blue: radial-gradient(86.59% 115.91% at 50% 45.45%, #00f0ff 0%, #1544ed 100%);
85
+ --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, #00ff66 0%, #00ff66 100%);
86
+ --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%), #00f0ff;
87
+ --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, #00f0ff 0%, #00f0ff 100%);
88
+ --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, #ff007f 0%, #ff007f 100%);
89
+ --lemmo-gradient-offer-base: radial-gradient(120% 90% at 50% 0%, #55142c 0%, #35101d 38%, #1e0c14 70%, #140a0f 100%);
90
+ --lemmo-gradient-offer-flash: linear-gradient(0deg, rgba(255, 0, 91, 0.32) 0%, rgba(255, 0, 91, 0.016) 100%), linear-gradient(90deg, #040506 0%, #040506 100%);
91
+ --lemmo-gradient-offer-dots: radial-gradient(circle at 1px 1px, rgba(0, 240, 255, 0.15) 1px, rgba(209, 254, 23, 0) 0);
92
+ --lemmo-gradient-offer-combo: linear-gradient(135deg, #ff007f 0%, #d1004e 40%, #8b006a 100%);
93
+ --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(0, 240, 255, 0.15);
94
+ --lemmo-gradient-overlay-darken: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
171
95
  }