@font-face {
  font-family: "Gilroy-Fonts";
  font-style: normal;
  font-weight: normal;
  src: local(Gilroy-Regular), url(https://pastatic.picsart.com/cms-pastatic/d018cb40-40a8-4efa-a202-947285ae8329.woff2) format("woff2");
  font-display: swap;
  unicode-range: U+0020-007F;
}
@font-face {
  font-family: "Gilroy-Fonts";
  font-style: normal;
  font-weight: 500;
  src: local(Gilroy-Medium), url(https://pastatic.picsart.com/cms-pastatic/3de40576-a960-483a-a3ab-a1743e3c4ba6.woff2) format("woff2");
  font-display: swap;
  unicode-range: U+0020-007F;
}
@font-face {
  font-family: "Gilroy-Fonts";
  font-style: normal;
  font-weight: 600;
  src: local(Gilroy-SemiBold), url(https://pastatic.picsart.com/cms-pastatic/eae6e1ea-9319-406c-a3de-00431f8f03f4.woff2) format("woff2");
  font-display: swap;
  unicode-range: U+0020-007F;
}
@font-face {
  font-family: "Gilroy-Fonts";
  font-style: normal;
  font-weight: bold;
  src: local(Gilroy-Bold), url(https://pastatic.picsart.com/cms-pastatic/0ea441d6-d0d4-4236-b649-67a987887865.woff2) format("woff2");
  font-display: swap;
  unicode-range: U+0020-007F;
}
html {
  --fonts-gilroy: Gilroy-Fonts, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, Helvetica, Arial, sans-serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

::selection {
  background-color: var(--primary-colors-base-default);
  color: var(--primary-colors-text-default);
}

html {
  min-height: -webkit-fill-available;
  min-height: 100dvh;
  overscroll-behavior: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  font-feature-settings: normal;
}
@supports (-webkit-touch-callout: none) and (padding-top: env(safe-area-inset-top)) {
  html {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

a {
  text-decoration: none;
}

iframe {
  border: none;
  outline: none;
}

button {
  border: none;
  background: none;
  cursor: pointer;
}

input,
textarea,
select {
  border: none;
  outline: none;
  background: none;
  font-family: inherit;
}

input,
select {
  appearance: none;
  -webkit-appearance: none;
}

a,
button,
input,
textarea,
select,
div {
  -webkit-tap-highlight-color: transparent;
}

input, button, textarea, select {
  font-family: inherit;
}

ul,
ol {
  list-style: none;
}

html {
  --easings-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --easings-ease-in: cubic-bezier(0.42, 0, 1, 1);
  --easings-ease-in-out: cubic-bezier(0.42, 0, 0.58, 1);
  --easings-ease-out: cubic-bezier(0, 0, 0.58, 1);
  --easings-linear: cubic-bezier(0, 0, 1, 1);
  --easings-practical: cubic-bezier(0.4, 0, 0.2, 1);
  --easings-expressive: cubic-bezier(0.4, 0, 0, 1);
  --easings-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --states-disabled: 0.4;
  --corner-radius-circle: 50%;
  --corner-radius-r0: 0px;
  --corner-radius-r2: 2px;
  --corner-radius-r4: 4px;
  --corner-radius-r8: 8px;
  --corner-radius-r12: 12px;
  --corner-radius-r16: 16px;
  --corner-radius-r20: 20px;
  --corner-radius-r22: 22px;
  --corner-radius-r24: 24px;
  --corner-radius-r32: 32px;
  --spacings-s0: 0px;
  --spacings-s2: 2px;
  --spacings-s4: 4px;
  --spacings-s6: 6px;
  --spacings-s8: 8px;
  --spacings-s10: 10px;
  --spacings-s12: 12px;
  --spacings-s16: 16px;
  --spacings-s24: 24px;
  --spacings-s32: 32px;
  --spacings-s40: 40px;
  --spacings-s44: 44px;
  --spacings-s48: 48px;
  --spacings-s56: 56px;
  --spacings-s64: 64px;
  --spacings-s72: 72px;
  --stacking-context-lowest: -9999;
  --stacking-context-initial: 0;
  --stacking-context-layout: 1000;
  --stacking-context-popover: 2000;
  --stacking-context-popup: 3000;
  --stacking-context-tooltip: 4000;
  --stacking-context-toast: 5000;
  --stacking-context-highest: 9999;
  --timings-fast: 100ms;
  --timings-default: 300ms;
  --timings-medium: 500ms;
  --timings-long: 1000ms;
  --timings-heavy: 2000ms;
  --typography-t1-font-size: 8px;
  --typography-t1-line-height: 10px;
  --typography-t2-font-size: 10px;
  --typography-t2-line-height: 14px;
  --typography-t3-font-size: 12px;
  --typography-t3-line-height: 16px;
  --typography-t4-font-size: 14px;
  --typography-t4-line-height: 20px;
  --typography-t5-font-size: 16px;
  --typography-t5-line-height: 24px;
  --typography-t6-font-size: 20px;
  --typography-t6-line-height: 28px;
  --typography-t7-font-size: 24px;
  --typography-t7-line-height: 32px;
  --typography-t8-font-size: 30px;
  --typography-t8-line-height: 36px;
  --typography-t9-font-size: 36px;
  --typography-t9-line-height: 48px;
  --typography-t10-font-size: 42px;
  --typography-t10-line-height: 50px;
  --typography-t11-font-size: 60px;
  --typography-t11-line-height: 72px;
  --gradients-primary: linear-gradient(135deg, #00ffed 0%, #19d7e7 22.96%, #7f4ad9 45.31%, #af1fc6 66.73%, #df02c0 100%);
  --gradients-gold: linear-gradient(225deg, #fabb00 0%, #d0388d 59.29%, #9a1a89 100%);
  --gradients-plus: linear-gradient(246deg, #f9ae4a 13%, #c209c1 100%);
  --gradients-pro: linear-gradient(60.72deg, #0e00ac -11%, #ff34f9 100%);
  --gradients-eggsellent: linear-gradient(315deg, #ffd15a 14.64%, #ffb017 85.36%);
  --gradients-lotus: linear-gradient(315deg, #b5b5ff 14.64%, #fbc7d4 85.36%);
  --gradients-aura: linear-gradient(315deg, #fbeac9 14.64%, #abb8fd 84.73%);
  --gradients-tangerine: linear-gradient(105deg, #bde0a2 1.35%, #ff9658 100%);
  --gradients-valentine: linear-gradient(315deg, #f44097 25%, #fc67fa 75%);
  --gradients-essentials: linear-gradient(246deg, #f9ae4a 13.41%, #c209c1 82.6%);
  --gradients-performance: linear-gradient(315deg, #5a00ee 14.64%, #699ad2 85.36%);
  --gradients-ultra: linear-gradient(315deg, #265dae 0%, #22afb9 50%);
}

html.light {
  --brand-colors-default: #f40bf4;
  --brand-colors-light: #fffcf8;
  --brand-colors-dark: #000000;
  --absolute-black-colors-base-default: #000000;
  --absolute-black-colors-base-action: #313131;
  --absolute-black-colors-base-active: #000000;
  --absolute-black-colors-base-active-action: #313131;
  --absolute-black-colors-text-default: #ffffff;
  --absolute-black-colors-text-action: #ffffff;
  --absolute-black-colors-text-active: #ffffff;
  --absolute-black-colors-text-active-action: #ffffff;
  --absolute-white-colors-base-default: #ffffff;
  --absolute-white-colors-base-action: #ececec;
  --absolute-white-colors-base-active: #ffffff;
  --absolute-white-colors-base-active-action: #ececec;
  --absolute-white-colors-text-default: #000000;
  --absolute-white-colors-text-action: #000000;
  --absolute-white-colors-text-active: #000000;
  --absolute-white-colors-text-active-action: #000000;
  --background-colors-base: #fcfcfc;
  --background-colors-tint-1: #f7f7f7;
  --background-colors-tint-2: #f2f2f2;
  --background-colors-tint-3: #d9d9d9;
  --background-colors-border: #e8e8e8;
  --background-colors-transparent: rgba(0, 0, 0, 0.5215686275);
  --background-colors-tooltip: #ffffff;
  --background-colors-popover: #ffffff;
  --background-colors-gradient-up: linear-gradient(360deg, rgba(252, 252, 252, 0.8) 0%, transparent 100%);
  --background-colors-gradient-down: linear-gradient(180deg, rgba(252, 252, 252, 0.8) 0%, transparent 100%);
  --background-colors-gradient-left: linear-gradient(90deg, #fcfcfc 0%, transparent 100%);
  --background-colors-gradient-right: linear-gradient(270deg, #fcfcfc 0%, transparent 100%);
  --background-colors-canvas-back-layer: #ededed;
  --background-colors-negative-transparent: rgba(0, 0, 0, 0.7019607843);
  --control-colors-border-default: #e0e0e0;
  --control-colors-border-action: #e0e0e0;
  --control-colors-border-active: #e0e0e0;
  --control-colors-border-active-action: #e0e0e0;
  --control-colors-button-background-default: #ffffff;
  --control-colors-button-background-action: #f7f7f7;
  --control-colors-button-background-active: #eeeeee;
  --control-colors-button-background-active-action: #f7f7f7;
  --control-colors-caret-default: #5a00ee;
  --control-colors-caret-action: #5a00ee;
  --control-colors-caret-active: #5a00ee;
  --control-colors-caret-active-action: #5a00ee;
  --control-colors-end-icon-default: #525252;
  --control-colors-end-icon-action: #3d3d3d;
  --control-colors-end-icon-active: #000000;
  --control-colors-end-icon-active-action: #3d3d3d;
  --control-colors-field-background-default: #ffffff;
  --control-colors-field-background-action: #f7f7f7;
  --control-colors-field-background-active: #eeeeee;
  --control-colors-field-background-active-action: #f7f7f7;
  --control-colors-placeholder-default: #707070;
  --control-colors-placeholder-action: #707070;
  --control-colors-placeholder-active: #707070;
  --control-colors-placeholder-active-action: #707070;
  --control-colors-slider-thumb-default: #fefefe;
  --control-colors-slider-thumb-action: #f1f1f1;
  --control-colors-slider-thumb-active: #fefefe;
  --control-colors-slider-thumb-active-action: #f1f1f1;
  --control-colors-slider-track-default: #C209C1;
  --control-colors-slider-track-action: #C209C1;
  --control-colors-slider-track-active: #C209C1;
  --control-colors-slider-track-active-action: #C209C1;
  --control-colors-start-icon-default: #525252;
  --control-colors-start-icon-action: #3d3d3d;
  --control-colors-start-icon-active: #000000;
  --control-colors-start-icon-active-action: #3d3d3d;
  --control-colors-text-default: #525252;
  --control-colors-text-action: #3d3d3d;
  --control-colors-text-active: #000000;
  --control-colors-text-active-action: #3d3d3d;
  --control-colors-value-default: #525252;
  --control-colors-value-action: #3d3d3d;
  --control-colors-value-active: #000000;
  --control-colors-value-active-action: #3d3d3d;
  --text-colors-base: #000000;
  --text-colors-tint-1: #4c4c4c;
  --text-colors-tint-2: #808080;
  --text-colors-tint-3: #999999;
  --text-colors-tooltip: #ffffff;
  --error-colors-base-default: #d31e2a;
  --error-colors-base-action: #9d0007;
  --error-colors-base-active: #d31e2a;
  --error-colors-base-active-action: #9d0007;
  --error-colors-text-default: #ffffff;
  --error-colors-text-action: #ffffff;
  --error-colors-text-active: #ffffff;
  --error-colors-text-active-action: #ffffff;
  --information-colors-base-default: #5a00ee;
  --information-colors-base-action: #3d00a2;
  --information-colors-base-active: #5a00ee;
  --information-colors-base-active-action: #3d00a2;
  --information-colors-text-default: #ffffff;
  --information-colors-text-action: #ffffff;
  --information-colors-text-active: #ffffff;
  --information-colors-text-active-action: #ffffff;
  --success-colors-base-default: #158423;
  --success-colors-base-action: #0e5a18;
  --success-colors-base-active: #158423;
  --success-colors-base-active-action: #0e5a18;
  --success-colors-text-default: #ffffff;
  --success-colors-text-action: #ffffff;
  --success-colors-text-active: #ffffff;
  --success-colors-text-active-action: #ffffff;
  --warning-colors-base-default: #fe9d24;
  --warning-colors-base-action: #c9760e;
  --warning-colors-base-active: #fe9d24;
  --warning-colors-base-active-action: #c9760e;
  --warning-colors-text-default: #000000;
  --warning-colors-text-action: #000000;
  --warning-colors-text-active: #000000;
  --warning-colors-text-active-action: #000000;
  --negative-colors-base-default: #000000;
  --negative-colors-base-action: #787878;
  --negative-colors-base-active: #000000;
  --negative-colors-base-active-action: #787878;
  --negative-colors-text-default: #ffffff;
  --negative-colors-text-action: #ffffff;
  --negative-colors-text-active: #ffffff;
  --negative-colors-text-active-action: #ffffff;
  --neutral-colors-base-default: #f2f2f2;
  --neutral-colors-base-action: #b4b4b4;
  --neutral-colors-base-active: #f2f2f2;
  --neutral-colors-base-active-action: #b4b4b4;
  --neutral-colors-text-default: #000000;
  --neutral-colors-text-action: #000000;
  --neutral-colors-text-active: #000000;
  --neutral-colors-text-active-action: #000000;
  --positive-colors-base-default: #ffffff;
  --positive-colors-base-action: #b4b4b4;
  --positive-colors-base-active: #ffffff;
  --positive-colors-base-active-action: #b4b4b4;
  --positive-colors-text-default: #000000;
  --positive-colors-text-action: #000000;
  --positive-colors-text-active: #000000;
  --positive-colors-text-active-action: #000000;
  --primary-colors-base-default: #c209c1;
  --primary-colors-base-action: #920792;
  --primary-colors-base-active: #c209c1;
  --primary-colors-base-active-action: #920792;
  --primary-colors-text-default: #ffffff;
  --primary-colors-text-action: #ffffff;
  --primary-colors-text-active: #ffffff;
  --primary-colors-text-active-action: #ffffff;
  --primary-colors-alpha-10: rgba(194, 9, 193, 0.1019607843);
  --primary-colors-alpha-20: rgba(194, 9, 193, 0.2);
  --primary-colors-alpha-50: rgba(194, 9, 193, 0.4980392157);
  --primary-colors-alpha-80: rgba(194, 9, 193, 0.8);
  --transformer-colors-base-default: #3b8ce2;
  --transformer-colors-base-action: #3b8ce2;
  --transformer-colors-base-active: #3b8ce2;
  --transformer-colors-base-active-action: #3b8ce2;
  --transformer-colors-text-default: #ffffff;
  --transformer-colors-text-action: #ffffff;
  --transformer-colors-text-active: #ffffff;
  --transformer-colors-text-active-action: #ffffff;
  --monetization-plus-colors-base-default: #c209c1;
  --monetization-plus-colors-base-action: #920792;
  --monetization-plus-colors-base-active: #c209c1;
  --monetization-plus-colors-base-active-action: #920792;
  --monetization-plus-colors-text-default: #ffffff;
  --monetization-plus-colors-text-action: #ffffff;
  --monetization-plus-colors-text-active: #ffffff;
  --monetization-plus-colors-text-active-action: #ffffff;
  --monetization-pro-colors-base-default: #5a00ee;
  --monetization-pro-colors-base-action: #3d00a2;
  --monetization-pro-colors-base-active: #5a00ee;
  --monetization-pro-colors-base-active-action: #3d00a2;
  --monetization-pro-colors-text-default: #ffffff;
  --monetization-pro-colors-text-action: #ffffff;
  --monetization-pro-colors-text-active: #ffffff;
  --monetization-pro-colors-text-active-action: #ffffff;
  --monetization-ultra-colors-base-default: #158380;
  --monetization-ultra-colors-base-action: #0e5957;
  --monetization-ultra-colors-base-active: #158380;
  --monetization-ultra-colors-base-active-action: #0e5957;
  --monetization-ultra-colors-text-default: #ffffff;
  --monetization-ultra-colors-text-action: #ffffff;
  --monetization-ultra-colors-text-active: #ffffff;
  --monetization-ultra-colors-text-active-action: #ffffff;
  --apple-colors-base-default: #ffffff;
  --apple-colors-base-action: #e6e6e6;
  --apple-colors-base-active: #ffffff;
  --apple-colors-base-active-action: #e6e6e6;
  --apple-colors-text-default: #ffffff;
  --apple-colors-text-action: #ffffff;
  --apple-colors-text-active: #ffffff;
  --apple-colors-text-active-action: #ffffff;
  --facebook-colors-base-default: #0766ff;
  --facebook-colors-base-action: #0050d1;
  --facebook-colors-base-active: #0766ff;
  --facebook-colors-base-active-action: #0050d1;
  --facebook-colors-text-default: #ffffff;
  --facebook-colors-text-action: #ffffff;
  --facebook-colors-text-active: #ffffff;
  --facebook-colors-text-active-action: #ffffff;
  --google-colors-base-default: #f2f2f2;
  --google-colors-base-action: #c2c2c2;
  --google-colors-base-active: #f2f2f2;
  --google-colors-base-active-action: #c2c2c2;
  --google-colors-text-default: #1f1f1f;
  --google-colors-text-action: #1f1f1f;
  --google-colors-text-active: #1f1f1f;
  --google-colors-text-active-action: #1f1f1f;
  --kakao-colors-base-default: #fee500;
  --kakao-colors-base-action: #ebd402;
  --kakao-colors-base-active: #fee500;
  --kakao-colors-base-active-action: #ebd402;
  --kakao-colors-text-default: #262200;
  --kakao-colors-text-action: #262200;
  --kakao-colors-text-active: #262200;
  --kakao-colors-text-active-action: #262200;
  --line-colors-base-default: #06c755;
  --line-colors-base-action: #1fcd66;
  --line-colors-base-active: #048b3c;
  --line-colors-base-active-action: #06c755;
  --line-colors-text-default: #ffffff;
  --line-colors-text-action: #ffffff;
  --line-colors-text-active: #ffffff;
  --line-colors-text-active-action: #ffffff;
  --snapchat-colors-base-default: #fffc00;
  --snapchat-colors-base-action: #ece801;
  --snapchat-colors-base-active: #fffc00;
  --snapchat-colors-base-active-action: #ece801;
  --snapchat-colors-text-default: #000000;
  --snapchat-colors-text-action: #000000;
  --snapchat-colors-text-active: #000000;
  --snapchat-colors-text-active-action: #000000;
  --christmas-green-colors-base-default: #007c02;
  --christmas-green-colors-base-action: #0e5a18;
  --christmas-green-colors-base-active: #007c02;
  --christmas-green-colors-base-active-action: #0e5a18;
  --christmas-green-colors-text-default: #ffffff;
  --christmas-green-colors-text-action: #ffffff;
  --christmas-green-colors-text-active: #ffffff;
  --christmas-green-colors-text-active-action: #ffffff;
  --christmas-red-colors-base-default: #c70e17;
  --christmas-red-colors-base-action: #9e0b12;
  --christmas-red-colors-base-active: #c70e17;
  --christmas-red-colors-base-active-action: #9e0b12;
  --christmas-red-colors-text-default: #ffffff;
  --christmas-red-colors-text-action: #ffffff;
  --christmas-red-colors-text-active: #ffffff;
  --christmas-red-colors-text-active-action: #ffffff;
  --effects-alpha-20: color-mix(in srgb, #ffffff 20%, transparent);
  --effects-alpha-50: color-mix(in srgb, #ffffff 50%, transparent);
  --effects-alpha-80: color-mix(in srgb, #ffffff 80%, transparent);
  --effects-vignette: radial-gradient(44.71% 44.71% at 50.14% 50.12%, rgba(243, 10, 242, 0.484) 0%, rgba(243, 10, 242, 0.33) 32%, rgba(243, 10, 242, 0.187) 56%, rgba(243, 10, 242, 0.088) 76%, rgba(243, 10, 242, 0.022) 91%, rgba(243, 10, 242, 0) 100%);
  --shadows-tint-1: 0px 0px 16px 0px rgba(0, 0, 0, 0.12);
  --shadows-tint-2: 0px 0px 24px 0px rgba(0, 0, 0, 0.16);
  --shadows-tint-3: 0px 0px 32px 0px rgba(0, 0, 0, 0.16);
}

html.dark {
  --brand-colors-default: #f40bf4;
  --brand-colors-light: #fffcf8;
  --brand-colors-dark: #000000;
  --absolute-black-colors-base-default: #000000;
  --absolute-black-colors-base-action: #313131;
  --absolute-black-colors-base-active: #000000;
  --absolute-black-colors-base-active-action: #313131;
  --absolute-black-colors-text-default: #ffffff;
  --absolute-black-colors-text-action: #ffffff;
  --absolute-black-colors-text-active: #ffffff;
  --absolute-black-colors-text-active-action: #ffffff;
  --absolute-white-colors-base-default: #ffffff;
  --absolute-white-colors-base-action: #ececec;
  --absolute-white-colors-base-active: #ffffff;
  --absolute-white-colors-base-active-action: #ececec;
  --absolute-white-colors-text-default: #000000;
  --absolute-white-colors-text-action: #000000;
  --absolute-white-colors-text-active: #000000;
  --absolute-white-colors-text-active-action: #000000;
  --background-colors-base: #121212;
  --background-colors-tint-1: #1c1c1c;
  --background-colors-tint-2: #262626;
  --background-colors-tint-3: #454545;
  --background-colors-border: #303030;
  --background-colors-transparent: rgba(0, 0, 0, 0.6);
  --background-colors-tooltip: #000000;
  --background-colors-popover: #0f0f0f;
  --background-colors-gradient-up: linear-gradient(360deg, rgba(18, 18, 18, 0.8) 0%, transparent 100%);
  --background-colors-gradient-down: linear-gradient(180deg, rgba(18, 18, 18, 0.8) 0%, transparent 100%);
  --background-colors-gradient-left: linear-gradient(90deg, #121212 0%, transparent 100%);
  --background-colors-gradient-right: linear-gradient(270deg, #121212 0%, transparent 100%);
  --background-colors-canvas-back-layer: #262626;
  --background-colors-negative-transparent: rgba(255, 255, 255, 0.7019607843);
  --control-colors-border-default: #3b3b3b;
  --control-colors-border-action: #3b3b3b;
  --control-colors-border-active: #3b3b3b;
  --control-colors-border-active-action: #3b3b3b;
  --control-colors-button-background-default: #000000;
  --control-colors-button-background-action: #212121;
  --control-colors-button-background-active: #2a2a2a;
  --control-colors-button-background-active-action: #212121;
  --control-colors-caret-default: #ff47ff;
  --control-colors-caret-action: #ff47ff;
  --control-colors-caret-active: #ff47ff;
  --control-colors-caret-active-action: #ff47ff;
  --control-colors-end-icon-default: #b3b3b3;
  --control-colors-end-icon-action: #cccccc;
  --control-colors-end-icon-active: #ffffff;
  --control-colors-end-icon-active-action: #cccccc;
  --control-colors-field-background-default: #000000;
  --control-colors-field-background-action: #212121;
  --control-colors-field-background-active: #2a2a2a;
  --control-colors-field-background-active-action: #212121;
  --control-colors-placeholder-default: #7a7a7a;
  --control-colors-placeholder-action: #7a7a7a;
  --control-colors-placeholder-active: #7a7a7a;
  --control-colors-placeholder-active-action: #7a7a7a;
  --control-colors-slider-thumb-default: #ffffff;
  --control-colors-slider-thumb-action: #f1f1f1;
  --control-colors-slider-thumb-active: #ffffff;
  --control-colors-slider-thumb-active-action: #f1f1f1;
  --control-colors-slider-track-default: #FF47FF;
  --control-colors-slider-track-action: #FF47FF;
  --control-colors-slider-track-active: #FF47FF;
  --control-colors-slider-track-active-action: #FF47FF;
  --control-colors-start-icon-default: #b3b3b3;
  --control-colors-start-icon-action: #cccccc;
  --control-colors-start-icon-active: #ffffff;
  --control-colors-start-icon-active-action: #cccccc;
  --control-colors-text-default: #b3b3b3;
  --control-colors-text-action: #cccccc;
  --control-colors-text-active: #ffffff;
  --control-colors-text-active-action: #cccccc;
  --control-colors-value-default: #b3b3b3;
  --control-colors-value-action: #cccccc;
  --control-colors-value-active: #ffffff;
  --control-colors-value-active-action: #cccccc;
  --text-colors-base: #ffffff;
  --text-colors-tint-1: #b3b3b3;
  --text-colors-tint-2: #808080;
  --text-colors-tint-3: #666666;
  --text-colors-tooltip: #000000;
  --error-colors-base-default: #f8495a;
  --error-colors-base-action: #a62332;
  --error-colors-base-active: #f8495a;
  --error-colors-base-active-action: #a62332;
  --error-colors-text-default: #000000;
  --error-colors-text-action: #000000;
  --error-colors-text-active: #000000;
  --error-colors-text-active-action: #000000;
  --information-colors-base-default: #bd99f8;
  --information-colors-base-action: #8168a9;
  --information-colors-base-active: #bd99f8;
  --information-colors-base-active-action: #8168a9;
  --information-colors-text-default: #000000;
  --information-colors-text-action: #000000;
  --information-colors-text-active: #000000;
  --information-colors-text-active-action: #000000;
  --success-colors-base-default: #64ed68;
  --success-colors-base-action: #45a349;
  --success-colors-base-active: #64ed68;
  --success-colors-base-active-action: #45a349;
  --success-colors-text-default: #000000;
  --success-colors-text-action: #000000;
  --success-colors-text-active: #000000;
  --success-colors-text-active-action: #000000;
  --warning-colors-base-default: #ffc13c;
  --warning-colors-base-action: #d69200;
  --warning-colors-base-active: #ffc13c;
  --warning-colors-base-active-action: #d69200;
  --warning-colors-text-default: #000000;
  --warning-colors-text-action: #000000;
  --warning-colors-text-active: #000000;
  --warning-colors-text-active-action: #000000;
  --negative-colors-base-default: #ffffff;
  --negative-colors-base-action: #b4b4b4;
  --negative-colors-base-active: #ffffff;
  --negative-colors-base-active-action: #b4b4b4;
  --negative-colors-text-default: #000000;
  --negative-colors-text-action: #000000;
  --negative-colors-text-active: #000000;
  --negative-colors-text-active-action: #000000;
  --neutral-colors-base-default: #2f2f2f;
  --neutral-colors-base-action: #080808;
  --neutral-colors-base-active: #2f2f2f;
  --neutral-colors-base-active-action: #080808;
  --neutral-colors-text-default: #ffffff;
  --neutral-colors-text-action: #ffffff;
  --neutral-colors-text-active: #ffffff;
  --neutral-colors-text-active-action: #ffffff;
  --positive-colors-base-default: #000000;
  --positive-colors-base-action: #787878;
  --positive-colors-base-active: #000000;
  --positive-colors-base-active-action: #787878;
  --positive-colors-text-default: #ffffff;
  --positive-colors-text-action: #ffffff;
  --positive-colors-text-active: #ffffff;
  --positive-colors-text-active-action: #ffffff;
  --primary-colors-base-default: #ff47ff;
  --primary-colors-base-action: #e636e6;
  --primary-colors-base-active: #ff47ff;
  --primary-colors-base-active-action: #e636e6;
  --primary-colors-text-default: #000000;
  --primary-colors-text-action: #000000;
  --primary-colors-text-active: #000000;
  --primary-colors-text-active-action: #000000;
  --primary-colors-alpha-10: rgba(255, 71, 255, 0.1019607843);
  --primary-colors-alpha-20: rgba(255, 71, 255, 0.2);
  --primary-colors-alpha-50: rgba(255, 71, 255, 0.5019607843);
  --primary-colors-alpha-80: rgba(255, 71, 255, 0.8);
  --transformer-colors-base-default: #3b8ce2;
  --transformer-colors-base-action: #3b8ce2;
  --transformer-colors-base-active: #3b8ce2;
  --transformer-colors-base-active-action: #3b8ce2;
  --transformer-colors-text-default: #ffffff;
  --transformer-colors-text-action: #ffffff;
  --transformer-colors-text-active: #ffffff;
  --transformer-colors-text-active-action: #ffffff;
  --monetization-plus-colors-base-default: #ff47ff;
  --monetization-plus-colors-base-action: #e636e6;
  --monetization-plus-colors-base-active: #ff47ff;
  --monetization-plus-colors-base-active-action: #e636e6;
  --monetization-plus-colors-text-default: #ffffff;
  --monetization-plus-colors-text-action: #ffffff;
  --monetization-plus-colors-text-active: #ffffff;
  --monetization-plus-colors-text-active-action: #ffffff;
  --monetization-pro-colors-base-default: #bd99f8;
  --monetization-pro-colors-base-action: #8168a9;
  --monetization-pro-colors-base-active: #bd99f8;
  --monetization-pro-colors-base-active-action: #8168a9;
  --monetization-pro-colors-text-default: #000000;
  --monetization-pro-colors-text-action: #000000;
  --monetization-pro-colors-text-active: #000000;
  --monetization-pro-colors-text-active-action: #000000;
  --monetization-ultra-colors-base-default: #158380;
  --monetization-ultra-colors-base-action: #0e5957;
  --monetization-ultra-colors-base-active: #158380;
  --monetization-ultra-colors-base-active-action: #0e5957;
  --monetization-ultra-colors-text-default: #ffffff;
  --monetization-ultra-colors-text-action: #ffffff;
  --monetization-ultra-colors-text-active: #ffffff;
  --monetization-ultra-colors-text-active-action: #ffffff;
  --apple-colors-base-default: #000000;
  --apple-colors-base-action: #1a1a1a;
  --apple-colors-base-active: #000000;
  --apple-colors-base-active-action: #1a1a1a;
  --apple-colors-text-default: #ffffff;
  --apple-colors-text-action: #ffffff;
  --apple-colors-text-active: #ffffff;
  --apple-colors-text-active-action: #ffffff;
  --facebook-colors-base-default: #0766ff;
  --facebook-colors-base-action: #0050d1;
  --facebook-colors-base-active: #0766ff;
  --facebook-colors-base-active-action: #0050d1;
  --facebook-colors-text-default: #ffffff;
  --facebook-colors-text-action: #ffffff;
  --facebook-colors-text-active: #ffffff;
  --facebook-colors-text-active-action: #ffffff;
  --google-colors-base-default: #f2f2f2;
  --google-colors-base-action: #c2c2c2;
  --google-colors-base-active: #f2f2f2;
  --google-colors-base-active-action: #c2c2c2;
  --google-colors-text-default: #1f1f1f;
  --google-colors-text-action: #1f1f1f;
  --google-colors-text-active: #1f1f1f;
  --google-colors-text-active-action: #1f1f1f;
  --kakao-colors-base-default: #fee500;
  --kakao-colors-base-action: #ebd402;
  --kakao-colors-base-active: #fee500;
  --kakao-colors-base-active-action: #ebd402;
  --kakao-colors-text-default: #262200;
  --kakao-colors-text-action: #262200;
  --kakao-colors-text-active: #262200;
  --kakao-colors-text-active-action: #262200;
  --line-colors-base-default: #06c755;
  --line-colors-base-action: #1fcd66;
  --line-colors-base-active: #048b3c;
  --line-colors-base-active-action: #06c755;
  --line-colors-text-default: #ffffff;
  --line-colors-text-action: #ffffff;
  --line-colors-text-active: #ffffff;
  --line-colors-text-active-action: #ffffff;
  --snapchat-colors-base-default: #fffc00;
  --snapchat-colors-base-action: #ece801;
  --snapchat-colors-base-active: #fffc00;
  --snapchat-colors-base-active-action: #ece801;
  --snapchat-colors-text-default: #000000;
  --snapchat-colors-text-action: #000000;
  --snapchat-colors-text-active: #000000;
  --snapchat-colors-text-active-action: #000000;
  --christmas-green-colors-base-default: #13a745;
  --christmas-green-colors-base-action: #12942a;
  --christmas-green-colors-base-active: #13a745;
  --christmas-green-colors-base-active-action: #12942a;
  --christmas-green-colors-text-default: #000000;
  --christmas-green-colors-text-action: #000000;
  --christmas-green-colors-text-active: #000000;
  --christmas-green-colors-text-active-action: #000000;
  --christmas-red-colors-base-default: #ff3f53;
  --christmas-red-colors-base-action: #e02639;
  --christmas-red-colors-base-active: #ff3f53;
  --christmas-red-colors-base-active-action: #e02639;
  --christmas-red-colors-text-default: #000000;
  --christmas-red-colors-text-action: #000000;
  --christmas-red-colors-text-active: #000000;
  --christmas-red-colors-text-active-action: #000000;
  --effects-alpha-20: color-mix(in srgb, #000000 20%, transparent);
  --effects-alpha-50: color-mix(in srgb, #000000 50%, transparent);
  --effects-alpha-80: color-mix(in srgb, #000000 80%, transparent);
  --effects-vignette: radial-gradient(44.71% 44.71% at 50.14% 50.12%, rgba(243, 10, 242, 0.484) 0%, rgba(243, 10, 242, 0.33) 32%, rgba(243, 10, 242, 0.187) 56%, rgba(243, 10, 242, 0.088) 76%, rgba(243, 10, 242, 0.022) 91%, rgba(243, 10, 242, 0) 100%);
  --shadows-tint-1: 0px 2px 12px 0px rgba(0, 0, 0, 0.50), 0px 1px 4px 0px rgba(0, 0, 0, 0.35);
  --shadows-tint-2: 0px 6px 24px 0px rgba(0, 0, 0, 0.60), 0px 3px 10px 0px rgba(0, 0, 0, 0.40);
  --shadows-tint-3: 0px 20px 60px 0px rgba(0, 0, 0, 0.75), 0px 8px 28px 0px rgba(0, 0, 0, 0.55);
}
.avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  border-radius: 50%;
  flex-shrink: 0;
  width: var(--avatar-size);
  height: var(--avatar-size);
  background-color: var(--avatar-bg, var(--control-colors-button-background-default));
  box-shadow: var(--avatar-shadow, none);
  border: var(--avatar-border, var(--avatar-border-width, 0px) solid var(--avatar-border-color, transparent));
  cursor: var(--avatar-cursor, default);
}
.avatar__placeholder-icon {
  width: 50%;
  height: 50%;
}
.avatar__image {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}
.avatar__icon {
  display: inline-block;
}
.avatar__icon > path {
  fill: var(--control-colors-value-default);
}
.avatar__skeleton {
  position: absolute;
  inset: calc(-1 * var(--avatar-border-width, 0px));
  border-radius: inherit;
}
.avatar__control {
  display: none;
}
.avatar__badge {
  display: flex;
  position: absolute;
  bottom: 0;
}
[dir=ltr] .avatar__badge {
  right: 0;
}
[dir=rtl] .avatar__badge {
  left: 0;
}
.avatar--with-shadow {
  box-shadow: var(--shadows-tint-1);
}
.avatar--no-border {
  border: none;
}
.avatar--cursor-pointer {
  cursor: pointer;
}
[dir=ltr] .avatar__badge--rectangle {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
[dir=rtl] .avatar__badge--rectangle {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
@keyframes skeleton-ltr {
  0% {
    transform: translate(-200%, -50%);
  }
  100% {
    transform: translate(100%, -50%);
  }
}
@keyframes skeleton-rtl {
  0% {
    transform: translate(100%, -50%);
  }
  100% {
    transform: translate(-200%, -50%);
  }
}
.skeleton {
  display: block;
  position: relative;
  overflow: hidden;
  clip-path: view-box;
  background-color: var(--background-colors-tint-2);
  width: var(--skeleton-width);
  height: var(--skeleton-height);
  border-radius: var(--skeleton-border-radius, 0);
}
.skeleton::before {
  content: "";
  display: block;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: linear-gradient(90deg, transparent, var(--background-colors-tint-3), transparent);
  will-change: transform;
}

[dir=ltr] .skeleton::before {
  animation: skeleton-ltr var(--timings-long) var(--easings-linear) infinite;
}

[dir=rtl] .skeleton::before {
  animation: skeleton-rtl var(--timings-long) var(--easings-linear) infinite;
}
.image {
  display: block;
  max-width: 100%;
}
.text--t1 {
  font-size: var(--typography-t1-font-size);
  line-height: var(--typography-t1-line-height);
}
.text--t2 {
  font-size: var(--typography-t2-font-size);
  line-height: var(--typography-t2-line-height);
}
.text--t3 {
  font-size: var(--typography-t3-font-size);
  line-height: var(--typography-t3-line-height);
}
.text--t4 {
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.text--t5 {
  font-size: var(--typography-t5-font-size);
  line-height: var(--typography-t5-line-height);
}
.text--t6 {
  font-size: var(--typography-t6-font-size);
  line-height: var(--typography-t6-line-height);
}
.text--t7 {
  font-size: var(--typography-t7-font-size);
  line-height: var(--typography-t7-line-height);
}
.text--t8 {
  font-size: var(--typography-t8-font-size);
  line-height: var(--typography-t8-line-height);
}
.text--t9 {
  font-size: var(--typography-t9-font-size);
  line-height: var(--typography-t9-line-height);
}
.text--t10 {
  font-size: var(--typography-t10-font-size);
  line-height: var(--typography-t10-line-height);
}
.text--color-primary {
  color: var(--primary-colors-base-default);
}
.text--color-neutral {
  color: var(--neutral-colors-base-default);
}
.text--color-plus {
  color: var(--monetization-plus-colors-base-default);
}
.text--color-pro {
  color: var(--monetization-pro-colors-base-default);
}
.text--color-ultra {
  color: var(--monetization-ultra-colors-base-default);
}
.text--color-success {
  color: var(--success-colors-base-default);
}
.text--color-warning {
  color: var(--warning-colors-base-default);
}
.text--color-error {
  color: var(--error-colors-base-default);
}
.text--color-information {
  color: var(--information-colors-base-default);
}
.text--color-positive {
  color: var(--positive-colors-base-default);
}
.text--color-negative {
  color: var(--negative-colors-base-default);
}
.text--color-black {
  color: var(--absolute-black-colors-base-default);
}
.text--color-white {
  color: var(--absolute-white-colors-base-default);
}
.text--color-base {
  color: var(--text-colors-base);
}
.text--color-tint-1 {
  color: var(--text-colors-tint-1);
}
.text--color-tint-2 {
  color: var(--text-colors-tint-2);
}
.text--color-tint-3 {
  color: var(--text-colors-tint-3);
}
.text--color-tooltip {
  color: var(--text-colors-tooltip);
}
.text--full-width {
  display: block;
  width: 100%;
}
.text--align-left {
  text-align: left;
}
.text--align-center {
  text-align: center;
}
.text--align-right {
  text-align: right;
}
.text--truncated {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.text--multi-line-truncated {
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--text-max-visible-row-count);
  overflow: hidden;
}
.base-text--font-gilroy {
  font-family: var(--fonts-gilroy);
}
.base-text--font-acorn {
  font-family: var(--fonts-acorn);
}
.base-text--weight-medium {
  font-weight: 500;
}
.base-text--weight-semibold {
  font-weight: 600;
}
.base-text--weight-bold {
  font-weight: bold;
}
.base-text--weight-normal {
  font-weight: normal;
}
.badge {
  display: inline-flex;
  vertical-align: top;
  align-items: center;
  justify-content: center;
  background-color: var(--information-colors-base-default);
  color: var(--information-colors-text-default);
}
.badge--shadow {
  box-shadow: var(--shadows-tint-2);
}
.badge--circle {
  border-radius: var(--corner-radius-circle);
}
.badge--circle.badge--large {
  width: 16px;
  height: 16px;
}
.badge--circle.badge--small {
  width: 12px;
  height: 12px;
}
.badge--rectangle.badge--large {
  width: 36px;
  height: 16px;
  border-radius: var(--corner-radius-r16);
}
.badge--rectangle.badge--small {
  width: 28px;
  height: 12px;
  border-radius: var(--corner-radius-r12);
}
.badge--skin-crown {
  background-color: var(--absolute-black-colors-base-default);
  color: var(--warning-colors-base-default);
}
.badge--skin-plus {
  background-color: var(--monetization-plus-colors-base-default);
  color: var(--monetization-plus-colors-text-default);
}
.badge--skin-pro {
  color: var(--monetization-pro-colors-text-default);
}
.badge--skin-live {
  background-color: var(--success-colors-base-default);
  color: var(--success-colors-text-default);
}
.badge--skin-ultra {
  background-color: var(--monetization-ultra-colors-base-default);
  color: var(--monetization-ultra-colors-text-default);
}
.badge__icon {
  display: block;
}
.badge__icon > path:not([fill]) {
  fill: currentColor;
}
.badge__icon--circle-large {
  width: 10px;
  height: 10px;
}
.badge__icon--circle-small {
  width: 8px;
  height: 8px;
}
.badge__icon--rectangle-large {
  width: 32px;
  height: 16px;
}
.badge__icon--rectangle-small {
  width: 24px;
  height: 12px;
}
.suggestion-menu-v2 {
  max-height: var(--smv2-max-height, 200px);
  min-width: var(--smv2-min-width, auto);
  background-color: var(--background-colors-popover);
  border: 1px solid var(--control-colors-border-default);
  border-radius: var(--corner-radius-r8);
  overflow: auto;
  padding: var(--spacings-s12);
}
@media (pointer: fine) {
  .suggestion-menu-v2::-webkit-scrollbar {
    width: 4px;
  }
  .suggestion-menu-v2::-webkit-scrollbar-track {
    border-radius: var(--corner-radius-r4);
    background-color: transparent;
  }
  .suggestion-menu-v2::-webkit-scrollbar-thumb {
    border-radius: var(--corner-radius-r4);
    background-color: var(--background-colors-border);
  }
  .suggestion-menu-v2::-webkit-scrollbar-corner {
    background: transparent;
  }
}
@supports (-moz-appearance: none) {
  .suggestion-menu-v2 {
    scrollbar-color: var(--background-colors-border) transparent;
    scrollbar-width: thin;
  }
}
@media (pointer: coarse) {
  .suggestion-menu-v2::-webkit-scrollbar {
    display: none;
  }
}
.suggestion-menu-v2--small {
  border-width: 1px;
  border-radius: var(--corner-radius-r8);
}
.suggestion-menu-v2--disabled {
  opacity: var(--states-disabled);
  pointer-events: none;
}
.base-floating-container {
  position: relative;
  border: 1px solid var(--container-border-color);
  background-color: var(--container-background-color);
}
.base-floating-container--transform-start {
  transform: translateX(10px);
}
.base-floating-container--transform-end {
  transform: translateX(-10px);
}
.base-floating-container--transform-default {
  transform: translateX(0px);
}
.base-floating-container__indicator {
  display: inline-block;
  position: absolute;
  width: 20px;
  height: 14px;
}
.base-floating-container__indicator > path:nth-child(1) {
  fill: var(--container-background-color);
}
.base-floating-container__indicator > path:nth-child(2) {
  fill: var(--container-border-color);
}
.button {
  display: inline-flex;
  vertical-align: top;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  transition-property: background-color, border, color;
  transition-timing-function: var(--easings-ease);
  transition-duration: var(--timings-default);
}
.button--large {
  height: 40px;
  padding-block: var(--spacings-s10);
  padding-inline: var(--spacings-s10);
  border-radius: var(--corner-radius-r20);
  column-gap: var(--spacings-s2);
  font-weight: 600;
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.button--small {
  height: 32px;
  padding-block: var(--spacings-s6);
  padding-inline: var(--spacings-s6);
  border-radius: var(--corner-radius-r16);
  column-gap: var(--spacings-s2);
  font-weight: 600;
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.button--outline {
  border-style: solid;
  border-width: 1px;
}
.button--outline.button--small {
  border-width: 1px;
}
.button--no-border {
  border: none;
}
.button--center-icon {
  padding: 0;
  font-size: 0;
  border-radius: var(--corner-radius-circle);
}
.button--center-icon.button--large:not(.button--center-icon-full-width) {
  width: 40px;
  min-width: 40px;
}
.button--center-icon.button--small:not(.button--center-icon-full-width) {
  width: 32px;
  min-width: 32px;
}
.button--center-icon-full-width.button--large {
  border-radius: var(--corner-radius-r20);
}
.button--center-icon-full-width.button--small {
  border-radius: var(--corner-radius-r16);
}
.button--full-width {
  width: 100%;
}
.button--skin-primary.button--default-state {
  background-color: var(--primary-colors-base-default);
  color: var(--primary-colors-text-default);
}
.button--skin-primary.button--interactive:hover, .button--skin-primary.button--interactive:active {
  background-color: var(--primary-colors-base-action);
  color: var(--primary-colors-text-action);
}
.button--skin-primary.button--active-state {
  background-color: var(--primary-colors-base-active);
  color: var(--primary-colors-text-active);
}
.button--skin-primary.button--active-interactive:hover, .button--skin-primary.button--active-interactive:active {
  background-color: var(--primary-colors-base-active-action);
  color: var(--primary-colors-text-action);
}
.button--skin-primary.button--loading .button__loading-icon {
  color: var(--primary-colors-text-default);
}
.button--skin-primary.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--primary-colors-base-default);
  color: var(--primary-colors-base-default);
}
.button--skin-primary.button--outline.button--interactive:hover, .button--skin-primary.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--primary-colors-base-action);
  color: var(--primary-colors-base-action);
}
.button--skin-primary.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--primary-colors-base-active);
  color: var(--primary-colors-base-active);
}
.button--skin-primary.button--outline.button--active-interactive:hover, .button--skin-primary.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--primary-colors-base-active-action);
  color: var(--primary-colors-base-active-action);
}
.button--skin-primary.button--outline.button--loading .button__loading-icon {
  color: var(--primary-colors-base-default);
}
.button--skin-primary.button--text.button--default-state {
  background-color: transparent;
  color: var(--primary-colors-base-default);
}
.button--skin-primary.button--text.button--interactive:hover, .button--skin-primary.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--primary-colors-base-action);
}
.button--skin-primary.button--text.button--active-state {
  background-color: transparent;
  color: var(--primary-colors-base-active);
}
.button--skin-primary.button--text.button--active-interactive:hover, .button--skin-primary.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--primary-colors-base-active-action);
}
.button--skin-primary.button--text.button--loading .button__loading-icon {
  color: var(--primary-colors-base-default);
}
.button--skin-neutral.button--default-state {
  background-color: var(--neutral-colors-base-default);
  color: var(--neutral-colors-text-default);
}
.button--skin-neutral.button--interactive:hover, .button--skin-neutral.button--interactive:active {
  background-color: var(--neutral-colors-base-action);
  color: var(--neutral-colors-text-action);
}
.button--skin-neutral.button--active-state {
  background-color: var(--neutral-colors-base-active);
  color: var(--neutral-colors-text-active);
}
.button--skin-neutral.button--active-interactive:hover, .button--skin-neutral.button--active-interactive:active {
  background-color: var(--neutral-colors-base-active-action);
  color: var(--neutral-colors-text-action);
}
.button--skin-neutral.button--loading .button__loading-icon {
  color: var(--neutral-colors-text-default);
}
.button--skin-neutral.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--neutral-colors-base-default);
  color: var(--neutral-colors-base-default);
}
.button--skin-neutral.button--outline.button--interactive:hover, .button--skin-neutral.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--neutral-colors-base-action);
  color: var(--neutral-colors-base-action);
}
.button--skin-neutral.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--neutral-colors-base-active);
  color: var(--neutral-colors-base-active);
}
.button--skin-neutral.button--outline.button--active-interactive:hover, .button--skin-neutral.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--neutral-colors-base-active-action);
  color: var(--neutral-colors-base-active-action);
}
.button--skin-neutral.button--outline.button--loading .button__loading-icon {
  color: var(--neutral-colors-base-default);
}
.button--skin-neutral.button--text.button--default-state {
  background-color: transparent;
  color: var(--neutral-colors-base-default);
}
.button--skin-neutral.button--text.button--interactive:hover, .button--skin-neutral.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--neutral-colors-base-action);
}
.button--skin-neutral.button--text.button--active-state {
  background-color: transparent;
  color: var(--neutral-colors-base-active);
}
.button--skin-neutral.button--text.button--active-interactive:hover, .button--skin-neutral.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--neutral-colors-base-active-action);
}
.button--skin-neutral.button--text.button--loading .button__loading-icon {
  color: var(--neutral-colors-base-default);
}
.button--skin-plus.button--default-state {
  background-color: var(--monetization-plus-colors-base-default);
  color: var(--monetization-plus-colors-text-default);
}
.button--skin-plus.button--interactive:hover, .button--skin-plus.button--interactive:active {
  background-color: var(--monetization-plus-colors-base-action);
  color: var(--monetization-plus-colors-text-action);
}
.button--skin-plus.button--active-state {
  background-color: var(--monetization-plus-colors-base-active);
  color: var(--monetization-plus-colors-text-active);
}
.button--skin-plus.button--active-interactive:hover, .button--skin-plus.button--active-interactive:active {
  background-color: var(--monetization-plus-colors-base-active-action);
  color: var(--monetization-plus-colors-text-action);
}
.button--skin-plus.button--loading .button__loading-icon {
  color: var(--monetization-plus-colors-text-default);
}
.button--skin-plus.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--monetization-plus-colors-base-default);
  color: var(--monetization-plus-colors-base-default);
}
.button--skin-plus.button--outline.button--interactive:hover, .button--skin-plus.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--monetization-plus-colors-base-action);
  color: var(--monetization-plus-colors-base-action);
}
.button--skin-plus.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--monetization-plus-colors-base-active);
  color: var(--monetization-plus-colors-base-active);
}
.button--skin-plus.button--outline.button--active-interactive:hover, .button--skin-plus.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--monetization-plus-colors-base-active-action);
  color: var(--monetization-plus-colors-base-active-action);
}
.button--skin-plus.button--outline.button--loading .button__loading-icon {
  color: var(--monetization-plus-colors-base-default);
}
.button--skin-plus.button--text.button--default-state {
  background-color: transparent;
  color: var(--monetization-plus-colors-base-default);
}
.button--skin-plus.button--text.button--interactive:hover, .button--skin-plus.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--monetization-plus-colors-base-action);
}
.button--skin-plus.button--text.button--active-state {
  background-color: transparent;
  color: var(--monetization-plus-colors-base-active);
}
.button--skin-plus.button--text.button--active-interactive:hover, .button--skin-plus.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--monetization-plus-colors-base-active-action);
}
.button--skin-plus.button--text.button--loading .button__loading-icon {
  color: var(--monetization-plus-colors-base-default);
}
.button--skin-pro.button--default-state {
  background-color: var(--monetization-pro-colors-base-default);
  color: var(--monetization-pro-colors-text-default);
}
.button--skin-pro.button--interactive:hover, .button--skin-pro.button--interactive:active {
  background-color: var(--monetization-pro-colors-base-action);
  color: var(--monetization-pro-colors-text-action);
}
.button--skin-pro.button--active-state {
  background-color: var(--monetization-pro-colors-base-active);
  color: var(--monetization-pro-colors-text-active);
}
.button--skin-pro.button--active-interactive:hover, .button--skin-pro.button--active-interactive:active {
  background-color: var(--monetization-pro-colors-base-active-action);
  color: var(--monetization-pro-colors-text-action);
}
.button--skin-pro.button--loading .button__loading-icon {
  color: var(--monetization-pro-colors-text-default);
}
.button--skin-pro.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--monetization-pro-colors-base-default);
  color: var(--monetization-pro-colors-base-default);
}
.button--skin-pro.button--outline.button--interactive:hover, .button--skin-pro.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--monetization-pro-colors-base-action);
  color: var(--monetization-pro-colors-base-action);
}
.button--skin-pro.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--monetization-pro-colors-base-active);
  color: var(--monetization-pro-colors-base-active);
}
.button--skin-pro.button--outline.button--active-interactive:hover, .button--skin-pro.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--monetization-pro-colors-base-active-action);
  color: var(--monetization-pro-colors-base-active-action);
}
.button--skin-pro.button--outline.button--loading .button__loading-icon {
  color: var(--monetization-pro-colors-base-default);
}
.button--skin-pro.button--text.button--default-state {
  background-color: transparent;
  color: var(--monetization-pro-colors-base-default);
}
.button--skin-pro.button--text.button--interactive:hover, .button--skin-pro.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--monetization-pro-colors-base-action);
}
.button--skin-pro.button--text.button--active-state {
  background-color: transparent;
  color: var(--monetization-pro-colors-base-active);
}
.button--skin-pro.button--text.button--active-interactive:hover, .button--skin-pro.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--monetization-pro-colors-base-active-action);
}
.button--skin-pro.button--text.button--loading .button__loading-icon {
  color: var(--monetization-pro-colors-base-default);
}
.button--skin-ultra.button--default-state {
  background-color: var(--monetization-ultra-colors-base-default);
  color: var(--monetization-ultra-colors-text-default);
}
.button--skin-ultra.button--interactive:hover, .button--skin-ultra.button--interactive:active {
  background-color: var(--monetization-ultra-colors-base-action);
  color: var(--monetization-ultra-colors-text-action);
}
.button--skin-ultra.button--active-state {
  background-color: var(--monetization-ultra-colors-base-active);
  color: var(--monetization-ultra-colors-text-active);
}
.button--skin-ultra.button--active-interactive:hover, .button--skin-ultra.button--active-interactive:active {
  background-color: var(--monetization-ultra-colors-base-active-action);
  color: var(--monetization-ultra-colors-text-action);
}
.button--skin-ultra.button--loading .button__loading-icon {
  color: var(--monetization-ultra-colors-text-default);
}
.button--skin-ultra.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--monetization-ultra-colors-base-default);
  color: var(--monetization-ultra-colors-base-default);
}
.button--skin-ultra.button--outline.button--interactive:hover, .button--skin-ultra.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--monetization-ultra-colors-base-action);
  color: var(--monetization-ultra-colors-base-action);
}
.button--skin-ultra.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--monetization-ultra-colors-base-active);
  color: var(--monetization-ultra-colors-base-active);
}
.button--skin-ultra.button--outline.button--active-interactive:hover, .button--skin-ultra.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--monetization-ultra-colors-base-active-action);
  color: var(--monetization-ultra-colors-base-active-action);
}
.button--skin-ultra.button--outline.button--loading .button__loading-icon {
  color: var(--monetization-ultra-colors-base-default);
}
.button--skin-ultra.button--text.button--default-state {
  background-color: transparent;
  color: var(--monetization-ultra-colors-base-default);
}
.button--skin-ultra.button--text.button--interactive:hover, .button--skin-ultra.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--monetization-ultra-colors-base-action);
}
.button--skin-ultra.button--text.button--active-state {
  background-color: transparent;
  color: var(--monetization-ultra-colors-base-active);
}
.button--skin-ultra.button--text.button--active-interactive:hover, .button--skin-ultra.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--monetization-ultra-colors-base-active-action);
}
.button--skin-ultra.button--text.button--loading .button__loading-icon {
  color: var(--monetization-ultra-colors-base-default);
}
.button--skin-success.button--default-state {
  background-color: var(--success-colors-base-default);
  color: var(--success-colors-text-default);
}
.button--skin-success.button--interactive:hover, .button--skin-success.button--interactive:active {
  background-color: var(--success-colors-base-action);
  color: var(--success-colors-text-action);
}
.button--skin-success.button--active-state {
  background-color: var(--success-colors-base-active);
  color: var(--success-colors-text-active);
}
.button--skin-success.button--active-interactive:hover, .button--skin-success.button--active-interactive:active {
  background-color: var(--success-colors-base-active-action);
  color: var(--success-colors-text-action);
}
.button--skin-success.button--loading .button__loading-icon {
  color: var(--success-colors-text-default);
}
.button--skin-success.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--success-colors-base-default);
  color: var(--success-colors-base-default);
}
.button--skin-success.button--outline.button--interactive:hover, .button--skin-success.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--success-colors-base-action);
  color: var(--success-colors-base-action);
}
.button--skin-success.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--success-colors-base-active);
  color: var(--success-colors-base-active);
}
.button--skin-success.button--outline.button--active-interactive:hover, .button--skin-success.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--success-colors-base-active-action);
  color: var(--success-colors-base-active-action);
}
.button--skin-success.button--outline.button--loading .button__loading-icon {
  color: var(--success-colors-base-default);
}
.button--skin-success.button--text.button--default-state {
  background-color: transparent;
  color: var(--success-colors-base-default);
}
.button--skin-success.button--text.button--interactive:hover, .button--skin-success.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--success-colors-base-action);
}
.button--skin-success.button--text.button--active-state {
  background-color: transparent;
  color: var(--success-colors-base-active);
}
.button--skin-success.button--text.button--active-interactive:hover, .button--skin-success.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--success-colors-base-active-action);
}
.button--skin-success.button--text.button--loading .button__loading-icon {
  color: var(--success-colors-base-default);
}
.button--skin-warning.button--default-state {
  background-color: var(--warning-colors-base-default);
  color: var(--warning-colors-text-default);
}
.button--skin-warning.button--interactive:hover, .button--skin-warning.button--interactive:active {
  background-color: var(--warning-colors-base-action);
  color: var(--warning-colors-text-action);
}
.button--skin-warning.button--active-state {
  background-color: var(--warning-colors-base-active);
  color: var(--warning-colors-text-active);
}
.button--skin-warning.button--active-interactive:hover, .button--skin-warning.button--active-interactive:active {
  background-color: var(--warning-colors-base-active-action);
  color: var(--warning-colors-text-action);
}
.button--skin-warning.button--loading .button__loading-icon {
  color: var(--warning-colors-text-default);
}
.button--skin-warning.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--warning-colors-base-default);
  color: var(--warning-colors-base-default);
}
.button--skin-warning.button--outline.button--interactive:hover, .button--skin-warning.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--warning-colors-base-action);
  color: var(--warning-colors-base-action);
}
.button--skin-warning.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--warning-colors-base-active);
  color: var(--warning-colors-base-active);
}
.button--skin-warning.button--outline.button--active-interactive:hover, .button--skin-warning.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--warning-colors-base-active-action);
  color: var(--warning-colors-base-active-action);
}
.button--skin-warning.button--outline.button--loading .button__loading-icon {
  color: var(--warning-colors-base-default);
}
.button--skin-warning.button--text.button--default-state {
  background-color: transparent;
  color: var(--warning-colors-base-default);
}
.button--skin-warning.button--text.button--interactive:hover, .button--skin-warning.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--warning-colors-base-action);
}
.button--skin-warning.button--text.button--active-state {
  background-color: transparent;
  color: var(--warning-colors-base-active);
}
.button--skin-warning.button--text.button--active-interactive:hover, .button--skin-warning.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--warning-colors-base-active-action);
}
.button--skin-warning.button--text.button--loading .button__loading-icon {
  color: var(--warning-colors-base-default);
}
.button--skin-error.button--default-state {
  background-color: var(--error-colors-base-default);
  color: var(--error-colors-text-default);
}
.button--skin-error.button--interactive:hover, .button--skin-error.button--interactive:active {
  background-color: var(--error-colors-base-action);
  color: var(--error-colors-text-action);
}
.button--skin-error.button--active-state {
  background-color: var(--error-colors-base-active);
  color: var(--error-colors-text-active);
}
.button--skin-error.button--active-interactive:hover, .button--skin-error.button--active-interactive:active {
  background-color: var(--error-colors-base-active-action);
  color: var(--error-colors-text-action);
}
.button--skin-error.button--loading .button__loading-icon {
  color: var(--error-colors-text-default);
}
.button--skin-error.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--error-colors-base-default);
  color: var(--error-colors-base-default);
}
.button--skin-error.button--outline.button--interactive:hover, .button--skin-error.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--error-colors-base-action);
  color: var(--error-colors-base-action);
}
.button--skin-error.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--error-colors-base-active);
  color: var(--error-colors-base-active);
}
.button--skin-error.button--outline.button--active-interactive:hover, .button--skin-error.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--error-colors-base-active-action);
  color: var(--error-colors-base-active-action);
}
.button--skin-error.button--outline.button--loading .button__loading-icon {
  color: var(--error-colors-base-default);
}
.button--skin-error.button--text.button--default-state {
  background-color: transparent;
  color: var(--error-colors-base-default);
}
.button--skin-error.button--text.button--interactive:hover, .button--skin-error.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--error-colors-base-action);
}
.button--skin-error.button--text.button--active-state {
  background-color: transparent;
  color: var(--error-colors-base-active);
}
.button--skin-error.button--text.button--active-interactive:hover, .button--skin-error.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--error-colors-base-active-action);
}
.button--skin-error.button--text.button--loading .button__loading-icon {
  color: var(--error-colors-base-default);
}
.button--skin-information.button--default-state {
  background-color: var(--information-colors-base-default);
  color: var(--information-colors-text-default);
}
.button--skin-information.button--interactive:hover, .button--skin-information.button--interactive:active {
  background-color: var(--information-colors-base-action);
  color: var(--information-colors-text-action);
}
.button--skin-information.button--active-state {
  background-color: var(--information-colors-base-active);
  color: var(--information-colors-text-active);
}
.button--skin-information.button--active-interactive:hover, .button--skin-information.button--active-interactive:active {
  background-color: var(--information-colors-base-active-action);
  color: var(--information-colors-text-action);
}
.button--skin-information.button--loading .button__loading-icon {
  color: var(--information-colors-text-default);
}
.button--skin-information.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--information-colors-base-default);
  color: var(--information-colors-base-default);
}
.button--skin-information.button--outline.button--interactive:hover, .button--skin-information.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--information-colors-base-action);
  color: var(--information-colors-base-action);
}
.button--skin-information.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--information-colors-base-active);
  color: var(--information-colors-base-active);
}
.button--skin-information.button--outline.button--active-interactive:hover, .button--skin-information.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--information-colors-base-active-action);
  color: var(--information-colors-base-active-action);
}
.button--skin-information.button--outline.button--loading .button__loading-icon {
  color: var(--information-colors-base-default);
}
.button--skin-information.button--text.button--default-state {
  background-color: transparent;
  color: var(--information-colors-base-default);
}
.button--skin-information.button--text.button--interactive:hover, .button--skin-information.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--information-colors-base-action);
}
.button--skin-information.button--text.button--active-state {
  background-color: transparent;
  color: var(--information-colors-base-active);
}
.button--skin-information.button--text.button--active-interactive:hover, .button--skin-information.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--information-colors-base-active-action);
}
.button--skin-information.button--text.button--loading .button__loading-icon {
  color: var(--information-colors-base-default);
}
.button--skin-positive.button--default-state {
  background-color: var(--positive-colors-base-default);
  color: var(--positive-colors-text-default);
}
.button--skin-positive.button--interactive:hover, .button--skin-positive.button--interactive:active {
  background-color: var(--positive-colors-base-action);
  color: var(--positive-colors-text-action);
}
.button--skin-positive.button--active-state {
  background-color: var(--positive-colors-base-active);
  color: var(--positive-colors-text-active);
}
.button--skin-positive.button--active-interactive:hover, .button--skin-positive.button--active-interactive:active {
  background-color: var(--positive-colors-base-active-action);
  color: var(--positive-colors-text-action);
}
.button--skin-positive.button--loading .button__loading-icon {
  color: var(--positive-colors-text-default);
}
.button--skin-positive.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--positive-colors-base-default);
  color: var(--positive-colors-base-default);
}
.button--skin-positive.button--outline.button--interactive:hover, .button--skin-positive.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--positive-colors-base-action);
  color: var(--positive-colors-base-action);
}
.button--skin-positive.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--positive-colors-base-active);
  color: var(--positive-colors-base-active);
}
.button--skin-positive.button--outline.button--active-interactive:hover, .button--skin-positive.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--positive-colors-base-active-action);
  color: var(--positive-colors-base-active-action);
}
.button--skin-positive.button--outline.button--loading .button__loading-icon {
  color: var(--positive-colors-base-default);
}
.button--skin-positive.button--text.button--default-state {
  background-color: transparent;
  color: var(--positive-colors-base-default);
}
.button--skin-positive.button--text.button--interactive:hover, .button--skin-positive.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--positive-colors-base-action);
}
.button--skin-positive.button--text.button--active-state {
  background-color: transparent;
  color: var(--positive-colors-base-active);
}
.button--skin-positive.button--text.button--active-interactive:hover, .button--skin-positive.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--positive-colors-base-active-action);
}
.button--skin-positive.button--text.button--loading .button__loading-icon {
  color: var(--positive-colors-base-default);
}
.button--skin-negative.button--default-state {
  background-color: var(--negative-colors-base-default);
  color: var(--negative-colors-text-default);
}
.button--skin-negative.button--interactive:hover, .button--skin-negative.button--interactive:active {
  background-color: var(--negative-colors-base-action);
  color: var(--negative-colors-text-action);
}
.button--skin-negative.button--active-state {
  background-color: var(--negative-colors-base-active);
  color: var(--negative-colors-text-active);
}
.button--skin-negative.button--active-interactive:hover, .button--skin-negative.button--active-interactive:active {
  background-color: var(--negative-colors-base-active-action);
  color: var(--negative-colors-text-action);
}
.button--skin-negative.button--loading .button__loading-icon {
  color: var(--negative-colors-text-default);
}
.button--skin-negative.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--negative-colors-base-default);
  color: var(--negative-colors-base-default);
}
.button--skin-negative.button--outline.button--interactive:hover, .button--skin-negative.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--negative-colors-base-action);
  color: var(--negative-colors-base-action);
}
.button--skin-negative.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--negative-colors-base-active);
  color: var(--negative-colors-base-active);
}
.button--skin-negative.button--outline.button--active-interactive:hover, .button--skin-negative.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--negative-colors-base-active-action);
  color: var(--negative-colors-base-active-action);
}
.button--skin-negative.button--outline.button--loading .button__loading-icon {
  color: var(--negative-colors-base-default);
}
.button--skin-negative.button--text.button--default-state {
  background-color: transparent;
  color: var(--negative-colors-base-default);
}
.button--skin-negative.button--text.button--interactive:hover, .button--skin-negative.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--negative-colors-base-action);
}
.button--skin-negative.button--text.button--active-state {
  background-color: transparent;
  color: var(--negative-colors-base-active);
}
.button--skin-negative.button--text.button--active-interactive:hover, .button--skin-negative.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--negative-colors-base-active-action);
}
.button--skin-negative.button--text.button--loading .button__loading-icon {
  color: var(--negative-colors-base-default);
}
.button--skin-black.button--default-state {
  background-color: var(--absolute-black-colors-base-default);
  color: var(--absolute-black-colors-text-default);
}
.button--skin-black.button--interactive:hover, .button--skin-black.button--interactive:active {
  background-color: var(--absolute-black-colors-base-action);
  color: var(--absolute-black-colors-text-action);
}
.button--skin-black.button--active-state {
  background-color: var(--absolute-black-colors-base-active);
  color: var(--absolute-black-colors-text-active);
}
.button--skin-black.button--active-interactive:hover, .button--skin-black.button--active-interactive:active {
  background-color: var(--absolute-black-colors-base-active-action);
  color: var(--absolute-black-colors-text-action);
}
.button--skin-black.button--loading .button__loading-icon {
  color: var(--absolute-black-colors-text-default);
}
.button--skin-black.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--absolute-black-colors-base-default);
  color: var(--absolute-black-colors-base-default);
}
.button--skin-black.button--outline.button--interactive:hover, .button--skin-black.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--absolute-black-colors-base-action);
  color: var(--absolute-black-colors-base-action);
}
.button--skin-black.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--absolute-black-colors-base-active);
  color: var(--absolute-black-colors-base-active);
}
.button--skin-black.button--outline.button--active-interactive:hover, .button--skin-black.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--absolute-black-colors-base-active-action);
  color: var(--absolute-black-colors-base-active-action);
}
.button--skin-black.button--outline.button--loading .button__loading-icon {
  color: var(--absolute-black-colors-base-default);
}
.button--skin-black.button--text.button--default-state {
  background-color: transparent;
  color: var(--absolute-black-colors-base-default);
}
.button--skin-black.button--text.button--interactive:hover, .button--skin-black.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--absolute-black-colors-base-action);
}
.button--skin-black.button--text.button--active-state {
  background-color: transparent;
  color: var(--absolute-black-colors-base-active);
}
.button--skin-black.button--text.button--active-interactive:hover, .button--skin-black.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--absolute-black-colors-base-active-action);
}
.button--skin-black.button--text.button--loading .button__loading-icon {
  color: var(--absolute-black-colors-base-default);
}
.button--skin-white.button--default-state {
  background-color: var(--absolute-white-colors-base-default);
  color: var(--absolute-white-colors-text-default);
}
.button--skin-white.button--interactive:hover, .button--skin-white.button--interactive:active {
  background-color: var(--absolute-white-colors-base-action);
  color: var(--absolute-white-colors-text-action);
}
.button--skin-white.button--active-state {
  background-color: var(--absolute-white-colors-base-active);
  color: var(--absolute-white-colors-text-active);
}
.button--skin-white.button--active-interactive:hover, .button--skin-white.button--active-interactive:active {
  background-color: var(--absolute-white-colors-base-active-action);
  color: var(--absolute-white-colors-text-action);
}
.button--skin-white.button--loading .button__loading-icon {
  color: var(--absolute-white-colors-text-default);
}
.button--skin-white.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--absolute-white-colors-base-default);
  color: var(--absolute-white-colors-base-default);
}
.button--skin-white.button--outline.button--interactive:hover, .button--skin-white.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--absolute-white-colors-base-action);
  color: var(--absolute-white-colors-base-action);
}
.button--skin-white.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--absolute-white-colors-base-active);
  color: var(--absolute-white-colors-base-active);
}
.button--skin-white.button--outline.button--active-interactive:hover, .button--skin-white.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--absolute-white-colors-base-active-action);
  color: var(--absolute-white-colors-base-active-action);
}
.button--skin-white.button--outline.button--loading .button__loading-icon {
  color: var(--absolute-white-colors-base-default);
}
.button--skin-white.button--text.button--default-state {
  background-color: transparent;
  color: var(--absolute-white-colors-base-default);
}
.button--skin-white.button--text.button--interactive:hover, .button--skin-white.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--absolute-white-colors-base-action);
}
.button--skin-white.button--text.button--active-state {
  background-color: transparent;
  color: var(--absolute-white-colors-base-active);
}
.button--skin-white.button--text.button--active-interactive:hover, .button--skin-white.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--absolute-white-colors-base-active-action);
}
.button--skin-white.button--text.button--loading .button__loading-icon {
  color: var(--absolute-white-colors-base-default);
}
.button--skin-facebook.button--default-state {
  background-color: var(--facebook-colors-base-default);
  color: var(--facebook-colors-text-default);
}
.button--skin-facebook.button--interactive:hover, .button--skin-facebook.button--interactive:active {
  background-color: var(--facebook-colors-base-action);
  color: var(--facebook-colors-text-action);
}
.button--skin-facebook.button--active-state {
  background-color: var(--facebook-colors-base-active);
  color: var(--facebook-colors-text-active);
}
.button--skin-facebook.button--active-interactive:hover, .button--skin-facebook.button--active-interactive:active {
  background-color: var(--facebook-colors-base-active-action);
  color: var(--facebook-colors-text-action);
}
.button--skin-facebook.button--loading .button__loading-icon {
  color: var(--facebook-colors-text-default);
}
.button--skin-facebook.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--facebook-colors-base-default);
  color: var(--facebook-colors-base-default);
}
.button--skin-facebook.button--outline.button--interactive:hover, .button--skin-facebook.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--facebook-colors-base-action);
  color: var(--facebook-colors-base-action);
}
.button--skin-facebook.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--facebook-colors-base-active);
  color: var(--facebook-colors-base-active);
}
.button--skin-facebook.button--outline.button--active-interactive:hover, .button--skin-facebook.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--facebook-colors-base-active-action);
  color: var(--facebook-colors-base-active-action);
}
.button--skin-facebook.button--outline.button--loading .button__loading-icon {
  color: var(--facebook-colors-base-default);
}
.button--skin-facebook.button--text.button--default-state {
  background-color: transparent;
  color: var(--facebook-colors-base-default);
}
.button--skin-facebook.button--text.button--interactive:hover, .button--skin-facebook.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--facebook-colors-base-action);
}
.button--skin-facebook.button--text.button--active-state {
  background-color: transparent;
  color: var(--facebook-colors-base-active);
}
.button--skin-facebook.button--text.button--active-interactive:hover, .button--skin-facebook.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--facebook-colors-base-active-action);
}
.button--skin-facebook.button--text.button--loading .button__loading-icon {
  color: var(--facebook-colors-base-default);
}
.button--skin-google.button--default-state {
  background-color: var(--google-colors-base-default);
  color: var(--google-colors-text-default);
}
.button--skin-google.button--interactive:hover, .button--skin-google.button--interactive:active {
  background-color: var(--google-colors-base-action);
  color: var(--google-colors-text-action);
}
.button--skin-google.button--active-state {
  background-color: var(--google-colors-base-active);
  color: var(--google-colors-text-active);
}
.button--skin-google.button--active-interactive:hover, .button--skin-google.button--active-interactive:active {
  background-color: var(--google-colors-base-active-action);
  color: var(--google-colors-text-action);
}
.button--skin-google.button--loading .button__loading-icon {
  color: var(--google-colors-text-default);
}
.button--skin-google.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--google-colors-base-default);
  color: var(--google-colors-base-default);
}
.button--skin-google.button--outline.button--interactive:hover, .button--skin-google.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--google-colors-base-action);
  color: var(--google-colors-base-action);
}
.button--skin-google.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--google-colors-base-active);
  color: var(--google-colors-base-active);
}
.button--skin-google.button--outline.button--active-interactive:hover, .button--skin-google.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--google-colors-base-active-action);
  color: var(--google-colors-base-active-action);
}
.button--skin-google.button--outline.button--loading .button__loading-icon {
  color: var(--google-colors-base-default);
}
.button--skin-google.button--text.button--default-state {
  background-color: transparent;
  color: var(--google-colors-base-default);
}
.button--skin-google.button--text.button--interactive:hover, .button--skin-google.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--google-colors-base-action);
}
.button--skin-google.button--text.button--active-state {
  background-color: transparent;
  color: var(--google-colors-base-active);
}
.button--skin-google.button--text.button--active-interactive:hover, .button--skin-google.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--google-colors-base-active-action);
}
.button--skin-google.button--text.button--loading .button__loading-icon {
  color: var(--google-colors-base-default);
}
.button--skin-apple.button--default-state {
  background-color: var(--apple-colors-base-default);
  color: var(--apple-colors-text-default);
}
.button--skin-apple.button--interactive:hover, .button--skin-apple.button--interactive:active {
  background-color: var(--apple-colors-base-action);
  color: var(--apple-colors-text-action);
}
.button--skin-apple.button--active-state {
  background-color: var(--apple-colors-base-active);
  color: var(--apple-colors-text-active);
}
.button--skin-apple.button--active-interactive:hover, .button--skin-apple.button--active-interactive:active {
  background-color: var(--apple-colors-base-active-action);
  color: var(--apple-colors-text-action);
}
.button--skin-apple.button--loading .button__loading-icon {
  color: var(--apple-colors-text-default);
}
.button--skin-apple.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--apple-colors-base-default);
  color: var(--apple-colors-base-default);
}
.button--skin-apple.button--outline.button--interactive:hover, .button--skin-apple.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--apple-colors-base-action);
  color: var(--apple-colors-base-action);
}
.button--skin-apple.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--apple-colors-base-active);
  color: var(--apple-colors-base-active);
}
.button--skin-apple.button--outline.button--active-interactive:hover, .button--skin-apple.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--apple-colors-base-active-action);
  color: var(--apple-colors-base-active-action);
}
.button--skin-apple.button--outline.button--loading .button__loading-icon {
  color: var(--apple-colors-base-default);
}
.button--skin-apple.button--text.button--default-state {
  background-color: transparent;
  color: var(--apple-colors-base-default);
}
.button--skin-apple.button--text.button--interactive:hover, .button--skin-apple.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--apple-colors-base-action);
}
.button--skin-apple.button--text.button--active-state {
  background-color: transparent;
  color: var(--apple-colors-base-active);
}
.button--skin-apple.button--text.button--active-interactive:hover, .button--skin-apple.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--apple-colors-base-active-action);
}
.button--skin-apple.button--text.button--loading .button__loading-icon {
  color: var(--apple-colors-base-default);
}
.button--skin-snapchat.button--default-state {
  background-color: var(--snapchat-colors-base-default);
  color: var(--snapchat-colors-text-default);
}
.button--skin-snapchat.button--interactive:hover, .button--skin-snapchat.button--interactive:active {
  background-color: var(--snapchat-colors-base-action);
  color: var(--snapchat-colors-text-action);
}
.button--skin-snapchat.button--active-state {
  background-color: var(--snapchat-colors-base-active);
  color: var(--snapchat-colors-text-active);
}
.button--skin-snapchat.button--active-interactive:hover, .button--skin-snapchat.button--active-interactive:active {
  background-color: var(--snapchat-colors-base-active-action);
  color: var(--snapchat-colors-text-action);
}
.button--skin-snapchat.button--loading .button__loading-icon {
  color: var(--snapchat-colors-text-default);
}
.button--skin-snapchat.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--snapchat-colors-base-default);
  color: var(--snapchat-colors-base-default);
}
.button--skin-snapchat.button--outline.button--interactive:hover, .button--skin-snapchat.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--snapchat-colors-base-action);
  color: var(--snapchat-colors-base-action);
}
.button--skin-snapchat.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--snapchat-colors-base-active);
  color: var(--snapchat-colors-base-active);
}
.button--skin-snapchat.button--outline.button--active-interactive:hover, .button--skin-snapchat.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--snapchat-colors-base-active-action);
  color: var(--snapchat-colors-base-active-action);
}
.button--skin-snapchat.button--outline.button--loading .button__loading-icon {
  color: var(--snapchat-colors-base-default);
}
.button--skin-snapchat.button--text.button--default-state {
  background-color: transparent;
  color: var(--snapchat-colors-base-default);
}
.button--skin-snapchat.button--text.button--interactive:hover, .button--skin-snapchat.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--snapchat-colors-base-action);
}
.button--skin-snapchat.button--text.button--active-state {
  background-color: transparent;
  color: var(--snapchat-colors-base-active);
}
.button--skin-snapchat.button--text.button--active-interactive:hover, .button--skin-snapchat.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--snapchat-colors-base-active-action);
}
.button--skin-snapchat.button--text.button--loading .button__loading-icon {
  color: var(--snapchat-colors-base-default);
}
.button--skin-kakao.button--default-state {
  background-color: var(--kakao-colors-base-default);
  color: var(--kakao-colors-text-default);
}
.button--skin-kakao.button--interactive:hover, .button--skin-kakao.button--interactive:active {
  background-color: var(--kakao-colors-base-action);
  color: var(--kakao-colors-text-action);
}
.button--skin-kakao.button--active-state {
  background-color: var(--kakao-colors-base-active);
  color: var(--kakao-colors-text-active);
}
.button--skin-kakao.button--active-interactive:hover, .button--skin-kakao.button--active-interactive:active {
  background-color: var(--kakao-colors-base-active-action);
  color: var(--kakao-colors-text-action);
}
.button--skin-kakao.button--loading .button__loading-icon {
  color: var(--kakao-colors-text-default);
}
.button--skin-kakao.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--kakao-colors-base-default);
  color: var(--kakao-colors-base-default);
}
.button--skin-kakao.button--outline.button--interactive:hover, .button--skin-kakao.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--kakao-colors-base-action);
  color: var(--kakao-colors-base-action);
}
.button--skin-kakao.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--kakao-colors-base-active);
  color: var(--kakao-colors-base-active);
}
.button--skin-kakao.button--outline.button--active-interactive:hover, .button--skin-kakao.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--kakao-colors-base-active-action);
  color: var(--kakao-colors-base-active-action);
}
.button--skin-kakao.button--outline.button--loading .button__loading-icon {
  color: var(--kakao-colors-base-default);
}
.button--skin-kakao.button--text.button--default-state {
  background-color: transparent;
  color: var(--kakao-colors-base-default);
}
.button--skin-kakao.button--text.button--interactive:hover, .button--skin-kakao.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--kakao-colors-base-action);
}
.button--skin-kakao.button--text.button--active-state {
  background-color: transparent;
  color: var(--kakao-colors-base-active);
}
.button--skin-kakao.button--text.button--active-interactive:hover, .button--skin-kakao.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--kakao-colors-base-active-action);
}
.button--skin-kakao.button--text.button--loading .button__loading-icon {
  color: var(--kakao-colors-base-default);
}
.button--skin-line.button--default-state {
  background-color: var(--line-colors-base-default);
  color: var(--line-colors-text-default);
}
.button--skin-line.button--interactive:hover, .button--skin-line.button--interactive:active {
  background-color: var(--line-colors-base-action);
  color: var(--line-colors-text-action);
}
.button--skin-line.button--active-state {
  background-color: var(--line-colors-base-active);
  color: var(--line-colors-text-active);
}
.button--skin-line.button--active-interactive:hover, .button--skin-line.button--active-interactive:active {
  background-color: var(--line-colors-base-active-action);
  color: var(--line-colors-text-action);
}
.button--skin-line.button--loading .button__loading-icon {
  color: var(--line-colors-text-default);
}
.button--skin-line.button--outline.button--default-state {
  background-color: transparent;
  border-color: var(--line-colors-base-default);
  color: var(--line-colors-base-default);
}
.button--skin-line.button--outline.button--interactive:hover, .button--skin-line.button--outline.button--interactive:active {
  background-color: transparent;
  border-color: var(--line-colors-base-action);
  color: var(--line-colors-base-action);
}
.button--skin-line.button--outline.button--active-state {
  background-color: transparent;
  border-color: var(--line-colors-base-active);
  color: var(--line-colors-base-active);
}
.button--skin-line.button--outline.button--active-interactive:hover, .button--skin-line.button--outline.button--active-interactive:active {
  background-color: transparent;
  border-color: var(--line-colors-base-active-action);
  color: var(--line-colors-base-active-action);
}
.button--skin-line.button--outline.button--loading .button__loading-icon {
  color: var(--line-colors-base-default);
}
.button--skin-line.button--text.button--default-state {
  background-color: transparent;
  color: var(--line-colors-base-default);
}
.button--skin-line.button--text.button--interactive:hover, .button--skin-line.button--text.button--interactive:active {
  background-color: transparent;
  color: var(--line-colors-base-action);
}
.button--skin-line.button--text.button--active-state {
  background-color: transparent;
  color: var(--line-colors-base-active);
}
.button--skin-line.button--text.button--active-interactive:hover, .button--skin-line.button--text.button--active-interactive:active {
  background-color: transparent;
  color: var(--line-colors-base-active-action);
}
.button--skin-line.button--text.button--loading .button__loading-icon {
  color: var(--line-colors-base-default);
}
.button--disabled {
  opacity: var(--states-disabled);
  pointer-events: none;
}
.button--loading {
  position: relative;
  color: transparent;
  pointer-events: none;
}
.button--cursor-pointer {
  cursor: pointer;
}
.button--cursor-default {
  cursor: default;
}
.button--cursor-not-allowed {
  cursor: not-allowed;
}
.button__icon {
  display: inline-block;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 20px;
  width: 20px;
  height: 20px;
}
.button--small .button__icon {
  flex-basis: 20px;
  width: 20px;
  height: 20px;
}
.button__icon > path:not([fill]) {
  fill: currentColor;
}
.button__content {
  display: block;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  height: 20px;
  padding-block: var(--spacings-s0);
  padding-inline: var(--spacings-s2);
  font-family: var(--fonts-gilroy);
}
.button--small .button__content {
  height: 20px;
  padding-block: var(--spacings-s0);
  padding-inline: var(--spacings-s2);
}
.button__content--hidden {
  visibility: hidden;
}
.button__control {
  display: none;
}
.button__loading-icon {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  pointer-events: none;
}
@keyframes button-rotate {
  to {
    transform: rotate(360deg);
  }
}
.button__loading-icon {
  animation: button-rotate var(--timings-long) var(--easings-linear) infinite;
}
.loader {
  display: flex;
  width: 100%;
  height: 100%;
  inset: 0;
  z-index: var(--loader-z-index, 1);
  background-color: var(--loader-bg-color, transparent);
}
.loader--local {
  position: absolute;
}
.loader--global {
  position: fixed;
}
.loader--no-bg {
  background-color: transparent;
}
@keyframes loader-rotate {
  to {
    transform: rotate(360deg);
  }
}
.loader__icon {
  display: inline-block;
  margin: auto;
  animation: loader-rotate var(--timings-long) var(--easings-linear) infinite;
}
.loader__icon path {
  fill: var(--primary-colors-base-default);
}
.loader--large .loader__icon {
  width: 48px;
  height: 48px;
}
.loader--small .loader__icon {
  width: 24px;
  height: 24px;
}
.divider::before {
  content: "";
  display: block;
  background-color: var(--background-colors-border);
}
.divider--rounded::before {
  border-radius: var(--corner-radius-r2);
}
.divider--horizontal {
  display: block;
  width: var(--divider-size, 100%);
  padding-top: var(--divider-start);
  padding-bottom: var(--divider-end);
}
.divider--horizontal::before {
  height: 2px;
}
.divider--vertical {
  display: inline-block;
  vertical-align: top;
  height: var(--divider-size, 100%);
  padding-inline-start: var(--divider-start);
  padding-inline-end: var(--divider-end);
}
.divider--vertical::before {
  width: 2px;
  height: 100%;
}
html.scroll-frozen {
  height: 100%;
  overflow: hidden;
}

