@vkontakte/vkui 5.3.2 → 5.4.1

package/dist/cssm/components/Button/Button.module.css

@@ -1 +1,676 @@
-.vkuiButton{border:none;border-radius:8px;border-radius:var(--vkui--size_border_radius--regular);box-sizing:border-box;display:inline-block;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);margin:0;max-width:100%;min-height:28px;min-height:var(--vkui--size_button_small_height--compact);min-width:80px;min-width:var(--vkui--size_button_minimum_width--regular);padding:0;position:relative;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.vkuiButton--loading{cursor:progress}.vkuiButton--singleIcon{min-width:auto;width:28px;width:var(--vkui--size_button_small_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--singleIcon{width:30px;width:var(--vkui--size_button_small_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--singleIcon{width:30px;width:var(--vkui--size_button_small_height--regular)}}.vkuiButton--stretched{display:block;flex-basis:0;flex-grow:1;width:100%}.vkuiButton__in{align-items:center;box-sizing:border-box;display:flex;font-family:-apple-system,system-ui,Helvetica Neue,Roboto,sans-serif;font-family:var(--vkui--font_family_base);justify-content:center;min-height:inherit;text-align:center;width:100%}.vkuiButton--align-left .vkuiButton__in{justify-content:flex-start;text-align:left}.vkuiButton--align-right .vkuiButton__in{justify-content:flex-end;text-align:right}.vkuiButton[disabled]{opacity:.4;opacity:var(--vkui--opacity_disable)}.vkuiButton--mode-outline[disabled]:not(.vkuiButton--appearance-overlay),.vkuiButton--mode-primary[disabled]:not(.vkuiButton--appearance-overlay):not(.vkuiButton--appearance-negative):not(.vkuiButton--appearance-positive),.vkuiButton--mode-secondary[disabled]:not(.vkuiButton--appearance-overlay),.vkuiButton--mode-tertiary[disabled]:not(.vkuiButton--appearance-overlay){opacity:.64}.vkuiButton__content{font-weight:500;font-weight:var(--vkui--font_weight_accent2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vkuiButton--size-s .vkuiButton__content:first-child{padding-left:16px;padding-left:var(--vkui--size_button_base_small_padding_horizontal--regular)}.vkuiButton--size-s .vkuiButton__after,.vkuiButton--size-s .vkuiButton__content:last-child{padding-right:16px;padding-right:var(--vkui--size_button_base_small_padding_horizontal--regular)}.vkuiButton--size-m .vkuiButton__content:first-child{padding-left:16px;padding-left:var(--vkui--size_button_base_medium_padding_horizontal--regular)}.vkuiButton--size-m .vkuiButton__after,.vkuiButton--size-m .vkuiButton__content:last-child{padding-right:16px;padding-right:var(--vkui--size_button_base_medium_padding_horizontal--regular)}.vkuiButton--size-l .vkuiButton__content:first-child{padding-left:20px;padding-left:var(--vkui--size_button_base_large_padding_horizontal--regular)}.vkuiButton--size-l .vkuiButton__after,.vkuiButton--size-l .vkuiButton__content:last-child{padding-right:20px;padding-right:var(--vkui--size_button_base_large_padding_horizontal--regular)}.vkuiButton--size-s .vkuiButton__before{padding-left:12px;padding-left:var(--vkui--size_button_base_small_padding_horizontal_icon--regular)}.vkuiButton--size-m .vkuiButton__before{padding-left:12px;padding-left:var(--vkui--size_button_base_medium_padding_horizontal_icon--regular)}.vkuiButton--size-l .vkuiButton__before{padding-left:16px;padding-left:var(--vkui--size_button_base_large_padding_horizontal_icon--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-s .vkuiButton__content:first-child{padding-left:12px;padding-left:var(--vkui--size_button_tertiary_small_padding_horizontal--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-s .vkuiButton__after,.vkuiButton--mode-tertiary.vkuiButton--size-s .vkuiButton__content:last-child{padding-right:12px;padding-right:var(--vkui--size_button_tertiary_small_padding_horizontal--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-m .vkuiButton__content:first-child{padding-left:12px;padding-left:var(--vkui--size_button_tertiary_medium_padding_horizontal--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-m .vkuiButton__after,.vkuiButton--mode-tertiary.vkuiButton--size-m .vkuiButton__content:last-child{padding-right:12px;padding-right:var(--vkui--size_button_tertiary_medium_padding_horizontal--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-l .vkuiButton__content:first-child{padding-left:16px;padding-left:var(--vkui--size_button_tertiary_large_padding_horizontal--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-l .vkuiButton__after,.vkuiButton--mode-tertiary.vkuiButton--size-l .vkuiButton__content:last-child{padding-right:16px;padding-right:var(--vkui--size_button_tertiary_large_padding_horizontal--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-s .vkuiButton__before{padding-left:8px;padding-left:var(--vkui--size_button_tertiary_small_padding_horizontal_icon--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-m .vkuiButton__before{padding-left:8px;padding-left:var(--vkui--size_button_tertiary_medium_padding_horizontal_icon--regular)}.vkuiButton--mode-tertiary.vkuiButton--size-l .vkuiButton__before{padding-left:12px;padding-left:var(--vkui--size_button_tertiary_large_padding_horizontal_icon--regular)}.vkuiButton--mode-tertiary.vkuiButton--singleIcon .vkuiButton__after,.vkuiButton--mode-tertiary.vkuiButton--singleIcon .vkuiButton__before,.vkuiButton--singleIcon .vkuiButton__after,.vkuiButton--singleIcon .vkuiButton__before{margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}.vkuiButton--mode-link{background:none;min-width:auto}.vkuiButton--mode-link .vkuiButton__after,.vkuiButton--mode-link .vkuiButton__before,.vkuiButton--mode-link .vkuiButton__content:first-child,.vkuiButton--mode-link .vkuiButton__content:last-child{padding-left:0;padding-right:0}.vkuiButton__spinner{bottom:0;left:0;position:absolute;right:0;top:0}.vkuiButton__spinner+.vkuiButton__in{visibility:hidden}.vkuiButton--mode-primary.vkuiButton--appearance-accent{background-color:#2688eb;background-color:var(--vkui--color_background_accent_themed)}.vkuiButton--mode-primary.vkuiButton--appearance-accent.vkuiButton--hover{background-color:#2483e4;background-color:var(--vkui--color_background_accent_themed--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-accent.vkuiButton--active{background-color:#237edd;background-color:var(--vkui--color_background_accent_themed--active)}.vkuiButton--mode-primary.vkuiButton--appearance-positive{background-color:#4bb34b;background-color:var(--vkui--color_background_positive)}.vkuiButton--mode-primary.vkuiButton--appearance-positive.vkuiButton--hover{background-color:#48ac4a;background-color:var(--vkui--color_background_positive--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-positive.vkuiButton--active{background-color:#45a64a;background-color:var(--vkui--color_background_positive--active)}.vkuiButton--mode-primary.vkuiButton--appearance-negative{background-color:#e64646;background-color:var(--vkui--color_background_negative)}.vkuiButton--mode-primary.vkuiButton--appearance-negative.vkuiButton--hover{background-color:#dd4446;background-color:var(--vkui--color_background_negative--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-negative.vkuiButton--active{background-color:#d44245;background-color:var(--vkui--color_background_negative--active)}.vkuiButton--mode-primary.vkuiButton--appearance-neutral{background-color:#f5f5f5;background-color:var(--vkui--color_background_secondary)}.vkuiButton--mode-primary.vkuiButton--appearance-neutral.vkuiButton--hover{background-color:#ebecee;background-color:var(--vkui--color_background_secondary--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-neutral.vkuiButton--active{background-color:#e1e3e6;background-color:var(--vkui--color_background_secondary--active)}.vkuiButton--mode-primary.vkuiButton--appearance-accent-invariable{background-color:#2688eb;background-color:var(--vkui--color_background_accent)}.vkuiButton--mode-primary.vkuiButton--appearance-accent-invariable.vkuiButton--hover{background-color:#2483e4;background-color:var(--vkui--color_background_accent--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-accent-invariable.vkuiButton--active{background-color:#237edd;background-color:var(--vkui--color_background_accent--active)}.vkuiButton--mode-secondary{background-color:rgba(0,0,0,.04);background-color:var(--vkui--color_background_secondary_alpha)}.vkuiButton--mode-secondary.vkuiButton--hover{background-color:rgba(0,0,0,.08);background-color:var(--vkui--color_background_secondary_alpha--hover)}.vkuiButton--mode-secondary.vkuiButton--active{background-color:rgba(0,0,0,.12);background-color:var(--vkui--color_background_secondary_alpha--active)}.vkuiButton--mode-outline,.vkuiButton--mode-tertiary{background-color:initial;background-color:var(--vkui--color_transparent)}.vkuiButton--mode-outline.vkuiButton--hover,.vkuiButton--mode-tertiary.vkuiButton--hover{background-color:rgba(0,16,61,.04);background-color:var(--vkui--color_transparent--hover)}.vkuiButton--mode-outline.vkuiButton--active,.vkuiButton--mode-tertiary.vkuiButton--active{background-color:rgba(0,16,61,.08);background-color:var(--vkui--color_transparent--active)}.vkuiButton.vkuiButton--appearance-accent{color:#2688eb;color:var(--vkui--color_text_accent_themed)}.vkuiButton.vkuiButton--appearance-positive{color:#4bb34b;color:var(--vkui--color_text_positive)}.vkuiButton.vkuiButton--appearance-negative{color:#e64646;color:var(--vkui--color_text_negative)}.vkuiButton.vkuiButton--appearance-neutral{color:#000;color:var(--vkui--color_text_primary)}.vkuiButton.vkuiButton--appearance-accent-invariable{color:#2688eb;color:var(--vkui--color_text_accent)}.vkuiButton--mode-primary.vkuiButton--appearance-accent{color:#fff;color:var(--vkui--color_text_contrast_themed)}.vkuiButton--mode-primary.vkuiButton--appearance-accent-invariable,.vkuiButton--mode-primary.vkuiButton--appearance-negative,.vkuiButton--mode-primary.vkuiButton--appearance-positive{color:#fff;color:var(--vkui--color_text_contrast)}.vkuiButton--mode-link.vkuiButton--hover{opacity:.8}.vkuiButton--mode-link.vkuiButton--active{opacity:.7}.vkuiButton--mode-outline.vkuiButton--appearance-accent,.vkuiButton--mode-outline.vkuiButton--appearance-accent.vkuiButton--active,.vkuiButton--mode-outline.vkuiButton--appearance-accent.vkuiButton--hover{box-shadow:inset 0 0 0 1px #2688eb;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_accent_themed)}.vkuiButton--mode-outline.vkuiButton--appearance-positive{box-shadow:inset 0 0 0 1px #4bb34b;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_positive)}.vkuiButton--mode-outline.vkuiButton--appearance-positive.vkuiButton--hover{box-shadow:inset 0 0 0 1px #48ac4a;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_positive--hover)}.vkuiButton--mode-outline.vkuiButton--appearance-positive.vkuiButton--active{box-shadow:inset 0 0 0 1px #45a64a;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_positive--active)}.vkuiButton--mode-outline.vkuiButton--appearance-negative{box-shadow:inset 0 0 0 1px #e64646;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_negative)}.vkuiButton--mode-outline.vkuiButton--appearance-negative.vkuiButton--hover{box-shadow:inset 0 0 0 1px #dd4446;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_negative--hover)}.vkuiButton--mode-outline.vkuiButton--appearance-negative.vkuiButton--active{box-shadow:inset 0 0 0 1px #d44245;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_negative--active)}.vkuiButton--mode-outline.vkuiButton--appearance-neutral{box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);box-shadow:inset 0 0 0 1px var(--vkui--color_field_border_alpha)}.vkuiButton--mode-outline.vkuiButton--appearance-neutral.vkuiButton--hover{background-color:#ebecee;background-color:var(--vkui--color_background_secondary--hover);box-shadow:unset}.vkuiButton--mode-outline.vkuiButton--appearance-neutral.vkuiButton--active{background-color:#e1e3e6;background-color:var(--vkui--color_background_secondary--active);box-shadow:unset}.vkuiButton--mode-outline.vkuiButton--appearance-accent-invariable{box-shadow:inset 0 0 0 1px #2688eb;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_accent)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay{background-color:#fff;background-color:var(--vkui--color_background_contrast)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay.vkuiButton--hover{background-color:#f5f5f7;background-color:var(--vkui--color_background_contrast--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay.vkuiButton--active{background-color:#ebecef;background-color:var(--vkui--color_background_contrast--active)}.vkuiButton--mode-secondary.vkuiButton--appearance-overlay{background-color:hsla(0,0%,100%,.2);background-color:var(--vkui--color_background_contrast_secondary_alpha)}.vkuiButton--mode-outline.vkuiButton--appearance-overlay.vkuiButton--hover,.vkuiButton--mode-secondary.vkuiButton--appearance-overlay.vkuiButton--hover,.vkuiButton--mode-tertiary.vkuiButton--appearance-overlay.vkuiButton--hover{background-color:hsla(0,0%,100%,.24);background-color:var(--vkui--color_background_contrast_secondary_alpha--hover)}.vkuiButton--mode-outline.vkuiButton--appearance-overlay.vkuiButton--active,.vkuiButton--mode-secondary.vkuiButton--appearance-overlay.vkuiButton--active,.vkuiButton--mode-tertiary.vkuiButton--appearance-overlay.vkuiButton--active{background-color:hsla(0,0%,100%,.28);background-color:var(--vkui--color_background_contrast_secondary_alpha--active)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay{color:#000;color:var(--vkui--color_text_primary_invariably)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay.vkuiButton--hover{color:#000102;color:var(--vkui--color_text_primary_invariably--hover)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay.vkuiButton--active{color:#000105;color:var(--vkui--color_text_primary_invariably--active)}.vkuiButton--mode-link.vkuiButton--appearance-overlay,.vkuiButton--mode-outline.vkuiButton--appearance-overlay,.vkuiButton--mode-secondary.vkuiButton--appearance-overlay,.vkuiButton--mode-tertiary.vkuiButton--appearance-overlay{color:#fff;color:var(--vkui--color_text_contrast)}.vkuiButton--mode-outline.vkuiButton--appearance-overlay{box-shadow:inset 0 0 0 1px #fff;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_contrast)}.vkuiButton--mode-outline.vkuiButton--appearance-overlay.vkuiButton--hover{box-shadow:inset 0 0 0 1px #f5f5f7;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_contrast--hover)}.vkuiButton--mode-outline.vkuiButton--appearance-overlay.vkuiButton--active{box-shadow:inset 0 0 0 1px #ebecef;box-shadow:inset 0 0 0 1px var(--vkui--color_stroke_contrast--active)}.vkuiButton__after:not(:first-child),.vkuiButton__before:not(:last-child)+.vkuiButton__content{margin-left:6px}.vkuiButton--size-l .vkuiButton__after:not(:first-child),.vkuiButton--size-l .vkuiButton__before:not(:last-child)+.vkuiButton__content{margin-left:8px}.vkuiButton--size-s .vkuiButton__content{font-size:13px;font-size:var(--vkui--font_subhead--font_size--compact);line-height:16px;line-height:var(--vkui--font_subhead--line_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-s .vkuiButton__content{font-size:14px;font-size:var(--vkui--font_subhead--font_size--regular);line-height:18px;line-height:var(--vkui--font_subhead--line_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-s .vkuiButton__content{font-size:14px;font-size:var(--vkui--font_subhead--font_size--regular);line-height:18px;line-height:var(--vkui--font_subhead--line_height--regular)}}.vkuiButton--size-m .vkuiButton__content{font-size:14px;font-size:var(--vkui--font_headline2--font_size--compact);line-height:20px;line-height:var(--vkui--font_headline2--line_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-m .vkuiButton__content{font-size:15px;font-size:var(--vkui--font_headline2--font_size--regular);line-height:20px;line-height:var(--vkui--font_headline2--line_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-m .vkuiButton__content{font-size:15px;font-size:var(--vkui--font_headline2--font_size--regular);line-height:20px;line-height:var(--vkui--font_headline2--line_height--regular)}}.vkuiButton--size-l .vkuiButton__content{font-size:15px;font-size:var(--vkui--font_headline1--font_size--compact);line-height:20px;line-height:var(--vkui--font_headline1--line_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-l .vkuiButton__content{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-l .vkuiButton__content{font-size:16px;font-size:var(--vkui--font_headline1--font_size--regular);line-height:20px;line-height:var(--vkui--font_headline1--line_height--regular)}}.vkuiButton--sizeY-regular.vkuiButton--size-l.vkuiButton--ios .vkuiButton__content{font-size:17px;font-size:var(--vkui--font_title3--font_size--regular);line-height:22px;line-height:var(--vkui--font_title3--line_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-l.vkuiButton--ios .vkuiButton__content{font-size:17px;font-size:var(--vkui--font_title3--font_size--regular);line-height:22px;line-height:var(--vkui--font_title3--line_height--regular)}}.vkuiButton--size-m{min-height:32px;min-height:var(--vkui--size_button_medium_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-m{min-height:36px;min-height:var(--vkui--size_button_medium_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-m{min-height:36px;min-height:var(--vkui--size_button_medium_height--regular)}}.vkuiButton--size-m.vkuiButton--singleIcon{width:32px;width:var(--vkui--size_button_medium_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-m.vkuiButton--singleIcon{width:36px;width:var(--vkui--size_button_medium_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-m.vkuiButton--singleIcon{width:36px;width:var(--vkui--size_button_medium_height--regular)}}.vkuiButton--size-l{min-height:36px;min-height:var(--vkui--size_button_large_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-l{min-height:44px;min-height:var(--vkui--size_button_large_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-l{min-height:44px;min-height:var(--vkui--size_button_large_height--regular)}}.vkuiButton--size-l.vkuiButton--singleIcon{width:36px;width:var(--vkui--size_button_large_height--compact)}.vkuiButton--sizeY-regular.vkuiButton--size-l.vkuiButton--singleIcon{width:44px;width:var(--vkui--size_button_large_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none.vkuiButton--size-l.vkuiButton--singleIcon{width:44px;width:var(--vkui--size_button_large_height--regular)}}.vkuiButton--sizeY-regular{min-height:30px;min-height:var(--vkui--size_button_small_height--regular)}@media (max-width:767.9px) and (min-height:415px),(pointer:coarse) and (min-height:415px),(pointer:none) and (min-height:415px){.vkuiButton--sizeY-none{min-height:30px;min-height:var(--vkui--size_button_small_height--regular)}}.vkuiButton--mode-primary.vkuiButton--appearance-accent{--vkui_internal--counter_inherit_background:var(--vkui--color_background_content);--vkui_internal--counter_inherit_color:var(--vkui--color_text_accent_themed)}.vkuiButton--mode-outline.vkuiButton--appearance-accent,.vkuiButton--mode-secondary.vkuiButton--appearance-accent,.vkuiButton--mode-tertiary.vkuiButton--appearance-accent{--vkui_internal--counter_inherit_background:var(--vkui--color_background_accent_themed);--vkui_internal--counter_inherit_color:var(--vkui--color_text_contrast_themed)}.vkuiButton--mode-primary.vkuiButton--appearance-positive{--vkui_internal--counter_inherit_background:var(--vkui--color_background_contrast);--vkui_internal--counter_inherit_color:var(--vkui--color_text_positive)}.vkuiButton--mode-outline.vkuiButton--appearance-positive,.vkuiButton--mode-secondary.vkuiButton--appearance-positive,.vkuiButton--mode-tertiary.vkuiButton--appearance-positive{--vkui_internal--counter_inherit_background:var(--vkui--color_background_positive);--vkui_internal--counter_inherit_color:var(--vkui--color_text_contrast)}.vkuiButton--mode-primary.vkuiButton--appearance-negative{--vkui_internal--counter_inherit_background:var(--vkui--color_background_contrast);--vkui_internal--counter_inherit_color:var(--vkui--color_text_negative)}.vkuiButton--mode-outline.vkuiButton--appearance-negative,.vkuiButton--mode-secondary.vkuiButton--appearance-negative,.vkuiButton--mode-tertiary.vkuiButton--appearance-negative{--vkui_internal--counter_inherit_background:var(--vkui--color_background_negative);--vkui_internal--counter_inherit_color:var(--vkui--color_text_contrast)}.vkuiButton--mode-primary.vkuiButton--appearance-neutral{--vkui_internal--counter_inherit_background:var(--vkui--color_background_content);--vkui_internal--counter_inherit_color:var(--vkui--color_text_primary_invariably)}.vkuiButton--mode-outline.vkuiButton--appearance-neutral,.vkuiButton--mode-secondary.vkuiButton--appearance-neutral,.vkuiButton--mode-tertiary.vkuiButton--appearance-neutral{--vkui_internal--counter_inherit_background:var(--vkui--color_background_accent);--vkui_internal--counter_inherit_color:var(--vkui--color_text_contrast)}.vkuiButton--mode-primary.vkuiButton--appearance-overlay{--vkui_internal--counter_inherit_background:var(--vkui--color_icon_primary_invariably);--vkui_internal--counter_inherit_color:var(--vkui--color_text_contrast)}.vkuiButton--mode-outline.vkuiButton--appearance-overlay,.vkuiButton--mode-secondary.vkuiButton--appearance-overlay,.vkuiButton--mode-tertiary.vkuiButton--appearance-overlay{--vkui_internal--counter_inherit_background:var(--vkui--color_background_contrast);--vkui_internal--counter_inherit_color:var(--vkui--color_text_primary_invariably)}
+.Button {
+  position: relative;
+  display: inline-block;
+  box-sizing: border-box;
+  text-decoration: none;
+  border: none;
+  min-height: var(--vkui--size_button_small_height--compact);
+  margin: 0;
+  padding: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  border-radius: var(--vkui--size_border_radius--regular);
+  max-width: 100%;
+  min-width: var(--vkui--size_button_minimum_width--regular);
+  font-family: var(--vkui--font_family_base);
+}
+
+.Button--loading {
+  cursor: progress;
+}
+
+.Button--singleIcon {
+  width: var(--vkui--size_button_small_height--compact);
+  min-width: initial;
+}
+
+.Button--sizeY-regular.Button--singleIcon {
+  width: var(--vkui--size_button_small_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--singleIcon {
+    width: var(--vkui--size_button_small_height--regular);
+  }
+}
+
+.Button--stretched {
+  display: block;
+  width: 100%;
+  flex-grow: 1;
+  flex-basis: 0;
+}
+
+.Button__in {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  min-height: inherit;
+  text-align: center;
+  box-sizing: border-box;
+  font-family: var(--vkui--font_family_base);
+}
+
+.Button--align-left .Button__in {
+  justify-content: flex-start;
+  text-align: left;
+}
+
+.Button--align-center {
+}
+
+.Button--align-right .Button__in {
+  justify-content: flex-end;
+  text-align: right;
+}
+
+.Button[disabled] {
+  opacity: var(--vkui--opacity_disable);
+}
+
+.Button--mode-primary[disabled]:not(.Button--appearance-overlay):not(
+    .Button--appearance-negative
+  ):not(.Button--appearance-positive),
+.Button--mode-secondary[disabled]:not(.Button--appearance-overlay),
+.Button--mode-tertiary[disabled]:not(.Button--appearance-overlay),
+.Button--mode-outline[disabled]:not(.Button--appearance-overlay) {
+  opacity: 0.64;
+}
+
+.Button--with-icon {
+}
+
+.Button__content {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  font-weight: var(--vkui--font_weight_accent2);
+}
+
+.Button--size-s .Button__content:first-child {
+  padding-left: var(--vkui--size_button_base_small_padding_horizontal--regular);
+}
+
+.Button--size-s .Button__content:last-child,
+.Button--size-s .Button__after {
+  padding-right: var(--vkui--size_button_base_small_padding_horizontal--regular);
+}
+
+.Button--size-m .Button__content:first-child {
+  padding-left: var(--vkui--size_button_base_medium_padding_horizontal--regular);
+}
+
+.Button--size-m .Button__content:last-child,
+.Button--size-m .Button__after {
+  padding-right: var(--vkui--size_button_base_medium_padding_horizontal--regular);
+}
+
+.Button--size-l .Button__content:first-child {
+  padding-left: var(--vkui--size_button_base_large_padding_horizontal--regular);
+}
+
+.Button--size-l .Button__content:last-child,
+.Button--size-l .Button__after {
+  padding-right: var(--vkui--size_button_base_large_padding_horizontal--regular);
+}
+
+.Button--size-s .Button__before {
+  padding-left: var(--vkui--size_button_base_small_padding_horizontal_icon--regular);
+}
+
+.Button--size-m .Button__before {
+  padding-left: var(--vkui--size_button_base_medium_padding_horizontal_icon--regular);
+}
+
+.Button--size-l .Button__before {
+  padding-left: var(--vkui--size_button_base_large_padding_horizontal_icon--regular);
+}
+
+.Button--mode-tertiary.Button--size-s .Button__content:first-child {
+  padding-left: var(--vkui--size_button_tertiary_small_padding_horizontal--regular);
+}
+
+.Button--mode-tertiary.Button--size-s .Button__content:last-child,
+.Button--mode-tertiary.Button--size-s .Button__after {
+  padding-right: var(--vkui--size_button_tertiary_small_padding_horizontal--regular);
+}
+
+.Button--mode-tertiary.Button--size-m .Button__content:first-child {
+  padding-left: var(--vkui--size_button_tertiary_medium_padding_horizontal--regular);
+}
+
+.Button--mode-tertiary.Button--size-m .Button__content:last-child,
+.Button--mode-tertiary.Button--size-m .Button__after {
+  padding-right: var(--vkui--size_button_tertiary_medium_padding_horizontal--regular);
+}
+
+.Button--mode-tertiary.Button--size-l .Button__content:first-child {
+  padding-left: var(--vkui--size_button_tertiary_large_padding_horizontal--regular);
+}
+
+.Button--mode-tertiary.Button--size-l .Button__content:last-child,
+.Button--mode-tertiary.Button--size-l .Button__after {
+  padding-right: var(--vkui--size_button_tertiary_large_padding_horizontal--regular);
+}
+
+.Button--mode-tertiary.Button--size-s .Button__before {
+  padding-left: var(--vkui--size_button_tertiary_small_padding_horizontal_icon--regular);
+}
+
+.Button--mode-tertiary.Button--size-m .Button__before {
+  padding-left: var(--vkui--size_button_tertiary_medium_padding_horizontal_icon--regular);
+}
+
+.Button--mode-tertiary.Button--size-l .Button__before {
+  padding-left: var(--vkui--size_button_tertiary_large_padding_horizontal_icon--regular);
+}
+
+.Button--singleIcon .Button__after,
+.Button--singleIcon .Button__before,
+.Button--mode-tertiary.Button--singleIcon .Button__after,
+.Button--mode-tertiary.Button--singleIcon .Button__before {
+  margin-left: auto;
+  margin-right: auto;
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.Button--mode-link {
+  background: none;
+  min-width: initial;
+}
+
+.Button--mode-link .Button__after,
+.Button--mode-link .Button__before,
+.Button--mode-link .Button__content:first-child,
+.Button--mode-link .Button__content:last-child {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.Button__spinner {
+  color: currentColor;
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.Button__spinner + .Button__in {
+  visibility: hidden;
+}
+
+/* Button's backgrounds */
+
+/* Mode  = Primary */
+
+.Button--mode-primary.Button--appearance-accent {
+  background-color: var(--vkui--color_background_accent_themed);
+}
+
+.Button--mode-primary.Button--appearance-accent.Button--hover {
+  background-color: var(--vkui--color_background_accent_themed--hover);
+}
+
+.Button--mode-primary.Button--appearance-accent.Button--active {
+  background-color: var(--vkui--color_background_accent_themed--active);
+}
+
+.Button--mode-primary.Button--appearance-positive {
+  background-color: var(--vkui--color_background_positive);
+}
+
+.Button--mode-primary.Button--appearance-positive.Button--hover {
+  background-color: var(--vkui--color_background_positive--hover);
+}
+
+.Button--mode-primary.Button--appearance-positive.Button--active {
+  background-color: var(--vkui--color_background_positive--active);
+}
+
+.Button--mode-primary.Button--appearance-negative {
+  background-color: var(--vkui--color_background_negative);
+}
+
+.Button--mode-primary.Button--appearance-negative.Button--hover {
+  background-color: var(--vkui--color_background_negative--hover);
+}
+
+.Button--mode-primary.Button--appearance-negative.Button--active {
+  background-color: var(--vkui--color_background_negative--active);
+}
+
+.Button--mode-primary.Button--appearance-neutral {
+  background-color: var(--vkui--color_background_secondary);
+}
+
+.Button--mode-primary.Button--appearance-neutral.Button--hover {
+  background-color: var(--vkui--color_background_secondary--hover);
+}
+
+.Button--mode-primary.Button--appearance-neutral.Button--active {
+  background-color: var(--vkui--color_background_secondary--active);
+}
+
+.Button--mode-primary.Button--appearance-accent-invariable {
+  background-color: var(--vkui--color_background_accent);
+}
+
+.Button--mode-primary.Button--appearance-accent-invariable.Button--hover {
+  background-color: var(--vkui--color_background_accent--hover);
+}
+
+.Button--mode-primary.Button--appearance-accent-invariable.Button--active {
+  background-color: var(--vkui--color_background_accent--active);
+}
+
+/* Mode = Secondary */
+
+.Button--mode-secondary {
+  background-color: var(--vkui--color_background_secondary_alpha);
+}
+
+.Button--mode-secondary.Button--hover {
+  background-color: var(--vkui--color_background_secondary_alpha--hover);
+}
+
+.Button--mode-secondary.Button--active {
+  background-color: var(--vkui--color_background_secondary_alpha--active);
+}
+
+/* Mode = Tertiary */
+
+.Button--mode-tertiary,
+.Button--mode-outline {
+  background-color: var(--vkui--color_transparent);
+}
+
+.Button--mode-tertiary.Button--hover,
+.Button--mode-outline.Button--hover {
+  background-color: var(--vkui--color_transparent--hover);
+}
+
+.Button--mode-tertiary.Button--active,
+.Button--mode-outline.Button--active {
+  background-color: var(--vkui--color_transparent--active);
+}
+
+/*
+  Buttons text colors
+*/
+
+.Button.Button--appearance-accent {
+  color: var(--vkui--color_text_accent_themed);
+}
+
+.Button.Button--appearance-positive {
+  color: var(--vkui--color_text_positive);
+}
+
+.Button.Button--appearance-negative {
+  color: var(--vkui--color_text_negative);
+}
+
+.Button.Button--appearance-neutral {
+  color: var(--vkui--color_text_primary);
+}
+
+.Button.Button--appearance-accent-invariable {
+  color: var(--vkui--color_text_accent);
+}
+
+.Button--mode-primary.Button--appearance-accent {
+  color: var(--vkui--color_text_contrast_themed);
+}
+
+.Button--mode-primary.Button--appearance-negative,
+.Button--mode-primary.Button--appearance-positive,
+.Button--mode-primary.Button--appearance-accent-invariable {
+  color: var(--vkui--color_text_contrast);
+}
+
+.Button--mode-link.Button--hover {
+  opacity: 0.8;
+}
+
+.Button--mode-link.Button--active {
+  opacity: 0.7;
+}
+
+/*
+  Outline buttons borders
+*/
+
+.Button--mode-outline.Button--appearance-accent,
+.Button--mode-outline.Button--appearance-accent.Button--hover,
+.Button--mode-outline.Button--appearance-accent.Button--active {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_accent_themed);
+}
+
+.Button--mode-outline.Button--appearance-positive {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_positive);
+}
+
+.Button--mode-outline.Button--appearance-positive.Button--hover {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_positive--hover);
+}
+
+.Button--mode-outline.Button--appearance-positive.Button--active {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_positive--active);
+}
+
+.Button--mode-outline.Button--appearance-negative {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_negative);
+}
+
+.Button--mode-outline.Button--appearance-negative.Button--hover {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_negative--hover);
+}
+
+.Button--mode-outline.Button--appearance-negative.Button--active {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_negative--active);
+}
+
+.Button--mode-outline.Button--appearance-neutral {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_field_border_alpha);
+}
+
+.Button--mode-outline.Button--appearance-neutral.Button--hover {
+  background-color: var(--vkui--color_background_secondary--hover);
+  box-shadow: unset;
+}
+
+.Button--mode-outline.Button--appearance-neutral.Button--active {
+  background-color: var(--vkui--color_background_secondary--active);
+  box-shadow: unset;
+}
+
+.Button--mode-outline.Button--appearance-accent-invariable {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_accent);
+}
+
+/*
+  Overlay colors section, separately
+  Background colors
+*/
+
+.Button--mode-primary.Button--appearance-overlay {
+  background-color: var(--vkui--color_background_contrast);
+}
+
+.Button--mode-primary.Button--appearance-overlay.Button--hover {
+  background-color: var(--vkui--color_background_contrast--hover);
+}
+
+.Button--mode-primary.Button--appearance-overlay.Button--active {
+  background-color: var(--vkui--color_background_contrast--active);
+}
+
+.Button--mode-secondary.Button--appearance-overlay {
+  background-color: var(--vkui--color_background_contrast_secondary_alpha);
+}
+
+.Button--mode-secondary.Button--appearance-overlay.Button--hover,
+.Button--mode-tertiary.Button--appearance-overlay.Button--hover,
+.Button--mode-outline.Button--appearance-overlay.Button--hover {
+  background-color: var(--vkui--color_background_contrast_secondary_alpha--hover);
+}
+
+.Button--mode-secondary.Button--appearance-overlay.Button--active,
+.Button--mode-tertiary.Button--appearance-overlay.Button--active,
+.Button--mode-outline.Button--appearance-overlay.Button--active {
+  background-color: var(--vkui--color_background_contrast_secondary_alpha--active);
+}
+
+/* Text colors */
+
+.Button--mode-primary.Button--appearance-overlay {
+  color: var(--vkui--color_text_primary_invariably);
+}
+
+.Button--mode-primary.Button--appearance-overlay.Button--hover {
+  color: var(--vkui--color_text_primary_invariably--hover);
+}
+
+.Button--mode-primary.Button--appearance-overlay.Button--active {
+  color: var(--vkui--color_text_primary_invariably--active);
+}
+
+.Button--mode-secondary.Button--appearance-overlay,
+.Button--mode-tertiary.Button--appearance-overlay,
+.Button--mode-outline.Button--appearance-overlay,
+.Button--mode-link.Button--appearance-overlay {
+  color: var(--vkui--color_text_contrast);
+}
+
+/* Borders */
+
+.Button--mode-outline.Button--appearance-overlay {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_contrast);
+}
+
+.Button--mode-outline.Button--appearance-overlay.Button--hover {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_contrast--hover);
+}
+
+.Button--mode-outline.Button--appearance-overlay.Button--active {
+  box-shadow: inset 0 0 0 1px var(--vkui--color_stroke_contrast--active);
+}
+
+.Button__before:not(:last-child) + .Button__content {
+  margin-left: 6px;
+}
+
+.Button__after:not(:first-child) {
+  margin-left: 6px;
+}
+
+.Button--size-l .Button__before:not(:last-child) + .Button__content {
+  margin-left: 8px;
+}
+
+.Button--size-l .Button__after:not(:first-child) {
+  margin-left: 8px;
+}
+
+/* Fonts sizes  */
+
+.Button--size-s .Button__content {
+  font-size: var(--vkui--font_subhead--font_size--compact);
+  line-height: var(--vkui--font_subhead--line_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-s .Button__content {
+  font-size: var(--vkui--font_subhead--font_size--regular);
+  line-height: var(--vkui--font_subhead--line_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-s .Button__content {
+    font-size: var(--vkui--font_subhead--font_size--regular);
+    line-height: var(--vkui--font_subhead--line_height--regular);
+  }
+}
+
+.Button--size-m .Button__content {
+  font-size: var(--vkui--font_headline2--font_size--compact);
+  line-height: var(--vkui--font_headline2--line_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-m .Button__content {
+  font-size: var(--vkui--font_headline2--font_size--regular);
+  line-height: var(--vkui--font_headline2--line_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-m .Button__content {
+    font-size: var(--vkui--font_headline2--font_size--regular);
+    line-height: var(--vkui--font_headline2--line_height--regular);
+  }
+}
+
+.Button--size-l .Button__content {
+  font-size: var(--vkui--font_headline1--font_size--compact);
+  line-height: var(--vkui--font_headline1--line_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-l .Button__content {
+  font-size: var(--vkui--font_headline1--font_size--regular);
+  line-height: var(--vkui--font_headline1--line_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-l .Button__content {
+    font-size: var(--vkui--font_headline1--font_size--regular);
+    line-height: var(--vkui--font_headline1--line_height--regular);
+  }
+}
+
+.Button--sizeY-regular.Button--size-l.Button--ios .Button__content {
+  font-size: var(--vkui--font_title3--font_size--regular);
+  line-height: var(--vkui--font_title3--line_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-l.Button--ios .Button__content {
+    font-size: var(--vkui--font_title3--font_size--regular);
+    line-height: var(--vkui--font_title3--line_height--regular);
+  }
+}
+
+/* Sizes */
+
+.Button--size-m {
+  min-height: var(--vkui--size_button_medium_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-m {
+  min-height: var(--vkui--size_button_medium_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-m {
+    min-height: var(--vkui--size_button_medium_height--regular);
+  }
+}
+
+.Button--size-m.Button--singleIcon {
+  width: var(--vkui--size_button_medium_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-m.Button--singleIcon {
+  width: var(--vkui--size_button_medium_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-m.Button--singleIcon {
+    width: var(--vkui--size_button_medium_height--regular);
+  }
+}
+
+.Button--size-l {
+  min-height: var(--vkui--size_button_large_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-l {
+  min-height: var(--vkui--size_button_large_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-l {
+    min-height: var(--vkui--size_button_large_height--regular);
+  }
+}
+
+.Button--size-l.Button--singleIcon {
+  width: var(--vkui--size_button_large_height--compact);
+}
+
+.Button--sizeY-regular.Button--size-l.Button--singleIcon {
+  width: var(--vkui--size_button_large_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none.Button--size-l.Button--singleIcon {
+    width: var(--vkui--size_button_large_height--regular);
+  }
+}
+
+.Button--sizeY-regular {
+  min-height: var(--vkui--size_button_small_height--regular);
+}
+
+@media (pointer: coarse) and (min-height: 415px),(pointer: none) and (min-height: 415px),(max-width: 767.9px) and (min-height: 415px) {
+  .Button--sizeY-none {
+    min-height: var(--vkui--size_button_small_height--regular);
+  }
+}
+
+/**
+ * Impact:
+ * Counter
+ */
+
+.Button--mode-primary.Button--appearance-accent {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_content);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_accent_themed);
+}
+
+.Button--mode-secondary.Button--appearance-accent,
+.Button--mode-tertiary.Button--appearance-accent,
+.Button--mode-outline.Button--appearance-accent {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_accent_themed);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_contrast_themed);
+}
+
+.Button--mode-primary.Button--appearance-positive {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_contrast);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_positive);
+}
+
+.Button--mode-secondary.Button--appearance-positive,
+.Button--mode-tertiary.Button--appearance-positive,
+.Button--mode-outline.Button--appearance-positive {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_positive);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_contrast);
+}
+
+.Button--mode-primary.Button--appearance-negative {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_contrast);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_negative);
+}
+
+.Button--mode-secondary.Button--appearance-negative,
+.Button--mode-tertiary.Button--appearance-negative,
+.Button--mode-outline.Button--appearance-negative {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_negative);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_contrast);
+}
+
+.Button--mode-primary.Button--appearance-neutral {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_content);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_primary_invariably);
+}
+
+.Button--mode-secondary.Button--appearance-neutral,
+.Button--mode-tertiary.Button--appearance-neutral,
+.Button--mode-outline.Button--appearance-neutral {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_accent);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_contrast);
+}
+
+.Button--mode-primary.Button--appearance-overlay {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_icon_primary_invariably);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_contrast);
+}
+
+.Button--mode-secondary.Button--appearance-overlay,
+.Button--mode-tertiary.Button--appearance-overlay,
+.Button--mode-outline.Button--appearance-overlay {
+  --vkui_internal--counter_inherit_background: var(--vkui--color_background_contrast);
+  --vkui_internal--counter_inherit_color: var(--vkui--color_text_primary_invariably);
+}