@seed-design/css 0.0.39 → 0.1.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 (26) hide show
  1. package/all.css +48 -25
  2. package/all.min.css +1 -1
  3. package/base.css +16 -16
  4. package/base.min.css +1 -1
  5. package/package.json +1 -1
  6. package/recipes/bottom-sheet.css +2 -2
  7. package/recipes/callout.css +7 -7
  8. package/recipes/help-bubble.css +1 -0
  9. package/recipes/skeleton.css +12 -2
  10. package/recipes/skeleton.d.ts +4 -0
  11. package/recipes/skeleton.mjs +6 -1
  12. package/recipes/text.css +6 -0
  13. package/recipes/text.d.ts +4 -0
  14. package/recipes/text.mjs +6 -1
  15. package/vars/color/bg.d.ts +1 -4
  16. package/vars/color/bg.mjs +1 -4
  17. package/vars/color/fg.d.ts +0 -2
  18. package/vars/color/fg.mjs +0 -2
  19. package/vars/component/bottom-sheet.d.ts +2 -2
  20. package/vars/component/bottom-sheet.mjs +2 -2
  21. package/vars/component/callout.d.ts +7 -7
  22. package/vars/component/callout.mjs +7 -7
  23. package/vars/component/skeleton.d.ts +21 -5
  24. package/vars/component/skeleton.mjs +21 -5
  25. package/vars/gradient.d.ts +6 -1
  26. package/vars/gradient.mjs +6 -1
package/base.css CHANGED
@@ -63,7 +63,7 @@
63
63
  .seed-box {
64
64
  --seed-box-background: initial;
65
65
  --seed-box-color: initial;
66
- background-color: var(--seed-box-background);
66
+ background: var(--seed-box-background);
67
67
  color: var(--seed-box-color);
68
68
  --seed-box-border-style: solid;
69
69
  --seed-box-border-color: initial;
@@ -160,7 +160,7 @@
160
160
 
161
161
  .seed-box:is(:active, [data-active]) {
162
162
  --seed-box-background--active: var(--seed-box-background);
163
- background-color: var(--seed-box-background--active);
163
+ background: var(--seed-box-background--active);
164
164
  }
165
165
 
166
166
  .seed-consistent-width:before {
@@ -367,13 +367,11 @@
367
367
  --seed-color-fg-critical: var(--seed-color-palette-red-700);
368
368
  --seed-color-fg-disabled: var(--seed-color-palette-gray-500);
369
369
  --seed-color-fg-informative: var(--seed-color-palette-blue-700);
370
- --seed-color-fg-magic: var(--seed-color-palette-purple-700);
371
370
  --seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
372
371
  --seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
373
372
  --seed-color-fg-positive: var(--seed-color-palette-green-700);
374
373
  --seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
375
374
  --seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
376
- --seed-color-fg-magic-contrast: var(--seed-color-palette-purple-900);
377
375
  --seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-00);
378
376
  --seed-color-fg-neutral-muted: var(--seed-color-palette-gray-800);
379
377
  --seed-color-fg-neutral-subtle: var(--seed-color-palette-gray-700);
@@ -382,6 +380,7 @@
382
380
  --seed-color-bg-disabled: var(--seed-color-palette-gray-200);
383
381
  --seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
384
382
  --seed-color-bg-brand-solid: var(--seed-color-palette-carrot-600);
383
+ --seed-color-bg-magic-weak: #f9f2ee;
385
384
  --seed-color-bg-brand-solid-pressed: var(--seed-color-palette-carrot-700);
386
385
  --seed-color-bg-critical-solid: var(--seed-color-palette-red-700);
387
386
  --seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
@@ -397,10 +396,6 @@
397
396
  --seed-color-bg-layer-floating: var(--seed-color-palette-gray-00);
398
397
  --seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-100);
399
398
  --seed-color-bg-layer-floating-pressed: var(--seed-color-palette-gray-100);
400
- --seed-color-bg-magic-solid: var(--seed-color-palette-purple-700);
401
- --seed-color-bg-magic-weak: var(--seed-color-palette-purple-100);
402
- --seed-color-bg-magic-solid-pressed: var(--seed-color-palette-purple-800);
403
- --seed-color-bg-magic-weak-pressed: var(--seed-color-palette-purple-200);
404
399
  --seed-color-bg-neutral-inverted: var(--seed-color-palette-gray-900);
405
400
  --seed-color-bg-neutral-solid: var(--seed-color-palette-gray-1000);
406
401
  --seed-color-bg-neutral-weak: var(--seed-color-palette-gray-200);
@@ -438,7 +433,12 @@
438
433
  --seed-color-manner-temp-l5-text: #d28500;
439
434
  --seed-color-manner-temp-l6-bg: #fff0e5;
440
435
  --seed-color-manner-temp-l6-text: #f06000;
441
- --seed-gradient-shimmer: #fff0 0%, #fff6 46%, #fff6 54%, #fff0 100%;
436
+ --seed-gradient-shimmer-neutral: #fff0 0%, #fff6 46%, #fff6 54%, #fff0 100%;
437
+ --seed-gradient-shimmer-magic: #fef0e700 0%, #fef0e78a 46%, #fef0e78a 54%, #fef0e700 100%;
438
+ --seed-gradient-fade-neutral: #fff 0%, #fff0 100%;
439
+ --seed-gradient-glow-magic: #fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;
440
+ --seed-gradient-glow-magic-pressed: #fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;
441
+ --seed-gradient-highlight-magic: #f60 20%, #d25aca 80%;
442
442
  }
443
443
 
444
444
  :root[data-seed-color-mode="system"][data-seed-user-color-scheme="dark"], :root[data-seed-color-mode="dark-only"], :root [data-seed-color-mode="dark-only"] {
@@ -540,13 +540,11 @@
540
540
  --seed-color-fg-critical: var(--seed-color-palette-red-700);
541
541
  --seed-color-fg-disabled: var(--seed-color-palette-gray-500);
542
542
  --seed-color-fg-informative: var(--seed-color-palette-blue-700);
543
- --seed-color-fg-magic: var(--seed-color-palette-purple-700);
544
543
  --seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
545
544
  --seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
546
545
  --seed-color-fg-positive: var(--seed-color-palette-green-700);
547
546
  --seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
548
547
  --seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
549
- --seed-color-fg-magic-contrast: var(--seed-color-palette-purple-900);
550
548
  --seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-100);
551
549
  --seed-color-fg-neutral-muted: var(--seed-color-palette-gray-800);
552
550
  --seed-color-fg-neutral-subtle: var(--seed-color-palette-gray-700);
@@ -555,6 +553,7 @@
555
553
  --seed-color-bg-disabled: var(--seed-color-palette-gray-300);
556
554
  --seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
557
555
  --seed-color-bg-brand-solid: var(--seed-color-palette-carrot-700);
556
+ --seed-color-bg-magic-weak: #201f1f;
558
557
  --seed-color-bg-brand-solid-pressed: var(--seed-color-palette-carrot-800);
559
558
  --seed-color-bg-critical-solid: var(--seed-color-palette-red-600);
560
559
  --seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
@@ -570,10 +569,6 @@
570
569
  --seed-color-bg-layer-floating: var(--seed-color-palette-gray-200);
571
570
  --seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-300);
572
571
  --seed-color-bg-layer-floating-pressed: var(--seed-color-palette-gray-300);
573
- --seed-color-bg-magic-solid: var(--seed-color-palette-purple-600);
574
- --seed-color-bg-magic-weak: var(--seed-color-palette-purple-100);
575
- --seed-color-bg-magic-solid-pressed: var(--seed-color-palette-purple-700);
576
- --seed-color-bg-magic-weak-pressed: var(--seed-color-palette-purple-200);
577
572
  --seed-color-bg-neutral-inverted: var(--seed-color-palette-gray-1000);
578
573
  --seed-color-bg-neutral-solid: var(--seed-color-palette-gray-300);
579
574
  --seed-color-bg-neutral-weak: var(--seed-color-palette-gray-300);
@@ -611,7 +606,12 @@
611
606
  --seed-color-manner-temp-l5-text: #ffa100;
612
607
  --seed-color-manner-temp-l6-bg: #2e1d12;
613
608
  --seed-color-manner-temp-l6-text: #ff9147;
614
- --seed-gradient-shimmer: #fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;
609
+ --seed-gradient-shimmer-neutral: #fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;
610
+ --seed-gradient-shimmer-magic: #fef0e700 0%, #fef0e71a 46%, #fef0e71a 54%, #fef0e700 100%;
611
+ --seed-gradient-fade-neutral: #1d2025 0%, #1d202500 100%;
612
+ --seed-gradient-glow-magic: #2d252d 0%, #3a312b 80%, #333232 100%;
613
+ --seed-gradient-glow-magic-pressed: #3e333e 0%, #51453e 80%, #434242 100%;
614
+ --seed-gradient-highlight-magic: #ff6000 20%, #d25aca 80%;
615
615
  }
