@seed-design/css 1.1.15 → 1.1.17

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 (94) hide show
  1. package/all.css +413 -191
  2. package/all.min.css +1 -1
  3. package/base.css +188 -164
  4. package/base.min.css +1 -1
  5. package/package.json +1 -1
  6. package/recipes/app-bar-main.d.ts +1 -1
  7. package/recipes/app-bar-main.mjs +2 -1
  8. package/recipes/app-bar.css +21 -0
  9. package/recipes/app-bar.d.ts +1 -1
  10. package/recipes/app-bar.mjs +2 -1
  11. package/recipes/app-screen.css +34 -4
  12. package/recipes/app-screen.d.ts +1 -1
  13. package/recipes/app-screen.mjs +2 -1
  14. package/recipes/checkmark.css +2 -1
  15. package/recipes/chip-tabs.css +12 -12
  16. package/recipes/chip.css +2 -2
  17. package/recipes/help-bubble.css +1 -1
  18. package/recipes/segmented-control.css +1 -1
  19. package/recipes/tabs.css +6 -6
  20. package/recipes/text.css +125 -0
  21. package/recipes/text.d.ts +1 -1
  22. package/recipes/text.mjs +26 -1
  23. package/vars/color/banner.d.ts +10 -0
  24. package/vars/color/banner.mjs +10 -0
  25. package/vars/color/bg.d.ts +50 -13
  26. package/vars/color/bg.mjs +15 -13
  27. package/vars/color/fg.d.ts +22 -8
  28. package/vars/color/fg.mjs +8 -8
  29. package/vars/color/index.d.ts +2 -1
  30. package/vars/color/index.mjs +2 -1
  31. package/vars/color/manner-temp/index.d.ts +2 -2
  32. package/vars/color/manner-temp/index.mjs +2 -2
  33. package/vars/color/manner-temp/l1.d.ts +2 -2
  34. package/vars/color/manner-temp/l1.mjs +2 -2
  35. package/vars/color/manner-temp/l10.d.ts +2 -2
  36. package/vars/color/manner-temp/l10.mjs +2 -2
  37. package/vars/color/manner-temp/l2.d.ts +2 -2
  38. package/vars/color/manner-temp/l2.mjs +2 -2
  39. package/vars/color/manner-temp/l3.d.ts +2 -2
  40. package/vars/color/manner-temp/l3.mjs +2 -2
  41. package/vars/color/manner-temp/l4.d.ts +2 -2
  42. package/vars/color/manner-temp/l4.mjs +2 -2
  43. package/vars/color/manner-temp/l5.d.ts +2 -2
  44. package/vars/color/manner-temp/l5.mjs +2 -2
  45. package/vars/color/manner-temp/l6.d.ts +2 -2
  46. package/vars/color/manner-temp/l6.mjs +2 -2
  47. package/vars/color/manner-temp/l7.d.ts +2 -2
  48. package/vars/color/manner-temp/l7.mjs +2 -2
  49. package/vars/color/manner-temp/l8.d.ts +2 -2
  50. package/vars/color/manner-temp/l8.mjs +2 -2
  51. package/vars/color/manner-temp/l9.d.ts +2 -2
  52. package/vars/color/manner-temp/l9.mjs +2 -2
  53. package/vars/color/palette.d.ts +42 -42
  54. package/vars/color/palette.mjs +42 -42
  55. package/vars/color/stroke.d.ts +23 -8
  56. package/vars/color/stroke.mjs +8 -8
  57. package/vars/component/action-button.d.ts +119 -0
  58. package/vars/component/avatar.d.ts +16 -0
  59. package/vars/component/badge.d.ts +80 -0
  60. package/vars/component/callout.d.ts +32 -0
  61. package/vars/component/checkmark.d.ts +36 -2
  62. package/vars/component/checkmark.mjs +4 -2
  63. package/vars/component/chip-tab.d.ts +2 -2
  64. package/vars/component/chip-tab.mjs +2 -2
  65. package/vars/component/chip.d.ts +21 -2
  66. package/vars/component/chip.mjs +3 -2
  67. package/vars/component/contextual-floating-button.d.ts +12 -0
  68. package/vars/component/control-chip.d.ts +1 -1
  69. package/vars/component/control-chip.mjs +1 -1
  70. package/vars/component/extended-fab.d.ts +6 -0
  71. package/vars/component/field.d.ts +6 -0
  72. package/vars/component/floating-action-button.d.ts +6 -0
  73. package/vars/component/help-bubble.d.ts +2 -0
  74. package/vars/component/menu-sheet-item.d.ts +12 -0
  75. package/vars/component/notification-badge.d.ts +6 -0
  76. package/vars/component/page-banner.d.ts +46 -0
  77. package/vars/component/progress-circle.d.ts +21 -0
  78. package/vars/component/radiomark.d.ts +3 -0
  79. package/vars/component/segmented-control.d.ts +1 -1
  80. package/vars/component/segmented-control.mjs +1 -1
  81. package/vars/component/skeleton.d.ts +18 -0
  82. package/vars/component/switch-mark.d.ts +3 -0
  83. package/vars/component/text-input.d.ts +12 -0
  84. package/vars/component/toggle-button.d.ts +6 -0
  85. package/vars/component/typography.d.ts +306 -0
  86. package/vars/component/typography.mjs +225 -0
  87. package/vars/dimension/spacing-x.d.ts +2 -0
  88. package/vars/dimension/spacing-y.d.ts +4 -0
  89. package/vars/font-size.d.ts +10 -0
  90. package/vars/gradient.d.ts +14 -3
  91. package/vars/gradient.mjs +3 -3
  92. package/vars/index.d.ts +9 -4
  93. package/vars/line-height.d.ts +10 -0
  94. package/vars/shadow.d.ts +1 -0
package/all.css CHANGED
@@ -315,26 +315,6 @@
315
315
  }
316
316
 
317
317
  :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"] {
318
- --seed-color-palette-blue-100: #eff6ff;
319
- --seed-color-palette-blue-200: #e2edfc;
320
- --seed-color-palette-blue-300: #cbdffa;
321
- --seed-color-palette-blue-400: #aacefd;
322
- --seed-color-palette-blue-500: #85b8fd;
323
- --seed-color-palette-blue-600: #5e98fe;
324
- --seed-color-palette-blue-700: #217cf9;
325
- --seed-color-palette-blue-800: #135fcd;
326
- --seed-color-palette-blue-900: #0b4596;
327
- --seed-color-palette-blue-1000: #032451;
328
- --seed-color-palette-carrot-100: #fff2ec;
329
- --seed-color-palette-carrot-200: #ffe8db;
330
- --seed-color-palette-carrot-300: #ffd5c0;
331
- --seed-color-palette-carrot-400: #ffb999;
332
- --seed-color-palette-carrot-500: #ff9364;
333
- --seed-color-palette-carrot-600: #f60;
334
- --seed-color-palette-carrot-700: #e14d00;
335
- --seed-color-palette-carrot-800: #b93901;
336
- --seed-color-palette-carrot-900: #862b00;
337
- --seed-color-palette-carrot-1000: #471601;
338
318
  --seed-color-palette-gray-00: #fff;
339
319
  --seed-color-palette-gray-100: #f7f8f9;
340
320
  --seed-color-palette-gray-200: #f3f4f5;
@@ -346,6 +326,36 @@
346
326
  --seed-color-palette-gray-800: #555d6d;
347
327
  --seed-color-palette-gray-900: #2a3038;
348
328
  --seed-color-palette-gray-1000: #1a1c20;
