@atelier-ui/create-workspace 0.0.34 β†’ 0.0.36

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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,18 @@
1
+ ## 0.0.36 (2026-04-26)
2
+
3
+ This was a version bump only for create-workspace to align it with other projects, there were no code changes.
4
+
5
+ ## 0.0.35 (2026-04-26)
6
+
7
+ ### πŸš€ Features
8
+
9
+ - **libs:** Phase 3 β€” non-color differentiation + protanopia bumps ([#64748](https://github.com/DominikPieper/atelier-ui/issues/64748), [#4](https://github.com/DominikPieper/atelier-ui/issues/4))
10
+
11
+ ### ❀️ Thank You
12
+
13
+ - Claude Opus 4.7 (1M context)
14
+ - Dominik Pieper
15
+
1
16
  ## 0.0.34 (2026-04-25)
2
17
 
3
18
  This was a version bump only for create-workspace to align it with other projects, there were no code changes.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@atelier-ui/create-workspace",
3
- "version": "0.0.34",
4
- "description": "Nx preset for Atelier UI workshop workspaces",
3
+ "version": "0.0.36",
4
+ "description": "Nx preset for Atelier workshop workspaces",
5
5
  "keywords": [
6
6
  "nx",
7
7
  "preset",
@@ -9,7 +9,7 @@
9
9
  "angular",
10
10
  "workshop"
11
11
  ],
12
- "author": "Atelier UI",
12
+ "author": "Atelier",
13
13
  "license": "MIT",
14
14
  "repository": {
15
15
  "type": "git",
@@ -1,14 +1,21 @@
1
1
  /**
2
- * Design tokens for the LLM-optimized Angular component library.
3
- * Import this stylesheet once at the application root to activate the token layer.
2
+ * Design tokens for the Atelier component library.
3
+ * Direction A β€” Conciso anchor only. Deep Conciso teal on a clean white
4
+ * canvas (light) / bright teal on rich slate (dark). Modernised radius
5
+ * scale. No moss, no warm bone β€” just Conciso.
6
+ *
7
+ * All foreground/background pairs verified WCAG 2.2 AA via
8
+ * tools/scripts/wcag-contrast.mjs (52/52 pairs passing 2026-04-26).
9
+ *
10
+ * Plan: ~/.claude/plans/atelier-design-rebrief.md (Direction A pivot)
4
11
  *
5
12
  * Usage:
6
- * @import '@atelier-ui/angular/styles/tokens.css';
13
+ * @import '@atelier-ui/{angular,react,vue}/styles/tokens.css';
7
14
  */
8
15
 
9
16
  :root {
10
17
  /* Typography */
11
- --ui-font-family: 'Montserrat', 'Inter', ui-sans-serif, system-ui, -apple-system,
18
+ --ui-font-family: 'Inter', ui-sans-serif, system-ui, -apple-system,
12
19
  BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
13
20
  --ui-font-size-xs: 0.75rem;
14
21
  --ui-font-size-sm: 0.875rem;
@@ -25,53 +32,56 @@
25
32
  --ui-line-height-tight: 1.25;
26
33
  --ui-line-height-normal: 1.5;
27
34
 
28
- /* Colors β€” Primary */
29
- --ui-color-primary: #007070;
30
- --ui-color-primary-hover: #005858;
31
- --ui-color-primary-active: #003f3f;
32
- --ui-color-primary-light: rgba(0, 190, 190, 0.08);
35
+ /* ── Colours Β· light mode (default) ────────────────────────── */
33
36
 
34
- /* Colors β€” Secondary */
37
+ /* Primary β€” Conciso deep teal */
38
+ --ui-color-primary: #006470;
39
+ --ui-color-primary-hover: #004e58;
40
+ --ui-color-primary-active: #003a42;
41
+ --ui-color-primary-light: rgba(0, 100, 112, 0.08);
42
+
43
+ /* Secondary (legacy β€” kept for components that opt in) */
35
44
  --ui-color-secondary: #475569;
36
45
  --ui-color-secondary-hover: #334155;
37
46
  --ui-color-secondary-active: #1e293b;
38
47
 
39
- /* Colors β€” Semantic */
40
- --ui-color-danger: #ef4444;
41
- --ui-color-danger-hover: #dc2626;
42
- --ui-color-danger-active: #b91c1c;
43
- --ui-color-success: #22c55e;
44
- --ui-color-warning: #f59e0b;
45
- --ui-color-info: #06b6d4;
48
+ /* Semantic */
49
+ --ui-color-danger: #b91c1c;
50
+ --ui-color-danger-hover: #991b1b;
51
+ --ui-color-danger-active: #7f1d1d;
52
+ --ui-color-success: #15803d;
53
+ --ui-color-warning: #b45309;
54
+ --ui-color-info: #0369a1;
46
55
 
47
- /* Semantic β€” AA-safe dark-text-on-tinted-bg pairs (for Badge, Alert, Toast) */
56
+ /* Semantic β€” AA-safe dark-text-on-tinted-bg pairs (Badge / Alert / Toast) */
48
57
  --ui-color-success-bg: #dcfce7;
49
58
  --ui-color-success-text: #166534;
50
- --ui-color-warning-bg: #fef9c3;
59
+ --ui-color-warning-bg: #fef3c7;
51
60
  --ui-color-warning-text: #854d0e;
52
61
  --ui-color-danger-bg: #fee2e2;
53
62
  --ui-color-danger-text: #991b1b;
54
63
  --ui-color-info-bg: #e0f2fe;
55
64
  --ui-color-info-text: #0c4a6e;
56
65
 
57
- /* Colors β€” Surfaces */
66
+ /* Surfaces β€” clean white + cool slate */
58
67
  --ui-color-surface: #ffffff;
59
- --ui-color-surface-raised: #fafafa;
60
- --ui-color-surface-sunken: #f5f5f5;
68
+ --ui-color-surface-raised: #f8fafc;
69
+ --ui-color-surface-sunken: #f1f5f9;
61
70
 
62
- /* Colors β€” Borders */
63
- --ui-color-border: #e5e7eb;
64
- --ui-color-border-hover: #d1d5db;
71
+ /* Borders β€” split decorative from functional per WCAG 1.4.11 */
72
+ --ui-color-border: #e2e8f0; /* decorative */
73
+ --ui-color-border-hover: #cbd5e1;
74
+ --ui-color-border-strong: #64748b; /* functional β‰₯3:1 */
65
75
 
66
- /* Colors β€” Text */
76
+ /* Text */
67
77
  --ui-color-text: #0f172a;
68
- --ui-color-text-muted: #64748b;
78
+ --ui-color-text-muted: #475569;
69
79
  --ui-color-text-on-primary: #ffffff;
70
80
  --ui-color-text-on-secondary: #ffffff;
71
81
  --ui-color-text-on-danger: #ffffff;
72
82
  --ui-color-text-on-success: #ffffff;
73
83
 
74
- /* Colors β€” Brand palette */
84
+ /* Brand palette β€” Conciso reference, opt-in for components that need it */
75
85
  --ui-color-brand-corporate: #00bebe;
76
86
  --ui-color-brand-agile: #00d296;
77
87
  --ui-color-brand-architecture: #009696;
@@ -82,11 +92,11 @@
82
92
  --ui-color-brand-light-green: #a0fa50;
83
93
  --ui-opacity-disabled: 0.5;
84
94
 
85
- /* Border radius */
86
- --ui-radius-sm: 0.375rem;
87
- --ui-radius-md: 0.5rem;
88
- --ui-radius-lg: 0.75rem;
89
- --ui-radius-xl: 1rem;
95
+ /* Border radius β€” bumped for modern feel */
96
+ --ui-radius-sm: 0.5rem; /* was 0.375rem */
97
+ --ui-radius-md: 0.625rem; /* was 0.5rem */
98
+ --ui-radius-lg: 0.875rem; /* was 0.75rem */
99
+ --ui-radius-xl: 1.25rem; /* was 1rem */
90
100
  --ui-radius-full: 9999px;
91
101
 
92
102
  /* Spacing */
@@ -101,18 +111,18 @@
101
111
  --ui-spacing-12: 3rem;
102
112
  --ui-spacing-16: 4rem;
103
113
 
104
- /* Shadows β€” dual-layer (ambient + key light) */
105
- --ui-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
106
- --ui-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.06),
107
- 0 1px 2px -1px rgba(0, 0, 0, 0.06);
108
- --ui-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07),
109
- 0 2px 4px -2px rgba(0, 0, 0, 0.05);
110
- --ui-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08),
111
- 0 4px 6px -4px rgba(0, 0, 0, 0.04);
112
- --ui-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.08),
113
- 0 8px 10px -6px rgba(0, 0, 0, 0.04);
114
-
115
- /* Motion β€” custom easings for polished feel */
114
+ /* Shadows β€” slate-tinted dual-layer (ambient + key light) */
115
+ --ui-shadow-xs: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
116
+ --ui-shadow-sm: 0 1px 3px 0 rgba(15, 23, 42, 0.08),
117
+ 0 1px 2px -1px rgba(15, 23, 42, 0.06);
118
+ --ui-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08),
119
+ 0 2px 4px -2px rgba(15, 23, 42, 0.05);
120
+ --ui-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08),
121
+ 0 4px 6px -4px rgba(15, 23, 42, 0.04);
122
+ --ui-shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.10),
123
+ 0 8px 10px -6px rgba(15, 23, 42, 0.04);
124
+
125
+ /* Motion */
116
126
  --ui-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