.overlay {
  position: relative;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  z-index: var(--overlay-z-index);
  background-color: var(--background-colors-transparent);
}
@media (pointer: fine) {
  .overlay::-webkit-scrollbar {
    width: 4px;
  }
  .overlay::-webkit-scrollbar-track {
    border-radius: var(--corner-radius-r4);
    background-color: transparent;
  }
  .overlay::-webkit-scrollbar-thumb {
    border-radius: var(--corner-radius-r4);
    background-color: var(--background-colors-border);
  }
  .overlay::-webkit-scrollbar-corner {
    background: transparent;
  }
}
@supports (-moz-appearance: none) {
  .overlay {
    scrollbar-color: var(--background-colors-border) transparent;
    scrollbar-width: thin;
  }
}
@media (pointer: coarse) {
  .overlay::-webkit-scrollbar {
    display: none;
  }
}
.overlay--hide-scrollbars {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.overlay--hide-scrollbars::-webkit-scrollbar {
  display: none;
}
.overlay--global {
  position: fixed;
}
.overlay--local {
  position: absolute;
}
.overlay__table {
  display: table;
  table-layout: fixed;
  width: 100%;
  min-height: 100%;
}
.overlay__row {
  display: table-row;
}
.overlay__cell {
  display: table-cell;
}
.overlay__cell--v-top {
  vertical-align: top;
}
.overlay__cell--v-middle {
  vertical-align: middle;
}
.overlay__cell--v-bottom {
  vertical-align: bottom;
}
.overlay__cell--h-left {
  text-align: left;
}
.overlay__cell--h-center {
  text-align: center;
}
.overlay__cell--h-right {
  text-align: right;
}
.overlay__content {
  display: inline-block;
  max-width: 100%;
  text-align: initial;
}
.overlay__content--v-top {
  vertical-align: top;
}
.overlay__content--v-middle {
  vertical-align: middle;
}
.overlay__content--v-bottom {
  vertical-align: bottom;
}
.overlay__content--full-width {
  width: 100%;
}
.overlay__content--fit-width {
  width: fit-content;
  margin: auto;
}
.inline-button {
  display: inline-flex;
  vertical-align: top;
  flex-shrink: 0;
  align-items: center;
  transition-property: background-color, border-color, color;
  transition-timing-function: var(--easings-ease);
  transition-duration: var(--timings-default);
}
.inline-button--large {
  height: 40px;
  padding-block: var(--spacings-s10);
  padding-inline: var(--spacings-s10);
  column-gap: var(--spacings-s2);
  border-radius: var(--corner-radius-r8);
  font-weight: 600;
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.inline-button--small {
  height: 32px;
  padding-block: var(--spacings-s6);
  padding-inline: var(--spacings-s6);
  column-gap: var(--spacings-s2);
  border-radius: var(--corner-radius-r8);
  font-weight: 600;
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.inline-button--full-width {
  width: 100%;
}
.inline-button--with-border {
  border-style: solid;
  border-width: 1px;
}
.inline-button--with-border.inline-button--small {
  border-width: 1px;
}
.inline-button--no-border {
  border: none;
}
.inline-button--transparent-bg {
  background-color: transparent;
}
.inline-button--center-content {
  justify-content: center;
}
.inline-button--cursor-pointer {
  cursor: pointer;
}
.inline-button--cursor-default {
  cursor: default;
}
.inline-button--cursor-not-allowed {
  cursor: not-allowed;
}
.inline-button--default {
  background-color: var(--control-colors-button-background-default);
  border-color: var(--control-colors-border-default);
  color: var(--control-colors-text-default);
}
@media (hover: hover) and (pointer: fine) {
  .inline-button--interactive:hover {
    background-color: var(--control-colors-button-background-action);
    border-color: var(--control-colors-border-action);
    color: var(--control-colors-text-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .inline-button--interactive:active {
    background-color: var(--control-colors-button-background-action);
    border-color: var(--control-colors-border-action);
    color: var(--control-colors-text-action);
  }
}
.inline-button--active {
  background-color: var(--control-colors-button-background-active);
  border-color: var(--control-colors-border-active);
  color: var(--control-colors-text-active);
}
@media (hover: hover) and (pointer: fine) {
  .inline-button--active-interactive:hover {
    background-color: var(--control-colors-button-background-active-action);
    border-color: var(--control-colors-border-active-action);
    color: var(--control-colors-text-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .inline-button--active-interactive:active {
    background-color: var(--control-colors-button-background-active-action);
    border-color: var(--control-colors-border-active-action);
    color: var(--control-colors-text-active-action);
  }
}
.inline-button--without-border-override {
  border-color: transparent;
}
@media (hover: hover) and (pointer: fine) {
  .inline-button--without-border-override:hover {
    border-color: transparent;
  }
}
@media (hover: none) and (pointer: coarse) {
  .inline-button--without-border-override:active {
    border-color: transparent;
  }
}
.inline-button--without-bg-override {
  background-color: transparent;
}
.inline-button--disabled {
  opacity: var(--states-disabled);
  cursor: not-allowed;
}
.inline-button--loading-skin {
  position: relative;
  color: transparent;
}
.inline-button__icon-holder {
  display: block;
  width: 20px;
  height: 20px;
}
.inline-button--small .inline-button__icon-holder {
  width: 20px;
  height: 20px;
}
.inline-button__icon {
  display: inline-block;
  flex-shrink: 0;
  flex-basis: 20px;
  width: 20px;
  height: 20px;
  min-width: 0;
  min-height: 0;
  transition-property: transform;
  transition-timing-function: var(--easings-ease);
  transition-duration: var(--timings-default);
}
.inline-button--small .inline-button__icon {
  flex-basis: 20px;
  width: 20px;
  height: 20px;
}
.inline-button__icon > path:not([fill]) {
  fill: currentColor;
}
.inline-button__arrow-active {
  transform: rotate(180deg);
}
.inline-button__content-wrap {
  display: grid;
  flex-grow: 1;
  height: 20px;
  padding-block: var(--spacings-s0);
  padding-inline: var(--spacings-s2);
}
.inline-button--small .inline-button__content-wrap {
  height: 20px;
  padding-block: var(--spacings-s0);
  padding-inline: var(--spacings-s2);
}
.inline-button__content-align-start {
  text-align: start;
}
.inline-button__content-align-center {
  text-align: center;
}
.inline-button__content-align-end {
  text-align: end;
}
.inline-button__content {
  width: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.inline-button__control {
  display: none;
}
.inline-button__loading-icon {
  position: absolute;
  inset: 0;
  margin: auto;
  pointer-events: none;
}
@keyframes inline-btn-rotate {
  to {
    transform: rotate(360deg);
  }
}
.inline-button__loading-icon-skin {
  color: var(--control-colors-text-default);
  animation: inline-btn-rotate var(--timings-long) var(--easings-linear) infinite;
}
.segments {
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: var(--seg-cols, repeat(1, 1fr));
  list-style-type: none;
  border-radius: var(--corner-radius-r12);
  background-color: var(--background-colors-base);
}
.segments--large {
  column-gap: var(--spacings-s4);
  padding: var(--spacings-s4);
}
.segments--large.segments--bordered {
  padding: calc(var(--spacings-s4) - 1px);
}
.segments--small {
  column-gap: var(--spacings-s4);
  padding: var(--spacings-s2);
}
.segments--small.segments--bordered {
  padding: calc(var(--spacings-s4) - 1px);
}
.segments--bordered {
  border: 1px solid var(--background-colors-border);
}
.segments__item {
  min-width: 0;
}
.tag {
  display: inline-flex;
  vertical-align: top;
  align-items: center;
  justify-content: center;
  height: 16px;
  border-radius: var(--corner-radius-r16);
  padding: var(--spacings-s0) var(--spacings-s6);
}
.tag--low-prio {
  width: 16px;
  min-width: 16px;
  padding: 0;
  border-radius: var(--corner-radius-circle);
}
.tag--skin-information {
  background-color: var(--information-colors-base-default);
  color: var(--information-colors-text-default);
}
.tag--skin-error {
  background-color: var(--error-colors-base-default);
  color: var(--error-colors-text-default);
}
.tag--skin-success {
  background-color: var(--success-colors-base-default);
  color: var(--success-colors-text-default);
}
.tag--skin-warning {
  background-color: var(--warning-colors-base-default);
  color: var(--warning-colors-text-default);
}
.tag--skin-positive {
  background-color: var(--positive-colors-base-default);
  color: var(--positive-colors-text-default);
}
.tag--skin-negative {
  background-color: var(--negative-colors-base-default);
  color: var(--negative-colors-text-default);
}
.tag--skin-premium {
  background-color: var(--monetization-ultra-colors-base-default);
  color: var(--monetization-ultra-colors-text-default);
}
.tag--skin-black {
  background-color: var(--absolute-black-colors-base-default);
  color: var(--absolute-black-colors-text-default);
}
.tag--skin-white {
  background-color: var(--absolute-white-colors-base-default);
  color: var(--absolute-white-colors-text-default);
}
.tag--skin-transparent {
  background-color: var(--background-colors-transparent);
  color: var(--absolute-white-colors-base-default);
}
.tag__text {
  color: inherit;
  font-size: var(--typography-t3-font-size);
  line-height: var(--typography-t3-line-height);
}
.tag__icon {
  width: 10px;
  height: 10px;
}
.tag__icon > path:not([fill]) {
  fill: currentColor;
}
.text-field {
  width: 100%;
}
.text-field--large {
  height: 40px;
}
.text-field--small {
  height: 32px;
}
.text-field--relative {
  position: relative;
}
.text-field__control {
  display: block;
  width: 100%;
  height: 100%;
  border-width: 1px;
  border-style: solid;
  border-radius: var(--corner-radius-r8);
  font-weight: 500;
  transition-property: background-color, border-color, color;
  transition-duration: var(--timings-default);
  transition-timing-function: var(--easings-ease);
}
.text-field__control::placeholder {
  font-size: var(--typography-t4-font-size);
  line-height: 1;
}
.text-field__control::-webkit-outer-spin-button, .text-field__control::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.text-field__control[type=number] {
  -moz-appearance: textfield;
}
.text-field__control--centered {
  text-align: center;
}
.text-field__control--large {
  font-size: var(--typography-t5-font-size);
  line-height: var(--typography-t5-line-height);
  font-weight: 500;
}
.text-field__control--small {
  font-size: var(--typography-t3-font-size);
  line-height: var(--typography-t3-line-height);
  font-weight: 500;
}
.text-field__control--default-padding.text-field__control--large {
  padding: 0 calc(var(--spacings-s10) - 1px);
}
.text-field__control--default-padding.text-field__control--small {
  padding: 0 calc(var(--spacings-s6) - 1px);
}
.text-field__control--placeholder-padding.text-field__control--large {
  padding-inline-start: calc(var(--spacings-s10) + 20px + var(--spacings-s2) + var(--spacings-s2));
}
.text-field__control--placeholder-padding.text-field__control--small {
  padding-inline-start: calc(var(--spacings-s6) + 20px + var(--spacings-s2) + var(--spacings-s2));
}
.text-field__control--button-padding.text-field__control--large {
  padding-inline-end: calc(var(--spacings-s10) + 20px + var(--spacings-s2) + var(--spacings-s2));
}
.text-field__control--button-padding.text-field__control--small {
  padding-inline-end: calc(var(--spacings-s6) + 20px + var(--spacings-s2) + var(--spacings-s2));
}
.text-field__placeholder-icon {
  display: inline-block;
  vertical-align: top;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  pointer-events: none;
}
.text-field__placeholder-icon--large {
  width: 20px;
  height: 20px;
  inset-inline-start: var(--spacings-s10);
}
.text-field__placeholder-icon--small {
  width: 20px;
  height: 20px;
  inset-inline-start: var(--spacings-s6);
}
.text-field__button {
  display: inline-block;
  vertical-align: top;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  cursor: pointer;
}
.text-field__button--large {
  width: 20px;
  height: 20px;
  inset-inline-end: var(--spacings-s10);
}
.text-field__button--small {
  width: 20px;
  height: 20px;
  inset-inline-end: var(--spacings-s6);
}
.text-field--default-skin {
  border-color: var(--control-colors-border-default);
  color: var(--control-colors-value-default);
  background-color: var(--text-field-bg-override, var(--control-colors-field-background-default));
}
@media (hover: hover) and (pointer: fine) {
  .text-field--interactive:hover {
    border-color: var(--control-colors-border-action);
    color: var(--control-colors-value-action);
    background-color: var(--text-field-bg-override, var(--control-colors-field-background-action));
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--interactive:active {
    border-color: var(--control-colors-border-action);
    color: var(--control-colors-value-action);
    background-color: var(--text-field-bg-override, var(--control-colors-field-background-action));
  }
}
.text-field--interactive:focus {
  border-color: var(--control-colors-border-active);
  color: var(--control-colors-value-active);
  background-color: var(--text-field-bg-override, var(--control-colors-field-background-active));
}
.text-field--filled {
  color: var(--control-colors-value-active);
  background-color: var(--text-field-bg-override, var(--control-colors-field-background-active));
  border-color: var(--control-colors-border-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--filled:hover {
    border-color: var(--control-colors-border-active-action);
    color: var(--control-colors-value-active-action);
    background-color: var(--text-field-bg-override, var(--control-colors-field-background-active-action));
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--filled:active {
    border-color: var(--control-colors-border-active-action);
    color: var(--control-colors-value-active-action);
    background-color: var(--text-field-bg-override, var(--control-colors-field-background-active-action));
  }
}
.text-field--error {
  border-color: var(--error-colors-base-default);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--error:hover {
    border-color: var(--error-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--error:active {
    border-color: var(--error-colors-base-active);
  }
}
.text-field--error-active {
  border-color: var(--error-colors-base-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--error-active:hover {
    border-color: var(--error-colors-base-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--error-active:active {
    border-color: var(--error-colors-base-active-action);
  }
}
.text-field--warning {
  border-color: var(--warning-colors-base-default);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--warning:hover {
    border-color: var(--warning-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--warning:active {
    border-color: var(--warning-colors-base-action);
  }
}
.text-field--warning-active {
  border-color: var(--warning-colors-base-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--warning-active:hover {
    border-color: var(--warning-colors-base-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--warning-active:active {
    border-color: var(--warning-colors-base-active-action);
  }
}
.text-field--success {
  border-color: var(--success-colors-base-default);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--success:hover {
    border-color: var(--success-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--success:active {
    border-color: var(--success-colors-base-action);
  }
}
.text-field--success-active {
  border-color: var(--success-colors-base-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--success-active:hover {
    border-color: var(--success-colors-base-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--success-active:active {
    border-color: var(--success-colors-base-active-action);
  }
}
.text-field--disabled {
  opacity: var(--states-disabled);
}
.text-field--disabled-icon {
  opacity: var(--states-disabled);
  cursor: auto;
}
.text-field--without-background {
  --text-field-bg-override: transparent;
}
.text-field--without-borders {
  border-style: none;
}
.text-field__skin-placeholder-icon {
  color: var(--control-colors-start-icon-default);
}
.text-field__skin-placeholder-icon > path {
  fill: currentColor;
}
.text-field__skin-button {
  border: none;
  background: none;
  color: var(--control-colors-end-icon-default);
  transition: color var(--timings-default) var(--easings-ease);
}
@media (hover: hover) and (pointer: fine) {
  .text-field__skin-button:hover {
    color: var(--control-colors-end-icon-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field__skin-button:active {
    color: var(--control-colors-end-icon-action);
  }
}
.text-field__skin-button-icon {
  display: block;
  width: 100%;
  height: 100%;
}
.text-field__skin-button-icon > path {
  fill: currentColor;
}
@media (hover: hover) and (pointer: fine) {
  .text-field--interactive:hover + .text-field__skin-placeholder-icon {
    color: var(--control-colors-start-icon-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--interactive:active + .text-field__skin-placeholder-icon {
    color: var(--control-colors-start-icon-action);
  }
}
.text-field--filled + .text-field__skin-placeholder-icon {
  color: var(--control-colors-start-icon-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-field--filled:hover + .text-field__skin-placeholder-icon {
    color: var(--control-colors-start-icon-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-field--filled:active + .text-field__skin-placeholder-icon {
    color: var(--control-colors-start-icon-active-action);
  }
}
.slider {
  --track-height: 4px;
  --track-filled-height: calc(var(--track-height) / 2);
  --thumb-size: 16px;
  --thumb-border-width: var(--slider-thumb-border-width, 0);
  --mark-thumb-size: 8px;
  position: relative;
  display: grid;
  align-items: center;
  width: 100%;
  height: calc(var(--thumb-size) + 2 * var(--spacings-s8));
}
.slider--centered::before {
  content: "";
  position: absolute;
  width: var(--mark-thumb-size);
  height: var(--mark-thumb-size);
  border: 1px solid var(--control-colors-border-default);
  background: var(--control-colors-slider-thumb-default);
  border-radius: var(--corner-radius-circle);
  box-sizing: border-box;
  pointer-events: none;
  top: 50%;
  z-index: 1;
}
[dir=ltr] .slider--centered::before {
  left: 50%;
  transform: translate(-50%, -50%);
}
[dir=rtl] .slider--centered::before {
  right: 50%;
  transform: translate(50%, -50%);
}
.slider--disabled {
  pointer-events: none;
  opacity: var(--states-disabled);
}
.slider__content-wrap {
  position: relative;
  height: 100%;
}
.slider__progress {
  display: grid;
  grid-area: 1/1;
  height: var(--track-filled-height);
  margin: var(--spacings-s0);
  margin-inline-end: var(--slider-track-inner-x-gap, var(--thumb-size));
  border-radius: var(--corner-radius-r4);
  pointer-events: none;
  overflow: hidden;
}
.slider__progress--continuous::before {
  content: "";
  grid-area: 1/1;
  background: var(--control-colors-slider-track-default);
  will-change: transform;
}
[dir=ltr] .slider__progress--continuous::before {
  transform: var(--slider-progress-transform-ltr, translateX(-100%));
}
[dir=rtl] .slider__progress--continuous::before {
  transform: var(--slider-progress-transform-rtl, translateX(100%));
}
.slider__progress--centered-grid {
  grid-template-columns: repeat(2, 1fr);
}
.slider__progress-side {
  display: grid;
  overflow: hidden;
}
.slider__progress-side::before {
  background: var(--control-colors-slider-track-default);
  will-change: transform;
}
.slider__progress-side--start::before {
  content: var(--slider-progress-start-content, none);
}
[dir=ltr] .slider__progress-side--start::before {
  transform: var(--slider-progress-start-transform-ltr);
}
[dir=rtl] .slider__progress-side--start::before {
  transform: var(--slider-progress-start-transform-rtl);
}
.slider__progress-side--end::before {
  content: var(--slider-progress-end-content, none);
}
[dir=ltr] .slider__progress-side--end::before {
  transform: var(--slider-progress-end-transform-ltr);
}
[dir=rtl] .slider__progress-side--end::before {
  transform: var(--slider-progress-end-transform-rtl);
}
.slider__marks-wrap {
  display: grid;
  grid-area: 1/1;
  height: var(--mark-thumb-size);
  pointer-events: none;
}
.slider__marks-wrap--centered {
  grid-template-columns: repeat(2, 1fr);
}
.slider__mark-side {
  position: relative;
}
.slider__mark {
  position: absolute;
  width: var(--mark-thumb-size);
  height: var(--mark-thumb-size);
  border: 1px solid var(--control-colors-border-default);
  background: var(--control-colors-slider-thumb-default);
  border-radius: var(--corner-radius-circle);
  box-sizing: border-box;
  pointer-events: none;
}
.slider__mark--continuous {
  top: 50%;
}
[dir=ltr] .slider__mark--continuous {
  left: var(--x);
  transform: translateX(calc(-1 * var(--x))) translateY(-50%);
}
[dir=rtl] .slider__mark--continuous {
  right: var(--x);
  transform: translateX(calc(var(--x))) translateY(-50%);
}
.slider__mark--centered {
  top: var(--spacings-s0);
}
[dir=ltr] .slider__mark--centered {
  left: var(--x);
  transform: translateX(calc(-1 * var(--x)));
}
[dir=rtl] .slider__mark--centered {
  right: var(--x);
  transform: translateX(calc(var(--x)));
}
.slider__mark--disabled {
  background: var(--control-colors-border-default);
}
.slider__wrap {
  display: grid;
  align-items: center;
  width: 100%;
  height: 100%;
}
.slider__wrap::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: var(--spacings-s0);
  right: var(--spacings-s0);
  transform: translateY(-50%);
  background: var(--slider-track-bg, var(--control-colors-border-default));
  height: var(--track-height);
  border-radius: var(--corner-radius-r4);
}
.slider__input {
  position: relative;
  grid-area: 1/1;
  width: 100%;
  height: 100%;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  z-index: 1;
}
.slider__input::-webkit-slider-thumb {
  width: var(--thumb-size);
  height: var(--thumb-size);
  box-shadow: 0 0 0 var(--thumb-border-width) var(--control-colors-slider-thumb-default) inset;
  border-radius: var(--corner-radius-circle);
  filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.24));
  -webkit-appearance: none;
  appearance: none;
  transition: box-shadow var(--timings-default);
  cursor: pointer;
  background: var(--slider-thumb-bg, var(--control-colors-slider-thumb-default));
  background-size: var(--slider-thumb-bg-size, auto);
}
[dir=ltr] .slider__input::-webkit-slider-thumb {
  background-position: var(--slider-thumb-bg-position-ltr, 0%);
}
[dir=rtl] .slider__input::-webkit-slider-thumb {
  background-position: var(--slider-thumb-bg-position-rtl, 0%);
}
.slider__input::-webkit-slider-thumb:hover {
  box-shadow: 0 0 0 1px var(--control-colors-border-action) inset;
}
.slider__input:active::-webkit-slider-thumb {
  box-shadow: 0 0 0 2px var(--control-colors-border-active) inset;
}
.slider__input::-moz-range-thumb {
  width: var(--thumb-size);
  height: var(--thumb-size);
  box-shadow: 0 0 0 var(--thumb-border-width) var(--control-colors-slider-thumb-default) inset;
  border-radius: var(--corner-radius-circle);
  filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.24));
  appearance: none;
  transition: box-shadow var(--timings-default);
  cursor: pointer;
  background: var(--slider-thumb-bg, var(--control-colors-slider-thumb-default));
  background-size: var(--slider-thumb-bg-size, auto);
  border: none;
}
[dir=ltr] .slider__input::-moz-range-thumb {
  background-position: var(--slider-thumb-bg-position-ltr, 0%);
}
[dir=rtl] .slider__input::-moz-range-thumb {
  background-position: var(--slider-thumb-bg-position-rtl, 0%);
}
.slider__input:active::-moz-range-thumb {
  box-shadow: 0 0 0 2px var(--control-colors-border-active) inset;
}
.horizontal-container {
  width: 100%;
  margin: 0 auto;
}
@media screen and (min-width: 1600px) {
  .horizontal-container {
    max-width: 1600px;
    padding: 0 var(--spacings-s24);
  }
}
@media screen and (min-width: 1366px) and (max-width: 1599px) {
  .horizontal-container {
    max-width: 1366px;
    padding: 0 var(--spacings-s24);
  }
}
@media screen and (min-width: 1280px) and (max-width: 1365px) {
  .horizontal-container {
    max-width: 1280px;
    padding: 0 var(--spacings-s24);
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .horizontal-container {
    max-width: 1024px;
    padding: 0 var(--spacings-s24);
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .horizontal-container {
    max-width: 768px;
    padding: 0 var(--spacings-s12);
  }
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .horizontal-container {
    max-width: 480px;
    padding: 0 var(--spacings-s12);
  }
}
@media screen and (max-width: 479px) {
  .horizontal-container {
    max-width: 100%;
    padding: 0 var(--spacings-s12);
  }
}
.select {
  display: grid;
  grid-auto-flow: column;
  width: 100%;
}
.select__menu {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: var(--spacings-s8);
  background-color: var(--background-colors-popover);
  border-radius: var(--spacings-s8);
  border: 1px solid var(--control-colors-border-default);
  overscroll-behavior: contain;
}
.select__menu--large {
  padding: calc(var(--spacings-s12) - 1px);
}
.select__menu--small {
  padding: calc(var(--spacings-s12) - 1px);
}
@media (pointer: fine) {
  .select__menu::-webkit-scrollbar {
    width: 4px;
  }
  .select__menu::-webkit-scrollbar-track {
    border-radius: var(--corner-radius-r4);
    background-color: transparent;
    margin-block: var(--spacings-s4);
  }
  .select__menu::-webkit-scrollbar-thumb {
    border-radius: var(--corner-radius-r4);
    background-color: var(--background-colors-border);
  }
  .select__menu::-webkit-scrollbar-corner {
    background: transparent;
  }
}
@supports (-moz-appearance: none) {
  .select__menu {
    scrollbar-color: var(--background-colors-border) transparent;
    scrollbar-width: thin;
  }
}
@media (hover: none) and (pointer: coarse) {
  .select__menu::-webkit-scrollbar {
    display: none;
  }
}
.select__mobile-menu {
  display: flex;
  flex-direction: column;
  align-items: start;
  padding: var(--spacings-s4) var(--spacings-s8);
  gap: var(--spacings-s8);
}
.select__invisible-content {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
.select__badges {
  display: inline-flex;
  align-items: center;
  margin-inline-start: auto;
  gap: var(--spacings-s8);
  padding-inline-start: var(--spacings-s4);
}
.select__badge {
  box-shadow: none;
}
.panel-heading__top {
  display: grid;
  align-items: center;
  grid-template-rows: 1fr;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: "action title optional close";
}
.panel-heading__brand-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-inline-end: var(--spacings-s4);
}
.panel-heading__brand-icon svg {
  width: 20px;
  height: 20px;
  fill: var(--text-colors-tint-1);
}
.panel-heading__common {
  min-width: 0;
}
.panel-heading__back-button {
  grid-area: action;
  margin-inline-end: var(--spacings-s4);
}
[dir=rtl] .panel-heading__back-button {
  transform: rotate(180deg);
}
.panel-heading__center-container {
  grid-area: title;
  display: flex;
  align-items: center;
}
.panel-heading__title-start {
  justify-content: start;
}
.panel-heading__title-container {
  display: grid;
  align-items: center;
  grid-template-rows: 1fr;
  grid-template-columns: auto min-content 1fr;
  grid-template-areas: "mainTitle count badge";
}
.panel-heading__title {
  display: block;
  grid-area: mainTitle;
  transition: color var(--timings-default) var(--easings-ease);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.panel-heading__count {
  margin-inline-start: var(--spacings-s4);
  grid-area: count;
}
.panel-heading [data-testid=badge] {
  grid-area: badge;
  vertical-align: baseline;
  margin-inline-start: var(--spacings-s8);
}
.panel-heading__optional {
  grid-area: optional;
  display: flex;
  gap: var(--spacings-s2);
  margin-inline-start: var(--spacings-s8);
}
.panel-heading__close-button {
  margin-inline-start: var(--spacings-s8);
  grid-area: close;
}
.panel-heading__bottom {
  margin-top: var(--spacings-s8);
}
.text-tooltip {
  max-width: 390px;
  z-index: var(--text-tooltip-z-index);
  --container-background-color: var(--negative-colors-base-default);
  --container-border-color: var(--background-colors-border);
  background-color: var(--container-background-color);
  border-radius: var(--corner-radius-r8);
}
.text-tooltip__text {
  display: block;
  padding: var(--spacings-s8);
  color: var(--negative-colors-text-default);
  text-align: center;
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.text-area {
  display: flex;
  flex-direction: column;
  row-gap: var(--spacings-s4);
  border-style: solid;
  transition-property: background-color, border, color;
  transition-duration: var(--timings-default);
  transition-timing-function: var(--easings-ease);
  height: var(--textarea-container-height, auto);
  max-height: var(--textarea-max-height, none);
}
.text-area--large {
  border-width: 1px;
  border-radius: var(--corner-radius-r8);
  padding-inline: calc(var(--spacings-s10) - 1px);
  padding-block: calc(var(--spacings-s10) - 1px);
  min-height: 40px;
}
.text-area--large .text-area__input {
  font-size: 16px;
}
.text-area--small {
  border-width: 1px;
  border-radius: var(--corner-radius-r8);
  padding-inline: calc(var(--spacings-s6) - 1px);
  padding-block: calc(var(--spacings-s6) - 1px);
  min-height: 32px;
}
.text-area--small .text-area__input {
  font-size: 16px;
}
.text-area--full-height .text-area__input, .text-area--custom-height .text-area__input {
  height: 100%;
}
.text-area__input {
  display: block;
  width: 100%;
  background-color: inherit;
  font-weight: 500;
  color: inherit;
  border: none;
  resize: none;
  cursor: auto;
  line-height: var(--typography-t4-line-height);
}
@media (pointer: fine) {
  .text-area__input::-webkit-scrollbar {
    width: 14px;
  }
  .text-area__input::-webkit-scrollbar-track {
    border-radius: var(--corner-radius-r4);
    background-color: transparent;
  }
  .text-area__input::-webkit-scrollbar-thumb {
    border-radius: var(--corner-radius-r4);
    background-color: var(--background-colors-border);
  }
  .text-area__input::-webkit-scrollbar-corner {
    background: transparent;
  }
}
@supports (-moz-appearance: none) {
  .text-area__input {
    scrollbar-color: var(--background-colors-border) transparent;
    scrollbar-width: thin;
  }
}
@media (pointer: coarse) {
  .text-area__input::-webkit-scrollbar {
    display: none;
  }
}
.text-area__input::-webkit-scrollbar-track {
  margin-block: var(--spacings-s4);
}
.text-area__input::-webkit-scrollbar-thumb {
  background-clip: content-box;
  border: 4px solid transparent;
  background-color: var(--control-colors-border-action);
  border-radius: var(--corner-radius-r12);
}
.text-area__action-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 32px;
}
.text-area__left-side {
  display: inline-flex;
  align-items: center;
  column-gap: var(--spacings-s6);
}
.text-area__right-side {
  display: inline-flex;
  align-items: center;
  column-gap: var(--spacings-s6);
  margin-inline-start: auto;
}
.text-area--default-skin {
  color: var(--control-colors-value-default);
  border-color: var(--control-colors-border-default);
  background-color: var(--textarea-bg-override, var(--control-colors-field-background-default));
}
@media (hover: hover) and (pointer: fine) {
  .text-area--interactive:hover {
    color: var(--control-colors-value-action);
    border-color: var(--control-colors-border-action);
    background-color: var(--textarea-bg-override, var(--control-colors-field-background-action));
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--interactive:active {
    color: var(--control-colors-value-action);
    border-color: var(--control-colors-border-action);
    background-color: var(--textarea-bg-override, var(--control-colors-field-background-action));
  }
}
.text-area--interactive:focus {
  color: var(--control-colors-value-active);
  border-color: var(--control-colors-border-active);
  background-color: var(--textarea-bg-override, var(--control-colors-field-background-active));
}
.text-area--filled {
  color: var(--control-colors-value-active);
  border-color: var(--control-colors-border-active);
  background-color: var(--textarea-bg-override, var(--control-colors-field-background-active));
}
@media (hover: hover) and (pointer: fine) {
  .text-area--filled:hover {
    border-color: var(--control-colors-border-active-action);
    background-color: var(--textarea-bg-override, var(--control-colors-field-background-active-action));
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--filled:active {
    border-color: var(--control-colors-border-active-action);
    background-color: var(--textarea-bg-override, var(--control-colors-field-background-active-action));
  }
}
.text-area--error {
  border-color: var(--error-colors-base-default);
  background-color: var(--textarea-bg-override, var(--control-colors-field-background-default));
}
@media (hover: hover) and (pointer: fine) {
  .text-area--error:hover {
    border-color: var(--error-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--error:active {
    border-color: var(--error-colors-base-action);
  }
}
.text-area--error-active {
  border-color: var(--error-colors-base-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-area--error-active:hover {
    border-color: var(--error-colors-base-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--error-active:active {
    border-color: var(--error-colors-base-active-action);
  }
}
.text-area--warning {
  border-color: var(--warning-colors-base-action);
  background-color: var(--textarea-bg-override, var(--control-colors-field-background-default));
}
@media (hover: hover) and (pointer: fine) {
  .text-area--warning:hover {
    border-color: var(--warning-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--warning:active {
    border-color: var(--warning-colors-base-action);
  }
}
.text-area--warning-active {
  border-color: var(--warning-colors-base-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-area--warning-active:hover {
    border-color: var(--warning-colors-base-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--warning-active:active {
    border-color: var(--warning-colors-base-active-action);
  }
}
.text-area--success {
  border-color: var(--success-colors-base-default);
  background-color: var(--textarea-bg-override, var(--control-colors-field-background-default));
}
@media (hover: hover) and (pointer: fine) {
  .text-area--success:hover {
    border-color: var(--success-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--success:active {
    border-color: var(--success-colors-base-action);
  }
}
.text-area--success-active {
  border-color: var(--success-colors-base-active);
}
@media (hover: hover) and (pointer: fine) {
  .text-area--success-active:hover {
    border-color: var(--success-colors-base-active-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .text-area--success-active:active {
    border-color: var(--success-colors-base-active-action);
  }
}
.text-area--without-borders {
  border-style: none;
}
.text-area--disabled {
  opacity: var(--states-disabled);
}
.radio {
  display: inline-flex;
  column-gap: var(--spacings-s2);
  padding: var(--spacings-s6) var(--spacings-s0);
  color: var(--text-colors-base);
}
.radio__radio {
  display: inline-block;
  vertical-align: top;
  position: relative;
  flex: none;
  width: 20px;
  height: 20px;
}
.radio__control {
  display: inline-block;
  vertical-align: top;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}
.radio__icon {
  display: block;
  width: 100%;
  height: 100%;
  transition: color var(--timings-default) var(--easings-ease);
}
.radio__icon > path:not([fill]) {
  fill: currentColor;
}
.radio__label {
  display: flex;
  align-items: center;
  padding: var(--spacings-s0) var(--spacings-s2);
  font-weight: 600;
  user-select: none;
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.radio--cursor-pointer {
  cursor: pointer;
}
.radio--cursor-not-allowed {
  cursor: not-allowed;
}
.radio--state-default .radio__icon {
  color: var(--control-colors-text-default);
}
@media (hover: hover) and (pointer: fine) {
  .radio--default-interaction:hover .radio__icon {
    color: var(--control-colors-text-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .radio--default-interaction:active .radio__icon {
    color: var(--control-colors-text-action);
  }
}
.radio--skin-primary.radio--state-active .radio__icon {
  color: var(--primary-colors-base-default);
}
.radio--skin-primary.radio--state-active .radio__icon > path[fill] {
  fill: var(--primary-colors-base-default);
}
@media (hover: hover) and (pointer: fine) {
  .radio--skin-primary.radio--active-interaction:hover .radio__icon {
    color: var(--primary-colors-base-action);
  }
  .radio--skin-primary.radio--active-interaction:hover .radio__icon > path[fill] {
    fill: var(--primary-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .radio--skin-primary.radio--active-interaction:active .radio__icon {
    color: var(--primary-colors-base-action);
  }
  .radio--skin-primary.radio--active-interaction:active .radio__icon > path[fill] {
    fill: var(--primary-colors-base-action);
  }
}
.radio--skin-premium.radio--state-active .radio__icon {
  color: var(--monetization-ultra-colors-base-default);
}
.radio--skin-premium.radio--state-active .radio__icon > path[fill] {
  fill: var(--monetization-ultra-colors-base-default);
}
@media (hover: hover) and (pointer: fine) {
  .radio--skin-premium.radio--active-interaction:hover .radio__icon {
    color: var(--monetization-ultra-colors-base-action);
  }
  .radio--skin-premium.radio--active-interaction:hover .radio__icon > path[fill] {
    fill: var(--monetization-ultra-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .radio--skin-premium.radio--active-interaction:active .radio__icon {
    color: var(--monetization-ultra-colors-base-action);
  }
  .radio--skin-premium.radio--active-interaction:active .radio__icon > path[fill] {
    fill: var(--monetization-ultra-colors-base-action);
  }
}
.radio--state-disabled {
  opacity: var(--states-disabled);
}
.popup {
  padding: var(--spacings-s24);
  position: relative;
}
@media screen and (max-width: 479px) {
  .popup {
    padding: var(--spacings-s16);
  }
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .popup {
    padding: var(--spacings-s16);
  }
}
.popup__holder {
  padding: var(--spacings-s24);
  position: relative;
  background-color: var(--background-colors-base);
  box-shadow: var(--shadows-tint-1);
  border-radius: var(--corner-radius-r8);
  border: 1px solid var(--background-colors-tint-3);
}
.popup__content--with-background-effect {
  background: var(--effects-vignette);
}
.popup__close-button {
  --dir-position: calc(-1 * var(--spacings-s16));
  position: absolute;
  inset-block-start: var(--dir-position);
  inset-inline: auto var(--dir-position);
}
.popup__overlay-visible {
  opacity: 1;
  transition: opacity 200ms cubic-bezier(0, 0, 0.2, 1);
}
.popup__overlay-hidden {
  opacity: 0;
  transition: opacity 200ms cubic-bezier(0.4, 0, 1, 1);
}
@keyframes toaster-animate-center {
  from {
    opacity: 0;
    transform: translate(0, 0) scale(1);
  }
  to {
    opacity: var(--final-opacity, 1);
  }
}
@keyframes toaster-animate-left {
  from {
    opacity: 0;
    transform: translate(-20px, 0) scale(1);
  }
  to {
    opacity: var(--final-opacity, 1);
  }
}
@keyframes toaster-animate-right {
  from {
    opacity: 0;
    transform: translate(20px, 0) scale(1);
  }
  to {
    opacity: var(--final-opacity, 1);
  }
}
.toaster {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--spacings-s12);
  width: 100%;
  max-width: var(--toaster-width);
  position: fixed;
  z-index: var(--toaster-z-index);
  list-style-type: none;
  color: var(--text-colors-base);
  height: max(0px, var(--item-height) + max(0, var(--total) - 1) * 10px);
  top: var(--toaster-top);
  bottom: var(--toaster-bottom);
  left: var(--toaster-left);
  right: var(--toaster-right);
  transform: var(--toaster-transform);
}
.toaster__item {
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  top: var(--toaster-item-top);
  bottom: var(--toaster-item-bottom);
  transform-origin: var(--toaster-item-transform-origin);
  z-index: var(--index);
  animation-duration: var(--timings-default);
  animation-timing-function: var(--easings-ease);
  animation-fill-mode: forwards;
  transition: transform var(--timings-default) var(--easings-ease), opacity var(--timings-default) var(--easings-ease);
  --scale-factor: calc(1 - var(--reverse-index) * var(--scale-step, 0.03));
  --older-offset: calc(var(--reverse-index) * 0.2px * var(--direction, 1) * -1);
  --translate-y: calc(var(--index) * 6px * var(--direction, 1) + var(--older-offset));
  --translate-x: calc(var(--index) * 6px * var(--direction-x, 0));
  --final-opacity: 0.6;
  transform: translate(var(--translate-x), var(--translate-y)) scale(var(--scale-factor));
}
.toaster__item:last-child {
  --final-opacity: 1;
}
.toaster__item--animate-center {
  animation-name: toaster-animate-center;
}
.toaster__item--animate-left {
  animation-name: toaster-animate-left;
}
.toaster__item--animate-right {
  animation-name: toaster-animate-right;
}
.snackbar {
  display: inline-flex;
  align-items: center;
  width: 100%;
  border-radius: var(--spacings-s12);
  min-height: 48px;
  gap: var(--spacings-s4);
  padding: var(--spacings-s8);
  box-shadow: var(--shadows-tint-1);
}
.snackbar--information {
  background-color: var(--information-colors-base-default);
}
.snackbar--error {
  background-color: var(--error-colors-base-default);
}
.snackbar--success {
  background-color: var(--success-colors-base-default);
}
.snackbar--warning {
  background-color: var(--warning-colors-base-default);
}
.snackbar--premium {
  background-color: var(--monetization-ultra-colors-base-default);
}
.snackbar__button-no-handler {
  pointer-events: none;
}
.snackbar__close-button {
  margin-inline-start: auto;
}
.snackbar__text {
  word-break: break-word;
  min-width: 0;
}
.snackbar--information .snackbar__text {
  color: var(--information-colors-text-default);
}
.snackbar--error .snackbar__text {
  color: var(--error-colors-text-default);
}
.snackbar--success .snackbar__text {
  color: var(--success-colors-text-default);
}
.snackbar--warning .snackbar__text {
  color: var(--warning-colors-text-default);
}
.snackbar--premium .snackbar__text {
  color: var(--monetization-ultra-colors-text-default);
}
@keyframes burger-menu-open {
  from {
    opacity: 0;
    transform-origin: left;
    transform: translateX(-100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.burger-menu__overlay {
  position: fixed;
  inset: 0;
  background-color: var(--background-colors-transparent);
  z-index: 99;
}
.burger-menu__root {
  position: fixed;
  z-index: 999;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: max-content 1fr;
  gap: var(--spacings-s24);
  height: 100%;
  background-color: var(--positive-colors-base-default);
  opacity: 0;
  transform: translateX(-100%);
  transition: transform var(--timings-default) var(--easings-ease-in-out);
}
.burger-menu__root--wide {
  width: 400px;
}
.burger-menu__root--full {
  width: 100%;
}
.burger-menu__header {
  display: flex;
  gap: var(--spacings-s4);
  justify-content: start;
  align-items: center;
  height: var(--header-height);
  border-bottom: 1px solid var(--control-colors-border-default);
  padding-inline: var(--spacings-s12);
}
.burger-menu__content {
  display: grid;
  padding-inline: var(--spacings-s12);
  height: max-content;
}
.burger-menu__close-button {
  margin-inline-start: auto;
}
.burger-menu__footer {
  display: grid;
  gap: var(--spacings-s16);
  padding-inline: var(--spacings-s12);
  padding-bottom: var(--spacings-s16);
}
.burger-menu--open {
  animation: burger-menu-open var(--timings-default) var(--easings-ease) forwards;
  visibility: visible;
  opacity: 1;
}
.standard-header {
  --menu-size: 40px;
  display: grid;
  align-items: center;
  width: 100%;
  background-color: var(--positive-colors-base-default);
  height: var(--standard-header-header-height);
  border-bottom: 1px solid var(--background-colors-border);
}
.standard-header--sticky {
  position: sticky;
  top: 0;
  z-index: 1000;
}
.standard-header--relative {
  position: relative;
}
.standard-header__header-container {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  width: 100%;
  height: 100%;
}
.standard-header__header-container--desktop {
  grid-template-columns: max-content 1fr max-content max-content;
}
.standard-header__header-container--mobile {
  grid-template-columns: 1fr max-content max-content;
}
.standard-header__menu-icon-container {
  display: flex;
  align-items: center;
}
.standard-header__menu-icon-container--desktop {
  margin: var(--spacings-s0) 0;
}
.standard-header__menu-icon-container--mobile {
  margin: var(--spacings-s6) 0;
}
.standard-header__navigation-container {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  grid-template-columns: 1fr auto;
  height: 100%;
}
.standard-header__navigation-container--desktop {
  position: relative;
}
.standard-header__logo--desktop {
  margin-inline-end: var(--spacings-s40);
}
.standard-header__logo--mobile {
  margin-inline-end: 0;
  width: var(--spacings-s40);
  height: var(--spacings-s40);
}
.standard-header__navigation {
  display: flex;
  flex-grow: 1;
  overflow: hidden;
  height: 100%;
}
.standard-header__hidden-navigation {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  user-select: none;
}
.standard-header__navigation-list {
  display: inline-flex;
  gap: var(--spacings-s32);
}
.standard-header__navigation-item {
  display: flex;
  align-items: center;
  gap: var(--spacings-s8);
}
.standard-header__menu-icon--desktop {
  margin-inline-end: var(--spacings-s16);
}
.standard-header__menu-icon--mobile {
  margin-inline-end: var(--spacings-s12);
}
.standard-header__search-container--desktop {
  margin-inline-start: var(--spacings-s40);
}
.standard-header__actions-container {
  display: flex;
  align-items: center;
  gap: var(--spacings-s16);
}
.standard-header__actions-container--desktop {
  margin-inline-start: var(--spacings-s16);
}
.standard-header__actions-container--touch {
  margin-inline-end: var(--spacings-s12);
}
.link {
  max-width: 100%;
}
.link--t1 {
  font-size: var(--typography-t1-font-size);
  line-height: var(--typography-t1-line-height);
}
.link--t2 {
  font-size: var(--typography-t2-font-size);
  line-height: var(--typography-t2-line-height);
}
.link--t3 {
  font-size: var(--typography-t3-font-size);
  line-height: var(--typography-t3-line-height);
}
.link--t4 {
  font-size: var(--typography-t4-font-size);
  line-height: var(--typography-t4-line-height);
}
.link--t5 {
  font-size: var(--typography-t5-font-size);
  line-height: var(--typography-t5-line-height);
}
.link--t6 {
  font-size: var(--typography-t6-font-size);
  line-height: var(--typography-t6-line-height);
}
.link--t7 {
  font-size: var(--typography-t7-font-size);
  line-height: var(--typography-t7-line-height);
}
.link--t8 {
  font-size: var(--typography-t8-font-size);
  line-height: var(--typography-t8-line-height);
}
.link--t9 {
  font-size: var(--typography-t9-font-size);
  line-height: var(--typography-t9-line-height);
}
.link--t10 {
  font-size: var(--typography-t10-font-size);
  line-height: var(--typography-t10-line-height);
}
.link--color-primary {
  color: var(--primary-colors-base-default);
}
.link--color-neutral {
  color: var(--neutral-colors-base-default);
}
.link--color-plus {
  color: var(--monetization-plus-colors-base-default);
}
.link--color-pro {
  color: var(--monetization-pro-colors-base-default);
}
.link--color-ultra {
  color: var(--monetization-ultra-colors-base-default);
}
.link--color-success {
  color: var(--success-colors-base-default);
}
.link--color-warning {
  color: var(--warning-colors-base-default);
}
.link--color-error {
  color: var(--error-colors-base-default);
}
.link--color-information {
  color: var(--information-colors-base-default);
}
.link--color-positive {
  color: var(--positive-colors-base-default);
}
.link--color-negative {
  color: var(--negative-colors-base-default);
}
.link--color-black {
  color: var(--absolute-black-colors-base-default);
}
.link--color-white {
  color: var(--absolute-white-colors-base-default);
}
.link--color-tint-1 {
  color: var(--text-colors-tint-1);
}
.link--underline {
  text-decoration: underline;
  text-decoration-color: currentColor;
}
.link--prevent-next-line {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: bottom;
}
.link--multi-line-clamp {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--link-max-row-count);
}
.base-link--font-gilroy {
  font-family: var(--fonts-gilroy);
}
.base-link--font-acorn {
  font-family: var(--fonts-acorn);
}
.base-link--weight-normal {
  font-weight: normal;
}
.base-link--weight-medium {
  font-weight: 500;
}
.base-link--weight-semibold {
  font-weight: 600;
}
.base-link--weight-bold {
  font-weight: bold;
}
@keyframes standard-header-nav-slide-in {
  0% {
    max-height: 0px;
    opacity: 0;
    transform: translateX(-10px);
  }
  100% {
    max-height: 1000px;
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes standard-header-nav-slide-out {
  0% {
    max-height: 1000px;
    opacity: 1;
    transform: translateX(0);
  }
  100% {
    max-height: 0px;
    opacity: 0;
    transform: translateX(-10px);
  }
}
.standard-header-navigation {
  position: relative;
  display: grid;
  align-items: center;
  width: 100%;
  background-color: var(--positive-colors-base-default);
  transform: translateX(0);
}
.standard-header-navigation--desktop-nav {
  height: 100%;
}
.standard-header-navigation--desktop-nav::after {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  transition: width var(--timings-default) var(--easings-ease-in-out);
  content: "";
  width: 0;
  background-color: var(--primary-colors-base-active-action);
}
.standard-header-navigation--desktop-nav::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  transition: width var(--timings-default) var(--easings-ease-in-out);
  content: "";
  width: 0;
  background-color: var(--primary-colors-base-active);
}
.standard-header-navigation--desktop-nav:hover::before {
  width: 100%;
}
.standard-header-navigation--burger {
  height: 48px;
}
.standard-header-navigation--active::after {
  width: 100%;
}
.standard-header-navigation__navigation-item {
  display: flex;
  align-items: center;
  gap: var(--spacings-s8);
  height: 100%;
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
  color: var(--text-colors-base);
  transition: color var(--timings-default) var(--easings-ease-in-out);
}
.standard-header-navigation__navigation-item--desktop-nav {
  justify-content: center;
}
.standard-header-navigation__navigation-item--burger {
  justify-content: start;
}
.standard-header-navigation__navigation-item--burger:hover {
  color: var(--primary-colors-base-active);
}
.standard-header-navigation__arrow--burger {
  margin-inline-start: auto;
  transform: rotate(90deg);
}
.standard-header-navigation__arrow-active {
  transform: rotate(0deg);
  transition: transform var(--timings-default) var(--easings-ease-in-out);
}
.standard-header-navigation__arrow-default {
  transform: rotate(180deg);
}
.standard-header-navigation__list-heading-article {
  height: 100%;
}
.standard-header-navigation__navigation-item-link {
  height: 100%;
}
.standard-header-navigation__mobile-navigation-content {
  overflow: hidden;
  max-height: 0px;
  opacity: 0;
  transform: translateY(-10px);
  transition: max-height var(--timings-default) var(--easings-ease-in-out), opacity var(--timings-default) var(--easings-ease-in-out), transform var(--timings-default) var(--easings-ease-in-out);
  background-color: var(--positive-colors-base-default);
  border-top: 1px solid rgba(var(--text-colors-base), 0.125);
  padding: var(--spacings-s16);
}
.standard-header-navigation__mobile-navigation-content--open {
  max-height: 1000px;
  opacity: 1;
  transform: translateY(0);
}
.standard-header-navigation__burger-menu-content {
  position: absolute;
  top: var(--standard-header-header-height);
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  max-height: 1000px;
  opacity: 1;
  z-index: 99;
  transform: translateX(0);
  transition: max-height var(--timings-default) var(--easings-ease-in-out), opacity var(--timings-default) var(--easings-ease-in-out), transform var(--timings-default) var(--easings-ease-in-out);
  background-color: var(--positive-colors-base-default);
  border-top: 1px solid rgba(var(--text-colors-base), 0.125);
  padding: var(--spacings-s16);
  animation: standard-header-nav-slide-in var(--timings-default) var(--easings-ease-in-out);
}
.standard-header-navigation__burger-menu-content--closing {
  max-height: 0px;
  opacity: 0;
  transform: translateX(-10px);
}
.standard-header-navigation__portal-content-closing {
  animation: standard-header-nav-slide-out var(--timings-default) var(--easings-ease-in-out) forwards;
}
.standard-header-navigation-content {
  position: fixed;
  top: var(--standard-header-navigation-content-top);
  left: var(--spacings-s0);
  display: grid;
  align-items: start;
  width: var(--standard-header-navigation-content-width);
  height: 100%;
  overscroll-behavior: none;
  z-index: 1000;
}
.standard-header-navigation-content--with-overflow {
  overflow: auto;
}
.standard-header-navigation-content--with-pseudo::after {
  content: "";
  width: 100%;
  height: 100vh;
  background-color: var(--background-colors-transparent);
}
.standard-header-navigation-content__content {
  position: absolute;
  max-height: var(--standard-header-navigation-content-max-height);
  display: grid;
  width: 100%;
  background-color: var(--positive-colors-base-default);
  overflow: auto;
  overscroll-behavior: none;
}
.standard-header-navigation-content__content-wrapper {
  display: flex;
  height: 100%;
}
.standard-header-navigation-content__content-wrapper--desktop {
  gap: var(--spacings-s40);
  flex-direction: row;
}
.standard-header-navigation-content__content-wrapper--mobile {
  gap: var(--spacings-s16);
  flex-direction: column;
}
.standard-header-nav-content-item {
  --icon-size: 36px;
  display: flex;
  flex-direction: column;
  gap: var(--spacings-s4);
}
.standard-header-nav-content-item:last-child {
  padding-inline-end: 0;
}
.standard-header-nav-content-item--desktop {
  margin-block: var(--spacings-s48);
  padding-inline-end: var(--spacings-s40);
}
.standard-header-nav-content-item--desktop:not(:last-child) {
  border-right: 1px solid var(--background-colors-tint-3);
}
.standard-header-nav-content-item--burger {
  padding-block-start: var(--spacings-s24);
}
.standard-header-nav-content-item--burger:not(:last-child) {
  border-bottom: 1px solid var(--background-colors-tint-3);
}
.standard-header-nav-content-item__list-container {
  display: flex;
}
.standard-header-nav-content-item__list-container--desktop {
  gap: var(--spacings-s48);
  flex-direction: row;
}
.standard-header-nav-content-item__list-container--burger {
  gap: var(--spacings-s16);
  flex-direction: column;
  margin-block: var(--spacings-s24);
}
.standard-header-nav-content-item__list-item-containers-wrapper {
  display: flex;
}
@media screen and (min-width: 1366px) and (max-width: 1599px) {
  .standard-header-nav-content-item__list-item-containers-wrapper {
    flex-direction: column;
  }
}
.standard-header-nav-content-item__list-item-containers-wrapper--desktop {
  gap: var(--spacings-s48);
  flex-direction: row;
}
.standard-header-nav-content-item__list-item-containers-wrapper--burger {
  gap: var(--spacings-s24);
  flex-direction: column;
}
.standard-header-nav-content-item__column-group {
  display: flex;
  flex-direction: column;
  gap: var(--spacings-s24);
}
.standard-header-nav-content-item__content {
  display: flex;
  flex-direction: column;
}
.standard-header-nav-content-item__content--burger {
  margin-inline: 0;
}
.standard-header-nav-content-item__subtitle--desktop {
  margin-top: var(--spacings-s4);
}
.standard-header-nav-content-item__subtitle--burger {
  margin-top: var(--spacings-s8);
}
.standard-header-nav-content-item__list-item-container {
  display: flex;
  flex-direction: column;
}
.standard-header-nav-content-item__list-heading-item {
  display: grid;
  grid-auto-flow: column;
  justify-content: start;
  align-items: center;
  color: var(--text-colors-base);
}
.standard-header-nav-content-item__list-heading-item--desktop {
  grid-template-columns: auto 1fr;
  margin-top: var(--spacings-s40);
  margin-bottom: var(--spacings-s10);
}
.standard-header-nav-content-item__list-heading-item--burger {
  grid-template-columns: 1fr;
  margin-top: var(--spacings-s0);
}
.standard-header-nav-content-item__list-heading-title {
  display: flex;
  align-items: center;
  grid-row: 1;
}
.standard-header-nav-content-item__list-heading-title--desktop {
  margin-inline-start: var(--spacings-s12);
  max-width: 250px;
}
.standard-header-nav-content-item__list-heading-title--burger {
  max-width: 100%;
  height: 40px;
}
.standard-header-nav-content-item__list-heading-description {
  grid-row: 2;
  margin-top: var(--spacings-s12);
  margin-bottom: var(--spacings-s12);
}
.standard-header-nav-content-item__list-heading-description--desktop {
  max-width: 200px;
  margin-inline-start: var(--spacings-s12);
}
.standard-header-nav-content-item__list-heading-description--burger {
  max-width: 100%;
}
.standard-header-nav-content-item__list-heading-article {
  grid-row: 4;
  object-fit: cover;
  border-radius: var(--corner-radius-r16);
  padding: var(--spacings-s16);
  background-color: var(--background-colors-tint-1);
  border: 1px solid var(--background-colors-tint-2);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: border var(--timings-fast) var(--easings-ease-in-out);
}
.standard-header-nav-content-item__list-heading-article:hover {
  border: 1px solid var(--primary-colors-base-action);
  cursor: pointer;
}
.standard-header-nav-content-item__list-heading-article--desktop {
  width: 274px;
}
.standard-header-nav-content-item__list-heading-article--burger {
  width: 100%;
}
.standard-header-nav-content-item__list-heading-article-image {
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: var(--corner-radius-r8);
}
.standard-header-nav-content-item__list-heading-article-image--desktop {
  width: 240px;
}
.standard-header-nav-content-item__list-heading-article-image--burger {
  width: 100%;
}
.standard-header-nav-content-item__multiple-lists-container {
  display: flex;
}
@media screen and (min-width: 1280px) and (max-width: 1365px) {
  .standard-header-nav-content-item__multiple-lists-container {
    flex-direction: column;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1279px) {
  .standard-header-nav-content-item__multiple-lists-container {
    flex-direction: column;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .standard-header-nav-content-item__multiple-lists-container {
    flex-direction: column;
  }
}
@media screen and (min-width: 480px) and (max-width: 767px) {
  .standard-header-nav-content-item__multiple-lists-container {
    flex-direction: column;
  }
}
@media screen and (max-width: 479px) {
  .standard-header-nav-content-item__multiple-lists-container {
    flex-direction: column;
  }
}
.standard-header-nav-content-item__list-heading-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--icon-size);
  height: var(--icon-size);
  background-color: rgba(194, 9, 193, 0.2);
  border-radius: var(--corner-radius-circle);
  padding: var(--spacings-s4);
  color: var(--primary-colors-base-default);
}
.standard-header-nav-content-item__list-heading-icon svg path {
  fill: currentColor;
}
.standard-header-nav-content-item__list {
  align-items: start;
  height: max-content;
}
.standard-header-nav-content-item__list--desktop {
  margin-inline-start: calc(var(--icon-size) + 12px);
}
.standard-header-nav-content-item__see-all-link {
  display: flex;
  align-items: center;
  width: max-content;
  color: var(--primary-colors-base-default);
  margin-top: var(--spacings-s16);
  font-weight: 600;
  height: 32px;
}
.standard-header-nav-content-item__see-all-link:hover {
  color: var(--primary-colors-base-action);
}
.standard-header-nav-content-item__see-all-link--desktop {
  margin-inline-start: calc(var(--icon-size) + 12px);
}
.standard-header-nav-content-item__list-item {
  display: flex;
  align-items: center;
  height: max-content;
  gap: var(--spacings-s8);
  margin-block: var(--spacings-s8);
}
.standard-header-nav-content-item__link {
  color: var(--text-colors-base);
  transition: color var(--timings-fast) var(--easings-ease-in-out);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  flex-shrink: 1;
}
.standard-header-nav-content-item__link:hover {
  color: var(--primary-colors-base-default);
}
.standard-header-nav-content-item__list-heading-image-text {
  margin-top: var(--spacings-s16);
}
.standard-header-nav-content-item__divider {
  background: var(--background-colors-tint-3);
  align-self: stretch;
}
.standard-header-nav-content-item__divider--desktop {
  width: 1px;
  height: auto;
  margin: 0 var(--spacings-s16);
}
.standard-header-nav-content-item__divider--burger {
  width: 100%;
  height: 1px;
  margin: var(--spacings-s16) 0;
}
.standard-header-nav-content-item__list-heading-image-content {
  display: flex;
  flex-direction: column;
}
.standard-header-nav-content-item__banners-container {
  display: flex;
  align-items: center;
  min-height: 56px;
  gap: var(--spacings-s12);
}
.standard-header-nav-content-item__banners-container--desktop {
  max-width: 440px;
  margin-top: var(--spacings-s32);
  flex-direction: row;
}
.standard-header-nav-content-item__banners-container--burger {
  max-width: 100%;
  margin-top: var(--spacings-s16);
  flex-direction: column;
}
.standard-header-nav-content-item__banner-card {
  display: flex;
  flex-basis: 50%;
  align-items: center;
  padding-inline: var(--spacings-s16);
  padding-block: var(--spacings-s8);
  width: 100%;
  height: 100%;
  background-color: var(--background-colors-base);
  border: 1px solid var(--background-colors-tint-2);
  border-radius: var(--corner-radius-r8);
  text-decoration: none;
  transition: border var(--timings-fast) var(--easings-ease-in-out);
}
.standard-header-nav-content-item__banner-card:hover {
  border: 1px solid var(--primary-colors-base-action);
  cursor: pointer;
}
.standard-header-nav-content-item__banner-card--desktop {
  flex: 1;
}
.standard-header-nav-content-item__banner-card--burger {
  flex: none;
}
.standard-header-nav-content-item__banner-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: var(--primary-colors-base-default);
}
.standard-header-nav-content-item__banner-icon svg path {
  fill: currentColor;
}
.standard-header-nav-content-item__banner-content {
  display: flex;
  flex-direction: column;
  margin-inline-start: var(--spacings-s12);
}
.standard-header-nav-content-item__banner-title {
  color: var(--text-colors-base);
  font-weight: 600;
}
.standard-header-nav-content-item__banner-index {
  color: var(--text-colors-tint-1);
  font-weight: 500;
  margin-bottom: var(--spacings-s4);
}
.standard-header-nav-content-item__banner-description {
  color: var(--text-colors-tint-1);
  font-weight: 500;
}
.list {
  display: grid;
  list-style-type: none;
}

.list-item {
  min-width: 0;
  min-height: 0;
}
.tooltip {
  position: relative;
  background-color: var(--tooltip-bg-color);
  color: var(--negative-colors-text-default);
  box-shadow: var(--shadows-tint-1);
  border-radius: var(--corner-radius-r8);
  font-weight: 600;
  z-index: var(--tooltip-z-index);
  font-size: var(--typography-t3-font-size);
  line-height: var(--typography-t3-line-height);
}
.tooltip[data-placement$=-start] {
  transform: translateX(10px);
}
.tooltip[data-placement$=-end] {
  transform: translateX(-10px);
}
.tooltip--not-clickable {
  pointer-events: none;
}
.tooltip__wrapper[data-placement^=top], .tooltip__wrapper[data-placement^=bottom], .tooltip__wrapper[data-placement^=auto] {
  padding: 10px 0;
}
.tooltip__wrapper[data-placement^=left], .tooltip__wrapper[data-placement^=right] {
  padding: 0 10px;
}
.tooltip__content {
  padding: var(--spacings-s8) var(--spacings-s12);
  color: var(--negative-colors-text-default);
}
.tooltip__content .text {
  color: var(--negative-colors-text-default);
}
.tooltip__indicator-wrapper {
  position: absolute;
  width: 20px;
  height: 13px;
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=top] {
  bottom: -12px;
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=right] {
  left: -12px;
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=bottom] {
  top: -12px;
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=left] {
  right: -12px;
}
.tooltip__indicator-wrapper svg {
  transform: translateY(-0.0125em);
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=right] svg {
  transform: rotate(90deg);
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=bottom] svg {
  transform: scaleY(-1);
}
.tooltip__indicator-wrapper[data-arrow-wrapper-dir^=left] svg {
  transform: rotate(-90deg);
}
.tooltip__indicator {
  width: 20px;
  height: 13px;
  pointer-events: none;
}
.tooltip__indicator path:first-of-type,
.tooltip__indicator path:last-of-type {
  fill: var(--tooltip-bg-color);
}
.standard-header-user-actions--desktop {
  margin-inline-start: var(--spacings-s16);
}
.standard-header-user-actions--mobile {
  margin-inline-start: var(--spacings-s0);
}
.suggestion-menu {
  position: fixed;
  background-color: var(--background-colors-popover);
  border: 1px solid var(--control-colors-border-default);
  border-radius: var(--corner-radius-r8);
  overflow: auto;
  padding: var(--spacings-s12);
  max-height: var(--sm-max-height, none);
  min-width: var(--sm-min-width, auto);
  width: var(--sm-width, auto);
  z-index: var(--sm-z-index);
  top: var(--sm-top);
}
@media (pointer: fine) {
  .suggestion-menu::-webkit-scrollbar {
    width: 4px;
  }
  .suggestion-menu::-webkit-scrollbar-track {
    border-radius: var(--corner-radius-r4);
    background-color: transparent;
  }
  .suggestion-menu::-webkit-scrollbar-thumb {
    border-radius: var(--corner-radius-r4);
    background-color: var(--background-colors-border);
  }
  .suggestion-menu::-webkit-scrollbar-corner {
    background: transparent;
  }
}
@supports (-moz-appearance: none) {
  .suggestion-menu {
    scrollbar-color: var(--background-colors-border) transparent;
    scrollbar-width: thin;
  }
}
@media (pointer: coarse) {
  .suggestion-menu::-webkit-scrollbar {
    display: none;
  }
}
.suggestion-menu--small {
  border-width: 1px;
  border-radius: var(--corner-radius-r8);
}
[dir=ltr] .suggestion-menu {
  left: var(--sm-left-ltr);
}
[dir=rtl] .suggestion-menu {
  left: var(--sm-left-rtl, auto);
  right: var(--sm-right-rtl, auto);
}
.suggestion-menu--disabled {
  opacity: var(--states-disabled);
  pointer-events: none;
}
.bottom-sheet__content {
  display: grid;
  grid-template-rows: auto 1fr auto;
  height: 100%;
  min-height: 0;
}
.bottom-sheet__header {
  position: sticky;
  top: 0;
  padding: var(--spacings-s0) var(--spacings-s16) var(--spacings-s8) var(--spacings-s16);
  background-color: var(--background-colors-base);
}
.bottom-sheet__body {
  padding: var(--spacings-s0) var(--spacings-s16);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  scrollbar-gutter: stable both-edges;
}
.bottom-sheet__footer {
  position: sticky;
  bottom: 0;
  padding: var(--spacings-s0) var(--spacings-s16);
  background-color: var(--background-colors-base);
}
.base-bottom-sheet {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: var(--bbs-z-index, 9);
  width: 100%;
  border-radius: var(--corner-radius-r16);
  background-color: var(--background-colors-base);
  isolation: isolate;
  transform-origin: bottom;
  will-change: transform, height;
  transition-property: transform, opacity, max-height;
  transition-duration: 0.25s;
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}
.base-bottom-sheet--static {
  padding-top: var(--spacings-s12);
  border-radius: var(--corner-radius-r0);
}
.base-bottom-sheet--full-height {
  border-radius: var(--corner-radius-r0);
}
.base-bottom-sheet--open {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.base-bottom-sheet--dragging {
  transition-duration: 0s;
}
.base-bottom-sheet__touch-area {
  display: grid;
  place-content: center;
  position: relative;
  height: 12px;
  border-radius: var(--corner-radius-r16) var(--corner-radius-r16) var(--corner-radius-r0) var(--corner-radius-r0);
  background-color: var(--background-colors-base);
}
.base-bottom-sheet--full-height .base-bottom-sheet__touch-area {
  border-radius: var(--corner-radius-r0);
}
.base-bottom-sheet__touch-area::before {
  content: "";
  position: absolute;
  left: 50%;
  z-index: calc(var(--bbs-z-index, 9) + 1);
  width: 100%;
  max-width: 80%;
  height: 44px;
  background-color: transparent;
  translate: -50%;
  transform: translateY(0px);
}
.base-bottom-sheet--open .base-bottom-sheet__touch-area::before {
  transform: translateY(-45%);
}
.base-bottom-sheet__touch-area::after {
  content: "";
  width: 32px;
  height: 4px;
  border-radius: var(--corner-radius-r4);
  background-color: var(--background-colors-tint-3);
}
.base-bottom-sheet__overlay {
  position: absolute;
  top: 12px;
  z-index: -1;
  width: 100%;
  height: 105%;
  background-color: var(--background-colors-transparent);
  opacity: var(--bbs-overlay-opacity, 0);
  transform: translateY(-100%);
  transition: opacity var(--timings-default) var(--easings-ease);
  user-select: none;
}
.base-bottom-sheet--static .base-bottom-sheet__overlay {
  top: 0;
}
.base-bottom-sheet__content {
  height: 100%;
  contain: layout;
  touch-action: pan-y;
}
.base-bottom-sheet__content--with-bg-effect::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 0;
  width: 100%;
  max-height: 100%;
  height: auto;
  aspect-ratio: 1/1;
  background: var(--effects-vignette);
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.base-bottom-sheet--enter {
  opacity: 0;
}
.base-bottom-sheet--enter-active {
  opacity: 1;
  transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1), max-height 0.25s cubic-bezier(0, 0, 0.2, 1);
}
.base-bottom-sheet--exit {
  opacity: 1;
}
.base-bottom-sheet--exit-active {
  opacity: 0;
  transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1), max-height 0.25s cubic-bezier(0.4, 0, 1, 1);
}
.footer-basic-link__navigation-link {
  display: inline-flex;
  padding: var(--spacings-s12) 0;
}
@media (hover: hover) and (pointer: fine) {
  .footer-basic-link__navigation-link:hover {
    color: var(--primary-colors-base-default);
  }
  .footer-basic-link__navigation-link:active {
    color: var(--primary-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .footer-basic-link__navigation-link:active {
    color: var(--primary-colors-base-action);
  }
}
.standard-footer-basic {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  gap: var(--spacings-s24);
  padding: var(--spacings-s24);
  background-color: var(--positive-colors-base-default);
}
.standard-footer-basic__select-wrapper {
  width: 196px;
}
.standard-footer-basic__top-content {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: var(--spacings-s24);
  row-gap: var(--spacings-s2);
  list-style: none;
}
.standard-footer-basic__navigation-link {
  display: inline-flex;
  padding: var(--spacings-s12) 0;
}
.accordion {
  width: 300px;
  overflow: hidden;
  transition: border-color var(--timings-default) var(--easings-ease), opacity var(--timings-default) var(--easings-ease);
  --border-color: var(--control-colors-border-default);
  --border-color-hover: var(--control-colors-border-action);
  --border-color-active: var(--control-colors-border-active);
  --border-color-active-hover: var(--control-colors-border-active-action);
  --toggle-bg-color: var(--control-colors-button-background-default);
  --toggle-bg-color-hover: var(--control-colors-button-background-action);
  --toggle-bg-color-active: var(--control-colors-button-background-active);
  --toggle-bg-color-active-hover: var(--control-colors-button-background-active-action);
  --accordion-content-bg: var(--background-colors-base);
  --toggle-text-color: var(--control-colors-text-default);
  --toggle-start-icon-color: var(--control-colors-start-icon-default);
  --toggle-end-icon-color: var(--control-colors-end-icon-default);
}
.accordion--large {
  --acc-border-w: 1px;
  --acc-border-r: var(--corner-radius-r8);
  --acc-toggle-h: 40px;
  --acc-pad-v: var(--spacings-s10);
  --acc-pad-h: var(--spacings-s10);
  --acc-gap: var(--spacings-s2);
  --acc-icon-size: 20px;
  --acc-title-pad-h: var(--spacings-s2);
  --acc-title-pad-v: var(--spacings-s0);
  --acc-badge-pad: var(--spacings-s2);
  --acc-content-pad: var(--spacings-s12);
}
.accordion--small {
  --acc-border-w: 1px;
  --acc-border-r: var(--corner-radius-r8);
  --acc-toggle-h: 32px;
  --acc-pad-v: var(--spacings-s6);
  --acc-pad-h: var(--spacings-s6);
  --acc-gap: var(--spacings-s2);
  --acc-icon-size: 20px;
  --acc-title-pad-h: var(--spacings-s2);
  --acc-title-pad-v: var(--spacings-s0);
  --acc-badge-pad: var(--spacings-s2);
  --acc-content-pad: var(--acc-pad-h);
}
@media (hover: hover) and (pointer: fine) {
  .accordion:hover {
    --toggle-text-color: var(--control-colors-text-action);
    --toggle-start-icon-color: var(--control-colors-start-icon-action);
    --toggle-end-icon-color: var(--control-colors-end-icon-action);
    --border-color: var(--border-color-hover);
    --toggle-bg-color: var(--toggle-bg-color-hover);
  }
}
.accordion[data-is-disabled] {
  pointer-events: none;
}
.accordion--with-border {
  border: var(--acc-border-w) solid var(--border-color);
  border-radius: var(--acc-border-r);
}
.accordion--without-border {
  border: none;
  border-radius: 0;
  --border-color: none;
  --toggle-bg-color: transparent;
  --border-color-hover: none;
  --toggle-bg-color-hover: transparent;
  --border-color-active: none;
  --toggle-bg-color-active: transparent;
  --border-color-active-hover: transparent;
  --toggle-bg-color-active-hover: transparent;
  --accordion-content-bg: transparent;
}
.accordion--disabled {
  opacity: var(--states-disabled);
}
.accordion--toggle-br-expanded {
  --toggle-br: calc(var(--acc-border-r) - var(--acc-border-w)) calc(var(--acc-border-r) - var(--acc-border-w)) 0 0;
}
.accordion--toggle-br-collapsed {
  --toggle-br: calc(var(--acc-border-r) - var(--acc-border-w));
}
.accordion--active {
  --toggle-bg-color: var(--toggle-bg-color-active);
  --toggle-text-color: var(--control-colors-text-active);
  --toggle-start-icon-color: var(--control-colors-start-icon-active);
  --toggle-end-icon-color: var(--control-colors-end-icon-active);
  --border-color: var(--border-color-active);
}
@media (hover: hover) and (pointer: fine) {
  .accordion--active:hover {
    --toggle-text-color: var(--control-colors-text-active-action);
    --toggle-start-icon-color: var(--control-colors-start-icon-active-action);
    --toggle-end-icon-color: var(--control-colors-end-icon-active-action);
    --border-color: var(--border-color-active-hover);
    --toggle-bg-color: var(--toggle-bg-color-active-hover);
  }
}
.accordion__toggle {
  width: 100%;
  background-color: var(--toggle-bg-color);
  color: var(--text-colors-base);
  cursor: pointer;
  display: flex;
  align-items: center;
  outline: none;
  transition: background-color var(--timings-default) var(--easings-ease);
  border: none;
  min-height: var(--acc-toggle-h);
  padding: calc(var(--acc-pad-v) - var(--acc-border-w)) calc(var(--acc-pad-h) - var(--acc-border-w));
  gap: var(--acc-gap);
  border-radius: var(--toggle-br);
}
.accordion__toggle--no-gap {
  gap: 0;
}
.accordion__toggle[disabled] {
  pointer-events: none;
}
.accordion__content-holder {
  display: flex;
  align-items: center;
  flex: auto;
  gap: var(--acc-gap);
  min-width: 0;
  height: var(--acc-icon-size, 100%);
}
.accordion__title-container {
  padding: var(--acc-title-pad-v) var(--acc-title-pad-h);
  min-width: 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.accordion__start-icon {
  flex-shrink: 0;
  width: var(--acc-icon-size);
  height: var(--acc-icon-size);
  color: var(--toggle-start-icon-color, var(--control-colors-start-icon-default));
  transition: color var(--timings-default) var(--easings-ease);
}
.accordion__start-icon path:not([fill]) {
  fill: currentColor;
}
.accordion__badge {
  margin: var(--acc-badge-pad);
  flex-shrink: 0;
}
.accordion__checkbox-button {
  margin: 0;
  margin-inline-start: auto;
  flex-shrink: 0;
  height: var(--acc-icon-size);
}
.accordion__badge-wrapper {
  display: flex;
  align-items: center;
  height: calc(var(--acc-toggle-h) - var(--acc-pad-v) * 2);
}
.accordion__toggle-icon {
  display: inline-block;
  width: var(--acc-icon-size);
  height: var(--acc-icon-size);
  flex-shrink: 0;
  margin-inline-start: auto;
  color: var(--toggle-end-icon-color, var(--control-colors-end-icon-default));
  transition: color var(--timings-default) var(--easings-ease), transform var(--timings-default) var(--easings-ease);
}
.accordion__toggle-icon path {
  fill: currentColor;
}
.accordion__toggle-icon--with-switch {
  margin-inline-start: 4px;
}
.accordion__toggle-icon--expanded {
  transform: rotate(180deg);
}
.accordion__title {
  text-align: left;
  word-break: break-word;
  color: var(--toggle-text-color);
  transition: color var(--timings-default) var(--easings-ease);
}
.accordion__content {
  display: grid;
  border-radius: 0 0 calc(var(--acc-border-r) - var(--acc-border-w)) calc(var(--acc-border-r) - var(--acc-border-w));
  overflow: hidden;
  background-color: var(--accordion-content-bg);
}
.accordion__active-indicator {
  display: grid;
  grid-area: 1/1;
}
.accordion__active-indicator::before {
  content: "";
  height: var(--acc-border-w);
  background: var(--border-color);
}
.accordion__content-wrap {
  padding: var(--acc-content-pad);
  grid-area: 1/1;
  min-width: 0;
}
.accordion--without-border .accordion__content-wrap {
  padding: 2px 0 var(--acc-content-pad) 0;
}
.switch {
  display: inline-block;
  vertical-align: top;
  align-items: center;
  position: relative;
  width: 34px;
  height: 32px;
  overflow: hidden;
}
.switch::before {
  content: "";
  display: inline-block;
  width: 100%;
  height: 20px;
  border-radius: var(--corner-radius-r24);
  transition: background-color var(--timings-default) var(--easings-ease);
  position: absolute;
  top: 50%;
  left: var(--spacings-s0);
  right: var(--spacings-s0);
  transform: translateY(-50%);
  pointer-events: none;
}
.switch::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: var(--corner-radius-circle);
  background-color: var(--positive-colors-base-default);
  box-shadow: var(--shadows-tint-1);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: transform var(--timings-default) var(--easings-ease);
  pointer-events: none;
}
.switch__control {
  display: inline-block;
  vertical-align: top;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: var(--spacings-s0);
  cursor: pointer;
}
.switch__control--disabled {
  cursor: not-allowed;
}
.switch--unchecked::before {
  background-color: var(--background-colors-tint-3);
}
.switch--skin-primary.switch--checked::before {
  background-color: var(--primary-colors-base-default);
}
.switch--skin-premium.switch--checked::before {
  background-color: var(--monetization-ultra-colors-base-default);
}
@media (hover: hover) and (pointer: fine) {
  .switch--unchecked-interaction:hover::before {
    background-color: var(--control-colors-text-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .switch--unchecked-interaction:active::before {
    background-color: var(--control-colors-text-action);
  }
}
@media (hover: hover) and (pointer: fine) {
  .switch--skin-primary.switch--checked-interaction:hover::before {
    background-color: var(--primary-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .switch--skin-primary.switch--checked-interaction:active::before {
    background-color: var(--primary-colors-base-action);
  }
}
@media (hover: hover) and (pointer: fine) {
  .switch--skin-premium.switch--checked-interaction:hover::before {
    background-color: var(--monetization-ultra-colors-base-action);
  }
}
@media (hover: none) and (pointer: coarse) {
  .switch--skin-premium.switch--checked-interaction:active::before {
    background-color: var(--monetization-ultra-colors-base-action);
  }
}
.switch--disabled {
  opacity: var(--states-disabled);
}

[dir=ltr] .switch::after {
  left: var(--spacings-s2);
}

[dir=rtl] .switch::after {
  right: calc(-1 * var(--spacings-s2));
}

[dir=ltr] .switch--checked::after {
  transform: translateX(calc(100% - var(--spacings-s2))) translateY(-50%);
  left: var(--spacings-s2);
}

[dir=rtl] .switch--checked::after {
  transform: translateX(calc(-100% + var(--spacings-s2))) translateY(-50%);
  right: var(--spacings-s2);
}


/*# sourceMappingURL=main-1782125591378.css.map*/