@seed-design/css 2.6.2 → 2.8.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 (31) hide show
  1. package/all.css +63 -61
  2. package/all.layered.css +63 -61
  3. package/all.layered.min.css +1 -1
  4. package/all.min.css +1 -1
  5. package/base.css +60 -56
  6. package/base.layered.css +60 -56
  7. package/base.layered.min.css +1 -1
  8. package/base.min.css +1 -1
  9. package/package.json +1 -1
  10. package/recipes/scroll-fog.css +2 -4
  11. package/recipes/scroll-fog.layered.css +3 -5
  12. package/theming/index.cjs +41 -5
  13. package/theming/index.mjs +41 -5
  14. package/vars/component/callout.d.ts +6 -2
  15. package/vars/component/callout.mjs +6 -2
  16. package/vars/component/image-frame-reaction-button.d.ts +26 -2
  17. package/vars/component/image-frame-reaction-button.mjs +26 -2
  18. package/vars/component/page-banner.d.ts +6 -2
  19. package/vars/component/page-banner.mjs +6 -2
  20. package/vars/component/scroll-fog.d.ts +69 -2
  21. package/vars/component/scroll-fog.mjs +69 -2
  22. package/vars/component/skeleton.d.ts +6 -2
  23. package/vars/component/skeleton.mjs +6 -2
  24. package/vars/component/top-navigation-icon-button.d.ts +10 -1
  25. package/vars/component/top-navigation-icon-button.mjs +10 -1
  26. package/vars/component/top-navigation-text-button.d.ts +10 -1
  27. package/vars/component/top-navigation-text-button.mjs +10 -1
  28. package/vars/component/top-navigation.d.ts +24 -5
  29. package/vars/component/top-navigation.mjs +23 -5
  30. package/vars/gradient.d.ts +2 -0
  31. package/vars/gradient.mjs +1 -0
package/base.css CHANGED
@@ -18,11 +18,13 @@
18
18
  }
19
19
 
20
20
  :root {
21
+ --seed-font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard Variable", Pretendard, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
21
22
  --seed-font-size-multiplier: 1;
22
23
  --seed-font-size-limit-min: .8;
23
24
  --seed-font-size-limit-max: 1.5;
24
25
  --seed-line-height-limit-min: .8;
25
26
  --seed-line-height-limit-max: 1.5;
27
+ --seed-static-font-scale: 1;
26
28
  --seed-feedback-scale: 1;
27
29
  --seed-feedback-scale-transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
28
30
  }
@@ -460,65 +462,65 @@
460
462
  --seed-duration-d6: .3s;
461
463
  --seed-duration-color-transition: var(--seed-duration-d3);
462
464
  --seed-duration-pressed-scale: var(--seed-duration-d3);