616
616
 
617
617
  @keyframes seed-enter {
package/base.min.css CHANGED
@@ -1 +1 @@
1
- :root{--seed-safe-area-top:0px;--seed-safe-area-bottom:0px}@supports (left:constant(safe-area-inset-left)){:root{--seed-safe-area-top:constant(safe-area-inset-top);--seed-safe-area-bottom:constant(safe-area-inset-bottom)}}@supports (left:env(safe-area-inset-left)){:root{--seed-safe-area-top:env(safe-area-inset-top);--seed-safe-area-bottom:env(safe-area-inset-bottom)}}.seed-loading-indicator{display:inline-flex;position:absolute}.seed-icon,.seed-prefix-icon,.seed-suffix-icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.seed-icon{width:var(--seed-icon-size);height:var(--seed-icon-size);color:var(--seed-icon-color,currentColor)}.seed-prefix-icon{width:var(--seed-prefix-icon-size);height:var(--seed-prefix-icon-size);margin-left:var(--seed-prefix-icon-margin-left);margin-right:var(--seed-prefix-icon-margin-right);margin-top:var(--seed-prefix-icon-margin-top);color:var(--seed-prefix-icon-color,currentColor)}.seed-suffix-icon{width:var(--seed-suffix-icon-size);height:var(--seed-suffix-icon-size);margin-left:var(--seed-suffix-icon-margin-left);margin-right:var(--seed-suffix-icon-margin-right);margin-top:var(--seed-suffix-icon-margin-top);color:var(--seed-suffix-icon-color,currentColor)}.seed-count{font-size:var(--seed-count-font-size);line-height:var(--seed-count-line-height);font-weight:var(--seed-count-font-weight);color:var(--seed-count-color)}.seed-box{--seed-box-background:initial;--seed-box-color:initial;background-color:var(--seed-box-background);color:var(--seed-box-color);--seed-box-border-style:solid;--seed-box-border-color:initial;border-style:var(--seed-box-border-style);border-color:var(--seed-box-border-color);--seed-box-border-width:0;--seed-box-border-top-width:var(--seed-box-border-width);--seed-box-border-bottom-width:var(--seed-box-border-width);--seed-box-border-left-width:var(--seed-box-border-width);--seed-box-border-right-width:var(--seed-box-border-width);border-top-width:var(--seed-box-border-top-width);border-bottom-width:var(--seed-box-border-bottom-width);border-left-width:var(--seed-box-border-left-width);border-right-width:var(--seed-box-border-right-width);--seed-box-padding:0;--seed-box-padding-y:var(--seed-box-padding);--seed-box-padding-x:var(--seed-box-padding);--seed-box-padding-bottom:var(--seed-box-padding-y);--seed-box-padding-top:var(--seed-box-padding-y);--seed-box-padding-left:var(--seed-box-padding-x);--seed-box-padding-right:var(--seed-box-padding-x);padding-top:var(--seed-box-padding-top);padding-bottom:var(--seed-box-padding-bottom);padding-left:var(--seed-box-padding-left);padding-right:var(--seed-box-padding-right);--seed-box-bleed-bottom:initial;--seed-box-bleed-top:initial;--seed-box-bleed-left:initial;--seed-box-bleed-right:initial;margin-top:calc(var(--seed-box-bleed-top)*-1);margin-bottom:calc(var(--seed-box-bleed-bottom)*-1);margin-left:calc(var(--seed-box-bleed-left)*-1);margin-right:calc(var(--seed-box-bleed-right)*-1);--seed-box-min-height:initial;--seed-box-max-height:initial;--seed-box-height:initial;--seed-box-min-width:initial;--seed-box-max-width:initial;--seed-box-width:initial;min-height:var(--seed-box-min-height);max-height:var(--seed-box-max-height);height:var(--seed-box-height);min-width:var(--seed-box-min-width);max-width:var(--seed-box-max-width);width:var(--seed-box-width);--seed-box-top:initial;--seed-box-bottom:initial;--seed-box-left:initial;--seed-box-right:initial;top:var(--seed-box-top);bottom:var(--seed-box-bottom);left:var(--seed-box-left);right:var(--seed-box-right);--seed-box-border-radius:initial;--seed-box-border-bottom-left-radius:var(--seed-box-border-radius);--seed-box-border-bottom-right-radius:var(--seed-box-border-radius);--seed-box-border-top-left-radius:var(--seed-box-border-radius);--seed-box-border-top-right-radius:var(--seed-box-border-radius);border-bottom-left-radius:var(--seed-box-border-bottom-left-radius);border-bottom-right-radius:var(--seed-box-border-bottom-right-radius);border-top-left-radius:var(--seed-box-border-top-left-radius);border-top-right-radius:var(--seed-box-border-top-right-radius);--seed-box-display:block;--seed-box-position:initial;display:var(--seed-box-display);position:var(--seed-box-position);--seed-box-unstable-transform:initial;transform:var(--seed-box-unstable-transform);--seed-box-z-index:initial;z-index:var(--seed-box-z-index);--seed-box-overflow-x:initial;--seed-box-overflow-y:initial;overflow-x:var(--seed-box-overflow-x);overflow-y:var(--seed-box-overflow-y);--seed-box-flex-grow:initial;--seed-box-flex-shrink:initial;flex-grow:var(--seed-box-flex-grow);flex-shrink:var(--seed-box-flex-shrink);--seed-box-flex-direction:initial;--seed-box-flex-wrap:initial;--seed-box-justify-content:initial;--seed-box-align-items:stretch;--seed-box-align-content:stretch;--seed-box-align-self:auto;--seed-box-gap:initial;flex-direction:var(--seed-box-flex-direction);flex-wrap:var(--seed-box-flex-wrap);justify-content:var(--seed-box-justify-content);align-items:var(--seed-box-align-items);align-content:var(--seed-box-align-content);align-self:var(--seed-box-align-self);gap:var(--seed-box-gap)}.seed-box:is(:active,[data-active]){--seed-box-background--active:var(--seed-box-background);background-color:var(--seed-box-background--active)}.seed-consistent-width:before{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-regular);display:block}.seed-consistent-width:after{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-bold);display:block}:root,[data-seed-color-mode=system]{color-scheme:light dark}[data-seed-color-mode=light-only]{color-scheme:light}[data-seed-color-mode=dark-only]{color-scheme:dark}:root{--seed-dimension-x0_5:2px;--seed-dimension-x1:4px;--seed-dimension-x1_5:6px;--seed-dimension-x2:8px;--seed-dimension-x2_5:10px;--seed-dimension-x3:12px;--seed-dimension-x3_5:14px;--seed-dimension-x4:16px;--seed-dimension-x4_5:18px;--seed-dimension-x5:20px;--seed-dimension-x6:24px;--seed-dimension-x7:28px;--seed-dimension-x8:32px;--seed-dimension-x9:36px;--seed-dimension-x10:40px;--seed-dimension-x12:48px;--seed-dimension-x13:52px;--seed-dimension-x14:56px;--seed-dimension-x16:64px;--seed-dimension-spacing-x-between-chips:var(--seed-dimension-x2);--seed-dimension-spacing-x-global-gutter:var(--seed-dimension-x4);--seed-dimension-spacing-y-component-default:var(--seed-dimension-x3);--seed-dimension-spacing-y-nav-to-title:var(--seed-dimension-x5);--seed-dimension-spacing-y-screen-bottom:var(--seed-dimension-x14);--seed-dimension-spacing-y-between-text:var(--seed-dimension-x1_5);--seed-duration-d1:50ms;--seed-duration-d2:.1s;--seed-duration-d3:.15s;--seed-duration-d4:.2s;--seed-duration-d5:.25s;--seed-duration-d6:.3s;--seed-font-size-t1:.6875rem;--seed-font-size-t2:.75rem;--seed-font-size-t3:.8125rem;--seed-font-size-t4:.875rem;--seed-font-size-t5:1rem;--seed-font-size-t6:1.125rem;--seed-font-size-t7:1.25rem;--seed-font-size-t8:1.375rem;--seed-font-size-t9:1.5rem;--seed-font-size-t10:1.625rem;--seed-font-size-t2-static:12px;--seed-font-size-t5-static:16px;--seed-font-size-t6-static:18px;--seed-font-weight-regular:400;--seed-font-weight-medium:500;--seed-font-weight-bold:700;--seed-line-height-t1:.9375rem;--seed-line-height-t2:1rem;--seed-line-height-t3:1.125rem;--seed-line-height-t4:1.1875rem;--seed-line-height-t5:1.375rem;--seed-line-height-t6:1.5rem;--seed-line-height-t7:1.6875rem;--seed-line-height-t8:1.875rem;--seed-line-height-t9:2rem;--seed-line-height-t10:2.1875rem;--seed-radius-r0_5:2px;--seed-radius-r1:4px;--seed-radius-r1_5:6px;--seed-radius-r2:8px;--seed-radius-r2_5:10px;--seed-radius-r3:12px;--seed-radius-r3_5:14px;--seed-radius-r4:16px;--seed-radius-r5:20px;--seed-radius-r6:24px;--seed-radius-full:9999px;--seed-timing-function-linear:cubic-bezier(0,0,1,1);--seed-timing-function-easing:cubic-bezier(.35,0,.35,1);--seed-timing-function-enter:cubic-bezier(0,0,.15,1);--seed-timing-function-exit:cubic-bezier(.35,0,1,1);--seed-timing-function-enter-expressive:cubic-bezier(.03,.4,.1,1);--seed-timing-function-exit-expressive:cubic-bezier(.35,0,.95,.55)}:root,:root[data-seed-color-mode=system][data-seed-user-color-scheme=light],:root[data-seed-color-mode=light-only],:root [data-seed-color-mode=light-only]{--seed-color-palette-blue-100:#eff6ff;--seed-color-palette-blue-200:#e2edfc;--seed-color-palette-blue-300:#cbdffa;--seed-color-palette-blue-400:#aacefd;--seed-color-palette-blue-500:#85b8fd;--seed-color-palette-blue-600:#5e98fe;--seed-color-palette-blue-700:#217cf9;--seed-color-palette-blue-800:#135fcd;--seed-color-palette-blue-900:#0b4596;--seed-color-palette-blue-1000:#032451;--seed-color-palette-carrot-100:#fff2ec;--seed-color-palette-carrot-200:#ffe8db;--seed-color-palette-carrot-300:#ffd5c0;--seed-color-palette-carrot-400:#ffb999;--seed-color-palette-carrot-500:#ff9364;--seed-color-palette-carrot-600:#f60;--seed-color-palette-carrot-700:#e14d00;--seed-color-palette-carrot-800:#b93901;--seed-color-palette-carrot-900:#862b00;--seed-color-palette-carrot-1000:#471601;--seed-color-palette-gray-00:#fff;--seed-color-palette-gray-100:#f7f8f9;--seed-color-palette-gray-200:#f3f4f5;--seed-color-palette-gray-300:#eeeff1;--seed-color-palette-gray-400:#dcdee3;--seed-color-palette-gray-500:#d1d3d8;--seed-color-palette-gray-600:#b0b3ba;--seed-color-palette-gray-700:#868b94;--seed-color-palette-gray-800:#555d6d;--seed-color-palette-gray-900:#2a3038;--seed-color-palette-gray-1000:#1a1c20;--seed-color-palette-green-100:#edfaf6;--seed-color-palette-green-200:#d9f6e9;--seed-color-palette-green-300:#b9e9d2;--seed-color-palette-green-400:#7ddcb3;--seed-color-palette-green-500:#42c593;--seed-color-palette-green-600:#10ab7d;--seed-color-palette-green-700:#079171;--seed-color-palette-green-800:#00745f;--seed-color-palette-green-900:#075445;--seed-color-palette-green-1000:#0a2b24;--seed-color-palette-purple-100:#f5f3fe;--seed-color-palette-purple-200:#efeafe;--seed-color-palette-purple-300:#e1d8ff;--seed-color-palette-purple-400:#d0c0ff;--seed-color-palette-purple-500:#b8a1ff;--seed-color-palette-purple-600:#9f84fb;--seed-color-palette-purple-700:#8969ea;--seed-color-palette-purple-800:#6d50cb;--seed-color-palette-purple-900:#50379b;--seed-color-palette-purple-1000:#29175d;--seed-color-palette-red-100:#fdf0f0;--seed-color-palette-red-200:#fde7e7;--seed-color-palette-red-300:#fed4d2;--seed-color-palette-red-400:#feb7b3;--seed-color-palette-red-500:#fe928d;--seed-color-palette-red-600:#fc6a66;--seed-color-palette-red-700:#fa342c;--seed-color-palette-red-800:#ca1d13;--seed-color-palette-red-900:#921708;--seed-color-palette-red-1000:#4a1209;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#fff7de;--seed-color-palette-yellow-200:#fdefb9;--seed-color-palette-yellow-300:#fbdc65;--seed-color-palette-yellow-400:#e9c647;--seed-color-palette-yellow-500:#d4ab28;--seed-color-palette-yellow-600:#c49725;--seed-color-palette-yellow-700:#9b7821;--seed-color-palette-yellow-800:#755b22;--seed-color-palette-yellow-900:#4f3e1f;--seed-color-palette-yellow-1000:#2c2512;--seed-color-fg-brand:var(--seed-color-palette-carrot-600);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-magic:var(--seed-color-palette-purple-700);--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-magic-contrast:var(--seed-color-palette-purple-900);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-00);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-disabled:var(--seed-color-palette-gray-200);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-600);--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-700);--seed-color-bg-critical-solid:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-800);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-800);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default:var(--seed-color-palette-gray-00);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-magic-solid:var(--seed-color-palette-purple-700);--seed-color-bg-magic-weak:var(--seed-color-palette-purple-100);--seed-color-bg-magic-solid-pressed:var(--seed-color-palette-purple-800);--seed-color-bg-magic-weak-pressed:var(--seed-color-palette-purple-200);--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-200);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-solid:var(--seed-color-palette-green-700);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-800);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-300);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-neutral:var(--seed-color-palette-gray-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-gray-200);--seed-color-stroke-on-image:var(--seed-color-palette-static-black-alpha-200);--seed-color-manner-temp-l1-bg:#eff0f1;--seed-color-manner-temp-l1-text:#62666a;--seed-color-manner-temp-l2-bg:#e7f2fc;--seed-color-manner-temp-l2-text:#2592f7;--seed-color-manner-temp-l3-bg:#e3f6fc;--seed-color-manner-temp-l3-text:#0099c8;--seed-color-manner-temp-l4-bg:#ebf9f4;--seed-color-manner-temp-l4-text:#03a07e;--seed-color-manner-temp-l5-bg:#fff5e5;--seed-color-manner-temp-l5-text:#d28500;--seed-color-manner-temp-l6-bg:#fff0e5;--seed-color-manner-temp-l6-text:#f06000;--seed-gradient-shimmer:#fff0 0%,#fff6 46%,#fff6 54%,#fff0 100%}:root[data-seed-color-mode=system][data-seed-user-color-scheme=dark],:root[data-seed-color-mode=dark-only],:root [data-seed-color-mode=dark-only]{--seed-color-palette-blue-100:#202742;--seed-color-palette-blue-200:#1e3352;--seed-color-palette-blue-300:#1a4275;--seed-color-palette-blue-400:#0f559e;--seed-color-palette-blue-500:#1964d8;--seed-color-palette-blue-600:#1e82eb;--seed-color-palette-blue-700:#41a2f9;--seed-color-palette-blue-800:#83bcf9;--seed-color-palette-blue-900:#b9d7fb;--seed-color-palette-blue-1000:#e5f0fe;--seed-color-palette-carrot-100:#31241f;--seed-color-palette-carrot-200:#4b291c;--seed-color-palette-carrot-300:#6b311c;--seed-color-palette-carrot-400:#923600;--seed-color-palette-carrot-500:#bd4201;--seed-color-palette-carrot-600:#e65200;--seed-color-palette-carrot-700:#f60;--seed-color-palette-carrot-800:#ff9e65;--seed-color-palette-carrot-900:#eecebc;--seed-color-palette-carrot-1000:#f4eeea;--seed-color-palette-gray-00:#000;--seed-color-palette-gray-100:#16171b;--seed-color-palette-gray-200:#1d2025;--seed-color-palette-gray-300:#2b2e35;--seed-color-palette-gray-400:#393d46;--seed-color-palette-gray-500:#5b606a;--seed-color-palette-gray-600:#868b94;--seed-color-palette-gray-700:#b0b3ba;--seed-color-palette-gray-800:#dcdee3;--seed-color-palette-gray-900:#e9eaec;--seed-color-palette-gray-1000:#f3f4f5;--seed-color-palette-green-100:#202926;--seed-color-palette-green-200:#20362e;--seed-color-palette-green-300:#20493b;--seed-color-palette-green-400:#19604c;--seed-color-palette-green-500:#117956;--seed-color-palette-green-600:#1b946d;--seed-color-palette-green-700:#22b27f;--seed-color-palette-green-800:#35ce9a;--seed-color-palette-green-900:#93e5c0;--seed-color-palette-green-1000:#d4f6ef;--seed-color-palette-purple-100:#28213b;--seed-color-palette-purple-200:#3b2873;--seed-color-palette-purple-300:#443081;--seed-color-palette-purple-400:#5a3bb1;--seed-color-palette-purple-500:#764fd9;--seed-color-palette-purple-600:#8e6bee;--seed-color-palette-purple-700:#a78df0;--seed-color-palette-purple-800:#beadf2;--seed-color-palette-purple-900:#d9cefa;--seed-color-palette-purple-1000:#f0edfc;--seed-color-palette-red-100:#322323;--seed-color-palette-red-200:#4f2624;--seed-color-palette-red-300:#742826;--seed-color-palette-red-400:#a12621;--seed-color-palette-red-500:#ca2319;--seed-color-palette-red-600:#f73526;--seed-color-palette-red-700:#ff6e60;--seed-color-palette-red-800:#ffa299;--seed-color-palette-red-900:#f8c5c3;--seed-color-palette-red-1000:#fdf2f2;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#302819;--seed-color-palette-yellow-200:#413218;--seed-color-palette-yellow-300:#543e15;--seed-color-palette-yellow-400:#714e15;--seed-color-palette-yellow-500:#91601b;--seed-color-palette-yellow-600:#b6720d;--seed-color-palette-yellow-700:#ca901c;--seed-color-palette-yellow-800:#dab156;--seed-color-palette-yellow-900:#e5d49b;--seed-color-palette-yellow-1000:#f7f0cd;--seed-color-fg-brand:var(--seed-color-palette-carrot-700);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-magic:var(--seed-color-palette-purple-700);--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-magic-contrast:var(--seed-color-palette-purple-900);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-100);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-disabled:var(--seed-color-palette-gray-300);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-700);--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-800);--seed-color-bg-critical-solid:var(--seed-color-palette-red-600);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-600);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default:var(--seed-color-palette-gray-100);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-200);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-magic-solid:var(--seed-color-palette-purple-600);--seed-color-bg-magic-weak:var(--seed-color-palette-purple-100);--seed-color-bg-magic-solid-pressed:var(--seed-color-palette-purple-700);--seed-color-bg-magic-weak-pressed:var(--seed-color-palette-purple-200);--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-400);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-500);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-400);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-solid:var(--seed-color-palette-green-500);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-500);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-600);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-neutral:var(--seed-color-palette-gray-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-gray-200);--seed-color-stroke-on-image:var(--seed-color-palette-static-black-alpha-200);--seed-color-manner-temp-l1-bg:#222226;--seed-color-manner-temp-l1-text:#b1b5b9;--seed-color-manner-temp-l2-bg:#16212b;--seed-color-manner-temp-l2-text:#7cbaf4;--seed-color-manner-temp-l3-bg:#12262c;--seed-color-manner-temp-l3-text:#47c3eb;--seed-color-manner-temp-l4-bg:#162822;--seed-color-manner-temp-l4-text:#33cc94;--seed-color-manner-temp-l5-bg:#2e2312;--seed-color-manner-temp-l5-text:#ffa100;--seed-color-manner-temp-l6-bg:#2e1d12;--seed-color-manner-temp-l6-text:#ff9147;--seed-gradient-shimmer:#fff0 0%,#ffffff1a 46%,#ffffff1a 54%,#fff0 100%}@keyframes seed-enter{0%{opacity:var(--seed-enter-opacity,1);transform:translate3d(var(--seed-enter-translate-x,0),var(--seed-enter-translate-y,0),0)scale3d(var(--seed-enter-scale,1),var(--seed-enter-scale,1),var(--seed-enter-scale,1))rotate(var(--seed-enter-rotate,0))}}@keyframes seed-exit{to{opacity:var(--seed-exit-opacity,1);transform:translate3d(var(--seed-exit-translate-x,0),var(--seed-exit-translate-y,0),0)scale3d(var(--seed-exit-scale,1),var(--seed-exit-scale,1),var(--seed-exit-scale,1))rotate(var(--seed-exit-rotate,0))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slide-x{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes progress-circle-head{0%{stroke-dasharray:0 1000%}75%{stroke-dasharray:var(--circumference),1000%}to{stroke-dasharray:var(--circumference),1000%}}@keyframes progress-circle-tail{0%{stroke-dashoffset:0}33.33%{stroke-dashoffset:0}to{stroke-dashoffset:calc(var(--circumference)*-1)}}
1
+ :root{--seed-safe-area-top:0px;--seed-safe-area-bottom:0px}@supports (left:constant(safe-area-inset-left)){:root{--seed-safe-area-top:constant(safe-area-inset-top);--seed-safe-area-bottom:constant(safe-area-inset-bottom)}}@supports (left:env(safe-area-inset-left)){:root{--seed-safe-area-top:env(safe-area-inset-top);--seed-safe-area-bottom:env(safe-area-inset-bottom)}}.seed-loading-indicator{display:inline-flex;position:absolute}.seed-icon,.seed-prefix-icon,.seed-suffix-icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.seed-icon{width:var(--seed-icon-size);height:var(--seed-icon-size);color:var(--seed-icon-color,currentColor)}.seed-prefix-icon{width:var(--seed-prefix-icon-size);height:var(--seed-prefix-icon-size);margin-left:var(--seed-prefix-icon-margin-left);margin-right:var(--seed-prefix-icon-margin-right);margin-top:var(--seed-prefix-icon-margin-top);color:var(--seed-prefix-icon-color,currentColor)}.seed-suffix-icon{width:var(--seed-suffix-icon-size);height:var(--seed-suffix-icon-size);margin-left:var(--seed-suffix-icon-margin-left);margin-right:var(--seed-suffix-icon-margin-right);margin-top:var(--seed-suffix-icon-margin-top);color:var(--seed-suffix-icon-color,currentColor)}.seed-count{font-size:var(--seed-count-font-size);line-height:var(--seed-count-line-height);font-weight:var(--seed-count-font-weight);color:var(--seed-count-color)}.seed-box{--seed-box-background:initial;--seed-box-color:initial;background:var(--seed-box-background);color:var(--seed-box-color);--seed-box-border-style:solid;--seed-box-border-color:initial;border-style:var(--seed-box-border-style);border-color:var(--seed-box-border-color);--seed-box-border-width:0;--seed-box-border-top-width:var(--seed-box-border-width);--seed-box-border-bottom-width:var(--seed-box-border-width);--seed-box-border-left-width:var(--seed-box-border-width);--seed-box-border-right-width:var(--seed-box-border-width);border-top-width:var(--seed-box-border-top-width);border-bottom-width:var(--seed-box-border-bottom-width);border-left-width:var(--seed-box-border-left-width);border-right-width:var(--seed-box-border-right-width);--seed-box-padding:0;--seed-box-padding-y:var(--seed-box-padding);--seed-box-padding-x:var(--seed-box-padding);--seed-box-padding-bottom:var(--seed-box-padding-y);--seed-box-padding-top:var(--seed-box-padding-y);--seed-box-padding-left:var(--seed-box-padding-x);--seed-box-padding-right:var(--seed-box-padding-x);padding-top:var(--seed-box-padding-top);padding-bottom:var(--seed-box-padding-bottom);padding-left:var(--seed-box-padding-left);padding-right:var(--seed-box-padding-right);--seed-box-bleed-bottom:initial;--seed-box-bleed-top:initial;--seed-box-bleed-left:initial;--seed-box-bleed-right:initial;margin-top:calc(var(--seed-box-bleed-top)*-1);margin-bottom:calc(var(--seed-box-bleed-bottom)*-1);margin-left:calc(var(--seed-box-bleed-left)*-1);margin-right:calc(var(--seed-box-bleed-right)*-1);--seed-box-min-height:initial;--seed-box-max-height:initial;--seed-box-height:initial;--seed-box-min-width:initial;--seed-box-max-width:initial;--seed-box-width:initial;min-height:var(--seed-box-min-height);max-height:var(--seed-box-max-height);height:var(--seed-box-height);min-width:var(--seed-box-min-width);max-width:var(--seed-box-max-width);width:var(--seed-box-width);--seed-box-top:initial;--seed-box-bottom:initial;--seed-box-left:initial;--seed-box-right:initial;top:var(--seed-box-top);bottom:var(--seed-box-bottom);left:var(--seed-box-left);right:var(--seed-box-right);--seed-box-border-radius:initial;--seed-box-border-bottom-left-radius:var(--seed-box-border-radius);--seed-box-border-bottom-right-radius:var(--seed-box-border-radius);--seed-box-border-top-left-radius:var(--seed-box-border-radius);--seed-box-border-top-right-radius:var(--seed-box-border-radius);border-bottom-left-radius:var(--seed-box-border-bottom-left-radius);border-bottom-right-radius:var(--seed-box-border-bottom-right-radius);border-top-left-radius:var(--seed-box-border-top-left-radius);border-top-right-radius:var(--seed-box-border-top-right-radius);--seed-box-display:block;--seed-box-position:initial;display:var(--seed-box-display);position:var(--seed-box-position);--seed-box-unstable-transform:initial;transform:var(--seed-box-unstable-transform);--seed-box-z-index:initial;z-index:var(--seed-box-z-index);--seed-box-overflow-x:initial;--seed-box-overflow-y:initial;overflow-x:var(--seed-box-overflow-x);overflow-y:var(--seed-box-overflow-y);--seed-box-flex-grow:initial;--seed-box-flex-shrink:initial;flex-grow:var(--seed-box-flex-grow);flex-shrink:var(--seed-box-flex-shrink);--seed-box-flex-direction:initial;--seed-box-flex-wrap:initial;--seed-box-justify-content:initial;--seed-box-align-items:stretch;--seed-box-align-content:stretch;--seed-box-align-self:auto;--seed-box-gap:initial;flex-direction:var(--seed-box-flex-direction);flex-wrap:var(--seed-box-flex-wrap);justify-content:var(--seed-box-justify-content);align-items:var(--seed-box-align-items);align-content:var(--seed-box-align-content);align-self:var(--seed-box-align-self);gap:var(--seed-box-gap)}.seed-box:is(:active,[data-active]){--seed-box-background--active:var(--seed-box-background);background:var(--seed-box-background--active)}.seed-consistent-width:before{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-regular);display:block}.seed-consistent-width:after{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-bold);display:block}:root,[data-seed-color-mode=system]{color-scheme:light dark}[data-seed-color-mode=light-only]{color-scheme:light}[data-seed-color-mode=dark-only]{color-scheme:dark}:root{--seed-dimension-x0_5:2px;--seed-dimension-x1:4px;--seed-dimension-x1_5:6px;--seed-dimension-x2:8px;--seed-dimension-x2_5:10px;--seed-dimension-x3:12px;--seed-dimension-x3_5:14px;--seed-dimension-x4:16px;--seed-dimension-x4_5:18px;--seed-dimension-x5:20px;--seed-dimension-x6:24px;--seed-dimension-x7:28px;--seed-dimension-x8:32px;--seed-dimension-x9:36px;--seed-dimension-x10:40px;--seed-dimension-x12:48px;--seed-dimension-x13:52px;--seed-dimension-x14:56px;--seed-dimension-x16:64px;--seed-dimension-spacing-x-between-chips:var(--seed-dimension-x2);--seed-dimension-spacing-x-global-gutter:var(--seed-dimension-x4);--seed-dimension-spacing-y-component-default:var(--seed-dimension-x3);--seed-dimension-spacing-y-nav-to-title:var(--seed-dimension-x5);--seed-dimension-spacing-y-screen-bottom:var(--seed-dimension-x14);--seed-dimension-spacing-y-between-text:var(--seed-dimension-x1_5);--seed-duration-d1:50ms;--seed-duration-d2:.1s;--seed-duration-d3:.15s;--seed-duration-d4:.2s;--seed-duration-d5:.25s;--seed-duration-d6:.3s;--seed-font-size-t1:.6875rem;--seed-font-size-t2:.75rem;--seed-font-size-t3:.8125rem;--seed-font-size-t4:.875rem;--seed-font-size-t5:1rem;--seed-font-size-t6:1.125rem;--seed-font-size-t7:1.25rem;--seed-font-size-t8:1.375rem;--seed-font-size-t9:1.5rem;--seed-font-size-t10:1.625rem;--seed-font-size-t2-static:12px;--seed-font-size-t5-static:16px;--seed-font-size-t6-static:18px;--seed-font-weight-regular:400;--seed-font-weight-medium:500;--seed-font-weight-bold:700;--seed-line-height-t1:.9375rem;--seed-line-height-t2:1rem;--seed-line-height-t3:1.125rem;--seed-line-height-t4:1.1875rem;--seed-line-height-t5:1.375rem;--seed-line-height-t6:1.5rem;--seed-line-height-t7:1.6875rem;--seed-line-height-t8:1.875rem;--seed-line-height-t9:2rem;--seed-line-height-t10:2.1875rem;--seed-radius-r0_5:2px;--seed-radius-r1:4px;--seed-radius-r1_5:6px;--seed-radius-r2:8px;--seed-radius-r2_5:10px;--seed-radius-r3:12px;--seed-radius-r3_5:14px;--seed-radius-r4:16px;--seed-radius-r5:20px;--seed-radius-r6:24px;--seed-radius-full:9999px;--seed-timing-function-linear:cubic-bezier(0,0,1,1);--seed-timing-function-easing:cubic-bezier(.35,0,.35,1);--seed-timing-function-enter:cubic-bezier(0,0,.15,1);--seed-timing-function-exit:cubic-bezier(.35,0,1,1);--seed-timing-function-enter-expressive:cubic-bezier(.03,.4,.1,1);--seed-timing-function-exit-expressive:cubic-bezier(.35,0,.95,.55)}:root,:root[data-seed-color-mode=system][data-seed-user-color-scheme=light],:root[data-seed-color-mode=light-only],:root [data-seed-color-mode=light-only]{--seed-color-palette-blue-100:#eff6ff;--seed-color-palette-blue-200:#e2edfc;--seed-color-palette-blue-300:#cbdffa;--seed-color-palette-blue-400:#aacefd;--seed-color-palette-blue-500:#85b8fd;--seed-color-palette-blue-600:#5e98fe;--seed-color-palette-blue-700:#217cf9;--seed-color-palette-blue-800:#135fcd;--seed-color-palette-blue-900:#0b4596;--seed-color-palette-blue-1000:#032451;--seed-color-palette-carrot-100:#fff2ec;--seed-color-palette-carrot-200:#ffe8db;--seed-color-palette-carrot-300:#ffd5c0;--seed-color-palette-carrot-400:#ffb999;--seed-color-palette-carrot-500:#ff9364;--seed-color-palette-carrot-600:#f60;--seed-color-palette-carrot-700:#e14d00;--seed-color-palette-carrot-800:#b93901;--seed-color-palette-carrot-900:#862b00;--seed-color-palette-carrot-1000:#471601;--seed-color-palette-gray-00:#fff;--seed-color-palette-gray-100:#f7f8f9;--seed-color-palette-gray-200:#f3f4f5;--seed-color-palette-gray-300:#eeeff1;--seed-color-palette-gray-400:#dcdee3;--seed-color-palette-gray-500:#d1d3d8;--seed-color-palette-gray-600:#b0b3ba;--seed-color-palette-gray-700:#868b94;--seed-color-palette-gray-800:#555d6d;--seed-color-palette-gray-900:#2a3038;--seed-color-palette-gray-1000:#1a1c20;--seed-color-palette-green-100:#edfaf6;--seed-color-palette-green-200:#d9f6e9;--seed-color-palette-green-300:#b9e9d2;--seed-color-palette-green-400:#7ddcb3;--seed-color-palette-green-500:#42c593;--seed-color-palette-green-600:#10ab7d;--seed-color-palette-green-700:#079171;--seed-color-palette-green-800:#00745f;--seed-color-palette-green-900:#075445;--seed-color-palette-green-1000:#0a2b24;--seed-color-palette-purple-100:#f5f3fe;--seed-color-palette-purple-200:#efeafe;--seed-color-palette-purple-300:#e1d8ff;--seed-color-palette-purple-400:#d0c0ff;--seed-color-palette-purple-500:#b8a1ff;--seed-color-palette-purple-600:#9f84fb;--seed-color-palette-purple-700:#8969ea;--seed-color-palette-purple-800:#6d50cb;--seed-color-palette-purple-900:#50379b;--seed-color-palette-purple-1000:#29175d;--seed-color-palette-red-100:#fdf0f0;--seed-color-palette-red-200:#fde7e7;--seed-color-palette-red-300:#fed4d2;--seed-color-palette-red-400:#feb7b3;--seed-color-palette-red-500:#fe928d;--seed-color-palette-red-600:#fc6a66;--seed-color-palette-red-700:#fa342c;--seed-color-palette-red-800:#ca1d13;--seed-color-palette-red-900:#921708;--seed-color-palette-red-1000:#4a1209;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#fff7de;--seed-color-palette-yellow-200:#fdefb9;--seed-color-palette-yellow-300:#fbdc65;--seed-color-palette-yellow-400:#e9c647;--seed-color-palette-yellow-500:#d4ab28;--seed-color-palette-yellow-600:#c49725;--seed-color-palette-yellow-700:#9b7821;--seed-color-palette-yellow-800:#755b22;--seed-color-palette-yellow-900:#4f3e1f;--seed-color-palette-yellow-1000:#2c2512;--seed-color-fg-brand:var(--seed-color-palette-carrot-600);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-00);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-disabled:var(--seed-color-palette-gray-200);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-600);--seed-color-bg-magic-weak:#f9f2ee;--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-700);--seed-color-bg-critical-solid:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-800);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-800);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default:var(--seed-color-palette-gray-00);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-200);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-solid:var(--seed-color-palette-green-700);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-800);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-300);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-neutral:var(--seed-color-palette-gray-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-gray-200);--seed-color-stroke-on-image:var(--seed-color-palette-static-black-alpha-200);--seed-color-manner-temp-l1-bg:#eff0f1;--seed-color-manner-temp-l1-text:#62666a;--seed-color-manner-temp-l2-bg:#e7f2fc;--seed-color-manner-temp-l2-text:#2592f7;--seed-color-manner-temp-l3-bg:#e3f6fc;--seed-color-manner-temp-l3-text:#0099c8;--seed-color-manner-temp-l4-bg:#ebf9f4;--seed-color-manner-temp-l4-text:#03a07e;--seed-color-manner-temp-l5-bg:#fff5e5;--seed-color-manner-temp-l5-text:#d28500;--seed-color-manner-temp-l6-bg:#fff0e5;--seed-color-manner-temp-l6-text:#f06000;--seed-gradient-shimmer-neutral:#fff0 0%,#fff6 46%,#fff6 54%,#fff0 100%;--seed-gradient-shimmer-magic:#fef0e700 0%,#fef0e78a 46%,#fef0e78a 54%,#fef0e700 100%;--seed-gradient-fade-neutral:#fff 0%,#fff0 100%;--seed-gradient-glow-magic:#fef6f7 0%,#fef0e7 80%,#f9f7f5 100%;--seed-gradient-glow-magic-pressed:#fbf0f2 0%,#ffe8db 80%,#f5f2ef 100%;--seed-gradient-highlight-magic:#f60 20%,#d25aca 80%}:root[data-seed-color-mode=system][data-seed-user-color-scheme=dark],:root[data-seed-color-mode=dark-only],:root [data-seed-color-mode=dark-only]{--seed-color-palette-blue-100:#202742;--seed-color-palette-blue-200:#1e3352;--seed-color-palette-blue-300:#1a4275;--seed-color-palette-blue-400:#0f559e;--seed-color-palette-blue-500:#1964d8;--seed-color-palette-blue-600:#1e82eb;--seed-color-palette-blue-700:#41a2f9;--seed-color-palette-blue-800:#83bcf9;--seed-color-palette-blue-900:#b9d7fb;--seed-color-palette-blue-1000:#e5f0fe;--seed-color-palette-carrot-100:#31241f;--seed-color-palette-carrot-200:#4b291c;--seed-color-palette-carrot-300:#6b311c;--seed-color-palette-carrot-400:#923600;--seed-color-palette-carrot-500:#bd4201;--seed-color-palette-carrot-600:#e65200;--seed-color-palette-carrot-700:#f60;--seed-color-palette-carrot-800:#ff9e65;--seed-color-palette-carrot-900:#eecebc;--seed-color-palette-carrot-1000:#f4eeea;--seed-color-palette-gray-00:#000;--seed-color-palette-gray-100:#16171b;--seed-color-palette-gray-200:#1d2025;--seed-color-palette-gray-300:#2b2e35;--seed-color-palette-gray-400:#393d46;--seed-color-palette-gray-500:#5b606a;--seed-color-palette-gray-600:#868b94;--seed-color-palette-gray-700:#b0b3ba;--seed-color-palette-gray-800:#dcdee3;--seed-color-palette-gray-900:#e9eaec;--seed-color-palette-gray-1000:#f3f4f5;--seed-color-palette-green-100:#202926;--seed-color-palette-green-200:#20362e;--seed-color-palette-green-300:#20493b;--seed-color-palette-green-400:#19604c;--seed-color-palette-green-500:#117956;--seed-color-palette-green-600:#1b946d;--seed-color-palette-green-700:#22b27f;--seed-color-palette-green-800:#35ce9a;--seed-color-palette-green-900:#93e5c0;--seed-color-palette-green-1000:#d4f6ef;--seed-color-palette-purple-100:#28213b;--seed-color-palette-purple-200:#3b2873;--seed-color-palette-purple-300:#443081;--seed-color-palette-purple-400:#5a3bb1;--seed-color-palette-purple-500:#764fd9;--seed-color-palette-purple-600:#8e6bee;--seed-color-palette-purple-700:#a78df0;--seed-color-palette-purple-800:#beadf2;--seed-color-palette-purple-900:#d9cefa;--seed-color-palette-purple-1000:#f0edfc;--seed-color-palette-red-100:#322323;--seed-color-palette-red-200:#4f2624;--seed-color-palette-red-300:#742826;--seed-color-palette-red-400:#a12621;--seed-color-palette-red-500:#ca2319;--seed-color-palette-red-600:#f73526;--seed-color-palette-red-700:#ff6e60;--seed-color-palette-red-800:#ffa299;--seed-color-palette-red-900:#f8c5c3;--seed-color-palette-red-1000:#fdf2f2;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#302819;--seed-color-palette-yellow-200:#413218;--seed-color-palette-yellow-300:#543e15;--seed-color-palette-yellow-400:#714e15;--seed-color-palette-yellow-500:#91601b;--seed-color-palette-yellow-600:#b6720d;--seed-color-palette-yellow-700:#ca901c;--seed-color-palette-yellow-800:#dab156;--seed-color-palette-yellow-900:#e5d49b;--seed-color-palette-yellow-1000:#f7f0cd;--seed-color-fg-brand:var(--seed-color-palette-carrot-700);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-100);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-disabled:var(--seed-color-palette-gray-300);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-700);--seed-color-bg-magic-weak:#201f1f;--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-800);--seed-color-bg-critical-solid:var(--seed-color-palette-red-600);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-600);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default:var(--seed-color-palette-gray-100);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-200);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-400);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-500);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-400);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-solid:var(--seed-color-palette-green-500);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-500);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-600);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-neutral:var(--seed-color-palette-gray-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-gray-200);--seed-color-stroke-on-image:var(--seed-color-palette-static-black-alpha-200);--seed-color-manner-temp-l1-bg:#222226;--seed-color-manner-temp-l1-text:#b1b5b9;--seed-color-manner-temp-l2-bg:#16212b;--seed-color-manner-temp-l2-text:#7cbaf4;--seed-color-manner-temp-l3-bg:#12262c;--seed-color-manner-temp-l3-text:#47c3eb;--seed-color-manner-temp-l4-bg:#162822;--seed-color-manner-temp-l4-text:#33cc94;--seed-color-manner-temp-l5-bg:#2e2312;--seed-color-manner-temp-l5-text:#ffa100;--seed-color-manner-temp-l6-bg:#2e1d12;--seed-color-manner-temp-l6-text:#ff9147;--seed-gradient-shimmer-neutral:#fff0 0%,#ffffff1a 46%,#ffffff1a 54%,#fff0 100%;--seed-gradient-shimmer-magic:#fef0e700 0%,#fef0e71a 46%,#fef0e71a 54%,#fef0e700 100%;--seed-gradient-fade-neutral:#1d2025 0%,#1d202500 100%;--seed-gradient-glow-magic:#2d252d 0%,#3a312b 80%,#333232 100%;--seed-gradient-glow-magic-pressed:#3e333e 0%,#51453e 80%,#434242 100%;--seed-gradient-highlight-magic:#ff6000 20%,#d25aca 80%}@keyframes seed-enter{0%{opacity:var(--seed-enter-opacity,1);transform:translate3d(var(--seed-enter-translate-x,0),var(--seed-enter-translate-y,0),0)scale3d(var(--seed-enter-scale,1),var(--seed-enter-scale,1),var(--seed-enter-scale,1))rotate(var(--seed-enter-rotate,0))}}@keyframes seed-exit{to{opacity:var(--seed-exit-opacity,1);transform:translate3d(var(--seed-exit-translate-x,0),var(--seed-exit-translate-y,0),0)scale3d(var(--seed-exit-scale,1),var(--seed-exit-scale,1),var(--seed-exit-scale,1))rotate(var(--seed-exit-rotate,0))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slide-x{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes progress-circle-head{0%{stroke-dasharray:0 1000%}75%{stroke-dasharray:var(--circumference),1000%}to{stroke-dasharray:var(--circumference),1000%}}@keyframes progress-circle-tail{0%{stroke-dashoffset:0}33.33%{stroke-dashoffset:0}to{stroke-dashoffset:calc(var(--circumference)*-1)}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/css",
3
- "version": "0.0.39",
3
+ "version": "0.1.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
package/recipes/bottom-sheet.css CHANGED
@@ -80,8 +80,8 @@
80
80
  }
