@db-vincent/tokens 0.0.0-stage → 0.1.1

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 (7) hide show
  1. package/package.json +22 -4
  2. package/tokens/tokens.css +1336 -0
  3. package/tokens/tokens.json +1627 -0
  4. package/tokens/tokens.scss +120 -0
  5. package/tokens/tokens.ts +912 -0
  6. package/tokens/utilities.css +181 -0
  7. package/README.md +0 -3
package/tokens/tokens.ts ADDED
@@ -0,0 +1,912 @@
1
+ // GENERATED FILE - do not edit. Source of truth: internal/scripts/build-tokens.py
2
+ // Minerva Blue Metallic #1383DA. OKLCH source, hex output.
3
+
4
+ export const palette = {
5
+ blue: { "50": "#EEF7FF", "100": "#DAEEFF", "200": "#B6D8FB", "300": "#8DC0F2", "400": "#55A1E8", "500": "#1383DA", "600": "#006FBD", "700": "#005CA1", "800": "#024679", "900": "#053256", "950": "#041E35" },
6
+ neutral: { "0": "#FFFFFF", "50": "#F7F9FC", "100": "#EDF1F5", "200": "#DCE2E8", "300": "#C5CDD6", "400": "#9CA6B0", "500": "#7C8893", "600": "#616C77", "700": "#424B55", "800": "#2C343C", "900": "#232A31", "950": "#1A1F24", "1000": "#101419", "1050": "#080C0F", "1100": "#040608" },
7
+ green: { "50": "#EAFAEC", "100": "#D1F2D7", "200": "#A6DEB1", "300": "#73C385", "400": "#3AA85B", "500": "#0E8C41", "600": "#007531", "700": "#005B23", "800": "#004218", "900": "#002D0E", "950": "#011A07" },
8
+ amber: { "50": "#FFF5E1", "100": "#FFE7BB", "200": "#FED081", "300": "#F7B83D", "400": "#E9A200", "500": "#D58F00", "600": "#B17600", "700": "#895C00", "800": "#644400", "900": "#452E00", "950": "#291A00" },
9
+ red: { "50": "#FFF0EE", "100": "#FFDCD7", "200": "#FFBEB6", "300": "#FF9890", "400": "#F66D67", "500": "#DB4241", "600": "#BA2B2E", "700": "#971A20", "800": "#721216", "900": "#4F0A0D", "950": "#2F0405" },
10
+ } as const;
11
+
12
+ export type ColorFamily = keyof typeof palette;
13
+
14
+ export const semanticLight = {
15
+ "canvas": "#F7F9FC",
16
+ "surface": "#FFFFFF",
17
+ "surface-raised": "#FFFFFF",
18
+ "surface-sunken": "#EDF1F5",
19
+ "overlay": "#FFFFFF",
20
+ "text-primary": "#1A1F24",
21
+ "text-secondary": "#424B55",
22
+ "text-tertiary": "#616C77",
23
+ "text-inverse": "#F7F9FC",
24
+ "link": "#005CA1",
25
+ "link-hover": "#024679",
26
+ "accent": "#1383DA",
27
+ "accent-hover": "#55A1E8",
28
+ "accent-active": "#006FBD",
29
+ "accent-on": "#FFFFFF",
30
+ "accent-strong": "#005CA1",
31
+ "accent-strong-hover": "#024679",
32
+ "accent-strong-active": "#053256",
33
+ "accent-strong-fg": "#FFFFFF",
34
+ "accent-subtle": "#EEF7FF",
35
+ "accent-subtle-hover": "#DAEEFF",
36
+ "accent-subtle-fg": "#005CA1",
37
+ "success": "#005B23",
38
+ "success-bg": "#EAFAEC",
39
+ "success-bg-hover": "#D1F2D7",
40
+ "success-fg": "#004218",
41
+ "warning": "#895C00",
42
+ "warning-bg": "#FFF5E1",
43
+ "warning-bg-hover": "#FFE7BB",
44
+ "warning-fg": "#644400",
45
+ "danger": "#BA2B2E",
46
+ "danger-bg": "#FFF0EE",
47
+ "danger-bg-hover": "#FFDCD7",
48
+ "danger-fg": "#971A20",
49
+ "danger-strong": "#BA2B2E",
50
+ "danger-strong-hover": "#971A20",
51
+ "danger-strong-fg": "#FFFFFF",
52
+ "border-subtle": "#DCE2E8",
53
+ "border-default": "#C5CDD6",
54
+ "border-control": "#7C8893",
55
+ "border-control-hover": "#616C77",
56
+ "border-strong": "#7C8893",
57
+ "focus": "#006FBD",
58
+ "focus-offset": "#FFFFFF",
59
+ "selection": "#DAEEFF"
60
+ } as const;
61
+
62
+ export const semanticDark = {
63
+ "canvas": "#080C0F",
64
+ "surface": "#101419",
65
+ "surface-raised": "#1A1F24",
66
+ "surface-sunken": "#040608",
67
+ "overlay": "#1A1F24",
68
+ "text-primary": "#F7F9FC",
69
+ "text-secondary": "#C5CDD6",
70
+ "text-tertiary": "#7C8893",
71
+ "text-inverse": "#101419",
72
+ "link": "#8DC0F2",
73
+ "link-hover": "#B6D8FB",
74
+ "accent": "#1383DA",
75
+ "accent-hover": "#55A1E8",
76
+ "accent-active": "#006FBD",
77
+ "accent-on": "#FFFFFF",
78
+ "accent-strong": "#005CA1",
79
+ "accent-strong-hover": "#006FBD",
80
+ "accent-strong-active": "#024679",
81
+ "accent-strong-fg": "#FFFFFF",
82
+ "accent-subtle": "#041E35",
83
+ "accent-subtle-hover": "#053256",
84
+ "accent-subtle-fg": "#8DC0F2",
85
+ "success": "#73C385",
86
+ "success-bg": "#011A07",
87
+ "success-bg-hover": "#002D0E",
88
+ "success-fg": "#A6DEB1",
89
+ "warning": "#F7B83D",
90
+ "warning-bg": "#291A00",
91
+ "warning-bg-hover": "#452E00",
92
+ "warning-fg": "#FED081",
93
+ "danger": "#FF9890",
94
+ "danger-bg": "#2F0405",
95
+ "danger-bg-hover": "#4F0A0D",
96
+ "danger-fg": "#FFBEB6",
97
+ "danger-strong": "#BA2B2E",
98
+ "danger-strong-hover": "#971A20",
99
+ "danger-strong-fg": "#FFFFFF",
100
+ "border-subtle": "#2C343C",
101
+ "border-default": "#424B55",
102
+ "border-control": "#616C77",
103
+ "border-control-hover": "#7C8893",
104
+ "border-strong": "#7C8893",
105
+ "focus": "#8DC0F2",
106
+ "focus-offset": "#040608",
107
+ "selection": "#024679"
108
+ } as const;
109
+
110
+ export const type = {
111
+ "2xs": { size: "0.579rem", lineHeight: "1.000rem", tracking: "0.01em" },
112
+ "xs": { size: "0.694rem", lineHeight: "1.125rem", tracking: "0.005em" },
113
+ "sm": { size: "0.833rem", lineHeight: "1.375rem", tracking: "0.0em" },
114
+ "base": { size: "1.000rem", lineHeight: "1.625rem", tracking: "0.0em" },
115
+ "lg": { size: "1.200rem", lineHeight: "1.750rem", tracking: "-0.005em" },
116
+ "xl": { size: "1.440rem", lineHeight: "1.875rem", tracking: "-0.01em" },
117
+ "2xl": { size: "1.728rem", lineHeight: "2.125rem", tracking: "-0.015em" },
118
+ "3xl": { size: "2.074rem", lineHeight: "2.375rem", tracking: "-0.02em" },
119
+ "4xl": { size: "2.488rem", lineHeight: "2.750rem", tracking: "-0.025em" },
120
+ "5xl": { size: "2.986rem", lineHeight: "3.250rem", tracking: "-0.03em" },
121
+ "6xl": { size: "3.583rem", lineHeight: "3.750rem", tracking: "-0.03em" },
122
+ } as const;
123
+
124
+ export const componentTokens = {
125
+ "button": {
126
+ "--button-font": "var(--font-body)",
127
+ "--button-font-weight": "var(--weight-medium)",
128
+ "--button-radius": "var(--radius-md)",
129
+ "--button-gap": "var(--space-2)",
130
+ "--button-height-sm": "var(--space-8)",
131
+ "--button-height-md": "var(--space-10)",
132
+ "--button-height-lg": "var(--space-12)",
133
+ "--button-padding-x-sm": "var(--space-3)",
134
+ "--button-padding-x-md": "var(--space-4)",
135
+ "--button-padding-x-lg": "var(--space-5)",
136
+ "--button-font-sm": "var(--text-sm)",
137
+ "--button-font-md": "var(--text-sm)",
138
+ "--button-font-lg": "var(--text-base)",
139
+ "--button-primary-bg": "var(--color-accent-strong)",
140
+ "--button-primary-bg-hover": "var(--color-accent-strong-hover)",
141
+ "--button-primary-bg-active": "var(--color-accent-strong-active)",
142
+ "--button-primary-fg": "var(--color-accent-strong-fg)",
143
+ "--button-primary-border": "var(--color-accent-strong)",
144
+ "--button-primary-border-hover": "var(--color-accent-strong-hover)",
145
+ "--button-secondary-bg": "var(--color-surface)",
146
+ "--button-secondary-bg-hover": "var(--color-surface-sunken)",
147
+ "--button-secondary-bg-active": "var(--color-surface-sunken)",
148
+ "--button-secondary-fg": "var(--color-text-primary)",
149
+ "--button-secondary-border": "var(--color-border-control)",
150
+ "--button-secondary-border-hover": "var(--color-border-control-hover)",
151
+ "--button-ghost-bg": "transparent",
152
+ "--button-ghost-bg-hover": "var(--color-surface-sunken)",
153
+ "--button-ghost-bg-active": "var(--color-surface-sunken)",
154
+ "--button-ghost-fg": "var(--color-text-secondary)",
155
+ "--button-ghost-fg-hover": "var(--color-text-primary)",
156
+ "--button-ghost-border": "transparent",
157
+ "--button-danger-bg": "var(--color-danger-strong)",
158
+ "--button-danger-bg-hover": "var(--color-danger-strong-hover)",
159
+ "--button-danger-fg": "var(--color-danger-strong-fg)",
160
+ "--button-danger-border": "transparent",
161
+ "--button-disabled-bg": "var(--color-surface-sunken)",
162
+ "--button-disabled-fg": "var(--color-text-tertiary)",
163
+ "--button-disabled-border": "var(--color-border-subtle)",
164
+ "--button-focus-color": "var(--focus-ring-color)",
165
+ "--button-focus-offset": "var(--focus-ring-offset)",
166
+ "--button-focus-width": "var(--focus-ring-width)",
167
+ "--button-icon-size-sm": "var(--space-4)",
168
+ "--button-icon-size-md": "var(--space-4)",
169
+ "--button-icon-size-lg": "var(--space-5)"
170
+ },
171
+ "input": {
172
+ "--input-font": "var(--font-body)",
173
+ "--input-font-size": "var(--text-sm)",
174
+ "--input-radius": "var(--radius-md)",
175
+ "--input-height-sm": "var(--space-8)",
176
+ "--input-height-md": "var(--space-10)",
177
+ "--input-height-lg": "var(--space-12)",
178
+ "--input-padding-x": "var(--space-3)",
179
+ "--input-padding-y": "var(--space-2)",
180
+ "--input-bg": "var(--color-surface)",
181
+ "--input-bg-hover": "var(--color-surface)",
182
+ "--input-bg-disabled": "var(--color-surface-sunken)",
183
+ "--input-fg": "var(--color-text-primary)",
184
+ "--input-fg-disabled": "var(--color-text-tertiary)",
185
+ "--input-placeholder": "var(--color-text-tertiary)",
186
+ "--input-border": "var(--color-border-control)",
187
+ "--input-border-hover": "var(--color-border-control-hover)",
188
+ "--input-border-focus": "var(--color-focus)",
189
+ "--input-border-invalid": "var(--color-danger)",
190
+ "--input-border-valid": "var(--color-success)",
191
+ "--input-ring-focus": "var(--color-focus)",
192
+ "--input-ring-invalid": "var(--color-danger)",
193
+ "--input-label-fg": "var(--color-text-primary)",
194
+ "--input-hint-fg": "var(--color-text-secondary)",
195
+ "--input-count-fg": "var(--color-text-tertiary)",
196
+ "--input-error-fg": "var(--color-danger-fg)",
197
+ "--input-required-fg": "var(--color-danger)",
198
+ "--input-reveal-fg": "var(--color-text-secondary)",
199
+ "--input-reveal-fg-hover": "var(--color-text-primary)",
200
+ "--input-reveal-bg-hover": "var(--color-surface-sunken)",
201
+ "--input-focus-width": "var(--focus-ring-width)",
202
+ "--input-focus-offset": "var(--focus-ring-offset)"
203
+ },
204
+ "checkbox": {
205
+ "--checkbox-size": "1.125rem",
206
+ "--checkbox-radius": "var(--radius-xs)",
207
+ "--checkbox-gap": "var(--space-2-5)",
208
+ "--checkbox-bg": "var(--color-surface)",
209
+ "--checkbox-bg-hover": "var(--color-surface-sunken)",
210
+ "--checkbox-bg-checked": "var(--color-accent)",
211
+ "--checkbox-bg-disabled": "var(--color-surface-sunken)",
212
+ "--checkbox-border": "var(--color-border-strong)",
213
+ "--checkbox-border-checked": "var(--color-accent)",
214
+ "--checkbox-fg-check": "var(--color-accent-on)",
215
+ "--checkbox-fg-disabled": "var(--color-text-tertiary)",
216
+ "--checkbox-label-fg": "var(--color-text-primary)",
217
+ "--checkbox-label-fg-disabled": "var(--color-text-tertiary)",
218
+ "--checkbox-focus-color": "var(--color-focus)",
219
+ "--checkbox-focus-offset": "var(--focus-ring-offset)",
220
+ "--checkbox-focus-width": "var(--focus-ring-width)"
221
+ },
222
+ "radio": {
223
+ "--radio-bg-checked": "var(--color-accent)",
224
+ "--radio-bg-disabled": "var(--color-surface-sunken)",
225
+ "--radio-border-checked": "var(--color-accent)",
226
+ "--radio-dot": "var(--color-accent-on)",
227
+ "--radio-dot-size": "0.4375rem"
228
+ },
229
+ "badge": {
230
+ "--badge-radius": "var(--radius-full)",
231
+ "--badge-height": "var(--space-5)",
232
+ "--badge-padding-x": "var(--space-2)",
233
+ "--badge-font": "var(--font-body)",
234
+ "--badge-font-size": "var(--text-xs)",
235
+ "--badge-font-weight": "var(--weight-medium)",
236
+ "--badge-neutral-bg": "var(--color-surface-sunken)",
237
+ "--badge-neutral-fg": "var(--color-text-secondary)",
238
+ "--badge-accent-bg": "var(--color-accent-subtle)",
239
+ "--badge-accent-fg": "var(--color-accent-subtle-fg)",
240
+ "--badge-success-bg": "var(--color-success-bg)",
241
+ "--badge-success-fg": "var(--color-success-fg)",
242
+ "--badge-warning-bg": "var(--color-warning-bg)",
243
+ "--badge-warning-fg": "var(--color-warning-fg)",
244
+ "--badge-danger-bg": "var(--color-danger-bg)",
245
+ "--badge-danger-fg": "var(--color-danger-fg)",
246
+ "--badge-dot-size": "0.375rem"
247
+ },
248
+ "select": {
249
+ "--select-bg": "var(--color-surface)",
250
+ "--select-bg-disabled": "var(--color-surface-sunken)",
251
+ "--select-fg": "var(--color-text-primary)",
252
+ "--select-fg-disabled": "var(--color-text-tertiary)",
253
+ "--select-placeholder": "var(--color-text-tertiary)",
254
+ "--select-border": "var(--color-border-control)",
255
+ "--select-border-hover": "var(--color-border-control-hover)",
256
+ "--select-border-focus": "var(--color-focus)",
257
+ "--select-border-invalid": "var(--color-danger)",
258
+ "--select-radius": "var(--radius-md)",
259
+ "--select-height": "var(--space-10)",
260
+ "--select-height-sm": "var(--space-8)",
261
+ "--select-height-lg": "var(--space-12)",
262
+ "--select-padding-x": "var(--space-3)",
263
+ "--select-chevron": "var(--color-text-secondary)",
264
+ "--select-focus-width": "var(--focus-ring-width)",
265
+ "--select-focus-offset": "var(--focus-ring-offset)",
266
+ "--select-focus-offset-color": "var(--focus-ring-offset-color)",
267
+ "--select-popup-bg": "var(--color-surface-raised)",
268
+ "--select-popup-border": "var(--color-border-control)",
269
+ "--select-popup-radius": "var(--radius-md)",
270
+ "--select-popup-shadow": "var(--shadow-lg)",
271
+ "--select-popup-padding": "var(--space-1)",
272
+ "--select-popup-gap": "var(--space-1)",
273
+ "--select-popup-max-height": "18rem",
274
+ "--select-popup-z": "var(--z-dropdown)",
275
+ "--select-option-fg": "var(--color-text-primary)",
276
+ "--select-option-fg-muted": "var(--color-text-tertiary)",
277
+ "--select-option-description": "var(--color-text-tertiary)",
278
+ "--select-popup-footer-border": "var(--color-border-subtle)",
279
+ "--select-option-bg-hover": "var(--color-surface-sunken)",
280
+ "--select-option-bg-selected": "var(--color-accent-subtle)",
281
+ "--select-option-fg-selected": "var(--color-accent-subtle-fg)",
282
+ "--select-option-radius": "var(--radius-sm)",
283
+ "--select-option-padding-x": "var(--space-3)",
284
+ "--select-option-padding-y": "var(--space-2)",
285
+ "--select-indicator-bg": "var(--color-accent)",
286
+ "--select-indicator-fg": "var(--color-accent-on)",
287
+ "--select-indicator-size": "var(--space-4)"
288
+ },
289
+ "chip": {
290
+ "--chip-bg": "var(--color-surface)",
291
+ "--chip-bg-hover": "var(--color-surface-sunken)",
292
+ "--chip-bg-selected": "var(--color-accent-subtle)",
293
+ "--chip-fg": "var(--color-text-secondary)",
294
+ "--chip-fg-hover": "var(--color-text-primary)",
295
+ "--chip-fg-selected": "var(--color-accent-subtle-fg)",
296
+ "--chip-fg-disabled": "var(--color-text-tertiary)",
297
+ "--chip-remove-bg-hover": "var(--color-border-default)",
298
+ "--chip-border": "var(--color-border-control)",
299
+ "--chip-border-hover": "var(--color-border-control-hover)",
300
+ "--chip-border-selected": "var(--color-accent)",
301
+ "--chip-radius": "var(--radius-full)",
302
+ "--chip-height": "var(--space-8)",
303
+ "--chip-height-sm": "var(--space-6)",
304
+ "--chip-padding-x": "var(--space-3)",
305
+ "--chip-font-size": "var(--text-sm)",
306
+ "--chip-focus-color": "var(--color-focus)",
307
+ "--chip-focus-offset": "var(--focus-ring-offset)",
308
+ "--chip-focus-width": "var(--focus-ring-width)"
309
+ },
310
+ "accordion": {
311
+ "--accordion-item-radius": "var(--radius-md)",
312
+ "--accordion-item-bg": "var(--color-surface)",
313
+ "--accordion-item-border": "var(--color-border-subtle)",
314
+ "--accordion-gap": "var(--space-2)",
315
+ "--accordion-trigger-fg": "var(--color-text-primary)",
316
+ "--accordion-trigger-bg-hover": "var(--color-surface-sunken)",
317
+ "--accordion-trigger-bg-open": "var(--color-surface-sunken)",
318
+ "--accordion-trigger-padding-x": "var(--space-4)",
319
+ "--accordion-trigger-padding-y": "var(--space-4)",
320
+ "--accordion-font-size": "var(--text-sm)",
321
+ "--accordion-icon": "var(--color-text-tertiary)",
322
+ "--accordion-panel-fg": "var(--color-text-secondary)",
323
+ "--accordion-panel-bg": "var(--color-surface)",
324
+ "--accordion-panel-border": "var(--color-border-subtle)",
325
+ "--accordion-panel-padding": "var(--space-4)",
326
+ "--accordion-focus-color": "var(--color-focus)",
327
+ "--accordion-focus-offset": "calc(-1 * var(--focus-ring-offset))",
328
+ "--accordion-focus-width": "var(--focus-ring-width)",
329
+ "--accordion-max-width": "var(--layout-prose)"
330
+ },
331
+ "card": {
332
+ "--card-radius": "var(--radius-lg)",
333
+ "--card-padding": "var(--space-6)",
334
+ "--card-bg": "var(--color-surface)",
335
+ "--card-border": "var(--color-border-subtle)",
336
+ "--card-fg": "var(--color-text-primary)",
337
+ "--card-body-fg": "var(--color-text-secondary)",
338
+ "--card-header-gap": "var(--space-1)",
339
+ "--card-footer-bg": "transparent",
340
+ "--card-footer-border": "var(--color-border-subtle)",
341
+ "--card-accent-bg": "var(--color-surface)",
342
+ "--card-accent-border": "var(--color-warning)",
343
+ "--card-raised-bg": "var(--color-surface-raised)",
344
+ "--card-raised-border": "var(--color-border-subtle)",
345
+ "--card-raised-shadow": "var(--shadow-md)",
346
+ "--card-flat-bg": "var(--color-surface-sunken)",
347
+ "--card-flat-border": "transparent",
348
+ "--card-hover-border": "var(--color-border-control)",
349
+ "--card-title-fg": "var(--color-text-primary)",
350
+ "--card-meta-fg": "var(--color-text-tertiary)"
351
+ },
352
+ "modal": {
353
+ "--modal-backdrop": "var(--scrim-default)",
354
+ "--modal-footer-bg": "var(--color-surface-sunken)",
355
+ "--modal-bg": "var(--color-overlay)",
356
+ "--modal-fg": "var(--color-text-primary)",
357
+ "--modal-border": "var(--color-border-subtle)",
358
+ "--modal-radius": "var(--radius-xl)",
359
+ "--modal-shadow": "var(--shadow-lg)",
360
+ "--modal-padding": "var(--space-6)",
361
+ "--modal-gap": "var(--space-4)",
362
+ "--modal-max-width-sm": "24rem",
363
+ "--modal-max-width-md": "32rem",
364
+ "--modal-max-width-lg": "44rem",
365
+ "--modal-drawer-width-sm": "20rem",
366
+ "--modal-drawer-width-md": "28rem",
367
+ "--modal-drawer-width-lg": "40rem",
368
+ "--modal-drawer-duration-enter": "300ms",
369
+ "--modal-drawer-duration-exit": "200ms",
370
+ "--modal-title-fg": "var(--color-text-primary)",
371
+ "--modal-body-fg": "var(--color-text-secondary)",
372
+ "--modal-close-bg-hover": "var(--color-surface-sunken)",
373
+ "--modal-close-fg": "var(--color-text-secondary)",
374
+ "--modal-focus-color": "var(--color-focus)",
375
+ "--modal-focus-offset": "var(--focus-ring-offset)",
376
+ "--modal-focus-width": "var(--focus-ring-width)"
377
+ },
378
+ "nav": {
379
+ "--nav-bg": "var(--color-surface)",
380
+ "--nav-border": "var(--color-border-subtle)",
381
+ "--nav-width": "var(--layout-sidebar)",
382
+ "--nav-item-fg": "var(--color-text-secondary)",
383
+ "--nav-item-fg-hover": "var(--color-text-primary)",
384
+ "--nav-item-fg-active": "var(--color-text-primary)",
385
+ "--nav-item-bg-hover": "var(--color-surface-sunken)",
386
+ "--nav-item-bg-active": "var(--color-accent-subtle)",
387
+ "--nav-item-indicator": "var(--color-accent)",
388
+ "--nav-item-radius": "var(--radius-md)",
389
+ "--nav-item-height": "var(--space-10)",
390
+ "--nav-item-padding-x": "var(--space-3)",
391
+ "--nav-item-gap": "var(--space-2-5)",
392
+ "--nav-group-label-fg": "var(--color-text-tertiary)",
393
+ "--nav-group-label-size": "var(--text-xs)",
394
+ "--nav-brand-fg": "var(--color-text-primary)",
395
+ "--nav-brand-size": "var(--text-sm)",
396
+ "--nav-brand-mark-bg": "var(--color-accent)",
397
+ "--nav-brand-mark-fg": "var(--color-accent-on)",
398
+ "--nav-icon": "var(--color-text-tertiary)",
399
+ "--nav-mobilebar-bg": "var(--color-surface)",
400
+ "--nav-toggle-bg": "transparent",
401
+ "--nav-toggle-fg": "var(--color-text-secondary)",
402
+ "--nav-toggle-border": "var(--color-border-control)",
403
+ "--nav-focus-color": "var(--color-focus)",
404
+ "--nav-focus-offset": "var(--focus-ring-offset)",
405
+ "--nav-focus-width": "var(--focus-ring-width)",
406
+ "--nav-mobile-backdrop": "var(--scrim-default)",
407
+ "--nav-scrollbar": "var(--color-border-default)"
408
+ },
409
+ "navbar": {
410
+ "--navbar-bg": "var(--color-canvas)",
411
+ "--navbar-tint": "72%",
412
+ "--navbar-blur": "12px",
413
+ "--navbar-height": "var(--layout-header)",
414
+ "--navbar-padding-x": "var(--space-6)",
415
+ "--navbar-gap": "var(--space-4)",
416
+ "--navbar-brand-fg": "var(--color-text-primary)",
417
+ "--navbar-brand-size": "var(--text-sm)",
418
+ "--navbar-brand-mark-bg": "var(--color-accent)",
419
+ "--navbar-brand-mark-fg": "var(--color-accent-on)",
420
+ "--navbar-link-fg": "var(--color-text-secondary)",
421
+ "--navbar-link-fg-hover": "var(--color-text-primary)",
422
+ "--navbar-link-fg-current": "var(--color-text-primary)",
423
+ "--navbar-link-bg-hover": "var(--color-surface-sunken)",
424
+ "--navbar-link-bg-open": "var(--color-surface-sunken)",
425
+ "--navbar-link-bg-current": "var(--color-accent-subtle)",
426
+ "--navbar-link-bg-current-hover": "var(--color-accent-subtle-hover)",
427
+ "--navbar-current-icon-fg": "var(--color-accent)",
428
+ "--navbar-link-radius": "var(--radius-md)",
429
+ "--navbar-link-height": "var(--space-8)",
430
+ "--navbar-link-padding-x": "var(--space-3)",
431
+ "--navbar-link-gap": "var(--space-1-5)",
432
+ "--navbar-link-size": "var(--text-sm)",
433
+ "--navbar-viewport-bg": "var(--color-overlay)",
434
+ "--navbar-viewport-border": "var(--color-border-default)",
435
+ "--navbar-viewport-shadow": "var(--shadow-lg)",
436
+ "--navbar-viewport-radius": "var(--radius-lg)",
437
+ "--navbar-viewport-offset": "var(--space-2)",
438
+ "--navbar-panel-padding": "var(--space-2)",
439
+ "--navbar-panel-gap": "var(--space-1)",
440
+ "--navbar-panel-width-list": "20rem",
441
+ "--navbar-panel-width-grid": "34rem",
442
+ "--navbar-panel-width-group": "15rem",
443
+ "--navbar-row-fg": "var(--color-text-primary)",
444
+ "--navbar-row-desc-fg": "var(--color-text-secondary)",
445
+ "--navbar-row-icon-fg": "var(--color-text-tertiary)",
446
+ "--navbar-row-bg-hover": "var(--color-surface-sunken)",
447
+ "--navbar-row-bg-current": "var(--color-accent-subtle)",
448
+ "--navbar-row-radius": "var(--radius-md)",
449
+ "--navbar-row-padding": "var(--space-2-5) var(--space-3)",
450
+ "--navbar-feature-bg": "var(--color-surface-sunken)",
451
+ "--navbar-feature-bg-hover": "var(--color-accent-subtle)",
452
+ "--navbar-feature-icon-bg": "var(--color-accent)",
453
+ "--navbar-feature-icon-fg": "var(--color-accent-on)",
454
+ "--navbar-feature-min-height": "12rem",
455
+ "--navbar-eyebrow-fg": "var(--color-text-tertiary)",
456
+ "--navbar-toggle-fg": "var(--color-text-primary)",
457
+ "--navbar-toggle-bg-hover": "var(--color-surface-sunken)",
458
+ "--navbar-sheet-bg": "var(--color-overlay)",
459
+ "--navbar-sheet-border": "var(--color-border-subtle)",
460
+ "--navbar-sheet-backdrop": "var(--scrim-subtle)",
461
+ "--navbar-sheet-radius": "var(--radius-xl)",
462
+ "--navbar-sheet-inset": "var(--space-2)",
463
+ "--navbar-sheet-max-width": "26rem",
464
+ "--navbar-sheet-padding": "var(--space-6)",
465
+ "--navbar-sheet-row-height": "var(--space-10)",
466
+ "--navbar-sheet-row-size": "var(--text-base)",
467
+ "--navbar-sheet-meta-fg": "var(--color-text-secondary)",
468
+ "--navbar-focus-color": "var(--color-focus)",
469
+ "--navbar-focus-offset": "var(--focus-ring-offset)",
470
+ "--navbar-focus-width": "var(--focus-ring-width)"
471
+ },
472
+ "topbar": {
473
+ "--topbar-bg": "var(--color-canvas)",
474
+ "--topbar-border": "var(--color-border-subtle)",
475
+ "--topbar-height": "var(--space-8)",
476
+ "--topbar-padding-x": "var(--space-6)",
477
+ "--topbar-gap": "var(--space-4)"
478
+ },
479
+ "page-header": {
480
+ "--page-header-title-fg": "var(--color-text-primary)",
481
+ "--page-header-title-size": "var(--text-4xl)",
482
+ "--page-header-title-leading": "var(--leading-4xl)",
483
+ "--page-header-title-tracking": "-0.025em",
484
+ "--page-header-title-max": "var(--layout-prose)",
485
+ "--page-header-lede-fg": "var(--color-text-secondary)",
486
+ "--page-header-lede-size": "var(--text-lg)",
487
+ "--page-header-lede-leading": "var(--leading-lg)",
488
+ "--page-header-lede-max": "var(--layout-prose)",
489
+ "--page-header-gap": "var(--space-4)",
490
+ "--page-header-meta-gap": "var(--space-2)",
491
+ "--page-header-actions-gap": "var(--space-3)",
492
+ "--page-header-actions-margin": "var(--space-2)",
493
+ "--page-header-display-size": "var(--text-5xl)",
494
+ "--page-header-display-leading": "var(--leading-5xl)",
495
+ "--page-header-display-tracking": "-0.03em",
496
+ "--page-header-emphasis-fg": "var(--color-text-secondary)"
497
+ },
498
+ "section": {
499
+ "--section-border": "var(--color-border-subtle)",
500
+ "--section-margin-top": "var(--space-12)",
501
+ "--section-padding-top": "var(--space-6)",
502
+ "--section-head-gap": "var(--space-4)",
503
+ "--section-title-size": "var(--text-xl)",
504
+ "--section-title-leading": "var(--leading-xl)",
505
+ "--section-title-margin": "var(--space-4)",
506
+ "--section-index-fg": "var(--color-text-tertiary)",
507
+ "--section-index-size": "var(--text-sm)",
508
+ "--section-intro-fg": "var(--color-text-secondary)",
509
+ "--section-intro-size": "var(--text-base)",
510
+ "--section-intro-max": "var(--layout-prose)",
511
+ "--section-intro-margin": "var(--space-5)"
512
+ },
513
+ "example": {
514
+ "--example-bg": "var(--color-surface-sunken)",
515
+ "--example-border": "transparent",
516
+ "--example-radius": "var(--radius-lg)",
517
+ "--example-padding": "var(--space-6)",
518
+ "--example-gap": "var(--space-3)",
519
+ "--example-label-fg": "var(--color-text-tertiary)",
520
+ "--example-label-size": "var(--text-xs)",
521
+ "--example-description-fg": "var(--color-text-tertiary)",
522
+ "--example-preview-min": "var(--space-16)"
523
+ },
524
+ "code": {
525
+ "--code-bg": "var(--color-surface)",
526
+ "--code-fg": "var(--color-text-primary)",
527
+ "--code-border": "var(--color-border-subtle)",
528
+ "--code-radius": "var(--radius-md)",
529
+ "--code-padding": "var(--space-4)",
530
+ "--code-font-size": "var(--text-sm)",
531
+ "--code-line-height": "1.6",
532
+ "--code-label-fg": "var(--color-text-tertiary)",
533
+ "--code-label-size": "var(--text-xs)",
534
+ "--code-label-margin": "var(--space-2)",
535
+ "--code-scrollbar": "var(--color-border-default)"
536
+ },
537
+ "grid": {
538
+ "--grid-gap": "var(--space-6)",
539
+ "--grid-gap-sm": "var(--space-4)",
540
+ "--grid-gap-lg": "var(--space-8)",
541
+ "--grid-container": "var(--layout-container)",
542
+ "--grid-gutter": "var(--space-4)"
543
+ },
544
+ "breadcrumbs": {
545
+ "--breadcrumbs-link-fg": "var(--color-text-secondary)",
546
+ "--breadcrumbs-link-fg-hover": "var(--color-text-primary)",
547
+ "--breadcrumbs-current-fg": "var(--color-text-primary)",
548
+ "--breadcrumbs-separator-fg": "var(--color-text-tertiary)",
549
+ "--breadcrumbs-font-size": "var(--text-sm)",
550
+ "--breadcrumbs-gap": "var(--space-2)",
551
+ "--breadcrumbs-focus-color": "var(--color-focus)",
552
+ "--breadcrumbs-focus-offset": "var(--focus-ring-offset)",
553
+ "--breadcrumbs-focus-width": "var(--focus-ring-width)"
554
+ },
555
+ "pagination": {
556
+ "--pagination-item-size": "var(--space-10)",
557
+ "--pagination-radius": "var(--radius-md)",
558
+ "--pagination-bg": "transparent",
559
+ "--pagination-bg-hover": "var(--color-surface-sunken)",
560
+ "--pagination-bg-current": "var(--color-accent-strong)",
561
+ "--pagination-fg": "var(--color-text-secondary)",
562
+ "--pagination-fg-hover": "var(--color-text-primary)",
563
+ "--pagination-fg-current": "var(--color-accent-strong-fg)",
564
+ "--pagination-fg-disabled": "var(--color-text-tertiary)",
565
+ "--pagination-font-size": "var(--text-sm)",
566
+ "--pagination-gap": "var(--space-1)",
567
+ "--pagination-focus-color": "var(--color-focus)",
568
+ "--pagination-focus-offset": "var(--focus-ring-offset)",
569
+ "--pagination-focus-width": "var(--focus-ring-width)"
570
+ },
571
+ "table": {
572
+ "--table-bg": "var(--color-surface)",
573
+ "--table-header-bg": "var(--color-surface-sunken)",
574
+ "--table-header-fg": "var(--color-text-secondary)",
575
+ "--table-header-size": "var(--text-xs)",
576
+ "--table-cell-fg": "var(--color-text-primary)",
577
+ "--table-cell-fg-muted": "var(--color-text-secondary)",
578
+ "--table-cell-size": "var(--text-sm)",
579
+ "--table-min-width": "36rem",
580
+ "--table-row-border": "var(--color-border-subtle)",
581
+ "--table-row-hover": "var(--color-surface-sunken)",
582
+ "--table-row-selected": "var(--color-accent-subtle)",
583
+ "--table-cell-padding-x": "var(--space-4)",
584
+ "--table-cell-padding-y": "var(--space-3)",
585
+ "--table-caption-fg": "var(--color-text-tertiary)",
586
+ "--table-caption-size": "var(--text-xs)",
587
+ "--table-radius": "var(--radius-lg)",
588
+ "--table-border": "var(--color-border-subtle)",
589
+ "--table-numeric-font": "var(--font-mono)",
590
+ "--table-sort-hover": "var(--color-text-primary)",
591
+ "--table-focus-color": "var(--color-focus)",
592
+ "--table-focus-offset": "calc(-1 * var(--focus-ring-offset))",
593
+ "--table-focus-width": "var(--focus-ring-width)",
594
+ "--table-toolbar-gap": "var(--space-3)",
595
+ "--table-toolbar-padding": "var(--space-3)",
596
+ "--table-toolbar-bg": "var(--color-surface)",
597
+ "--table-filter-width": "18rem"
598
+ },
599
+ "toast": {
600
+ "--toast-bg": "var(--color-overlay)",
601
+ "--toast-border": "var(--color-border-default)",
602
+ "--toast-fg": "var(--color-text-primary)",
603
+ "--toast-shadow": "var(--shadow-lg)",
604
+ "--toast-radius": "var(--radius-xl)",
605
+ "--toast-padding": "var(--space-4)",
606
+ "--toast-gap": "var(--space-3)",
607
+ "--toast-width": "24rem",
608
+ "--toast-title-size": "var(--text-sm)",
609
+ "--toast-title-weight": "var(--weight-medium)",
610
+ "--toast-body-size": "var(--text-sm)",
611
+ "--toast-body-fg": "var(--color-text-secondary)",
612
+ "--toast-body-gap": "var(--space-1)",
613
+ "--toast-icon-fg": "var(--color-text-primary)",
614
+ "--toast-info-icon": "var(--color-accent)",
615
+ "--toast-success-icon": "var(--color-success)",
616
+ "--toast-warning-icon": "var(--color-warning)",
617
+ "--toast-danger-icon": "var(--color-danger)",
618
+ "--toast-loading-icon": "var(--color-text-secondary)",
619
+ "--toast-close-fg": "var(--color-text-tertiary)",
620
+ "--toast-close-fg-hover": "var(--color-text-primary)",
621
+ "--toast-close-bg-hover": "var(--color-surface-sunken)",
622
+ "--toast-action-bg": "transparent",
623
+ "--toast-action-bg-hover": "var(--color-surface-sunken)",
624
+ "--toast-action-border": "var(--color-border-default)",
625
+ "--toast-action-fg": "var(--color-text-primary)",
626
+ "--toast-action-radius": "var(--radius-md)",
627
+ "--toast-action-height": "var(--space-8)",
628
+ "--toast-action-padding-x": "var(--space-3)",
629
+ "--toast-action-font-size": "var(--text-sm)",
630
+ "--toast-action-font-weight": "var(--weight-medium)",
631
+ "--toast-viewport-gap": "var(--space-3)",
632
+ "--toast-stack-peek": "0.75rem",
633
+ "--toast-stack-scale-step": "0.08",
634
+ "--toast-focus-color": "var(--color-focus)",
635
+ "--toast-focus-offset": "var(--focus-ring-offset)",
636
+ "--toast-focus-width": "var(--focus-ring-width)"
637
+ },
638
+ "alert": {
639
+ "--alert-radius": "var(--radius-md)",
640
+ "--alert-padding": "var(--space-4)",
641
+ "--alert-gap": "var(--space-3)",
642
+ "--alert-title-size": "var(--text-sm)",
643
+ "--alert-body-size": "var(--text-sm)",
644
+ "--alert-body-fg": "var(--color-text-secondary)",
645
+ "--alert-info-bg": "var(--color-accent-subtle)",
646
+ "--alert-info-border": "var(--color-accent)",
647
+ "--alert-info-fg": "var(--color-accent-subtle-fg)",
648
+ "--alert-success-bg": "var(--color-success-bg)",
649
+ "--alert-success-border": "var(--color-success)",
650
+ "--alert-success-fg": "var(--color-success-fg)",
651
+ "--alert-warning-bg": "var(--color-warning-bg)",
652
+ "--alert-warning-border": "var(--color-warning)",
653
+ "--alert-warning-fg": "var(--color-warning-fg)",
654
+ "--alert-danger-bg": "var(--color-danger-bg)",
655
+ "--alert-danger-border": "var(--color-danger)",
656
+ "--alert-danger-fg": "var(--color-danger-fg)",
657
+ "--alert-info-close-fg": "var(--color-accent-subtle-fg)",
658
+ "--alert-info-close-bg-hover": "var(--color-accent-subtle-hover)",
659
+ "--alert-success-close-fg": "var(--color-success-fg)",
660
+ "--alert-success-close-bg-hover": "var(--color-success-bg-hover)",
661
+ "--alert-warning-close-fg": "var(--color-warning-fg)",
662
+ "--alert-warning-close-bg-hover": "var(--color-warning-bg-hover)",
663
+ "--alert-danger-close-fg": "var(--color-danger-fg)",
664
+ "--alert-danger-close-bg-hover": "var(--color-danger-bg-hover)",
665
+ "--alert-focus-color": "var(--color-focus)",
666
+ "--alert-focus-offset": "var(--focus-ring-offset)",
667
+ "--alert-focus-width": "var(--focus-ring-width)"
668
+ },
669
+ "skeleton": {
670
+ "--skeleton-bg": "var(--color-surface-sunken)",
671
+ "--skeleton-highlight": "var(--color-border-subtle)",
672
+ "--skeleton-radius": "var(--radius-sm)",
673
+ "--skeleton-heading-height": "var(--space-4)",
674
+ "--skeleton-text-height": "var(--space-3)",
675
+ "--skeleton-text-gap": "var(--space-2)",
676
+ "--skeleton-image-radius": "var(--radius-md)",
677
+ "--skeleton-duration": "1.6s"
678
+ },
679
+ "spinner": {
680
+ "--spinner-size-sm": "var(--space-4)",
681
+ "--spinner-size-md": "var(--space-5)",
682
+ "--spinner-size-lg": "var(--space-8)",
683
+ "--spinner-track": "var(--color-border-default)",
684
+ "--spinner-indicator": "var(--color-accent)",
685
+ "--spinner-duration": "700ms",
686
+ "--spinner-stroke": "2px"
687
+ },
688
+ "tabs": {
689
+ "--tabs-list-border": "var(--color-border-default)",
690
+ "--tabs-list-gap": "var(--space-1)",
691
+ "--tabs-tab-height": "var(--space-10)",
692
+ "--tabs-tab-padding-x": "var(--space-4)",
693
+ "--tabs-tab-radius": "var(--radius-md)",
694
+ "--tabs-tab-font-size": "var(--text-sm)",
695
+ "--tabs-tab-font-weight": "var(--weight-medium)",
696
+ "--tabs-tab-fg": "var(--color-text-secondary)",
697
+ "--tabs-tab-fg-hover": "var(--color-text-primary)",
698
+ "--tabs-tab-fg-selected": "var(--color-text-primary)",
699
+ "--tabs-tab-fg-disabled": "var(--color-text-tertiary)",
700
+ "--tabs-tab-bg-hover": "var(--color-surface-sunken)",
701
+ "--tabs-indicator-bg": "var(--color-accent)",
702
+ "--tabs-indicator-height": "2px",
703
+ "--tabs-panel-padding": "var(--space-4)",
704
+ "--tabs-duration": "var(--duration-base)",
705
+ "--tabs-ease": "var(--ease-standard)",
706
+ "--tabs-focus-color": "var(--color-focus)",
707
+ "--tabs-focus-offset": "calc(-1 * var(--focus-ring-offset))",
708
+ "--tabs-focus-width": "var(--focus-ring-width)"
709
+ },
710
+ "switch": {
711
+ "--switch-gap": "var(--space-2-5)",
712
+ "--switch-track-width-sm": "var(--space-8)",
713
+ "--switch-track-height-sm": "var(--space-5)",
714
+ "--switch-track-width-md": "var(--space-10)",
715
+ "--switch-track-height-md": "var(--space-6)",
716
+ "--switch-thumb-inset": "var(--space-0-5)",
717
+ "--switch-track-bg": "var(--color-border-strong)",
718
+ "--switch-track-bg-hover": "var(--color-border-control-hover)",
719
+ "--switch-track-bg-checked": "var(--color-accent)",
720
+ "--switch-track-bg-checked-hover": "var(--color-accent-hover)",
721
+ "--switch-track-bg-disabled": "var(--color-surface-sunken)",
722
+ "--switch-track-border-disabled": "var(--color-border-default)",
723
+ "--switch-track-border-invalid": "var(--color-danger)",
724
+ "--switch-thumb-bg": "var(--color-surface)",
725
+ "--switch-thumb-bg-checked": "var(--color-accent-on)",
726
+ "--switch-thumb-bg-disabled": "var(--color-border-strong)",
727
+ "--switch-label-fg": "var(--color-text-primary)",
728
+ "--switch-label-fg-disabled": "var(--color-text-tertiary)",
729
+ "--switch-hint-fg": "var(--color-text-secondary)",
730
+ "--switch-error-fg": "var(--color-danger-fg)",
731
+ "--switch-press-scale": "0.97",
732
+ "--switch-duration": "var(--duration-base)",
733
+ "--switch-ease": "var(--ease-standard)",
734
+ "--switch-focus-color": "var(--color-focus)",
735
+ "--switch-focus-offset": "var(--focus-ring-offset)",
736
+ "--switch-focus-width": "var(--focus-ring-width)"
737
+ },
738
+ "progress": {
739
+ "--progress-height-sm": "var(--space-1-5)",
740
+ "--progress-height-md": "var(--space-2)",
741
+ "--progress-radius": "var(--radius-full)",
742
+ "--progress-gap": "var(--space-1-5)",
743
+ "--progress-track": "var(--color-border-default)",
744
+ "--progress-accent": "var(--color-accent)",
745
+ "--progress-success": "var(--color-success)",
746
+ "--progress-warning": "var(--color-warning)",
747
+ "--progress-danger": "var(--color-danger)",
748
+ "--progress-indicator-static": "var(--color-text-tertiary)",
749
+ "--progress-label-fg": "var(--color-text-primary)",
750
+ "--progress-value-fg": "var(--color-text-secondary)",
751
+ "--progress-font-size": "var(--text-sm)",
752
+ "--progress-value-font": "var(--font-mono)",
753
+ "--progress-indeterminate-width": "40%",
754
+ "--progress-indeterminate-travel": "250%",
755
+ "--progress-indeterminate-duration": "1400ms",
756
+ "--progress-duration": "var(--duration-base)",
757
+ "--progress-ease": "var(--ease-standard)"
758
+ },
759
+ "popover": {
760
+ "--popover-bg": "var(--color-surface-raised)",
761
+ "--popover-border": "var(--color-border-control)",
762
+ "--popover-fg": "var(--color-text-primary)",
763
+ "--popover-radius": "var(--radius-md)",
764
+ "--popover-shadow": "var(--shadow-lg)",
765
+ "--popover-padding": "var(--space-4)",
766
+ "--popover-gap": "var(--space-2)",
767
+ "--popover-max-width": "20rem",
768
+ "--popover-scale-from": "0.96",
769
+ "--popover-duration-enter": "var(--duration-base)",
770
+ "--popover-duration-exit": "var(--duration-fast)",
771
+ "--popover-duration-reduced": "120ms",
772
+ "--popover-ease-enter": "var(--ease-enter)",
773
+ "--popover-ease-exit": "var(--ease-exit)"
774
+ },
775
+ "tooltip": {
776
+ "--tooltip-bg": "var(--color-text-primary)",
777
+ "--tooltip-fg": "var(--color-text-inverse)",
778
+ "--tooltip-radius": "var(--radius-sm)",
779
+ "--tooltip-padding-x": "var(--space-2)",
780
+ "--tooltip-padding-y": "var(--space-1)",
781
+ "--tooltip-font-size": "var(--text-xs)",
782
+ "--tooltip-line-height": "var(--leading-xs)",
783
+ "--tooltip-max-width": "16rem",
784
+ "--tooltip-gap": "var(--space-2)",
785
+ "--tooltip-scale-from": "0.97",
786
+ "--tooltip-duration": "125ms",
787
+ "--tooltip-ease-enter": "var(--ease-enter)",
788
+ "--tooltip-ease-exit": "var(--ease-exit)"
789
+ },
790
+ "menu": {
791
+ "--menu-min-width": "12rem",
792
+ "--menu-max-height": "24rem",
793
+ "--menu-padding": "var(--space-1)",
794
+ "--menu-item-gap": "var(--space-2-5)",
795
+ "--menu-item-padding-x": "var(--space-3)",
796
+ "--menu-item-padding-y": "var(--space-2)",
797
+ "--menu-item-radius": "var(--radius-sm)",
798
+ "--menu-item-font-size": "var(--text-sm)",
799
+ "--menu-item-line-height": "var(--leading-sm)",
800
+ "--menu-item-fg": "var(--color-text-primary)",
801
+ "--menu-item-fg-disabled": "var(--color-text-tertiary)",
802
+ "--menu-item-bg-active": "var(--color-surface-sunken)",
803
+ "--menu-item-danger-fg": "var(--color-danger-fg)",
804
+ "--menu-item-danger-bg-active": "var(--color-danger-bg)",
805
+ "--menu-icon-fg": "var(--color-text-secondary)",
806
+ "--menu-shortcut-fg": "var(--color-text-tertiary)",
807
+ "--menu-indicator-fg": "var(--color-accent)",
808
+ "--menu-indicator-size": "var(--space-4)",
809
+ "--menu-label-fg": "var(--color-text-tertiary)",
810
+ "--menu-label-font-size": "var(--text-xs)",
811
+ "--menu-separator": "var(--color-border-subtle)",
812
+ "--menu-focus-color": "var(--color-focus)",
813
+ "--menu-focus-offset": "calc(-1 * var(--focus-ring-offset))",
814
+ "--menu-focus-width": "var(--focus-ring-width)"
815
+ },
816
+ "avatar": {
817
+ "--avatar-size-sm": "var(--space-6)",
818
+ "--avatar-size-md": "var(--space-8)",
819
+ "--avatar-size-lg": "var(--space-12)",
820
+ "--avatar-radius-circle": "var(--radius-full)",
821
+ "--avatar-radius-square": "var(--radius-md)",
822
+ "--avatar-bg": "var(--color-surface-sunken)",
823
+ "--avatar-fg": "var(--color-text-secondary)",
824
+ "--avatar-border": "var(--color-border-default)",
825
+ "--avatar-font": "var(--font-body)",
826
+ "--avatar-font-weight": "var(--weight-semibold)",
827
+ "--avatar-font-size-sm": "var(--text-xs)",
828
+ "--avatar-font-size-md": "var(--text-sm)",
829
+ "--avatar-font-size-lg": "var(--text-lg)",
830
+ "--avatar-count-font": "var(--font-mono)",
831
+ "--avatar-ring": "var(--color-surface)",
832
+ "--avatar-ring-width": "2px",
833
+ "--avatar-overlap-ratio": "0.15",
834
+ "--avatar-status-size-sm": "var(--space-2)",
835
+ "--avatar-status-size-md": "var(--space-2-5)",
836
+ "--avatar-status-size-lg": "var(--space-3)",
837
+ "--avatar-status-online": "var(--color-success)",
838
+ "--avatar-status-away": "var(--color-warning)",
839
+ "--avatar-status-busy": "var(--color-danger)",
840
+ "--avatar-status-offline": "var(--color-text-tertiary)",
841
+ "--avatar-status-mark": "var(--color-surface)"
842
+ },
843
+ "stepper": {
844
+ "--stepper-marker-size": "var(--space-8)",
845
+ "--stepper-marker-border-width": "2px",
846
+ "--stepper-marker-font": "var(--font-mono)",
847
+ "--stepper-marker-font-size": "var(--text-sm)",
848
+ "--stepper-marker-bg-upcoming": "var(--color-surface)",
849
+ "--stepper-marker-border-upcoming": "var(--color-border-control)",
850
+ "--stepper-marker-fg-upcoming": "var(--color-text-secondary)",
851
+ "--stepper-marker-bg-current": "var(--color-accent-subtle)",
852
+ "--stepper-marker-border-current": "var(--color-accent)",
853
+ "--stepper-marker-fg-current": "var(--color-accent-subtle-fg)",
854
+ "--stepper-marker-bg-complete": "var(--color-accent)",
855
+ "--stepper-marker-border-complete": "var(--color-accent)",
856
+ "--stepper-marker-fg-complete": "var(--color-accent-on)",
857
+ "--stepper-marker-bg-error": "var(--color-danger-bg)",
858
+ "--stepper-marker-border-error": "var(--color-danger)",
859
+ "--stepper-marker-fg-error": "var(--color-danger-fg)",
860
+ "--stepper-connector-size": "2px",
861
+ "--stepper-connector-bg": "var(--color-border-default)",
862
+ "--stepper-connector-bg-complete": "var(--color-accent)",
863
+ "--stepper-connector-gap": "var(--space-2)",
864
+ "--stepper-gap": "var(--space-2)",
865
+ "--stepper-step-gap": "var(--space-6)",
866
+ "--stepper-label-fg": "var(--color-text-primary)",
867
+ "--stepper-label-fg-upcoming": "var(--color-text-secondary)",
868
+ "--stepper-label-fg-error": "var(--color-danger-fg)",
869
+ "--stepper-description-fg": "var(--color-text-secondary)",
870
+ "--stepper-description-fg-error": "var(--color-danger-fg)",
871
+ "--stepper-duration": "var(--duration-base)",
872
+ "--stepper-ease": "var(--ease-standard)"
873
+ },
874
+ "empty": {
875
+ "--empty-padding": "var(--space-16) var(--space-6)",
876
+ "--empty-icon-size": "var(--space-12)",
877
+ "--empty-icon-bg": "var(--color-surface-sunken)",
878
+ "--empty-icon-fg": "var(--color-text-tertiary)",
879
+ "--empty-title-fg": "var(--color-text-primary)",
880
+ "--empty-title-size": "var(--text-lg)",
881
+ "--empty-body-fg": "var(--color-text-secondary)",
882
+ "--empty-body-size": "var(--text-sm)",
883
+ "--empty-gap": "var(--space-3)",
884
+ "--empty-max-width": "26rem",
885
+ "--empty-dashed-border": "var(--color-border-strong)",
886
+ "--empty-radius": "var(--radius-lg)",
887
+ "--empty-skeleton-gap": "var(--space-4)",
888
+ "--empty-skeleton-width": "24rem"
889
+ },
890
+ "motion": {
891
+ "--motion-lift-y": "-2px",
892
+ "--motion-lift-shadow": "var(--shadow-md)",
893
+ "--motion-underline-thickness": "1px",
894
+ "--motion-underline-offset": "0.2em",
895
+ "--motion-nudge": "3px",
896
+ "--motion-row-nudge": "4px",
897
+ "--motion-duration": "var(--duration-base)",
898
+ "--motion-duration-fast": "var(--duration-fast)",
899
+ "--motion-duration-slow": "var(--duration-slow)",
900
+ "--motion-delay-none": "0ms",
901
+ "--motion-delay-short": "var(--duration-fast)",
902
+ "--motion-delay-long": "var(--duration-slow)",
903
+ "--motion-ease": "var(--ease-standard)"
904
+ },
905
+ } as const;
906
+
907
+ export const focus = {
908
+ "--focus-ring-width": "2px",
909
+ "--focus-ring-offset": "2px",
910
+ "--focus-ring-color": "var(--color-focus)",
911
+ "--focus-ring-offset-color": "var(--color-focus-offset)"
912
+ } as const;