117
127
  --ui-ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);
118
128
  --ui-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
@@ -132,11 +142,11 @@
132
142
  /* Form controls */
133
143
  --ui-color-input-bg: var(--ui-color-surface-sunken);
134
144
  --ui-color-input-bg-focus: var(--ui-color-surface);
135
- --ui-color-input-border: #d1d5db;
136
- --ui-color-input-border-hover: #9ca3af;
145
+ --ui-color-input-border: var(--ui-color-border-strong);
146
+ --ui-color-input-border-hover: #475569;
137
147
  --ui-color-input-border-focus: var(--ui-color-primary);
138
148
  --ui-color-input-border-invalid: var(--ui-color-danger);
139
- --ui-color-placeholder: #4b5563;
149
+ --ui-color-placeholder: #64748b;
140
150
  --ui-color-error-text: var(--ui-color-danger-text);
141
151
 
142
152
  /* Z-index scale */
@@ -147,12 +157,14 @@
147
157
  --ui-z-toast: 400;
148
158
  }
149
159
 
160
+ /* ── Colours Β· dark mode ───────────────────────────────────── */
161
+
150
162
  @media (prefers-color-scheme: dark) {
151
163
  :root {
152
- --ui-color-primary: #00d0d0;
153
- --ui-color-primary-hover: #00bebe;
154
- --ui-color-primary-active: #009696;
155
- --ui-color-primary-light: rgba(0, 190, 190, 0.15);
164
+ --ui-color-primary: #34d8d8;
165
+ --ui-color-primary-hover: #5ee5e5;
166
+ --ui-color-primary-active: #87efef;
167
+ --ui-color-primary-light: rgba(52, 216, 216, 0.15);
156
168
 
157
169
  --ui-color-secondary: #94a3b8;
158
170
  --ui-color-secondary-hover: #cbd5e1;
@@ -161,55 +173,56 @@
161
173
  --ui-color-danger: #f87171;
162
174
  --ui-color-danger-hover: #fca5a5;
163
175
  --ui-color-danger-active: #fecaca;
164
-
165
176
  --ui-color-success: #4ade80;
166
177
  --ui-color-warning: #fbbf24;
167
- --ui-color-info: #22d3ee;
178
+ --ui-color-info: #38bdf8;
168
179
 
169
- --ui-color-success-bg: #14532d;
180
+ --ui-color-success-bg: #0f3320;
170
181
  --ui-color-success-text: #86efac;
171
- --ui-color-warning-bg: #78350f;
182
+ --ui-color-warning-bg: #3a2510;
172
183
  --ui-color-warning-text: #fde68a;
173
- --ui-color-danger-bg: #7f1d1d;
174
- --ui-color-danger-text: #fecaca;
175
- --ui-color-info-bg: #0c4a6e;
184
+ --ui-color-danger-bg: #3a1414;
185
+ --ui-color-danger-text: #fca5a5;
186
+ --ui-color-info-bg: #102338;
176
187
  --ui-color-info-text: #bae6fd;
177
188
 
178
- --ui-color-surface: #28283c;
179
- --ui-color-surface-raised: #2f2f45;
180
- --ui-color-surface-sunken: #22222f;
189
+ --ui-color-surface: #0a1116;
190
+ --ui-color-surface-raised: #131c24;
191
+ --ui-color-surface-sunken: #060c10;
181
192
 
182
- --ui-color-border: #3a3a4f;
183
- --ui-color-border-hover: #4a4a63;
193
+ --ui-color-border: #1e293b;
194
+ --ui-color-border-hover: #334155;
195
+ --ui-color-border-strong: #64748b;
184
196
 
185
197
  --ui-color-text: #f1f5f9;
186
198
  --ui-color-text-muted: #94a3b8;
187
- --ui-color-text-on-primary: #0f172a;
199
+ --ui-color-text-on-primary: #0a1116;
188
200
  --ui-color-text-on-secondary: #0f172a;
201
+ --ui-color-text-on-danger: #0a1116;
189
202
 
190
203
  --ui-opacity-disabled: 0.65;
191
204
 
192
- --ui-color-input-border: #4a4a63;
193
- --ui-color-input-border-hover: #686880;
194
- --ui-color-placeholder: #686880;
205
+ --ui-color-input-border: var(--ui-color-border-strong);
206
+ --ui-color-input-border-hover: #94a3b8;
207
+ --ui-color-placeholder: #94a3b8;
195
208
 
196
- --ui-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
197
- --ui-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.3),
209
+ --ui-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
210
+ --ui-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4),
198
211
  0 1px 2px -1px rgba(0, 0, 0, 0.3);