329
+ --seed-color-palette-carrot-100: #fff2ec;
330
+ --seed-color-palette-carrot-200: #ffe8db;
331
+ --seed-color-palette-carrot-300: #ffd5c0;
332
+ --seed-color-palette-carrot-400: #ffb999;
333
+ --seed-color-palette-carrot-500: #ff9364;
334
+ --seed-color-palette-carrot-600: #f60;
335
+ --seed-color-palette-carrot-700: #e14d00;
336
+ --seed-color-palette-carrot-800: #b93901;
337
+ --seed-color-palette-carrot-900: #862b00;
338
+ --seed-color-palette-carrot-1000: #471601;
339
+ --seed-color-palette-blue-100: #eff6ff;
340
+ --seed-color-palette-blue-200: #e2edfc;
341
+ --seed-color-palette-blue-300: #cbdffa;
342
+ --seed-color-palette-blue-400: #aacefd;
343
+ --seed-color-palette-blue-500: #85b8fd;
344
+ --seed-color-palette-blue-600: #5e98fe;
345
+ --seed-color-palette-blue-700: #217cf9;
346
+ --seed-color-palette-blue-800: #135fcd;
347
+ --seed-color-palette-blue-900: #0b4596;
348
+ --seed-color-palette-blue-1000: #032451;
349
+ --seed-color-palette-red-100: #fdf0f0;
350
+ --seed-color-palette-red-200: #fde7e7;
351
+ --seed-color-palette-red-300: #fed4d2;
352
+ --seed-color-palette-red-400: #feb7b3;
353
+ --seed-color-palette-red-500: #fe928d;
354
+ --seed-color-palette-red-600: #fc6a66;
355
+ --seed-color-palette-red-700: #fa342c;
356
+ --seed-color-palette-red-800: #ca1d13;
357
+ --seed-color-palette-red-900: #921708;
358
+ --seed-color-palette-red-1000: #4a1209;
349
359
  --seed-color-palette-green-100: #edfaf6;
350
360
  --seed-color-palette-green-200: #d9f6e9;
351
361
  --seed-color-palette-green-300: #b9e9d2;
@@ -356,6 +366,16 @@
356
366
  --seed-color-palette-green-800: #00745f;
357
367
  --seed-color-palette-green-900: #075445;
358
368
  --seed-color-palette-green-1000: #0a2b24;
369
+ --seed-color-palette-yellow-100: #fff7de;
370
+ --seed-color-palette-yellow-200: #fdefb9;
371
+ --seed-color-palette-yellow-300: #fbdc65;
372
+ --seed-color-palette-yellow-400: #e9c647;
373
+ --seed-color-palette-yellow-500: #d4ab28;
374
+ --seed-color-palette-yellow-600: #c49725;
375
+ --seed-color-palette-yellow-700: #9b7821;
376
+ --seed-color-palette-yellow-800: #755b22;
377
+ --seed-color-palette-yellow-900: #4f3e1f;
378
+ --seed-color-palette-yellow-1000: #2c2512;
359
379
  --seed-color-palette-purple-100: #f5f3fe;
360
380
  --seed-color-palette-purple-200: #efeafe;
361
381
  --seed-color-palette-purple-300: #e1d8ff;
@@ -366,18 +386,7 @@
366
386
  --seed-color-palette-purple-800: #6d50cb;
367
387
  --seed-color-palette-purple-900: #50379b;
368
388
  --seed-color-palette-purple-1000: #29175d;
369
- --seed-color-palette-red-100: #fdf0f0;
370
- --seed-color-palette-red-200: #fde7e7;
371
- --seed-color-palette-red-300: #fed4d2;
372
- --seed-color-palette-red-400: #feb7b3;
373
- --seed-color-palette-red-500: #fe928d;
374
- --seed-color-palette-red-600: #fc6a66;
375
- --seed-color-palette-red-700: #fa342c;
376
- --seed-color-palette-red-800: #ca1d13;
377
- --seed-color-palette-red-900: #921708;
378
- --seed-color-palette-red-1000: #4a1209;
379
389
  --seed-color-palette-static-black: #000;
380
- --seed-color-palette-static-white: #fff;
381
390
  --seed-color-palette-static-black-alpha-100: #00000007;
382
391
  --seed-color-palette-static-black-alpha-200: #0000000c;
383
392
  --seed-color-palette-static-black-alpha-300: #00000010;
@@ -388,6 +397,7 @@
388
397
  --seed-color-palette-static-black-alpha-800: #000000a2;
389
398
  --seed-color-palette-static-black-alpha-900: #000000d0;
390
399
  --seed-color-palette-static-black-alpha-1000: #000000e3;
400
+ --seed-color-palette-static-white: #fff;
391
401
  --seed-color-palette-static-white-alpha-50: #ffffff0d;
392
402
  --seed-color-palette-static-white-alpha-100: #ffffff17;
393
403
  --seed-color-palette-static-white-alpha-200: #ffffff20;
@@ -399,140 +409,122 @@
399
409
  --seed-color-palette-static-white-alpha-800: #ffffffde;
400
410
  --seed-color-palette-static-white-alpha-900: #ffffffea;
401
411
  --seed-color-palette-static-white-alpha-1000: #fffffff4;
402
- --seed-color-palette-yellow-100: #fff7de;
403
- --seed-color-palette-yellow-200: #fdefb9;
404
- --seed-color-palette-yellow-300: #fbdc65;
405
- --seed-color-palette-yellow-400: #e9c647;
406
- --seed-color-palette-yellow-500: #d4ab28;
407
- --seed-color-palette-yellow-600: #c49725;
408
- --seed-color-palette-yellow-700: #9b7821;
409
- --seed-color-palette-yellow-800: #755b22;
410
- --seed-color-palette-yellow-900: #4f3e1f;
411
- --seed-color-palette-yellow-1000: #2c2512;
412
- --seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
413
- --seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
414
- --seed-color-fg-disabled: var(--seed-color-palette-gray-500);
415
412
  --seed-color-fg-brand: var(--seed-color-palette-carrot-600);
416
- --seed-color-fg-informative: var(--seed-color-palette-blue-700);
417
- --seed-color-fg-critical: var(--seed-color-palette-red-700);
418
- --seed-color-fg-positive: var(--seed-color-palette-green-700);
419
- --seed-color-fg-warning: var(--seed-color-palette-yellow-700);
420
413
  --seed-color-fg-brand-contrast: var(--seed-color-palette-carrot-700);
414
+ --seed-color-fg-critical: var(--seed-color-palette-red-700);
421
415
  --seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
416
+ --seed-color-fg-disabled: var(--seed-color-palette-gray-500);
417
+ --seed-color-fg-informative: var(--seed-color-palette-blue-700);
422
418
  --seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
419
+ --seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
420
+ --seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-00);
423
421
  --seed-color-fg-neutral-muted: var(--seed-color-palette-gray-800);
424
422
  --seed-color-fg-neutral-subtle: var(--seed-color-palette-gray-700);
425
- --seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-00);
423
+ --seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
424
+ --seed-color-fg-positive: var(--seed-color-palette-green-700);
426
425
  --seed-color-fg-positive-contrast: var(--seed-color-palette-green-900);
426
+ --seed-color-fg-warning: var(--seed-color-palette-yellow-700);
427
427
  --seed-color-fg-warning-contrast: var(--seed-color-palette-yellow-900);
428
- --seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
429
- --seed-color-bg-disabled: var(--seed-color-palette-gray-200);
430
- --seed-color-bg-brand-weak: var(--seed-color-palette-carrot-100);
431
428
  --seed-color-bg-brand-solid: var(--seed-color-palette-carrot-600);
432
429
  --seed-color-bg-brand-solid-pressed: var(--seed-color-palette-carrot-700);
430
+ --seed-color-bg-brand-weak: var(--seed-color-palette-carrot-100);
433
431
  --seed-color-bg-brand-weak-pressed: var(--seed-color-palette-carrot-200);
434
- --seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
435
432
  --seed-color-bg-critical-solid: var(--seed-color-palette-red-700);
436
433
  --seed-color-bg-critical-solid-pressed: var(--seed-color-palette-red-800);
434
+ --seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
437
435
  --seed-color-bg-critical-weak-pressed: var(--seed-color-palette-red-200);
438
- --seed-color-bg-informative-weak: var(--seed-color-palette-blue-100);
436
+ --seed-color-bg-disabled: var(--seed-color-palette-gray-200);
439
437
  --seed-color-bg-informative-solid: var(--seed-color-palette-blue-700);
440
438
  --seed-color-bg-informative-solid-pressed: var(--seed-color-palette-blue-800);
439
+ --seed-color-bg-informative-weak: var(--seed-color-palette-blue-100);
441
440
  --seed-color-bg-informative-weak-pressed: var(--seed-color-palette-blue-200);
442
441
  --seed-color-bg-layer-basement: var(--seed-color-palette-gray-200);
443
442
  --seed-color-bg-layer-default: var(--seed-color-palette-gray-00);
443
+ --seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-100);
444
444
  --seed-color-bg-layer-fill: var(--seed-color-palette-gray-100);
445
445
  --seed-color-bg-layer-floating: var(--seed-color-palette-gray-00);
446
- --seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-100);
447
446
  --seed-color-bg-layer-floating-pressed: var(--seed-color-palette-gray-100);
