@womp/kookie-ui 0.4.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/components.css +468 -266
  2. package/package.json +1 -1
  3. package/src/components/_internal/base-card.css +5 -5
  4. package/src/components/_internal/base-checkbox.css +17 -3
  5. package/src/components/_internal/base-dialog.css +4 -4
  6. package/src/components/_internal/base-menu.css +3 -3
  7. package/src/components/accordion.css +5 -5
  8. package/src/components/callout.css +5 -5
  9. package/src/components/chatbar.css +6 -6
  10. package/src/components/checkbox-cards.css +30 -0
  11. package/src/components/hover-card.css +3 -3
  12. package/src/components/popover.css +4 -4
  13. package/src/components/radio-cards.css +30 -0
  14. package/src/components/select.css +2 -2
  15. package/src/components/shell.css +1 -1
  16. package/src/components/table.css +5 -5
  17. package/src/components/tooltip.css +1 -1
  18. package/src/styles/tokens/radius.css +47 -4
  19. package/styles.css +486 -267
  20. package/tokens/base.css +18 -1
  21. package/tokens.css +18 -1
package/styles.css CHANGED
@@ -4772,25 +4772,42 @@
4772
4772
  --radius-10: calc(40px * var(--scaling) * var(--radius-factor));
4773
4773
  --radius-11: calc(48px * var(--scaling) * var(--radius-factor));
4774
4774
  --radius-12: calc(56px * var(--scaling) * var(--radius-factor));
4775
+ --radius-surface-1: calc(6px * var(--scaling) * var(--radius-surface-factor));
4776
+ --radius-surface-2: calc(8px * var(--scaling) * var(--radius-surface-factor));
4777
+ --radius-surface-3: calc(10px * var(--scaling) * var(--radius-surface-factor));
4778
+ --radius-surface-4: calc(12px * var(--scaling) * var(--radius-surface-factor));
4779
+ --radius-surface-5: calc(16px * var(--scaling) * var(--radius-surface-factor));
4780
+ --radius-surface-6: calc(20px * var(--scaling) * var(--radius-surface-factor));
4781
+ --radius-surface-7: calc(24px * var(--scaling) * var(--radius-surface-factor));
4782
+ --radius-surface-8: calc(28px * var(--scaling) * var(--radius-surface-factor));
4783
+ --radius-surface-9: calc(32px * var(--scaling) * var(--radius-surface-factor));
4784
+ --radius-surface-10: calc(40px * var(--scaling) * var(--radius-surface-factor));
4785
+ --radius-surface-11: calc(48px * var(--scaling) * var(--radius-surface-factor));
4786
+ --radius-surface-12: calc(56px * var(--scaling) * var(--radius-surface-factor));
4775
4787
  }
4776
4788
  [data-radius='none'] {
4777
4789
  --radius-factor: 0;
4790
+ --radius-surface-factor: 0;
4778
4791
  --radius-full: 0px;
4779
4792
  }
4780
4793
  [data-radius='small'] {
4781
4794
  --radius-factor: 0.75;
4795
+ --radius-surface-factor: 0.5;
4782
4796
  --radius-full: 0px;
4783
4797
  }
4784
4798
  [data-radius='medium'] {
4785
4799
  --radius-factor: 1;
4800
+ --radius-surface-factor: 0.75;
4786
4801
  --radius-full: 0px;
4787
4802
  }
4788
4803
  [data-radius='large'] {
4789
4804
  --radius-factor: 1.5;
4805
+ --radius-surface-factor: 0.9;
4790
4806
  --radius-full: 0px;
4791
4807
  }
4792
4808
  [data-radius='full'] {
4793
- --radius-factor: 2.0;
4809
+ --radius-factor: 2;
4810
+ --radius-surface-factor: 1;
4794
4811
  --radius-full: 9999px;
4795
4812
  }
4796
4813
  @supports (color: color-mix(in oklab, white, black)) {
@@ -6601,85 +6618,85 @@
6601
6618
  --backdrop-filter-components: var(--backdrop-filter-components-enabled);
6602
6619
  }
6603
6620
  .rt-AccordionRoot:where(.rt-r-size-1) {
6604
- border-radius: var(--radius-1);
6621
+ border-radius: var(--radius-surface-1);
6605
6622
  }
6606
6623
  .rt-AccordionRoot:where(.rt-r-size-2) {
6607
- border-radius: var(--radius-2);
6624
+ border-radius: var(--radius-surface-2);
6608
6625
  }
6609
6626
  .rt-AccordionRoot:where(.rt-r-size-3) {
6610
- border-radius: var(--radius-3);
6627
+ border-radius: var(--radius-surface-3);
6611
6628
  }
6612
6629
  .rt-AccordionRoot:where(.rt-r-size-4) {
6613
- border-radius: var(--radius-4);
6630
+ border-radius: var(--radius-surface-4);
6614
6631
  }
6615
6632
  @media (min-width: 520px) {
6616
6633
  .rt-AccordionRoot:where(.xs\:rt-r-size-1) {
6617
- border-radius: var(--radius-1);
6634
+ border-radius: var(--radius-surface-1);
6618
6635
  }
6619
6636
  .rt-AccordionRoot:where(.xs\:rt-r-size-2) {
6620
- border-radius: var(--radius-2);
6637
+ border-radius: var(--radius-surface-2);
6621
6638
  }
6622
6639
  .rt-AccordionRoot:where(.xs\:rt-r-size-3) {
6623
- border-radius: var(--radius-3);
6640
+ border-radius: var(--radius-surface-3);
6624
6641
  }
6625
6642
  .rt-AccordionRoot:where(.xs\:rt-r-size-4) {
6626
- border-radius: var(--radius-4);
6643
+ border-radius: var(--radius-surface-4);
6627
6644
  }
6628
6645
  }
6629
6646
  @media (min-width: 768px) {
6630
6647
  .rt-AccordionRoot:where(.sm\:rt-r-size-1) {
6631
- border-radius: var(--radius-1);
6648
+ border-radius: var(--radius-surface-1);
6632
6649
  }
6633
6650
  .rt-AccordionRoot:where(.sm\:rt-r-size-2) {
6634
- border-radius: var(--radius-2);
6651
+ border-radius: var(--radius-surface-2);
6635
6652
  }
6636
6653
  .rt-AccordionRoot:where(.sm\:rt-r-size-3) {
6637
- border-radius: var(--radius-3);
6654
+ border-radius: var(--radius-surface-3);
6638
6655
  }
6639
6656
  .rt-AccordionRoot:where(.sm\:rt-r-size-4) {
6640
- border-radius: var(--radius-4);
6657
+ border-radius: var(--radius-surface-4);
6641
6658
  }
6642
6659
  }
6643
6660
  @media (min-width: 1024px) {
6644
6661
  .rt-AccordionRoot:where(.md\:rt-r-size-1) {
6645
- border-radius: var(--radius-1);
6662
+ border-radius: var(--radius-surface-1);
6646
6663
  }
6647
6664
  .rt-AccordionRoot:where(.md\:rt-r-size-2) {
6648
- border-radius: var(--radius-2);
6665
+ border-radius: var(--radius-surface-2);
6649
6666
  }
6650
6667
  .rt-AccordionRoot:where(.md\:rt-r-size-3) {
6651
- border-radius: var(--radius-3);
6668
+ border-radius: var(--radius-surface-3);
6652
6669
  }
6653
6670
  .rt-AccordionRoot:where(.md\:rt-r-size-4) {
6654
- border-radius: var(--radius-4);
6671
+ border-radius: var(--radius-surface-4);
6655
6672
  }
6656
6673
  }
6657
6674
  @media (min-width: 1280px) {
6658
6675
  .rt-AccordionRoot:where(.lg\:rt-r-size-1) {
6659
- border-radius: var(--radius-1);
6676
+ border-radius: var(--radius-surface-1);
6660
6677
  }
6661
6678
  .rt-AccordionRoot:where(.lg\:rt-r-size-2) {
6662
- border-radius: var(--radius-2);
6679
+ border-radius: var(--radius-surface-2);
6663
6680
  }
6664
6681
  .rt-AccordionRoot:where(.lg\:rt-r-size-3) {
6665
- border-radius: var(--radius-3);
6682
+ border-radius: var(--radius-surface-3);
6666
6683
  }
6667
6684
  .rt-AccordionRoot:where(.lg\:rt-r-size-4) {
6668
- border-radius: var(--radius-4);
6685
+ border-radius: var(--radius-surface-4);
6669
6686
  }
6670
6687
  }
6671
6688
  @media (min-width: 1640px) {
6672
6689
  .rt-AccordionRoot:where(.xl\:rt-r-size-1) {
6673
- border-radius: var(--radius-1);
6690
+ border-radius: var(--radius-surface-1);
6674
6691
  }
6675
6692
  .rt-AccordionRoot:where(.xl\:rt-r-size-2) {
6676
- border-radius: var(--radius-2);
6693
+ border-radius: var(--radius-surface-2);
6677
6694
  }
6678
6695
  .rt-AccordionRoot:where(.xl\:rt-r-size-3) {
6679
- border-radius: var(--radius-3);
6696
+ border-radius: var(--radius-surface-3);
6680
6697
  }
6681
6698
  .rt-AccordionRoot:where(.xl\:rt-r-size-4) {
6682
- border-radius: var(--radius-4);
6699
+ border-radius: var(--radius-surface-4);
6683
6700
  }
6684
6701
  }
6685
6702
  :where(.rt-AccordionRoot:where(.rt-variant-surface)) {
@@ -7316,108 +7333,108 @@
7316
7333
  }
7317
7334
  .rt-BaseDialogContent:where(.rt-r-size-1) {
7318
7335
  --dialog-content-padding: var(--space-5);
7319
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
7336
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-2)));
7320
7337
  }
7321
7338
  .rt-BaseDialogContent:where(.rt-r-size-2) {
7322
7339
  --dialog-content-padding: var(--space-6);
7323
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
7340
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-3)));
7324
7341
  }
7325
7342
  .rt-BaseDialogContent:where(.rt-r-size-3) {
7326
7343
  --dialog-content-padding: var(--space-7);
7327
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
7344
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-4)));
7328
7345
  }
7329
7346
  .rt-BaseDialogContent:where(.rt-r-size-4) {
7330
7347
  --dialog-content-padding: var(--space-8);
7331
- border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
7348
+ border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-5)));
7332
7349
  }
7333
7350
  @media (min-width: 520px) {
7334
7351
  .rt-BaseDialogContent:where(.xs\:rt-r-size-1) {
7335
7352
  --dialog-content-padding: var(--space-5);
7336
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
7353
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-2)));
7337
7354
  }
7338
7355
  .rt-BaseDialogContent:where(.xs\:rt-r-size-2) {
7339
7356
  --dialog-content-padding: var(--space-6);
7340
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
7357
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-3)));
7341
7358
  }
7342
7359
  .rt-BaseDialogContent:where(.xs\:rt-r-size-3) {
7343
7360
  --dialog-content-padding: var(--space-7);
7344
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
7361
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-4)));
7345
7362
  }
7346
7363
  .rt-BaseDialogContent:where(.xs\:rt-r-size-4) {
7347
7364
  --dialog-content-padding: var(--space-8);
7348
- border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
7365
+ border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-5)));
7349
7366
  }
7350
7367
  }
7351
7368
  @media (min-width: 768px) {
7352
7369
  .rt-BaseDialogContent:where(.sm\:rt-r-size-1) {
7353
7370
  --dialog-content-padding: var(--space-5);
7354
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
7371
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-2)));
7355
7372
  }
7356
7373
  .rt-BaseDialogContent:where(.sm\:rt-r-size-2) {
7357
7374
  --dialog-content-padding: var(--space-6);
7358
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
7375
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-3)));
7359
7376
  }
7360
7377
  .rt-BaseDialogContent:where(.sm\:rt-r-size-3) {
7361
7378
  --dialog-content-padding: var(--space-7);
7362
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
7379
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-4)));
7363
7380
  }
7364
7381
  .rt-BaseDialogContent:where(.sm\:rt-r-size-4) {
7365
7382
  --dialog-content-padding: var(--space-8);
7366
- border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
7383
+ border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-5)));
7367
7384
  }
7368
7385
  }
7369
7386
  @media (min-width: 1024px) {
7370
7387
  .rt-BaseDialogContent:where(.md\:rt-r-size-1) {
7371
7388
  --dialog-content-padding: var(--space-5);
7372
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
7389
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-2)));
7373
7390
  }
7374
7391
  .rt-BaseDialogContent:where(.md\:rt-r-size-2) {
7375
7392
  --dialog-content-padding: var(--space-6);
7376
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
7393
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-3)));
7377
7394
  }
7378
7395
  .rt-BaseDialogContent:where(.md\:rt-r-size-3) {
7379
7396
  --dialog-content-padding: var(--space-7);
7380
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
7397
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-4)));
7381
7398
  }
7382
7399
  .rt-BaseDialogContent:where(.md\:rt-r-size-4) {
7383
7400
  --dialog-content-padding: var(--space-8);
7384
- border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
7401
+ border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-5)));
7385
7402
  }
7386
7403
  }
7387
7404
  @media (min-width: 1280px) {
7388
7405
  .rt-BaseDialogContent:where(.lg\:rt-r-size-1) {
7389
7406
  --dialog-content-padding: var(--space-5);
7390
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
7407
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-2)));
7391
7408
  }
7392
7409
  .rt-BaseDialogContent:where(.lg\:rt-r-size-2) {
7393
7410
  --dialog-content-padding: var(--space-6);
7394
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
7411
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-3)));
7395
7412
  }
7396
7413
  .rt-BaseDialogContent:where(.lg\:rt-r-size-3) {
7397
7414
  --dialog-content-padding: var(--space-7);
7398
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
7415
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-4)));
7399
7416
  }
7400
7417
  .rt-BaseDialogContent:where(.lg\:rt-r-size-4) {
7401
7418
  --dialog-content-padding: var(--space-8);
7402
- border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
7419
+ border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-5)));
7403
7420
  }
7404
7421
  }
7405
7422
  @media (min-width: 1640px) {
7406
7423
  .rt-BaseDialogContent:where(.xl\:rt-r-size-1) {
7407
7424
  --dialog-content-padding: var(--space-5);
7408
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-2)));
7425
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-2)));
7409
7426
  }