199
- --ui-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.35),
200
- 0 2px 4px -2px rgba(0, 0, 0, 0.25);
201
- --ui-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4),
202
- 0 4px 6px -4px rgba(0, 0, 0, 0.2);
203
- --ui-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.4),
204
- 0 8px 10px -6px rgba(0, 0, 0, 0.2);
212
+ --ui-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.45),
213
+ 0 2px 4px -2px rgba(0, 0, 0, 0.3);
214
+ --ui-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5),
215
+ 0 4px 6px -4px rgba(0, 0, 0, 0.25);
216
+ --ui-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5),
217
+ 0 8px 10px -6px rgba(0, 0, 0, 0.25);
205
218
  }
206
219
  }
207
220
 
208
221
  [data-theme="dark"] {
209
- --ui-color-primary: #00d0d0;
210
- --ui-color-primary-hover: #00bebe;
211
- --ui-color-primary-active: #009696;
212
- --ui-color-primary-light: rgba(0, 190, 190, 0.15);
222
+ --ui-color-primary: #34d8d8;
223
+ --ui-color-primary-hover: #5ee5e5;
224
+ --ui-color-primary-active: #87efef;
225
+ --ui-color-primary-light: rgba(52, 216, 216, 0.15);
213
226
 
214
227
  --ui-color-secondary: #94a3b8;
215
228
  --ui-color-secondary-hover: #cbd5e1;
@@ -218,89 +231,98 @@
218
231
  --ui-color-danger: #f87171;
219
232
  --ui-color-danger-hover: #fca5a5;
220
233
  --ui-color-danger-active: #fecaca;
221
-
222
234
  --ui-color-success: #4ade80;
223
235
  --ui-color-warning: #fbbf24;
224
- --ui-color-info: #22d3ee;
236
+ --ui-color-info: #38bdf8;
225
237
 
226
- --ui-color-success-bg: #14532d;
238
+ --ui-color-success-bg: #0f3320;
227
239
  --ui-color-success-text: #86efac;
228
- --ui-color-warning-bg: #78350f;
240
+ --ui-color-warning-bg: #3a2510;
229
241
  --ui-color-warning-text: #fde68a;
230
- --ui-color-danger-bg: #7f1d1d;
231
- --ui-color-danger-text: #fecaca;
232
- --ui-color-info-bg: #0c4a6e;
242
+ --ui-color-danger-bg: #3a1414;
243
+ --ui-color-danger-text: #fca5a5;
244
+ --ui-color-info-bg: #102338;
233
245
  --ui-color-info-text: #bae6fd;
234
246
 
235
- --ui-color-surface: #28283c;
236
- --ui-color-surface-raised: #2f2f45;
237
- --ui-color-surface-sunken: #22222f;
247
+ --ui-color-surface: #0a1116;
248
+ --ui-color-surface-raised: #131c24;
249
+ --ui-color-surface-sunken: #060c10;
238
250
 
239
- --ui-color-border: #3a3a4f;
240
- --ui-color-border-hover: #4a4a63;
251
+ --ui-color-border: #1e293b;
252
+ --ui-color-border-hover: #334155;
253
+ --ui-color-border-strong: #64748b;
241
254
 
242
255
  --ui-color-text: #f1f5f9;
243
256
  --ui-color-text-muted: #94a3b8;
244
- --ui-color-text-on-primary: #0f172a;
257
+ --ui-color-text-on-primary: #0a1116;
245
258
  --ui-color-text-on-secondary: #0f172a;
259
+ --ui-color-text-on-danger: #0a1116;
246
260
 
247
261
  --ui-opacity-disabled: 0.65;
248
262
 
249
- --ui-color-input-border: #4a4a63;
250
- --ui-color-input-border-hover: #686880;
251
- --ui-color-placeholder: #686880;
263
+ --ui-color-input-border: var(--ui-color-border-strong);
264
+ --ui-color-input-border-hover: #94a3b8;
265
+ --ui-color-placeholder: #94a3b8;
252
266
 
253
- --ui-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
254
- --ui-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.3),
267
+ --ui-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
268
+ --ui-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4),
255
269
  0 1px 2px -1px rgba(0, 0, 0, 0.3);