463
- --seed-font-size-t1: clamp(calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-min, .8)), calc(.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-max, 1.5)));
464
- --seed-font-size-t2: clamp(calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-min, .8)), calc(.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-max, 1.5)));
465
- --seed-font-size-t3: clamp(calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-min, .8)), calc(.8125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-max, 1.5)));
466
- --seed-font-size-t4: clamp(calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-min, .8)), calc(.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-max, 1.5)));
467
- --seed-font-size-t5: clamp(calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-min, .8)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-max, 1.5)));
468
- --seed-font-size-t6: clamp(calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-min, .8)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-max, 1.5)));
469
- --seed-font-size-t7: clamp(calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-min, .8)), calc(1.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-max, 1.5)));
470
- --seed-font-size-t8: clamp(calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-min, .8)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-max, 1.5)));
471
- --seed-font-size-t9: clamp(calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-min, .8)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-max, 1.5)));
472
- --seed-font-size-t10: clamp(calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-min, .8)), calc(1.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-max, 1.5)));
473
- --seed-font-size-t11: clamp(calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-min, .8)), calc(1.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-max, 1.5)));
474
- --seed-font-size-t12: clamp(calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-min, .8)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-max, 1.5)));
475
- --seed-font-size-t13: clamp(calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-min, .8)), calc(2.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-max, 1.5)));
476
- --seed-font-size-t14: clamp(calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-min, .8)), calc(3rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-max, 1.5)));
477
- --seed-font-size-t1-static: 11px;
478
- --seed-font-size-t2-static: 12px;
479
- --seed-font-size-t3-static: 13px;
480
- --seed-font-size-t4-static: 14px;
481
- --seed-font-size-t5-static: 16px;
482
- --seed-font-size-t6-static: 18px;
483
- --seed-font-size-t7-static: 20px;
484
- --seed-font-size-t8-static: 22px;
485
- --seed-font-size-t9-static: 24px;
486
- --seed-font-size-t10-static: 26px;
487
- --seed-font-size-t11-static: 28px;
488
- --seed-font-size-t12-static: 32px;
489
- --seed-font-size-t13-static: 40px;
490
- --seed-font-size-t14-static: 48px;
465
+ --seed-font-size-t1: clamp(calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-min, 1)), calc(.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-max, 1)));
466
+ --seed-font-size-t2: clamp(calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-min, 1)), calc(.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-max, 1)));
467
+ --seed-font-size-t3: clamp(calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-min, 1)), calc(.8125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-max, 1)));
468
+ --seed-font-size-t4: clamp(calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-min, 1)), calc(.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-max, 1)));
469
+ --seed-font-size-t5: clamp(calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-min, 1)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-max, 1)));
470
+ --seed-font-size-t6: clamp(calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-min, 1)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-max, 1)));
471
+ --seed-font-size-t7: clamp(calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-min, 1)), calc(1.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-max, 1)));
472
+ --seed-font-size-t8: clamp(calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-min, 1)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-max, 1)));
473
+ --seed-font-size-t9: clamp(calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-min, 1)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-max, 1)));
474
+ --seed-font-size-t10: clamp(calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-min, 1)), calc(1.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-max, 1)));
475
+ --seed-font-size-t11: clamp(calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-min, 1)), calc(1.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-max, 1)));
476
+ --seed-font-size-t12: clamp(calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-min, 1)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-max, 1)));
477
+ --seed-font-size-t13: clamp(calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-min, 1)), calc(2.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-max, 1)));
478
+ --seed-font-size-t14: clamp(calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-min, 1)), calc(3rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-max, 1)));
479
+ --seed-font-size-t1-static: calc(11px / var(--seed-static-font-scale, 1));
480
+ --seed-font-size-t2-static: calc(12px / var(--seed-static-font-scale, 1));
481
+ --seed-font-size-t3-static: calc(13px / var(--seed-static-font-scale, 1));
482
+ --seed-font-size-t4-static: calc(14px / var(--seed-static-font-scale, 1));
483
+ --seed-font-size-t5-static: calc(16px / var(--seed-static-font-scale, 1));
484
+ --seed-font-size-t6-static: calc(18px / var(--seed-static-font-scale, 1));
485
+ --seed-font-size-t7-static: calc(20px / var(--seed-static-font-scale, 1));
486
+ --seed-font-size-t8-static: calc(22px / var(--seed-static-font-scale, 1));
487
+ --seed-font-size-t9-static: calc(24px / var(--seed-static-font-scale, 1));
488
+ --seed-font-size-t10-static: calc(26px / var(--seed-static-font-scale, 1));
489
+ --seed-font-size-t11-static: calc(28px / var(--seed-static-font-scale, 1));
490
+ --seed-font-size-t12-static: calc(32px / var(--seed-static-font-scale, 1));
491
+ --seed-font-size-t13-static: calc(40px / var(--seed-static-font-scale, 1));
492
+ --seed-font-size-t14-static: calc(48px / var(--seed-static-font-scale, 1));
491
493
  --seed-font-weight-regular: 400;
492
494
  --seed-font-weight-medium: 500;
493
495
  --seed-font-weight-bold: 700;