81
81
  .seed-bottom-sheet__description {
82
82
  color: var(--seed-color-fg-neutral-muted);
83
- font-size: var(--seed-font-size-t6);
84
- line-height: var(--seed-line-height-t6);
83
+ font-size: var(--seed-font-size-t5);
84
+ line-height: var(--seed-line-height-t5);
85
85
  font-weight: var(--seed-font-weight-regular);
86
86
  margin: 0;
87
87
  white-space: pre-wrap;
package/recipes/callout.css CHANGED
@@ -133,19 +133,19 @@
133
133
  color: var(--seed-color-fg-critical-contrast);
134
134
  }
135
135
  .seed-callout__root--tone_magic {
136
- background-color: var(--seed-color-bg-magic-weak);
137
- --seed-prefix-icon-color: var(--seed-color-fg-magic-contrast);
138
- --seed-suffix-icon-color: var(--seed-color-fg-magic-contrast);
136
+ background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic));
137
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
138
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
139
139
  }
140
140
  .seed-callout__root--tone_magic:is(button):is(:active, [data-active]) {
141
- background-color: var(--seed-color-bg-magic-weak-pressed);
141
+ background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic-pressed));
142
142
  }
143
143
  .seed-callout__title--tone_magic {
144
- color: var(--seed-color-fg-magic-contrast);
144
+ color: var(--seed-color-fg-neutral);
145
145
  }