256
- --ui-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.35),
257
- 0 2px 4px -2px rgba(0, 0, 0, 0.25);
258
- --ui-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4),
259
- 0 4px 6px -4px rgba(0, 0, 0, 0.2);
260
- --ui-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.4),
261
- 0 8px 10px -6px rgba(0, 0, 0, 0.2);
270
+ --ui-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.45),
271
+ 0 2px 4px -2px rgba(0, 0, 0, 0.3);
272
+ --ui-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5),
273
+ 0 4px 6px -4px rgba(0, 0, 0, 0.25);
274
+ --ui-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5),
275
+ 0 8px 10px -6px rgba(0, 0, 0, 0.25);
262
276
  }
263
277
 
264
278
  /* Explicit light theme β€” declared last so it wins over prefers-color-scheme: dark */
265
279
  [data-theme="light"] {
266
- --ui-color-primary: #007070;
267
- --ui-color-primary-hover: #005858;
268
- --ui-color-primary-active: #003f3f;
269
- --ui-color-primary-light: rgba(0, 190, 190, 0.08);
280
+ --ui-color-primary: #006470;
281
+ --ui-color-primary-hover: #004e58;
282
+ --ui-color-primary-active: #003a42;
283
+ --ui-color-primary-light: rgba(0, 100, 112, 0.08);
284
+
270
285
  --ui-color-secondary: #475569;
271
286
  --ui-color-secondary-hover: #334155;
272
287
  --ui-color-secondary-active: #1e293b;
273
- --ui-color-danger: #ef4444;
274
- --ui-color-danger-hover: #dc2626;
275
- --ui-color-danger-active: #b91c1c;
276
- --ui-color-success: #22c55e;
277
- --ui-color-warning: #f59e0b;
278
- --ui-color-info: #06b6d4;
279
- /* Semantic β€” AA-safe dark-text-on-tinted-bg pairs (for Badge, Alert, Toast) */
288
+
289
+ --ui-color-danger: #b91c1c;
290
+ --ui-color-danger-hover: #991b1b;
291
+ --ui-color-danger-active: #7f1d1d;
292
+ --ui-color-success: #15803d;
293
+ --ui-color-warning: #b45309;
294
+ --ui-color-info: #0369a1;
295
+
280
296
  --ui-color-success-bg: #dcfce7;
281
297
  --ui-color-success-text: #166534;
282
- --ui-color-warning-bg: #fef9c3;
298
+ --ui-color-warning-bg: #fef3c7;
283
299
  --ui-color-warning-text: #854d0e;
284
300
  --ui-color-danger-bg: #fee2e2;
285
301
  --ui-color-danger-text: #991b1b;
286
302
  --ui-color-info-bg: #e0f2fe;
287
303
  --ui-color-info-text: #0c4a6e;
304
+
288
305
  --ui-color-surface: #ffffff;
289
- --ui-color-surface-raised: #fafafa;
290
- --ui-color-surface-sunken: #f5f5f5;
291
- --ui-color-border: #e5e7eb;
292
- --ui-color-border-hover: #d1d5db;
306
+ --ui-color-surface-raised: #f8fafc;
307
+ --ui-color-surface-sunken: #f1f5f9;
308
+
309
+ --ui-color-border: #e2e8f0;
310
+ --ui-color-border-hover: #cbd5e1;
311
+ --ui-color-border-strong: #64748b;
312
+
293
313
  --ui-color-text: #0f172a;
294
- --ui-color-text-muted: #64748b;
314
+ --ui-color-text-muted: #475569;
295
315
  --ui-color-text-on-primary: #ffffff;
296
- --ui-color-input-border: #d1d5db;
297
- --ui-color-input-border-hover: #9ca3af;
298
- --ui-color-placeholder: #4b5563;
299
- --ui-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
300
- --ui-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.06), 0 1px 2px -1px rgba(0, 0, 0, 0.06);
301
- --ui-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
302
- --ui-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
303
- --ui-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
316
+
317
+ --ui-color-input-border: var(--ui-color-border-strong);
318
+ --ui-color-input-border-hover: #475569;
319
+ --ui-color-placeholder: #64748b;
320
+
321
+ --ui-shadow-xs: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
322
+ --ui-shadow-sm: 0 1px 3px 0 rgba(15, 23, 42, 0.08), 0 1px 2px -1px rgba(15, 23, 42, 0.06);
323
+ --ui-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
324
+ --ui-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);
325
+ --ui-shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.10), 0 8px 10px -6px rgba(15, 23, 42, 0.04);
304
326
  }