494
- --seed-line-height-t1: clamp(calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-min, .8)), calc(.9375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-max, 1.5)));
495
- --seed-line-height-t2: clamp(calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-min, .8)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-max, 1.5)));
496
- --seed-line-height-t3: clamp(calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-min, .8)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-max, 1.5)));
497
- --seed-line-height-t4: clamp(calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-min, .8)), calc(1.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-max, 1.5)));
498
- --seed-line-height-t5: clamp(calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-min, .8)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-max, 1.5)));
499
- --seed-line-height-t6: clamp(calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-min, .8)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-max, 1.5)));
500
- --seed-line-height-t7: clamp(calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-min, .8)), calc(1.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-max, 1.5)));
501
- --seed-line-height-t8: clamp(calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-min, .8)), calc(1.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-max, 1.5)));
502
- --seed-line-height-t9: clamp(calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-min, .8)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-max, 1.5)));
503
- --seed-line-height-t10: clamp(calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-min, .8)), calc(2.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-max, 1.5)));
504
- --seed-line-height-t11: clamp(calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-min, .8)), calc(2.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-max, 1.5)));
505
- --seed-line-height-t12: clamp(calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-min, .8)), calc(2.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-max, 1.5)));
506
- --seed-line-height-t13: clamp(calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-min, .8)), calc(3.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-max, 1.5)));
507
- --seed-line-height-t14: clamp(calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-min, .8)), calc(3.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-max, 1.5)));
508
- --seed-line-height-t1-static: 15px;
509
- --seed-line-height-t2-static: 16px;
510
- --seed-line-height-t3-static: 18px;
511
- --seed-line-height-t4-static: 19px;
512
- --seed-line-height-t5-static: 22px;
513
- --seed-line-height-t6-static: 24px;
514
- --seed-line-height-t7-static: 27px;
515
- --seed-line-height-t8-static: 30px;
516
- --seed-line-height-t9-static: 32px;
517
- --seed-line-height-t10-static: 35px;
518
- --seed-line-height-t11-static: 38px;
519
- --seed-line-height-t12-static: 42px;
520
- --seed-line-height-t13-static: 52px;
521
- --seed-line-height-t14-static: 60px;
496
+ --seed-line-height-t1: clamp(calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-min, 1)), calc(.9375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-max, 1)));
497
+ --seed-line-height-t2: clamp(calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-min, 1)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-max, 1)));
498
+ --seed-line-height-t3: clamp(calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-min, 1)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-max, 1)));
499
+ --seed-line-height-t4: clamp(calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-min, 1)), calc(1.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-max, 1)));
500
+ --seed-line-height-t5: clamp(calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-min, 1)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-max, 1)));
501
+ --seed-line-height-t6: clamp(calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-min, 1)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-max, 1)));
502
+ --seed-line-height-t7: clamp(calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-min, 1)), calc(1.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-max, 1)));
503
+ --seed-line-height-t8: clamp(calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-min, 1)), calc(1.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-max, 1)));
504
+ --seed-line-height-t9: clamp(calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-min, 1)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-max, 1)));
505
+ --seed-line-height-t10: clamp(calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-min, 1)), calc(2.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-max, 1)));
506
+ --seed-line-height-t11: clamp(calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-min, 1)), calc(2.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-max, 1)));
507
+ --seed-line-height-t12: clamp(calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-min, 1)), calc(2.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-max, 1)));
508
+ --seed-line-height-t13: clamp(calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-min, 1)), calc(3.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-max, 1)));
509
+ --seed-line-height-t14: clamp(calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-min, 1)), calc(3.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-max, 1)));
510
+ --seed-line-height-t1-static: calc(15px / var(--seed-static-font-scale, 1));
511
+ --seed-line-height-t2-static: calc(16px / var(--seed-static-font-scale, 1));
512
+ --seed-line-height-t3-static: calc(18px / var(--seed-static-font-scale, 1));
513
+ --seed-line-height-t4-static: calc(19px / var(--seed-static-font-scale, 1));
514
+ --seed-line-height-t5-static: calc(22px / var(--seed-static-font-scale, 1));
515
+ --seed-line-height-t6-static: calc(24px / var(--seed-static-font-scale, 1));
516
+ --seed-line-height-t7-static: calc(27px / var(--seed-static-font-scale, 1));
517
+ --seed-line-height-t8-static: calc(30px / var(--seed-static-font-scale, 1));
518
+ --seed-line-height-t9-static: calc(32px / var(--seed-static-font-scale, 1));
519
+ --seed-line-height-t10-static: calc(35px / var(--seed-static-font-scale, 1));
520
+ --seed-line-height-t11-static: calc(38px / var(--seed-static-font-scale, 1));
521
+ --seed-line-height-t12-static: calc(42px / var(--seed-static-font-scale, 1));
522
+ --seed-line-height-t13-static: calc(52px / var(--seed-static-font-scale, 1));
523
+ --seed-line-height-t14-static: calc(60px / var(--seed-static-font-scale, 1));
522
524
  --seed-radius-r0_5: 2px;