448
447
  --seed-color-bg-magic-weak: #f9f2ee;
449
- --seed-color-bg-neutral-weak: var(--seed-color-palette-gray-200);
450
448
  --seed-color-bg-neutral-inverted: var(--seed-color-palette-gray-900);
451
- --seed-color-bg-neutral-solid: var(--seed-color-palette-gray-1000);
452
449
  --seed-color-bg-neutral-inverted-pressed: var(--seed-color-palette-gray-800);
450
+ --seed-color-bg-neutral-solid: var(--seed-color-palette-gray-1000);
453
451
  --seed-color-bg-neutral-solid-muted: var(--seed-color-palette-gray-800);
454
452
  --seed-color-bg-neutral-solid-muted-pressed: var(--seed-color-palette-gray-900);
453
+ --seed-color-bg-neutral-weak: var(--seed-color-palette-gray-200);
454
+ --seed-color-bg-neutral-weak-alpha: var(--seed-color-palette-static-black-alpha-200);
455
+ --seed-color-bg-neutral-weak-alpha-pressed: var(--seed-color-palette-static-black-alpha-300);
455
456
  --seed-color-bg-neutral-weak-pressed: var(--seed-color-palette-gray-300);
457
+ --seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
456
458
  --seed-color-bg-overlay-muted: var(--seed-color-palette-static-black-alpha-500);
457
- --seed-color-bg-positive-weak: var(--seed-color-palette-green-100);
458
459
  --seed-color-bg-positive-solid: var(--seed-color-palette-green-700);
459
460
  --seed-color-bg-positive-solid-pressed: var(--seed-color-palette-green-800);
461
+ --seed-color-bg-positive-weak: var(--seed-color-palette-green-100);
460
462
  --seed-color-bg-positive-weak-pressed: var(--seed-color-palette-green-200);
461
- --seed-color-bg-warning-weak: var(--seed-color-palette-yellow-100);
463
+ --seed-color-bg-transparent: #0000;
464
+ --seed-color-bg-transparent-pressed: var(--seed-color-palette-static-black-alpha-100);
462
465
  --seed-color-bg-warning-solid: var(--seed-color-palette-yellow-300);
463
466
  --seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-400);
467
+ --seed-color-bg-warning-weak: var(--seed-color-palette-yellow-100);
464
468
  --seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
465
- --seed-color-bg-transparent: #0000;
466
- --seed-color-bg-transparent-pressed: var(--seed-color-palette-static-black-alpha-100);
467
- --seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
468
469
  --seed-color-stroke-brand-solid: var(--seed-color-palette-carrot-700);
469
- --seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
470
+ --seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
470
471
  --seed-color-stroke-critical-solid: var(--seed-color-palette-red-700);
471
- --seed-color-stroke-informative-weak: var(--seed-color-palette-blue-300);
472
+ --seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
472
473
  --seed-color-stroke-informative-solid: var(--seed-color-palette-blue-700);
474
+ --seed-color-stroke-informative-weak: var(--seed-color-palette-blue-300);
473
475
  --seed-color-stroke-neutral-contrast: var(--seed-color-palette-gray-1000);
474
- --seed-color-stroke-neutral-solid: var(--seed-color-palette-gray-800);
475
- --seed-color-stroke-neutral-weak: var(--seed-color-palette-gray-400);
476
476
  --seed-color-stroke-neutral-muted: var(--seed-color-palette-static-black-alpha-300);
477
+ --seed-color-stroke-neutral-solid: var(--seed-color-palette-gray-800);
477
478
  --seed-color-stroke-neutral-subtle: var(--seed-color-palette-static-black-alpha-200);
478
- --seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
479
+ --seed-color-stroke-neutral-weak: var(--seed-color-palette-gray-400);
479
480
  --seed-color-stroke-positive-solid: var(--seed-color-palette-green-700);
480
- --seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
481
+ --seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
481
482
  --seed-color-stroke-warning-solid: var(--seed-color-palette-yellow-700);
483
+ --seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
484
+ --seed-color-manner-temp-l1-bg: #f1f2f3;
482
485
  --seed-color-manner-temp-l1-text: #757b85;
486
+ --seed-color-manner-temp-l10-bg: #ffebee;
487
+ --seed-color-manner-temp-l10-text: #cb0123;
488
+ --seed-color-manner-temp-l2-bg: #f8f4ec;
483
489
  --seed-color-manner-temp-l2-text: #ab863f;
490
+ --seed-color-manner-temp-l3-bg: #fff5e5;
484
491
  --seed-color-manner-temp-l3-text: #e08a00;
485
- --seed-color-manner-temp-l4-text: #f57e00;
486
492
  --seed-color-manner-temp-l4-bg: #fff3e5;
487
- --seed-color-manner-temp-l5-text: #ff7300;
488
- --seed-color-manner-temp-l6-text: #f60;
489
- --seed-color-manner-temp-l1-bg: #f1f2f3;
490
- --seed-color-manner-temp-l2-bg: #f8f4ec;
491
- --seed-color-manner-temp-l3-bg: #fff5e5;
493
+ --seed-color-manner-temp-l4-text: #f57e00;
492
494
  --seed-color-manner-temp-l5-bg: #fff1e5;
495
+ --seed-color-manner-temp-l5-text: #ff7300;
493
496
  --seed-color-manner-temp-l6-bg: #fff0e5;
494
- --seed-color-manner-temp-l7-text: #ff5100;
497
+ --seed-color-manner-temp-l6-text: #f60;
495
498
  --seed-color-manner-temp-l7-bg: #ffefe5;
496
- --seed-color-manner-temp-l8-text: #f30;
497
- --seed-color-manner-temp-l9-text: #e82c45;
499
+ --seed-color-manner-temp-l7-text: #ff5100;
498
500
  --seed-color-manner-temp-l8-bg: #ffeee5;
501
+ --seed-color-manner-temp-l8-text: #f30;
499
502
  --seed-color-manner-temp-l9-bg: #fdeded;
500
- --seed-color-manner-temp-l10-text: #cb0123;
501
- --seed-color-manner-temp-l10-bg: #ffebee;
503
+ --seed-color-manner-temp-l9-text: #e82c45;
504
+ --seed-color-banner-blue: #e1f7ff;
505
+ --seed-color-banner-cool-gray: #ebf1f5;
506
+ --seed-color-banner-green: #f0fbe5;
507
+ --seed-color-banner-orange: #fff2e1;
508
+ --seed-color-banner-pink: #ffebf1;
509
+ --seed-color-banner-purple: #f5ecff;
510
+ --seed-color-banner-red: #ffecee;
511
+ --seed-color-banner-teal: #e6faf6;
512
+ --seed-color-banner-warm-gray: #f2f0ee;
513
+ --seed-color-banner-yellow: #fffae1;
502
514
  --seed-gradient-fade-layer-floating: #fff0 0%, #000 100%;
503
515
  --seed-gradient-fade-layer-default: #000 0%, #fff0 100%;
504
516
  --seed-gradient-glow-magic: #fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;
505
517
  --seed-gradient-glow-magic-pressed: #fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;
506
- --seed-gradient-shimmer-neutral: #fff0 0%, #fff6 46%, #fff6 54%, #fff0 100%;
507
- --seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f58a 46%, #fff9f58a 54%, #fff9f500 100%;
508
- --seed-gradient-highlight-magic-pressed: #e14f00 20%, #ae58bf 100%;
509
518
  --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
519
+ --seed-gradient-highlight-magic-pressed: #e14f00 20%, #ae58bf 100%;
520
+ --seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f5cc 46%, #fff9f5cc 54%, #fff9f500 100%;
521
+ --seed-gradient-shimmer-neutral: #fff0 0%, #ffffffab 46%, #ffffffab 54%, #fff0 100%;
510
522
  --seed-shadow-s1: 0px 1px 4px 0px #00000014;
511
523
  --seed-shadow-s2: 0px 2px 10px 0px #0000001a;
512
524
  --seed-shadow-s3: 0px 4px 16px 0px #0000001f;
513
525
  }
514
526
 
515
527
  :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"] {