7410
7427
  .rt-BaseDialogContent:where(.xl\:rt-r-size-2) {
7411
7428
  --dialog-content-padding: var(--space-6);
7412
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-3)));
7429
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-3)));
7413
7430
  }
7414
7431
  .rt-BaseDialogContent:where(.xl\:rt-r-size-3) {
7415
7432
  --dialog-content-padding: var(--space-7);
7416
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-4)));
7433
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-4)));
7417
7434
  }
7418
7435
  .rt-BaseDialogContent:where(.xl\:rt-r-size-4) {
7419
7436
  --dialog-content-padding: var(--space-8);
7420
- border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-5)));
7437
+ border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-5)));
7421
7438
  }
7422
7439
  }
7423
7440
  @media (prefers-reduced-motion: no-preference) {
@@ -10072,7 +10089,7 @@
10072
10089
  -moz-column-gap: var(--space-2);
10073
10090
  column-gap: var(--space-2);
10074
10091
  padding: var(--space-3);
10075
- --callout-border-radius: max(var(--radius-1), var(--radius-full));
10092
+ --callout-border-radius: var(--radius-surface-1);
10076
10093
  --callout-icon-height: var(--line-height-1);
10077
10094
  --callout-icon-size: var(--content-icon-size-1);
10078
10095
  }
@@ -10082,7 +10099,7 @@
10082
10099
  -moz-column-gap: var(--space-3);
10083
10100
  column-gap: var(--space-3);
10084
10101
  padding: var(--space-4);
10085
- --callout-border-radius: max(var(--radius-2), var(--radius-full));
10102
+ --callout-border-radius: var(--radius-surface-2);
10086
10103
  --callout-icon-height: var(--line-height-2);
10087
10104
  --callout-icon-size: var(--content-icon-size-2);
10088
10105
  }
@@ -10092,7 +10109,7 @@
10092
10109
  -moz-column-gap: var(--space-4);
10093
10110
  column-gap: var(--space-4);
10094
10111
  padding: var(--space-5);
10095
- --callout-border-radius: max(var(--radius-3), var(--radius-full));
10112
+ --callout-border-radius: var(--radius-surface-3);
10096
10113
  --callout-icon-height: var(--line-height-3);
10097
10114
  --callout-icon-size: var(--content-icon-size-3);
10098
10115
  }
@@ -10102,7 +10119,7 @@
10102
10119
  -moz-column-gap: var(--space-5);
10103
10120
  column-gap: var(--space-5);
10104
10121
  padding: var(--space-6);
10105
- --callout-border-radius: max(var(--radius-4), var(--radius-full));
10122
+ --callout-border-radius: var(--radius-surface-4);
10106
10123
  --callout-icon-height: var(--line-height-4);
10107
10124
  --callout-icon-size: var(--content-icon-size-4);
10108
10125
  }
@@ -10112,7 +10129,7 @@
10112
10129
  -moz-column-gap: var(--space-6);
10113
10130
  column-gap: var(--space-6);
10114
10131
  padding: var(--space-7);
10115
- --callout-border-radius: max(var(--radius-5), var(--radius-full));
10132
+ --callout-border-radius: var(--radius-surface-5);
10116
10133
  --callout-icon-height: var(--line-height-5);
10117
10134
  --callout-icon-size: var(--content-icon-size-5);
10118
10135
  }
@@ -10123,7 +10140,7 @@
10123
10140
  -moz-column-gap: var(--space-2);
10124
10141
  column-gap: var(--space-2);
10125
10142
  padding: var(--space-3);
10126
- --callout-border-radius: max(var(--radius-1), var(--radius-full));
10143
+ --callout-border-radius: var(--radius-surface-1);
10127
10144
  --callout-icon-height: var(--line-height-1);
10128
10145
  --callout-icon-size: var(--content-icon-size-1);
10129
10146
  }
@@ -10133,7 +10150,7 @@
10133
10150
  -moz-column-gap: var(--space-3);
10134
10151
  column-gap: var(--space-3);
10135
10152
  padding: var(--space-4);
10136
- --callout-border-radius: max(var(--radius-2), var(--radius-full));
10153
+ --callout-border-radius: var(--radius-surface-2);
10137
10154
  --callout-icon-height: var(--line-height-2);
10138
10155
  --callout-icon-size: var(--content-icon-size-2);
10139
10156
  }
@@ -10143,7 +10160,7 @@
10143
10160
  -moz-column-gap: var(--space-4);
10144
10161
  column-gap: var(--space-4);
10145
10162
  padding: var(--space-5);
10146
- --callout-border-radius: max(var(--radius-3), var(--radius-full));
10163
+ --callout-border-radius: var(--radius-surface-3);
10147
10164
  --callout-icon-height: var(--line-height-3);
10148
10165
  --callout-icon-size: var(--content-icon-size-3);
10149
10166
  }
@@ -10153,7 +10170,7 @@
10153
10170
  -moz-column-gap: var(--space-5);
10154
10171
  column-gap: var(--space-5);
10155
10172
  padding: var(--space-6);
10156
- --callout-border-radius: max(var(--radius-4), var(--radius-full));
10173
+ --callout-border-radius: var(--radius-surface-4);
10157
10174
  --callout-icon-height: var(--line-height-4);
10158
10175
  --callout-icon-size: var(--content-icon-size-4);
10159
10176
  }
@@ -10163,7 +10180,7 @@
10163
10180
  -moz-column-gap: var(--space-6);
10164
10181
  column-gap: var(--space-6);
10165
10182
  padding: var(--space-7);
10166
- --callout-border-radius: max(var(--radius-5), var(--radius-full));
10183
+ --callout-border-radius: var(--radius-surface-5);
10167
10184
  --callout-icon-height: var(--line-height-5);
10168
10185
  --callout-icon-size: var(--content-icon-size-5);
10169
10186
  }
@@ -10175,7 +10192,7 @@
10175
10192
  -moz-column-gap: var(--space-2);
10176
10193
  column-gap: var(--space-2);
10177
10194
  padding: var(--space-3);
10178
- --callout-border-radius: max(var(--radius-1), var(--radius-full));
10195
+ --callout-border-radius: var(--radius-surface-1);
10179
10196
  --callout-icon-height: var(--line-height-1);
10180
10197
  --callout-icon-size: var(--content-icon-size-1);
10181
10198
  }
@@ -10185,7 +10202,7 @@
10185
10202
  -moz-column-gap: var(--space-3);
10186
10203
  column-gap: var(--space-3);
10187
10204
  padding: var(--space-4);
10188
- --callout-border-radius: max(var(--radius-2), var(--radius-full));
10205
+ --callout-border-radius: var(--radius-surface-2);
10189
10206
  --callout-icon-height: var(--line-height-2);
10190
10207
  --callout-icon-size: var(--content-icon-size-2);
10191
10208
  }
@@ -10195,7 +10212,7 @@
10195
10212
  -moz-column-gap: var(--space-4);
10196
10213
  column-gap: var(--space-4);
10197
10214
  padding: var(--space-5);
10198
- --callout-border-radius: max(var(--radius-3), var(--radius-full));
10215
+ --callout-border-radius: var(--radius-surface-3);
10199
10216
  --callout-icon-height: var(--line-height-3);
10200
10217
  --callout-icon-size: var(--content-icon-size-3);
10201
10218
  }
@@ -10205,7 +10222,7 @@
10205
10222
  -moz-column-gap: var(--space-5);
10206
10223
  column-gap: var(--space-5);
10207
10224
  padding: var(--space-6);
10208
- --callout-border-radius: max(var(--radius-4), var(--radius-full));
10225
+ --callout-border-radius: var(--radius-surface-4);
10209
10226
  --callout-icon-height: var(--line-height-4);
10210
10227
  --callout-icon-size: var(--content-icon-size-4);
10211
10228
  }
@@ -10215,7 +10232,7 @@
10215
10232
  -moz-column-gap: var(--space-6);
10216
10233
  column-gap: var(--space-6);
10217
10234
  padding: var(--space-7);
10218
- --callout-border-radius: max(var(--radius-5), var(--radius-full));
10235
+ --callout-border-radius: var(--radius-surface-5);
10219
10236
  --callout-icon-height: var(--line-height-5);
10220
10237
  --callout-icon-size: var(--content-icon-size-5);
10221
10238
  }
@@ -10227,7 +10244,7 @@
10227
10244
  -moz-column-gap: var(--space-2);
10228
10245
  column-gap: var(--space-2);
10229
10246
  padding: var(--space-3);
10230
- --callout-border-radius: max(var(--radius-1), var(--radius-full));
10247
+ --callout-border-radius: var(--radius-surface-1);
10231
10248
  --callout-icon-height: var(--line-height-1);
10232
10249
  --callout-icon-size: var(--content-icon-size-1);
10233
10250
  }
@@ -10237,7 +10254,7 @@
10237
10254
  -moz-column-gap: var(--space-3);
10238
10255
  column-gap: var(--space-3);
10239
10256
  padding: var(--space-4);
10240
- --callout-border-radius: max(var(--radius-2), var(--radius-full));
10257
+ --callout-border-radius: var(--radius-surface-2);
10241
10258
  --callout-icon-height: var(--line-height-2);
10242
10259
  --callout-icon-size: var(--content-icon-size-2);
10243
10260
  }
@@ -10247,7 +10264,7 @@
10247
10264
  -moz-column-gap: var(--space-4);
10248
10265
  column-gap: var(--space-4);
10249
10266
  padding: var(--space-5);
10250
- --callout-border-radius: max(var(--radius-3), var(--radius-full));
10267
+ --callout-border-radius: var(--radius-surface-3);
10251
10268
  --callout-icon-height: var(--line-height-3);
10252
10269
  --callout-icon-size: var(--content-icon-size-3);
10253
10270
  }
@@ -10257,7 +10274,7 @@
10257
10274
  -moz-column-gap: var(--space-5);
10258
10275
  column-gap: var(--space-5);
10259
10276
  padding: var(--space-6);
10260
- --callout-border-radius: max(var(--radius-4), var(--radius-full));
10277
+ --callout-border-radius: var(--radius-surface-4);
10261
10278
  --callout-icon-height: var(--line-height-4);
10262
10279
  --callout-icon-size: var(--content-icon-size-4);
10263
10280
  }
@@ -10267,7 +10284,7 @@
10267
10284
  -moz-column-gap: var(--space-6);
10268
10285
  column-gap: var(--space-6);
10269
10286
  padding: var(--space-7);
10270
- --callout-border-radius: max(var(--radius-5), var(--radius-full));
10287
+ --callout-border-radius: var(--radius-surface-5);
10271
10288
  --callout-icon-height: var(--line-height-5);
10272
10289
  --callout-icon-size: var(--content-icon-size-5);
10273
10290
  }
@@ -10279,7 +10296,7 @@
10279
10296
  -moz-column-gap: var(--space-2);
10280
10297
  column-gap: var(--space-2);
10281
10298
  padding: var(--space-3);
10282
- --callout-border-radius: max(var(--radius-1), var(--radius-full));
10299
+ --callout-border-radius: var(--radius-surface-1);
10283
10300
  --callout-icon-height: var(--line-height-1);
10284
10301
  --callout-icon-size: var(--content-icon-size-1);
10285
10302
  }
@@ -10289,7 +10306,7 @@
10289
10306
  -moz-column-gap: var(--space-3);
10290
10307
  column-gap: var(--space-3);
10291
10308
  padding: var(--space-4);
10292
- --callout-border-radius: max(var(--radius-2), var(--radius-full));
10309
+ --callout-border-radius: var(--radius-surface-2);
10293
10310
  --callout-icon-height: var(--line-height-2);
10294
10311
  --callout-icon-size: var(--content-icon-size-2);
10295
10312
  }
@@ -10299,7 +10316,7 @@
10299
10316
  -moz-column-gap: var(--space-4);
10300
10317
  column-gap: var(--space-4);
10301
10318
  padding: var(--space-5);
10302
- --callout-border-radius: max(var(--radius-3), var(--radius-full));
10319
+ --callout-border-radius: var(--radius-surface-3);
10303
10320
  --callout-icon-height: var(--line-height-3);
10304
10321
  --callout-icon-size: var(--content-icon-size-3);
10305
10322
  }
@@ -10309,7 +10326,7 @@
10309
10326
  -moz-column-gap: var(--space-5);
10310
10327
  column-gap: var(--space-5);
10311
10328
  padding: var(--space-6);
10312
- --callout-border-radius: max(var(--radius-4), var(--radius-full));
10329
+ --callout-border-radius: var(--radius-surface-4);
10313
10330
  --callout-icon-height: var(--line-height-4);
10314
10331
  --callout-icon-size: var(--content-icon-size-4);
10315
10332
  }
@@ -10319,7 +10336,7 @@
10319
10336
  -moz-column-gap: var(--space-6);
10320
10337
  column-gap: var(--space-6);
10321
10338
  padding: var(--space-7);
10322
- --callout-border-radius: max(var(--radius-5), var(--radius-full));
10339
+ --callout-border-radius: var(--radius-surface-5);
10323
10340
  --callout-icon-height: var(--line-height-5);
10324
10341
  --callout-icon-size: var(--content-icon-size-5);
10325
10342
  }
@@ -10331,7 +10348,7 @@
10331
10348
  -moz-column-gap: var(--space-2);
10332
10349
  column-gap: var(--space-2);
10333
10350
  padding: var(--space-3);
10334
- --callout-border-radius: max(var(--radius-1), var(--radius-full));
10351
+ --callout-border-radius: var(--radius-surface-1);
10335
10352
  --callout-icon-height: var(--line-height-1);
10336
10353
  --callout-icon-size: var(--content-icon-size-1);
10337
10354
  }
@@ -10341,7 +10358,7 @@
10341
10358
  -moz-column-gap: var(--space-3);
10342
10359
  column-gap: var(--space-3);
10343
10360
  padding: var(--space-4);
10344
- --callout-border-radius: max(var(--radius-2), var(--radius-full));
10361
+ --callout-border-radius: var(--radius-surface-2);
10345
10362
  --callout-icon-height: var(--line-height-2);
10346
10363
  --callout-icon-size: var(--content-icon-size-2);
10347
10364
  }
