@seed-design/css 1.1.5 → 1.1.7

package/all.css

@@ -249,6 +249,7 @@
   --seed-duration-d4: .2s;
   --seed-duration-d5: .25s;
   --seed-duration-d6: .3s;
+  --seed-duration-color-transition: var(--seed-duration-d3);
   --seed-font-size-t1: clamp(calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-min, .8)), calc(.6875rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t1-static) * var(--seed-font-size-limit-max, 1.5)));
   --seed-font-size-t2: clamp(calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-min, .8)), calc(.75rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t2-static) * var(--seed-font-size-limit-max, 1.5)));
   --seed-font-size-t3: clamp(calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-min, .8)), calc(.8125rem * var(--seed-font-size-multiplier, 1)), calc(var(--seed-font-size-t3-static) * var(--seed-font-size-limit-max, 1.5)));
@@ -459,6 +460,8 @@
   --seed-color-bg-warning-solid: var(--seed-color-palette-yellow-300);
   --seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-400);
   --seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
+  --seed-color-bg-transparent: #0000;
+  --seed-color-bg-transparent-pressed: var(--seed-color-palette-static-black-alpha-100);
   --seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
   --seed-color-stroke-brand-solid: var(--seed-color-palette-carrot-700);
   --seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
@@ -652,6 +655,8 @@
   --seed-color-bg-warning-solid: var(--seed-color-palette-yellow-800);
   --seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-900);
   --seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
+  --seed-color-bg-transparent: #fff0;
+  --seed-color-bg-transparent-pressed: var(--seed-color-palette-static-white-alpha-50);
   --seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
   --seed-color-stroke-brand-solid: var(--seed-color-palette-carrot-700);
   --seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