516
- --seed-color-palette-blue-100: #202742;
517
- --seed-color-palette-blue-200: #1e3352;
518
- --seed-color-palette-blue-300: #1a4275;
519
- --seed-color-palette-blue-400: #0f559e;
520
- --seed-color-palette-blue-500: #1964d8;
521
- --seed-color-palette-blue-600: #1e82eb;
522
- --seed-color-palette-blue-700: #41a2f9;
523
- --seed-color-palette-blue-800: #83bcf9;
524
- --seed-color-palette-blue-900: #b9d7fb;
525
- --seed-color-palette-blue-1000: #e5f0fe;
526
- --seed-color-palette-carrot-100: #31241f;
527
- --seed-color-palette-carrot-200: #4b291c;
528
- --seed-color-palette-carrot-300: #6b311c;
529
- --seed-color-palette-carrot-400: #923600;
530
- --seed-color-palette-carrot-500: #bd4201;
531
- --seed-color-palette-carrot-600: #e65200;
532
- --seed-color-palette-carrot-700: #f60;
533
- --seed-color-palette-carrot-800: #ff9e65;
534
- --seed-color-palette-carrot-900: #eecebc;
535
- --seed-color-palette-carrot-1000: #f4eeea;
536
528
  --seed-color-palette-gray-00: #000;
537
529
  --seed-color-palette-gray-100: #16171b;
538
530
  --seed-color-palette-gray-200: #1d2025;
@@ -544,6 +536,36 @@
544
536
  --seed-color-palette-gray-800: #dcdee3;
545
537
  --seed-color-palette-gray-900: #e9eaec;
546
538
  --seed-color-palette-gray-1000: #f3f4f5;
539
+ --seed-color-palette-carrot-100: #31241f;
540
+ --seed-color-palette-carrot-200: #4b291c;
541
+ --seed-color-palette-carrot-300: #6b311c;
542
+ --seed-color-palette-carrot-400: #923600;
543
+ --seed-color-palette-carrot-500: #bd4201;
544
+ --seed-color-palette-carrot-600: #e65200;
545
+ --seed-color-palette-carrot-700: #f60;
546
+ --seed-color-palette-carrot-800: #ff9e65;
547
+ --seed-color-palette-carrot-900: #eecebc;
548
+ --seed-color-palette-carrot-1000: #f4eeea;
549
+ --seed-color-palette-blue-100: #202742;
550
+ --seed-color-palette-blue-200: #1e3352;
551
+ --seed-color-palette-blue-300: #1a4275;
552
+ --seed-color-palette-blue-400: #0f559e;
553
+ --seed-color-palette-blue-500: #1964d8;
554
+ --seed-color-palette-blue-600: #1e82eb;
555
+ --seed-color-palette-blue-700: #41a2f9;
556
+ --seed-color-palette-blue-800: #83bcf9;
557
+ --seed-color-palette-blue-900: #b9d7fb;
558
+ --seed-color-palette-blue-1000: #e5f0fe;
559
+ --seed-color-palette-red-100: #322323;
560
+ --seed-color-palette-red-200: #4f2624;
561
+ --seed-color-palette-red-300: #742826;
562
+ --seed-color-palette-red-400: #a12621;
563
+ --seed-color-palette-red-500: #ca2319;
564
+ --seed-color-palette-red-600: #f73526;
565
+ --seed-color-palette-red-700: #ff6e60;
566
+ --seed-color-palette-red-800: #ffa299;
567
+ --seed-color-palette-red-900: #f8c5c3;
568
+ --seed-color-palette-red-1000: #fdf2f2;
547
569
  --seed-color-palette-green-100: #202926;
548
570
  --seed-color-palette-green-200: #20362e;
549
571
  --seed-color-palette-green-300: #20493b;
@@ -554,6 +576,16 @@
554
576
  --seed-color-palette-green-800: #35ce9a;
555
577
  --seed-color-palette-green-900: #93e5c0;
556
578
  --seed-color-palette-green-1000: #d4f6ef;
579
+ --seed-color-palette-yellow-100: #302819;
580
+ --seed-color-palette-yellow-200: #413218;
581
+ --seed-color-palette-yellow-300: #543e15;
582
+ --seed-color-palette-yellow-400: #714e15;
583
+ --seed-color-palette-yellow-500: #91601b;
584
+ --seed-color-palette-yellow-600: #b6720d;
585
+ --seed-color-palette-yellow-700: #ca901c;
586
+ --seed-color-palette-yellow-800: #dab156;
587
+ --seed-color-palette-yellow-900: #e5d49b;
588
+ --seed-color-palette-yellow-1000: #f7f0cd;
557
589
  --seed-color-palette-purple-100: #28213b;
558
590
  --seed-color-palette-purple-200: #3b2873;
559
591
  --seed-color-palette-purple-300: #443081;
@@ -564,18 +596,7 @@
564
596
  --seed-color-palette-purple-800: #beadf2;
565
597
  --seed-color-palette-purple-900: #d9cefa;
566
598
  --seed-color-palette-purple-1000: #f0edfc;
567
- --seed-color-palette-red-100: #322323;
568
- --seed-color-palette-red-200: #4f2624;
569
- --seed-color-palette-red-300: #742826;
570
- --seed-color-palette-red-400: #a12621;
571
- --seed-color-palette-red-500: #ca2319;
572
- --seed-color-palette-red-600: #f73526;
573
- --seed-color-palette-red-700: #ff6e60;
574
- --seed-color-palette-red-800: #ffa299;
575
- --seed-color-palette-red-900: #f8c5c3;
576
- --seed-color-palette-red-1000: #fdf2f2;
577
599
  --seed-color-palette-static-black: #000;
578
- --seed-color-palette-static-white: #fff;
579
600
  --seed-color-palette-static-black-alpha-100: #00000007;
580
601
  --seed-color-palette-static-black-alpha-200: #0000000c;
581
602
  --seed-color-palette-static-black-alpha-300: #00000010;
@@ -586,6 +607,7 @@
586
607
  --seed-color-palette-static-black-alpha-800: #000000a2;
587
608
  --seed-color-palette-static-black-alpha-900: #000000d0;
588
609
  --seed-color-palette-static-black-alpha-1000: #000000e3;
610
+ --seed-color-palette-static-white: #fff;
589
611
  --seed-color-palette-static-white-alpha-50: #ffffff0d;
590
612
  --seed-color-palette-static-white-alpha-100: #ffffff17;
591
613
  --seed-color-palette-static-white-alpha-200: #ffffff20;
@@ -597,114 +619,116 @@
597
619
  --seed-color-palette-static-white-alpha-800: #ffffffde;
598
620
  --seed-color-palette-static-white-alpha-900: #ffffffea;
599
621
  --seed-color-palette-static-white-alpha-1000: #fffffff4;
600
- --seed-color-palette-yellow-100: #302819;
601
- --seed-color-palette-yellow-200: #413218;
602
- --seed-color-palette-yellow-300: #543e15;
603
- --seed-color-palette-yellow-400: #714e15;
604
- --seed-color-palette-yellow-500: #91601b;
605
- --seed-color-palette-yellow-600: #b6720d;
606
- --seed-color-palette-yellow-700: #ca901c;
607
- --seed-color-palette-yellow-800: #dab156;
608
- --seed-color-palette-yellow-900: #e5d49b;
609
- --seed-color-palette-yellow-1000: #f7f0cd;
610
- --seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
611
- --seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
612
- --seed-color-fg-disabled: var(--seed-color-palette-gray-500);
613
622
  --seed-color-fg-brand: var(--seed-color-palette-carrot-700);
614
- --seed-color-fg-informative: var(--seed-color-palette-blue-700);
615
- --seed-color-fg-critical: var(--seed-color-palette-red-700);
616
- --seed-color-fg-positive: var(--seed-color-palette-green-700);
617
- --seed-color-fg-warning: var(--seed-color-palette-yellow-700);
618
623
  --seed-color-fg-brand-contrast: var(--seed-color-palette-carrot-700);
624
+ --seed-color-fg-critical: var(--seed-color-palette-red-700);
619
625
  --seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
626
+ --seed-color-fg-disabled: var(--seed-color-palette-gray-500);
627
+ --seed-color-fg-informative: var(--seed-color-palette-blue-700);
620
628
  --seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
629
+ --seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
630
+ --seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-100);
621
631
  --seed-color-fg-neutral-muted: var(--seed-color-palette-gray-800);
622
632
  --seed-color-fg-neutral-subtle: var(--seed-color-palette-gray-700);
623
- --seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-100);
633
+ --seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
634
+ --seed-color-fg-positive: var(--seed-color-palette-green-700);
624
635
  --seed-color-fg-positive-contrast: var(--seed-color-palette-green-900);