@@ -10351,7 +10368,7 @@
10351
10368
  -moz-column-gap: var(--space-4);
10352
10369
  column-gap: var(--space-4);
10353
10370
  padding: var(--space-5);
10354
- --callout-border-radius: max(var(--radius-3), var(--radius-full));
10371
+ --callout-border-radius: var(--radius-surface-3);
10355
10372
  --callout-icon-height: var(--line-height-3);
10356
10373
  --callout-icon-size: var(--content-icon-size-3);
10357
10374
  }
@@ -10361,7 +10378,7 @@
10361
10378
  -moz-column-gap: var(--space-5);
10362
10379
  column-gap: var(--space-5);
10363
10380
  padding: var(--space-6);
10364
- --callout-border-radius: max(var(--radius-4), var(--radius-full));
10381
+ --callout-border-radius: var(--radius-surface-4);
10365
10382
  --callout-icon-height: var(--line-height-4);
10366
10383
  --callout-icon-size: var(--content-icon-size-4);
10367
10384
  }
@@ -10371,7 +10388,7 @@
10371
10388
  -moz-column-gap: var(--space-6);
10372
10389
  column-gap: var(--space-6);
10373
10390
  padding: var(--space-7);
10374
- --callout-border-radius: max(var(--radius-5), var(--radius-full));
10391
+ --callout-border-radius: var(--radius-surface-5);
10375
10392
  --callout-icon-height: var(--line-height-5);
10376
10393
  --callout-icon-size: var(--content-icon-size-5);
10377
10394
  }
@@ -10518,35 +10535,35 @@
10518
10535
  --base-card-padding-right: var(--space-2);
10519
10536
  --base-card-padding-bottom: var(--space-2);
10520
10537
  --base-card-padding-left: var(--space-2);
10521
- --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
10538
+ --base-card-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
10522
10539
  }
10523
10540
  .rt-BaseCard:where(.rt-r-size-2) {
10524
10541
  --base-card-padding-top: var(--space-3);
10525
10542
  --base-card-padding-right: var(--space-3);
10526
10543
  --base-card-padding-bottom: var(--space-3);
10527
10544
  --base-card-padding-left: var(--space-3);
10528
- --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
10545
+ --base-card-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
10529
10546
  }
10530
10547
  .rt-BaseCard:where(.rt-r-size-3) {
10531
10548
  --base-card-padding-top: var(--space-4);
10532
10549
  --base-card-padding-right: var(--space-4);
10533
10550
  --base-card-padding-bottom: var(--space-4);
10534
10551
  --base-card-padding-left: var(--space-4);
10535
- --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
10552
+ --base-card-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
10536
10553
  }
10537
10554
  .rt-BaseCard:where(.rt-r-size-4) {
10538
10555
  --base-card-padding-top: var(--space-5);
10539
10556
  --base-card-padding-right: var(--space-5);
10540
10557
  --base-card-padding-bottom: var(--space-5);
10541
10558
  --base-card-padding-left: var(--space-5);
10542
- --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
10559
+ --base-card-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
10543
10560
  }
10544
10561
  .rt-BaseCard:where(.rt-r-size-5) {
10545
10562
  --base-card-padding-top: var(--space-6);
10546
10563
  --base-card-padding-right: var(--space-6);
10547
10564
  --base-card-padding-bottom: var(--space-6);
10548
10565
  --base-card-padding-left: var(--space-6);
10549
- --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
10566
+ --base-card-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
10550
10567
  }
10551
10568
  @media (min-width: 520px) {
10552
10569
  .rt-BaseCard:where(.xs\:rt-r-size-1) {
@@ -10554,35 +10571,35 @@
10554
10571
  --base-card-padding-right: var(--space-2);
10555
10572
  --base-card-padding-bottom: var(--space-2);
10556
10573
  --base-card-padding-left: var(--space-2);
10557
- --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
10574
+ --base-card-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
10558
10575
  }
10559
10576
  .rt-BaseCard:where(.xs\:rt-r-size-2) {
10560
10577
  --base-card-padding-top: var(--space-3);
10561
10578
  --base-card-padding-right: var(--space-3);
10562
10579
  --base-card-padding-bottom: var(--space-3);
10563
10580
  --base-card-padding-left: var(--space-3);
10564
- --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
10581
+ --base-card-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
10565
10582
  }
10566
10583
  .rt-BaseCard:where(.xs\:rt-r-size-3) {
10567
10584
  --base-card-padding-top: var(--space-4);
10568
10585
  --base-card-padding-right: var(--space-4);
10569
10586
  --base-card-padding-bottom: var(--space-4);
10570
10587
  --base-card-padding-left: var(--space-4);
10571
- --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
10588
+ --base-card-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
10572
10589
  }
10573
10590
  .rt-BaseCard:where(.xs\:rt-r-size-4) {
10574
10591
  --base-card-padding-top: var(--space-5);
10575
10592
  --base-card-padding-right: var(--space-5);
10576
10593
  --base-card-padding-bottom: var(--space-5);
10577
10594
  --base-card-padding-left: var(--space-5);
10578
- --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
10595
+ --base-card-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
10579
10596
  }
10580
10597
  .rt-BaseCard:where(.xs\:rt-r-size-5) {
10581
10598
  --base-card-padding-top: var(--space-6);
10582
10599
  --base-card-padding-right: var(--space-6);
10583
10600
  --base-card-padding-bottom: var(--space-6);
10584
10601
  --base-card-padding-left: var(--space-6);
10585
- --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
10602
+ --base-card-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
10586
10603
  }
10587
10604
  }
10588
10605
  @media (min-width: 768px) {
@@ -10591,35 +10608,35 @@
10591
10608
  --base-card-padding-right: var(--space-2);
10592
10609
  --base-card-padding-bottom: var(--space-2);
10593
10610
  --base-card-padding-left: var(--space-2);
10594
- --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
10611
+ --base-card-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
10595
10612
  }
10596
10613
  .rt-BaseCard:where(.sm\:rt-r-size-2) {
10597
10614
  --base-card-padding-top: var(--space-3);
10598
10615
  --base-card-padding-right: var(--space-3);
10599
10616
  --base-card-padding-bottom: var(--space-3);
10600
10617
  --base-card-padding-left: var(--space-3);
10601
- --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
10618
+ --base-card-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
10602
10619
  }
10603
10620
  .rt-BaseCard:where(.sm\:rt-r-size-3) {
10604
10621
  --base-card-padding-top: var(--space-4);
10605
10622
  --base-card-padding-right: var(--space-4);
10606
10623
  --base-card-padding-bottom: var(--space-4);
10607
10624
  --base-card-padding-left: var(--space-4);
10608
- --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
10625
+ --base-card-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
10609
10626
  }
10610
10627
  .rt-BaseCard:where(.sm\:rt-r-size-4) {
10611
10628
  --base-card-padding-top: var(--space-5);
10612
10629
  --base-card-padding-right: var(--space-5);
10613
10630
  --base-card-padding-bottom: var(--space-5);
10614
10631
  --base-card-padding-left: var(--space-5);
10615
- --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
10632
+ --base-card-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
10616
10633
  }
10617
10634
  .rt-BaseCard:where(.sm\:rt-r-size-5) {
10618
10635
  --base-card-padding-top: var(--space-6);
10619
10636
  --base-card-padding-right: var(--space-6);
10620
10637
  --base-card-padding-bottom: var(--space-6);
10621
10638
  --base-card-padding-left: var(--space-6);
10622
- --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
10639
+ --base-card-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
10623
10640
  }
10624
10641
  }
10625
10642
  @media (min-width: 1024px) {
@@ -10628,35 +10645,35 @@
10628
10645
  --base-card-padding-right: var(--space-2);
10629
10646
  --base-card-padding-bottom: var(--space-2);
10630
10647
  --base-card-padding-left: var(--space-2);
10631
- --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
10648
+ --base-card-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
10632
10649
  }
10633
10650
  .rt-BaseCard:where(.md\:rt-r-size-2) {
10634
10651
  --base-card-padding-top: var(--space-3);
10635
10652
  --base-card-padding-right: var(--space-3);
10636
10653
  --base-card-padding-bottom: var(--space-3);
10637
10654
  --base-card-padding-left: var(--space-3);
10638
- --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
10655
+ --base-card-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
10639
10656
  }
10640
10657
  .rt-BaseCard:where(.md\:rt-r-size-3) {
10641
10658
  --base-card-padding-top: var(--space-4);
10642
10659
  --base-card-padding-right: var(--space-4);
10643
10660
  --base-card-padding-bottom: var(--space-4);
10644
10661
  --base-card-padding-left: var(--space-4);
10645
- --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
10662
+ --base-card-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
10646
10663
  }
10647
10664
  .rt-BaseCard:where(.md\:rt-r-size-4) {
10648
10665
  --base-card-padding-top: var(--space-5);
10649
10666
  --base-card-padding-right: var(--space-5);
10650
10667
  --base-card-padding-bottom: var(--space-5);
10651
10668
  --base-card-padding-left: var(--space-5);
10652
- --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
10669
+ --base-card-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
10653
10670
  }
10654
10671
  .rt-BaseCard:where(.md\:rt-r-size-5) {
10655
10672
  --base-card-padding-top: var(--space-6);
10656
10673
  --base-card-padding-right: var(--space-6);
10657
10674
  --base-card-padding-bottom: var(--space-6);
10658
10675
  --base-card-padding-left: var(--space-6);
10659
- --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
10676
+ --base-card-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
10660
10677
  }
10661
10678
  }
10662
10679
  @media (min-width: 1280px) {
@@ -10665,35 +10682,35 @@
10665
10682
  --base-card-padding-right: var(--space-2);
10666
10683
  --base-card-padding-bottom: var(--space-2);
10667
10684
  --base-card-padding-left: var(--space-2);
10668
- --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
10685
+ --base-card-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
10669
10686
  }
10670
10687
  .rt-BaseCard:where(.lg\:rt-r-size-2) {
10671
10688
  --base-card-padding-top: var(--space-3);
10672
10689
  --base-card-padding-right: var(--space-3);
10673
10690
  --base-card-padding-bottom: var(--space-3);
10674
10691
  --base-card-padding-left: var(--space-3);
10675
- --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
10692
+ --base-card-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
10676
10693
  }
10677
10694
  .rt-BaseCard:where(.lg\:rt-r-size-3) {
10678
10695
  --base-card-padding-top: var(--space-4);
10679
10696
  --base-card-padding-right: var(--space-4);
10680
10697
  --base-card-padding-bottom: var(--space-4);
10681
10698
  --base-card-padding-left: var(--space-4);
10682
- --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
10699
+ --base-card-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
10683
10700
  }
10684
10701
  .rt-BaseCard:where(.lg\:rt-r-size-4) {
10685
10702
  --base-card-padding-top: var(--space-5);
10686
10703
  --base-card-padding-right: var(--space-5);
10687
10704
  --base-card-padding-bottom: var(--space-5);
10688
10705
  --base-card-padding-left: var(--space-5);
10689
- --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
10706
+ --base-card-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
10690
10707
  }
10691
10708
  .rt-BaseCard:where(.lg\:rt-r-size-5) {
10692
10709
  --base-card-padding-top: var(--space-6);
10693
10710
  --base-card-padding-right: var(--space-6);
10694
10711
  --base-card-padding-bottom: var(--space-6);
10695
10712
  --base-card-padding-left: var(--space-6);
10696
- --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
10713
+ --base-card-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
10697
10714
  }
10698
10715
  }
10699
10716
  @media (min-width: 1640px) {
@@ -10702,35 +10719,35 @@
10702
10719
  --base-card-padding-right: var(--space-2);
10703
10720
  --base-card-padding-bottom: var(--space-2);
10704
10721
  --base-card-padding-left: var(--space-2);
10705
- --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
10722
+ --base-card-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
10706
10723
  }
10707
10724
  .rt-BaseCard:where(.xl\:rt-r-size-2) {
10708
10725
  --base-card-padding-top: var(--space-3);
10709
10726
  --base-card-padding-right: var(--space-3);
10710
10727
  --base-card-padding-bottom: var(--space-3);
10711
10728
  --base-card-padding-left: var(--space-3);
10712
- --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
10729
+ --base-card-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
10713
10730
  }
10714
10731
  .rt-BaseCard:where(.xl\:rt-r-size-3) {
10715
10732
  --base-card-padding-top: var(--space-4);
10716
10733
  --base-card-padding-right: var(--space-4);
10717
10734
  --base-card-padding-bottom: var(--space-4);
10718
10735
  --base-card-padding-left: var(--space-4);
10719
- --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
10736
+ --base-card-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
10720
10737
  }
10721
10738
  .rt-BaseCard:where(.xl\:rt-r-size-4) {
10722
10739
  --base-card-padding-top: var(--space-5);
10723
10740
  --base-card-padding-right: var(--space-5);
10724
10741
  --base-card-padding-bottom: var(--space-5);
10725
10742
  --base-card-padding-left: var(--space-5);
10726
- --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
10743
+ --base-card-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
10727
10744
  }
10728
10745
  .rt-BaseCard:where(.xl\:rt-r-size-5) {
10729
10746
  --base-card-padding-top: var(--space-6);
10730
10747
  --base-card-padding-right: var(--space-6);
10731
10748
  --base-card-padding-bottom: var(--space-6);
10732
10749
  --base-card-padding-left: var(--space-6);
10733
- --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
10750
+ --base-card-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
10734
10751
  }
10735
10752
  }
10736
10753
  .rt-BaseCard:where([data-inset='true']) {
@@ -11104,6 +11121,8 @@
11104
11121
  --skeleton-height-override: var(--checkbox-size);
11105
11122
  border-radius: var(--skeleton-radius);
11106
11123
  --skeleton-radius-override: var(--checkbox-border-radius);
11124
+ --checkbox-radius-ratio-max: 0.4;
11125
+ --checkbox-radius-max: calc(var(--checkbox-size) * var(--checkbox-radius-ratio-max));
11107
11126
  isolation: isolate;
11108
11127
  }
11109
11128
  :where([data-panel-background='translucent'],[data-material='translucent']) .rt-BaseCheckboxRoot {
@@ -11147,101 +11166,101 @@
11147
11166
  .rt-BaseCheckboxRoot:where(.rt-r-size-1) {
11148
11167
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-medium));
11149
11168
  --checkbox-indicator-size: var(--indicator-icon-size-1);