523
525
  --seed-radius-r1: 4px;
524
526
  --seed-radius-r1_5: 6px;
@@ -739,6 +741,7 @@
739
741
  --seed-color-banner-teal: #e6faf6;
740
742
  --seed-color-banner-warm-gray: #f2f0ee;
741
743
  --seed-color-banner-yellow: #fffae1;
744
+ --seed-gradient-fade-mask: #0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;
742
745
  --seed-gradient-glow-magic: #fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;
743
746
  --seed-gradient-glow-magic-pressed: #fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;
744
747
  --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
@@ -950,6 +953,7 @@
950
953
  --seed-color-banner-teal: #143633;
951
954
  --seed-color-banner-warm-gray: #2f2b27;
952
955
  --seed-color-banner-yellow: #3e2b00;
956
+ --seed-gradient-fade-mask: #0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;
953
957
  --seed-gradient-glow-magic: #2d252d 0%, #3a312b 80%, #333232 100%;
954
958
  --seed-gradient-glow-magic-pressed: #3e333e 0%, #51453e 80%, #434242 100%;
955
959
  --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
package/base.layered.css CHANGED
@@ -19,11 +19,13 @@
19
19
  }
20
20
 
21
21
  :root {
22
+ --seed-font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard Variable", Pretendard, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
22
23
  --seed-font-size-multiplier: 1;
23
24
  --seed-font-size-limit-min: .8;
24
25
  --seed-font-size-limit-max: 1.5;
25
26
  --seed-line-height-limit-min: .8;
26
27
  --seed-line-height-limit-max: 1.5;
28
+ --seed-static-font-scale: 1;
27
29
  --seed-feedback-scale: 1;
28
30
  --seed-feedback-scale-transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
29
31
  }
@@ -461,65 +463,65 @@
461
463
  --seed-duration-d6: .3s;
462
464
  --seed-duration-color-transition: var(--seed-duration-d3);
463
465
  --seed-duration-pressed-scale: var(--seed-duration-d3);