146
146
  .seed-callout__description--tone_magic {
147
- color: var(--seed-color-fg-magic-contrast);
147
+ color: var(--seed-color-fg-neutral);
148
148
  }
149
149
  .seed-callout__link--tone_magic {
150
- color: var(--seed-color-fg-magic-contrast);
150
+ color: var(--seed-color-fg-neutral);
151
151
  }
package/recipes/help-bubble.css CHANGED
@@ -36,6 +36,7 @@
36
36
  fill: var(--seed-color-bg-neutral-solid);
37
37
  width: 12px;
38
38
  height: 8px;
39
+ font-size: 0;
39
40
  }
40
41
  .seed-help-bubble__title {
41
42
  color: var(--seed-color-palette-static-white);
package/recipes/skeleton.css CHANGED
@@ -2,7 +2,6 @@
2
2
  display: inline-block;
3
3
  box-sizing: border-box;
4
4
  overflow: hidden;
5
- background: var(--seed-color-palette-gray-200);
6
5
  --seed-box-width: initial;
7
6
  --seed-box-height: initial;
8
7
  width: var(--seed-box-width);
@@ -13,7 +12,6 @@
13
12
  display: block;
14
13
  width: 100%;
15
14
  height: 100%;
16
- background-image: linear-gradient(90deg, var(--seed-gradient-shimmer));
17
15
  background-repeat: no-repeat;
18
16
  animation-fill-mode: forwards;
19
17
  animation-name: slide-x;
@@ -32,4 +30,16 @@
32
30
  }