11150
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-small));
11169
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-small)), var(--checkbox-radius-max));
11151
11170
  }
11152
11171
  .rt-BaseCheckboxRoot:where(.rt-r-size-2) {
11153
11172
  --checkbox-size: var(--space-4);
11154
11173
  --checkbox-indicator-size: var(--indicator-icon-size-2);
11155
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11174
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11156
11175
  }
11157
11176
  .rt-BaseCheckboxRoot:where(.rt-r-size-3) {
11158
11177
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-large));
11159
11178
  --checkbox-indicator-size: var(--indicator-icon-size-3);
11160
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11179
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11161
11180
  }
11162
11181
  @media (min-width: 520px) {
11163
11182
  .rt-BaseCheckboxRoot:where(.xs\:rt-r-size-1) {
11164
11183
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-medium));
11165
11184
  --checkbox-indicator-size: var(--indicator-icon-size-1);
11166
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-small));
11185
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-small)), var(--checkbox-radius-max));
11167
11186
  }
11168
11187
  .rt-BaseCheckboxRoot:where(.xs\:rt-r-size-2) {
11169
11188
  --checkbox-size: var(--space-4);
11170
11189
  --checkbox-indicator-size: var(--indicator-icon-size-2);
11171
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11190
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11172
11191
  }
11173
11192
  .rt-BaseCheckboxRoot:where(.xs\:rt-r-size-3) {
11174
11193
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-large));
11175
11194
  --checkbox-indicator-size: var(--indicator-icon-size-3);
11176
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11195
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11177
11196
  }
11178
11197
  }
11179
11198
  @media (min-width: 768px) {
11180
11199
  .rt-BaseCheckboxRoot:where(.sm\:rt-r-size-1) {
11181
11200
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-medium));
11182
11201
  --checkbox-indicator-size: var(--indicator-icon-size-1);
11183
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-small));
11202
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-small)), var(--checkbox-radius-max));
11184
11203
  }
11185
11204
  .rt-BaseCheckboxRoot:where(.sm\:rt-r-size-2) {
11186
11205
  --checkbox-size: var(--space-4);
11187
11206
  --checkbox-indicator-size: var(--indicator-icon-size-2);
11188
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11207
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11189
11208
  }
11190
11209
  .rt-BaseCheckboxRoot:where(.sm\:rt-r-size-3) {
11191
11210
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-large));
11192
11211
  --checkbox-indicator-size: var(--indicator-icon-size-3);
11193
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11212
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11194
11213
  }
11195
11214
  }
11196
11215
  @media (min-width: 1024px) {
11197
11216
  .rt-BaseCheckboxRoot:where(.md\:rt-r-size-1) {
11198
11217
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-medium));
11199
11218
  --checkbox-indicator-size: var(--indicator-icon-size-1);
11200
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-small));
11219
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-small)), var(--checkbox-radius-max));
11201
11220
  }
11202
11221
  .rt-BaseCheckboxRoot:where(.md\:rt-r-size-2) {
11203
11222
  --checkbox-size: var(--space-4);
11204
11223
  --checkbox-indicator-size: var(--indicator-icon-size-2);
11205
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11224
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11206
11225
  }
11207
11226
  .rt-BaseCheckboxRoot:where(.md\:rt-r-size-3) {
11208
11227
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-large));
11209
11228
  --checkbox-indicator-size: var(--indicator-icon-size-3);
11210
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11229
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11211
11230
  }
11212
11231
  }
11213
11232
  @media (min-width: 1280px) {
11214
11233
  .rt-BaseCheckboxRoot:where(.lg\:rt-r-size-1) {
11215
11234
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-medium));
11216
11235
  --checkbox-indicator-size: var(--indicator-icon-size-1);
11217
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-small));
11236
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-small)), var(--checkbox-radius-max));
11218
11237
  }
11219
11238
  .rt-BaseCheckboxRoot:where(.lg\:rt-r-size-2) {
11220
11239
  --checkbox-size: var(--space-4);
11221
11240
  --checkbox-indicator-size: var(--indicator-icon-size-2);
11222
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11241
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11223
11242
  }
11224
11243
  .rt-BaseCheckboxRoot:where(.lg\:rt-r-size-3) {
11225
11244
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-large));
11226
11245
  --checkbox-indicator-size: var(--indicator-icon-size-3);
11227
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11246
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11228
11247
  }
11229
11248
  }
11230
11249
  @media (min-width: 1640px) {
11231
11250
  .rt-BaseCheckboxRoot:where(.xl\:rt-r-size-1) {
11232
11251
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-medium));
11233
11252
  --checkbox-indicator-size: var(--indicator-icon-size-1);
11234
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-small));
11253
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-small)), var(--checkbox-radius-max));
11235
11254
  }
11236
11255
  .rt-BaseCheckboxRoot:where(.xl\:rt-r-size-2) {
11237
11256
  --checkbox-size: var(--space-4);
11238
11257
  --checkbox-indicator-size: var(--indicator-icon-size-2);
11239
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11258
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11240
11259
  }
11241
11260
  .rt-BaseCheckboxRoot:where(.xl\:rt-r-size-3) {
11242
11261
  --checkbox-size: calc(var(--space-4) * var(--spacing-multiplier-large));
11243
11262
  --checkbox-indicator-size: var(--indicator-icon-size-3);
11244
- --checkbox-border-radius: calc(var(--radius-1) * var(--spacing-multiplier-medium));
11263
+ --checkbox-border-radius: min(calc(var(--radius-1) * var(--spacing-multiplier-medium)), var(--checkbox-radius-max));
11245
11264
  }
11246
11265
  }
11247
11266
  .rt-BaseCheckboxRoot:where(.rt-variant-solid):where([data-state='unchecked'])::before {
@@ -11730,6 +11749,106 @@
11730
11749
  .rt-CheckboxCardsItem:where(:has(:disabled))::selection {
11731
11750
  background-color: var(--gray-a5);
11732
11751
  }
11752
+ .rt-CheckboxCardsItem:where(.rt-r-size-1) {
11753
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
11754
+ }
11755
+ .rt-CheckboxCardsItem:where(.rt-r-size-2) {
11756
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
11757
+ }
11758
+ .rt-CheckboxCardsItem:where(.rt-r-size-3) {
11759
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
11760
+ }
11761
+ .rt-CheckboxCardsItem:where(.rt-r-size-4) {
11762
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
11763
+ }
11764
+ .rt-CheckboxCardsItem:where(.rt-r-size-5) {
11765
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
11766
+ }
11767
+ @media (min-width: 520px) {
11768
+ .rt-CheckboxCardsItem:where(.xs\:rt-r-size-1) {
11769
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
11770
+ }
11771
+ .rt-CheckboxCardsItem:where(.xs\:rt-r-size-2) {
11772
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
11773
+ }
11774
+ .rt-CheckboxCardsItem:where(.xs\:rt-r-size-3) {
11775
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
11776
+ }
11777
+ .rt-CheckboxCardsItem:where(.xs\:rt-r-size-4) {
11778
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
11779
+ }
11780
+ .rt-CheckboxCardsItem:where(.xs\:rt-r-size-5) {
11781
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
11782
+ }
11783
+ }
11784
+ @media (min-width: 768px) {
11785
+ .rt-CheckboxCardsItem:where(.sm\:rt-r-size-1) {
11786
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
11787
+ }
11788
+ .rt-CheckboxCardsItem:where(.sm\:rt-r-size-2) {
11789
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
11790
+ }
11791
+ .rt-CheckboxCardsItem:where(.sm\:rt-r-size-3) {
11792
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
11793
+ }
11794
+ .rt-CheckboxCardsItem:where(.sm\:rt-r-size-4) {
11795
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
11796
+ }
11797
+ .rt-CheckboxCardsItem:where(.sm\:rt-r-size-5) {
11798
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
11799
+ }
11800
+ }
11801
+ @media (min-width: 1024px) {
11802
+ .rt-CheckboxCardsItem:where(.md\:rt-r-size-1) {
11803
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
11804
+ }
11805
+ .rt-CheckboxCardsItem:where(.md\:rt-r-size-2) {
11806
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
11807
+ }
11808
+ .rt-CheckboxCardsItem:where(.md\:rt-r-size-3) {
11809
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
11810
+ }
11811
+ .rt-CheckboxCardsItem:where(.md\:rt-r-size-4) {
11812
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
11813
+ }
11814
+ .rt-CheckboxCardsItem:where(.md\:rt-r-size-5) {
11815
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
11816
+ }
11817
+ }
11818
+ @media (min-width: 1280px) {
11819
+ .rt-CheckboxCardsItem:where(.lg\:rt-r-size-1) {
11820
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
11821
+ }
11822
+ .rt-CheckboxCardsItem:where(.lg\:rt-r-size-2) {
11823
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
11824
+ }
11825
+ .rt-CheckboxCardsItem:where(.lg\:rt-r-size-3) {
11826
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
11827
+ }
11828
+ .rt-CheckboxCardsItem:where(.lg\:rt-r-size-4) {
11829
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
11830
+ }
11831
+ .rt-CheckboxCardsItem:where(.lg\:rt-r-size-5) {
11832
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
11833
+ }
11834
+ }
11835
+ @media (min-width: 1640px) {
11836
+ .rt-CheckboxCardsItem:where(.xl\:rt-r-size-1) {
11837
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
11838
+ }
11839
+ .rt-CheckboxCardsItem:where(.xl\:rt-r-size-2) {
11840
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
11841
+ }
11842
+ .rt-CheckboxCardsItem:where(.xl\:rt-r-size-3) {
11843
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
11844
+ }
11845
+ .rt-CheckboxCardsItem:where(.xl\:rt-r-size-4) {
11846
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
11847
+ }
11848
+ .rt-CheckboxCardsItem:where(.xl\:rt-r-size-5) {
11849
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
11850
+ }
11851
+ }
11733
11852
  .rt-CheckboxGroupRoot {
11734
11853
  display: -webkit-box;
11735
11854
  display: -ms-flexbox;
@@ -12365,7 +12484,7 @@
12365
12484
  --base-menu-item-padding-right: var(--space-2);
12366
12485
  --base-menu-item-padding-y: var(--space-1);
12367
12486
  --base-menu-item-height: var(--space-5);
12368
- border-radius: var(--radius-3);
12487
+ border-radius: var(--radius-surface-3);
12369
12488
  }
12370
12489
  .rt-BaseMenuContent:where(.rt-r-size-1) :where(.rt-BaseMenuItem) {
12371
12490
  gap: var(--component-gap-2);
@@ -12403,7 +12522,7 @@
12403
12522
  --base-menu-item-padding-right: var(--space-3);
12404
12523
  --base-menu-item-padding-y: var(--space-1);
12405
12524
  --base-menu-item-height: var(--space-6);
12406
- border-radius: var(--radius-5);
12525
+ border-radius: var(--radius-surface-5);
12407
12526
  }
12408
12527
  .rt-BaseMenuContent:where(.rt-r-size-2) :where(.rt-BaseMenuItem) {
12409
12528
  gap: var(--component-gap-3);
@@ -12440,7 +12559,7 @@
12440
12559
  --base-menu-item-padding-right: var(--space-3);
12441
12560
  --base-menu-item-padding-y: var(--space-2);
12442
12561
  --base-menu-item-height: var(--space-7);
12443
- border-radius: var(--radius-6);
12562
+ border-radius: var(--radius-surface-6);
12444
12563
  }
12445
12564
  .rt-BaseMenuContent:where(.rt-r-size-3) :where(.rt-BaseMenuItem) {
12446
12565
  gap: var(--component-gap-4);
@@ -12478,7 +12597,7 @@
12478
12597
  --base-menu-item-padding-right: var(--space-2);
12479
12598
  --base-menu-item-padding-y: var(--space-1);
12480
12599
  --base-menu-item-height: var(--space-5);
12481
- border-radius: var(--radius-3);
12600
+ border-radius: var(--radius-surface-3);
12482
12601
  }
12483
12602
  .rt-BaseMenuContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuItem) {
12484
12603
  gap: var(--component-gap-2);
@@ -12516,7 +12635,7 @@
12516
12635
  --base-menu-item-padding-right: var(--space-3);
12517
12636
  --base-menu-item-padding-y: var(--space-1);
12518
12637
  --base-menu-item-height: var(--space-6);
12519
- border-radius: var(--radius-5);
12638
+ border-radius: var(--radius-surface-5);
12520
12639
  }
12521
12640
  .rt-BaseMenuContent:where(.xs\:rt-r-size-2) :where(.rt-BaseMenuItem) {
12522
12641
  gap: var(--component-gap-3);
@@ -12553,7 +12672,7 @@
12553
12672
  --base-menu-item-padding-right: var(--space-3);
12554
12673
  --base-menu-item-padding-y: var(--space-2);
12555
12674
  --base-menu-item-height: var(--space-7);
12556
- border-radius: var(--radius-6);
12675
+ border-radius: var(--radius-surface-6);
12557
12676
  }
12558
12677
  .rt-BaseMenuContent:where(.xs\:rt-r-size-3) :where(.rt-BaseMenuItem) {
12559
12678
  gap: var(--component-gap-4);
@@ -12592,7 +12711,7 @@
12592
12711
  --base-menu-item-padding-right: var(--space-2);
12593
12712
  --base-menu-item-padding-y: var(--space-1);
12594
12713
  --base-menu-item-height: var(--space-5);
12595
- border-radius: var(--radius-3);
12714
+ border-radius: var(--radius-surface-3);
12596
12715
  }
12597
12716
  .rt-BaseMenuContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuItem) {
12598
12717
  gap: var(--component-gap-2);
@@ -12630,7 +12749,7 @@
12630
12749
  --base-menu-item-padding-right: var(--space-3);
12631
12750
  --base-menu-item-padding-y: var(--space-1);
12632
12751
  --base-menu-item-height: var(--space-6);
12633
- border-radius: var(--radius-5);
12752
+ border-radius: var(--radius-surface-5);
12634
12753
  }