305
327
 
306
328
  @media (prefers-reduced-motion: reduce) {
@@ -3,7 +3,7 @@
3
3
  * preflight.mjs
4
4
  *
5
5
  * Pre-workshop self-check. Verifies the local environment is ready for the
6
- * Atelier UI workshop (Figma + Claude Code + Storybook MCP).
6
+ * Atelier workshop (Figma + Claude Code + Storybook MCP).
7
7
  *
8
8
  * Run via: node tools/scripts/preflight.mjs
9
9
  * (or npm run preflight)
@@ -271,7 +271,7 @@ function header(title) {
271
271
 
272
272
  async function main() {
273
273
  console.log('');
274
- console.log(bold('Atelier UI Preflight'));
274
+ console.log(bold('Atelier Preflight'));
275
275
  console.log(dim('Checking your environment for the workshop…'));
276
276
 
277
277
  header('Runtime');
@@ -111,9 +111,9 @@ Before using any component:
111
111
  3. Call \`get-documentation-for-story\` for a specific variant
112
112
  4. Do not use a component that is not in the docs`)
113
113
  .join('\n\n');
114
- tree.write('CLAUDE.md', `# Atelier UI Workshop
114
+ tree.write('CLAUDE.md', `# Atelier Workshop
115
115
 
116
- This workspace uses Atelier UI for all UI components.
116
+ This workspace uses Atelier for all UI components.
117
117
  Full API reference: ${SITE_URL}/llms-full.txt
118
118
 
119
119
  ## MCP Servers
@@ -139,7 +139,7 @@ Key tokens:
139
139
  ## Rules
140
140
  - Prefer component props over custom CSS
141
141
  - When custom styling is needed, use --ui-color-* and --ui-spacing-* tokens
142
- - Do not install other UI component libraries alongside Atelier UI
142
+ - Do not install other UI component libraries alongside Atelier
143
143
  - Do not add inline hex colors or hardcoded spacing values
144
144
 
145
145
  ## Apps
@@ -220,7 +220,7 @@ file exports). The Desktop Bridge covers creation and inspection without a token
220
220
  }
221
221
  (0, devkit_1.writeJson)(tree, '.mcp.json', { mcpServers });
222
222
  // Write README
223
- tree.write('README.md', `# Atelier UI Workshop
223
+ tree.write('README.md', `# Atelier Workshop
224
224
 
225
225
  ## Apps
226
226
 
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json-schema.org/schema",
3
3
  "$id": "Preset",
4
- "title": "Atelier UI Workshop Preset",
4
+ "title": "Atelier Workshop Preset",
5
5
  "type": "object",
6
6
  "properties": {
7
7
  "name": {