33
31
  .seed-skeleton--radius_full {
34
32
  border-radius: var(--seed-radius-full);
33
+ }
34
+ .seed-skeleton--tone_neutral {
35
+ background: var(--seed-color-palette-gray-200);
36
+ }
37
+ .seed-skeleton--tone_neutral::after {
38
+ background-image: linear-gradient(90deg, var(--seed-gradient-shimmer-neutral));
39
+ }
40
+ .seed-skeleton--tone_magic {
41
+ background: var(--seed-color-bg-magic-weak);
42
+ }
43
+ .seed-skeleton--tone_magic::after {
44
+ background-image: linear-gradient(90deg, var(--seed-gradient-shimmer-magic));
35
45
  }
package/recipes/skeleton.d.ts CHANGED
@@ -3,6 +3,10 @@ declare interface SkeletonVariant {
3
3
  * @default 8
4
4
  */
5
5
  radius: "0" | "8" | "16" | "full";
6
+ /**
7
+ * @default neutral
8
+ */
9
+ tone: "neutral" | "magic";
6
10
  }
7
11
 
8
12
  declare type SkeletonVariantMap = {
package/recipes/skeleton.mjs CHANGED
@@ -2,7 +2,8 @@ import './skeleton.css';
2
2
  import { createClassName, mergeVariants, splitVariantProps } from "./shared.mjs";
3
3
 
4
4
  const defaultVariant = {
5
- "radius": 8
5
+ "radius": 8,
6
+ "tone": "neutral"
6
7
  };
7
8
 
8
9
  const compoundVariants = [];
@@ -13,6 +14,10 @@ export const skeletonVariantMap = {
13
14
  "8",
14
15
  "16",
15
16
  "full"
17
+ ],
18
+ "tone": [
19
+ "neutral",
20
+ "magic"
16
21
  ]
17
22
  };