12635
12754
  .rt-BaseMenuContent:where(.sm\:rt-r-size-2) :where(.rt-BaseMenuItem) {
12636
12755
  gap: var(--component-gap-3);
@@ -12667,7 +12786,7 @@
12667
12786
  --base-menu-item-padding-right: var(--space-3);
12668
12787
  --base-menu-item-padding-y: var(--space-2);
12669
12788
  --base-menu-item-height: var(--space-7);
12670
- border-radius: var(--radius-6);
12789
+ border-radius: var(--radius-surface-6);
12671
12790
  }
12672
12791
  .rt-BaseMenuContent:where(.sm\:rt-r-size-3) :where(.rt-BaseMenuItem) {
12673
12792
  gap: var(--component-gap-4);
@@ -12706,7 +12825,7 @@
12706
12825
  --base-menu-item-padding-right: var(--space-2);
12707
12826
  --base-menu-item-padding-y: var(--space-1);
12708
12827
  --base-menu-item-height: var(--space-5);
12709
- border-radius: var(--radius-3);
12828
+ border-radius: var(--radius-surface-3);
12710
12829
  }
12711
12830
  .rt-BaseMenuContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuItem) {
12712
12831
  gap: var(--component-gap-2);
@@ -12744,7 +12863,7 @@
12744
12863
  --base-menu-item-padding-right: var(--space-3);
12745
12864
  --base-menu-item-padding-y: var(--space-1);
12746
12865
  --base-menu-item-height: var(--space-6);
12747
- border-radius: var(--radius-5);
12866
+ border-radius: var(--radius-surface-5);
12748
12867
  }
12749
12868
  .rt-BaseMenuContent:where(.md\:rt-r-size-2) :where(.rt-BaseMenuItem) {
12750
12869
  gap: var(--component-gap-3);
@@ -12781,7 +12900,7 @@
12781
12900
  --base-menu-item-padding-right: var(--space-3);
12782
12901
  --base-menu-item-padding-y: var(--space-2);
12783
12902
  --base-menu-item-height: var(--space-7);
12784
- border-radius: var(--radius-6);
12903
+ border-radius: var(--radius-surface-6);
12785
12904
  }
12786
12905
  .rt-BaseMenuContent:where(.md\:rt-r-size-3) :where(.rt-BaseMenuItem) {
12787
12906
  gap: var(--component-gap-4);
@@ -12820,7 +12939,7 @@
12820
12939
  --base-menu-item-padding-right: var(--space-2);
12821
12940
  --base-menu-item-padding-y: var(--space-1);
12822
12941
  --base-menu-item-height: var(--space-5);
12823
- border-radius: var(--radius-3);
12942
+ border-radius: var(--radius-surface-3);
12824
12943
  }
12825
12944
  .rt-BaseMenuContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuItem) {
12826
12945
  gap: var(--component-gap-2);
@@ -12858,7 +12977,7 @@
12858
12977
  --base-menu-item-padding-right: var(--space-3);
12859
12978
  --base-menu-item-padding-y: var(--space-1);
12860
12979
  --base-menu-item-height: var(--space-6);
12861
- border-radius: var(--radius-5);
12980
+ border-radius: var(--radius-surface-5);
12862
12981
  }
12863
12982
  .rt-BaseMenuContent:where(.lg\:rt-r-size-2) :where(.rt-BaseMenuItem) {
12864
12983
  gap: var(--component-gap-3);
@@ -12895,7 +13014,7 @@
12895
13014
  --base-menu-item-padding-right: var(--space-3);
12896
13015
  --base-menu-item-padding-y: var(--space-2);
12897
13016
  --base-menu-item-height: var(--space-7);
12898
- border-radius: var(--radius-6);
13017
+ border-radius: var(--radius-surface-6);
12899
13018
  }
12900
13019
  .rt-BaseMenuContent:where(.lg\:rt-r-size-3) :where(.rt-BaseMenuItem) {
12901
13020
  gap: var(--component-gap-4);
@@ -12934,7 +13053,7 @@
12934
13053
  --base-menu-item-padding-right: var(--space-2);
12935
13054
  --base-menu-item-padding-y: var(--space-1);
12936
13055
  --base-menu-item-height: var(--space-5);
12937
- border-radius: var(--radius-3);
13056
+ border-radius: var(--radius-surface-3);
12938
13057
  }
12939
13058
  .rt-BaseMenuContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuItem) {
12940
13059
  gap: var(--component-gap-2);
@@ -12972,7 +13091,7 @@
12972
13091
  --base-menu-item-padding-right: var(--space-3);
12973
13092
  --base-menu-item-padding-y: var(--space-1);
12974
13093
  --base-menu-item-height: var(--space-6);
12975
- border-radius: var(--radius-5);
13094
+ border-radius: var(--radius-surface-5);
12976
13095
  }
12977
13096
  .rt-BaseMenuContent:where(.xl\:rt-r-size-2) :where(.rt-BaseMenuItem) {
12978
13097
  gap: var(--component-gap-3);
@@ -13009,7 +13128,7 @@
13009
13128
  --base-menu-item-padding-right: var(--space-3);
13010
13129
  --base-menu-item-padding-y: var(--space-2);
13011
13130
  --base-menu-item-height: var(--space-7);
13012
- border-radius: var(--radius-6);
13131
+ border-radius: var(--radius-surface-6);
13013
13132
  }
13014
13133
  .rt-BaseMenuContent:where(.xl\:rt-r-size-3) :where(.rt-BaseMenuItem) {
13015
13134
  gap: var(--component-gap-4);
@@ -15921,84 +16040,84 @@
15921
16040
  }
15922
16041
  .rt-HoverCardContent:where(.rt-r-size-1) {
15923
16042
  --hover-card-content-padding: var(--space-3);
15924
- border-radius: var(--radius-4);
16043
+ border-radius: var(--radius-surface-4);
15925
16044
  }
15926
16045
  .rt-HoverCardContent:where(.rt-r-size-2) {
15927
16046
  --hover-card-content-padding: var(--space-4);
15928
- border-radius: var(--radius-4);
16047
+ border-radius: var(--radius-surface-4);
15929
16048
  }
15930
16049
  .rt-HoverCardContent:where(.rt-r-size-3) {
15931
16050
  --hover-card-content-padding: var(--space-5);
15932
- border-radius: var(--radius-5);
16051
+ border-radius: var(--radius-surface-5);
15933
16052
  }
15934
16053
  @media (min-width: 520px) {
15935
16054
  .rt-HoverCardContent:where(.xs\:rt-r-size-1) {
15936
16055
  --hover-card-content-padding: var(--space-3);
15937
- border-radius: var(--radius-4);
16056
+ border-radius: var(--radius-surface-4);
15938
16057
  }
15939
16058
  .rt-HoverCardContent:where(.xs\:rt-r-size-2) {
15940
16059
  --hover-card-content-padding: var(--space-4);
15941
- border-radius: var(--radius-4);
16060
+ border-radius: var(--radius-surface-4);
15942
16061
  }
15943
16062
  .rt-HoverCardContent:where(.xs\:rt-r-size-3) {
15944
16063
  --hover-card-content-padding: var(--space-5);
15945
- border-radius: var(--radius-5);
16064
+ border-radius: var(--radius-surface-5);
15946
16065
  }
15947
16066
  }
15948
16067
  @media (min-width: 768px) {
15949
16068
  .rt-HoverCardContent:where(.sm\:rt-r-size-1) {
15950
16069
  --hover-card-content-padding: var(--space-3);
15951
- border-radius: var(--radius-4);
16070
+ border-radius: var(--radius-surface-4);
15952
16071
  }
15953
16072
  .rt-HoverCardContent:where(.sm\:rt-r-size-2) {
15954
16073
  --hover-card-content-padding: var(--space-4);
15955
- border-radius: var(--radius-4);
16074
+ border-radius: var(--radius-surface-4);
15956
16075
  }
15957
16076
  .rt-HoverCardContent:where(.sm\:rt-r-size-3) {
15958
16077
  --hover-card-content-padding: var(--space-5);
15959
- border-radius: var(--radius-5);
16078
+ border-radius: var(--radius-surface-5);
15960
16079
  }
15961
16080
  }
15962
16081
  @media (min-width: 1024px) {
15963
16082
  .rt-HoverCardContent:where(.md\:rt-r-size-1) {
15964
16083
  --hover-card-content-padding: var(--space-3);
15965
- border-radius: var(--radius-4);
16084
+ border-radius: var(--radius-surface-4);
15966
16085
  }
15967
16086
  .rt-HoverCardContent:where(.md\:rt-r-size-2) {
15968
16087
  --hover-card-content-padding: var(--space-4);
15969
- border-radius: var(--radius-4);
16088
+ border-radius: var(--radius-surface-4);
15970
16089
  }
15971
16090
  .rt-HoverCardContent:where(.md\:rt-r-size-3) {
15972
16091
  --hover-card-content-padding: var(--space-5);
15973
- border-radius: var(--radius-5);
16092
+ border-radius: var(--radius-surface-5);
15974
16093
  }
15975
16094
  }
15976
16095
  @media (min-width: 1280px) {
15977
16096
  .rt-HoverCardContent:where(.lg\:rt-r-size-1) {
15978
16097
  --hover-card-content-padding: var(--space-3);
15979
- border-radius: var(--radius-4);
16098
+ border-radius: var(--radius-surface-4);
15980
16099
  }
15981
16100
  .rt-HoverCardContent:where(.lg\:rt-r-size-2) {
15982
16101
  --hover-card-content-padding: var(--space-4);
15983
- border-radius: var(--radius-4);
16102
+ border-radius: var(--radius-surface-4);
15984
16103
  }
15985
16104
  .rt-HoverCardContent:where(.lg\:rt-r-size-3) {
15986
16105
  --hover-card-content-padding: var(--space-5);
15987
- border-radius: var(--radius-5);
16106
+ border-radius: var(--radius-surface-5);
15988
16107
  }
15989
16108
  }
15990
16109
  @media (min-width: 1640px) {
15991
16110
  .rt-HoverCardContent:where(.xl\:rt-r-size-1) {
15992
16111
  --hover-card-content-padding: var(--space-3);
15993
- border-radius: var(--radius-4);
16112
+ border-radius: var(--radius-surface-4);
15994
16113
  }
15995
16114
  .rt-HoverCardContent:where(.xl\:rt-r-size-2) {
15996
16115
  --hover-card-content-padding: var(--space-4);
15997
- border-radius: var(--radius-4);
16116
+ border-radius: var(--radius-surface-4);
15998
16117
  }
15999
16118
  .rt-HoverCardContent:where(.xl\:rt-r-size-3) {
16000
16119
  --hover-card-content-padding: var(--space-5);
16001
- border-radius: var(--radius-5);
16120
+ border-radius: var(--radius-surface-5);
16002
16121
  }
16003
16122
  }
16004
16123
  .rt-IconButton {
@@ -17660,131 +17779,131 @@
17660
17779
  .rt-PopoverContent:where(.rt-r-size-1) {
17661
17780
  --popover-content-padding: var(--space-3);
17662
17781
  --popover-toolbar-padding: var(--space-2);
17663
- border-radius: min(var(--radius-3), calc(var(--radius-1) + var(--space-2)));
17782
+ border-radius: min(var(--radius-surface-3), calc(var(--radius-surface-1) + var(--space-2)));
17664
17783
  }
17665
17784
  .rt-PopoverContent:where(.rt-r-size-2) {
17666
17785
  --popover-content-padding: var(--space-4);
17667
17786
  --popover-toolbar-padding: var(--space-2);
17668
- border-radius: min(var(--radius-4), calc(var(--radius-2) + var(--space-3)));
17787
+ border-radius: min(var(--radius-surface-4), calc(var(--radius-surface-2) + var(--space-3)));
17669
17788
  }
17670
17789
  .rt-PopoverContent:where(.rt-r-size-3) {
17671
17790
  --popover-content-padding: var(--space-5);
17672
17791
  --popover-toolbar-padding: var(--space-3);
17673
- border-radius: min(var(--radius-5), calc(var(--radius-3) + var(--space-4)));
17792
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-3) + var(--space-4)));
17674
17793
  }
17675
17794
  .rt-PopoverContent:where(.rt-r-size-4) {
17676
17795
  --popover-content-padding: var(--space-6);
17677
17796
  --popover-toolbar-padding: var(--space-4);
17678
- border-radius: min(var(--radius-6), calc(var(--radius-4) + var(--space-5)));
17797
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-4) + var(--space-5)));
17679
17798
  }
17680
17799
  @media (min-width: 520px) {
17681
17800
  .rt-PopoverContent:where(.xs\:rt-r-size-1) {
17682
17801
  --popover-content-padding: var(--space-3);
17683
17802
  --popover-toolbar-padding: var(--space-2);
17684
- border-radius: min(var(--radius-3), calc(var(--radius-1) + var(--space-2)));
17803
+ border-radius: min(var(--radius-surface-3), calc(var(--radius-surface-1) + var(--space-2)));
17685
17804
  }
17686
17805
  .rt-PopoverContent:where(.xs\:rt-r-size-2) {
17687
17806
  --popover-content-padding: var(--space-4);
17688
17807
  --popover-toolbar-padding: var(--space-2);
17689
- border-radius: min(var(--radius-4), calc(var(--radius-2) + var(--space-3)));
17808
+ border-radius: min(var(--radius-surface-4), calc(var(--radius-surface-2) + var(--space-3)));
17690
17809
  }
17691
17810
  .rt-PopoverContent:where(.xs\:rt-r-size-3) {
17692
17811
  --popover-content-padding: var(--space-5);
17693
17812
  --popover-toolbar-padding: var(--space-3);
17694
- border-radius: min(var(--radius-5), calc(var(--radius-3) + var(--space-4)));
17813
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-3) + var(--space-4)));
17695
17814
  }
17696
17815
  .rt-PopoverContent:where(.xs\:rt-r-size-4) {
17697
17816
  --popover-content-padding: var(--space-6);
17698
17817
  --popover-toolbar-padding: var(--space-4);
17699
- border-radius: min(var(--radius-6), calc(var(--radius-4) + var(--space-5)));
17818
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-4) + var(--space-5)));
17700
17819
  }
17701
17820
  }
