@aurea-uds/tokens 0.2.0 → 0.3.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 (5) hide show
  1. package/dist/aurea.tokens.css.d.ts +3 -0
  2. package/dist/aurea.tokens.native.d.ts +9 -0
  3. package/dist/aurea.tokens.native.js +957 -0
  4. package/package.json +19 -4
  5. package/src/aurea.tokens.json +2311 -2311
package/src/aurea.tokens.json CHANGED
@@ -1,2311 +1,2311 @@
1
- {
2
- "$description": "Aurea design tokens — DTCG 2025.10. Single source of truth; build-tokens.mjs emits CSS.",
3
- "$extensions": {
4
- "ui.aurea": {
5
- "version": "1.7.0",
6
- "source": "UI-KIT.html v1.7",
7
- "principles": [
8
- "preserve-current-visual-language",
9
- "semantic-tokens-only",
10
- "floating-surfaces",
11
- "pill-controls",
12
- "no-gradients"
13
- ],
14
- "selectors": {
15
- "base": ":root",
16
- "theme.dark": "[data-theme=\"dark\"]",
17
- "theme.light": "[data-theme=\"light\"]",
18
- "density.compact": "[data-density=\"compact\"]",
19
- "density.comfortable": "[data-density=\"comfortable\"]",
20
- "density.spacious": "[data-density=\"spacious\"]"
21
- }
22
- }
23
- },
24
- "base": {
25
- "brand-yellow": {
26
- "$type": "color",
27
- "$value": {
28
- "colorSpace": "oklch",
29
- "components": [
30
- 0.795,
31
- 0.184,
32
- 86.047
33
- ]
34
- }
35
- },
36
- "brand-yellow-foreground": {
37
- "$type": "color",
38
- "$value": {
39
- "colorSpace": "oklch",
40
- "components": [
41
- 0.421,
42
- 0.095,
43
- 57.708
44
- ]
45
- }
46
- },
47
- "font-ui": {
48
- "$type": "fontFamily",
49
- "$value": [
50
- "IBM Plex Sans",
51
- "Segoe UI",
52
- "sans-serif"
53
- ]
54
- },
55
- "font-editorial": {
56
- "$type": "fontFamily",
57
- "$value": [
58
- "IBM Plex Serif",
59
- "Georgia",
60
- "serif"
61
- ]
62
- },
63
- "font-code": {
64
- "$type": "fontFamily",
65
- "$value": [
66
- "IBM Plex Mono",
67
- "SFMono-Regular",
68
- "Consolas",
69
- "monospace"
70
- ]
71
- },
72
- "text-xs": {
73
- "$type": "dimension",
74
- "$value": {
75
- "value": 0.75,
76
- "unit": "rem"
77
- }
78
- },
79
- "text-sm": {
80
- "$type": "dimension",
81
- "$value": {
82
- "value": 0.8125,
83
- "unit": "rem"
84
- }
85
- },
86
- "text-md": {
87
- "$type": "dimension",
88
- "$value": {
89
- "value": 0.875,
90
- "unit": "rem"
91
- }
92
- },
93
- "text-base": {
94
- "$type": "dimension",
95
- "$value": {
96
- "value": 1,
97
- "unit": "rem"
98
- }
99
- },
100
- "text-lg": {
101
- "$type": "dimension",
102
- "$value": {
103
- "value": 1.125,
104
- "unit": "rem"
105
- }
106
- },
107
- "text-xl": {
108
- "$type": "dimension",
109
- "$value": {
110
- "value": 1.25,
111
- "unit": "rem"
112
- }
113
- },
114
- "text-2xl": {
115
- "$type": "dimension",
116
- "$value": {
117
- "value": 1.5,
118
- "unit": "rem"
119
- }
120
- },
121
- "text-3xl": {
122
- "$type": "dimension",
123
- "$value": {
124
- "value": 1.875,
125
- "unit": "rem"
126
- }
127
- },
128
- "text-4xl": {
129
- "$type": "dimension",
130
- "$value": {
131
- "value": 2.25,
132
- "unit": "rem"
133
- }
134
- },
135
- "text-5xl": {
136
- "$type": "dimension",
137
- "$value": {
138
- "value": 3,
139
- "unit": "rem"
140
- }
141
- },
142
- "leading-tight": {
143
- "$type": "number",
144
- "$value": 1.2
145
- },
146
- "leading-normal": {
147
- "$type": "number",
148
- "$value": 1.5
149
- },
150
- "leading-relaxed": {
151
- "$type": "number",
152
- "$value": 1.7
153
- },
154
- "space-0": {
155
- "$type": "dimension",
156
- "$value": {
157
- "value": 0,
158
- "unit": "px"
159
- }
160
- },
161
- "space-05": {
162
- "$description": "Half-step below space-1 (2px). The tightest gap in the scale; use only where 4px is visibly too much, e.g. the flush topbar hugging the content.",
163
- "$type": "dimension",
164
- "$value": {
165
- "value": 0.125,
166
- "unit": "rem"
167
- }
168
- },
169
- "space-1": {
170
- "$type": "dimension",
171
- "$value": {
172
- "value": 0.25,
173
- "unit": "rem"
174
- }
175
- },
176
- "space-2": {
177
- "$type": "dimension",
178
- "$value": {
179
- "value": 0.5,
180
- "unit": "rem"
181
- }
182
- },
183
- "space-3": {
184
- "$type": "dimension",
185
- "$value": {
186
- "value": 0.75,
187
- "unit": "rem"
188
- }
189
- },
190
- "space-4": {
191
- "$type": "dimension",
192
- "$value": {
193
- "value": 1,
194
- "unit": "rem"
195
- }
196
- },
197
- "space-5": {
198
- "$type": "dimension",
199
- "$value": {
200
- "value": 1.25,
201
- "unit": "rem"
202
- }
203
- },
204
- "space-6": {
205
- "$type": "dimension",
206
- "$value": {
207
- "value": 1.5,
208
- "unit": "rem"
209
- }
210
- },
211
- "space-7": {
212
- "$type": "dimension",
213
- "$value": {
214
- "value": 1.75,
215
- "unit": "rem"
216
- }
217
- },
218
- "space-8": {
219
- "$type": "dimension",
220
- "$value": {
221
- "value": 2,
222
- "unit": "rem"
223
- }
224
- },
225
- "space-10": {
226
- "$type": "dimension",
227
- "$value": {
228
- "value": 2.5,
229
- "unit": "rem"
230
- }
231
- },
232
- "space-12": {
233
- "$type": "dimension",
234
- "$value": {
235
- "value": 3,
236
- "unit": "rem"
237
- }
238
- },
239
- "space-16": {
240
- "$type": "dimension",
241
- "$value": {
242
- "value": 4,
243
- "unit": "rem"
244
- }
245
- },
246
- "space-20": {
247
- "$type": "dimension",
248
- "$value": {
249
- "value": 5,
250
- "unit": "rem"
251
- }
252
- },
253
- "space-24": {
254
- "$type": "dimension",
255
- "$value": {
256
- "value": 6,
257
- "unit": "rem"
258
- }
259
- },
260
- "radius-xs": {
261
- "$type": "dimension",
262
- "$value": {
263
- "value": 6,
264
- "unit": "px"
265
- }
266
- },
267
- "radius-sm": {
268
- "$type": "dimension",
269
- "$value": {
270
- "value": 8,
271
- "unit": "px"
272
- }
273
- },
274
- "radius-md": {
275
- "$type": "dimension",
276
- "$value": {
277
- "value": 10,
278
- "unit": "px"
279
- }
280
- },
281
- "radius-lg": {
282
- "$type": "dimension",
283
- "$value": {
284
- "value": 16,
285
- "unit": "px"
286
- }
287
- },
288
- "radius-card": {
289
- "$type": "dimension",
290
- "$value": {
291
- "value": 22,
292
- "unit": "px"
293
- }
294
- },
295
- "radius-control": {
296
- "$type": "dimension",
297
- "$value": {
298
- "value": 999,
299
- "unit": "px"
300
- }
301
- },
302
- "radius-full": {
303
- "$type": "dimension",
304
- "$value": "{radius-control}",
305
- "$description": "Alias de radius-control. Referência e não cópia: dois nomes com o mesmo número escrito à mão divergem no dia em que um é ajustado."
306
- },
307
- "border-width": {
308
- "$type": "dimension",
309
- "$value": {
310
- "value": 1,
311
- "unit": "px"
312
- }
313
- },
314
- "shadow-md": {
315
- "$type": "shadow",
316
- "$value": {
317
- "color": {
318
- "colorSpace": "srgb",
319
- "components": [
320
- 0,
321
- 0,
322
- 0
323
- ],
324
- "hex": "#000000",
325
- "alpha": 0.28
326
- },
327
- "offsetX": {
328
- "value": 0,
329
- "unit": "px"
330
- },
331
- "offsetY": {
332
- "value": 16,
333
- "unit": "px"
334
- },
335
- "blur": {
336
- "value": 42,
337
- "unit": "px"
338
- },
339
- "spread": {
340
- "value": 0,
341
- "unit": "px"
342
- }
343
- }
344
- },
345
- "shadow-lg": {
346
- "$type": "shadow",
347
- "$value": {
348
- "color": {
349
- "colorSpace": "srgb",
350
- "components": [
351
- 0,
352
- 0,
353
- 0
354
- ],
355
- "hex": "#000000",
356
- "alpha": 0.42
357
- },
358
- "offsetX": {
359
- "value": 0,
360
- "unit": "px"
361
- },
362
- "offsetY": {
363
- "value": 28,
364
- "unit": "px"
365
- },
366
- "blur": {
367
- "value": 80,
368
- "unit": "px"
369
- },
370
- "spread": {
371
- "value": 0,
372
- "unit": "px"
373
- }
374
- }
375
- },
376
- "duration-fast": {
377
- "$type": "duration",
378
- "$value": {
379
- "value": 120,
380
- "unit": "ms"
381
- }
382
- },
383
- "duration-base": {
384
- "$type": "duration",
385
- "$value": {
386
- "value": 180,
387
- "unit": "ms"
388
- }
389
- },
390
- "duration-slow": {
391
- "$type": "duration",
392
- "$value": {
393
- "value": 280,
394
- "unit": "ms"
395
- }
396
- },
397
- "ease-standard": {
398
- "$type": "cubicBezier",
399
- "$value": [
400
- 0.2,
401
- 0,
402
- 0,
403
- 1
404
- ]
405
- },
406
- "ease-emphasized": {
407
- "$type": "cubicBezier",
408
- "$value": [
409
- 0.2,
410
- 0.8,
411
- 0.2,
412
- 1
413
- ]
414
- },
415
- "z-base": {
416
- "$type": "number",
417
- "$value": 0
418
- },
419
- "z-sticky": {
420
- "$type": "number",
421
- "$value": 20
422
- },
423
- "z-dropdown": {
424
- "$type": "number",
425
- "$value": 40
426
- },
427
- "z-drawer": {
428
- "$type": "number",
429
- "$value": 60
430
- },
431
- "z-modal": {
432
- "$type": "number",
433
- "$value": 80
434
- },
435
- "z-toast": {
436
- "$type": "number",
437
- "$value": 100
438
- },
439
- "sidebar-width": {
440
- "$type": "dimension",
441
- "$value": {
442
- "value": 16.5,
443
- "unit": "rem"
444
- }
445
- },
446
- "sidebar-rail": {
447
- "$type": "dimension",
448
- "$description": "Grid column of the collapsed sidebar: the icon rail. It is the COLUMN, not the panel — the sidebar spends space-4 of margin on each side before it starts, which is why 4.5rem was measured wrong first and left the icon 2px outside the box. 5.5rem = 32px of margin + 2px of border + 16px of the panel's own padding + a 16px icon with room around it.",
449
- "$value": {
450
- "value": 5.5,
451
- "unit": "rem"
452
- }
453
- },
454
- "topbar-height": {
455
- "$type": "dimension",
456
- "$value": {
457
- "value": 4.0,
458
- "unit": "rem"
459
- }
460
- },
461
- "content-max": {
462
- "$type": "dimension",
463
- "$value": {
464
- "value": 102.5,
465
- "unit": "rem"
466
- }
467
- },
468
- "breakpoint-sm": {
469
- "$description": "Responsive scale (Tailwind, the de-facto 2026 standard; base of Untitled UI). Mobile-first: a rule applies at this width and up. @media can't read var(), so CSS uses the literal value — validate.py check 5 guards the scale. JS/native read --breakpoint-*.",
470
- "$type": "dimension",
471
- "$value": {
472
- "value": 640,
473
- "unit": "px"
474
- }
475
- },
476
- "breakpoint-md": {
477
- "$type": "dimension",
478
- "$value": {
479
- "value": 768,
480
- "unit": "px"
481
- }
482
- },
483
- "breakpoint-lg": {
484
- "$type": "dimension",
485
- "$value": {
486
- "value": 1024,
487
- "unit": "px"
488
- }
489
- },
490
- "breakpoint-xl": {
491
- "$type": "dimension",
492
- "$value": {
493
- "value": 1280,
494
- "unit": "px"
495
- }
496
- },
497
- "breakpoint-2xl": {
498
- "$type": "dimension",
499
- "$value": {
500
- "value": 1536,
501
- "unit": "px"
502
- }
503
- },
504
- "control-h-xs": {
505
- "$type": "dimension",
506
- "$value": {
507
- "value": 1.625,
508
- "unit": "rem"
509
- }
510
- },
511
- "control-h-sm": {
512
- "$type": "dimension",
513
- "$value": {
514
- "value": 1.875,
515
- "unit": "rem"
516
- }
517
- },
518
- "control-h-md": {
519
- "$type": "dimension",
520
- "$value": {
521
- "value": 2.25,
522
- "unit": "rem"
523
- }
524
- },
525
- "control-h-lg": {
526
- "$type": "dimension",
527
- "$value": {
528
- "value": 2.625,
529
- "unit": "rem"
530
- }
531
- },
532
- "control-h-xl": {
533
- "$type": "dimension",
534
- "$value": {
535
- "value": 3.125,
536
- "unit": "rem"
537
- }
538
- },
539
- "row-h": {
540
- "$type": "dimension",
541
- "$value": {
542
- "value": 3.0,
543
- "unit": "rem"
544
- }
545
- },
546
- "card-pad": {
547
- "$type": "dimension",
548
- "$value": {
549
- "value": 1.25,
550
- "unit": "rem"
551
- }
552
- },
553
- "section-gap": {
554
- "$type": "dimension",
555
- "$value": {
556
- "value": 1.5,
557
- "unit": "rem"
558
- }
559
- },
560
- "media-canvas": {
561
- "$type": "color",
562
- "$value": {
563
- "colorSpace": "oklch",
564
- "components": [
565
- 0.085,
566
- 0,
567
- 0
568
- ]
569
- }
570
- },
571
- "media-foreground": {
572
- "$type": "color",
573
- "$value": {
574
- "colorSpace": "oklch",
575
- "components": [
576
- 0.985,
577
- 0,
578
- 0
579
- ]
580
- }
581
- },
582
- "media-muted": {
583
- "$type": "color",
584
- "$value": {
585
- "colorSpace": "oklch",
586
- "components": [
587
- 0.74,
588
- 0,
589
- 0
590
- ]
591
- }
592
- },
593
- "media-scrim": {
594
- "$type": "color",
595
- "$value": {
596
- "colorSpace": "oklch",
597
- "components": [
598
- 0,
599
- 0,
600
- 0
601
- ],
602
- "alpha": 0.82
603
- }
604
- },
605
- "media-track": {
606
- "$type": "color",
607
- "$value": {
608
- "colorSpace": "oklch",
609
- "components": [
610
- 1,
611
- 0,
612
- 0
613
- ],
614
- "alpha": 0.18
615
- }
616
- },
617
- "media-buffered": {
618
- "$type": "color",
619
- "$value": {
620
- "colorSpace": "oklch",
621
- "components": [
622
- 1,
623
- 0,
624
- 0
625
- ],
626
- "alpha": 0.42
627
- }
628
- },
629
- "media-caption-bg": {
630
- "$type": "color",
631
- "$value": {
632
- "colorSpace": "oklch",
633
- "components": [
634
- 0,
635
- 0,
636
- 0
637
- ],
638
- "alpha": 0.82
639
- }
640
- },
641
- "media-control-bg": {
642
- "$type": "color",
643
- "$value": {
644
- "colorSpace": "oklch",
645
- "components": [
646
- 0,
647
- 0,
648
- 0
649
- ],
650
- "alpha": 0.52
651
- }
652
- },
653
- "media-control-hover": {
654
- "$type": "color",
655
- "$value": {
656
- "colorSpace": "oklch",
657
- "components": [
658
- 1,
659
- 0,
660
- 0
661
- ],
662
- "alpha": 0.14
663
- }
664
- },
665
- "text-muted": {
666
- "$type": "dimension",
667
- "$value": "{muted-foreground}"
668
- },
669
- "success-400": {
670
- "$type": "color",
671
- "$description": "The success tone: online status, success badge and alert icons.",
672
- "$value": {
673
- "colorSpace": "srgb",
674
- "components": [
675
- 0.25882,
676
- 0.82745,
677
- 0.57255
678
- ],
679
- "hex": "#42d392"
680
- }
681
- },
682
- "success-500": {
683
- "$type": "color",
684
- "$value": {
685
- "colorSpace": "srgb",
686
- "components": [
687
- 0.13333,
688
- 0.78431,
689
- 0.45882
690
- ],
691
- "hex": "#22c875"
692
- }
693
- },
694
- "success-700": {
695
- "$type": "color",
696
- "$value": {
697
- "colorSpace": "srgb",
698
- "components": [
699
- 0.07843,
700
- 0.47843,
701
- 0.30196
702
- ],
703
- "hex": "#147a4d"
704
- }
705
- },
706
- "warning-400": {
707
- "$type": "color",
708
- "$description": "The warning tone: away status, warning badge and alert icons.",
709
- "$value": "{brand-yellow}"
710
- },
711
- "warning-500": {
712
- "$type": "color",
713
- "$value": {
714
- "colorSpace": "srgb",
715
- "components": [
716
- 0.83137,
717
- 0.61176,
718
- 0
719
- ],
720
- "hex": "#d49c00"
721
- }
722
- },
723
- "warning-800": {
724
- "$type": "color",
725
- "$value": {
726
- "colorSpace": "srgb",
727
- "components": [
728
- 0.42745,
729
- 0.30196,
730
- 0
731
- ],
732
- "hex": "#6d4d00"
733
- }
734
- },
735
- "danger-400": {
736
- "$type": "color",
737
- "$description": "The danger TONE: dot of a failed status, border of an invalid field, icon of a danger alert. The colour that says \"wrong\", on text and on marks.",
738
- "$value": {
739
- "colorSpace": "srgb",
740
- "components": [
741
- 1,
742
- 0.44314,
743
- 0.50196
744
- ],
745
- "hex": "#ff7180"
746
- }
747
- },
748
- "danger-500": {
749
- "$type": "color",
750
- "$value": {
751
- "colorSpace": "srgb",
752
- "components": [
753
- 0.91373,
754
- 0.29412,
755
- 0.3451
756
- ],
757
- "hex": "#e94b58"
758
- }
759
- },
760
- "danger-800": {
761
- "$type": "color",
762
- "$value": {
763
- "colorSpace": "srgb",
764
- "components": [
765
- 0.49804,
766
- 0.12549,
767
- 0.16078
768
- ],
769
- "hex": "#7f2029"
770
- }
771
- },
772
- "info-400": {
773
- "$type": "color",
774
- "$description": "The informational tone: running status, info badge and alert icons. Neutral news, not a problem.",
775
- "$value": {
776
- "colorSpace": "srgb",
777
- "components": [
778
- 0.55686,
779
- 0.77255,
780
- 1
781
- ],
782
- "hex": "#8ec5ff"
783
- }
784
- },
785
- "info-500": {
786
- "$type": "color",
787
- "$value": {
788
- "colorSpace": "srgb",
789
- "components": [
790
- 0.16863,
791
- 0.49804,
792
- 1
793
- ],
794
- "hex": "#2b7fff"
795
- }
796
- },
797
- "info-800": {
798
- "$type": "color",
799
- "$value": {
800
- "colorSpace": "srgb",
801
- "components": [
802
- 0.07843,
803
- 0.27843,
804
- 0.90196
805
- ],
806
- "hex": "#1447e6"
807
- }
808
- },
809
- "oracle-50": {
810
- "$type": "color",
811
- "$value": {
812
- "colorSpace": "oklch",
813
- "components": [
814
- 0.96,
815
- 0.025,
816
- 251.813
817
- ]
818
- }
819
- },
820
- "oracle-100": {
821
- "$type": "color",
822
- "$value": {
823
- "colorSpace": "oklch",
824
- "components": [
825
- 0.9,
826
- 0.06,
827
- 251.813
828
- ]
829
- }
830
- },
831
- "oracle-200": {
832
- "$type": "color",
833
- "$value": {
834
- "colorSpace": "oklch",
835
- "components": [
836
- 0.85,
837
- 0.09,
838
- 251.813
839
- ]
840
- }
841
- },
842
- "oracle-300": {
843
- "$type": "color",
844
- "$description": "Reserved accent kept from the origin kit and deliberately unused by the core. It is not part of the Aurea palette contract — do not introduce it without a decision.",
845
- "$value": "{chart-1}"
846
- },
847
- "oracle-400": {
848
- "$type": "color",
849
- "$description": "Reserved accent kept from the origin kit and deliberately unused by the core. It is not part of the Aurea palette contract — do not introduce it without a decision.",
850
- "$value": "{chart-2}"
851
- },
852
- "oracle-500": {
853
- "$type": "color",
854
- "$value": "{chart-3}"
855
- },
856
- "oracle-600": {
857
- "$type": "color",
858
- "$value": "{chart-4}"
859
- },
860
- "oracle-700": {
861
- "$type": "color",
862
- "$value": "{chart-5}"
863
- },
864
- "oracle-800": {
865
- "$type": "color",
866
- "$value": {
867
- "colorSpace": "oklch",
868
- "components": [
869
- 0.38,
870
- 0.2,
871
- 265.638
872
- ]
873
- }
874
- },
875
- "oracle-900": {
876
- "$type": "color",
877
- "$value": {
878
- "colorSpace": "oklch",
879
- "components": [
880
- 0.31,
881
- 0.16,
882
- 265.638
883
- ]
884
- }
885
- },
886
- "oracle-950": {
887
- "$type": "color",
888
- "$value": {
889
- "colorSpace": "oklch",
890
- "components": [
891
- 0.23,
892
- 0.11,
893
- 265.638
894
- ]
895
- }
896
- },
897
- "weight-regular": {
898
- "$type": "number",
899
- "$value": 400,
900
- "$description": "Corpo de texto."
901
- },
902
- "weight-medium": {
903
- "$type": "number",
904
- "$value": 500,
905
- "$description": "Rótulo, botão, ênfase leve."
906
- },
907
- "weight-semibold": {
908
- "$type": "number",
909
- "$value": 600,
910
- "$description": "Título de seção, cabeçalho de tabela."
911
- },
912
- "weight-bold": {
913
- "$type": "number",
914
- "$value": 700,
915
- "$description": "Título de página e número de destaque."
916
- },
917
- "icon-sm": {
918
- "$type": "dimension",
919
- "$value": {
920
- "value": 1,
921
- "unit": "rem"
922
- },
923
- "$description": "Glifo dentro de controle pequeno, badge e chip."
924
- },
925
- "icon-md": {
926
- "$type": "dimension",
927
- "$value": {
928
- "value": 1.25,
929
- "unit": "rem"
930
- },
931
- "$description": "Glifo padrão, alinhado ao texto de corpo."
932
- },
933
- "icon-lg": {
934
- "$type": "dimension",
935
- "$value": {
936
- "value": 1.5,
937
- "unit": "rem"
938
- },
939
- "$description": "Glifo de destaque em cabeçalho."
940
- },
941
- "icon-xl": {
942
- "$type": "dimension",
943
- "$value": {
944
- "value": 2,
945
- "unit": "rem"
946
- },
947
- "$description": "Glifo de estado vazio e de ilustração."
948
- },
949
- "tracking-tight": {
950
- "$type": "dimension",
951
- "$value": {
952
- "value": -0.01,
953
- "unit": "em"
954
- },
955
- "$description": "Fecha o texto em tamanho grande, onde o espaçamento natural parece solto."
956
- },
957
- "tracking-normal": {
958
- "$type": "dimension",
959
- "$value": {
960
- "value": 0,
961
- "unit": "em"
962
- },
963
- "$description": "Sem ajuste — o padrão da fonte."
964
- },
965
- "leading-none": {
966
- "$type": "number",
967
- "$value": 1,
968
- "$description": "Entrelinha colada ao glifo: usada onde a ALTURA do componente é o contrato e não pode variar com a herança (ver badge e chip)."
969
- },
970
- "target-min": {
971
- "$type": "dimension",
972
- "$value": {
973
- "value": 2.75,
974
- "unit": "rem"
975
- },
976
- "$description": "Área mínima de toque (44px a 16px de raiz) — WCAG 2.5.5/2.5.8 em ponteiro grosseiro."
977
- },
978
- "tracking-wide": {
979
- "$type": "dimension",
980
- "$value": {
981
- "value": 0.04,
982
- "unit": "em"
983
- },
984
- "$description": "Abre levemente o rótulo em caixa alta."
985
- },
986
- "tracking-wider": {
987
- "$type": "dimension",
988
- "$value": {
989
- "value": 0.06,
990
- "unit": "em"
991
- },
992
- "$description": "Rótulo curto em caixa alta, como eyebrow."
993
- },
994
- "tracking-widest": {
995
- "$type": "dimension",
996
- "$value": {
997
- "value": 0.12,
998
- "unit": "em"
999
- },
1000
- "$description": "Rótulo de categoria — o mais aberto da escala."
1001
- }
1002
- },
1003
- "theme": {
1004
- "dark": {
1005
- "background": {
1006
- "$type": "color",
1007
- "$description": "The page canvas — the furthest-back surface. Everything floats on top of it; nothing else should use it as a fill.",
1008
- "$value": {
1009
- "colorSpace": "oklch",
1010
- "components": [
1011
- 0.145,
1012
- 0,
1013
- 0
1014
- ]
1015
- }
1016
- },
1017
- "foreground": {
1018
- "$type": "color",
1019
- "$description": "Default body text, on the canvas and on the panel surfaces alike. The most used text colour in the system.",
1020
- "$value": {
1021
- "colorSpace": "oklch",
1022
- "components": [
1023
- 0.985,
1024
- 0,
1025
- 0
1026
- ]
1027
- }
1028
- },
1029
- "card": {
1030
- "$type": "color",
1031
- "$description": "Surface of a floating panel: card, topbar, content area. The Aurea identity is built on these, so this is the fill you reach for by default.",
1032
- "$value": {
1033
- "colorSpace": "oklch",
1034
- "components": [
1035
- 0.205,
1036
- 0,
1037
- 0
1038
- ]
1039
- }
1040
- },
1041
- "card-foreground": {
1042
- "$type": "color",
1043
- "$description": "Text on --card. Separate from --foreground so a panel can shift tone without the text following blindly.",
1044
- "$value": {
1045
- "colorSpace": "oklch",
1046
- "components": [
1047
- 0.985,
1048
- 0,
1049
- 0
1050
- ]
1051
- }
1052
- },
1053
- "popover": {
1054
- "$type": "color",
1055
- "$description": "Surface of a TRANSIENT layer — dialog, drawer, toast, menu, tooltip. It reads as sitting above --card, and that is what tells the eye the layer is temporary.",
1056
- "$value": {
1057
- "colorSpace": "oklch",
1058
- "components": [
1059
- 0.205,
1060
- 0,
1061
- 0
1062
- ]
1063
- }
1064
- },
1065
- "popover-foreground": {
1066
- "$type": "color",
1067
- "$description": "Text on --popover.",
1068
- "$value": {
1069
- "colorSpace": "oklch",
1070
- "components": [
1071
- 0.985,
1072
- 0,
1073
- 0
1074
- ]
1075
- }
1076
- },
1077
- "primary": {
1078
- "$type": "color",
1079
- "$description": "The Aurea yellow. INVARIANT between themes by contract — links, accents, the selected state. Never redefine it.",
1080
- "$value": "{brand-yellow}"
1081
- },
1082
- "primary-foreground": {
1083
- "$type": "color",
1084
- "$description": "Text and glyphs ON the yellow. Dark on purpose: yellow is a light colour in both themes.",
1085
- "$value": "{brand-yellow-foreground}"
1086
- },
1087
- "secondary": {
1088
- "$type": "color",
1089
- "$description": "Fill of the quiet-but-present control: secondary button, the current item of a navigation list, a segment that is on.",
1090
- "$value": {
1091
- "colorSpace": "oklch",
1092
- "components": [
1093
- 0.274,
1094
- 0.006,
1095
- 286.033
1096
- ]
1097
- }
1098
- },
1099
- "secondary-foreground": {
1100
- "$type": "color",
1101
- "$description": "Text on --secondary.",
1102
- "$value": {
1103
- "colorSpace": "oklch",
1104
- "components": [
1105
- 0.985,
1106
- 0,
1107
- 0
1108
- ]
1109
- }
1110
- },
1111
- "muted": {
1112
- "$type": "color",
1113
- "$description": "Fill for a de-emphasised block — the surface counterpart of --muted-foreground, not a text colour.",
1114
- "$value": {
1115
- "colorSpace": "oklch",
1116
- "components": [
1117
- 0.269,
1118
- 0,
1119
- 0
1120
- ]
1121
- }
1122
- },
1123
- "muted-foreground": {
1124
- "$type": "color",
1125
- "$description": "Secondary text: helper copy, captions, an item that is present but is not the point.",
1126
- "$value": {
1127
- "colorSpace": "oklch",
1128
- "components": [
1129
- 0.708,
1130
- 0,
1131
- 0
1132
- ]
1133
- }
1134
- },
1135
- "accent": {
1136
- "$type": "color",
1137
- "$description": "Hover surface of a control that has no fill of its own (ghost and outline buttons). The lightest possible \"something happened here\".",
1138
- "$value": {
1139
- "colorSpace": "oklch",
1140
- "components": [
1141
- 0.269,
1142
- 0,
1143
- 0
1144
- ]
1145
- }
1146
- },
1147
- "accent-foreground": {
1148
- "$type": "color",
1149
- "$description": "Text on --accent.",
1150
- "$value": {
1151
- "colorSpace": "oklch",
1152
- "components": [
1153
- 0.985,
1154
- 0,
1155
- 0
1156
- ]
1157
- }
1158
- },
1159
- "destructive": {
1160
- "$type": "color",
1161
- "$description": "Surface of an action that destroys something: the danger button. For actions only — a MESSAGE about danger uses --danger-400 and --danger-bg.",
1162
- "$value": {
1163
- "colorSpace": "oklch",
1164
- "components": [
1165
- 0.704,
1166
- 0.191,
1167
- 22.216
1168
- ]
1169
- }
1170
- },
1171
- "destructive-foreground": {
1172
- "$type": "color",
1173
- "$description": "Text on --destructive.",
1174
- "$value": {
1175
- "colorSpace": "oklch",
1176
- "components": [
1177
- 0.2,
1178
- 0.02,
1179
- 22
1180
- ]
1181
- }
1182
- },
1183
- "border": {
1184
- "$type": "color",
1185
- "$description": "The default hairline between surfaces, and the most used border in the system. If you are unsure which border to use, it is this one.",
1186
- "$value": {
1187
- "colorSpace": "oklch",
1188
- "components": [
1189
- 1,
1190
- 0,
1191
- 0
1192
- ],
1193
- "alpha": 0.1
1194
- }
1195
- },
1196
- "input": {
1197
- "$type": "color",
1198
- "$description": "Border of a form control. Reserved: the core draws fields with --border, and this exists so a consumer can separate the two without forking the CSS.",
1199
- "$value": {
1200
- "colorSpace": "oklch",
1201
- "components": [
1202
- 1,
1203
- 0,
1204
- 0
1205
- ],
1206
- "alpha": 0.15
1207
- }
1208
- },
1209
- "ring": {
1210
- "$type": "color",
1211
- "$description": "Reserved alias for a focus ring in consumer code. The core uses --focus-strong; this exists so a consumer can theme their own controls consistently.",
1212
- "$value": {
1213
- "colorSpace": "oklch",
1214
- "components": [
1215
- 0.556,
1216
- 0,
1217
- 0
1218
- ]
1219
- }
1220
- },
1221
- "chart-1": {
1222
- "$type": "color",
1223
- "$description": "First series of a chart. The five chart tokens are an ORDERED sequence: use them in order, so two charts on the same page give the same series the same colour.",
1224
- "$value": {
1225
- "colorSpace": "oklch",
1226
- "components": [
1227
- 0.809,
1228
- 0.105,
1229
- 251.813
1230
- ]
1231
- }
1232
- },
1233
- "chart-2": {
1234
- "$type": "color",
1235
- "$description": "Second series of a chart. See --chart-1 for the rule.",
1236
- "$value": {
1237
- "colorSpace": "oklch",
1238
- "components": [
1239
- 0.623,
1240
- 0.214,
1241
- 259.815
1242
- ]
1243
- }
1244
- },
1245
- "chart-3": {
1246
- "$type": "color",
1247
- "$description": "Third series of a chart. See --chart-1 for the rule.",
1248
- "$value": {
1249
- "colorSpace": "oklch",
1250
- "components": [
1251
- 0.546,
1252
- 0.245,
1253
- 262.881
1254
- ]
1255
- }
1256
- },
1257
- "chart-4": {
1258
- "$type": "color",
1259
- "$description": "Fourth series of a chart. See --chart-1 for the rule.",
1260
- "$value": {
1261
- "colorSpace": "oklch",
1262
- "components": [
1263
- 0.488,
1264
- 0.243,
1265
- 264.376
1266
- ]
1267
- }
1268
- },
1269
- "chart-5": {
1270
- "$type": "color",
1271
- "$description": "Fifth series of a chart. Past five series a chart needs a different form, not a sixth colour.",
1272
- "$value": {
1273
- "colorSpace": "oklch",
1274
- "components": [
1275
- 0.424,
1276
- 0.199,
1277
- 265.638
1278
- ]
1279
- }
1280
- },
1281
- "sidebar": {
1282
- "$type": "color",
1283
- "$description": "Surface of the side panel. Its own token rather than --card, so the sidebar can be tinted apart from the content without touching every panel.",
1284
- "$value": {
1285
- "colorSpace": "oklch",
1286
- "components": [
1287
- 0.205,
1288
- 0,
1289
- 0
1290
- ]
1291
- }
1292
- },
1293
- "sidebar-foreground": {
1294
- "$type": "color",
1295
- "$description": "Text and navigation items inside the sidebar.",
1296
- "$value": {
1297
- "colorSpace": "oklch",
1298
- "components": [
1299
- 0.985,
1300
- 0,
1301
- 0
1302
- ]
1303
- }
1304
- },
1305
- "sidebar-primary": {
1306
- "$type": "color",
1307
- "$description": "Reserved: brand accent scoped to the sidebar, for a shell that needs a different emphasis from the page. Unused by the core.",
1308
- "$value": "{brand-yellow}"
1309
- },
1310
- "sidebar-primary-foreground": {
1311
- "$type": "color",
1312
- "$description": "Reserved: text on --sidebar-primary.",
1313
- "$value": "{brand-yellow-foreground}"
1314
- },
1315
- "sidebar-accent": {
1316
- "$type": "color",
1317
- "$description": "Hover surface of a sidebar item.",
1318
- "$value": {
1319
- "colorSpace": "oklch",
1320
- "components": [
1321
- 0.269,
1322
- 0,
1323
- 0
1324
- ]
1325
- }
1326
- },
1327
- "sidebar-accent-foreground": {
1328
- "$type": "color",
1329
- "$description": "Text of a sidebar item under the pointer.",
1330
- "$value": {
1331
- "colorSpace": "oklch",
1332
- "components": [
1333
- 0.985,
1334
- 0,
1335
- 0
1336
- ]
1337
- }
1338
- },
1339
- "sidebar-border": {
1340
- "$type": "color",
1341
- "$description": "The sidebar's own hairline: its outline, and the rule under the brand lockup.",
1342
- "$value": {
1343
- "colorSpace": "oklch",
1344
- "components": [
1345
- 1,
1346
- 0,
1347
- 0
1348
- ],
1349
- "alpha": 0.1
1350
- }
1351
- },
1352
- "sidebar-ring": {
1353
- "$type": "color",
1354
- "$description": "Reserved: focus ring scoped to the sidebar. The core uses the single system ring, --focus-strong.",
1355
- "$value": {
1356
- "colorSpace": "oklch",
1357
- "components": [
1358
- 0.556,
1359
- 0,
1360
- 0
1361
- ]
1362
- }
1363
- },
1364
- "surface-1": {
1365
- "$type": "color",
1366
- "$description": "Ring and separator colour for where a shape has to be punched out of the panel behind it — the border between overlapping avatars, the ring of a step dot.",
1367
- "$value": "{card}"
1368
- },
1369
- "surface-2": {
1370
- "$type": "color",
1371
- "$description": "One step up from the panel: hover of an interactive card, header row of a table. Use it when something must read as raised, not as coloured.",
1372
- "$value": "{secondary}"
1373
- },
1374
- "surface-3": {
1375
- "$type": "color",
1376
- "$description": "Neutral fill of a track or a placeholder — progress bar, skeleton. It is a background for something that is not text.",
1377
- "$value": "{muted}"
1378
- },
1379
- "surface-inset": {
1380
- "$type": "color",
1381
- "$description": "A recessed well: code block, log stream. It reads as carved INTO the panel, which is the opposite of --surface-2.",
1382
- "$value": {
1383
- "colorSpace": "oklch",
1384
- "components": [
1385
- 0.145,
1386
- 0,
1387
- 0
1388
- ]
1389
- }
1390
- },
1391
- "surface-hover": {
1392
- "$type": "color",
1393
- "$description": "Generic hover tint for a row or a disclosure that has no state of its own. When the element already carries meaning (selected, current), use --secondary instead.",
1394
- "$value": {
1395
- "colorSpace": "oklch",
1396
- "components": [
1397
- 0.3,
1398
- 0,
1399
- 0
1400
- ]
1401
- }
1402
- },
1403
- "foreground-strong": {
1404
- "$type": "color",
1405
- "$description": "Text that must out-contrast the default, for a heading that has to lift off the body. Reserved: the core does not use it, so reaching for it is a decision, not a default.",
1406
- "$value": "{foreground}"
1407
- },
1408
- "subtle-foreground": {
1409
- "$type": "color",
1410
- "$description": "The quietest text in the system — group labels, table headers, metadata. One step below --muted-foreground; below it there is nothing readable.",
1411
- "$value": {
1412
- "colorSpace": "oklch",
1413
- "components": [
1414
- 0.76,
1415
- 0,
1416
- 0
1417
- ]
1418
- }
1419
- },
1420
- "border-strong": {
1421
- "$type": "color",
1422
- "$description": "A border that must read as an EDGE and not as a hint: outline buttons, keyboard keys. Use it when the border IS the shape of the component.",
1423
- "$value": {
1424
- "colorSpace": "oklch",
1425
- "components": [
1426
- 0.58,
1427
- 0,
1428
- 0
1429
- ]
1430
- }
1431
- },
1432
- "field-bg": {
1433
- "$type": "color",
1434
- "$description": "Background of a form control: input, textarea, select, and the mark of a checkbox or radio. Fields sit slightly recessed from the panel.",
1435
- "$value": "{muted}"
1436
- },
1437
- "overlay": {
1438
- "$type": "color",
1439
- "$description": "The scrim behind a modal layer. Dims the page enough to push it back without hiding what is underneath.",
1440
- "$value": {
1441
- "colorSpace": "oklch",
1442
- "components": [
1443
- 0,
1444
- 0,
1445
- 0
1446
- ],
1447
- "alpha": 0.74
1448
- }
1449
- },
1450
- "primary-hover": {
1451
- "$type": "color",
1452
- "$description": "--primary under the pointer, on a filled surface.",
1453
- "$value": {
1454
- "colorSpace": "oklch",
1455
- "components": [
1456
- 0.835,
1457
- 0.19,
1458
- 89
1459
- ]
1460
- }
1461
- },
1462
- "primary-active": {
1463
- "$type": "color",
1464
- "$description": "--primary while pressed. Reserved: the core resolves the pressed state with geometry instead, so this is here for consumers who also want the colour shift.",
1465
- "$value": {
1466
- "colorSpace": "oklch",
1467
- "components": [
1468
- 0.74,
1469
- 0.17,
1470
- 84
1471
- ]
1472
- }
1473
- },
1474
- "secondary-hover": {
1475
- "$type": "color",
1476
- "$description": "--secondary under the pointer.",
1477
- "$value": {
1478
- "colorSpace": "oklch",
1479
- "components": [
1480
- 0.31,
1481
- 0.006,
1482
- 286.033
1483
- ]
1484
- }
1485
- },
1486
- "focus": {
1487
- "$type": "color",
1488
- "$description": "The soft focus colour, for the halo of a control that cannot carry an outline. The focus CONTRACT is built on --focus-strong.",
1489
- "$value": "{primary}"
1490
- },
1491
- "focus-strong": {
1492
- "$type": "color",
1493
- "$description": "The focus ring. One colour and one thickness across the whole system — and that uniformity is a gate (geometry.spec), not a convention.",
1494
- "$value": "{primary}"
1495
- },
1496
- "primary-emphasis": {
1497
- "$type": "color",
1498
- "$description": "A denser yellow for a small solid area that would look washed out at --primary — the primary badge.",
1499
- "$value": "{primary}"
1500
- },
1501
- "primary-outline": {
1502
- "$type": "color",
1503
- "$description": "Yellow at border strength — the outline of a selected card or of a primary badge, where a filled yellow would shout.",
1504
- "$value": "{primary}"
1505
- },
1506
- "control-selected": {
1507
- "$type": "color",
1508
- "$description": "The mark of a checked control — the box of a checkbox, the dot of a radio, the filled half of a switch. It is the state, not the container.",
1509
- "$value": "{primary}"
1510
- },
1511
- "control-selected-foreground": {
1512
- "$type": "color",
1513
- "$description": "The glyph drawn ON --control-selected: the tick, the dot.",
1514
- "$value": "{primary-foreground}"
1515
- },
1516
- "selection": {
1517
- "$type": "color",
1518
- "$description": "Background of text the user has selected. Set once, on ::selection.",
1519
- "$value": {
1520
- "colorSpace": "oklch",
1521
- "components": [
1522
- 0.795,
1523
- 0.184,
1524
- 86.047
1525
- ],
1526
- "alpha": 0.22
1527
- }
1528
- },
1529
- "success-bg": {
1530
- "$type": "color",
1531
- "$description": "The muted success fill behind text.",
1532
- "$value": {
1533
- "colorSpace": "oklch",
1534
- "components": [
1535
- 0.42,
1536
- 0.11,
1537
- 150
1538
- ],
1539
- "alpha": 0.36
1540
- }
1541
- },
1542
- "warning-bg": {
1543
- "$type": "color",
1544
- "$description": "The muted warning fill behind text.",
1545
- "$value": {
1546
- "colorSpace": "oklch",
1547
- "components": [
1548
- 0.34,
1549
- 0.08,
1550
- 86
1551
- ],
1552
- "alpha": 0.64
1553
- }
1554
- },
1555
- "danger-bg": {
1556
- "$type": "color",
1557
- "$description": "The muted danger fill, behind text: danger badge, alert, card. Never for a button — that is --destructive.",
1558
- "$value": {
1559
- "colorSpace": "oklch",
1560
- "components": [
1561
- 0.32,
1562
- 0.1,
1563
- 22
1564
- ],
1565
- "alpha": 0.62
1566
- }
1567
- },
1568
- "info-bg": {
1569
- "$type": "color",
1570
- "$description": "The muted informational fill behind text.",
1571
- "$value": {
1572
- "colorSpace": "oklch",
1573
- "components": [
1574
- 0.29,
1575
- 0.08,
1576
- 260
1577
- ],
1578
- "alpha": 0.62
1579
- }
1580
- }
1581
- },
1582
- "light": {
1583
- "background": {
1584
- "$type": "color",
1585
- "$value": {
1586
- "colorSpace": "oklch",
1587
- "components": [
1588
- 0.965,
1589
- 0,
1590
- 0
1591
- ]
1592
- }
1593
- },
1594
- "foreground": {
1595
- "$type": "color",
1596
- "$value": {
1597
- "colorSpace": "oklch",
1598
- "components": [
1599
- 0.145,
1600
- 0,
1601
- 0
1602
- ]
1603
- }
1604
- },
1605
- "card": {
1606
- "$type": "color",
1607
- "$value": {
1608
- "colorSpace": "oklch",
1609
- "components": [
1610
- 1,
1611
- 0,
1612
- 0
1613
- ]
1614
- }
1615
- },
1616
- "card-foreground": {
1617
- "$type": "color",
1618
- "$value": {
1619
- "colorSpace": "oklch",
1620
- "components": [
1621
- 0.145,
1622
- 0,
1623
- 0
1624
- ]
1625
- }
1626
- },
1627
- "popover": {
1628
- "$type": "color",
1629
- "$value": {
1630
- "colorSpace": "oklch",
1631
- "components": [
1632
- 1,
1633
- 0,
1634
- 0
1635
- ]
1636
- }
1637
- },
1638
- "popover-foreground": {
1639
- "$type": "color",
1640
- "$value": {
1641
- "colorSpace": "oklch",
1642
- "components": [
1643
- 0.145,
1644
- 0,
1645
- 0
1646
- ]
1647
- }
1648
- },
1649
- "primary": {
1650
- "$type": "color",
1651
- "$value": "{brand-yellow}"
1652
- },
1653
- "primary-foreground": {
1654
- "$type": "color",
1655
- "$value": "{brand-yellow-foreground}"
1656
- },
1657
- "secondary": {
1658
- "$type": "color",
1659
- "$value": {
1660
- "colorSpace": "oklch",
1661
- "components": [
1662
- 0.94,
1663
- 0,
1664
- 0
1665
- ]
1666
- }
1667
- },
1668
- "secondary-foreground": {
1669
- "$type": "color",
1670
- "$value": {
1671
- "colorSpace": "oklch",
1672
- "components": [
1673
- 0.21,
1674
- 0.006,
1675
- 285.885
1676
- ]
1677
- }
1678
- },
1679
- "muted": {
1680
- "$type": "color",
1681
- "$value": "{secondary}"
1682
- },
1683
- "muted-foreground": {
1684
- "$type": "color",
1685
- "$value": {
1686
- "colorSpace": "oklch",
1687
- "components": [
1688
- 0.43,
1689
- 0,
1690
- 0
1691
- ]
1692
- }
1693
- },
1694
- "accent": {
1695
- "$type": "color",
1696
- "$value": "{secondary}"
1697
- },
1698
- "accent-foreground": {
1699
- "$type": "color",
1700
- "$value": {
1701
- "colorSpace": "oklch",
1702
- "components": [
1703
- 0.205,
1704
- 0,
1705
- 0
1706
- ]
1707
- }
1708
- },
1709
- "destructive": {
1710
- "$type": "color",
1711
- "$value": {
1712
- "colorSpace": "oklch",
1713
- "components": [
1714
- 0.577,
1715
- 0.245,
1716
- 27.325
1717
- ]
1718
- }
1719
- },
1720
- "destructive-foreground": {
1721
- "$type": "color",
1722
- "$value": {
1723
- "colorSpace": "oklch",
1724
- "components": [
1725
- 0.985,
1726
- 0,
1727
- 0
1728
- ]
1729
- }
1730
- },
1731
- "border": {
1732
- "$type": "color",
1733
- "$value": {
1734
- "colorSpace": "oklch",
1735
- "components": [
1736
- 0.89,
1737
- 0,
1738
- 0
1739
- ]
1740
- }
1741
- },
1742
- "input": {
1743
- "$type": "color",
1744
- "$value": {
1745
- "colorSpace": "oklch",
1746
- "components": [
1747
- 0.922,
1748
- 0,
1749
- 0
1750
- ]
1751
- }
1752
- },
1753
- "ring": {
1754
- "$type": "color",
1755
- "$value": {
1756
- "colorSpace": "oklch",
1757
- "components": [
1758
- 0.708,
1759
- 0,
1760
- 0
1761
- ]
1762
- }
1763
- },
1764
- "chart-1": {
1765
- "$type": "color",
1766
- "$value": {
1767
- "colorSpace": "oklch",
1768
- "components": [
1769
- 0.809,
1770
- 0.105,
1771
- 251.813
1772
- ]
1773
- }
1774
- },
1775
- "chart-2": {
1776
- "$type": "color",
1777
- "$value": {
1778
- "colorSpace": "oklch",
1779
- "components": [
1780
- 0.623,
1781
- 0.214,
1782
- 259.815
1783
- ]
1784
- }
1785
- },
1786
- "chart-3": {
1787
- "$type": "color",
1788
- "$value": {
1789
- "colorSpace": "oklch",
1790
- "components": [
1791
- 0.546,
1792
- 0.245,
1793
- 262.881
1794
- ]
1795
- }
1796
- },
1797
- "chart-4": {
1798
- "$type": "color",
1799
- "$value": {
1800
- "colorSpace": "oklch",
1801
- "components": [
1802
- 0.488,
1803
- 0.243,
1804
- 264.376
1805
- ]
1806
- }
1807
- },
1808
- "chart-5": {
1809
- "$type": "color",
1810
- "$value": {
1811
- "colorSpace": "oklch",
1812
- "components": [
1813
- 0.424,
1814
- 0.199,
1815
- 265.638
1816
- ]
1817
- }
1818
- },
1819
- "sidebar": {
1820
- "$type": "color",
1821
- "$value": "{card}"
1822
- },
1823
- "sidebar-foreground": {
1824
- "$type": "color",
1825
- "$value": {
1826
- "colorSpace": "oklch",
1827
- "components": [
1828
- 0.145,
1829
- 0,
1830
- 0
1831
- ]
1832
- }
1833
- },
1834
- "sidebar-primary": {
1835
- "$type": "color",
1836
- "$value": "{brand-yellow}"
1837
- },
1838
- "sidebar-primary-foreground": {
1839
- "$type": "color",
1840
- "$value": "{brand-yellow-foreground}"
1841
- },
1842
- "sidebar-accent": {
1843
- "$type": "color",
1844
- "$value": "{secondary}"
1845
- },
1846
- "sidebar-accent-foreground": {
1847
- "$type": "color",
1848
- "$value": {
1849
- "colorSpace": "oklch",
1850
- "components": [
1851
- 0.205,
1852
- 0,
1853
- 0
1854
- ]
1855
- }
1856
- },
1857
- "sidebar-border": {
1858
- "$type": "color",
1859
- "$value": {
1860
- "colorSpace": "oklch",
1861
- "components": [
1862
- 0.89,
1863
- 0,
1864
- 0
1865
- ]
1866
- }
1867
- },
1868
- "sidebar-ring": {
1869
- "$type": "color",
1870
- "$value": {
1871
- "colorSpace": "oklch",
1872
- "components": [
1873
- 0.708,
1874
- 0,
1875
- 0
1876
- ]
1877
- }
1878
- },
1879
- "surface-1": {
1880
- "$type": "color",
1881
- "$value": "{card}"
1882
- },
1883
- "surface-2": {
1884
- "$type": "color",
1885
- "$value": "{secondary}"
1886
- },
1887
- "surface-3": {
1888
- "$type": "color",
1889
- "$value": "{muted}"
1890
- },
1891
- "surface-inset": {
1892
- "$type": "color",
1893
- "$value": {
1894
- "colorSpace": "oklch",
1895
- "components": [
1896
- 0.955,
1897
- 0,
1898
- 0
1899
- ]
1900
- },
1901
- "$description": "Superficie afundada do tema claro. NAO pode ser alias de {secondary}: eram o mesmo 0.94, e um Button secondary desaparecia dentro de um painel inset (achado 24/07/2026). 0.955 fica entre o fundo (0.965) e o secondary (0.94) — afunda sem colidir."
1902
- },
1903
- "surface-hover": {
1904
- "$type": "color",
1905
- "$value": {
1906
- "colorSpace": "oklch",
1907
- "components": [
1908
- 0.925,
1909
- 0,
1910
- 0
1911
- ]
1912
- }
1913
- },
1914
- "foreground-strong": {
1915
- "$type": "color",
1916
- "$value": "{foreground}"
1917
- },
1918
- "subtle-foreground": {
1919
- "$type": "color",
1920
- "$value": {
1921
- "colorSpace": "oklch",
1922
- "components": [
1923
- 0.43,
1924
- 0,
1925
- 0
1926
- ]
1927
- }
1928
- },
1929
- "border-strong": {
1930
- "$type": "color",
1931
- "$value": {
1932
- "colorSpace": "oklch",
1933
- "components": [
1934
- 0.56,
1935
- 0,
1936
- 0
1937
- ]
1938
- }
1939
- },
1940
- "field-bg": {
1941
- "$type": "color",
1942
- "$value": "{muted}"
1943
- },
1944
- "overlay": {
1945
- "$type": "color",
1946
- "$value": {
1947
- "colorSpace": "oklch",
1948
- "components": [
1949
- 0.145,
1950
- 0,
1951
- 0
1952
- ],
1953
- "alpha": 0.4
1954
- }
1955
- },
1956
- "primary-hover": {
1957
- "$type": "color",
1958
- "$value": {
1959
- "colorSpace": "oklch",
1960
- "components": [
1961
- 0.835,
1962
- 0.19,
1963
- 89
1964
- ]
1965
- }
1966
- },
1967
- "primary-active": {
1968
- "$type": "color",
1969
- "$value": {
1970
- "colorSpace": "oklch",
1971
- "components": [
1972
- 0.74,
1973
- 0.17,
1974
- 84
1975
- ]
1976
- }
1977
- },
1978
- "secondary-hover": {
1979
- "$type": "color",
1980
- "$value": "{surface-hover}"
1981
- },
1982
- "focus": {
1983
- "$type": "color",
1984
- "$value": "{primary}"
1985
- },
1986
- "focus-strong": {
1987
- "$type": "color",
1988
- "$value": "{brand-yellow-foreground}"
1989
- },
1990
- "primary-emphasis": {
1991
- "$type": "color",
1992
- "$value": "{brand-yellow-foreground}"
1993
- },
1994
- "primary-outline": {
1995
- "$type": "color",
1996
- "$value": "{brand-yellow-foreground}"
1997
- },
1998
- "control-selected": {
1999
- "$type": "color",
2000
- "$value": "{brand-yellow-foreground}"
2001
- },
2002
- "control-selected-foreground": {
2003
- "$type": "color",
2004
- "$value": {
2005
- "colorSpace": "oklch",
2006
- "components": [
2007
- 0.985,
2008
- 0,
2009
- 0
2010
- ]
2011
- }
2012
- },
2013
- "success-400": {
2014
- "$type": "color",
2015
- "$value": {
2016
- "colorSpace": "srgb",
2017
- "components": [
2018
- 0.05882,
2019
- 0.41961,
2020
- 0.24314
2021
- ],
2022
- "hex": "#0f6b3e"
2023
- }
2024
- },
2025
- "warning-400": {
2026
- "$type": "color",
2027
- "$value": {
2028
- "colorSpace": "srgb",
2029
- "components": [
2030
- 0.42745,
2031
- 0.30196,
2032
- 0
2033
- ],
2034
- "hex": "#6d4d00"
2035
- }
2036
- },
2037
- "danger-400": {
2038
- "$type": "color",
2039
- "$value": {
2040
- "colorSpace": "srgb",
2041
- "components": [
2042
- 0.62353,
2043
- 0.13725,
2044
- 0.18824
2045
- ],
2046
- "hex": "#9f2330"
2047
- }
2048
- },
2049
- "info-400": {
2050
- "$type": "color",
2051
- "$value": {
2052
- "colorSpace": "srgb",
2053
- "components": [
2054
- 0.08627,
2055
- 0.3098,
2056
- 0.61569
2057
- ],
2058
- "hex": "#164f9d"
2059
- }
2060
- },
2061
- "oracle-300": {
2062
- "$type": "color",
2063
- "$value": "{chart-4}"
2064
- },
2065
- "oracle-400": {
2066
- "$type": "color",
2067
- "$value": "{chart-4}"
2068
- },
2069
- "selection": {
2070
- "$type": "color",
2071
- "$value": {
2072
- "colorSpace": "oklch",
2073
- "components": [
2074
- 0.795,
2075
- 0.184,
2076
- 86.047
2077
- ],
2078
- "alpha": 0.18
2079
- }
2080
- },
2081
- "success-bg": {
2082
- "$type": "color",
2083
- "$value": {
2084
- "colorSpace": "oklch",
2085
- "components": [
2086
- 0.94,
2087
- 0.05,
2088
- 150
2089
- ]
2090
- }
2091
- },
2092
- "warning-bg": {
2093
- "$type": "color",
2094
- "$value": {
2095
- "colorSpace": "oklch",
2096
- "components": [
2097
- 0.95,
2098
- 0.06,
2099
- 86
2100
- ]
2101
- }
2102
- },
2103
- "danger-bg": {
2104
- "$type": "color",
2105
- "$value": {
2106
- "colorSpace": "oklch",
2107
- "components": [
2108
- 0.95,
2109
- 0.05,
2110
- 22
2111
- ]
2112
- }
2113
- },
2114
- "info-bg": {
2115
- "$type": "color",
2116
- "$value": {
2117
- "colorSpace": "oklch",
2118
- "components": [
2119
- 0.95,
2120
- 0.045,
2121
- 260
2122
- ]
2123
- }
2124
- }
2125
- }
2126
- },
2127
- "density": {
2128
- "compact": {
2129
- "control-h-xs": {
2130
- "$type": "dimension",
2131
- "$value": {
2132
- "value": 1.5,
2133
- "unit": "rem"
2134
- }
2135
- },
2136
- "control-h-sm": {
2137
- "$type": "dimension",
2138
- "$value": {
2139
- "value": 1.75,
2140
- "unit": "rem"
2141
- }
2142
- },
2143
- "control-h-md": {
2144
- "$type": "dimension",
2145
- "$value": {
2146
- "value": 2.0,
2147
- "unit": "rem"
2148
- }
2149
- },
2150
- "control-h-lg": {
2151
- "$type": "dimension",
2152
- "$value": {
2153
- "value": 2.375,
2154
- "unit": "rem"
2155
- }
2156
- },
2157
- "control-h-xl": {
2158
- "$type": "dimension",
2159
- "$value": {
2160
- "value": 2.75,
2161
- "unit": "rem"
2162
- }
2163
- },
2164
- "row-h": {
2165
- "$type": "dimension",
2166
- "$value": {
2167
- "value": 2.625,
2168
- "unit": "rem"
2169
- }
2170
- },
2171
- "card-pad": {
2172
- "$type": "dimension",
2173
- "$value": {
2174
- "value": 1.0,
2175
- "unit": "rem"
2176
- }
2177
- },
2178
- "section-gap": {
2179
- "$type": "dimension",
2180
- "$value": {
2181
- "value": 1.125,
2182
- "unit": "rem"
2183
- }
2184
- }
2185
- },
2186
- "comfortable": {
2187
- "control-h-xs": {
2188
- "$type": "dimension",
2189
- "$description": "Height of the smallest control. The density scale governs HEIGHT — never font size, spacing or radius; that contract is in packages/tokens/README.md.",
2190
- "$value": {
2191
- "value": 1.625,
2192
- "unit": "rem"
2193
- }
2194
- },
2195
- "control-h-sm": {
2196
- "$type": "dimension",
2197
- "$description": "Height of a small control: compact button, pagination, calendar arrow.",
2198
- "$value": {
2199
- "value": 1.875,
2200
- "unit": "rem"
2201
- }
2202
- },
2203
- "control-h-md": {
2204
- "$type": "dimension",
2205
- "$description": "Height of the default control, and the reference for anything that must line up beside one — a field, a segment, an avatar, a sidebar item.",
2206
- "$value": {
2207
- "value": 2.25,
2208
- "unit": "rem"
2209
- }
2210
- },
2211
- "control-h-lg": {
2212
- "$type": "dimension",
2213
- "$description": "Height of a large control.",
2214
- "$value": {
2215
- "value": 2.625,
2216
- "unit": "rem"
2217
- }
2218
- },
2219
- "control-h-xl": {
2220
- "$type": "dimension",
2221
- "$description": "Height of the largest control, for a single prominent call to action.",
2222
- "$value": {
2223
- "value": 3.125,
2224
- "unit": "rem"
2225
- }
2226
- },
2227
- "row-h": {
2228
- "$type": "dimension",
2229
- "$description": "Height of a table row. The one density token that is not about controls.",
2230
- "$value": {
2231
- "value": 3.0,
2232
- "unit": "rem"
2233
- }
2234
- },
2235
- "card-pad": {
2236
- "$type": "dimension",
2237
- "$description": "Inner padding of a panel. Density breathes here, which is why a compact layout feels tighter without anything having moved.",
2238
- "$value": {
2239
- "value": 1.25,
2240
- "unit": "rem"
2241
- }
2242
- },
2243
- "section-gap": {
2244
- "$type": "dimension",
2245
- "$description": "Vertical gap between sections of a page.",
2246
- "$value": {
2247
- "value": 1.5,
2248
- "unit": "rem"
2249
- }
2250
- }
2251
- },
2252
- "spacious": {
2253
- "control-h-xs": {
2254
- "$type": "dimension",
2255
- "$value": {
2256
- "value": 1.75,
2257
- "unit": "rem"
2258
- }
2259
- },
2260
- "control-h-sm": {
2261
- "$type": "dimension",
2262
- "$value": {
2263
- "value": 2.125,
2264
- "unit": "rem"
2265
- }
2266
- },
2267
- "control-h-md": {
2268
- "$type": "dimension",
2269
- "$value": {
2270
- "value": 2.5,
2271
- "unit": "rem"
2272
- }
2273
- },
2274
- "control-h-lg": {
2275
- "$type": "dimension",
2276
- "$value": {
2277
- "value": 3.0,
2278
- "unit": "rem"
2279
- }
2280
- },
2281
- "control-h-xl": {
2282
- "$type": "dimension",
2283
- "$value": {
2284
- "value": 3.5,
2285
- "unit": "rem"
2286
- }
2287
- },
2288
- "row-h": {
2289
- "$type": "dimension",
2290
- "$value": {
2291
- "value": 3.375,
2292
- "unit": "rem"
2293
- }
2294
- },
2295
- "card-pad": {
2296
- "$type": "dimension",
2297
- "$value": {
2298
- "value": 1.5,
2299
- "unit": "rem"
2300
- }
2301
- },
2302
- "section-gap": {
2303
- "$type": "dimension",
2304
- "$value": {
2305
- "value": 2.0,
2306
- "unit": "rem"
2307
- }
2308
- }
2309
- }
2310
- }
2311
- }
1
+ {
2
+ "$description": "Aurea design tokens — DTCG 2025.10. Single source of truth; build-tokens.mjs emits CSS.",
3
+ "$extensions": {
4
+ "ui.aurea": {
5
+ "version": "1.7.0",
6
+ "source": "legacy-reference.html",
7
+ "principles": [
8
+ "preserve-current-visual-language",
9
+ "semantic-tokens-only",
10
+ "floating-surfaces",
11
+ "pill-controls",
12
+ "no-gradients"
13
+ ],
14
+ "selectors": {
15
+ "base": ":root",
16
+ "theme.dark": "[data-theme=\"dark\"]",
17
+ "theme.light": "[data-theme=\"light\"]",
18
+ "density.compact": "[data-density=\"compact\"]",
19
+ "density.comfortable": "[data-density=\"comfortable\"]",
20
+ "density.spacious": "[data-density=\"spacious\"]"
21
+ }
22
+ }
23
+ },
24
+ "base": {
25
+ "brand-yellow": {
26
+ "$type": "color",
27
+ "$value": {
28
+ "colorSpace": "oklch",
29
+ "components": [
30
+ 0.795,
31
+ 0.184,
32
+ 86.047
33
+ ]
34
+ }
35
+ },
36
+ "brand-yellow-foreground": {
37
+ "$type": "color",
38
+ "$value": {
39
+ "colorSpace": "oklch",
40
+ "components": [
41
+ 0.421,
42
+ 0.095,
43
+ 57.708
44
+ ]
45
+ }
46
+ },
47
+ "font-ui": {
48
+ "$type": "fontFamily",
49
+ "$value": [
50
+ "IBM Plex Sans",
51
+ "Segoe UI",
52
+ "sans-serif"
53
+ ]
54
+ },
55
+ "font-editorial": {
56
+ "$type": "fontFamily",
57
+ "$value": [
58
+ "IBM Plex Serif",
59
+ "Georgia",
60
+ "serif"
61
+ ]
62
+ },
63
+ "font-code": {
64
+ "$type": "fontFamily",
65
+ "$value": [
66
+ "IBM Plex Mono",
67
+ "SFMono-Regular",
68
+ "Consolas",
69
+ "monospace"
70
+ ]
71
+ },
72
+ "text-xs": {
73
+ "$type": "dimension",
74
+ "$value": {
75
+ "value": 0.75,
76
+ "unit": "rem"
77
+ }
78
+ },
79
+ "text-sm": {
80
+ "$type": "dimension",
81
+ "$value": {
82
+ "value": 0.8125,
83
+ "unit": "rem"
84
+ }
85
+ },
86
+ "text-md": {
87
+ "$type": "dimension",
88
+ "$value": {
89
+ "value": 0.875,
90
+ "unit": "rem"
91
+ }
92
+ },
93
+ "text-base": {
94
+ "$type": "dimension",
95
+ "$value": {
96
+ "value": 1,
97
+ "unit": "rem"
98
+ }
99
+ },
100
+ "text-lg": {
101
+ "$type": "dimension",
102
+ "$value": {
103
+ "value": 1.125,
104
+ "unit": "rem"
105
+ }
106
+ },
107
+ "text-xl": {
108
+ "$type": "dimension",
109
+ "$value": {
110
+ "value": 1.25,
111
+ "unit": "rem"
112
+ }
113
+ },
114
+ "text-2xl": {
115
+ "$type": "dimension",
116
+ "$value": {
117
+ "value": 1.5,
118
+ "unit": "rem"
119
+ }
120
+ },
121
+ "text-3xl": {
122
+ "$type": "dimension",
123
+ "$value": {
124
+ "value": 1.875,
125
+ "unit": "rem"
126
+ }
127
+ },
128
+ "text-4xl": {
129
+ "$type": "dimension",
130
+ "$value": {
131
+ "value": 2.25,
132
+ "unit": "rem"
133
+ }
134
+ },
135
+ "text-5xl": {
136
+ "$type": "dimension",
137
+ "$value": {
138
+ "value": 3,
139
+ "unit": "rem"
140
+ }
141
+ },
142
+ "leading-tight": {
143
+ "$type": "number",
144
+ "$value": 1.2
145
+ },
146
+ "leading-normal": {
147
+ "$type": "number",
148
+ "$value": 1.5
149
+ },
150
+ "leading-relaxed": {
151
+ "$type": "number",
152
+ "$value": 1.7
153
+ },
154
+ "space-0": {
155
+ "$type": "dimension",
156
+ "$value": {
157
+ "value": 0,
158
+ "unit": "px"
159
+ }
160
+ },
161
+ "space-05": {
162
+ "$description": "Half-step below space-1 (2px). The tightest gap in the scale; use only where 4px is visibly too much, e.g. the flush topbar hugging the content.",
163
+ "$type": "dimension",
164
+ "$value": {
165
+ "value": 0.125,
166
+ "unit": "rem"
167
+ }
168
+ },
169
+ "space-1": {
170
+ "$type": "dimension",
171
+ "$value": {
172
+ "value": 0.25,
173
+ "unit": "rem"
174
+ }
175
+ },
176
+ "space-2": {
177
+ "$type": "dimension",
178
+ "$value": {
179
+ "value": 0.5,
180
+ "unit": "rem"
181
+ }
182
+ },
183
+ "space-3": {
184
+ "$type": "dimension",
185
+ "$value": {
186
+ "value": 0.75,
187
+ "unit": "rem"
188
+ }
189
+ },
190
+ "space-4": {
191
+ "$type": "dimension",
192
+ "$value": {
193
+ "value": 1,
194
+ "unit": "rem"
195
+ }
196
+ },
197
+ "space-5": {
198
+ "$type": "dimension",
199
+ "$value": {
200
+ "value": 1.25,
201
+ "unit": "rem"
202
+ }
203
+ },
204
+ "space-6": {
205
+ "$type": "dimension",
206
+ "$value": {
207
+ "value": 1.5,
208
+ "unit": "rem"
209
+ }
210
+ },
211
+ "space-7": {
212
+ "$type": "dimension",
213
+ "$value": {
214
+ "value": 1.75,
215
+ "unit": "rem"
216
+ }
217
+ },
218
+ "space-8": {
219
+ "$type": "dimension",
220
+ "$value": {
221
+ "value": 2,
222
+ "unit": "rem"
223
+ }
224
+ },
225
+ "space-10": {
226
+ "$type": "dimension",
227
+ "$value": {
228
+ "value": 2.5,
229
+ "unit": "rem"
230
+ }
231
+ },
232
+ "space-12": {
233
+ "$type": "dimension",
234
+ "$value": {
235
+ "value": 3,
236
+ "unit": "rem"
237
+ }
238
+ },
239
+ "space-16": {
240
+ "$type": "dimension",
241
+ "$value": {
242
+ "value": 4,
243
+ "unit": "rem"
244
+ }
245
+ },
246
+ "space-20": {
247
+ "$type": "dimension",
248
+ "$value": {
249
+ "value": 5,
250
+ "unit": "rem"
251
+ }
252
+ },
253
+ "space-24": {
254
+ "$type": "dimension",
255
+ "$value": {
256
+ "value": 6,
257
+ "unit": "rem"
258
+ }
259
+ },
260
+ "radius-xs": {
261
+ "$type": "dimension",
262
+ "$value": {
263
+ "value": 6,
264
+ "unit": "px"
265
+ }
266
+ },
267
+ "radius-sm": {
268
+ "$type": "dimension",
269
+ "$value": {
270
+ "value": 8,
271
+ "unit": "px"
272
+ }
273
+ },
274
+ "radius-md": {
275
+ "$type": "dimension",
276
+ "$value": {
277
+ "value": 10,
278
+ "unit": "px"
279
+ }
280
+ },
281
+ "radius-lg": {
282
+ "$type": "dimension",
283
+ "$value": {
284
+ "value": 16,
285
+ "unit": "px"
286
+ }
287
+ },
288
+ "radius-card": {
289
+ "$type": "dimension",
290
+ "$value": {
291
+ "value": 22,
292
+ "unit": "px"
293
+ }
294
+ },
295
+ "radius-control": {
296
+ "$type": "dimension",
297
+ "$value": {
298
+ "value": 999,
299
+ "unit": "px"
300
+ }
301
+ },
302
+ "radius-full": {
303
+ "$type": "dimension",
304
+ "$value": "{radius-control}",
305
+ "$description": "Alias de radius-control. Referência e não cópia: dois nomes com o mesmo número escrito à mão divergem no dia em que um é ajustado."
306
+ },
307
+ "border-width": {
308
+ "$type": "dimension",
309
+ "$value": {
310
+ "value": 1,
311
+ "unit": "px"
312
+ }
313
+ },
314
+ "shadow-md": {
315
+ "$type": "shadow",
316
+ "$value": {
317
+ "color": {
318
+ "colorSpace": "srgb",
319
+ "components": [
320
+ 0,
321
+ 0,
322
+ 0
323
+ ],
324
+ "hex": "#000000",
325
+ "alpha": 0.28
326
+ },
327
+ "offsetX": {
328
+ "value": 0,
329
+ "unit": "px"
330
+ },
331
+ "offsetY": {
332
+ "value": 16,
333
+ "unit": "px"
334
+ },
335
+ "blur": {
336
+ "value": 42,
337
+ "unit": "px"
338
+ },
339
+ "spread": {
340
+ "value": 0,
341
+ "unit": "px"
342
+ }
343
+ }
344
+ },
345
+ "shadow-lg": {
346
+ "$type": "shadow",
347
+ "$value": {
348
+ "color": {
349
+ "colorSpace": "srgb",
350
+ "components": [
351
+ 0,
352
+ 0,
353
+ 0
354
+ ],
355
+ "hex": "#000000",
356
+ "alpha": 0.42
357
+ },
358
+ "offsetX": {
359
+ "value": 0,
360
+ "unit": "px"
361
+ },
362
+ "offsetY": {
363
+ "value": 28,
364
+ "unit": "px"
365
+ },
366
+ "blur": {
367
+ "value": 80,
368
+ "unit": "px"
369
+ },
370
+ "spread": {
371
+ "value": 0,
372
+ "unit": "px"
373
+ }
374
+ }
375
+ },
376
+ "duration-fast": {
377
+ "$type": "duration",
378
+ "$value": {
379
+ "value": 120,
380
+ "unit": "ms"
381
+ }
382
+ },
383
+ "duration-base": {
384
+ "$type": "duration",
385
+ "$value": {
386
+ "value": 180,
387
+ "unit": "ms"
388
+ }
389
+ },
390
+ "duration-slow": {
391
+ "$type": "duration",
392
+ "$value": {
393
+ "value": 280,
394
+ "unit": "ms"
395
+ }
396
+ },
397
+ "ease-standard": {
398
+ "$type": "cubicBezier",
399
+ "$value": [
400
+ 0.2,
401
+ 0,
402
+ 0,
403
+ 1
404
+ ]
405
+ },
406
+ "ease-emphasized": {
407
+ "$type": "cubicBezier",
408
+ "$value": [
409
+ 0.2,
410
+ 0.8,
411
+ 0.2,
412
+ 1
413
+ ]
414
+ },
415
+ "z-base": {
416
+ "$type": "number",
417
+ "$value": 0
418
+ },
419
+ "z-sticky": {
420
+ "$type": "number",
421
+ "$value": 20
422
+ },
423
+ "z-dropdown": {
424
+ "$type": "number",
425
+ "$value": 40
426
+ },
427
+ "z-drawer": {
428
+ "$type": "number",
429
+ "$value": 60
430
+ },
431
+ "z-modal": {
432
+ "$type": "number",
433
+ "$value": 80
434
+ },
435
+ "z-toast": {
436
+ "$type": "number",
437
+ "$value": 100
438
+ },
439
+ "sidebar-width": {
440
+ "$type": "dimension",
441
+ "$value": {
442
+ "value": 16.5,
443
+ "unit": "rem"
444
+ }
445
+ },
446
+ "sidebar-rail": {
447
+ "$type": "dimension",
448
+ "$description": "Grid column of the collapsed sidebar: the icon rail. It is the COLUMN, not the panel — the sidebar spends space-4 of margin on each side before it starts, which is why 4.5rem was measured wrong first and left the icon 2px outside the box. 5.5rem = 32px of margin + 2px of border + 16px of the panel's own padding + a 16px icon with room around it.",
449
+ "$value": {
450
+ "value": 5.5,
451
+ "unit": "rem"
452
+ }
453
+ },
454
+ "topbar-height": {
455
+ "$type": "dimension",
456
+ "$value": {
457
+ "value": 4.0,
458
+ "unit": "rem"
459
+ }
460
+ },
461
+ "content-max": {
462
+ "$type": "dimension",
463
+ "$value": {
464
+ "value": 102.5,
465
+ "unit": "rem"
466
+ }
467
+ },
468
+ "breakpoint-sm": {
469
+ "$description": "Responsive scale (Tailwind, the de-facto 2026 standard; base of Untitled UI). Mobile-first: a rule applies at this width and up. @media can't read var(), so CSS uses the literal value — validate.py check 5 guards the scale. JS/native read --breakpoint-*.",
470
+ "$type": "dimension",
471
+ "$value": {
472
+ "value": 640,
473
+ "unit": "px"
474
+ }
475
+ },
476
+ "breakpoint-md": {
477
+ "$type": "dimension",
478
+ "$value": {
479
+ "value": 768,
480
+ "unit": "px"
481
+ }
482
+ },
483
+ "breakpoint-lg": {
484
+ "$type": "dimension",
485
+ "$value": {
486
+ "value": 1024,
487
+ "unit": "px"
488
+ }
489
+ },
490
+ "breakpoint-xl": {
491
+ "$type": "dimension",
492
+ "$value": {
493
+ "value": 1280,
494
+ "unit": "px"
495
+ }
496
+ },
497
+ "breakpoint-2xl": {
498
+ "$type": "dimension",
499
+ "$value": {
500
+ "value": 1536,
501
+ "unit": "px"
502
+ }
503
+ },
504
+ "control-h-xs": {
505
+ "$type": "dimension",
506
+ "$value": {
507
+ "value": 1.625,
508
+ "unit": "rem"
509
+ }
510
+ },
511
+ "control-h-sm": {
512
+ "$type": "dimension",
513
+ "$value": {
514
+ "value": 1.875,
515
+ "unit": "rem"
516
+ }
517
+ },
518
+ "control-h-md": {
519
+ "$type": "dimension",
520
+ "$value": {
521
+ "value": 2.25,
522
+ "unit": "rem"
523
+ }
524
+ },
525
+ "control-h-lg": {
526
+ "$type": "dimension",
527
+ "$value": {
528
+ "value": 2.625,
529
+ "unit": "rem"
530
+ }
531
+ },
532
+ "control-h-xl": {
533
+ "$type": "dimension",
534
+ "$value": {
535
+ "value": 3.125,
536
+ "unit": "rem"
537
+ }
538
+ },
539
+ "row-h": {
540
+ "$type": "dimension",
541
+ "$value": {
542
+ "value": 3.0,
543
+ "unit": "rem"
544
+ }
545
+ },
546
+ "card-pad": {
547
+ "$type": "dimension",
548
+ "$value": {
549
+ "value": 1.25,
550
+ "unit": "rem"
551
+ }
552
+ },
553
+ "section-gap": {
554
+ "$type": "dimension",
555
+ "$value": {
556
+ "value": 1.5,
557
+ "unit": "rem"
558
+ }
559
+ },
560
+ "media-canvas": {
561
+ "$type": "color",
562
+ "$value": {
563
+ "colorSpace": "oklch",
564
+ "components": [
565
+ 0.085,
566
+ 0,
567
+ 0
568
+ ]
569
+ }
570
+ },
571
+ "media-foreground": {
572
+ "$type": "color",
573
+ "$value": {
574
+ "colorSpace": "oklch",
575
+ "components": [
576
+ 0.985,
577
+ 0,
578
+ 0
579
+ ]
580
+ }
581
+ },
582
+ "media-muted": {
583
+ "$type": "color",
584
+ "$value": {
585
+ "colorSpace": "oklch",
586
+ "components": [
587
+ 0.74,
588
+ 0,
589
+ 0
590
+ ]
591
+ }
592
+ },
593
+ "media-scrim": {
594
+ "$type": "color",
595
+ "$value": {
596
+ "colorSpace": "oklch",
597
+ "components": [
598
+ 0,
599
+ 0,
600
+ 0
601
+ ],
602
+ "alpha": 0.82
603
+ }
604
+ },
605
+ "media-track": {
606
+ "$type": "color",
607
+ "$value": {
608
+ "colorSpace": "oklch",
609
+ "components": [
610
+ 1,
611
+ 0,
612
+ 0
613
+ ],
614
+ "alpha": 0.18
615
+ }
616
+ },
617
+ "media-buffered": {
618
+ "$type": "color",
619
+ "$value": {
620
+ "colorSpace": "oklch",
621
+ "components": [
622
+ 1,
623
+ 0,
624
+ 0
625
+ ],
626
+ "alpha": 0.42
627
+ }
628
+ },
629
+ "media-caption-bg": {
630
+ "$type": "color",
631
+ "$value": {
632
+ "colorSpace": "oklch",
633
+ "components": [
634
+ 0,
635
+ 0,
636
+ 0
637
+ ],
638
+ "alpha": 0.82
639
+ }
640
+ },
641
+ "media-control-bg": {
642
+ "$type": "color",
643
+ "$value": {
644
+ "colorSpace": "oklch",
645
+ "components": [
646
+ 0,
647
+ 0,
648
+ 0
649
+ ],
650
+ "alpha": 0.52
651
+ }
652
+ },
653
+ "media-control-hover": {
654
+ "$type": "color",
655
+ "$value": {
656
+ "colorSpace": "oklch",
657
+ "components": [
658
+ 1,
659
+ 0,
660
+ 0
661
+ ],
662
+ "alpha": 0.14
663
+ }
664
+ },
665
+ "text-muted": {
666
+ "$type": "color",
667
+ "$value": "{muted-foreground}"
668
+ },
669
+ "success-400": {
670
+ "$type": "color",
671
+ "$description": "The success tone: online status, success badge and alert icons.",
672
+ "$value": {
673
+ "colorSpace": "srgb",
674
+ "components": [
675
+ 0.25882,
676
+ 0.82745,
677
+ 0.57255
678
+ ],
679
+ "hex": "#42d392"
680
+ }
681
+ },
682
+ "success-500": {
683
+ "$type": "color",
684
+ "$value": {
685
+ "colorSpace": "srgb",
686
+ "components": [
687
+ 0.13333,
688
+ 0.78431,
689
+ 0.45882
690
+ ],
691
+ "hex": "#22c875"
692
+ }
693
+ },
694
+ "success-700": {
695
+ "$type": "color",
696
+ "$value": {
697
+ "colorSpace": "srgb",
698
+ "components": [
699
+ 0.07843,
700
+ 0.47843,
701
+ 0.30196
702
+ ],
703
+ "hex": "#147a4d"
704
+ }
705
+ },
706
+ "warning-400": {
707
+ "$type": "color",
708
+ "$description": "The warning tone: away status, warning badge and alert icons.",
709
+ "$value": "{brand-yellow}"
710
+ },
711
+ "warning-500": {
712
+ "$type": "color",
713
+ "$value": {
714
+ "colorSpace": "srgb",
715
+ "components": [
716
+ 0.83137,
717
+ 0.61176,
718
+ 0
719
+ ],
720
+ "hex": "#d49c00"
721
+ }
722
+ },
723
+ "warning-800": {
724
+ "$type": "color",
725
+ "$value": {
726
+ "colorSpace": "srgb",
727
+ "components": [
728
+ 0.42745,
729
+ 0.30196,
730
+ 0
731
+ ],
732
+ "hex": "#6d4d00"
733
+ }
734
+ },
735
+ "danger-400": {
736
+ "$type": "color",
737
+ "$description": "The danger TONE: dot of a failed status, border of an invalid field, icon of a danger alert. The colour that says \"wrong\", on text and on marks.",
738
+ "$value": {
739
+ "colorSpace": "srgb",
740
+ "components": [
741
+ 1,
742
+ 0.44314,
743
+ 0.50196
744
+ ],
745
+ "hex": "#ff7180"
746
+ }
747
+ },
748
+ "danger-500": {
749
+ "$type": "color",
750
+ "$value": {
751
+ "colorSpace": "srgb",
752
+ "components": [
753
+ 0.91373,
754
+ 0.29412,
755
+ 0.3451
756
+ ],
757
+ "hex": "#e94b58"
758
+ }
759
+ },
760
+ "danger-800": {
761
+ "$type": "color",
762
+ "$value": {
763
+ "colorSpace": "srgb",
764
+ "components": [
765
+ 0.49804,
766
+ 0.12549,
767
+ 0.16078
768
+ ],
769
+ "hex": "#7f2029"
770
+ }
771
+ },
772
+ "info-400": {
773
+ "$type": "color",
774
+ "$description": "The informational tone: running status, info badge and alert icons. Neutral news, not a problem.",
775
+ "$value": {
776
+ "colorSpace": "srgb",
777
+ "components": [
778
+ 0.55686,
779
+ 0.77255,
780
+ 1
781
+ ],
782
+ "hex": "#8ec5ff"
783
+ }
784
+ },
785
+ "info-500": {
786
+ "$type": "color",
787
+ "$value": {
788
+ "colorSpace": "srgb",
789
+ "components": [
790
+ 0.16863,
791
+ 0.49804,
792
+ 1
793
+ ],
794
+ "hex": "#2b7fff"
795
+ }
796
+ },
797
+ "info-800": {
798
+ "$type": "color",
799
+ "$value": {
800
+ "colorSpace": "srgb",
801
+ "components": [
802
+ 0.07843,
803
+ 0.27843,
804
+ 0.90196
805
+ ],
806
+ "hex": "#1447e6"
807
+ }
808
+ },
809
+ "oracle-50": {
810
+ "$type": "color",
811
+ "$value": {
812
+ "colorSpace": "oklch",
813
+ "components": [
814
+ 0.96,
815
+ 0.025,
816
+ 251.813
817
+ ]
818
+ }
819
+ },
820
+ "oracle-100": {
821
+ "$type": "color",
822
+ "$value": {
823
+ "colorSpace": "oklch",
824
+ "components": [
825
+ 0.9,
826
+ 0.06,
827
+ 251.813
828
+ ]
829
+ }
830
+ },
831
+ "oracle-200": {
832
+ "$type": "color",
833
+ "$value": {
834
+ "colorSpace": "oklch",
835
+ "components": [
836
+ 0.85,
837
+ 0.09,
838
+ 251.813
839
+ ]
840
+ }
841
+ },
842
+ "oracle-300": {
843
+ "$type": "color",
844
+ "$description": "Reserved accent kept from the origin kit and deliberately unused by the core. It is not part of the Aurea palette contract — do not introduce it without a decision.",
845
+ "$value": "{chart-1}"
846
+ },
847
+ "oracle-400": {
848
+ "$type": "color",
849
+ "$description": "Reserved accent kept from the origin kit and deliberately unused by the core. It is not part of the Aurea palette contract — do not introduce it without a decision.",
850
+ "$value": "{chart-2}"
851
+ },
852
+ "oracle-500": {
853
+ "$type": "color",
854
+ "$value": "{chart-3}"
855
+ },
856
+ "oracle-600": {
857
+ "$type": "color",
858
+ "$value": "{chart-4}"
859
+ },
860
+ "oracle-700": {
861
+ "$type": "color",
862
+ "$value": "{chart-5}"
863
+ },
864
+ "oracle-800": {
865
+ "$type": "color",
866
+ "$value": {
867
+ "colorSpace": "oklch",
868
+ "components": [
869
+ 0.38,
870
+ 0.2,
871
+ 265.638
872
+ ]
873
+ }
874
+ },
875
+ "oracle-900": {
876
+ "$type": "color",
877
+ "$value": {
878
+ "colorSpace": "oklch",
879
+ "components": [
880
+ 0.31,
881
+ 0.16,
882
+ 265.638
883
+ ]
884
+ }
885
+ },
886
+ "oracle-950": {
887
+ "$type": "color",
888
+ "$value": {
889
+ "colorSpace": "oklch",
890
+ "components": [
891
+ 0.23,
892
+ 0.11,
893
+ 265.638
894
+ ]
895
+ }
896
+ },
897
+ "weight-regular": {
898
+ "$type": "number",
899
+ "$value": 400,
900
+ "$description": "Corpo de texto."
901
+ },
902
+ "weight-medium": {
903
+ "$type": "number",
904
+ "$value": 500,
905
+ "$description": "Rótulo, botão, ênfase leve."
906
+ },
907
+ "weight-semibold": {
908
+ "$type": "number",
909
+ "$value": 600,
910
+ "$description": "Título de seção, cabeçalho de tabela."
911
+ },
912
+ "weight-bold": {
913
+ "$type": "number",
914
+ "$value": 700,
915
+ "$description": "Título de página e número de destaque."
916
+ },
917
+ "icon-sm": {
918
+ "$type": "dimension",
919
+ "$value": {
920
+ "value": 1,
921
+ "unit": "rem"
922
+ },
923
+ "$description": "Glifo dentro de controle pequeno, badge e chip."
924
+ },
925
+ "icon-md": {
926
+ "$type": "dimension",
927
+ "$value": {
928
+ "value": 1.25,
929
+ "unit": "rem"
930
+ },
931
+ "$description": "Glifo padrão, alinhado ao texto de corpo."
932
+ },
933
+ "icon-lg": {
934
+ "$type": "dimension",
935
+ "$value": {
936
+ "value": 1.5,
937
+ "unit": "rem"
938
+ },
939
+ "$description": "Glifo de destaque em cabeçalho."
940
+ },
941
+ "icon-xl": {
942
+ "$type": "dimension",
943
+ "$value": {
944
+ "value": 2,
945
+ "unit": "rem"
946
+ },
947
+ "$description": "Glifo de estado vazio e de ilustração."
948
+ },
949
+ "tracking-tight": {
950
+ "$type": "dimension",
951
+ "$value": {
952
+ "value": -0.01,
953
+ "unit": "em"
954
+ },
955
+ "$description": "Fecha o texto em tamanho grande, onde o espaçamento natural parece solto."
956
+ },
957
+ "tracking-normal": {
958
+ "$type": "dimension",
959
+ "$value": {
960
+ "value": 0,
961
+ "unit": "em"
962
+ },
963
+ "$description": "Sem ajuste — o padrão da fonte."
964
+ },
965
+ "leading-none": {
966
+ "$type": "number",
967
+ "$value": 1,
968
+ "$description": "Entrelinha colada ao glifo: usada onde a ALTURA do componente é o contrato e não pode variar com a herança (ver badge e chip)."
969
+ },
970
+ "target-min": {
971
+ "$type": "dimension",
972
+ "$value": {
973
+ "value": 2.75,
974
+ "unit": "rem"
975
+ },
976
+ "$description": "Área mínima de toque (44px a 16px de raiz) — WCAG 2.5.5/2.5.8 em ponteiro grosseiro."
977
+ },
978
+ "tracking-wide": {
979
+ "$type": "dimension",
980
+ "$value": {
981
+ "value": 0.04,
982
+ "unit": "em"
983
+ },
984
+ "$description": "Abre levemente o rótulo em caixa alta."
985
+ },
986
+ "tracking-wider": {
987
+ "$type": "dimension",
988
+ "$value": {
989
+ "value": 0.06,
990
+ "unit": "em"
991
+ },
992
+ "$description": "Rótulo curto em caixa alta, como eyebrow."
993
+ },
994
+ "tracking-widest": {
995
+ "$type": "dimension",
996
+ "$value": {
997
+ "value": 0.12,
998
+ "unit": "em"
999
+ },
1000
+ "$description": "Rótulo de categoria — o mais aberto da escala."
1001
+ }
1002
+ },
1003
+ "theme": {
1004
+ "dark": {
1005
+ "background": {
1006
+ "$type": "color",
1007
+ "$description": "The page canvas — the furthest-back surface. Everything floats on top of it; nothing else should use it as a fill.",
1008
+ "$value": {
1009
+ "colorSpace": "oklch",
1010
+ "components": [
1011
+ 0.145,
1012
+ 0,
1013
+ 0
1014
+ ]
1015
+ }
1016
+ },
1017
+ "foreground": {
1018
+ "$type": "color",
1019
+ "$description": "Default body text, on the canvas and on the panel surfaces alike. The most used text colour in the system.",
1020
+ "$value": {
1021
+ "colorSpace": "oklch",
1022
+ "components": [
1023
+ 0.985,
1024
+ 0,
1025
+ 0
1026
+ ]
1027
+ }
1028
+ },
1029
+ "card": {
1030
+ "$type": "color",
1031
+ "$description": "Surface of a floating panel: card, topbar, content area. The Aurea identity is built on these, so this is the fill you reach for by default.",
1032
+ "$value": {
1033
+ "colorSpace": "oklch",
1034
+ "components": [
1035
+ 0.205,
1036
+ 0,
1037
+ 0
1038
+ ]
1039
+ }
1040
+ },
1041
+ "card-foreground": {
1042
+ "$type": "color",
1043
+ "$description": "Text on --card. Separate from --foreground so a panel can shift tone without the text following blindly.",
1044
+ "$value": {
1045
+ "colorSpace": "oklch",
1046
+ "components": [
1047
+ 0.985,
1048
+ 0,
1049
+ 0
1050
+ ]
1051
+ }
1052
+ },
1053
+ "popover": {
1054
+ "$type": "color",
1055
+ "$description": "Surface of a TRANSIENT layer — dialog, drawer, toast, menu, tooltip. It reads as sitting above --card, and that is what tells the eye the layer is temporary.",
1056
+ "$value": {
1057
+ "colorSpace": "oklch",
1058
+ "components": [
1059
+ 0.205,
1060
+ 0,
1061
+ 0
1062
+ ]
1063
+ }
1064
+ },
1065
+ "popover-foreground": {
1066
+ "$type": "color",
1067
+ "$description": "Text on --popover.",
1068
+ "$value": {
1069
+ "colorSpace": "oklch",
1070
+ "components": [
1071
+ 0.985,
1072
+ 0,
1073
+ 0
1074
+ ]
1075
+ }
1076
+ },
1077
+ "primary": {
1078
+ "$type": "color",
1079
+ "$description": "The Aurea yellow. INVARIANT between themes by contract — links, accents, the selected state. Never redefine it.",
1080
+ "$value": "{brand-yellow}"
1081
+ },
1082
+ "primary-foreground": {
1083
+ "$type": "color",
1084
+ "$description": "Text and glyphs ON the yellow. Dark on purpose: yellow is a light colour in both themes.",
1085
+ "$value": "{brand-yellow-foreground}"
1086
+ },
1087
+ "secondary": {
1088
+ "$type": "color",
1089
+ "$description": "Fill of the quiet-but-present control: secondary button, the current item of a navigation list, a segment that is on.",
1090
+ "$value": {
1091
+ "colorSpace": "oklch",
1092
+ "components": [
1093
+ 0.274,
1094
+ 0.006,
1095
+ 286.033
1096
+ ]
1097
+ }
1098
+ },
1099
+ "secondary-foreground": {
1100
+ "$type": "color",
1101
+ "$description": "Text on --secondary.",
1102
+ "$value": {
1103
+ "colorSpace": "oklch",
1104
+ "components": [
1105
+ 0.985,
1106
+ 0,
1107
+ 0
1108
+ ]
1109
+ }
1110
+ },
1111
+ "muted": {
1112
+ "$type": "color",
1113
+ "$description": "Fill for a de-emphasised block — the surface counterpart of --muted-foreground, not a text colour.",
1114
+ "$value": {
1115
+ "colorSpace": "oklch",
1116
+ "components": [
1117
+ 0.269,
1118
+ 0,
1119
+ 0
1120
+ ]
1121
+ }
1122
+ },
1123
+ "muted-foreground": {
1124
+ "$type": "color",
1125
+ "$description": "Secondary text: helper copy, captions, an item that is present but is not the point.",
1126
+ "$value": {
1127
+ "colorSpace": "oklch",
1128
+ "components": [
1129
+ 0.708,
1130
+ 0,
1131
+ 0
1132
+ ]
1133
+ }
1134
+ },
1135
+ "accent": {
1136
+ "$type": "color",
1137
+ "$description": "Hover surface of a control that has no fill of its own (ghost and outline buttons). The lightest possible \"something happened here\".",
1138
+ "$value": {
1139
+ "colorSpace": "oklch",
1140
+ "components": [
1141
+ 0.269,
1142
+ 0,
1143
+ 0
1144
+ ]
1145
+ }
1146
+ },
1147
+ "accent-foreground": {
1148
+ "$type": "color",
1149
+ "$description": "Text on --accent.",
1150
+ "$value": {
1151
+ "colorSpace": "oklch",
1152
+ "components": [
1153
+ 0.985,
1154
+ 0,
1155
+ 0
1156
+ ]
1157
+ }
1158
+ },
1159
+ "destructive": {
1160
+ "$type": "color",
1161
+ "$description": "Surface of an action that destroys something: the danger button. For actions only — a MESSAGE about danger uses --danger-400 and --danger-bg.",
1162
+ "$value": {
1163
+ "colorSpace": "oklch",
1164
+ "components": [
1165
+ 0.704,
1166
+ 0.191,
1167
+ 22.216
1168
+ ]
1169
+ }
1170
+ },
1171
+ "destructive-foreground": {
1172
+ "$type": "color",
1173
+ "$description": "Text on --destructive.",
1174
+ "$value": {
1175
+ "colorSpace": "oklch",
1176
+ "components": [
1177
+ 0.2,
1178
+ 0.02,
1179
+ 22
1180
+ ]
1181
+ }
1182
+ },
1183
+ "border": {
1184
+ "$type": "color",
1185
+ "$description": "The default hairline between surfaces, and the most used border in the system. If you are unsure which border to use, it is this one.",
1186
+ "$value": {
1187
+ "colorSpace": "oklch",
1188
+ "components": [
1189
+ 1,
1190
+ 0,
1191
+ 0
1192
+ ],
1193
+ "alpha": 0.1
1194
+ }
1195
+ },
1196
+ "input": {
1197
+ "$type": "color",
1198
+ "$description": "Border of a form control. Reserved: the core draws fields with --border, and this exists so a consumer can separate the two without forking the CSS.",
1199
+ "$value": {
1200
+ "colorSpace": "oklch",
1201
+ "components": [
1202
+ 1,
1203
+ 0,
1204
+ 0
1205
+ ],
1206
+ "alpha": 0.15
1207
+ }
1208
+ },
1209
+ "ring": {
1210
+ "$type": "color",
1211
+ "$description": "Reserved alias for a focus ring in consumer code. The core uses --focus-strong; this exists so a consumer can theme their own controls consistently.",
1212
+ "$value": {
1213
+ "colorSpace": "oklch",
1214
+ "components": [
1215
+ 0.556,
1216
+ 0,
1217
+ 0
1218
+ ]
1219
+ }
1220
+ },
1221
+ "chart-1": {
1222
+ "$type": "color",
1223
+ "$description": "First series of a chart. The five chart tokens are an ORDERED sequence: use them in order, so two charts on the same page give the same series the same colour.",
1224
+ "$value": {
1225
+ "colorSpace": "oklch",
1226
+ "components": [
1227
+ 0.809,
1228
+ 0.105,
1229
+ 251.813
1230
+ ]
1231
+ }
1232
+ },
1233
+ "chart-2": {
1234
+ "$type": "color",
1235
+ "$description": "Second series of a chart. See --chart-1 for the rule.",
1236
+ "$value": {
1237
+ "colorSpace": "oklch",
1238
+ "components": [
1239
+ 0.623,
1240
+ 0.214,
1241
+ 259.815
1242
+ ]
1243
+ }
1244
+ },
1245
+ "chart-3": {
1246
+ "$type": "color",
1247
+ "$description": "Third series of a chart. See --chart-1 for the rule.",
1248
+ "$value": {
1249
+ "colorSpace": "oklch",
1250
+ "components": [
1251
+ 0.546,
1252
+ 0.245,
1253
+ 262.881
1254
+ ]
1255
+ }
1256
+ },
1257
+ "chart-4": {
1258
+ "$type": "color",
1259
+ "$description": "Fourth series of a chart. See --chart-1 for the rule.",
1260
+ "$value": {
1261
+ "colorSpace": "oklch",
1262
+ "components": [
1263
+ 0.488,
1264
+ 0.243,
1265
+ 264.376
1266
+ ]
1267
+ }
1268
+ },
1269
+ "chart-5": {
1270
+ "$type": "color",
1271
+ "$description": "Fifth series of a chart. Past five series a chart needs a different form, not a sixth colour.",
1272
+ "$value": {
1273
+ "colorSpace": "oklch",
1274
+ "components": [
1275
+ 0.424,
1276
+ 0.199,
1277
+ 265.638
1278
+ ]
1279
+ }
1280
+ },
1281
+ "sidebar": {
1282
+ "$type": "color",
1283
+ "$description": "Surface of the side panel. Its own token rather than --card, so the sidebar can be tinted apart from the content without touching every panel.",
1284
+ "$value": {
1285
+ "colorSpace": "oklch",
1286
+ "components": [
1287
+ 0.205,
1288
+ 0,
1289
+ 0
1290
+ ]
1291
+ }
1292
+ },
1293
+ "sidebar-foreground": {
1294
+ "$type": "color",
1295
+ "$description": "Text and navigation items inside the sidebar.",
1296
+ "$value": {
1297
+ "colorSpace": "oklch",
1298
+ "components": [
1299
+ 0.985,
1300
+ 0,
1301
+ 0
1302
+ ]
1303
+ }
1304
+ },
1305
+ "sidebar-primary": {
1306
+ "$type": "color",
1307
+ "$description": "Reserved: brand accent scoped to the sidebar, for a shell that needs a different emphasis from the page. Unused by the core.",
1308
+ "$value": "{brand-yellow}"
1309
+ },
1310
+ "sidebar-primary-foreground": {
1311
+ "$type": "color",
1312
+ "$description": "Reserved: text on --sidebar-primary.",
1313
+ "$value": "{brand-yellow-foreground}"
1314
+ },
1315
+ "sidebar-accent": {
1316
+ "$type": "color",
1317
+ "$description": "Hover surface of a sidebar item.",
1318
+ "$value": {
1319
+ "colorSpace": "oklch",
1320
+ "components": [
1321
+ 0.269,
1322
+ 0,
1323
+ 0
1324
+ ]
1325
+ }
1326
+ },
1327
+ "sidebar-accent-foreground": {
1328
+ "$type": "color",
1329
+ "$description": "Text of a sidebar item under the pointer.",
1330
+ "$value": {
1331
+ "colorSpace": "oklch",
1332
+ "components": [
1333
+ 0.985,
1334
+ 0,
1335
+ 0
1336
+ ]
1337
+ }
1338
+ },
1339
+ "sidebar-border": {
1340
+ "$type": "color",
1341
+ "$description": "The sidebar's own hairline: its outline, and the rule under the brand lockup.",
1342
+ "$value": {
1343
+ "colorSpace": "oklch",
1344
+ "components": [
1345
+ 1,
1346
+ 0,
1347
+ 0
1348
+ ],
1349
+ "alpha": 0.1
1350
+ }
1351
+ },
1352
+ "sidebar-ring": {
1353
+ "$type": "color",
1354
+ "$description": "Reserved: focus ring scoped to the sidebar. The core uses the single system ring, --focus-strong.",
1355
+ "$value": {
1356
+ "colorSpace": "oklch",
1357
+ "components": [
1358
+ 0.556,
1359
+ 0,
1360
+ 0
1361
+ ]
1362
+ }
1363
+ },
1364
+ "surface-1": {
1365
+ "$type": "color",
1366
+ "$description": "Ring and separator colour for where a shape has to be punched out of the panel behind it — the border between overlapping avatars, the ring of a step dot.",
1367
+ "$value": "{card}"
1368
+ },
1369
+ "surface-2": {
1370
+ "$type": "color",
1371
+ "$description": "One step up from the panel: hover of an interactive card, header row of a table. Use it when something must read as raised, not as coloured.",
1372
+ "$value": "{secondary}"
1373
+ },
1374
+ "surface-3": {
1375
+ "$type": "color",
1376
+ "$description": "Neutral fill of a track or a placeholder — progress bar, skeleton. It is a background for something that is not text.",
1377
+ "$value": "{muted}"
1378
+ },
1379
+ "surface-inset": {
1380
+ "$type": "color",
1381
+ "$description": "A recessed well: code block, log stream. It reads as carved INTO the panel, which is the opposite of --surface-2.",
1382
+ "$value": {
1383
+ "colorSpace": "oklch",
1384
+ "components": [
1385
+ 0.145,
1386
+ 0,
1387
+ 0
1388
+ ]
1389
+ }
1390
+ },
1391
+ "surface-hover": {
1392
+ "$type": "color",
1393
+ "$description": "Generic hover tint for a row or a disclosure that has no state of its own. When the element already carries meaning (selected, current), use --secondary instead.",
1394
+ "$value": {
1395
+ "colorSpace": "oklch",
1396
+ "components": [
1397
+ 0.3,
1398
+ 0,
1399
+ 0
1400
+ ]
1401
+ }
1402
+ },
1403
+ "foreground-strong": {
1404
+ "$type": "color",
1405
+ "$description": "Text that must out-contrast the default, for a heading that has to lift off the body. Reserved: the core does not use it, so reaching for it is a decision, not a default.",
1406
+ "$value": "{foreground}"
1407
+ },
1408
+ "subtle-foreground": {
1409
+ "$type": "color",
1410
+ "$description": "The quietest text in the system — group labels, table headers, metadata. One step below --muted-foreground; below it there is nothing readable.",
1411
+ "$value": {
1412
+ "colorSpace": "oklch",
1413
+ "components": [
1414
+ 0.76,
1415
+ 0,
1416
+ 0
1417
+ ]
1418
+ }
1419
+ },
1420
+ "border-strong": {
1421
+ "$type": "color",
1422
+ "$description": "A border that must read as an EDGE and not as a hint: outline buttons, keyboard keys. Use it when the border IS the shape of the component.",
1423
+ "$value": {
1424
+ "colorSpace": "oklch",
1425
+ "components": [
1426
+ 0.58,
1427
+ 0,
1428
+ 0
1429
+ ]
1430
+ }
1431
+ },
1432
+ "field-bg": {
1433
+ "$type": "color",
1434
+ "$description": "Background of a form control: input, textarea, select, and the mark of a checkbox or radio. Fields sit slightly recessed from the panel.",
1435
+ "$value": "{muted}"
1436
+ },
1437
+ "overlay": {
1438
+ "$type": "color",
1439
+ "$description": "The scrim behind a modal layer. Dims the page enough to push it back without hiding what is underneath.",
1440
+ "$value": {
1441
+ "colorSpace": "oklch",
1442
+ "components": [
1443
+ 0,
1444
+ 0,
1445
+ 0
1446
+ ],
1447
+ "alpha": 0.74
1448
+ }
1449
+ },
1450
+ "primary-hover": {
1451
+ "$type": "color",
1452
+ "$description": "--primary under the pointer, on a filled surface.",
1453
+ "$value": {
1454
+ "colorSpace": "oklch",
1455
+ "components": [
1456
+ 0.835,
1457
+ 0.19,
1458
+ 89
1459
+ ]
1460
+ }
1461
+ },
1462
+ "primary-active": {
1463
+ "$type": "color",
1464
+ "$description": "--primary while pressed. Reserved: the core resolves the pressed state with geometry instead, so this is here for consumers who also want the colour shift.",
1465
+ "$value": {
1466
+ "colorSpace": "oklch",
1467
+ "components": [
1468
+ 0.74,
1469
+ 0.17,
1470
+ 84
1471
+ ]
1472
+ }
1473
+ },
1474
+ "secondary-hover": {
1475
+ "$type": "color",
1476
+ "$description": "--secondary under the pointer.",
1477
+ "$value": {
1478
+ "colorSpace": "oklch",
1479
+ "components": [
1480
+ 0.31,
1481
+ 0.006,
1482
+ 286.033
1483
+ ]
1484
+ }
1485
+ },
1486
+ "focus": {
1487
+ "$type": "color",
1488
+ "$description": "The soft focus colour, for the halo of a control that cannot carry an outline. The focus CONTRACT is built on --focus-strong.",
1489
+ "$value": "{primary}"
1490
+ },
1491
+ "focus-strong": {
1492
+ "$type": "color",
1493
+ "$description": "The focus ring. One colour and one thickness across the whole system — and that uniformity is a gate (geometry.spec), not a convention.",
1494
+ "$value": "{primary}"
1495
+ },
1496
+ "primary-emphasis": {
1497
+ "$type": "color",
1498
+ "$description": "A denser yellow for a small solid area that would look washed out at --primary — the primary badge.",
1499
+ "$value": "{primary}"
1500
+ },
1501
+ "primary-outline": {
1502
+ "$type": "color",
1503
+ "$description": "Yellow at border strength — the outline of a selected card or of a primary badge, where a filled yellow would shout.",
1504
+ "$value": "{primary}"
1505
+ },
1506
+ "control-selected": {
1507
+ "$type": "color",
1508
+ "$description": "The mark of a checked control — the box of a checkbox, the dot of a radio, the filled half of a switch. It is the state, not the container.",
1509
+ "$value": "{primary}"
1510
+ },
1511
+ "control-selected-foreground": {
1512
+ "$type": "color",
1513
+ "$description": "The glyph drawn ON --control-selected: the tick, the dot.",
1514
+ "$value": "{primary-foreground}"
1515
+ },
1516
+ "selection": {
1517
+ "$type": "color",
1518
+ "$description": "Background of text the user has selected. Set once, on ::selection.",
1519
+ "$value": {
1520
+ "colorSpace": "oklch",
1521
+ "components": [
1522
+ 0.795,
1523
+ 0.184,
1524
+ 86.047
1525
+ ],
1526
+ "alpha": 0.22
1527
+ }
1528
+ },
1529
+ "success-bg": {
1530
+ "$type": "color",
1531
+ "$description": "The muted success fill behind text.",
1532
+ "$value": {
1533
+ "colorSpace": "oklch",
1534
+ "components": [
1535
+ 0.42,
1536
+ 0.11,
1537
+ 150
1538
+ ],
1539
+ "alpha": 0.36
1540
+ }
1541
+ },
1542
+ "warning-bg": {
1543
+ "$type": "color",
1544
+ "$description": "The muted warning fill behind text.",
1545
+ "$value": {
1546
+ "colorSpace": "oklch",
1547
+ "components": [
1548
+ 0.34,
1549
+ 0.08,
1550
+ 86
1551
+ ],
1552
+ "alpha": 0.64
1553
+ }
1554
+ },
1555
+ "danger-bg": {
1556
+ "$type": "color",
1557
+ "$description": "The muted danger fill, behind text: danger badge, alert, card. Never for a button — that is --destructive.",
1558
+ "$value": {
1559
+ "colorSpace": "oklch",
1560
+ "components": [
1561
+ 0.32,
1562
+ 0.1,
1563
+ 22
1564
+ ],
1565
+ "alpha": 0.62
1566
+ }
1567
+ },
1568
+ "info-bg": {
1569
+ "$type": "color",
1570
+ "$description": "The muted informational fill behind text.",
1571
+ "$value": {
1572
+ "colorSpace": "oklch",
1573
+ "components": [
1574
+ 0.29,
1575
+ 0.08,
1576
+ 260
1577
+ ],
1578
+ "alpha": 0.62
1579
+ }
1580
+ }
1581
+ },
1582
+ "light": {
1583
+ "background": {
1584
+ "$type": "color",
1585
+ "$value": {
1586
+ "colorSpace": "oklch",
1587
+ "components": [
1588
+ 0.965,
1589
+ 0,
1590
+ 0
1591
+ ]
1592
+ }
1593
+ },
1594
+ "foreground": {
1595
+ "$type": "color",
1596
+ "$value": {
1597
+ "colorSpace": "oklch",
1598
+ "components": [
1599
+ 0.145,
1600
+ 0,
1601
+ 0
1602
+ ]
1603
+ }
1604
+ },
1605
+ "card": {
1606
+ "$type": "color",
1607
+ "$value": {
1608
+ "colorSpace": "oklch",
1609
+ "components": [
1610
+ 1,
1611
+ 0,
1612
+ 0
1613
+ ]
1614
+ }
1615
+ },
1616
+ "card-foreground": {
1617
+ "$type": "color",
1618
+ "$value": {
1619
+ "colorSpace": "oklch",
1620
+ "components": [
1621
+ 0.145,
1622
+ 0,
1623
+ 0
1624
+ ]
1625
+ }
1626
+ },
1627
+ "popover": {
1628
+ "$type": "color",
1629
+ "$value": {
1630
+ "colorSpace": "oklch",
1631
+ "components": [
1632
+ 1,
1633
+ 0,
1634
+ 0
1635
+ ]
1636
+ }
1637
+ },
1638
+ "popover-foreground": {
1639
+ "$type": "color",
1640
+ "$value": {
1641
+ "colorSpace": "oklch",
1642
+ "components": [
1643
+ 0.145,
1644
+ 0,
1645
+ 0
1646
+ ]
1647
+ }
1648
+ },
1649
+ "primary": {
1650
+ "$type": "color",
1651
+ "$value": "{brand-yellow}"
1652
+ },
1653
+ "primary-foreground": {
1654
+ "$type": "color",
1655
+ "$value": "{brand-yellow-foreground}"
1656
+ },
1657
+ "secondary": {
1658
+ "$type": "color",
1659
+ "$value": {
1660
+ "colorSpace": "oklch",
1661
+ "components": [
1662
+ 0.94,
1663
+ 0,
1664
+ 0
1665
+ ]
1666
+ }
1667
+ },
1668
+ "secondary-foreground": {
1669
+ "$type": "color",
1670
+ "$value": {
1671
+ "colorSpace": "oklch",
1672
+ "components": [
1673
+ 0.21,
1674
+ 0.006,
1675
+ 285.885
1676
+ ]
1677
+ }
1678
+ },
1679
+ "muted": {
1680
+ "$type": "color",
1681
+ "$value": "{secondary}"
1682
+ },
1683
+ "muted-foreground": {
1684
+ "$type": "color",
1685
+ "$value": {
1686
+ "colorSpace": "oklch",
1687
+ "components": [
1688
+ 0.43,
1689
+ 0,
1690
+ 0
1691
+ ]
1692
+ }
1693
+ },
1694
+ "accent": {
1695
+ "$type": "color",
1696
+ "$value": "{secondary}"
1697
+ },
1698
+ "accent-foreground": {
1699
+ "$type": "color",
1700
+ "$value": {
1701
+ "colorSpace": "oklch",
1702
+ "components": [
1703
+ 0.205,
1704
+ 0,
1705
+ 0
1706
+ ]
1707
+ }
1708
+ },
1709
+ "destructive": {
1710
+ "$type": "color",
1711
+ "$value": {
1712
+ "colorSpace": "oklch",
1713
+ "components": [
1714
+ 0.577,
1715
+ 0.245,
1716
+ 27.325
1717
+ ]
1718
+ }
1719
+ },
1720
+ "destructive-foreground": {
1721
+ "$type": "color",
1722
+ "$value": {
1723
+ "colorSpace": "oklch",
1724
+ "components": [
1725
+ 0.985,
1726
+ 0,
1727
+ 0
1728
+ ]
1729
+ }
1730
+ },
1731
+ "border": {
1732
+ "$type": "color",
1733
+ "$value": {
1734
+ "colorSpace": "oklch",
1735
+ "components": [
1736
+ 0.89,
1737
+ 0,
1738
+ 0
1739
+ ]
1740
+ }
1741
+ },
1742
+ "input": {
1743
+ "$type": "color",
1744
+ "$value": {
1745
+ "colorSpace": "oklch",
1746
+ "components": [
1747
+ 0.922,
1748
+ 0,
1749
+ 0
1750
+ ]
1751
+ }
1752
+ },
1753
+ "ring": {
1754
+ "$type": "color",
1755
+ "$value": {
1756
+ "colorSpace": "oklch",
1757
+ "components": [
1758
+ 0.708,
1759
+ 0,
1760
+ 0
1761
+ ]
1762
+ }
1763
+ },
1764
+ "chart-1": {
1765
+ "$type": "color",
1766
+ "$value": {
1767
+ "colorSpace": "oklch",
1768
+ "components": [
1769
+ 0.809,
1770
+ 0.105,
1771
+ 251.813
1772
+ ]
1773
+ }
1774
+ },
1775
+ "chart-2": {
1776
+ "$type": "color",
1777
+ "$value": {
1778
+ "colorSpace": "oklch",
1779
+ "components": [
1780
+ 0.623,
1781
+ 0.214,
1782
+ 259.815
1783
+ ]
1784
+ }
1785
+ },
1786
+ "chart-3": {
1787
+ "$type": "color",
1788
+ "$value": {
1789
+ "colorSpace": "oklch",
1790
+ "components": [
1791
+ 0.546,
1792
+ 0.245,
1793
+ 262.881
1794
+ ]
1795
+ }
1796
+ },
1797
+ "chart-4": {
1798
+ "$type": "color",
1799
+ "$value": {
1800
+ "colorSpace": "oklch",
1801
+ "components": [
1802
+ 0.488,
1803
+ 0.243,
1804
+ 264.376
1805
+ ]
1806
+ }
1807
+ },
1808
+ "chart-5": {
1809
+ "$type": "color",
1810
+ "$value": {
1811
+ "colorSpace": "oklch",
1812
+ "components": [
1813
+ 0.424,
1814
+ 0.199,
1815
+ 265.638
1816
+ ]
1817
+ }
1818
+ },
1819
+ "sidebar": {
1820
+ "$type": "color",
1821
+ "$value": "{card}"
1822
+ },
1823
+ "sidebar-foreground": {
1824
+ "$type": "color",
1825
+ "$value": {
1826
+ "colorSpace": "oklch",
1827
+ "components": [
1828
+ 0.145,
1829
+ 0,
1830
+ 0
1831
+ ]
1832
+ }
1833
+ },
1834
+ "sidebar-primary": {
1835
+ "$type": "color",
1836
+ "$value": "{brand-yellow}"
1837
+ },
1838
+ "sidebar-primary-foreground": {
1839
+ "$type": "color",
1840
+ "$value": "{brand-yellow-foreground}"
1841
+ },
1842
+ "sidebar-accent": {
1843
+ "$type": "color",
1844
+ "$value": "{secondary}"
1845
+ },
1846
+ "sidebar-accent-foreground": {
1847
+ "$type": "color",
1848
+ "$value": {
1849
+ "colorSpace": "oklch",
1850
+ "components": [
1851
+ 0.205,
1852
+ 0,
1853
+ 0
1854
+ ]
1855
+ }
1856
+ },
1857
+ "sidebar-border": {
1858
+ "$type": "color",
1859
+ "$value": {
1860
+ "colorSpace": "oklch",
1861
+ "components": [
1862
+ 0.89,
1863
+ 0,
1864
+ 0
1865
+ ]
1866
+ }
1867
+ },
1868
+ "sidebar-ring": {
1869
+ "$type": "color",
1870
+ "$value": {
1871
+ "colorSpace": "oklch",
1872
+ "components": [
1873
+ 0.708,
1874
+ 0,
1875
+ 0
1876
+ ]
1877
+ }
1878
+ },
1879
+ "surface-1": {
1880
+ "$type": "color",
1881
+ "$value": "{card}"
1882
+ },
1883
+ "surface-2": {
1884
+ "$type": "color",
1885
+ "$value": "{secondary}"
1886
+ },
1887
+ "surface-3": {
1888
+ "$type": "color",
1889
+ "$value": "{muted}"
1890
+ },
1891
+ "surface-inset": {
1892
+ "$type": "color",
1893
+ "$value": {
1894
+ "colorSpace": "oklch",
1895
+ "components": [
1896
+ 0.955,
1897
+ 0,
1898
+ 0
1899
+ ]
1900
+ },
1901
+ "$description": "Superficie afundada do tema claro. NAO pode ser alias de {secondary}: eram o mesmo 0.94, e um Button secondary desaparecia dentro de um painel inset (achado 24/07/2026). 0.955 fica entre o fundo (0.965) e o secondary (0.94) — afunda sem colidir."
1902
+ },
1903
+ "surface-hover": {
1904
+ "$type": "color",
1905
+ "$value": {
1906
+ "colorSpace": "oklch",
1907
+ "components": [
1908
+ 0.925,
1909
+ 0,
1910
+ 0
1911
+ ]
1912
+ }
1913
+ },
1914
+ "foreground-strong": {
1915
+ "$type": "color",
1916
+ "$value": "{foreground}"
1917
+ },
1918
+ "subtle-foreground": {
1919
+ "$type": "color",
1920
+ "$value": {
1921
+ "colorSpace": "oklch",
1922
+ "components": [
1923
+ 0.43,
1924
+ 0,
1925
+ 0
1926
+ ]
1927
+ }
1928
+ },
1929
+ "border-strong": {
1930
+ "$type": "color",
1931
+ "$value": {
1932
+ "colorSpace": "oklch",
1933
+ "components": [
1934
+ 0.56,
1935
+ 0,
1936
+ 0
1937
+ ]
1938
+ }
1939
+ },
1940
+ "field-bg": {
1941
+ "$type": "color",
1942
+ "$value": "{muted}"
1943
+ },
1944
+ "overlay": {
1945
+ "$type": "color",
1946
+ "$value": {
1947
+ "colorSpace": "oklch",
1948
+ "components": [
1949
+ 0.145,
1950
+ 0,
1951
+ 0
1952
+ ],
1953
+ "alpha": 0.4
1954
+ }
1955
+ },
1956
+ "primary-hover": {
1957
+ "$type": "color",
1958
+ "$value": {
1959
+ "colorSpace": "oklch",
1960
+ "components": [
1961
+ 0.835,
1962
+ 0.19,
1963
+ 89
1964
+ ]
1965
+ }
1966
+ },
1967
+ "primary-active": {
1968
+ "$type": "color",
1969
+ "$value": {
1970
+ "colorSpace": "oklch",
1971
+ "components": [
1972
+ 0.74,
1973
+ 0.17,
1974
+ 84
1975
+ ]
1976
+ }
1977
+ },
1978
+ "secondary-hover": {
1979
+ "$type": "color",
1980
+ "$value": "{surface-hover}"
1981
+ },
1982
+ "focus": {
1983
+ "$type": "color",
1984
+ "$value": "{primary}"
1985
+ },
1986
+ "focus-strong": {
1987
+ "$type": "color",
1988
+ "$value": "{brand-yellow-foreground}"
1989
+ },
1990
+ "primary-emphasis": {
1991
+ "$type": "color",
1992
+ "$value": "{brand-yellow-foreground}"
1993
+ },
1994
+ "primary-outline": {
1995
+ "$type": "color",
1996
+ "$value": "{brand-yellow-foreground}"
1997
+ },
1998
+ "control-selected": {
1999
+ "$type": "color",
2000
+ "$value": "{brand-yellow-foreground}"
2001
+ },
2002
+ "control-selected-foreground": {
2003
+ "$type": "color",
2004
+ "$value": {
2005
+ "colorSpace": "oklch",
2006
+ "components": [
2007
+ 0.985,
2008
+ 0,
2009
+ 0
2010
+ ]
2011
+ }
2012
+ },
2013
+ "success-400": {
2014
+ "$type": "color",
2015
+ "$value": {
2016
+ "colorSpace": "srgb",
2017
+ "components": [
2018
+ 0.05882,
2019
+ 0.41961,
2020
+ 0.24314
2021
+ ],
2022
+ "hex": "#0f6b3e"
2023
+ }
2024
+ },
2025
+ "warning-400": {
2026
+ "$type": "color",
2027
+ "$value": {
2028
+ "colorSpace": "srgb",
2029
+ "components": [
2030
+ 0.42745,
2031
+ 0.30196,
2032
+ 0
2033
+ ],
2034
+ "hex": "#6d4d00"
2035
+ }
2036
+ },
2037
+ "danger-400": {
2038
+ "$type": "color",
2039
+ "$value": {
2040
+ "colorSpace": "srgb",
2041
+ "components": [
2042
+ 0.62353,
2043
+ 0.13725,
2044
+ 0.18824
2045
+ ],
2046
+ "hex": "#9f2330"
2047
+ }
2048
+ },
2049
+ "info-400": {
2050
+ "$type": "color",
2051
+ "$value": {
2052
+ "colorSpace": "srgb",
2053
+ "components": [
2054
+ 0.08627,
2055
+ 0.3098,
2056
+ 0.61569
2057
+ ],
2058
+ "hex": "#164f9d"
2059
+ }
2060
+ },
2061
+ "oracle-300": {
2062
+ "$type": "color",
2063
+ "$value": "{chart-4}"
2064
+ },
2065
+ "oracle-400": {
2066
+ "$type": "color",
2067
+ "$value": "{chart-4}"
2068
+ },
2069
+ "selection": {
2070
+ "$type": "color",
2071
+ "$value": {
2072
+ "colorSpace": "oklch",
2073
+ "components": [
2074
+ 0.795,
2075
+ 0.184,
2076
+ 86.047
2077
+ ],
2078
+ "alpha": 0.18
2079
+ }
2080
+ },
2081
+ "success-bg": {
2082
+ "$type": "color",
2083
+ "$value": {
2084
+ "colorSpace": "oklch",
2085
+ "components": [
2086
+ 0.94,
2087
+ 0.05,
2088
+ 150
2089
+ ]
2090
+ }
2091
+ },
2092
+ "warning-bg": {
2093
+ "$type": "color",
2094
+ "$value": {
2095
+ "colorSpace": "oklch",
2096
+ "components": [
2097
+ 0.95,
2098
+ 0.06,
2099
+ 86
2100
+ ]
2101
+ }
2102
+ },
2103
+ "danger-bg": {
2104
+ "$type": "color",
2105
+ "$value": {
2106
+ "colorSpace": "oklch",
2107
+ "components": [
2108
+ 0.95,
2109
+ 0.05,
2110
+ 22
2111
+ ]
2112
+ }
2113
+ },
2114
+ "info-bg": {
2115
+ "$type": "color",
2116
+ "$value": {
2117
+ "colorSpace": "oklch",
2118
+ "components": [
2119
+ 0.95,
2120
+ 0.045,
2121
+ 260
2122
+ ]
2123
+ }
2124
+ }
2125
+ }
2126
+ },
2127
+ "density": {
2128
+ "compact": {
2129
+ "control-h-xs": {
2130
+ "$type": "dimension",
2131
+ "$value": {
2132
+ "value": 1.5,
2133
+ "unit": "rem"
2134
+ }
2135
+ },
2136
+ "control-h-sm": {
2137
+ "$type": "dimension",
2138
+ "$value": {
2139
+ "value": 1.75,
2140
+ "unit": "rem"
2141
+ }
2142
+ },
2143
+ "control-h-md": {
2144
+ "$type": "dimension",
2145
+ "$value": {
2146
+ "value": 2.0,
2147
+ "unit": "rem"
2148
+ }
2149
+ },
2150
+ "control-h-lg": {
2151
+ "$type": "dimension",
2152
+ "$value": {
2153
+ "value": 2.375,
2154
+ "unit": "rem"
2155
+ }
2156
+ },
2157
+ "control-h-xl": {
2158
+ "$type": "dimension",
2159
+ "$value": {
2160
+ "value": 2.75,
2161
+ "unit": "rem"
2162
+ }
2163
+ },
2164
+ "row-h": {
2165
+ "$type": "dimension",
2166
+ "$value": {
2167
+ "value": 2.625,
2168
+ "unit": "rem"
2169
+ }
2170
+ },
2171
+ "card-pad": {
2172
+ "$type": "dimension",
2173
+ "$value": {
2174
+ "value": 1.0,
2175
+ "unit": "rem"
2176
+ }
2177
+ },
2178
+ "section-gap": {
2179
+ "$type": "dimension",
2180
+ "$value": {
2181
+ "value": 1.125,
2182
+ "unit": "rem"
2183
+ }
2184
+ }
2185
+ },
2186
+ "comfortable": {
2187
+ "control-h-xs": {
2188
+ "$type": "dimension",
2189
+ "$description": "Height of the smallest control. The density scale governs HEIGHT — never font size, spacing or radius; that contract is in packages/tokens/README.md.",
2190
+ "$value": {
2191
+ "value": 1.625,
2192
+ "unit": "rem"
2193
+ }
2194
+ },
2195
+ "control-h-sm": {
2196
+ "$type": "dimension",
2197
+ "$description": "Height of a small control: compact button, pagination, calendar arrow.",
2198
+ "$value": {
2199
+ "value": 1.875,
2200
+ "unit": "rem"
2201
+ }
2202
+ },
2203
+ "control-h-md": {
2204
+ "$type": "dimension",
2205
+ "$description": "Height of the default control, and the reference for anything that must line up beside one — a field, a segment, an avatar, a sidebar item.",
2206
+ "$value": {
2207
+ "value": 2.25,
2208
+ "unit": "rem"
2209
+ }
2210
+ },
2211
+ "control-h-lg": {
2212
+ "$type": "dimension",
2213
+ "$description": "Height of a large control.",
2214
+ "$value": {
2215
+ "value": 2.625,
2216
+ "unit": "rem"
2217
+ }
2218
+ },
2219
+ "control-h-xl": {
2220
+ "$type": "dimension",
2221
+ "$description": "Height of the largest control, for a single prominent call to action.",
2222
+ "$value": {
2223
+ "value": 3.125,
2224
+ "unit": "rem"
2225
+ }
2226
+ },
2227
+ "row-h": {
2228
+ "$type": "dimension",
2229
+ "$description": "Height of a table row. The one density token that is not about controls.",
2230
+ "$value": {
2231
+ "value": 3.0,
2232
+ "unit": "rem"
2233
+ }
2234
+ },
2235
+ "card-pad": {
2236
+ "$type": "dimension",
2237
+ "$description": "Inner padding of a panel. Density breathes here, which is why a compact layout feels tighter without anything having moved.",
2238
+ "$value": {
2239
+ "value": 1.25,
2240
+ "unit": "rem"
2241
+ }
2242
+ },
2243
+ "section-gap": {
2244
+ "$type": "dimension",
2245
+ "$description": "Vertical gap between sections of a page.",
2246
+ "$value": {
2247
+ "value": 1.5,
2248
+ "unit": "rem"
2249
+ }
2250
+ }
2251
+ },
2252
+ "spacious": {
2253
+ "control-h-xs": {
2254
+ "$type": "dimension",
2255
+ "$value": {
2256
+ "value": 1.75,
2257
+ "unit": "rem"
2258
+ }
2259
+ },
2260
+ "control-h-sm": {
2261
+ "$type": "dimension",
2262
+ "$value": {
2263
+ "value": 2.125,
2264
+ "unit": "rem"
2265
+ }
2266
+ },
2267
+ "control-h-md": {
2268
+ "$type": "dimension",
2269
+ "$value": {
2270
+ "value": 2.5,
2271
+ "unit": "rem"
2272
+ }
2273
+ },
2274
+ "control-h-lg": {
2275
+ "$type": "dimension",
2276
+ "$value": {
2277
+ "value": 3.0,
2278
+ "unit": "rem"
2279
+ }
2280
+ },
2281
+ "control-h-xl": {
2282
+ "$type": "dimension",
2283
+ "$value": {
2284
+ "value": 3.5,
2285
+ "unit": "rem"
2286
+ }
2287
+ },
2288
+ "row-h": {
2289
+ "$type": "dimension",
2290
+ "$value": {
2291
+ "value": 3.375,
2292
+ "unit": "rem"
2293
+ }
2294
+ },
2295
+ "card-pad": {
2296
+ "$type": "dimension",
2297
+ "$value": {
2298
+ "value": 1.5,
2299
+ "unit": "rem"
2300
+ }
2301
+ },
2302
+ "section-gap": {
2303
+ "$type": "dimension",
2304
+ "$value": {
2305
+ "value": 2.0,
2306
+ "unit": "rem"
2307
+ }
2308
+ }
2309
+ }
2310
+ }
2311
+ }