636
+ --seed-color-fg-warning: var(--seed-color-palette-yellow-700);
625
637
  --seed-color-fg-warning-contrast: var(--seed-color-palette-yellow-900);
626
- --seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
627
- --seed-color-bg-disabled: var(--seed-color-palette-gray-300);
628
- --seed-color-bg-brand-weak: var(--seed-color-palette-carrot-100);
629
638
  --seed-color-bg-brand-solid: var(--seed-color-palette-carrot-700);
630
639
  --seed-color-bg-brand-solid-pressed: var(--seed-color-palette-carrot-800);
640
+ --seed-color-bg-brand-weak: var(--seed-color-palette-carrot-100);
631
641
  --seed-color-bg-brand-weak-pressed: var(--seed-color-palette-carrot-200);
632
- --seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
633
642
  --seed-color-bg-critical-solid: var(--seed-color-palette-red-600);
634
643
  --seed-color-bg-critical-solid-pressed: var(--seed-color-palette-red-700);
644
+ --seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
635
645
  --seed-color-bg-critical-weak-pressed: var(--seed-color-palette-red-200);
636
- --seed-color-bg-informative-weak: var(--seed-color-palette-blue-100);
646
+ --seed-color-bg-disabled: var(--seed-color-palette-gray-300);
637
647
  --seed-color-bg-informative-solid: var(--seed-color-palette-blue-600);
638
648
  --seed-color-bg-informative-solid-pressed: var(--seed-color-palette-blue-700);
649
+ --seed-color-bg-informative-weak: var(--seed-color-palette-blue-100);
639
650
  --seed-color-bg-informative-weak-pressed: var(--seed-color-palette-blue-200);
640
651
  --seed-color-bg-layer-basement: var(--seed-color-palette-gray-00);
641
652
  --seed-color-bg-layer-default: var(--seed-color-palette-gray-100);
653
+ --seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-300);
642
654
  --seed-color-bg-layer-fill: var(--seed-color-palette-gray-200);
643
655
  --seed-color-bg-layer-floating: var(--seed-color-palette-gray-200);
644
- --seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-300);
645
656
  --seed-color-bg-layer-floating-pressed: var(--seed-color-palette-gray-300);
646
657
  --seed-color-bg-magic-weak: #201f1f;
647
- --seed-color-bg-neutral-weak: var(--seed-color-palette-gray-300);
648
658
  --seed-color-bg-neutral-inverted: var(--seed-color-palette-gray-1000);
649
- --seed-color-bg-neutral-solid: var(--seed-color-palette-gray-300);
650
659
  --seed-color-bg-neutral-inverted-pressed: var(--seed-color-palette-gray-800);
660
+ --seed-color-bg-neutral-solid: var(--seed-color-palette-gray-300);
651
661
  --seed-color-bg-neutral-solid-muted: var(--seed-color-palette-gray-400);
652
662
  --seed-color-bg-neutral-solid-muted-pressed: var(--seed-color-palette-gray-500);
663
+ --seed-color-bg-neutral-weak: var(--seed-color-palette-gray-300);
664
+ --seed-color-bg-neutral-weak-alpha: var(--seed-color-palette-static-white-alpha-200);
665
+ --seed-color-bg-neutral-weak-alpha-pressed: var(--seed-color-palette-static-white-alpha-300);
653
666
  --seed-color-bg-neutral-weak-pressed: var(--seed-color-palette-gray-400);
667
+ --seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
654
668
  --seed-color-bg-overlay-muted: var(--seed-color-palette-static-black-alpha-500);
655
- --seed-color-bg-positive-weak: var(--seed-color-palette-green-100);
656
669
  --seed-color-bg-positive-solid: var(--seed-color-palette-green-500);
657
670
  --seed-color-bg-positive-solid-pressed: var(--seed-color-palette-green-600);
671
+ --seed-color-bg-positive-weak: var(--seed-color-palette-green-100);
658
672
  --seed-color-bg-positive-weak-pressed: var(--seed-color-palette-green-200);
659
- --seed-color-bg-warning-weak: var(--seed-color-palette-yellow-100);
673
+ --seed-color-bg-transparent: #fff0;
674
+ --seed-color-bg-transparent-pressed: var(--seed-color-palette-static-white-alpha-50);
660
675
  --seed-color-bg-warning-solid: var(--seed-color-palette-yellow-800);
661
676
  --seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-900);
677
+ --seed-color-bg-warning-weak: var(--seed-color-palette-yellow-100);
662
678
  --seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
663
- --seed-color-bg-transparent: #fff0;
664
- --seed-color-bg-transparent-pressed: var(--seed-color-palette-static-white-alpha-50);
665
- --seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
666
679
  --seed-color-stroke-brand-solid: var(--seed-color-palette-carrot-700);
667
- --seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
680
+ --seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
668
681
  --seed-color-stroke-critical-solid: var(--seed-color-palette-red-700);
669
- --seed-color-stroke-informative-weak: var(--seed-color-palette-blue-300);
682
+ --seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
670
683
  --seed-color-stroke-informative-solid: var(--seed-color-palette-blue-700);
684
+ --seed-color-stroke-informative-weak: var(--seed-color-palette-blue-300);
671
685
  --seed-color-stroke-neutral-contrast: var(--seed-color-palette-gray-1000);
672
- --seed-color-stroke-neutral-solid: var(--seed-color-palette-gray-800);
673
- --seed-color-stroke-neutral-weak: var(--seed-color-palette-gray-400);
674
686
  --seed-color-stroke-neutral-muted: var(--seed-color-palette-static-white-alpha-100);
687
+ --seed-color-stroke-neutral-solid: var(--seed-color-palette-gray-800);
675
688
  --seed-color-stroke-neutral-subtle: var(--seed-color-palette-static-white-alpha-50);
676
- --seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
689
+ --seed-color-stroke-neutral-weak: var(--seed-color-palette-gray-400);
677
690
  --seed-color-stroke-positive-solid: var(--seed-color-palette-green-700);
678
- --seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
691
+ --seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
679
692
  --seed-color-stroke-warning-solid: var(--seed-color-palette-yellow-700);
693
+ --seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
694
+ --seed-color-manner-temp-l1-bg: #292929;
680
695
  --seed-color-manner-temp-l1-text: #b8b8b9;
696
+ --seed-color-manner-temp-l10-bg: #34040a;
697
+ --seed-color-manner-temp-l10-text: #fb6f82;
698
+ --seed-color-manner-temp-l2-bg: #332605;
681
699
  --seed-color-manner-temp-l2-text: #f5db97;
700
+ --seed-color-manner-temp-l3-bg: #372b01;
682
701
  --seed-color-manner-temp-l3-text: #fdda65;
683
- --seed-color-manner-temp-l4-text: #fbbe55;
684
702
  --seed-color-manner-temp-l4-bg: #372301;
685
- --seed-color-manner-temp-l5-text: #faac4b;
686
- --seed-color-manner-temp-l6-text: #fc9855;
687
- --seed-color-manner-temp-l1-bg: #292929;
688
- --seed-color-manner-temp-l2-bg: #332605;
689
- --seed-color-manner-temp-l3-bg: #372b01;
703
+ --seed-color-manner-temp-l4-text: #fbbe55;
690
704
  --seed-color-manner-temp-l5-bg: #371f01;
705
+ --seed-color-manner-temp-l5-text: #faac4b;
691
706
  --seed-color-manner-temp-l6-bg: #351b03;
692
- --seed-color-manner-temp-l7-text: #f97a25;
707
+ --seed-color-manner-temp-l6-text: #fc9855;
693
708
  --seed-color-manner-temp-l7-bg: #371701;
694
- --seed-color-manner-temp-l8-text: #fe6a34;
695
- --seed-color-manner-temp-l9-text: #fe6a5d;
709
+ --seed-color-manner-temp-l7-text: #f97a25;
696
710
  --seed-color-manner-temp-l8-bg: #380f00;
711
+ --seed-color-manner-temp-l8-text: #fe6a34;
697
712
  --seed-color-manner-temp-l9-bg: #380500;