@@ -744,7 +749,7 @@
 }
 
 .seed-action-button {
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
 }
 
 .seed-action-button--variant_brandSolid {
@@ -856,7 +861,7 @@
 }
 
 .seed-action-button--variant_brandOutline {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   border-style: solid;
   border-width: 1px;
   border-color: var(--seed-color-stroke-neutral-muted);
@@ -870,11 +875,11 @@
 }
 
 .seed-action-button--variant_brandOutline:is(:active, [data-active]) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-action-button--variant_brandOutline:is(:disabled, [disabled], [data-disabled]) {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   border-color: var(--seed-color-stroke-neutral-muted);
   color: var(--seed-color-fg-disabled);
   --seed-prefix-icon-color: var(--seed-color-fg-disabled);
@@ -883,11 +888,11 @@
 }
 
 .seed-action-button--variant_brandOutline[data-loading] {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
 }
 
 .seed-action-button--variant_neutralOutline {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   border-style: solid;
   border-width: 1px;
   border-color: var(--seed-color-stroke-neutral-muted);
@@ -901,11 +906,11 @@
 }
 
 .seed-action-button--variant_neutralOutline:is(:active, [data-active]) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-action-button--variant_neutralOutline:is(:disabled, [disabled], [data-disabled]) {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   border-color: var(--seed-color-stroke-neutral-muted);
   color: var(--seed-color-fg-disabled);
   --seed-prefix-icon-color: var(--seed-color-fg-disabled);
@@ -914,7 +919,7 @@
 }
 
 .seed-action-button--variant_neutralOutline[data-loading] {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
 }
 
 .seed-action-button--variant_ghost {
@@ -931,7 +936,7 @@
 }
 
 .seed-action-button--variant_ghost:is(:active, [data-active]) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-action-button--variant_ghost:is(:disabled, [disabled], [data-disabled]) {
@@ -943,7 +948,7 @@
 }
 
 .seed-action-button--variant_ghost[data-loading] {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-action-button--size_xsmall {
@@ -1359,7 +1364,8 @@
 
 .seed-app-bar__root--theme_cupertino {
   height: calc(44px + var(--seed-safe-area-top));
-  padding-inline: var(--seed-dimension-x4);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
   padding-top: var(--seed-safe-area-top);
 }
 
@@ -1383,7 +1389,8 @@
 
 .seed-app-bar__root--theme_android {
   height: calc(56px + var(--seed-safe-area-top));
-  padding-inline: var(--seed-dimension-x4);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
   padding-top: var(--seed-safe-area-top);
 }
 
@@ -1620,7 +1627,8 @@
 .seed-app-bar-main__root--theme_cupertino {
   text-align: center;
   top: var(--seed-safe-area-top);
-  padding-inline: var(--centered-title-padding-x, 0);
+  padding-left: var(--centered-title-padding-x, 0);
+  padding-right: var(--centered-title-padding-x, 0);
   pointer-events: none;
   justify-content: center;
   align-items: center;
@@ -2369,8 +2377,10 @@
 .seed-badge__root--size_medium {
   max-width: 7.5rem;
   min-height: var(--seed-dimension-x5);
-  padding-inline: var(--seed-dimension-x1_5);
-  padding-block: var(--seed-dimension-x0_5);
+  padding-left: var(--seed-dimension-x1_5);
+  padding-right: var(--seed-dimension-x1_5);
+  padding-top: var(--seed-dimension-x0_5);
+  padding-bottom: var(--seed-dimension-x0_5);
   border-radius: var(--seed-radius-r1);
   font-size: var(--seed-font-size-t1);
   line-height: var(--seed-line-height-t1);
@@ -2379,8 +2389,10 @@
 .seed-badge__root--size_large {
   max-width: 6.75rem;
   min-height: var(--seed-dimension-x6);
-  padding-inline: var(--seed-dimension-x2);
-  padding-block: var(--seed-dimension-x1);
+  padding-left: var(--seed-dimension-x2);
+  padding-right: var(--seed-dimension-x2);
+  padding-top: var(--seed-dimension-x1);
+  padding-bottom: var(--seed-dimension-x1);
   border-radius: var(--seed-radius-r1_5);
   font-size: var(--seed-font-size-t2);
   line-height: var(--seed-line-height-t2);
@@ -2615,7 +2627,8 @@
   --seed-box-max-height: initial;
   --seed-box-justify-content: initial;
   --seed-box-align-items: initial;
-  padding-inline: var(--seed-box-padding-x);
+  padding-left: var(--seed-box-padding-x);
+  padding-right: var(--seed-box-padding-x);
   height: var(--seed-box-height);
   min-height: var(--seed-box-min-height);
   max-height: var(--seed-box-max-height);
@@ -2626,7 +2639,8 @@
 }
 
 .seed-bottom-sheet__footer {
-  padding-inline: var(--seed-dimension-spacing-x-global-gutter);
+  padding-left: var(--seed-dimension-spacing-x-global-gutter);
+  padding-right: var(--seed-dimension-spacing-x-global-gutter);
   padding-top: var(--seed-dimension-x3);
   padding-bottom: var(--seed-dimension-x4);
   flex-direction: column;
@@ -2672,7 +2686,7 @@
   background-color: var(--seed-color-palette-gray-400);
   width: 36px;
   height: 4px;
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   touch-action: pan-y;
   border-radius: 9999px;
   position: absolute;
@@ -2704,8 +2718,10 @@
   text-align: start;
   width: 100%;
   min-height: 50px;
-  padding-inline: var(--seed-dimension-x3_5);
-  padding-block: var(--seed-dimension-x3_5);
+  padding-left: var(--seed-dimension-x3_5);
+  padding-right: var(--seed-dimension-x3_5);
+  padding-top: var(--seed-dimension-x3_5);
+  padding-bottom: var(--seed-dimension-x3_5);
   align-items: center;
   gap: var(--seed-dimension-x3);
   border-radius: var(--seed-radius-r2_5);
@@ -2722,7 +2738,7 @@
 
 .seed-callout__content {
   line-height: var(--seed-line-height-t4);
-  margin-inline-end: auto;
+  margin-right: auto;
 }
 
 .seed-callout__title {
@@ -2866,7 +2882,7 @@
   cursor: pointer;
   align-items: flex-start;
   gap: var(--seed-dimension-x2);
-  max-inline-size: 100%;
+  max-width: 100%;
   display: inline-flex;
   position: relative;
 }
@@ -2899,7 +2915,7 @@
 .seed-checkbox__label--size_large {
   font-size: var(--seed-font-size-t5);
   line-height: var(--seed-line-height-t5);
-  margin-block-start: calc(18px - .65625rem);
+  margin-top: calc(var(--seed-dimension-x9) / 2 - var(--seed-line-height-t5) / 2);
 }
 
 .seed-checkbox__root--size_medium {
@@ -2910,12 +2926,13 @@
 .seed-checkbox__label--size_medium {
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
-  margin-block-start: calc(16px - .59375rem);
+  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-line-height-t4) / 2);
 }
 
 .seed-checkmark__root {
   box-sizing: border-box;
   margin-top: var(--checkmark-margin-top, 0);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   flex-shrink: 0;
   position: relative;
 }
@@ -2941,7 +2958,7 @@
 }
 
 .seed-checkmark__root--variant_square:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-checkmark__root--variant_square:is(:disabled, [disabled], [data-disabled]) {
@@ -2958,7 +2975,7 @@
 }
 
 .seed-checkmark__root--variant_ghost:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-checkmark__icon--variant_ghost {
@@ -3051,7 +3068,7 @@
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   border-radius: var(--seed-radius-full);
-  transition-duration: var(--seed-duration-d4);
+  transition-duration: var(--seed-duration-color-transition);
   transition-timing-function: var(--seed-timing-function-easing);
   border: none;
   flex-shrink: 0;
@@ -3074,7 +3091,8 @@
 
 .seed-chip__label {
   font-weight: var(--seed-font-weight-medium);
-  padding-inline: var(--seed-dimension-x1_5);
+  padding-left: var(--seed-dimension-x1_5);
+  padding-right: var(--seed-dimension-x1_5);
   justify-content: center;
   align-items: center;
   display: inline-flex;
@@ -3136,13 +3154,13 @@
 }
 
 .seed-chip__root--variant_outlineStrong {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
   --seed-icon-color: var(--seed-color-fg-neutral);
 }
 
 .seed-chip__root--variant_outlineStrong:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]) {
@@ -3171,13 +3189,13 @@
 }
 
 .seed-chip__root--variant_outlineWeak {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
   --seed-icon-color: var(--seed-color-fg-neutral);
 }
 
 .seed-chip__root--variant_outlineWeak:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]) {
@@ -3199,7 +3217,8 @@
 
 .seed-chip__root--size_large {
   height: 40px;
-  padding-inline: var(--seed-dimension-x2_5);
+  padding-left: var(--seed-dimension-x2_5);
+  padding-right: var(--seed-dimension-x2_5);
   --seed-icon-size: var(--seed-dimension-x4);
 }
 
@@ -3214,7 +3233,8 @@
 
 .seed-chip__root--size_medium {
   height: 36px;
-  padding-inline: var(--seed-dimension-x2);
+  padding-left: var(--seed-dimension-x2);
+  padding-right: var(--seed-dimension-x2);
   --seed-icon-size: var(--seed-dimension-x4);
 }
 
@@ -3233,7 +3253,8 @@
 
 .seed-chip__root--size_small {
   height: 32px;
-  padding-inline: var(--seed-dimension-x1_5);
+  padding-left: var(--seed-dimension-x1_5);
+  padding-right: var(--seed-dimension-x1_5);
   --seed-icon-size: var(--seed-dimension-x3_5);
 }
 
@@ -3312,6 +3333,7 @@
   padding-bottom: var(--seed-dimension-x2);
   font-family: inherit;
   font-weight: var(--seed-font-weight-medium);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   border: none;
   justify-content: center;
   align-items: center;
@@ -3351,7 +3373,7 @@
 }
 
 .seed-chip-tabs__trigger--variant_neutralSolid:is(:active, [data-active]) {
-  background-color: var(--seed-color-bg-layer-default-pressed);
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-chip-tabs__trigger--variant_neutralSolid:is(:selected, [data-selected]):is(:active, [data-active]) {
@@ -3369,9 +3391,9 @@
 }
 
 .seed-chip-tabs__trigger--variant_neutralOutline {
+  background-color: var(--seed-color-bg-transparent);
   border: 1px solid var(--seed-color-stroke-neutral-muted);
   color: var(--seed-color-fg-neutral);
-  background-color: #0000;
 }
 
 .seed-chip-tabs__trigger--variant_neutralOutline:is(:selected, [data-selected]) {
@@ -3381,7 +3403,7 @@
 }
 
 .seed-chip-tabs__trigger--variant_neutralOutline:is(:active, [data-active]) {
-  background-color: var(--seed-color-bg-layer-default-pressed);
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-chip-tabs__trigger--variant_neutralOutline:is(:selected, [data-selected]):is(:active, [data-active]) {
@@ -3497,7 +3519,7 @@
   --seed-icon-size: 22px;
   --size: 16px;
   --thickness: 2px;
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   box-shadow: 0 2px 6px #00000026;
 }
 
@@ -3551,8 +3573,10 @@
 
 .seed-contextual-floating-button--layout_withText {
   min-height: 36px;
-  padding-inline: var(--seed-dimension-x3_5);
-  padding-block: var(--seed-dimension-x2);
+  padding-left: var(--seed-dimension-x3_5);
+  padding-right: var(--seed-dimension-x3_5);
+  padding-top: var(--seed-dimension-x2);
+  padding-bottom: var(--seed-dimension-x2);
   gap: var(--seed-dimension-x1);
   --seed-prefix-icon-size: 16px;
 }
@@ -3736,7 +3760,8 @@
 }
 
 .seed-dialog__header {
-  padding-inline: var(--seed-dimension-x5);
+  padding-left: var(--seed-dimension-x5);
+  padding-right: var(--seed-dimension-x5);
   padding-top: var(--seed-dimension-x5);
   gap: var(--seed-dimension-x1_5);
   flex-direction: column;
@@ -3761,7 +3786,8 @@
 }
 
 .seed-dialog__footer {
-  padding-inline: var(--seed-dimension-x5);
+  padding-left: var(--seed-dimension-x5);
+  padding-right: var(--seed-dimension-x5);
   padding-top: var(--seed-dimension-x4);
   padding-bottom: var(--seed-dimension-x5);
   flex-direction: column;
@@ -4059,7 +4085,8 @@
 }
 
 .seed-field__header {
-  padding-inline: var(--seed-dimension-x0_5);
+  padding-left: var(--seed-dimension-x0_5);
+  padding-right: var(--seed-dimension-x0_5);
   justify-content: space-between;
   align-items: center;
   gap: var(--seed-dimension-x2_5);
@@ -4067,7 +4094,8 @@
 }
 
 .seed-field__footer {
-  padding-inline: var(--seed-dimension-x0_5);
+  padding-left: var(--seed-dimension-x0_5);
+  padding-right: var(--seed-dimension-x0_5);
   justify-content: space-between;
   align-items: flex-start;
   gap: var(--seed-dimension-x2);
@@ -4136,7 +4164,7 @@
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t5);
   font-weight: var(--seed-font-weight-regular);
-  padding-inline-start: .25rem;
+  padding-left: .25rem;
   display: inline;
 }
 