464
- --seed-font-size-t1: clamp(calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-min, .8)), calc(.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-max, 1.5)));
465
- --seed-font-size-t2: clamp(calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-min, .8)), calc(.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-max, 1.5)));
466
- --seed-font-size-t3: clamp(calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-min, .8)), calc(.8125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-max, 1.5)));
467
- --seed-font-size-t4: clamp(calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-min, .8)), calc(.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-max, 1.5)));
468
- --seed-font-size-t5: clamp(calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-min, .8)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-max, 1.5)));
469
- --seed-font-size-t6: clamp(calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-min, .8)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-max, 1.5)));
470
- --seed-font-size-t7: clamp(calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-min, .8)), calc(1.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-max, 1.5)));
471
- --seed-font-size-t8: clamp(calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-min, .8)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-max, 1.5)));
472
- --seed-font-size-t9: clamp(calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-min, .8)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-max, 1.5)));
473
- --seed-font-size-t10: clamp(calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-min, .8)), calc(1.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-max, 1.5)));
474
- --seed-font-size-t11: clamp(calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-min, .8)), calc(1.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-max, 1.5)));
475
- --seed-font-size-t12: clamp(calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-min, .8)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-max, 1.5)));
476
- --seed-font-size-t13: clamp(calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-min, .8)), calc(2.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-max, 1.5)));
477
- --seed-font-size-t14: clamp(calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-min, .8)), calc(3rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-max, 1.5)));
478
- --seed-font-size-t1-static: 11px;
479
- --seed-font-size-t2-static: 12px;
480
- --seed-font-size-t3-static: 13px;
481
- --seed-font-size-t4-static: 14px;
482
- --seed-font-size-t5-static: 16px;
483
- --seed-font-size-t6-static: 18px;
484
- --seed-font-size-t7-static: 20px;
485
- --seed-font-size-t8-static: 22px;
486
- --seed-font-size-t9-static: 24px;
487
- --seed-font-size-t10-static: 26px;
488
- --seed-font-size-t11-static: 28px;
489
- --seed-font-size-t12-static: 32px;
490
- --seed-font-size-t13-static: 40px;
491
- --seed-font-size-t14-static: 48px;
466
+ --seed-font-size-t1: clamp(calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-min, 1)), calc(.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-max, 1)));
467
+ --seed-font-size-t2: clamp(calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-min, 1)), calc(.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-max, 1)));
468
+ --seed-font-size-t3: clamp(calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-min, 1)), calc(.8125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-max, 1)));
469
+ --seed-font-size-t4: clamp(calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-min, 1)), calc(.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t4-static) * var(--seed-font-size-limit-max, 1)));
470
+ --seed-font-size-t5: clamp(calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-min, 1)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t5-static) * var(--seed-font-size-limit-max, 1)));
471
+ --seed-font-size-t6: clamp(calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-min, 1)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t6-static) * var(--seed-font-size-limit-max, 1)));
472
+ --seed-font-size-t7: clamp(calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-min, 1)), calc(1.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t7-static) * var(--seed-font-size-limit-max, 1)));
473
+ --seed-font-size-t8: clamp(calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-min, 1)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t8-static) * var(--seed-font-size-limit-max, 1)));
474
+ --seed-font-size-t9: clamp(calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-min, 1)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t9-static) * var(--seed-font-size-limit-max, 1)));
475
+ --seed-font-size-t10: clamp(calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-min, 1)), calc(1.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t10-static) * var(--seed-font-size-limit-max, 1)));
476
+ --seed-font-size-t11: clamp(calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-min, 1)), calc(1.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t11-static) * var(--seed-font-size-limit-max, 1)));
477
+ --seed-font-size-t12: clamp(calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-min, 1)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t12-static) * var(--seed-font-size-limit-max, 1)));
478
+ --seed-font-size-t13: clamp(calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-min, 1)), calc(2.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t13-static) * var(--seed-font-size-limit-max, 1)));
479
+ --seed-font-size-t14: clamp(calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-min, 1)), calc(3rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t14-static) * var(--seed-font-size-limit-max, 1)));
480
+ --seed-font-size-t1-static: calc(11px / var(--seed-static-font-scale, 1));
481
+ --seed-font-size-t2-static: calc(12px / var(--seed-static-font-scale, 1));
482
+ --seed-font-size-t3-static: calc(13px / var(--seed-static-font-scale, 1));
483
+ --seed-font-size-t4-static: calc(14px / var(--seed-static-font-scale, 1));
484
+ --seed-font-size-t5-static: calc(16px / var(--seed-static-font-scale, 1));
485
+ --seed-font-size-t6-static: calc(18px / var(--seed-static-font-scale, 1));
486
+ --seed-font-size-t7-static: calc(20px / var(--seed-static-font-scale, 1));
487
+ --seed-font-size-t8-static: calc(22px / var(--seed-static-font-scale, 1));
488
+ --seed-font-size-t9-static: calc(24px / var(--seed-static-font-scale, 1));
489
+ --seed-font-size-t10-static: calc(26px / var(--seed-static-font-scale, 1));
490
+ --seed-font-size-t11-static: calc(28px / var(--seed-static-font-scale, 1));
491
+ --seed-font-size-t12-static: calc(32px / var(--seed-static-font-scale, 1));
492
+ --seed-font-size-t13-static: calc(40px / var(--seed-static-font-scale, 1));
493
+ --seed-font-size-t14-static: calc(48px / var(--seed-static-font-scale, 1));
492
494
  --seed-font-weight-regular: 400;