18
23
 
package/recipes/text.css CHANGED
@@ -165,4 +165,10 @@
165
165
  white-space: initial;
166
166
  -webkit-box-orient: vertical;
167
167
  -webkit-line-clamp: var(--seed-max-lines)
168
+ }
169
+ .seed-text--textDecorationLine_none {
170
+ text-decoration-line: none
171
+ }
172
+ .seed-text--textDecorationLine_line-through {
173
+ text-decoration-line: line-through
168
174
  }
package/recipes/text.d.ts CHANGED
@@ -7,6 +7,10 @@ declare interface TextVariant {
7
7
  * @default none
8
8
  */
9
9
  maxLines: "none" | "single" | "multi";
10
+ /**
11
+ * @default none
12
+ */
13
+ textDecorationLine: "none" | "line-through";
10
14
  }
11
15
 
12
16
  declare type TextVariantMap = {
package/recipes/text.mjs CHANGED
@@ -3,7 +3,8 @@ import { createClassName, mergeVariants, splitVariantProps } from "./shared.mjs"
3
3
 
4
4
  const defaultVariant = {
5
5
  "textStyle": "t5Regular",
6
- "maxLines": "none"
6
+ "maxLines": "none",
7
+ "textDecorationLine": "none"
7
8
  };
8
9
 
9
10
  const compoundVariants = [];
@@ -41,6 +42,10 @@ export const textVariantMap = {
41
42
  "none",
42
43
  "single",
43
44
  "multi"
45
+ ],
46
+ "textDecorationLine": [
47
+ "none",
48
+ "line-through"
44
49
  ]
45
50
  };