698
- --seed-color-manner-temp-l10-text: #fb6f82;
699
- --seed-color-manner-temp-l10-bg: #34040a;
713
+ --seed-color-manner-temp-l9-text: #fe6a5d;
714
+ --seed-color-banner-blue: #0d2a3a;
715
+ --seed-color-banner-cool-gray: #242c33;
716
+ --seed-color-banner-green: #1e361c;
717
+ --seed-color-banner-orange: #42230a;
718
+ --seed-color-banner-pink: #3b172c;
719
+ --seed-color-banner-purple: #2e1e45;
720
+ --seed-color-banner-red: #3a0f15;
721
+ --seed-color-banner-teal: #143633;
722
+ --seed-color-banner-warm-gray: #2f2b27;
723
+ --seed-color-banner-yellow: #3e2b00;
700
724
  --seed-gradient-fade-layer-floating: #1d202500 0%, #000 100%;
701
725
  --seed-gradient-fade-layer-default: #000 0%, #16171b00 100%;
702
726
  --seed-gradient-glow-magic: #2d252d 0%, #3a312b 80%, #333232 100%;
703
727
  --seed-gradient-glow-magic-pressed: #3e333e 0%, #51453e 80%, #434242 100%;
704
- --seed-gradient-shimmer-neutral: #fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;
705
- --seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f51a 46%, #fff9f51a 54%, #fff9f500 100%;
706
- --seed-gradient-highlight-magic-pressed: #ff9e65 20%, #e89bee 100%;
707
728
  --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
729
+ --seed-gradient-highlight-magic-pressed: #ff9e65 20%, #e89bee 100%;
730
+ --seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f51a 46%, #fff9f51a 54%, #fff9f500 100%;
731
+ --seed-gradient-shimmer-neutral: #fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;
708
732
  --seed-shadow-s1: 0px 1px 4px 0px #00000080;
709
733
  --seed-shadow-s2: 0px 2px 10px 0px #000000ad;
710
734
  --seed-shadow-s3: 0px 4px 16px 0px #000c;
@@ -1578,6 +1602,24 @@
1578
1602
  transform: translate3d(0, 0, 0);
1579
1603
  }
1580
1604
 
1605
+ [data-global-transition-state="enter-active"] .seed-app-bar__root--transitionStyle_fadeIn[data-activity-is-top] {
1606
+ --seed-enter-translate-x: 0;
1607
+ --seed-enter-translate-y: 0;
1608
+ --seed-enter-opacity: 0;
1609
+ --seed-enter-scale: 1;
1610
+ opacity: 1;
1611
+ animation: .3s ease-out seed-enter;
1612
+ }
1613
+
1614
+ [data-global-transition-state="exit-active"] .seed-app-bar__root--transitionStyle_fadeIn[data-activity-is-top] {
1615
+ opacity: 1;
1616
+ --seed-exit-translate-x: 0;
1617
+ --seed-exit-translate-y: 0;
1618
+ --seed-exit-opacity: 0;
1619
+ --seed-exit-scale: 1;
1620
+ animation: .15s ease-in forwards seed-exit;
1621
+ }
1622
+
1581
1623
  .seed-app-bar__root--tone_layer:before {
1582
1624
  background-color: var(--seed-color-bg-layer-default);
1583
1625
  }
@@ -1814,11 +1856,6 @@
1814
1856
  --app-bar-height: 44px;
1815
1857
  }
1816
1858
 
1817
- .seed-app-screen__dim--theme_cupertino {
1818
- background: var(--seed-color-bg-overlay);
1819
- height: 100%;
1820
- }
1821
-
1822
1859
  .seed-app-screen__root--theme_android {
1823
1860
  --app-bar-height: 56px;
1824
1861
  }
@@ -1926,6 +1963,11 @@
1926
1963
  animation: none !important;
1927
1964
  }
1928
1965
 
1966
+ .seed-app-screen__dim--transitionStyle_slideFromRightIOS {
1967
+ background: var(--seed-color-bg-overlay);
1968
+ height: 100%;
1969
+ }
1970
+
1929
1971
  [data-global-transition-state="enter-active"] .seed-app-screen__dim--transitionStyle_slideFromRightIOS[data-activity-is-top] {
1930
1972
  --seed-enter-translate-x: 0;
1931
1973
  --seed-enter-translate-y: 0;
@@ -2026,6 +2068,35 @@
2026
2068
  transform: translate3d(0, 0, 0);
2027
2069
  }
2028
2070
 
2071
+ .seed-app-screen__root--transitionStyle_fadeIn {
2072
+ --z-index-dim: calc(var(--z-index-base) + 0);
2073
+ --z-index-layer: calc(var(--z-index-base) + 3);
2074
+ --z-index-edge: calc(var(--z-index-base) + 4);
2075
+ --z-index-app-bar: calc(var(--z-index-base) + 4);
2076
+ }
2077
+
2078
+ .seed-app-screen__dim--transitionStyle_fadeIn {
2079
+ display: none;
2080
+ }
2081
+
2082
+ [data-global-transition-state="enter-active"] .seed-app-screen__layer--transitionStyle_fadeIn[data-activity-is-top] {
2083
+ --seed-enter-translate-x: 0;
2084
+ --seed-enter-translate-y: 0;
2085
+ --seed-enter-opacity: 0;
2086
+ --seed-enter-scale: 1;
2087
+ opacity: 1;
2088
+ animation: .3s ease-out seed-enter;
2089
+ }
2090
+
2091
+ [data-global-transition-state="exit-active"] .seed-app-screen__layer--transitionStyle_fadeIn[data-activity-is-top] {
2092
+ opacity: 1;
2093
+ --seed-exit-translate-x: 0;
2094
+ --seed-exit-translate-y: 0;
2095
+ --seed-exit-opacity: 0;
2096
+ --seed-exit-scale: 1;
2097
+ animation: .15s ease-in forwards seed-exit;
2098
+ }
2099
+
2029
2100
  .seed-app-screen__layer--layerOffsetTop_safeArea {
2030
2101
  padding-top: var(--seed-safe-area-top);
2031
2102
  }
@@ -3015,6 +3086,7 @@
3015
3086
 
3016
3087
  .seed-checkmark__icon--variant_ghost {
3017
3088
  color: var(--seed-color-fg-placeholder);
3089
+ transition: color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
3018
3090
  display: block;
3019
3091
  }
3020
3092
 
@@ -3063,7 +3135,7 @@
3063
3135
  }
3064
3136
 
3065
3137
  .seed-checkmark__icon--variant_ghost-tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]) {
3066
- color: var(--seed-color-fg-neutral-muted);
3138
+ color: var(--seed-color-fg-neutral);
3067
3139
  }
3068
3140
 
3069
3141
  .seed-checkmark__root--variant_ghost-tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:active, [data-active]) {
@@ -3154,7 +3226,7 @@
3154
3226
  }
3155
3227
 
3156
3228
  .seed-chip__root--variant_solid {
3157
- background: var(--seed-color-bg-neutral-weak);
3229
+ background: var(--seed-color-bg-neutral-weak-alpha);
3158
3230
  --seed-icon-color: var(--seed-color-fg-neutral);
3159
3231
  }
3160
3232
 
@@ -3165,7 +3237,7 @@
3165
3237
  }
3166
3238
 
3167
3239
  .seed-chip__root--variant_solid:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
3168
- background: var(--seed-color-bg-neutral-weak-pressed);
3240
+ background: var(--seed-color-bg-neutral-weak-alpha-pressed);
3169
3241
  }
3170
3242
 
3171
3243
  .seed-chip__root--variant_solid:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
@@ -3355,7 +3427,7 @@
3355
3427
  transform: translate3d(0, 0, 0);
3356
3428
  }
3357
3429
 
3358
- .seed-chip-tabs__content:not([data-carousel]):not(:is(:selected, [data-selected])) {
3430
+ .seed-chip-tabs__content:not([data-carousel]):not(:is([aria-selected="true"], [data-selected])) {
3359
3431
  display: none;
3360
3432
  }
3361
3433
 
@@ -3398,20 +3470,20 @@
3398
3470
  }
3399
3471
 
3400
3472
  .seed-chip-tabs__trigger--variant_neutralSolid {
3401
- background-color: var(--seed-color-bg-neutral-weak);
3473
+ background-color: var(--seed-color-bg-neutral-weak-alpha);
3402
3474
  color: var(--seed-color-fg-neutral);
3403
3475
  }
3404
3476
 