493
495
  --seed-font-weight-medium: 500;
494
496
  --seed-font-weight-bold: 700;
495
- --seed-line-height-t1: clamp(calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-min, .8)), calc(.9375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-max, 1.5)));
496
- --seed-line-height-t2: clamp(calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-min, .8)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-max, 1.5)));
497
- --seed-line-height-t3: clamp(calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-min, .8)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-max, 1.5)));
498
- --seed-line-height-t4: clamp(calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-min, .8)), calc(1.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-max, 1.5)));
499
- --seed-line-height-t5: clamp(calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-min, .8)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-max, 1.5)));
500
- --seed-line-height-t6: clamp(calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-min, .8)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-max, 1.5)));
501
- --seed-line-height-t7: clamp(calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-min, .8)), calc(1.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-max, 1.5)));
502
- --seed-line-height-t8: clamp(calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-min, .8)), calc(1.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-max, 1.5)));
503
- --seed-line-height-t9: clamp(calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-min, .8)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-max, 1.5)));
504
- --seed-line-height-t10: clamp(calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-min, .8)), calc(2.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-max, 1.5)));
505
- --seed-line-height-t11: clamp(calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-min, .8)), calc(2.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-max, 1.5)));
506
- --seed-line-height-t12: clamp(calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-min, .8)), calc(2.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-max, 1.5)));
507
- --seed-line-height-t13: clamp(calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-min, .8)), calc(3.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-max, 1.5)));
508
- --seed-line-height-t14: clamp(calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-min, .8)), calc(3.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-max, 1.5)));
509
- --seed-line-height-t1-static: 15px;
510
- --seed-line-height-t2-static: 16px;
511
- --seed-line-height-t3-static: 18px;
512
- --seed-line-height-t4-static: 19px;
513
- --seed-line-height-t5-static: 22px;
514
- --seed-line-height-t6-static: 24px;
515
- --seed-line-height-t7-static: 27px;
516
- --seed-line-height-t8-static: 30px;
517
- --seed-line-height-t9-static: 32px;
518
- --seed-line-height-t10-static: 35px;
519
- --seed-line-height-t11-static: 38px;
520
- --seed-line-height-t12-static: 42px;
521
- --seed-line-height-t13-static: 52px;
522
- --seed-line-height-t14-static: 60px;
497
+ --seed-line-height-t1: clamp(calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-min, 1)), calc(.9375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t1-static) * var(--seed-line-height-limit-max, 1)));
498
+ --seed-line-height-t2: clamp(calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-min, 1)), calc(1rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t2-static) * var(--seed-line-height-limit-max, 1)));
499
+ --seed-line-height-t3: clamp(calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-min, 1)), calc(1.125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t3-static) * var(--seed-line-height-limit-max, 1)));
500
+ --seed-line-height-t4: clamp(calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-min, 1)), calc(1.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t4-static) * var(--seed-line-height-limit-max, 1)));
501
+ --seed-line-height-t5: clamp(calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-min, 1)), calc(1.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t5-static) * var(--seed-line-height-limit-max, 1)));
502
+ --seed-line-height-t6: clamp(calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-min, 1)), calc(1.5rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t6-static) * var(--seed-line-height-limit-max, 1)));
503
+ --seed-line-height-t7: clamp(calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-min, 1)), calc(1.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t7-static) * var(--seed-line-height-limit-max, 1)));
504
+ --seed-line-height-t8: clamp(calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-min, 1)), calc(1.875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t8-static) * var(--seed-line-height-limit-max, 1)));
505
+ --seed-line-height-t9: clamp(calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-min, 1)), calc(2rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t9-static) * var(--seed-line-height-limit-max, 1)));
506
+ --seed-line-height-t10: clamp(calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-min, 1)), calc(2.1875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t10-static) * var(--seed-line-height-limit-max, 1)));
507
+ --seed-line-height-t11: clamp(calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-min, 1)), calc(2.375rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t11-static) * var(--seed-line-height-limit-max, 1)));
508
+ --seed-line-height-t12: clamp(calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-min, 1)), calc(2.625rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t12-static) * var(--seed-line-height-limit-max, 1)));
509
+ --seed-line-height-t13: clamp(calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-min, 1)), calc(3.25rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t13-static) * var(--seed-line-height-limit-max, 1)));
510
+ --seed-line-height-t14: clamp(calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-min, 1)), calc(3.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-line-height-t14-static) * var(--seed-line-height-limit-max, 1)));
511
+ --seed-line-height-t1-static: calc(15px / var(--seed-static-font-scale, 1));
512
+ --seed-line-height-t2-static: calc(16px / var(--seed-static-font-scale, 1));
513
+ --seed-line-height-t3-static: calc(18px / var(--seed-static-font-scale, 1));
514
+ --seed-line-height-t4-static: calc(19px / var(--seed-static-font-scale, 1));
515
+ --seed-line-height-t5-static: calc(22px / var(--seed-static-font-scale, 1));
516
+ --seed-line-height-t6-static: calc(24px / var(--seed-static-font-scale, 1));
517
+ --seed-line-height-t7-static: calc(27px / var(--seed-static-font-scale, 1));
518
+ --seed-line-height-t8-static: calc(30px / var(--seed-static-font-scale, 1));
519
+ --seed-line-height-t9-static: calc(32px / var(--seed-static-font-scale, 1));
520
+ --seed-line-height-t10-static: calc(35px / var(--seed-static-font-scale, 1));
521
+ --seed-line-height-t11-static: calc(38px / var(--seed-static-font-scale, 1));
522
+ --seed-line-height-t12-static: calc(42px / var(--seed-static-font-scale, 1));
523
+ --seed-line-height-t13-static: calc(52px / var(--seed-static-font-scale, 1));
524
+ --seed-line-height-t14-static: calc(60px / var(--seed-static-font-scale, 1));
523
525
  --seed-radius-r0_5: 2px;
524
526
  --seed-radius-r1: 4px;
525
527
  --seed-radius-r1_5: 6px;
@@ -740,6 +742,7 @@
740
742
  --seed-color-banner-teal: #e6faf6;
741
743
  --seed-color-banner-warm-gray: #f2f0ee;
742
744
  --seed-color-banner-yellow: #fffae1;
745
+ --seed-gradient-fade-mask: #0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;
743
746
  --seed-gradient-glow-magic: #fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;
744
747
  --seed-gradient-glow-magic-pressed: #fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;
745
748
  --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
@@ -951,6 +954,7 @@
951
954
  --seed-color-banner-teal: #143633;
952
955
  --seed-color-banner-warm-gray: #2f2b27;
953
956
  --seed-color-banner-yellow: #3e2b00;
957
+ --seed-gradient-fade-mask: #0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;
954
958
  --seed-gradient-glow-magic: #2d252d 0%, #3a312b 80%, #333232 100%;
955
959
  --seed-gradient-glow-magic-pressed: #3e333e 0%, #51453e 80%, #434242 100%;
956
960
  --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;