17702
17821
  @media (min-width: 768px) {
17703
17822
  .rt-PopoverContent:where(.sm\:rt-r-size-1) {
17704
17823
  --popover-content-padding: var(--space-3);
17705
17824
  --popover-toolbar-padding: var(--space-2);
17706
- border-radius: min(var(--radius-3), calc(var(--radius-1) + var(--space-2)));
17825
+ border-radius: min(var(--radius-surface-3), calc(var(--radius-surface-1) + var(--space-2)));
17707
17826
  }
17708
17827
  .rt-PopoverContent:where(.sm\:rt-r-size-2) {
17709
17828
  --popover-content-padding: var(--space-4);
17710
17829
  --popover-toolbar-padding: var(--space-2);
17711
- border-radius: min(var(--radius-4), calc(var(--radius-2) + var(--space-3)));
17830
+ border-radius: min(var(--radius-surface-4), calc(var(--radius-surface-2) + var(--space-3)));
17712
17831
  }
17713
17832
  .rt-PopoverContent:where(.sm\:rt-r-size-3) {
17714
17833
  --popover-content-padding: var(--space-5);
17715
17834
  --popover-toolbar-padding: var(--space-3);
17716
- border-radius: min(var(--radius-5), calc(var(--radius-3) + var(--space-4)));
17835
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-3) + var(--space-4)));
17717
17836
  }
17718
17837
  .rt-PopoverContent:where(.sm\:rt-r-size-4) {
17719
17838
  --popover-content-padding: var(--space-6);
17720
17839
  --popover-toolbar-padding: var(--space-4);
17721
- border-radius: min(var(--radius-6), calc(var(--radius-4) + var(--space-5)));
17840
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-4) + var(--space-5)));
17722
17841
  }
17723
17842
  }
17724
17843
  @media (min-width: 1024px) {
17725
17844
  .rt-PopoverContent:where(.md\:rt-r-size-1) {
17726
17845
  --popover-content-padding: var(--space-3);
17727
17846
  --popover-toolbar-padding: var(--space-2);
17728
- border-radius: min(var(--radius-3), calc(var(--radius-1) + var(--space-2)));
17847
+ border-radius: min(var(--radius-surface-3), calc(var(--radius-surface-1) + var(--space-2)));
17729
17848
  }
17730
17849
  .rt-PopoverContent:where(.md\:rt-r-size-2) {
17731
17850
  --popover-content-padding: var(--space-4);
17732
17851
  --popover-toolbar-padding: var(--space-2);
17733
- border-radius: min(var(--radius-4), calc(var(--radius-2) + var(--space-3)));
17852
+ border-radius: min(var(--radius-surface-4), calc(var(--radius-surface-2) + var(--space-3)));
17734
17853
  }
17735
17854
  .rt-PopoverContent:where(.md\:rt-r-size-3) {
17736
17855
  --popover-content-padding: var(--space-5);
17737
17856
  --popover-toolbar-padding: var(--space-3);
17738
- border-radius: min(var(--radius-5), calc(var(--radius-3) + var(--space-4)));
17857
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-3) + var(--space-4)));
17739
17858
  }
17740
17859
  .rt-PopoverContent:where(.md\:rt-r-size-4) {
17741
17860
  --popover-content-padding: var(--space-6);
17742
17861
  --popover-toolbar-padding: var(--space-4);
17743
- border-radius: min(var(--radius-6), calc(var(--radius-4) + var(--space-5)));
17862
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-4) + var(--space-5)));
17744
17863
  }
17745
17864
  }
17746
17865
  @media (min-width: 1280px) {
17747
17866
  .rt-PopoverContent:where(.lg\:rt-r-size-1) {
17748
17867
  --popover-content-padding: var(--space-3);
17749
17868
  --popover-toolbar-padding: var(--space-2);
17750
- border-radius: min(var(--radius-3), calc(var(--radius-1) + var(--space-2)));
17869
+ border-radius: min(var(--radius-surface-3), calc(var(--radius-surface-1) + var(--space-2)));
17751
17870
  }
17752
17871
  .rt-PopoverContent:where(.lg\:rt-r-size-2) {
17753
17872
  --popover-content-padding: var(--space-4);
17754
17873
  --popover-toolbar-padding: var(--space-2);
17755
- border-radius: min(var(--radius-4), calc(var(--radius-2) + var(--space-3)));
17874
+ border-radius: min(var(--radius-surface-4), calc(var(--radius-surface-2) + var(--space-3)));
17756
17875
  }
17757
17876
  .rt-PopoverContent:where(.lg\:rt-r-size-3) {
17758
17877
  --popover-content-padding: var(--space-5);
17759
17878
  --popover-toolbar-padding: var(--space-3);
17760
- border-radius: min(var(--radius-5), calc(var(--radius-3) + var(--space-4)));
17879
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-3) + var(--space-4)));
17761
17880
  }
17762
17881
  .rt-PopoverContent:where(.lg\:rt-r-size-4) {
17763
17882
  --popover-content-padding: var(--space-6);
17764
17883
  --popover-toolbar-padding: var(--space-4);
17765
- border-radius: min(var(--radius-6), calc(var(--radius-4) + var(--space-5)));
17884
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-4) + var(--space-5)));
17766
17885
  }
17767
17886
  }
17768
17887
  @media (min-width: 1640px) {
17769
17888
  .rt-PopoverContent:where(.xl\:rt-r-size-1) {
17770
17889
  --popover-content-padding: var(--space-3);
17771
17890
  --popover-toolbar-padding: var(--space-2);
17772
- border-radius: min(var(--radius-3), calc(var(--radius-1) + var(--space-2)));
17891
+ border-radius: min(var(--radius-surface-3), calc(var(--radius-surface-1) + var(--space-2)));
17773
17892
  }
17774
17893
  .rt-PopoverContent:where(.xl\:rt-r-size-2) {
17775
17894
  --popover-content-padding: var(--space-4);
17776
17895
  --popover-toolbar-padding: var(--space-2);
17777
- border-radius: min(var(--radius-4), calc(var(--radius-2) + var(--space-3)));
17896
+ border-radius: min(var(--radius-surface-4), calc(var(--radius-surface-2) + var(--space-3)));
17778
17897
  }
17779
17898
  .rt-PopoverContent:where(.xl\:rt-r-size-3) {
17780
17899
  --popover-content-padding: var(--space-5);
17781
17900
  --popover-toolbar-padding: var(--space-3);
17782
- border-radius: min(var(--radius-5), calc(var(--radius-3) + var(--space-4)));
17901
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-3) + var(--space-4)));
17783
17902
  }
17784
17903
  .rt-PopoverContent:where(.xl\:rt-r-size-4) {
17785
17904
  --popover-content-padding: var(--space-6);
17786
17905
  --popover-toolbar-padding: var(--space-4);
17787
- border-radius: min(var(--radius-6), calc(var(--radius-4) + var(--space-5)));
17906
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-4) + var(--space-5)));
17788
17907
  }
17789
17908
  }
17790
17909
  .rt-ProgressRoot {
@@ -18812,6 +18931,106 @@
18812
18931
  cursor: var(--cursor-disabled);
18813
18932
  color: var(--gray-a9);
18814
18933
  }
18934
+ .rt-RadioCardsItem:where(.rt-r-size-1) {
18935
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
18936
+ }
18937
+ .rt-RadioCardsItem:where(.rt-r-size-2) {
18938
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
18939
+ }
18940
+ .rt-RadioCardsItem:where(.rt-r-size-3) {
18941
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
18942
+ }
18943
+ .rt-RadioCardsItem:where(.rt-r-size-4) {
18944
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
18945
+ }
18946
+ .rt-RadioCardsItem:where(.rt-r-size-5) {
18947
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
18948
+ }
18949
+ @media (min-width: 520px) {
18950
+ .rt-RadioCardsItem:where(.xs\:rt-r-size-1) {
18951
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
18952
+ }
18953
+ .rt-RadioCardsItem:where(.xs\:rt-r-size-2) {
18954
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
18955
+ }
18956
+ .rt-RadioCardsItem:where(.xs\:rt-r-size-3) {
18957
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
18958
+ }
18959
+ .rt-RadioCardsItem:where(.xs\:rt-r-size-4) {
18960
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
18961
+ }
18962
+ .rt-RadioCardsItem:where(.xs\:rt-r-size-5) {
18963
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
18964
+ }
18965
+ }
18966
+ @media (min-width: 768px) {
18967
+ .rt-RadioCardsItem:where(.sm\:rt-r-size-1) {
18968
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
18969
+ }
18970
+ .rt-RadioCardsItem:where(.sm\:rt-r-size-2) {
18971
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
18972
+ }
18973
+ .rt-RadioCardsItem:where(.sm\:rt-r-size-3) {
18974
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
18975
+ }
18976
+ .rt-RadioCardsItem:where(.sm\:rt-r-size-4) {
18977
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
18978
+ }
18979
+ .rt-RadioCardsItem:where(.sm\:rt-r-size-5) {
18980
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
18981
+ }
18982
+ }
18983
+ @media (min-width: 1024px) {
18984
+ .rt-RadioCardsItem:where(.md\:rt-r-size-1) {
18985
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
18986
+ }
18987
+ .rt-RadioCardsItem:where(.md\:rt-r-size-2) {
18988
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
18989
+ }
18990
+ .rt-RadioCardsItem:where(.md\:rt-r-size-3) {
18991
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
18992
+ }
18993
+ .rt-RadioCardsItem:where(.md\:rt-r-size-4) {
18994
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
18995
+ }
18996
+ .rt-RadioCardsItem:where(.md\:rt-r-size-5) {
18997
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
18998
+ }
18999
+ }
19000
+ @media (min-width: 1280px) {
19001
+ .rt-RadioCardsItem:where(.lg\:rt-r-size-1) {
19002
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
19003
+ }
19004
+ .rt-RadioCardsItem:where(.lg\:rt-r-size-2) {
19005
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
19006
+ }
19007
+ .rt-RadioCardsItem:where(.lg\:rt-r-size-3) {
19008
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
19009
+ }
19010
+ .rt-RadioCardsItem:where(.lg\:rt-r-size-4) {
19011
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
19012
+ }
19013
+ .rt-RadioCardsItem:where(.lg\:rt-r-size-5) {
19014
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
19015
+ }
19016
+ }
19017
+ @media (min-width: 1640px) {
19018
+ .rt-RadioCardsItem:where(.xl\:rt-r-size-1) {
19019
+ --base-card-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
19020
+ }
19021
+ .rt-RadioCardsItem:where(.xl\:rt-r-size-2) {
19022
+ --base-card-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
19023
+ }
19024
+ .rt-RadioCardsItem:where(.xl\:rt-r-size-3) {
19025
+ --base-card-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
19026
+ }
19027
+ .rt-RadioCardsItem:where(.xl\:rt-r-size-4) {
19028
+ --base-card-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
19029
+ }
19030
+ .rt-RadioCardsItem:where(.xl\:rt-r-size-5) {
19031
+ --base-card-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
19032
+ }
19033
+ }
18815
19034
  .rt-RadioGroupRoot {
18816
19035
  display: -webkit-box;
18817
19036
  display: -ms-flexbox;
@@ -20775,7 +20994,7 @@
20775
20994
  --select-item-height: var(--space-5);
20776
20995
  --select-item-indicator-width: calc(var(--space-5) / var(--select-item-indicator-width-factor));
20777
20996
  --select-separator-margin-right: var(--space-2);
20778
- border-radius: var(--radius-3);
20997
+ border-radius: var(--radius-surface-3);
20779
20998
  }
20780
20999
  .rt-SelectContent:where(.rt-r-size-1) :where(.rt-SelectLabel) {
20781
21000
  font-size: var(--font-size-1);
@@ -20797,7 +21016,7 @@
20797
21016
  --select-item-height: var(--space-6);
20798
21017
  --select-item-indicator-width: var(--space-5);
20799
21018
  --select-separator-margin-right: var(--space-3);
20800
- border-radius: var(--radius-4);
21019
+ border-radius: var(--radius-surface-4);
20801
21020
  }
20802
21021
  .rt-SelectContent:where(.rt-r-size-2,.rt-r-size-3) :where(.rt-SelectLabel) {
20803
21022
  font-size: var(--font-size-2);
@@ -20830,7 +21049,7 @@
20830
21049
  --select-item-height: var(--space-5);
20831
21050
  --select-item-indicator-width: calc(var(--space-5) / var(--select-item-indicator-width-factor));
20832
21051
  --select-separator-margin-right: var(--space-2);
20833
- border-radius: var(--radius-3);
21052
+ border-radius: var(--radius-surface-3);
20834
21053
  }
20835
21054
  .rt-SelectContent:where(.xs\:rt-r-size-1) :where(.rt-SelectLabel) {
20836
21055
  font-size: var(--font-size-1);
@@ -20852,7 +21071,7 @@
20852
21071
  --select-item-height: var(--space-6);
20853
21072
  --select-item-indicator-width: var(--space-5);
20854
21073
  --select-separator-margin-right: var(--space-3);
20855
- border-radius: var(--radius-4);
21074
+ border-radius: var(--radius-surface-4);
20856
21075
  }
20857
21076
  .rt-SelectContent:where(.xs\:rt-r-size-2,.xs\:rt-r-size-3) :where(.rt-SelectLabel) {
20858
21077
  font-size: var(--font-size-2);
@@ -20886,7 +21105,7 @@
20886
21105
  --select-item-height: var(--space-5);
20887
21106
  --select-item-indicator-width: calc(var(--space-5) / var(--select-item-indicator-width-factor));
20888
21107
  --select-separator-margin-right: var(--space-2);
20889
- border-radius: var(--radius-3);
21108
+ border-radius: var(--radius-surface-3);
20890
21109
  }
20891
21110
  .rt-SelectContent:where(.sm\:rt-r-size-1) :where(.rt-SelectLabel) {
20892
21111
  font-size: var(--font-size-1);
@@ -20908,7 +21127,7 @@
20908
21127
  --select-item-height: var(--space-6);
20909
21128
  --select-item-indicator-width: var(--space-5);
20910
21129
  --select-separator-margin-right: var(--space-3);
20911
- border-radius: var(--radius-4);
21130
+ border-radius: var(--radius-surface-4);
20912
21131
  }
