@seed-design/lynx-css 0.9.3 → 0.10.0

package/all.css

@@ -352,6 +352,7 @@ text {
   --seed-color-banner-teal: #e6faf6;
   --seed-color-banner-warm-gray: #f2f0ee;
   --seed-color-banner-yellow: #fffae1;
+  --seed-gradient-fade-mask: #0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;
   --seed-gradient-glow-magic: #fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;
   --seed-gradient-glow-magic-pressed: #fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;
   --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
@@ -563,6 +564,7 @@ text {
   --seed-color-banner-teal: #143633;
   --seed-color-banner-warm-gray: #2f2b27;
   --seed-color-banner-yellow: #3e2b00;
+  --seed-gradient-fade-mask: #0000 0%, #00000003 8%, #00000005 16%, #0000000d 22%, #00000014 29.0%, #00000021 35%, #0000002e 41%, #00000040 47%, #00000052 53%, #0006 59%, #0000007a 65%, #00000094 71%, #000000ab 78%, #000000c7 84%, #000000e3 92%, #000 100%;
   --seed-gradient-glow-magic: #2d252d 0%, #3a312b 80%, #333232 100%;
   --seed-gradient-glow-magic-pressed: #3e333e 0%, #51453e 80%, #434242 100%;
   --seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
@@ -2439,6 +2441,406 @@ text {
   font-weight: var(--seed-font-weight-bold);
 }
 
+.seed-manner-temp__root {
+  justify-content: flex-start;
+  align-items: center;
+  gap: var(--seed-dimension-x1);
+  flex-direction: row;
+  flex-shrink: 0;
+  display: flex;
+}
+
+.seed-manner-temp__label {
+  font-size: var(--seed-font-size-t5);
+  line-height: var(--seed-line-height-t5);
+  font-weight: var(--seed-font-weight-bold);
+}
+
+.seed-manner-temp__emote {
+  width: var(--seed-dimension-x8);
+  height: var(--seed-dimension-x8);
+  margin-left: calc(var(--seed-dimension-x1) * -1);
+  margin-right: calc(var(--seed-dimension-x1) * -1);
+  margin-top: calc(var(--seed-dimension-x1) * -1);
+  margin-bottom: calc(var(--seed-dimension-x1) * -1);
+  flex-shrink: 0;
+}
+
+.seed-manner-temp__label--level_l1 {
+  color: var(--seed-color-manner-temp-l1-text);
+}
+
+.seed-manner-temp__label--level_l2 {
+  color: var(--seed-color-manner-temp-l2-text);
+}
+
+.seed-manner-temp__label--level_l3 {
+  color: var(--seed-color-manner-temp-l3-text);
+}
+
+.seed-manner-temp__label--level_l4 {
+  color: var(--seed-color-manner-temp-l4-text);
+}
+
+.seed-manner-temp__label--level_l5 {
+  color: var(--seed-color-manner-temp-l5-text);
+}
+
+.seed-manner-temp__label--level_l6 {
+  color: var(--seed-color-manner-temp-l6-text);
+}
+
+.seed-manner-temp__label--level_l7 {
+  color: var(--seed-color-manner-temp-l7-text);
+}
+
+.seed-manner-temp__label--level_l8 {
+  color: var(--seed-color-manner-temp-l8-text);
+}
+
+.seed-manner-temp__label--level_l9 {
+  color: var(--seed-color-manner-temp-l9-text);
+}
+
+.seed-manner-temp__label--level_l10 {
+  color: var(--seed-color-manner-temp-l10-text);
+}
+
+.seed-manner-temp-badge__root {
+  min-height: var(--seed-dimension-x5);
+  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-full);
+  flex-direction: row;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.seed-manner-temp-badge__label {
+  font-size: var(--seed-font-size-t1);
+  line-height: var(--seed-line-height-t1);
+  font-weight: var(--seed-font-weight-bold);
+}
+
+.seed-manner-temp-badge__root--level_l1 {
+  background-color: var(--seed-color-manner-temp-l1-bg);
+}
+
+.seed-manner-temp-badge__label--level_l1 {
+  color: var(--seed-color-manner-temp-l1-text);
+}
+
+.seed-manner-temp-badge__root--level_l2 {
+  background-color: var(--seed-color-manner-temp-l2-bg);
+}
+
+.seed-manner-temp-badge__label--level_l2 {
+  color: var(--seed-color-manner-temp-l2-text);
+}
+
+.seed-manner-temp-badge__root--level_l3 {
+  background-color: var(--seed-color-manner-temp-l3-bg);
+}
+
+.seed-manner-temp-badge__label--level_l3 {
+  color: var(--seed-color-manner-temp-l3-text);
+}
+
+.seed-manner-temp-badge__root--level_l4 {
+  background-color: var(--seed-color-manner-temp-l4-bg);
+}
+
+.seed-manner-temp-badge__label--level_l4 {
+  color: var(--seed-color-manner-temp-l4-text);
+}
+
+.seed-manner-temp-badge__root--level_l5 {
+  background-color: var(--seed-color-manner-temp-l5-bg);
+}
+
+.seed-manner-temp-badge__label--level_l5 {
+  color: var(--seed-color-manner-temp-l5-text);
+}
+
+.seed-manner-temp-badge__root--level_l6 {
+  background-color: var(--seed-color-manner-temp-l6-bg);
+}
+
+.seed-manner-temp-badge__label--level_l6 {
+  color: var(--seed-color-manner-temp-l6-text);
+}
+
+.seed-manner-temp-badge__root--level_l7 {
+  background-color: var(--seed-color-manner-temp-l7-bg);
+}
+
+.seed-manner-temp-badge__label--level_l7 {
+  color: var(--seed-color-manner-temp-l7-text);
+}
+
+.seed-manner-temp-badge__root--level_l8 {
+  background-color: var(--seed-color-manner-temp-l8-bg);
+}
+
+.seed-manner-temp-badge__label--level_l8 {
+  color: var(--seed-color-manner-temp-l8-text);
+}
+
+.seed-manner-temp-badge__root--level_l9 {
+  background-color: var(--seed-color-manner-temp-l9-bg);
+}
+
+.seed-manner-temp-badge__label--level_l9 {
+  color: var(--seed-color-manner-temp-l9-text);
+}
+
+.seed-manner-temp-badge__root--level_l10 {
+  background-color: var(--seed-color-manner-temp-l10-bg);
+}
+
+.seed-manner-temp-badge__label--level_l10 {
+  color: var(--seed-color-manner-temp-l10-text);
+}
+
+.seed-page-banner__root {
+  width: 100%;
+  min-height: var(--seed-dimension-x10);
+  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);
+  flex-direction: row;
+  align-items: flex-start;
+  display: flex;
+}
+
+.seed-page-banner__content {
+  justify-content: space-between;
+  align-items: center;
+  gap: var(--seed-dimension-x1_5);
+  flex-flow: wrap;
+  flex-grow: 1;
+  flex-shrink: 1;
+  display: flex;
+}
+
+.seed-page-banner__body {
+  line-height: var(--seed-line-height-t4);
+  flex-grow: 1;
+  flex-shrink: 1;
+}
+
+.seed-page-banner__title {
+  font-size: var(--seed-font-size-t4);
+  line-height: var(--seed-line-height-t4);
+  font-weight: var(--seed-font-weight-bold);
+  flex-shrink: 0;
+}
+
+.seed-page-banner__description {
+  font-size: var(--seed-font-size-t4);
+  line-height: var(--seed-line-height-t4);
+  font-weight: var(--seed-font-weight-medium);
+}
+
+.seed-page-banner__button {
+  margin-top: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5 * -1);
+  margin-right: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5 * -1);
+  margin-bottom: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5 * -1);
+  margin-left: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5 * -1);
+  padding-top: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5);
+  padding-right: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5);
+  padding-bottom: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5);
+  padding-left: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5);
+  font-size: var(--seed-font-size-t3);
+  line-height: var(--seed-line-height-t3);
+  font-weight: var(--seed-font-weight-bold);
+  border-radius: var(--seed-radius-r1);
+  flex-direction: row;
+  align-items: center;
+  display: flex;
+}
+
+.seed-page-banner__closeButton {
+  width: var(--seed-dimension-x10);
+  height: var(--seed-dimension-x10);
+  margin-top: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
+  margin-right: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
+  margin-bottom: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
+  margin-left: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5 + var(--seed-dimension-x2));
+  border-radius: var(--seed-radius-r2);
+  background-color: var(--seed-color-bg-transparent);
+  flex-direction: row;
+  flex-grow: 0;
+  flex-shrink: 0;
+  justify-content: center;
+  align-self: center;
+  align-items: center;
+  display: flex;
+}
+
+.seed-page-banner__prefixIcon {
+  width: var(--seed-dimension-x4);
+  height: var(--seed-dimension-x4);
+  margin-top: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * .5 - var(--seed-dimension-x2_5));
+  margin-right: var(--seed-dimension-x2);
+  flex-shrink: 0;
+}
+
+.seed-page-banner__suffixIcon {
+  width: var(--seed-dimension-x4);
+  height: var(--seed-dimension-x4);
+  margin-left: var(--seed-dimension-x2);
+  flex-shrink: 0;
+  align-self: center;
+}
+
+.seed-page-banner__closeButtonIcon {
+  width: var(--seed-dimension-x4);
+  height: var(--seed-dimension-x4);
+  flex-shrink: 0;
+}
+
+.seed-page-banner__closeButton--closeButtonPressed_true {
+  background-color: var(--seed-color-bg-transparent-pressed);
+}
+
+.seed-page-banner__root--tone_neutral-variant_weak {
+  background-color: var(--seed-color-bg-neutral-weak);
+}
+
+.seed-page-banner__title--tone_neutral-variant_weak, .seed-page-banner__description--tone_neutral-variant_weak, .seed-page-banner__button--tone_neutral-variant_weak, .seed-page-banner__prefixIcon--tone_neutral-variant_weak, .seed-page-banner__suffixIcon--tone_neutral-variant_weak, .seed-page-banner__closeButtonIcon--tone_neutral-variant_weak {
+  color: var(--seed-color-fg-neutral);
+}
+
+.seed-page-banner__root--tone_neutral-variant_solid {
+  background-color: var(--seed-color-bg-neutral-inverted);
+}
+
+.seed-page-banner__title--tone_neutral-variant_solid, .seed-page-banner__description--tone_neutral-variant_solid, .seed-page-banner__button--tone_neutral-variant_solid, .seed-page-banner__prefixIcon--tone_neutral-variant_solid, .seed-page-banner__suffixIcon--tone_neutral-variant_solid, .seed-page-banner__closeButtonIcon--tone_neutral-variant_solid {
+  color: var(--seed-color-fg-neutral-inverted);
+}
+
+.seed-page-banner__root--tone_informative-variant_weak {
+  background-color: var(--seed-color-bg-informative-weak);
+}
+
+.seed-page-banner__title--tone_informative-variant_weak, .seed-page-banner__description--tone_informative-variant_weak, .seed-page-banner__button--tone_informative-variant_weak, .seed-page-banner__prefixIcon--tone_informative-variant_weak, .seed-page-banner__suffixIcon--tone_informative-variant_weak, .seed-page-banner__closeButtonIcon--tone_informative-variant_weak {
+  color: var(--seed-color-fg-informative-contrast);
+}
+
+.seed-page-banner__root--tone_informative-variant_solid {
+  background-color: var(--seed-color-bg-informative-solid);
+}
+
+.seed-page-banner__title--tone_informative-variant_solid, .seed-page-banner__description--tone_informative-variant_solid, .seed-page-banner__button--tone_informative-variant_solid, .seed-page-banner__prefixIcon--tone_informative-variant_solid, .seed-page-banner__suffixIcon--tone_informative-variant_solid, .seed-page-banner__closeButtonIcon--tone_informative-variant_solid {
+  color: var(--seed-color-palette-static-white);
+}
+
+.seed-page-banner__root--tone_positive-variant_weak {
+  background-color: var(--seed-color-bg-positive-weak);
+}
+
+.seed-page-banner__title--tone_positive-variant_weak, .seed-page-banner__description--tone_positive-variant_weak, .seed-page-banner__button--tone_positive-variant_weak, .seed-page-banner__prefixIcon--tone_positive-variant_weak, .seed-page-banner__suffixIcon--tone_positive-variant_weak, .seed-page-banner__closeButtonIcon--tone_positive-variant_weak {
+  color: var(--seed-color-fg-positive-contrast);
+}
+
+.seed-page-banner__root--tone_positive-variant_solid {
+  background-color: var(--seed-color-bg-positive-solid);
+}
+
+.seed-page-banner__title--tone_positive-variant_solid, .seed-page-banner__description--tone_positive-variant_solid, .seed-page-banner__button--tone_positive-variant_solid, .seed-page-banner__prefixIcon--tone_positive-variant_solid, .seed-page-banner__suffixIcon--tone_positive-variant_solid, .seed-page-banner__closeButtonIcon--tone_positive-variant_solid {
+  color: var(--seed-color-palette-static-white);
+}
+
+.seed-page-banner__root--tone_warning-variant_weak {
+  background-color: var(--seed-color-bg-warning-weak);
+}
+
+.seed-page-banner__title--tone_warning-variant_weak, .seed-page-banner__description--tone_warning-variant_weak, .seed-page-banner__button--tone_warning-variant_weak, .seed-page-banner__prefixIcon--tone_warning-variant_weak, .seed-page-banner__suffixIcon--tone_warning-variant_weak, .seed-page-banner__closeButtonIcon--tone_warning-variant_weak {
+  color: var(--seed-color-fg-warning-contrast);
+}
+
+.seed-page-banner__root--tone_warning-variant_solid {
+  background-color: var(--seed-color-bg-warning-solid);
+}
+
+.seed-page-banner__title--tone_warning-variant_solid, .seed-page-banner__description--tone_warning-variant_solid, .seed-page-banner__button--tone_warning-variant_solid, .seed-page-banner__prefixIcon--tone_warning-variant_solid, .seed-page-banner__suffixIcon--tone_warning-variant_solid, .seed-page-banner__closeButtonIcon--tone_warning-variant_solid {
+  color: var(--seed-color-palette-static-black-alpha-900);
+}
+
+.seed-page-banner__root--tone_critical-variant_weak {
+  background-color: var(--seed-color-bg-critical-weak);
+}
+
+.seed-page-banner__title--tone_critical-variant_weak, .seed-page-banner__description--tone_critical-variant_weak, .seed-page-banner__button--tone_critical-variant_weak, .seed-page-banner__prefixIcon--tone_critical-variant_weak, .seed-page-banner__suffixIcon--tone_critical-variant_weak, .seed-page-banner__closeButtonIcon--tone_critical-variant_weak {
+  color: var(--seed-color-fg-critical-contrast);
+}
+
+.seed-page-banner__root--tone_critical-variant_solid {
+  background-color: var(--seed-color-bg-critical-solid);
+}
+
+.seed-page-banner__title--tone_critical-variant_solid, .seed-page-banner__description--tone_critical-variant_solid, .seed-page-banner__button--tone_critical-variant_solid, .seed-page-banner__prefixIcon--tone_critical-variant_solid, .seed-page-banner__suffixIcon--tone_critical-variant_solid, .seed-page-banner__closeButtonIcon--tone_critical-variant_solid {
+  color: var(--seed-color-palette-static-white);
+}
+
+.seed-page-banner__root--tone_magic-variant_weak {
+  background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic));
+}
+
+.seed-page-banner__title--tone_magic-variant_weak, .seed-page-banner__description--tone_magic-variant_weak, .seed-page-banner__button--tone_magic-variant_weak, .seed-page-banner__prefixIcon--tone_magic-variant_weak, .seed-page-banner__suffixIcon--tone_magic-variant_weak, .seed-page-banner__closeButtonIcon--tone_magic-variant_weak {
+  color: var(--seed-color-fg-neutral);
+}
+
+.seed-page-banner__root--tone_neutral-variant_weak-pressed_true {
+  background-color: var(--seed-color-bg-neutral-weak-pressed);
+}
+
+.seed-page-banner__root--tone_neutral-variant_solid-pressed_true {
+  background-color: var(--seed-color-bg-neutral-inverted-pressed);
+}
+
+.seed-page-banner__root--tone_informative-variant_weak-pressed_true {
+  background-color: var(--seed-color-bg-informative-weak-pressed);
+}
+
+.seed-page-banner__root--tone_informative-variant_solid-pressed_true {
+  background-color: var(--seed-color-bg-informative-solid-pressed);
+}
+
+.seed-page-banner__root--tone_positive-variant_weak-pressed_true {
+  background-color: var(--seed-color-bg-positive-weak-pressed);
+}
+
+.seed-page-banner__root--tone_positive-variant_solid-pressed_true {
+  background-color: var(--seed-color-bg-positive-solid-pressed);
+}
+
+.seed-page-banner__root--tone_warning-variant_weak-pressed_true {
+  background-color: var(--seed-color-bg-warning-weak-pressed);
+}
+
+.seed-page-banner__root--tone_warning-variant_solid-pressed_true {
+  background-color: var(--seed-color-bg-warning-solid-pressed);
+}
+
+.seed-page-banner__root--tone_critical-variant_weak-pressed_true {
+  background-color: var(--seed-color-bg-critical-weak-pressed);
+}
+
+.seed-page-banner__root--tone_critical-variant_solid-pressed_true {
+  background-color: var(--seed-color-bg-critical-solid-pressed);
+}
+
+.seed-page-banner__root--tone_magic-variant_weak-pressed_true {
+  background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic-pressed));
+}
+
 .seed-radio__root {
   align-items: flex-start;
   gap: var(--seed-dimension-x2);
@@ -2446,165 +2848,546 @@ text {
   position: relative;
 }
 
-.seed-radio__label {
-  color: var(--seed-color-fg-neutral);
+.seed-radio__label {
+  color: var(--seed-color-fg-neutral);
+}
+
+.seed-radio__label--weight_regular {
+  font-weight: var(--seed-font-weight-regular);
+}
+
+.seed-radio__label--weight_bold {
+  font-weight: var(--seed-font-weight-bold);
+}
+
+.seed-radio__root--size_medium {
+  min-height: var(--seed-dimension-x8);
+}
+
+.seed-radio__control--size_medium {
+  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-dimension-x5) / 2);
+}
+
+.seed-radio__label--size_medium {
+  font-size: var(--seed-font-size-t4);
+  line-height: var(--seed-line-height-t4);
+  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-line-height-t4) / 2);
+}
+
+.seed-radio__root--size_large {
+  min-height: var(--seed-dimension-x9);
+}
+
+.seed-radio__control--size_large {
+  margin-top: calc(var(--seed-dimension-x9) / 2 - var(--seed-dimension-x6) / 2);
+}
+
+.seed-radio__label--size_large {
+  font-size: var(--seed-font-size-t5);
+  line-height: var(--seed-line-height-t5);
+  margin-top: calc(var(--seed-dimension-x9) / 2 - var(--seed-line-height-t5) / 2);
+}
+
+.seed-radio__label--disabled_true {
+  color: var(--seed-color-fg-disabled);
+}
+
+.seed-radio-group__root {
+  gap: var(--seed-dimension-x1);
+  flex-direction: column;
+  display: flex;
+}
+
+.seed-radiomark__root {
+  border-style: solid;
+  border-width: 1px;
+  border-color: var(--seed-color-stroke-neutral-weak);
+  border-radius: var(--seed-radius-full);
+  transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
+  flex: none;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  position: relative;
+}
+
+.seed-radiomark__icon {
+  border-radius: var(--seed-radius-full);
+}
+
+.seed-radiomark__root--size_medium {
+  width: var(--seed-dimension-x5);
+  height: var(--seed-dimension-x5);
+}
+
+.seed-radiomark__icon--size_medium {
+  width: var(--seed-dimension-x2);
+  height: var(--seed-dimension-x2);
+}
+
+.seed-radiomark__root--size_large {
+  width: var(--seed-dimension-x6);
+  height: var(--seed-dimension-x6);
+}
+
+.seed-radiomark__icon--size_large {
+  width: var(--seed-dimension-x2_5);
+  height: var(--seed-dimension-x2_5);
+}
+
+.seed-radiomark__icon--checked_false {
+  opacity: 0;
+}
+
+.seed-radiomark__root--tone_brand-checked_true-disabled_false {
+  background-color: var(--seed-color-bg-brand-solid);
+  border-width: 0;
+  border-color: #0000;
+}
+
+.seed-radiomark__icon--tone_brand-checked_true-disabled_false {
+  color: var(--seed-color-palette-static-white);
+  background-color: var(--seed-color-palette-static-white);
+}
+
+.seed-radiomark__root--tone_neutral-checked_true-disabled_false {
+  background-color: var(--seed-color-bg-neutral-inverted);
+  border-width: 0;
+  border-color: #0000;
+}
+
+.seed-radiomark__icon--tone_neutral-checked_true-disabled_false {
+  color: var(--seed-color-fg-neutral-inverted);
+  background-color: var(--seed-color-fg-neutral-inverted);
+}
+
+.seed-radiomark__root--tone_brand-checked_false-disabled_true, .seed-radiomark__root--tone_neutral-checked_false-disabled_true {
+  background-color: var(--seed-color-palette-gray-300);
+}
+
+.seed-radiomark__root--tone_brand-checked_true-disabled_true {
+  background-color: var(--seed-color-bg-transparent);
+  border-width: 1px;
+  border-color: var(--seed-color-palette-gray-300);
+}
+
+.seed-radiomark__icon--tone_brand-checked_true-disabled_true {
+  color: var(--seed-color-palette-gray-300);
+  background-color: var(--seed-color-palette-gray-300);
+}
+
+.seed-radiomark__root--tone_neutral-checked_true-disabled_true {
+  background-color: var(--seed-color-bg-transparent);
+  border-width: 1px;
+  border-color: var(--seed-color-palette-gray-300);
+}
+
+.seed-radiomark__icon--tone_neutral-checked_true-disabled_true {
+  color: var(--seed-color-palette-gray-300);
+  background-color: var(--seed-color-palette-gray-300);
+}
+
+.seed-radiomark__icon--size_medium-checked_true-disabled_true {
+  width: var(--seed-dimension-x2_5);
+  height: var(--seed-dimension-x2_5);
+}
+
+.seed-radiomark__icon--size_large-checked_true-disabled_true {
+  width: var(--seed-dimension-x3);
+  height: var(--seed-dimension-x3);
+}
+
+.seed-radiomark__root--pressed_true-checked_false-disabled_false {
+  background-color: var(--seed-color-bg-transparent-pressed);
+}
+
+.seed-radiomark__root--tone_brand-pressed_true-checked_true-disabled_false {
+  background-color: var(--seed-color-bg-brand-solid-pressed);
+}
+
+.seed-radiomark__root--tone_neutral-pressed_true-checked_true-disabled_false {
+  background-color: var(--seed-color-bg-neutral-inverted-pressed);
+}
+
+.seed-notification-badge__root {
+  background-color: var(--seed-color-bg-brand-solid);
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.seed-notification-badge__label {
+  text-align: center;
+  color: var(--seed-color-palette-static-white);
+  white-space: nowrap;
+  flex-shrink: 0;
+}
+
+.seed-notification-badge__root--size_small {
+  border-radius: var(--seed-radius-full);
+  width: 6px;
+  height: 6px;
+}
+
+.seed-notification-badge__root--size_large {
+  width: max-content;
+  min-width: 18px;
+  min-height: 18px;
+  padding-left: var(--seed-dimension-x1);
+  padding-right: var(--seed-dimension-x1);
+  border-radius: var(--seed-radius-full);
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.seed-notification-badge__label--size_large {
+  font-size: var(--seed-font-size-t1-static);
+  line-height: var(--seed-line-height-t1-static);
+  font-weight: var(--seed-font-weight-bold);
+}
+
+.seed-notification-badge-positioner {
+  justify-content: center;
+  align-items: center;
+  width: max-content;
+  display: flex;
+  position: absolute;
+}
+
+.seed-notification-badge-positioner--attach_icon {
+  transform: translate(100%, -100%);
+}
+
+.seed-notification-badge-positioner--attach_text {
+  transform: translate(100%);
+}
+
+.seed-notification-badge-positioner--size_large-attach_icon {
+  top: 14px;
+  right: 8px;
+}
+
+.seed-notification-badge-positioner--size_small-attach_icon {
+  top: 7px;
+  right: 7px;
+}
+
+.seed-notification-badge-positioner--size_large-attach_text, .seed-notification-badge-positioner--size_small-attach_text {
+  right: -2px;
+}
+
+.seed-segmented-control__root {
+  width: max-content;
+  max-width: 100%;
+  padding: var(--seed-dimension-x1);
+  border-radius: var(--seed-radius-full);
+  background-color: var(--seed-color-bg-neutral-weak-alpha);
+  grid-auto-rows: 1fr;
+  grid-auto-columns: 1fr;
+  grid-auto-flow: column;
+  align-items: stretch;
+  display: grid;
+  position: relative;
+}
+
+.seed-segmented-control__indicator {
+  top: var(--seed-dimension-x1);
+  bottom: var(--seed-dimension-x1);
+  left: var(--seed-dimension-x1);
+  z-index: 0;
+  width: calc((100% - var(--seed-dimension-x1) * 2) / var(--segment-count, 1));
+  border-radius: var(--seed-radius-full);
+  background-color: var(--seed-color-palette-gray-00);
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
+  transform: translateX(calc(var(--segment-index, 0) * 100%));
+  transition-property: transform, opacity;
+  transition-duration: var(--seed-duration-d4);
+  transition-timing-function: var(--seed-timing-function-easing);
+  position: absolute;
 }
 
-.seed-radio__label--weight_regular {
-  font-weight: var(--seed-font-weight-regular);
+.seed-segmented-control__item {
+  z-index: 1;
+  justify-content: center;
+  align-items: center;
+  gap: var(--seed-dimension-x1_5);
+  min-width: 86px;
+  height: 100%;
+  min-height: 34px;
+  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);
+  flex-direction: row;
+  display: flex;
+  position: relative;
 }
 
-.seed-radio__label--weight_bold {
+.seed-segmented-control__itemBackground {
+  border-radius: var(--seed-radius-full);
+  opacity: 0;
+  transition-property: opacity;
+  transition-duration: var(--seed-duration-color-transition);
+  transition-timing-function: var(--seed-timing-function-easing);
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+.seed-segmented-control__label {
+  color: var(--seed-color-fg-neutral-subtle);
   font-weight: var(--seed-font-weight-bold);
+  font-size: var(--seed-font-size-t5);
+  line-height: var(--seed-line-height-t5);
+  text-align: center;
+  transition-property: color;
+  transition-duration: var(--seed-duration-color-transition);
+  transition-timing-function: var(--seed-timing-function-easing);
 }
 
-.seed-radio__root--size_medium {
-  min-height: var(--seed-dimension-x8);
+.seed-segmented-control__itemBackground--selected_true {
+  background-color: var(--seed-color-palette-gray-100);
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
 }
 
-.seed-radio__control--size_medium {
-  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-dimension-x5) / 2);
+.seed-segmented-control__label--selected_true {
+  color: var(--seed-color-fg-neutral);
 }
 
-.seed-radio__label--size_medium {
-  font-size: var(--seed-font-size-t4);
-  line-height: var(--seed-line-height-t4);
-  margin-top: calc(var(--seed-dimension-x8) / 2 - var(--seed-line-height-t4) / 2);
+.seed-segmented-control__itemBackground--selected_false {
+  background-color: var(--seed-color-bg-neutral-weak-pressed);
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
 }
 
-.seed-radio__root--size_large {
-  min-height: var(--seed-dimension-x9);
+.seed-segmented-control__label--disabled_true {
+  color: var(--seed-color-fg-disabled);
 }
 
-.seed-radio__control--size_large {
-  margin-top: calc(var(--seed-dimension-x9) / 2 - var(--seed-dimension-x6) / 2);
+.seed-segmented-control__itemBackground--pressed_true {
+  opacity: 1;
 }
 
-.seed-radio__label--size_large {
-  font-size: var(--seed-font-size-t5);
-  line-height: var(--seed-line-height-t5);
-  margin-top: calc(var(--seed-dimension-x9) / 2 - var(--seed-line-height-t5) / 2);
+.seed-segmented-control__indicator--hasSelection_false {
+  opacity: 0;
 }
 
-.seed-radio__label--disabled_true {
-  color: var(--seed-color-fg-disabled);
+.seed-segmented-control__item--selected_true-disabled_true {
+  background-color: var(--seed-color-bg-disabled);
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
 }
 
-.seed-radio-group__root {
-  gap: var(--seed-dimension-x1);
+.seed-select-box__interactionRoot {
   flex-direction: column;
+  align-items: stretch;
+  gap: 0;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
   display: flex;
 }
 
-.seed-radiomark__root {
-  border-style: solid;
-  border-width: 1px;
-  border-color: var(--seed-color-stroke-neutral-weak);
-  border-radius: var(--seed-radius-full);
+.seed-select-box__root {
+  border-radius: var(--seed-radius-r3);
+  background-color: var(--seed-color-bg-transparent);
+  width: 100%;
+  height: 100%;
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
   transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
-  flex: none;
-  justify-content: center;
-  align-items: center;
+  flex-direction: column;
+  align-items: stretch;
   display: flex;
   position: relative;
+  overflow: hidden;
 }
 
-.seed-radiomark__icon {
-  border-radius: var(--seed-radius-full);
+.seed-select-box__selectedStroke {
+  border-radius: var(--seed-radius-r3);
+  transition: border-color .1s var(--seed-timing-function-easing);
+  border: 2px solid #0000;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
 }
 
-.seed-radiomark__root--size_medium {
-  width: var(--seed-dimension-x5);
-  height: var(--seed-dimension-x5);
+.seed-select-box__trigger {
+  justify-content: space-between;
+  gap: var(--seed-dimension-x1_5);
+  flex-direction: row;
+  flex-grow: 1;
+  width: 100%;
+  display: flex;
 }
 
-.seed-radiomark__icon--size_medium {
-  width: var(--seed-dimension-x2);
-  height: var(--seed-dimension-x2);
+.seed-select-box__content {
+  flex-direction: row;
+  min-width: 0;
+  display: flex;
 }
 
-.seed-radiomark__root--size_large {
-  width: var(--seed-dimension-x6);
-  height: var(--seed-dimension-x6);
+.seed-select-box__prefixIcon {
+  width: 22px;
+  height: 22px;
+  color: var(--seed-color-fg-neutral);
+  flex-direction: row;
+  flex-shrink: 0;
+  align-items: center;
+  display: flex;
 }
 
-.seed-radiomark__icon--size_large {
-  width: var(--seed-dimension-x2_5);
-  height: var(--seed-dimension-x2_5);
+.seed-select-box__body {
+  gap: var(--seed-dimension-x0_5);
+  flex-direction: column;
+  min-width: 0;
+  margin-right: auto;
+  display: flex;
 }
 
-.seed-radiomark__icon--checked_false {
+.seed-select-box__label {
+  justify-content: flex-start;
+  align-items: center;
+  gap: var(--seed-dimension-x1);
+  color: var(--seed-color-fg-neutral);
+  font-size: var(--seed-font-size-t5);
+  line-height: var(--seed-line-height-t5);
+  font-weight: var(--seed-font-weight-medium);
+  flex-direction: row;
+  display: flex;
+}
+
+.seed-select-box__description {
+  color: var(--seed-color-fg-neutral-muted);
+  font-size: var(--seed-font-size-t3);
+  line-height: var(--seed-line-height-t3);
+  font-weight: var(--seed-font-weight-regular);
+}
+
+.seed-select-box__footer {
   opacity: 0;
+  width: 100%;
+  height: 0;
+  transition: height var(--seed-duration-d6) var(--seed-timing-function-easing), opacity .4s var(--seed-timing-function-easing);
+  flex-direction: column;
+  display: flex;
+  overflow: hidden;
 }
 
-.seed-radiomark__root--tone_brand-checked_true-disabled_false {
-  background-color: var(--seed-color-bg-brand-solid);
-  border-width: 0;
-  border-color: #0000;
+.seed-select-box__footerInner {
+  flex-direction: column;
+  flex-shrink: 0;
+  width: 100%;
+  height: max-content;
+  display: flex;
 }
 
-.seed-radiomark__icon--tone_brand-checked_true-disabled_false {
-  color: var(--seed-color-palette-static-white);
-  background-color: var(--seed-color-palette-static-white);
+.seed-select-box__trigger--layout_horizontal {
+  padding-left: var(--seed-dimension-x5);
+  padding-right: var(--seed-dimension-x4);
+  padding-top: var(--seed-dimension-x4);
+  padding-bottom: var(--seed-dimension-x4);
+  align-items: center;
 }
 
-.seed-radiomark__root--tone_neutral-checked_true-disabled_false {
-  background-color: var(--seed-color-bg-neutral-inverted);
-  border-width: 0;
-  border-color: #0000;
+.seed-select-box__content--layout_horizontal {
+  align-items: center;
+  gap: var(--seed-dimension-x3);
 }
 
-.seed-radiomark__icon--tone_neutral-checked_true-disabled_false {
-  color: var(--seed-color-fg-neutral-inverted);
-  background-color: var(--seed-color-fg-neutral-inverted);
+.seed-select-box__trigger--layout_vertical {
+  padding-left: var(--seed-dimension-x4);
+  padding-right: var(--seed-dimension-x4);
+  padding-top: var(--seed-dimension-x5);
+  padding-bottom: var(--seed-dimension-x5);
 }
 
-.seed-radiomark__root--tone_brand-checked_false-disabled_true, .seed-radiomark__root--tone_neutral-checked_false-disabled_true {
-  background-color: var(--seed-color-palette-gray-300);
+.seed-select-box__content--layout_vertical {
+  gap: var(--seed-dimension-x2_5);
+  flex-direction: column;
 }
 
-.seed-radiomark__root--tone_brand-checked_true-disabled_true {
-  background-color: var(--seed-color-bg-transparent);
-  border-width: 1px;
-  border-color: var(--seed-color-palette-gray-300);
+.seed-select-box__selectedStroke--selected_true {
+  border-color: var(--seed-color-stroke-neutral-contrast);
 }
 
-.seed-radiomark__icon--tone_brand-checked_true-disabled_true {
-  color: var(--seed-color-palette-gray-300);
-  background-color: var(--seed-color-palette-gray-300);
+.seed-select-box__root--pressed_true {
+  background-color: var(--seed-color-bg-transparent-pressed);
 }
 
-.seed-radiomark__root--tone_neutral-checked_true-disabled_true {
+.seed-select-box__root--disabled_true {
+  box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
+}
+
+.seed-select-box__prefixIcon--disabled_true, .seed-select-box__label--disabled_true, .seed-select-box__description--disabled_true {
+  color: var(--seed-color-fg-disabled);
+}
+
+.seed-select-box__footer--footerOpen_true {
+  opacity: 1;
+  transition: height .4s var(--seed-timing-function-easing), opacity var(--seed-duration-d6) var(--seed-timing-function-easing);
+}
+
+.seed-select-box__selectedStroke--selected_true-disabled_true {
+  border-color: var(--seed-color-stroke-neutral-weak);
+}
+
+.seed-select-box__root--pressed_true-disabled_true {
   background-color: var(--seed-color-bg-transparent);
-  border-width: 1px;
-  border-color: var(--seed-color-palette-gray-300);
 }
 
-.seed-radiomark__icon--tone_neutral-checked_true-disabled_true {
-  color: var(--seed-color-palette-gray-300);
-  background-color: var(--seed-color-palette-gray-300);
+.seed-select-box-checkmark__root {
+  width: var(--seed-dimension-x5);
+  height: var(--seed-dimension-x5);
+  flex-shrink: 0;
+  position: relative;
 }
 
-.seed-radiomark__icon--size_medium-checked_true-disabled_true {
-  width: var(--seed-dimension-x2_5);
-  height: var(--seed-dimension-x2_5);
+.seed-select-box-checkmark__icon {
+  width: 15px;
+  height: 15px;
+  color: var(--seed-color-fg-placeholder);
+  margin: auto;
+  display: flex;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
 }
 
-.seed-radiomark__icon--size_large-checked_true-disabled_true {
-  width: var(--seed-dimension-x3);
-  height: var(--seed-dimension-x3);
+.seed-select-box-checkmark__icon--selected_true {
+  color: var(--seed-color-fg-neutral);
 }
 
-.seed-radiomark__root--pressed_true-checked_false-disabled_false {
-  background-color: var(--seed-color-bg-transparent-pressed);
+.seed-select-box-checkmark__icon--pressed_true {
+  color: var(--seed-color-fg-neutral-subtle);
 }
 
-.seed-radiomark__root--tone_brand-pressed_true-checked_true-disabled_false {
-  background-color: var(--seed-color-bg-brand-solid-pressed);
+.seed-select-box-checkmark__icon--disabled_true {
+  color: var(--seed-color-fg-disabled);
 }
 
-.seed-radiomark__root--tone_neutral-pressed_true-checked_true-disabled_false {
-  background-color: var(--seed-color-bg-neutral-inverted-pressed);
+.seed-select-box-checkmark__icon--selected_true-pressed_true-disabled_false {
+  color: var(--seed-color-fg-neutral);
+}
+
+.seed-select-box-checkmark__icon--selected_true-disabled_true {
+  color: var(--seed-color-fg-disabled);
+}
+
+.seed-select-box-group {
+  row-gap: var(--seed-dimension-spacing-y-component-default);
+  column-gap: var(--seed-dimension-x3);
+  width: 100%;
+  display: grid;
+}
+
+.seed-select-box-group--multiColumn_true {
+  grid-auto-rows: 1fr;
 }
 
 .seed-switch__root {