3405
- .seed-chip-tabs__trigger--variant_neutralSolid:is(:selected, [data-selected]) {
3477
+ .seed-chip-tabs__trigger--variant_neutralSolid:is([aria-selected="true"], [data-selected]) {
3406
3478
  background-color: var(--seed-color-bg-neutral-inverted);
3407
3479
  color: var(--seed-color-fg-neutral-inverted);
3408
3480
  }
3409
3481
 
3410
3482
  .seed-chip-tabs__trigger--variant_neutralSolid:is(:active, [data-active]) {
3411
- background-color: var(--seed-color-bg-transparent-pressed);
3483
+ background-color: var(--seed-color-bg-neutral-weak-alpha-pressed);
3412
3484
  }
3413
3485
 
3414
- .seed-chip-tabs__trigger--variant_neutralSolid:is(:selected, [data-selected]):is(:active, [data-active]) {
3486
+ .seed-chip-tabs__trigger--variant_neutralSolid:is([aria-selected="true"], [data-selected]):is(:active, [data-active]) {
3415
3487
  background-color: var(--seed-color-bg-neutral-inverted-pressed);
3416
3488
  }
3417
3489
 
@@ -3420,7 +3492,7 @@
3420
3492
  color: var(--seed-color-fg-disabled);
3421
3493
  }
3422
3494
 
3423
- .seed-chip-tabs__trigger--variant_neutralSolid:is(:disabled, [disabled], [data-disabled]):is(:selected, [data-selected]) {
3495
+ .seed-chip-tabs__trigger--variant_neutralSolid:is(:disabled, [disabled], [data-disabled]):is([aria-selected="true"], [data-selected]) {
3424
3496
  background-color: var(--seed-color-bg-disabled);
3425
3497
  color: var(--seed-color-fg-disabled);
3426
3498
  }
@@ -3431,7 +3503,7 @@
3431
3503
  color: var(--seed-color-fg-neutral);
3432
3504
  }
3433
3505
 
3434
- .seed-chip-tabs__trigger--variant_neutralOutline:is(:selected, [data-selected]) {
3506
+ .seed-chip-tabs__trigger--variant_neutralOutline:is([aria-selected="true"], [data-selected]) {
3435
3507
  background-color: var(--seed-color-bg-neutral-inverted);
3436
3508
  color: var(--seed-color-fg-neutral-inverted);
3437
3509
  border-color: #0000;
@@ -3441,7 +3513,7 @@
3441
3513
  background-color: var(--seed-color-bg-transparent-pressed);
3442
3514
  }
3443
3515
 
3444
- .seed-chip-tabs__trigger--variant_neutralOutline:is(:selected, [data-selected]):is(:active, [data-active]) {
3516
+ .seed-chip-tabs__trigger--variant_neutralOutline:is([aria-selected="true"], [data-selected]):is(:active, [data-active]) {
3445
3517
  background-color: var(--seed-color-bg-neutral-inverted-pressed);
3446
3518
  }
3447
3519
 
@@ -3450,7 +3522,7 @@
3450
3522
  color: var(--seed-color-fg-disabled);
3451
3523
  }
3452
3524
 
3453
- .seed-chip-tabs__trigger--variant_neutralOutline:is(:disabled, [disabled], [data-disabled]):is(:selected, [data-selected]) {
3525
+ .seed-chip-tabs__trigger--variant_neutralOutline:is(:disabled, [disabled], [data-disabled]):is([aria-selected="true"], [data-selected]) {
3454
3526
  background-color: var(--seed-color-bg-disabled);
3455
3527
  color: var(--seed-color-fg-disabled);
3456
3528
  }
@@ -3460,7 +3532,7 @@
3460
3532
  color: var(--seed-color-fg-neutral-muted);
3461
3533
  }
3462
3534
 
3463
- .seed-chip-tabs__trigger--variant_brandSolid:is(:selected, [data-selected]) {
3535
+ .seed-chip-tabs__trigger--variant_brandSolid:is([aria-selected="true"], [data-selected]) {
3464
3536
  background-color: var(--seed-color-bg-brand-solid);
3465
3537
  color: var(--seed-color-palette-static-white);
3466
3538
  }
@@ -3469,7 +3541,7 @@
3469
3541
  background-color: var(--seed-color-bg-neutral-weak-pressed);
3470
3542
  }
3471
3543
 
3472
- .seed-chip-tabs__trigger--variant_brandSolid:is(:selected, [data-selected]):is(:active, [data-active]) {
3544
+ .seed-chip-tabs__trigger--variant_brandSolid:is([aria-selected="true"], [data-selected]):is(:active, [data-active]) {
3473
3545
  background-color: var(--seed-color-bg-brand-solid-pressed);
3474
3546
  }
3475
3547
 
@@ -3479,7 +3551,7 @@
3479
3551
  color: var(--seed-color-fg-disabled);
3480
3552
  }
3481
3553
 
3482
- .seed-chip-tabs__trigger--variant_brandSolid:is(:disabled, [disabled], [data-disabled]):is(:selected, [data-selected]) {
3554
+ .seed-chip-tabs__trigger--variant_brandSolid:is(:disabled, [disabled], [data-disabled]):is([aria-selected="true"], [data-selected]) {
3483
3555
  background-color: var(--seed-color-bg-disabled);
3484
3556
  }
3485
3557
 
@@ -4355,7 +4427,7 @@
4355
4427
  animation-fill-mode: forwards;
4356
4428
  }
4357
4429
 
4358
- .seed-help-bubble__content:is(:hidden, [hidden], [data-hidden]) {
4430
+ .seed-help-bubble__content:is([hidden], [data-hidden]) {
4359
4431
  display: none !important;
4360
4432
  }
4361
4433
 
@@ -5895,7 +5967,7 @@
5895
5967
  max-width: 100%;
5896
5968
  padding: var(--seed-dimension-x1);
5897
5969
  border-radius: var(--seed-radius-full);
5898
- background-color: var(--seed-color-bg-neutral-weak);
5970
+ background-color: var(--seed-color-bg-neutral-weak-alpha);
5899
5971
  isolation: isolate;
5900
5972
  grid-auto-rows: 1fr;
5901
5973
  grid-auto-columns: 1fr;
@@ -6676,7 +6748,7 @@
6676
6748
  transform: translate3d(0, 0, 0);
6677
6749
  }
6678
6750
 
6679
- .seed-tabs__content[data-ssr]:not(:is(:selected, [data-selected])), .seed-tabs__content:not([data-carousel]):not(:is(:selected, [data-selected])) {
6751
+ .seed-tabs__content[data-ssr]:not(:is([aria-selected="true"], [data-selected])), .seed-tabs__content:not([data-carousel]):not(:is([aria-selected="true"], [data-selected])) {
6680
6752
  display: none;
6681
6753
  }
6682
6754
 
@@ -6710,7 +6782,7 @@
6710
6782
  position: relative;
6711
6783
  }
6712
6784
 
6713
- .seed-tabs__trigger:is(:selected, [data-selected]) {
6785
+ .seed-tabs__trigger:is([aria-selected="true"], [data-selected]) {
6714
6786
  color: var(--seed-color-fg-neutral);
6715
6787
  }
6716
6788
 
@@ -6719,7 +6791,7 @@
6719
6791
  color: var(--seed-color-fg-disabled);
6720
6792
  }
6721
6793
 
6722
- .seed-tabs__trigger:is(:selected, [data-selected])[data-ssr]:after {
6794
+ .seed-tabs__trigger:is([aria-selected="true"], [data-selected])[data-ssr]:after {
6723
6795
  content: "";
6724
6796
  background-color: var(--seed-color-fg-neutral);
6725
6797
  height: 2px;
@@ -6742,7 +6814,7 @@
6742
6814
  flex: 1;
6743
6815
  }
6744
6816
 
6745
- .seed-tabs__trigger--triggerLayout_fill:is(:selected, [data-selected])[data-ssr]:after {
6817
+ .seed-tabs__trigger--triggerLayout_fill:is([aria-selected="true"], [data-selected])[data-ssr]:after {
6746
6818
  left: var(--seed-dimension-spacing-x-global-gutter);
6747
6819
  right: var(--seed-dimension-spacing-x-global-gutter);
6748
6820
  }
@@ -6758,7 +6830,7 @@
6758
6830
  width: calc(var(--indicator-width, 0px) - 2 * 0px);
6759
6831
  }
6760
6832
 
6761
- .seed-tabs__trigger--triggerLayout_hug:is(:selected, [data-selected])[data-ssr]:after {
6833
+ .seed-tabs__trigger--triggerLayout_hug:is([aria-selected="true"], [data-selected])[data-ssr]:after {
6762
6834
  left: 0;
6763
6835
  right: 0;
6764
6836
  }
@@ -6947,6 +7019,12 @@
6947
7019
  --seed-font-weight: var(--seed-font-weight-regular);
6948
7020
  }
6949
7021
 
7022
+ .seed-text--textStyle_articleNote {
7023
+ --seed-font-size: var(--seed-font-size-t4);
7024
+ --seed-line-height: var(--seed-line-height-t5);
7025
+ --seed-font-weight: var(--seed-font-weight-regular);
7026
+ }
7027
+
6950
7028
  .seed-text--textStyle_t1Regular {
6951
7029
  --seed-font-size: var(--seed-font-size-t1);
6952
7030
  --seed-line-height: var(--seed-line-height-t1);
@@ -7091,6 +7169,150 @@
7091
7169
  --seed-font-weight: var(--seed-font-weight-bold);
7092
7170
  }
7093
7171
 
7172
+ .seed-text--textStyle_t1StaticRegular {
7173
+ --seed-font-size: var(--seed-font-size-t1-static);
7174
+ --seed-line-height: var(--seed-line-height-t1-static);
7175
+ --seed-font-weight: var(--seed-font-weight-regular);
7176
+ }
7177
+
7178
+ .seed-text--textStyle_t1StaticMedium {
7179
+ --seed-font-size: var(--seed-font-size-t1-static);
7180
+ --seed-line-height: var(--seed-line-height-t1-static);
7181
+ --seed-font-weight: var(--seed-font-weight-medium);
7182
+ }
7183
+
7184
+ .seed-text--textStyle_t1StaticBold {
7185
+ --seed-font-size: var(--seed-font-size-t1-static);
7186
+ --seed-line-height: var(--seed-line-height-t1-static);
7187
+ --seed-font-weight: var(--seed-font-weight-bold);
7188
+ }
7189
+
7190
+ .seed-text--textStyle_t2StaticRegular {
7191
+ --seed-font-size: var(--seed-font-size-t2-static);
7192
+ --seed-line-height: var(--seed-line-height-t2-static);
7193
+ --seed-font-weight: var(--seed-font-weight-regular);
7194
+ }
7195
+
7196
+ .seed-text--textStyle_t2StaticMedium {
7197
+ --seed-font-size: var(--seed-font-size-t2-static);
7198
+ --seed-line-height: var(--seed-line-height-t2-static);
7199
+ --seed-font-weight: var(--seed-font-weight-medium);
7200
+ }
7201
+
7202
+ .seed-text--textStyle_t2StaticBold {
7203
+ --seed-font-size: var(--seed-font-size-t2-static);
7204
+ --seed-line-height: var(--seed-line-height-t2-static);
7205
+ --seed-font-weight: var(--seed-font-weight-bold);
7206
+ }
7207
+
7208
+ .seed-text--textStyle_t3StaticRegular {
7209
+ --seed-font-size: var(--seed-font-size-t3-static);
7210
+ --seed-line-height: var(--seed-line-height-t3-static);
7211
+ --seed-font-weight: var(--seed-font-weight-regular);
7212
+ }
7213
+
7214
+ .seed-text--textStyle_t3StaticMedium {
7215
+ --seed-font-size: var(--seed-font-size-t3-static);
7216
+ --seed-line-height: var(--seed-line-height-t3-static);
7217
+ --seed-font-weight: var(--seed-font-weight-medium);
7218
+ }
7219
+
7220
+ .seed-text--textStyle_t3StaticBold {
7221
+ --seed-font-size: var(--seed-font-size-t3-static);
7222
+ --seed-line-height: var(--seed-line-height-t3-static);
7223
+ --seed-font-weight: var(--seed-font-weight-bold);
7224
+ }
7225
+
7226
+ .seed-text--textStyle_t4StaticRegular {
7227
+ --seed-font-size: var(--seed-font-size-t4-static);
7228
+ --seed-line-height: var(--seed-line-height-t4-static);
7229
+ --seed-font-weight: var(--seed-font-weight-regular);
7230
+ }
7231
+
7232
+ .seed-text--textStyle_t4StaticMedium {
7233
+ --seed-font-size: var(--seed-font-size-t4-static);
7234
+ --seed-line-height: var(--seed-line-height-t4-static);
7235
+ --seed-font-weight: var(--seed-font-weight-medium);
7236
+ }
7237
+
7238
+ .seed-text--textStyle_t4StaticBold {
7239
+ --seed-font-size: var(--seed-font-size-t4-static);
7240
+ --seed-line-height: var(--seed-line-height-t4-static);
7241
+ --seed-font-weight: var(--seed-font-weight-bold);
7242
+ }
7243
+
7244
+ .seed-text--textStyle_t5StaticRegular {
7245
+ --seed-font-size: var(--seed-font-size-t5-static);
7246
+ --seed-line-height: var(--seed-line-height-t5-static);
7247
+ --seed-font-weight: var(--seed-font-weight-regular);
7248
+ }
7249
+
7250
+ .seed-text--textStyle_t5StaticMedium {
7251
+ --seed-font-size: var(--seed-font-size-t5-static);
7252
+ --seed-line-height: var(--seed-line-height-t5-static);
7253
+ --seed-font-weight: var(--seed-font-weight-medium);
7254
+ }
7255
+
7256
+ .seed-text--textStyle_t5StaticBold {
7257
+ --seed-font-size: var(--seed-font-size-t5-static);
7258
+ --seed-line-height: var(--seed-line-height-t5-static);
7259
+ --seed-font-weight: var(--seed-font-weight-bold);
7260
+ }
7261
+
7262
+ .seed-text--textStyle_t6StaticRegular {
7263
+ --seed-font-size: var(--seed-font-size-t6-static);
7264
+ --seed-line-height: var(--seed-line-height-t6-static);
7265
+ --seed-font-weight: var(--seed-font-weight-regular);
7266
+ }
7267
+
7268
+ .seed-text--textStyle_t6StaticMedium {
7269
+ --seed-font-size: var(--seed-font-size-t6-static);
7270
+ --seed-line-height: var(--seed-line-height-t6-static);
7271
+ --seed-font-weight: var(--seed-font-weight-medium);
7272
+ }
7273
+
7274
+ .seed-text--textStyle_t6StaticBold {
7275
+ --seed-font-size: var(--seed-font-size-t6-static);
7276
+ --seed-line-height: var(--seed-line-height-t6-static);
7277
+ --seed-font-weight: var(--seed-font-weight-bold);
7278
+ }
7279
+
7280
+ .seed-text--textStyle_t7StaticRegular {
7281
+ --seed-font-size: var(--seed-font-size-t7-static);
7282
+ --seed-line-height: var(--seed-line-height-t7-static);
7283
+ --seed-font-weight: var(--seed-font-weight-regular);
7284
+ }
7285
+
7286
+ .seed-text--textStyle_t7StaticMedium {
7287
+ --seed-font-size: var(--seed-font-size-t7-static);
7288
+ --seed-line-height: var(--seed-line-height-t7-static);
7289
+ --seed-font-weight: var(--seed-font-weight-medium);
7290
+ }
7291
+
7292
+ .seed-text--textStyle_t7StaticBold {
7293
+ --seed-font-size: var(--seed-font-size-t7-static);
7294
+ --seed-line-height: var(--seed-line-height-t7-static);
7295
+ --seed-font-weight: var(--seed-font-weight-bold);
7296
+ }
7297
+
7298
+ .seed-text--textStyle_t8StaticBold {
7299
+ --seed-font-size: var(--seed-font-size-t8-static);
7300
+ --seed-line-height: var(--seed-line-height-t8-static);
7301
+ --seed-font-weight: var(--seed-font-weight-bold);
7302
+ }
7303
+
7304
+ .seed-text--textStyle_t9StaticBold {
7305
+ --seed-font-size: var(--seed-font-size-t9-static);
7306
+ --seed-line-height: var(--seed-line-height-t9-static);
7307
+ --seed-font-weight: var(--seed-font-weight-bold);
7308
+ }
7309
+
7310
+ .seed-text--textStyle_t10StaticBold {
7311
+ --seed-font-size: var(--seed-font-size-t10-static);
7312
+ --seed-line-height: var(--seed-line-height-t10-static);
7313
+ --seed-font-weight: var(--seed-font-weight-bold);
7314
+ }
7315
+
7094
7316
  .seed-text--maxLines_none {
7095
7317
  overflow: unset;
7096
7318
  min-width: unset;