46
51
 
package/vars/color/bg.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  export declare const disabled = "var(--seed-color-bg-disabled)";
2
2
  export declare const overlay = "var(--seed-color-bg-overlay)";
3
3
  export declare const brandSolid = "var(--seed-color-bg-brand-solid)";
4
+ export declare const magicWeak = "var(--seed-color-bg-magic-weak)";
4
5
  export declare const brandSolidPressed = "var(--seed-color-bg-brand-solid-pressed)";
5
6
  export declare const criticalSolid = "var(--seed-color-bg-critical-solid)";
6
7
  export declare const criticalWeak = "var(--seed-color-bg-critical-weak)";
@@ -16,10 +17,6 @@ export declare const layerFill = "var(--seed-color-bg-layer-fill)";
16
17
  export declare const layerFloating = "var(--seed-color-bg-layer-floating)";
17
18
  export declare const layerDefaultPressed = "var(--seed-color-bg-layer-default-pressed)";
18
19
  export declare const layerFloatingPressed = "var(--seed-color-bg-layer-floating-pressed)";
19
- export declare const magicSolid = "var(--seed-color-bg-magic-solid)";
20
- export declare const magicWeak = "var(--seed-color-bg-magic-weak)";
21
- export declare const magicSolidPressed = "var(--seed-color-bg-magic-solid-pressed)";
22
- export declare const magicWeakPressed = "var(--seed-color-bg-magic-weak-pressed)";
23
20
  export declare const neutralInverted = "var(--seed-color-bg-neutral-inverted)";
24
21
  export declare const neutralSolid = "var(--seed-color-bg-neutral-solid)";
25
22
  export declare const neutralWeak = "var(--seed-color-bg-neutral-weak)";
package/vars/color/bg.mjs CHANGED
@@ -1,6 +1,7 @@
1
1
  export const disabled = "var(--seed-color-bg-disabled)";
2
2
  export const overlay = "var(--seed-color-bg-overlay)";
3
3
  export const brandSolid = "var(--seed-color-bg-brand-solid)";
4
+ export const magicWeak = "var(--seed-color-bg-magic-weak)";
4
5
  export const brandSolidPressed = "var(--seed-color-bg-brand-solid-pressed)";
5
6
  export const criticalSolid = "var(--seed-color-bg-critical-solid)";
6
7
  export const criticalWeak = "var(--seed-color-bg-critical-weak)";
@@ -16,10 +17,6 @@ export const layerFill = "var(--seed-color-bg-layer-fill)";
16
17
  export const layerFloating = "var(--seed-color-bg-layer-floating)";