20913
21132
  .rt-SelectContent:where(.sm\:rt-r-size-2,.sm\:rt-r-size-3) :where(.rt-SelectLabel) {
20914
21133
  font-size: var(--font-size-2);
@@ -20942,7 +21161,7 @@
20942
21161
  --select-item-height: var(--space-5);
20943
21162
  --select-item-indicator-width: calc(var(--space-5) / var(--select-item-indicator-width-factor));
20944
21163
  --select-separator-margin-right: var(--space-2);
20945
- border-radius: var(--radius-3);
21164
+ border-radius: var(--radius-surface-3);
20946
21165
  }
20947
21166
  .rt-SelectContent:where(.md\:rt-r-size-1) :where(.rt-SelectLabel) {
20948
21167
  font-size: var(--font-size-1);
@@ -20964,7 +21183,7 @@
20964
21183
  --select-item-height: var(--space-6);
20965
21184
  --select-item-indicator-width: var(--space-5);
20966
21185
  --select-separator-margin-right: var(--space-3);
20967
- border-radius: var(--radius-4);
21186
+ border-radius: var(--radius-surface-4);
20968
21187
  }
20969
21188
  .rt-SelectContent:where(.md\:rt-r-size-2,.md\:rt-r-size-3) :where(.rt-SelectLabel) {
20970
21189
  font-size: var(--font-size-2);
@@ -20998,7 +21217,7 @@
20998
21217
  --select-item-height: var(--space-5);
20999
21218
  --select-item-indicator-width: calc(var(--space-5) / var(--select-item-indicator-width-factor));
21000
21219
  --select-separator-margin-right: var(--space-2);
21001
- border-radius: var(--radius-3);
21220
+ border-radius: var(--radius-surface-3);
21002
21221
  }
21003
21222
  .rt-SelectContent:where(.lg\:rt-r-size-1) :where(.rt-SelectLabel) {
21004
21223
  font-size: var(--font-size-1);
@@ -21020,7 +21239,7 @@
21020
21239
  --select-item-height: var(--space-6);
21021
21240
  --select-item-indicator-width: var(--space-5);
21022
21241
  --select-separator-margin-right: var(--space-3);
21023
- border-radius: var(--radius-4);
21242
+ border-radius: var(--radius-surface-4);
21024
21243
  }
21025
21244
  .rt-SelectContent:where(.lg\:rt-r-size-2,.lg\:rt-r-size-3) :where(.rt-SelectLabel) {
21026
21245
  font-size: var(--font-size-2);
@@ -21054,7 +21273,7 @@
21054
21273
  --select-item-height: var(--space-5);
21055
21274
  --select-item-indicator-width: calc(var(--space-5) / var(--select-item-indicator-width-factor));
21056
21275
  --select-separator-margin-right: var(--space-2);
21057
- border-radius: var(--radius-3);
21276
+ border-radius: var(--radius-surface-3);
21058
21277
  }
21059
21278
  .rt-SelectContent:where(.xl\:rt-r-size-1) :where(.rt-SelectLabel) {
21060
21279
  font-size: var(--font-size-1);
@@ -21076,7 +21295,7 @@
21076
21295
  --select-item-height: var(--space-6);
21077
21296
  --select-item-indicator-width: var(--space-5);
21078
21297
  --select-separator-margin-right: var(--space-3);
21079
- border-radius: var(--radius-4);
21298
+ border-radius: var(--radius-surface-4);
21080
21299
  }
21081
21300
  .rt-SelectContent:where(.xl\:rt-r-size-2,.xl\:rt-r-size-3) :where(.rt-SelectLabel) {
21082
21301
  font-size: var(--font-size-2);
@@ -24621,7 +24840,7 @@
24621
24840
  .rt-ShellBottom[data-inset] {
24622
24841
  --shell-inset-gap: var(--space-2);
24623
24842
  margin: var(--shell-inset-gap);
24624
- border-radius: var(--radius-3);
24843
+ border-radius: var(--radius-surface-3);
24625
24844
  background: var(--color-background);
24626
24845
  -webkit-box-shadow: var(--shadow-2);
24627
24846
  box-shadow: var(--shadow-2);
@@ -25931,7 +26150,7 @@
25931
26150
  font-weight: normal;
25932
26151
  }
25933
26152
  .rt-TableRoot:where(.rt-r-size-1) {
25934
- --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
26153
+ --table-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
25935
26154
  --table-cell-padding: var(--space-2);
25936
26155
  --table-cell-min-height: calc(36px * var(--scaling));
25937
26156
  }
@@ -25940,7 +26159,7 @@
25940
26159
  line-height: var(--line-height-2);
25941
26160
  }
25942
26161
  .rt-TableRoot:where(.rt-r-size-2) {
25943
- --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
26162
+ --table-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
25944
26163
  --table-cell-padding: var(--space-3);
25945
26164
  --table-cell-min-height: calc(44px * var(--scaling));
25946
26165
  }
@@ -25949,7 +26168,7 @@
25949
26168
  line-height: var(--line-height-2);
25950
26169
  }
25951
26170
  .rt-TableRoot:where(.rt-r-size-3) {
25952
- --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
26171
+ --table-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
25953
26172
  --table-cell-padding: var(--space-4);
25954
26173
  --table-cell-min-height: var(--space-8);
25955
26174
  }
@@ -25958,7 +26177,7 @@
25958
26177
  line-height: var(--line-height-3);
25959
26178
  }
25960
26179
  .rt-TableRoot:where(.rt-r-size-4) {
25961
- --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
26180
+ --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
25962
26181
  --table-cell-padding: var(--space-5);
25963
26182
  --table-cell-min-height: var(--space-9);
25964
26183
  }
@@ -25967,7 +26186,7 @@
25967
26186
  line-height: var(--line-height-3);
25968
26187
  }
25969
26188
  .rt-TableRoot:where(.rt-r-size-5) {
25970
- --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
26189
+ --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
25971
26190
  --table-cell-padding: var(--space-6);
25972
26191
  --table-cell-min-height: var(--space-10);
25973
26192
  }
@@ -25977,7 +26196,7 @@
25977
26196
  }
25978
26197
  @media (min-width: 520px) {
25979
26198
  .rt-TableRoot:where(.xs\:rt-r-size-1) {
25980
- --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
26199
+ --table-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
25981
26200
  --table-cell-padding: var(--space-2);
25982
26201
  --table-cell-min-height: calc(36px * var(--scaling));
25983
26202
  }
@@ -25986,7 +26205,7 @@
25986
26205
  line-height: var(--line-height-2);
25987
26206
  }
25988
26207
  .rt-TableRoot:where(.xs\:rt-r-size-2) {
25989
- --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
26208
+ --table-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
25990
26209
  --table-cell-padding: var(--space-3);
25991
26210
  --table-cell-min-height: calc(44px * var(--scaling));
25992
26211
  }
@@ -25995,7 +26214,7 @@
25995
26214
  line-height: var(--line-height-2);
25996
26215
  }
25997
26216
  .rt-TableRoot:where(.xs\:rt-r-size-3) {
25998
- --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
26217
+ --table-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
25999
26218
  --table-cell-padding: var(--space-4);
26000
26219
  --table-cell-min-height: var(--space-8);
26001
26220
  }
@@ -26004,7 +26223,7 @@
26004
26223
  line-height: var(--line-height-3);
26005
26224
  }
26006
26225
  .rt-TableRoot:where(.xs\:rt-r-size-4) {
26007
- --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
26226
+ --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
26008
26227
  --table-cell-padding: var(--space-5);
26009
26228
  --table-cell-min-height: var(--space-9);
26010
26229
  }
@@ -26013,7 +26232,7 @@
26013
26232
  line-height: var(--line-height-3);
26014
26233
  }
26015
26234
  .rt-TableRoot:where(.xs\:rt-r-size-5) {
26016
- --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
26235
+ --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
26017
26236
  --table-cell-padding: var(--space-6);
26018
26237
  --table-cell-min-height: var(--space-10);
26019
26238
  }
@@ -26024,7 +26243,7 @@
26024
26243
  }
26025
26244
  @media (min-width: 768px) {
26026
26245
  .rt-TableRoot:where(.sm\:rt-r-size-1) {
26027
- --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
26246
+ --table-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
26028
26247
  --table-cell-padding: var(--space-2);
26029
26248
  --table-cell-min-height: calc(36px * var(--scaling));
26030
26249
  }
@@ -26033,7 +26252,7 @@
26033
26252
  line-height: var(--line-height-2);
26034
26253
  }
26035
26254
  .rt-TableRoot:where(.sm\:rt-r-size-2) {
26036
- --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
26255
+ --table-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
26037
26256
  --table-cell-padding: var(--space-3);
26038
26257
  --table-cell-min-height: calc(44px * var(--scaling));
26039
26258
  }
@@ -26042,7 +26261,7 @@
26042
26261
  line-height: var(--line-height-2);
26043
26262
  }
26044
26263
  .rt-TableRoot:where(.sm\:rt-r-size-3) {
26045
- --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
26264
+ --table-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
26046
26265
  --table-cell-padding: var(--space-4);
26047
26266
  --table-cell-min-height: var(--space-8);
26048
26267
  }
@@ -26051,7 +26270,7 @@
26051
26270
  line-height: var(--line-height-3);
26052
26271
  }
26053
26272
  .rt-TableRoot:where(.sm\:rt-r-size-4) {
26054
- --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
26273
+ --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
26055
26274
  --table-cell-padding: var(--space-5);
26056
26275
  --table-cell-min-height: var(--space-9);
26057
26276
  }
@@ -26060,7 +26279,7 @@
26060
26279
  line-height: var(--line-height-3);
26061
26280
  }
26062
26281
  .rt-TableRoot:where(.sm\:rt-r-size-5) {
26063
- --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
26282
+ --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
26064
26283
  --table-cell-padding: var(--space-6);
26065
26284
  --table-cell-min-height: var(--space-10);
26066
26285
  }
@@ -26071,7 +26290,7 @@
26071
26290
  }
26072
26291
  @media (min-width: 1024px) {
26073
26292
  .rt-TableRoot:where(.md\:rt-r-size-1) {
26074
- --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
26293
+ --table-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
26075
26294
  --table-cell-padding: var(--space-2);
26076
26295
  --table-cell-min-height: calc(36px * var(--scaling));
26077
26296
  }
@@ -26080,7 +26299,7 @@
26080
26299
  line-height: var(--line-height-2);
26081
26300
  }
26082
26301
  .rt-TableRoot:where(.md\:rt-r-size-2) {
26083
- --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
26302
+ --table-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
26084
26303
  --table-cell-padding: var(--space-3);
26085
26304
  --table-cell-min-height: calc(44px * var(--scaling));
26086
26305
  }
@@ -26089,7 +26308,7 @@
26089
26308
  line-height: var(--line-height-2);
26090
26309
  }
26091
26310
  .rt-TableRoot:where(.md\:rt-r-size-3) {
26092
- --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
26311
+ --table-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
26093
26312
  --table-cell-padding: var(--space-4);
26094
26313
  --table-cell-min-height: var(--space-8);
26095
26314
  }
@@ -26098,7 +26317,7 @@
26098
26317
  line-height: var(--line-height-3);
26099
26318
  }
26100
26319
  .rt-TableRoot:where(.md\:rt-r-size-4) {
26101
- --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
26320
+ --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
26102
26321
  --table-cell-padding: var(--space-5);
26103
26322
  --table-cell-min-height: var(--space-9);
26104
26323
  }
@@ -26107,7 +26326,7 @@
26107
26326
  line-height: var(--line-height-3);
26108
26327
  }
26109
26328
  .rt-TableRoot:where(.md\:rt-r-size-5) {
26110
- --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
26329
+ --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
26111
26330
  --table-cell-padding: var(--space-6);
26112
26331
  --table-cell-min-height: var(--space-10);
26113
26332
  }
@@ -26118,7 +26337,7 @@
26118
26337
  }
26119
26338
  @media (min-width: 1280px) {
26120
26339
  .rt-TableRoot:where(.lg\:rt-r-size-1) {
26121
- --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
26340
+ --table-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
26122
26341
  --table-cell-padding: var(--space-2);
26123
26342
  --table-cell-min-height: calc(36px * var(--scaling));
26124
26343
  }
@@ -26127,7 +26346,7 @@
26127
26346
  line-height: var(--line-height-2);
26128
26347
  }
26129
26348
  .rt-TableRoot:where(.lg\:rt-r-size-2) {
26130
- --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
26349
+ --table-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
26131
26350
  --table-cell-padding: var(--space-3);
26132
26351
  --table-cell-min-height: calc(44px * var(--scaling));
26133
26352
  }
@@ -26136,7 +26355,7 @@
26136
26355
  line-height: var(--line-height-2);
26137
26356
  }
26138
26357
  .rt-TableRoot:where(.lg\:rt-r-size-3) {
26139
- --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
26358
+ --table-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
26140
26359
  --table-cell-padding: var(--space-4);
26141
26360
  --table-cell-min-height: var(--space-8);
26142
26361
  }
@@ -26145,7 +26364,7 @@
26145
26364
  line-height: var(--line-height-3);
26146
26365
  }
26147
26366
  .rt-TableRoot:where(.lg\:rt-r-size-4) {
26148
- --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
26367
+ --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
26149
26368
  --table-cell-padding: var(--space-5);
26150
26369
  --table-cell-min-height: var(--space-9);
26151
26370
  }
@@ -26154,7 +26373,7 @@
26154
26373
  line-height: var(--line-height-3);
26155
26374
  }
26156
26375
  .rt-TableRoot:where(.lg\:rt-r-size-5) {
26157
- --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
26376
+ --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
26158
26377
  --table-cell-padding: var(--space-6);
26159
26378
  --table-cell-min-height: var(--space-10);
26160
26379
  }
@@ -26165,7 +26384,7 @@
26165
26384
  }
26166
26385
  @media (min-width: 1640px) {
26167
26386
  .rt-TableRoot:where(.xl\:rt-r-size-1) {
26168
- --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
26387
+ --table-border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
26169
26388
  --table-cell-padding: var(--space-2);
26170
26389
  --table-cell-min-height: calc(36px * var(--scaling));
26171
26390
  }
@@ -26174,7 +26393,7 @@
26174
26393
  line-height: var(--line-height-2);
26175
26394
  }