@@ -4145,8 +4173,8 @@
   width: .375rem;
   height: .375rem;
   color: var(--seed-color-fg-critical);
-  margin-block-start: .25rem;
-  margin-inline-start: .125rem;
+  margin-top: .25rem;
+  margin-left: .125rem;
   display: inline;
 }
 
@@ -4187,7 +4215,7 @@
   font-size: var(--seed-font-size-t5);
   line-height: var(--seed-line-height-t5);
   font-weight: var(--seed-font-weight-bold);
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing), max-width var(--seed-duration-d4) var(--seed-timing-function-easing), height var(--seed-duration-d4) var(--seed-timing-function-easing), padding var(--seed-duration-d4) var(--seed-timing-function-easing);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), max-width var(--seed-duration-d4) var(--seed-timing-function-easing), height var(--seed-duration-d4) var(--seed-timing-function-easing), padding var(--seed-duration-d4) var(--seed-timing-function-easing);
   position: relative;
   overflow: hidden;
   box-shadow: 0 2px 6px #00000026;
@@ -4213,7 +4241,8 @@
 }
 
 .seed-floating-action-button__root--extended_true {
-  padding-inline: var(--seed-dimension-x4_5);
+  padding-left: var(--seed-dimension-x4_5);
+  padding-right: var(--seed-dimension-x4_5);
   width: fit-content;
   max-width: 999px;
   height: 48px;
@@ -4248,8 +4277,10 @@
 
 .seed-help-bubble__content {
   background: var(--seed-color-bg-neutral-inverted);
-  padding-inline: var(--seed-dimension-x3);
-  padding-block: var(--seed-dimension-x2_5);
+  padding-left: var(--seed-dimension-x3);
+  padding-right: var(--seed-dimension-x3);
+  padding-top: var(--seed-dimension-x2_5);
+  padding-bottom: var(--seed-dimension-x2_5);
   border-radius: var(--seed-radius-r3);
   word-break: keep-all;
   --seed-box-max-width: initial;
@@ -4517,7 +4548,8 @@
   height: var(--seed-dimension-x13);
   align-items: center;
   gap: var(--seed-dimension-x2_5);
-  padding-inline: var(--seed-dimension-x4);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
   display: flex;
   position: relative;
 }
@@ -4526,9 +4558,9 @@
   z-index: -1;
   cursor: pointer;
   border-radius: var(--seed-radius-r3);
+  background-color: var(--seed-color-bg-transparent);
   box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
-  transition: box-shadow var(--seed-duration-d3) var(--seed-timing-function-easing), background-color var(--seed-duration-d3) var(--seed-timing-function-easing);
-  background-color: #0000;
+  transition: box-shadow var(--seed-duration-color-transition) var(--seed-timing-function-easing), background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   border: none;
   padding: 0;
   position: absolute;
@@ -4541,7 +4573,7 @@
 }
 
 .seed-input-button__button:not([data-disabled]):not([data-readonly]):is(:active, [data-active]) {
-  background-color: var(--seed-color-bg-layer-default-pressed);
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-input-button__button[data-readonly]:not([data-disabled]) {
@@ -4690,8 +4722,10 @@
   gap: var(--seed-dimension-x2_5);
   box-sizing: border-box;
   width: 100%;
-  padding-inline: var(--seed-dimension-spacing-x-global-gutter);
-  padding-block: var(--seed-dimension-x2);
+  padding-left: var(--seed-dimension-spacing-x-global-gutter);
+  padding-right: var(--seed-dimension-spacing-x-global-gutter);
+  padding-top: var(--seed-dimension-x2);
+  padding-bottom: var(--seed-dimension-x2);
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
   justify-content: space-between;
@@ -4714,12 +4748,14 @@
   -moz-osx-font-smoothing: grayscale;
   z-index: 0;
   width: 100%;
-  padding-inline: var(--seed-dimension-spacing-x-global-gutter);
-  padding-block: var(--seed-dimension-x3);
+  padding-left: var(--seed-dimension-spacing-x-global-gutter);
+  padding-right: var(--seed-dimension-spacing-x-global-gutter);
+  padding-top: var(--seed-dimension-x3);
+  padding-bottom: var(--seed-dimension-x3);
   --seed-box-align-items: center;
   align-items: var(--seed-box-align-items);
   transition-property: background-color;
-  transition-duration: var(--seed-duration-d3);
+  transition-duration: var(--seed-duration-color-transition);
   transition-timing-function: var(--seed-timing-function-easing);
   border: none;
   font-family: inherit;
@@ -4764,12 +4800,12 @@
 .seed-list-item__content {
   box-sizing: border-box;
   text-align: start;
+  background-color: var(--seed-color-bg-transparent);
   --seed-box-gap: var(--seed-dimension-x0_5);
   align-items: flex-start;
   gap: var(--seed-box-gap);
   --seed-box-padding-right: var(--seed-dimension-x2_5);
   padding: 0 var(--seed-box-padding-right) 0 0;
-  background: none;
   border: none;
   flex-direction: column;
   flex-grow: 1;
@@ -4788,14 +4824,14 @@
   content: "";
   z-index: -1;
   transition-property: background-color;
-  transition-duration: var(--seed-duration-d3);
+  transition-duration: var(--seed-duration-color-transition);
   transition-timing-function: var(--seed-timing-function-easing);
   position: absolute;
   inset: 0;
 }
 
 .seed-list-item__content:is(button, a):not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]):before, .seed-list-item__content:not(:is(:disabled, [disabled], [data-disabled]))[data-active]:before {
-  background-color: var(--seed-color-bg-layer-default-pressed);
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-list-item__title {
@@ -4889,8 +4925,10 @@
   -moz-osx-font-smoothing: grayscale;
   border-radius: var(--seed-radius-full);
   min-height: var(--seed-dimension-x5);
-  padding-inline: var(--seed-dimension-x1_5);
-  padding-block: var(--seed-dimension-x0_5);
+  padding-left: var(--seed-dimension-x1_5);
+  padding-right: var(--seed-dimension-x1_5);
+  padding-top: var(--seed-dimension-x0_5);
+  padding-bottom: var(--seed-dimension-x0_5);
   font-size: var(--seed-font-size-t1);
   line-height: var(--seed-line-height-t1);
   font-weight: var(--seed-font-weight-bold);
@@ -4994,8 +5032,10 @@
   word-break: break-all;
   z-index: calc(var(--sheet-z-index)  + var(--layer-index, 0));
   background: var(--seed-color-bg-layer-floating);
-  padding-inline: var(--seed-dimension-spacing-x-global-gutter);
-  padding-block: var(--seed-dimension-x4);
+  padding-left: var(--seed-dimension-spacing-x-global-gutter);
+  padding-right: var(--seed-dimension-spacing-x-global-gutter);
+  padding-top: var(--seed-dimension-x4);
+  padding-bottom: var(--seed-dimension-x4);
   border-top-left-radius: var(--seed-radius-r5);
   border-top-right-radius: var(--seed-radius-r5);
   flex-direction: column;
@@ -5066,8 +5106,10 @@
 .seed-menu-sheet__closeButton {
   background-color: var(--seed-color-bg-neutral-weak);
   min-height: 52px;
-  padding-inline: var(--seed-dimension-x5);
-  padding-block: var(--seed-dimension-x3_5);
+  padding-left: var(--seed-dimension-x5);
+  padding-right: var(--seed-dimension-x5);
+  padding-top: var(--seed-dimension-x3_5);
+  padding-bottom: var(--seed-dimension-x3_5);
   border-radius: var(--seed-radius-r3);
   color: var(--seed-color-fg-neutral);
   font-family: inherit;
@@ -5088,8 +5130,10 @@
 .seed-menu-sheet-item {
   background-color: var(--seed-color-bg-neutral-weak);
   min-height: 52px;
-  padding-inline: var(--seed-dimension-x4);
-  padding-block: var(--seed-dimension-x3_5);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
+  padding-top: var(--seed-dimension-x3_5);
+  padding-bottom: var(--seed-dimension-x3_5);
   align-items: center;
   gap: var(--seed-dimension-x3_5);
   box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-muted);
@@ -5155,11 +5199,13 @@
 .seed-notification-badge--size_large {
   border-radius: var(--seed-radius-full);
   min-height: 18px;
-  padding-inline: var(--seed-dimension-x1);
+  padding-left: var(--seed-dimension-x1);
+  padding-right: var(--seed-dimension-x1);
   font-size: var(--seed-font-size-t1);
   line-height: var(--seed-line-height-t1);
   font-weight: var(--seed-font-weight-bold);
-  padding-block: 0;
+  padding-top: 0;
+  padding-bottom: 0;
 }
 
 .seed-notification-badge-positioner {
@@ -5171,29 +5217,29 @@
 }
 
 .seed-notification-badge-positioner--attach_icon {
-  inset-block-end: auto;
-  inset-inline-start: auto;
+  bottom: auto;
+  left: auto;
   translate: 100% -100%;
 }
 
 .seed-notification-badge-positioner--attach_text {
-  inset-block-end: auto;
-  inset-inline-start: auto;
+  bottom: auto;
+  left: auto;
   translate: 100%;
 }
 
 .seed-notification-badge-positioner--size_large-attach_icon {
-  inset-block-start: 14px;
-  inset-inline-end: 8px;
+  top: 14px;
+  right: 8px;
 }
 
 .seed-notification-badge-positioner--size_small-attach_icon {
-  inset-block-start: 7px;
-  inset-inline-end: 7px;
+  top: 7px;
+  right: 7px;
 }
 
 .seed-notification-badge-positioner--size_large-attach_text, .seed-notification-badge-positioner--size_small-attach_text {
-  inset-inline-end: -2px;
+  right: -2px;
 }
 
 .seed-page-banner__root {
@@ -5205,8 +5251,10 @@
   text-align: start;
   width: 100%;
   min-height: var(--seed-dimension-x10);
-  padding-inline: var(--seed-dimension-x4);
-  padding-block: var(--seed-dimension-x2_5);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
+  padding-top: var(--seed-dimension-x2_5);
+  padding-bottom: var(--seed-dimension-x2_5);
   --seed-prefix-icon-size: var(--seed-dimension-x4);
   --seed-prefix-icon-margin-right: var(--seed-dimension-x2);
   --seed-prefix-icon-margin-top: calc((var(--seed-dimension-x10)  - var(--seed-dimension-x4)) * .5 - var(--seed-dimension-x2_5));
@@ -5501,7 +5549,7 @@
   cursor: pointer;
   align-items: flex-start;
   gap: var(--seed-dimension-x2);
-  max-inline-size: 100%;
+  max-width: 100%;
   display: inline-flex;
   position: relative;
 }
@@ -5534,7 +5582,7 @@
 .seed-radio__label--size_large {
   font-size: var(--seed-font-size-t5);
   line-height: var(--seed-line-height-t5);
-  margin-block-start: calc(18px - .65625rem);
+  margin-top: calc(var(--seed-dimension-x9) / 2 - var(--seed-line-height-t5) / 2);
 }
 
 .seed-radio__root--size_medium {
@@ -5545,7 +5593,7 @@
 .seed-radio__label--size_medium {
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
-  margin-block-start: calc(16px - .59375rem);
+  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-line-height-t4) / 2);
 }
 
 .seed-radiomark__root {
@@ -5555,6 +5603,7 @@
   border-color: var(--seed-color-stroke-neutral-weak);
   border-radius: var(--seed-radius-full);
   margin-top: var(--radiomark-margin-top, 0);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   flex: none;
   justify-content: center;
   align-items: center;
@@ -5563,7 +5612,7 @@
 }
 
 .seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
-  background-color: var(--seed-color-bg-layer-default-pressed);
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-radiomark__root:is(:checked, [data-checked]) {
@@ -5575,9 +5624,9 @@
 }
 
 .seed-radiomark__root:is(:disabled, [disabled], [data-disabled]):is(:checked, [data-checked]) {
+  background-color: var(--seed-color-bg-transparent);
   border-width: 1px;
   border-color: var(--seed-color-palette-gray-300);
-  background: none;
 }
 
 .seed-radiomark__icon {
@@ -5670,10 +5719,11 @@
 }
 
 .seed-reaction-button {
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing);
-  background: var(--seed-color-bg-neutral-weak);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), box-shadow var(--seed-duration-color-transition) var(--seed-timing-function-easing);
+  background: var(--seed-color-bg-transparent);
   font-weight: var(--seed-font-weight-medium);
   color: var(--seed-color-fg-neutral);
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
   --track-color: var(--seed-color-palette-gray-500);
   --range-color: var(--seed-color-fg-neutral);
   --seed-count-font-weight: var(--seed-font-weight-bold);
@@ -5681,11 +5731,11 @@
 }
 
 .seed-reaction-button:is(:active, [data-active]) {
-  background: var(--seed-color-bg-neutral-weak-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-reaction-button:is([aria-pressed="true"], [data-pressed]) {
-  background: var(--seed-color-bg-layer-default);
+  background: var(--seed-color-bg-transparent);
   color: var(--seed-color-fg-brand);
   box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
   --seed-prefix-icon-color: var(--seed-color-fg-brand);
@@ -5693,7 +5743,7 @@
 }
 
 .seed-reaction-button:is([aria-pressed="true"], [data-pressed]):is(:active, [data-active]) {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-reaction-button:is(:disabled, [disabled], [data-disabled]) {
@@ -5710,7 +5760,7 @@
 }
 
 .seed-reaction-button:is([aria-pressed="true"], [data-pressed])[data-loading] {
-  background: var(--seed-color-bg-layer-default-pressed);
+  background: var(--seed-color-bg-transparent-pressed);
   box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
   --track-color: var(--seed-color-palette-carrot-200);
   --range-color: var(--seed-color-fg-brand);
@@ -5718,8 +5768,10 @@
 
 .seed-reaction-button--size_xsmall {
   height: var(--seed-dimension-x8);
-  padding-inline: var(--seed-dimension-x3);
-  padding-block: var(--seed-dimension-x1_5);
+  padding-left: var(--seed-dimension-x3);
+  padding-right: var(--seed-dimension-x3);
+  padding-top: var(--seed-dimension-x1_5);
+  padding-bottom: var(--seed-dimension-x1_5);
   gap: var(--seed-dimension-x1);
   border-radius: var(--seed-radius-full);
   font-size: var(--seed-font-size-t3);
@@ -5733,8 +5785,10 @@
 
 .seed-reaction-button--size_small {
   height: var(--seed-dimension-x9);
-  padding-inline: var(--seed-dimension-x3_5);
-  padding-block: var(--seed-dimension-x2);
+  padding-left: var(--seed-dimension-x3_5);
+  padding-right: var(--seed-dimension-x3_5);
+  padding-top: var(--seed-dimension-x2);
+  padding-bottom: var(--seed-dimension-x2);
   gap: var(--seed-dimension-x1);
   border-radius: var(--seed-radius-full);
   font-size: var(--seed-font-size-t3);
@@ -5790,14 +5844,15 @@
   z-index: -1;
   will-change: transform;
   transform: translateX(calc(var(--segment-index) * 100%));
-  inset-block: var(--seed-dimension-x1);
+  top: var(--seed-dimension-x1);
+  bottom: var(--seed-dimension-x1);
+  left: var(--seed-dimension-x1);
   width: calc((100% - var(--seed-dimension-x1) * 2) / var(--segment-count));
   border-radius: var(--seed-radius-full);
   background-color: var(--seed-color-palette-gray-00);
   box-shadow: 0px 1px 6px 0px #0000000d, inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
   transition: transform var(--seed-duration-d4) var(--seed-timing-function-easing);
   position: absolute;
-  inset-inline-start: var(--seed-dimension-x1);
 }
 
 .seed-segmented-control__item {
@@ -5812,14 +5867,16 @@
   min-width: 86px;
   height: 100%;
   min-height: 34px;
-  padding-inline: var(--seed-dimension-x6);
-  padding-block: var(--seed-dimension-x1_5);
+  padding-left: var(--seed-dimension-x6);
+  padding-right: var(--seed-dimension-x6);
+  padding-top: var(--seed-dimension-x1_5);
+  padding-bottom: var(--seed-dimension-x1_5);
   border-radius: var(--seed-radius-full);
   font-weight: var(--seed-font-weight-bold);
   font-size: var(--seed-font-size-t5);
   line-height: var(--seed-line-height-t5);
   color: var(--seed-color-fg-neutral-subtle);
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing), color var(--seed-duration-d4) var(--seed-timing-function-easing);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   display: flex;
 }
 
@@ -5850,15 +5907,19 @@
   justify-content: space-between;
   align-items: center;
   gap: var(--seed-dimension-x2_5);
-  padding-inline: var(--seed-dimension-x4);
-  padding-block: var(--seed-dimension-x5);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
+  padding-top: var(--seed-dimension-x5);
+  padding-bottom: var(--seed-dimension-x5);
   border-radius: var(--seed-radius-r3);
   box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
+  background-color: var(--seed-color-bg-transparent);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   display: flex;
 }
 
 .seed-select-box__root:is(:active, [data-active]) {
-  background-color: var(--seed-color-bg-layer-default-pressed);
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
 .seed-select-box__root:is(:checked, [data-checked]) {
@@ -6058,9 +6119,12 @@
 }
 
 .seed-slider__valueIndicatorRoot {
+  box-sizing: border-box;
   background: var(--seed-color-bg-neutral-inverted);
-  padding-inline: var(--seed-dimension-x1_5);
-  padding-block: var(--seed-dimension-x0_5);
+  padding-left: var(--seed-dimension-x1_5);
+  padding-right: var(--seed-dimension-x1_5);
+  padding-top: var(--seed-dimension-x0_5);
+  padding-bottom: var(--seed-dimension-x0_5);
   border-radius: var(--seed-radius-r1);
   color: var(--seed-color-fg-neutral-inverted);
   font-size: var(--seed-font-size-t1);
@@ -6068,72 +6132,68 @@
   font-weight: var(--seed-font-weight-medium);
   white-space: pre-wrap;
   text-align: center;
-  width: max-content;
-  bottom: calc(100% + var(--seed-dimension-x3));
-  opacity: 0;
   flex-direction: column;
+  align-items: center;
+  width: max-content;
   display: flex;
   position: absolute;
+  top: 50%;
 }
 
 .seed-slider__valueIndicatorRoot[data-dir="ltr"] {
-  left: calc(var(--indicator-position) * 1% + var(--indicator-offset));
-  transform: translateX(-50%);
+  left: calc(var(--indicator-label-position) * 1% + var(--indicator-label-offset));
+  transform: translate(-50%, calc(-100% - var(--seed-dimension-x5) / 2 - var(--seed-dimension-x3)));
 }
 
 .seed-slider__valueIndicatorRoot[data-dir="rtl"] {
-  right: calc(var(--indicator-position) * 1% + var(--indicator-offset));
-  transform: translateX(50%);
+  right: calc(var(--indicator-label-position) * 1% + var(--indicator-label-offset));
+  transform: translate(50%, calc(-100% - var(--seed-dimension-x5) / 2 - var(--seed-dimension-x3)));
 }
 
-.seed-slider__valueIndicatorRoot[data-thumb-dragging] {
-  opacity: 1;
-}
-
-.seed-slider__valueIndicatorRoot[data-thumb-dragging][data-dir="ltr"] {
+.seed-slider__valueIndicatorRoot[data-value-indicator-shown][data-dir="ltr"] {
   animation: seed-enter;
   animation-timing-function: var(--seed-timing-function-enter);
   animation-duration: var(--seed-duration-d4);
   --seed-enter-translate-x: -50%;
-  --seed-enter-translate-y: var(--seed-dimension-x3);
+  --seed-enter-translate-y: calc(-100% - var(--seed-dimension-x5) / 2);
   --seed-enter-opacity: 0;
   --seed-enter-scale: .9;
 }
 
-.seed-slider__valueIndicatorRoot[data-thumb-dragging][data-dir="rtl"] {
+.seed-slider__valueIndicatorRoot[data-value-indicator-shown][data-dir="rtl"] {
   animation: seed-enter;
   animation-timing-function: var(--seed-timing-function-enter);
   animation-duration: var(--seed-duration-d4);
   --seed-enter-translate-x: 50%;
-  --seed-enter-translate-y: var(--seed-dimension-x3);
+  --seed-enter-translate-y: calc(-100% - var(--seed-dimension-x5) / 2);
   --seed-enter-opacity: 0;
   --seed-enter-scale: .9;
 }
 
-.seed-slider__valueIndicatorRoot:not([data-thumb-dragging])[data-dir="ltr"] {
+.seed-slider__valueIndicatorRoot:not([data-value-indicator-shown])[data-dir="ltr"] {
   animation: seed-exit;
   animation-timing-function: var(--seed-timing-function-easing);
   animation-duration: var(--seed-duration-d4);
   --seed-exit-translate-x: -50%;
-  --seed-exit-translate-y: var(--seed-dimension-x3);
+  --seed-exit-translate-y: calc(-100% - var(--seed-dimension-x5) / 2);
   --seed-exit-opacity: 0;
   --seed-exit-scale: 1;
   animation-fill-mode: forwards;
 }
 
-.seed-slider__valueIndicatorRoot:not([data-thumb-dragging])[data-dir="rtl"] {
+.seed-slider__valueIndicatorRoot:not([data-value-indicator-shown])[data-dir="rtl"] {
   animation: seed-exit;
   animation-timing-function: var(--seed-timing-function-easing);
   animation-duration: var(--seed-duration-d4);
   --seed-exit-translate-x: 50%;
-  --seed-exit-translate-y: var(--seed-dimension-x3);
+  --seed-exit-translate-y: calc(-100% - var(--seed-dimension-x5) / 2);
   --seed-exit-opacity: 0;
   --seed-exit-scale: 1;
   animation-fill-mode: forwards;
 }
 
-.seed-slider__valueIndicatorRoot:is(:hidden, [hidden], [data-hidden]) {
-  display: none !important;
+.seed-slider__valueIndicatorRoot:not([data-value-indicator-shown]):not([data-indicator-ever-shown]) {
+  animation-duration: 0s;
 }
 
 .seed-slider__valueIndicatorArrow {
@@ -6141,10 +6201,18 @@
   height: var(--seed-dimension-x2_5);
   position: absolute;
   top: 100%;
-  left: 50%;
+}
+
+.seed-slider__valueIndicatorArrow[data-dir="ltr"] {
+  left: calc(50% + (var(--thumb-offset)  - var(--indicator-label-offset)));
   transform: translateX(-50%);
 }
 
+.seed-slider__valueIndicatorArrow[data-dir="rtl"] {
+  right: calc(50% + (var(--thumb-offset)  - var(--indicator-label-offset)));
+  transform: translateX(50%);
+}
+
 .seed-slider__valueIndicatorArrowTip {
   fill: var(--seed-color-bg-neutral-inverted);
   width: var(--seed-dimension-x2_5);
@@ -6235,8 +6303,10 @@
   border-radius: var(--seed-radius-r2);
   width: 100%;
   max-width: 560px;
-  padding-inline: var(--seed-dimension-x2_5);
-  padding-block: var(--seed-dimension-x2_5);
+  padding-left: var(--seed-dimension-x2_5);
+  padding-right: var(--seed-dimension-x2_5);
+  padding-top: var(--seed-dimension-x2_5);
+  padding-bottom: var(--seed-dimension-x2_5);
   min-height: 44px;
   animation: seed-enter;
   animation-timing-function: var(--seed-timing-function-enter);
@@ -6261,7 +6331,8 @@
 }
 
 .seed-snackbar__content {
-  padding-inline: var(--seed-dimension-x1_5);
+  padding-left: var(--seed-dimension-x1_5);
+  padding-right: var(--seed-dimension-x1_5);
   justify-content: space-between;
   align-items: center;
   gap: var(--seed-dimension-x2_5);
@@ -6333,8 +6404,10 @@
   left: calc(env(safe-area-inset-left, 0px));
   right: calc(env(safe-area-inset-right, 0px));
   bottom: calc(env(safe-area-inset-bottom, 0px)  + var(--snackbar-region-offset, 0px));
-  padding-inline: var(--seed-dimension-x2);
-  padding-block: var(--seed-dimension-x2);
+  padding-left: var(--seed-dimension-x2);
+  padding-right: var(--seed-dimension-x2);
+  padding-top: var(--seed-dimension-x2);
+  padding-bottom: var(--seed-dimension-x2);
   transition-property: bottom;
   transition-duration: var(--seed-duration-d4);
   transition-timing-function: var(--seed-timing-function-easing);
@@ -6377,7 +6450,7 @@
 .seed-switch__label--size_16 {
   font-size: var(--seed-font-size-t3);
   line-height: var(--seed-line-height-t3);
-  margin-top: calc(12px - .5625rem);
+  margin-top: calc(var(--seed-dimension-x6) / 2 - var(--seed-line-height-t3) / 2);
 }
 
 .seed-switch__root--size_24 {
@@ -6389,7 +6462,7 @@
 .seed-switch__label--size_24 {
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
-  margin-top: calc(12px - .59375rem);
+  margin-top: calc(var(--seed-dimension-x6) / 2 - var(--seed-line-height-t4) / 2);
 }
 
 .seed-switch__root--size_32 {
@@ -6401,7 +6474,7 @@
 .seed-switch__label--size_32 {
   font-size: var(--seed-font-size-t5);
   line-height: var(--seed-line-height-t5);
-  margin-top: calc(16px - .6875rem);
+  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-line-height-t5) / 2);
 }
 
 .seed-switch-mark__root {
@@ -6449,8 +6522,8 @@
 }
 
 .seed-switch-mark__root--size_16 {
-  min-block-size: 16px;
-  min-inline-size: 26px;
+  min-width: 26px;
+  min-height: 16px;
   padding: 2px;
 }
 
@@ -6464,8 +6537,8 @@
 }
 
 .seed-switch-mark__root--size_24 {
-  min-block-size: 24px;
-  min-inline-size: 38px;
+  min-width: 38px;
+  min-height: 24px;
   padding: 2px;
 }
 
@@ -6479,8 +6552,8 @@
 }
 
 .seed-switch-mark__root--size_32 {
-  min-block-size: 32px;
-  min-inline-size: 52px;
+  min-width: 52px;
+  min-height: 32px;
   padding: 3px;
 }
 
@@ -6591,7 +6664,8 @@
 
 .seed-tabs__list--triggerLayout_fill {
   justify-content: space-around;
-  padding-inline: 0;
+  padding-left: 0;
+  padding-right: 0;
 }
 
 .seed-tabs__indicator--triggerLayout_fill {
@@ -6609,7 +6683,8 @@
 }
 
 .seed-tabs__list--triggerLayout_hug {
-  padding-inline: var(--seed-dimension-spacing-x-global-gutter);
+  padding-left: var(--seed-dimension-spacing-x-global-gutter);
+  padding-right: var(--seed-dimension-spacing-x-global-gutter);
   justify-content: flex-start;
 }
 
@@ -6652,8 +6727,10 @@
 
 .seed-tabs__trigger--size_small {
   min-height: 40px;
-  padding-inline: var(--seed-dimension-x2_5);
-  padding-block: var(--seed-dimension-x2_5);
+  padding-left: var(--seed-dimension-x2_5);
+  padding-right: var(--seed-dimension-x2_5);
+  padding-top: var(--seed-dimension-x2_5);
+  padding-bottom: var(--seed-dimension-x2_5);
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
   font-weight: var(--seed-font-weight-bold);
@@ -6669,8 +6746,10 @@
 
 .seed-tabs__trigger--size_medium {
   min-height: 44px;
-  padding-inline: var(--seed-dimension-x2_5);
-  padding-block: var(--seed-dimension-x2_5);
+  padding-left: var(--seed-dimension-x2_5);
+  padding-right: var(--seed-dimension-x2_5);
+  padding-top: var(--seed-dimension-x2_5);
+  padding-bottom: var(--seed-dimension-x2_5);
   font-size: var(--seed-font-size-t5);
   line-height: var(--seed-line-height-t5);
   font-weight: var(--seed-font-weight-bold);
@@ -6988,7 +7067,7 @@
 
 .seed-text-input__root {
   width: 100%;
-  transition: box-shadow var(--seed-duration-d3) var(--seed-timing-function-easing);
+  transition: box-shadow var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   align-items: center;
   display: flex;
   overflow: hidden;
@@ -7005,7 +7084,8 @@
   outline: none;
   flex-grow: 1;
   align-self: stretch;
-  padding-inline: 0;
+  padding-left: 0;
+  padding-right: 0;
 }
 
 .seed-text-input__value:is(input) {
@@ -7059,19 +7139,19 @@
 }
 
 .seed-text-input__value--variant_outline:first-child {
-  padding-inline-start: var(--seed-dimension-x4);
+  padding-left: var(--seed-dimension-x4);
 }
 
 .seed-text-input__value--variant_outline:last-child {
-  padding-inline-end: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
 }
 
 .seed-text-input__prefixText--variant_outline:first-child, .seed-text-input__prefixIcon--variant_outline:first-child {
-  margin-inline-start: var(--seed-dimension-x4);
+  margin-left: var(--seed-dimension-x4);
 }
 
 .seed-text-input__suffixText--variant_outline:last-child, .seed-text-input__suffixIcon--variant_outline:last-child {
-  margin-inline-end: var(--seed-dimension-x4);
+  margin-right: var(--seed-dimension-x4);
 }
 
 .seed-text-input__root--variant_underline {
@@ -7119,12 +7199,14 @@
 
 .seed-text-input__value--size_large:is(textarea) {
   min-height: 95px;
-  padding-block: var(--seed-dimension-x3_5);
+  padding-top: var(--seed-dimension-x3_5);
+  padding-bottom: var(--seed-dimension-x3_5);
 }
 
 .seed-text-input__value--size_medium:is(textarea) {
   min-height: 90px;
-  padding-block: 11px;
+  padding-top: 11px;
+  padding-bottom: 11px;
 }
 
 .seed-text-input__root--variant_outline-size_large {
@@ -7204,7 +7286,7 @@
 }
 
 .seed-toggle-button {
-  transition: background-color var(--seed-duration-d4) var(--seed-timing-function-easing);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
   font-weight: var(--seed-font-weight-bold);
 }
 
@@ -7296,8 +7378,10 @@
   height: var(--seed-dimension-x8);
   border-radius: var(--seed-radius-full);
   gap: var(--seed-dimension-x1);
-  padding-inline: var(--seed-dimension-x3_5);
-  padding-block: var(--seed-dimension-x1_5);
+  padding-left: var(--seed-dimension-x3_5);
+  padding-right: var(--seed-dimension-x3_5);
+  padding-top: var(--seed-dimension-x1_5);
+  padding-bottom: var(--seed-dimension-x1_5);
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
   --size: 14px;
@@ -7310,8 +7394,10 @@
   height: var(--seed-dimension-x9);
   border-radius: var(--seed-radius-full);
   gap: var(--seed-dimension-x1);
-  padding-inline: var(--seed-dimension-x4);
-  padding-block: var(--seed-dimension-x2);
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
+  padding-top: var(--seed-dimension-x2);
+  padding-bottom: var(--seed-dimension-x2);
   font-size: var(--seed-font-size-t4);
   line-height: var(--seed-line-height-t4);
   --size: 14px;