17
18
  export const layerDefaultPressed = "var(--seed-color-bg-layer-default-pressed)";
18
19
  export const layerFloatingPressed = "var(--seed-color-bg-layer-floating-pressed)";
19
- export const magicSolid = "var(--seed-color-bg-magic-solid)";
20
- export const magicWeak = "var(--seed-color-bg-magic-weak)";
21
- export const magicSolidPressed = "var(--seed-color-bg-magic-solid-pressed)";
22
- export const magicWeakPressed = "var(--seed-color-bg-magic-weak-pressed)";
23
20
  export const neutralInverted = "var(--seed-color-bg-neutral-inverted)";
24
21
  export const neutralSolid = "var(--seed-color-bg-neutral-solid)";
25
22
  export const neutralWeak = "var(--seed-color-bg-neutral-weak)";
package/vars/color/fg.d.ts CHANGED
@@ -2,13 +2,11 @@ export declare const brand = "var(--seed-color-fg-brand)";
2
2
  export declare const critical = "var(--seed-color-fg-critical)";
3
3
  export declare const disabled = "var(--seed-color-fg-disabled)";
4
4
  export declare const informative = "var(--seed-color-fg-informative)";
5
- export declare const magic = "var(--seed-color-fg-magic)";
6
5
  export declare const neutral = "var(--seed-color-fg-neutral)";
7
6
  export declare const placeholder = "var(--seed-color-fg-placeholder)";
8
7
  export declare const positive = "var(--seed-color-fg-positive)";
9
8
  export declare const criticalContrast = "var(--seed-color-fg-critical-contrast)";
10
9
  export declare const informativeContrast = "var(--seed-color-fg-informative-contrast)";
11
- export declare const magicContrast = "var(--seed-color-fg-magic-contrast)";
12
10
  export declare const neutralInverted = "var(--seed-color-fg-neutral-inverted)";
13
11
  export declare const neutralMuted = "var(--seed-color-fg-neutral-muted)";
14
12
  export declare const neutralSubtle = "var(--seed-color-fg-neutral-subtle)";
package/vars/color/fg.mjs CHANGED
@@ -2,13 +2,11 @@ export const brand = "var(--seed-color-fg-brand)";
2
2
  export const critical = "var(--seed-color-fg-critical)";
3
3
  export const disabled = "var(--seed-color-fg-disabled)";
4
4
  export const informative = "var(--seed-color-fg-informative)";
5
- export const magic = "var(--seed-color-fg-magic)";
6
5
  export const neutral = "var(--seed-color-fg-neutral)";
7
6
  export const placeholder = "var(--seed-color-fg-placeholder)";
8
7
  export const positive = "var(--seed-color-fg-positive)";
9
8
  export const criticalContrast = "var(--seed-color-fg-critical-contrast)";
10
9
  export const informativeContrast = "var(--seed-color-fg-informative-contrast)";
11
- export const magicContrast = "var(--seed-color-fg-magic-contrast)";
12
10
  export const neutralInverted = "var(--seed-color-fg-neutral-inverted)";
13
11
  export const neutralMuted = "var(--seed-color-fg-neutral-muted)";
14
12
  export const neutralSubtle = "var(--seed-color-fg-neutral-subtle)";
package/vars/component/bottom-sheet.d.ts CHANGED
@@ -40,8 +40,8 @@ export declare const vars: {
40
40
  },
41
41
  "description": {
42
42
  "color": "var(--seed-color-fg-neutral-muted)",
43
- "fontSize": "var(--seed-font-size-t6)",
44
- "lineHeight": "var(--seed-line-height-t6)",
43
+ "fontSize": "var(--seed-font-size-t5)",
44
+ "lineHeight": "var(--seed-line-height-t5)",
45
45
  "fontWeight": "var(--seed-font-weight-regular)"
46
46
  },
47
47
  "closeButton": {
package/vars/component/bottom-sheet.mjs CHANGED
@@ -40,8 +40,8 @@ export const vars = {
40
40
  },
41
41
  "description": {
42
42
  "color": "var(--seed-color-fg-neutral-muted)",
43
- "fontSize": "var(--seed-font-size-t6)",
44
- "lineHeight": "var(--seed-line-height-t6)",
43
+ "fontSize": "var(--seed-font-size-t5)",
44
+ "lineHeight": "var(--seed-line-height-t5)",
45
45
  "fontWeight": "var(--seed-font-weight-regular)"
46
46
  },
47
47
  "closeButton": {
package/vars/component/callout.d.ts CHANGED
@@ -143,27 +143,27 @@ export declare const vars: {
143
143
  "toneMagic": {
144
144
  "enabled": {
145
145
  "root": {
146
- "color": "var(--seed-color-bg-magic-weak)"
146
+ "color": "var(--seed-gradient-glow-magic)"
147
147
  },
148
148
  "prefixIcon": {
149
- "color": "var(--seed-color-fg-magic-contrast)"
149
+ "color": "var(--seed-color-fg-neutral)"
150
150
  },
151
151
  "title": {
152
- "color": "var(--seed-color-fg-magic-contrast)"
152
+ "color": "var(--seed-color-fg-neutral)"
153
153
  },
154
154
  "description": {
155
- "color": "var(--seed-color-fg-magic-contrast)"
155
+ "color": "var(--seed-color-fg-neutral)"
156
156
  },
157
157
  "link": {
158
- "color": "var(--seed-color-fg-magic-contrast)"
158
+ "color": "var(--seed-color-fg-neutral)"
159
159
  },
160
160
  "suffixIcon": {
161
- "color": "var(--seed-color-fg-magic-contrast)"
161
+ "color": "var(--seed-color-fg-neutral)"
162
162
  }
163
163
  },
164
164
  "pressed": {
165
165
  "root": {
166
- "color": "var(--seed-color-bg-magic-weak-pressed)"
166
+ "color": "var(--seed-gradient-glow-magic-pressed)"
167
167
  }
168
168
  }
169
169
  }
package/vars/component/callout.mjs CHANGED
@@ -143,27 +143,27 @@ export const vars = {
143
143
  "toneMagic": {
144
144
  "enabled": {
145
145
  "root": {
146
- "color": "var(--seed-color-bg-magic-weak)"
146
+ "color": "var(--seed-gradient-glow-magic)"
147
147
  },
148
148
  "prefixIcon": {
149
- "color": "var(--seed-color-fg-magic-contrast)"
149
+ "color": "var(--seed-color-fg-neutral)"
150
150
  },
151
151
  "title": {
152
- "color": "var(--seed-color-fg-magic-contrast)"
152
+ "color": "var(--seed-color-fg-neutral)"
153
153
  },
154
154
  "description": {
155
- "color": "var(--seed-color-fg-magic-contrast)"
155
+ "color": "var(--seed-color-fg-neutral)"
156
156
  },
157
157
  "link": {
158
- "color": "var(--seed-color-fg-magic-contrast)"
158
+ "color": "var(--seed-color-fg-neutral)"
159
159
  },
160
160
  "suffixIcon": {
161
- "color": "var(--seed-color-fg-magic-contrast)"
161
+ "color": "var(--seed-color-fg-neutral)"
162
162
  }
163
163
  },
164
164
  "pressed": {
165
165
  "root": {
166
- "color": "var(--seed-color-bg-magic-weak-pressed)"
166
+ "color": "var(--seed-gradient-glow-magic-pressed)"
167
167
  }
168
168
  }
169
169
  }
package/vars/component/skeleton.d.ts CHANGED
@@ -1,13 +1,9 @@
1
1
  export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
- "root": {
5
- "color": "var(--seed-color-palette-gray-200)"
6
- },
7
4
  "shimmer": {
8
5
  "duration": "1.5s",
9
- "timingFunction": "var(--seed-timing-function-easing)",
10
- "color": "var(--seed-gradient-shimmer)"
6
+ "timingFunction": "var(--seed-timing-function-easing)"
11
7
  }
12
8
  }
13
9
  },
@@ -38,5 +34,25 @@ export declare const vars: {
38
34
  "cornerRadius": "var(--seed-radius-full)"
39
35
  }
40
36
  }
37
+ },
38
+ "toneNeutral": {
39
+ "enabled": {
40
+ "root": {
41
+ "color": "var(--seed-color-palette-gray-200)"
42
+ },
43
+ "shimmer": {
44
+ "color": "var(--seed-gradient-shimmer-neutral)"
45
+ }
46
+ }
47
+ },
48
+ "toneMagic": {
49
+ "enabled": {
50
+ "root": {
51
+ "color": "var(--seed-color-bg-magic-weak)"
52
+ },
53
+ "shimmer": {
54
+ "color": "var(--seed-gradient-shimmer-magic)"
55
+ }
56
+ }
41
57
  }
42
58
  }