26176
26395
  .rt-TableRoot:where(.xl\:rt-r-size-2) {
26177
- --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
26396
+ --table-border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
26178
26397
  --table-cell-padding: var(--space-3);
26179
26398
  --table-cell-min-height: calc(44px * var(--scaling));
26180
26399
  }
@@ -26183,7 +26402,7 @@
26183
26402
  line-height: var(--line-height-2);
26184
26403
  }
26185
26404
  .rt-TableRoot:where(.xl\:rt-r-size-3) {
26186
- --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
26405
+ --table-border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
26187
26406
  --table-cell-padding: var(--space-4);
26188
26407
  --table-cell-min-height: var(--space-8);
26189
26408
  }
@@ -26192,7 +26411,7 @@
26192
26411
  line-height: var(--line-height-3);
26193
26412
  }
26194
26413
  .rt-TableRoot:where(.xl\:rt-r-size-4) {
26195
- --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
26414
+ --table-border-radius: min(var(--radius-surface-8), calc(var(--radius-surface-4) + var(--space-4)));
26196
26415
  --table-cell-padding: var(--space-5);
26197
26416
  --table-cell-min-height: var(--space-9);
26198
26417
  }
@@ -26201,7 +26420,7 @@
26201
26420
  line-height: var(--line-height-3);
26202
26421
  }
26203
26422
  .rt-TableRoot:where(.xl\:rt-r-size-5) {
26204
- --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
26423
+ --table-border-radius: min(var(--radius-surface-9), calc(var(--radius-surface-5) + var(--space-5)));
26205
26424
  --table-cell-padding: var(--space-6);
26206
26425
  --table-cell-min-height: var(--space-10);
26207
26426
  }
@@ -27127,7 +27346,7 @@
27127
27346
  box-sizing: border-box;
27128
27347
  padding: var(--space-1) var(--space-2);
27129
27348
  background-color: var(--gray-12);
27130
- border-radius: var(--radius-1);
27349
+ border-radius: var(--radius-surface-1);
27131
27350
  z-index: 300;
27132
27351
  -webkit-transform-origin: var(--radix-tooltip-content-transform-origin);
27133
27352
  transform-origin: var(--radix-tooltip-content-transform-origin);
@@ -27413,7 +27632,7 @@
27413
27632
  --backdrop-filter-components: none;
27414
27633
  }
27415
27634
  .rt-ChatbarRoot:where(.rt-r-size-1) .rt-ChatbarBox {
27416
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27635
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27417
27636
  padding: var(--space-3);
27418
27637
  }
27419
27638
  .rt-ChatbarRoot:where(.rt-r-size-1) .rt-ChatbarInput {
@@ -27424,7 +27643,7 @@
27424
27643
  letter-spacing: var(--letter-spacing-1);
27425
27644
  }
27426
27645
  .rt-ChatbarRoot:where(.rt-r-size-2) .rt-ChatbarBox {
27427
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27646
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27428
27647
  padding: var(--space-4);
27429
27648
  }
27430
27649
  .rt-ChatbarRoot:where(.rt-r-size-2) .rt-ChatbarInput {
@@ -27435,7 +27654,7 @@
27435
27654
  letter-spacing: var(--letter-spacing-2);
27436
27655
  }
27437
27656
  .rt-ChatbarRoot:where(.rt-r-size-3) .rt-ChatbarBox {
27438
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27657
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27439
27658
  padding: var(--space-4);
27440
27659
  }
27441
27660
  .rt-ChatbarRoot:where(.rt-r-size-3) .rt-ChatbarInput {
@@ -27447,7 +27666,7 @@
27447
27666
  }
27448
27667
  @media (min-width: 520px) {
27449
27668
  .rt-ChatbarRoot:where(.xs\:rt-r-size-1) .rt-ChatbarBox {
27450
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27669
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27451
27670
  padding: var(--space-3);
27452
27671
  }
27453
27672
  .rt-ChatbarRoot:where(.xs\:rt-r-size-1) .rt-ChatbarInput {
@@ -27458,7 +27677,7 @@
27458
27677
  letter-spacing: var(--letter-spacing-1);
27459
27678
  }
27460
27679
  .rt-ChatbarRoot:where(.xs\:rt-r-size-2) .rt-ChatbarBox {
27461
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27680
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27462
27681
  padding: var(--space-4);
27463
27682
  }
27464
27683
  .rt-ChatbarRoot:where(.xs\:rt-r-size-2) .rt-ChatbarInput {
@@ -27469,7 +27688,7 @@
27469
27688
  letter-spacing: var(--letter-spacing-2);
27470
27689
  }
27471
27690
  .rt-ChatbarRoot:where(.xs\:rt-r-size-3) .rt-ChatbarBox {
27472
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27691
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27473
27692
  padding: var(--space-4);
27474
27693
  }
27475
27694
  .rt-ChatbarRoot:where(.xs\:rt-r-size-3) .rt-ChatbarInput {
@@ -27482,7 +27701,7 @@
27482
27701
  }
27483
27702
  @media (min-width: 768px) {
27484
27703
  .rt-ChatbarRoot:where(.sm\:rt-r-size-1) .rt-ChatbarBox {
27485
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27704
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27486
27705
  padding: var(--space-3);
27487
27706
  }
27488
27707
  .rt-ChatbarRoot:where(.sm\:rt-r-size-1) .rt-ChatbarInput {
@@ -27493,7 +27712,7 @@
27493
27712
  letter-spacing: var(--letter-spacing-1);
27494
27713
  }
27495
27714
  .rt-ChatbarRoot:where(.sm\:rt-r-size-2) .rt-ChatbarBox {
27496
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27715
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27497
27716
  padding: var(--space-4);
27498
27717
  }
27499
27718
  .rt-ChatbarRoot:where(.sm\:rt-r-size-2) .rt-ChatbarInput {
@@ -27504,7 +27723,7 @@
27504
27723
  letter-spacing: var(--letter-spacing-2);
27505
27724
  }
27506
27725
  .rt-ChatbarRoot:where(.sm\:rt-r-size-3) .rt-ChatbarBox {
27507
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27726
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27508
27727
  padding: var(--space-4);
27509
27728
  }
27510
27729
  .rt-ChatbarRoot:where(.sm\:rt-r-size-3) .rt-ChatbarInput {
@@ -27517,7 +27736,7 @@
27517
27736
  }
27518
27737
  @media (min-width: 1024px) {
27519
27738
  .rt-ChatbarRoot:where(.md\:rt-r-size-1) .rt-ChatbarBox {
27520
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27739
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27521
27740
  padding: var(--space-3);
27522
27741
  }
27523
27742
  .rt-ChatbarRoot:where(.md\:rt-r-size-1) .rt-ChatbarInput {
@@ -27528,7 +27747,7 @@
27528
27747
  letter-spacing: var(--letter-spacing-1);
27529
27748
  }
27530
27749
  .rt-ChatbarRoot:where(.md\:rt-r-size-2) .rt-ChatbarBox {
27531
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27750
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27532
27751
  padding: var(--space-4);
27533
27752
  }
27534
27753
  .rt-ChatbarRoot:where(.md\:rt-r-size-2) .rt-ChatbarInput {
@@ -27539,7 +27758,7 @@
27539
27758
  letter-spacing: var(--letter-spacing-2);
27540
27759
  }
27541
27760
  .rt-ChatbarRoot:where(.md\:rt-r-size-3) .rt-ChatbarBox {
27542
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27761
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27543
27762
  padding: var(--space-4);
27544
27763
  }
27545
27764
  .rt-ChatbarRoot:where(.md\:rt-r-size-3) .rt-ChatbarInput {
@@ -27552,7 +27771,7 @@
27552
27771
  }
27553
27772
  @media (min-width: 1280px) {
27554
27773
  .rt-ChatbarRoot:where(.lg\:rt-r-size-1) .rt-ChatbarBox {
27555
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27774
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27556
27775
  padding: var(--space-3);
27557
27776
  }
27558
27777
  .rt-ChatbarRoot:where(.lg\:rt-r-size-1) .rt-ChatbarInput {
@@ -27563,7 +27782,7 @@
27563
27782
  letter-spacing: var(--letter-spacing-1);
27564
27783
  }
27565
27784
  .rt-ChatbarRoot:where(.lg\:rt-r-size-2) .rt-ChatbarBox {
27566
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27785
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27567
27786
  padding: var(--space-4);
27568
27787
  }
27569
27788
  .rt-ChatbarRoot:where(.lg\:rt-r-size-2) .rt-ChatbarInput {
@@ -27574,7 +27793,7 @@
27574
27793
  letter-spacing: var(--letter-spacing-2);
27575
27794
  }
27576
27795
  .rt-ChatbarRoot:where(.lg\:rt-r-size-3) .rt-ChatbarBox {
27577
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27796
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27578
27797
  padding: var(--space-4);
27579
27798
  }
27580
27799
  .rt-ChatbarRoot:where(.lg\:rt-r-size-3) .rt-ChatbarInput {
@@ -27587,7 +27806,7 @@
27587
27806
  }
27588
27807
  @media (min-width: 1640px) {
27589
27808
  .rt-ChatbarRoot:where(.xl\:rt-r-size-1) .rt-ChatbarBox {
27590
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27809
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27591
27810
  padding: var(--space-3);
27592
27811
  }
27593
27812
  .rt-ChatbarRoot:where(.xl\:rt-r-size-1) .rt-ChatbarInput {
@@ -27598,7 +27817,7 @@
27598
27817
  letter-spacing: var(--letter-spacing-1);
27599
27818
  }
27600
27819
  .rt-ChatbarRoot:where(.xl\:rt-r-size-2) .rt-ChatbarBox {
27601
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27820
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27602
27821
  padding: var(--space-4);
27603
27822
  }
27604
27823
  .rt-ChatbarRoot:where(.xl\:rt-r-size-2) .rt-ChatbarInput {
@@ -27609,7 +27828,7 @@
27609
27828
  letter-spacing: var(--letter-spacing-2);
27610
27829
  }
27611
27830
  .rt-ChatbarRoot:where(.xl\:rt-r-size-3) .rt-ChatbarBox {
27612
- border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
27831
+ border-radius: min(var(--radius-surface-7), calc(var(--radius-surface-3) + var(--space-3)));
27613
27832
  padding: var(--space-4);
27614
27833
  }
27615
27834
  .rt-ChatbarRoot:where(.xl\:rt-r-size-3) .rt-ChatbarInput {
@@ -27685,67 +27904,67 @@
27685
27904
  }
27686
27905
  }
27687
27906
  .rt-ChatbarRoot:where([data-state='closed'].rt-r-size-1) .rt-ChatbarBox {
27688
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
27907
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
27689
27908
  }
27690
27909
  .rt-ChatbarRoot:where([data-state='closed'].rt-r-size-2) .rt-ChatbarBox {
27691
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27910
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27692
27911
  }
27693
27912
  .rt-ChatbarRoot:where([data-state='closed'].rt-r-size-3) .rt-ChatbarBox {
27694
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27913
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27695
27914
  }
27696
27915
  @media (min-width: 520px) {
27697
27916
  .rt-ChatbarRoot:where([data-state='closed'].xs\:rt-r-size-1) .rt-ChatbarBox {
27698
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
27917
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
27699
27918
  }
27700
27919
  .rt-ChatbarRoot:where([data-state='closed'].xs\:rt-r-size-2) .rt-ChatbarBox {
27701
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27920
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27702
27921
  }
27703
27922
  .rt-ChatbarRoot:where([data-state='closed'].xs\:rt-r-size-3) .rt-ChatbarBox {
27704
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27923
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27705
27924
  }
27706
27925
  }
27707
27926
  @media (min-width: 768px) {
27708
27927
  .rt-ChatbarRoot:where([data-state='closed'].sm\:rt-r-size-1) .rt-ChatbarBox {
27709
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
27928
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
27710
27929
  }
27711
27930
  .rt-ChatbarRoot:where([data-state='closed'].sm\:rt-r-size-2) .rt-ChatbarBox {
27712
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27931
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27713
27932
  }
27714
27933
  .rt-ChatbarRoot:where([data-state='closed'].sm\:rt-r-size-3) .rt-ChatbarBox {
27715
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27934
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27716
27935
  }
27717
27936
  }
27718
27937
  @media (min-width: 1024px) {
27719
27938
  .rt-ChatbarRoot:where([data-state='closed'].md\:rt-r-size-1) .rt-ChatbarBox {
27720
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
27939
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
27721
27940
  }
27722
27941
  .rt-ChatbarRoot:where([data-state='closed'].md\:rt-r-size-2) .rt-ChatbarBox {
27723
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27942
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27724
27943
  }
27725
27944
  .rt-ChatbarRoot:where([data-state='closed'].md\:rt-r-size-3) .rt-ChatbarBox {
27726
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27945
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27727
27946
  }
27728
27947
  }
27729
27948
  @media (min-width: 1280px) {
27730
27949
  .rt-ChatbarRoot:where([data-state='closed'].lg\:rt-r-size-1) .rt-ChatbarBox {
27731
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
27950
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
27732
27951
  }
27733
27952
  .rt-ChatbarRoot:where([data-state='closed'].lg\:rt-r-size-2) .rt-ChatbarBox {
27734
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27953
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27735
27954
  }
27736
27955
  .rt-ChatbarRoot:where([data-state='closed'].lg\:rt-r-size-3) .rt-ChatbarBox {
27737
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27956
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27738
27957
  }
27739
27958
  }
27740
27959
  @media (min-width: 1640px) {
27741
27960
  .rt-ChatbarRoot:where([data-state='closed'].xl\:rt-r-size-1) .rt-ChatbarBox {
27742
- border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
27961
+ border-radius: min(var(--radius-surface-5), calc(var(--radius-surface-1) + var(--space-1)));
27743
27962
  }
27744
27963
  .rt-ChatbarRoot:where([data-state='closed'].xl\:rt-r-size-2) .rt-ChatbarBox {
27745
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27964
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27746
27965
  }
27747
27966
  .rt-ChatbarRoot:where([data-state='closed'].xl\:rt-r-size-3) .rt-ChatbarBox {
27748
- border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
27967
+ border-radius: min(var(--radius-surface-6), calc(var(--radius-surface-2) + var(--space-2)));
27749
27968
  }
27750
27969
  }
27751
27970
  .rt-ChatbarBox:where(.rt-variant-soft) {