npm - @vkontakte/vkui-tokens - Versions diffs - 4.35.1 → 4.35.2-dev-cfbf64.0 - Mend

@vkontakte/vkui-tokens 4.35.1 → 4.35.2-dev-cfbf64.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (963) hide show

package/themes/vkontakteCom/cssVars/theme/fallbacks/index.less CHANGED Viewed

@@ -259,6 +259,9 @@
 @color-link-contrast: var(--vkui--color_link_contrast, #333333);
 @color-link-contrast--hover: var(--vkui--color_link_contrast--hover, #313233);
 @color-link-contrast--active: var(--vkui--color_link_contrast--active, #2F3034);
+@color-text-button: var(--vkui--color_text_button, #346297);
+@color-text-button--hover: var(--vkui--color_text_button--hover, #325F93);
+@color-text-button--active: var(--vkui--color_text_button--active, #305B90);
 @color-icon-accent: var(--vkui--color_icon_accent, #447BBA);
 @color-icon-accent--hover: var(--vkui--color_icon_accent--hover, #4177B5);
 @color-icon-accent--active: var(--vkui--color_icon_accent--active, #3F72B0);
@@ -304,6 +307,9 @@
 @color-icon-negative: var(--vkui--color_icon_negative, #E64646);
 @color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 @color-icon-negative--active: var(--vkui--color_icon_negative--active, #D44245);
+@color-icon-button: var(--vkui--color_icon_button, #346297);
+@color-icon-button--hover: var(--vkui--color_icon_button--hover, #325F93);
+@color-icon-button--active: var(--vkui--color_icon_button--active, #305B90);
 @color-stroke-accent: var(--vkui--color_stroke_accent, #447BBA);
 @color-stroke-accent--hover: var(--vkui--color_stroke_accent--hover, #4177B5);
 @color-stroke-accent--active: var(--vkui--color_stroke_accent--active, #3F72B0);
@@ -340,6 +346,9 @@
 @color-field-border-alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 @color-field-border-alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 @color-field-border-alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+@color-stroke-button: var(--vkui--color_stroke_button, #346297);
+@color-stroke-button--hover: var(--vkui--color_stroke_button--hover, #325F93);
+@color-stroke-button--active: var(--vkui--color_stroke_button--active, #305B90);
 @color-accent-blue: var(--vkui--color_accent_blue, #5181B8);
 @color-accent-blue--hover: var(--vkui--color_accent_blue--hover, #4E7CB3);
 @color-accent-blue--active: var(--vkui--color_accent_blue--active, #4B78AE);
@@ -427,6 +436,9 @@
 @vkontakte-color-snippet-border-alpha: var(--vkui--vkontakte_color_snippet_border_alpha, rgba(0, 0, 0, 0.12));
 @vkontakte-color-snippet-border-alpha--hover: var(--vkui--vkontakte_color_snippet_border_alpha--hover, rgba(0, 0, 0, 0.16));
 @vkontakte-color-snippet-border-alpha--active: var(--vkui--vkontakte_color_snippet_border_alpha--active, rgba(0, 0, 0, 0.2));
+@vkontakte-color-snippet-background: var(--vkui--vkontakte_color_snippet_background, #FFFFFF);
+@vkontakte-color-snippet-background--hover: var(--vkui--vkontakte_color_snippet_background--hover, #F5F5F7);
+@vkontakte-color-snippet-background--active: var(--vkui--vkontakte_color_snippet_background--active, #EBECEF);
 @vkontakte-color-modal-card-border-alpha: var(--vkui--vkontakte_color_modal_card_border_alpha, rgba(0, 0, 0, 0));
 @vkontakte-color-modal-card-border-alpha--hover: var(--vkui--vkontakte_color_modal_card_border_alpha--hover, rgba(0, 0, 0, 0.04));
 @vkontakte-color-modal-card-border-alpha--active: var(--vkui--vkontakte_color_modal_card_border_alpha--active, rgba(0, 0, 0, 0.08));
@@ -439,6 +451,144 @@
 @vkontakte-color-input-border: var(--vkui--vkontakte_color_input_border, #D3D9DE);
 @vkontakte-color-input-border--hover: var(--vkui--vkontakte_color_input_border--hover, #CBD1D8);
 @vkontakte-color-input-border--active: var(--vkui--vkontakte_color_input_border--active, #C2C9D1);
+@vkontakte-color-search-bar-background: var(--vkui--vkontakte_color_search_bar_background, #e5ebf1);
+@vkontakte-color-search-bar-background--hover: var(--vkui--vkontakte_color_search_bar_background--hover, #DCE2EA);
+@vkontakte-color-search-bar-background--active: var(--vkui--vkontakte_color_search_bar_background--active, #D3D9E3);
+@vkontakte-color-search-bar-field-tint: var(--vkui--vkontakte_color_search_bar_field_tint, #818c99);
+@vkontakte-color-search-bar-field-tint--hover: var(--vkui--vkontakte_color_search_bar_field_tint--hover, #7C8795);
+@vkontakte-color-search-bar-field-tint--active: var(--vkui--vkontakte_color_search_bar_field_tint--active, #778292);
+@vkontakte-background-hover-alpha: var(--vkui--vkontakte_background_hover_alpha, rgba(174, 183, 194, 0.12));
+@vkontakte-background-hover-alpha--hover: var(--vkui--vkontakte_background_hover_alpha--hover, rgba(174, 183, 194, 0.16));
+@vkontakte-background-hover-alpha--active: var(--vkui--vkontakte_background_hover_alpha--active, rgba(174, 183, 194, 0.2));
+@vkontakte-color-accent-alternate: var(--vkui--vkontakte_color_accent_alternate, #0077ff);
+@vkontakte-color-accent-alternate--hover: var(--vkui--vkontakte_color_accent_alternate--hover, #0073F7);
+@vkontakte-color-accent-alternate--active: var(--vkui--vkontakte_color_accent_alternate--active, #006FEF);
+@vkontakte-color-background-suggestions: var(--vkui--vkontakte_color_background_suggestions, #FFFFFF);
+@vkontakte-color-background-suggestions--hover: var(--vkui--vkontakte_color_background_suggestions--hover, #F5F5F7);
+@vkontakte-color-background-suggestions--active: var(--vkui--vkontakte_color_background_suggestions--active, #EBECEF);
+@vkontakte-color-background-keyboard: var(--vkui--vkontakte_color_background_keyboard, #dce1e6);
+@vkontakte-color-background-keyboard--hover: var(--vkui--vkontakte_color_background_keyboard--hover, #D3D9DF);
+@vkontakte-color-background-keyboard--active: var(--vkui--vkontakte_color_background_keyboard--active, #CAD0D8);
+@vkontakte-color-content-placeholder-icon: var(--vkui--vkontakte_color_content_placeholder_icon, #b2b2b2);
+@vkontakte-color-content-placeholder-icon--hover: var(--vkui--vkontakte_color_content_placeholder_icon--hover, #ABACAD);
+@vkontakte-color-content-placeholder-icon--active: var(--vkui--vkontakte_color_content_placeholder_icon--active, #A4A5A9);
+@vkontakte-color-content-tint-foreground: var(--vkui--vkontakte_color_content_tint_foreground, #939393);
+@vkontakte-color-content-tint-foreground--hover: var(--vkui--vkontakte_color_content_tint_foreground--hover, #8D8E90);
+@vkontakte-color-content-tint-foreground--active: var(--vkui--vkontakte_color_content_tint_foreground--active, #87898C);
+@vkontakte-color-text-name: var(--vkui--vkontakte_color_text_name, #2a5885);
+@vkontakte-color-text-name--hover: var(--vkui--vkontakte_color_text_name--hover, #285582);
+@vkontakte-color-text-name--active: var(--vkui--vkontakte_color_text_name--active, #27527F);
+@vkontakte-color-control-background: var(--vkui--vkontakte_color_control_background, #edeef0);
+@vkontakte-color-control-background--hover: var(--vkui--vkontakte_color_control_background--hover, #E4E5E9);
+@vkontakte-color-control-background--active: var(--vkui--vkontakte_color_control_background--active, #DADCE2);
+@vkontakte-color-control-foreground: var(--vkui--vkontakte_color_control_foreground, #447bba);
+@vkontakte-color-control-foreground--hover: var(--vkui--vkontakte_color_control_foreground--hover, #4177B5);
+@vkontakte-color-control-foreground--active: var(--vkui--vkontakte_color_control_foreground--active, #3F72B0);
+@vkontakte-color-control-tint-muted: var(--vkui--vkontakte_color_control_tint_muted, #828282);
+@vkontakte-color-control-tint-muted--hover: var(--vkui--vkontakte_color_control_tint_muted--hover, #7D7D7F);
+@vkontakte-color-control-tint-muted--active: var(--vkui--vkontakte_color_control_tint_muted--active, #78797C);
+@vkontakte-color-header-search-field-background: var(--vkui--vkontakte_color_header_search_field_background, #edeef0);
+@vkontakte-color-header-search-field-background--hover: var(--vkui--vkontakte_color_header_search_field_background--hover, #E4E5E9);
+@vkontakte-color-header-search-field-background--active: var(--vkui--vkontakte_color_header_search_field_background--active, #DADCE2);
+@vkontakte-color-header-search-field-tint: var(--vkui--vkontakte_color_header_search_field_tint, #818c99);
+@vkontakte-color-header-search-field-tint--hover: var(--vkui--vkontakte_color_header_search_field_tint--hover, #7C8795);
+@vkontakte-color-header-search-field-tint--active: var(--vkui--vkontakte_color_header_search_field_tint--active, #778292);
+@vkontakte-color-header-tab-active-indicator: var(--vkui--vkontakte_color_header_tab_active_indicator, #397dcc);
+@vkontakte-color-header-tab-active-indicator--hover: var(--vkui--vkontakte_color_header_tab_active_indicator--hover, #3779C6);
+@vkontakte-color-header-tab-active-indicator--active: var(--vkui--vkontakte_color_header_tab_active_indicator--active, #3474C1);
+@vkontakte-color-icon-outline-medium: var(--vkui--vkontakte_color_icon_outline_medium, #818c99);
+@vkontakte-color-icon-outline-medium--hover: var(--vkui--vkontakte_color_icon_outline_medium--hover, #7C8795);
+@vkontakte-color-icon-outline-medium--active: var(--vkui--vkontakte_color_icon_outline_medium--active, #778292);
+@vkontakte-color-icon-outline-secondary: var(--vkui--vkontakte_color_icon_outline_secondary, #99a2ad);
+@vkontakte-color-icon-outline-secondary--hover: var(--vkui--vkontakte_color_icon_outline_secondary--hover, #939CA9);
+@vkontakte-color-icon-outline-secondary--active: var(--vkui--vkontakte_color_icon_outline_secondary--active, #8D96A4);
+@vkontakte-color-skeleton-shimmer-from: var(--vkui--vkontakte_color_skeleton_shimmer_from, #FFFFFF);
+@vkontakte-color-skeleton-shimmer-from--hover: var(--vkui--vkontakte_color_skeleton_shimmer_from--hover, #F5F5F7);
+@vkontakte-color-skeleton-shimmer-from--active: var(--vkui--vkontakte_color_skeleton_shimmer_from--active, #EBECEF);
+@vkontakte-color-alpha-skeleton-shimmer-to: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to, transparent);
+@vkontakte-color-alpha-skeleton-shimmer-to--hover: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to--hover, rgba(0, 16, 61, 0.04));
+@vkontakte-color-alpha-skeleton-shimmer-to--active: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to--active, rgba(0, 16, 61, 0.08));
+@vkontakte-color-loader-background: var(--vkui--vkontakte_color_loader_background, #edeef0);
+@vkontakte-color-loader-background--hover: var(--vkui--vkontakte_color_loader_background--hover, #E4E5E9);
+@vkontakte-color-loader-background--active: var(--vkui--vkontakte_color_loader_background--active, #DADCE2);
+@vkontakte-color-loader-tint: var(--vkui--vkontakte_color_loader_tint, #828282);
+@vkontakte-color-loader-tint--hover: var(--vkui--vkontakte_color_loader_tint--hover, #7D7D7F);
+@vkontakte-color-loader-tint--active: var(--vkui--vkontakte_color_loader_tint--active, #78797C);
+@vkontakte-color-music-playback-icon: var(--vkui--vkontakte_color_music_playback_icon, #000000);
+@vkontakte-color-music-playback-icon--hover: var(--vkui--vkontakte_color_music_playback_icon--hover, #000102);
+@vkontakte-color-music-playback-icon--active: var(--vkui--vkontakte_color_music_playback_icon--active, #000105);
+@vkontakte-color-status-background: var(--vkui--vkontakte_color_status_background, #edeef0);
+@vkontakte-color-status-background--hover: var(--vkui--vkontakte_color_status_background--hover, #E4E5E9);
+@vkontakte-color-status-background--active: var(--vkui--vkontakte_color_status_background--active, #DADCE2);
+@vkontakte-color-placeholder-icon-foreground-primary: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary, #99a2ad);
+@vkontakte-color-placeholder-icon-foreground-primary--hover: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary--hover, #939CA9);
+@vkontakte-color-placeholder-icon-foreground-primary--active: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary--active, #8D96A4);
+@vkontakte-color-placeholder-icon-foreground-secondary: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary, #aeb7c2);
+@vkontakte-color-placeholder-icon-foreground-secondary--hover: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary--hover, #A7B0BD);
+@vkontakte-color-placeholder-icon-foreground-secondary--active: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary--active, #A0AAB7);
+@vkontakte-color-placeholder-icon-tint: var(--vkui--vkontakte_color_placeholder_icon_tint, #1d3a5c);
+@vkontakte-color-placeholder-icon-tint--hover: var(--vkui--vkontakte_color_placeholder_icon_tint--hover, #1C385B);
+@vkontakte-color-placeholder-icon-tint--active: var(--vkui--vkontakte_color_placeholder_icon_tint--active, #1B375A);
+@vkontakte-color-poll-option-background: var(--vkui--vkontakte_color_poll_option_background, #447bba);
+@vkontakte-color-poll-option-background--hover: var(--vkui--vkontakte_color_poll_option_background--hover, #4177B5);
+@vkontakte-color-poll-option-background--active: var(--vkui--vkontakte_color_poll_option_background--active, #3F72B0);
+@vkontakte-color-tabbar-active-icon: var(--vkui--vkontakte_color_tabbar_active_icon, #447bba);
+@vkontakte-color-tabbar-active-icon--hover: var(--vkui--vkontakte_color_tabbar_active_icon--hover, #4177B5);
+@vkontakte-color-tabbar-active-icon--active: var(--vkui--vkontakte_color_tabbar_active_icon--active, #3F72B0);
+@vkontakte-color-tabbar-background: var(--vkui--vkontakte_color_tabbar_background, #f7f8fa);
+@vkontakte-color-tabbar-background--hover: var(--vkui--vkontakte_color_tabbar_background--hover, #EDEFF2);
+@vkontakte-color-tabbar-background--active: var(--vkui--vkontakte_color_tabbar_background--active, #E3E5EB);
+@vkontakte-color-tabbar-inactive-icon: var(--vkui--vkontakte_color_tabbar_inactive_icon, #99a2ad);
+@vkontakte-color-tabbar-inactive-icon--hover: var(--vkui--vkontakte_color_tabbar_inactive_icon--hover, #939CA9);
+@vkontakte-color-tabbar-inactive-icon--active: var(--vkui--vkontakte_color_tabbar_inactive_icon--active, #8D96A4);
+@vkontakte-color-tabbar-tablet-text-secondary: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary, #818c99);
+@vkontakte-color-tabbar-tablet-text-secondary--hover: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary--hover, #7C8795);
+@vkontakte-color-tabbar-tablet-text-secondary--active: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary--active, #778292);
+@vkontakte-color-toolbar-attach-background-from: var(--vkui--vkontakte_color_toolbar_attach_background_from, #dce1e6);
+@vkontakte-color-toolbar-attach-background-from--hover: var(--vkui--vkontakte_color_toolbar_attach_background_from--hover, #D3D9DF);
+@vkontakte-color-toolbar-attach-background-from--active: var(--vkui--vkontakte_color_toolbar_attach_background_from--active, #CAD0D8);
+@vkontakte-color-splash-screen-icon: var(--vkui--vkontakte_color_splash_screen_icon, #dce1e6);
+@vkontakte-color-splash-screen-icon--hover: var(--vkui--vkontakte_color_splash_screen_icon--hover, #D3D9DF);
+@vkontakte-color-splash-screen-icon--active: var(--vkui--vkontakte_color_splash_screen_icon--active, #CAD0D8);
+@vkontakte-color-icon-name: var(--vkui--vkontakte_color_icon_name, #8fadc8);
+@vkontakte-color-icon-name--hover: var(--vkui--vkontakte_color_icon_name--hover, #89A7C2);
+@vkontakte-color-icon-name--active: var(--vkui--vkontakte_color_icon_name--active, #84A0BD);
+@vkontakte-color-panel-tab-active-text: var(--vkui--vkontakte_color_panel_tab_active_text, #4e5966);
+@vkontakte-color-panel-tab-active-text--hover: var(--vkui--vkontakte_color_panel_tab_active_text--hover, #4B5664);
+@vkontakte-color-panel-tab-active-text--active: var(--vkui--vkontakte_color_panel_tab_active_text--active, #485363);
+@vkontakte-color-background-text-alpha: var(--vkui--vkontakte_color_background_text_alpha, rgba(81, 129, 184, 0.2));
+@vkontakte-color-background-text-alpha--hover: var(--vkui--vkontakte_color_background_text_alpha--hover, rgba(81, 129, 184, 0.24));
+@vkontakte-color-background-text-alpha--active: var(--vkui--vkontakte_color_background_text_alpha--active, rgba(81, 129, 184, 0.28));
+@vkontakte-color-modal-card-header-close: var(--vkui--vkontakte_color_modal_card_header_close, #000000);
+@vkontakte-color-modal-card-header-close--hover: var(--vkui--vkontakte_color_modal_card_header_close--hover, #000102);
+@vkontakte-color-modal-card-header-close--active: var(--vkui--vkontakte_color_modal_card_header_close--active, #000105);
+@vkontakte-im-bubble-button-outgoing-background-alpha: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha, rgba(255, 255, 255, 0.72));
+@vkontakte-im-bubble-button-outgoing-background-alpha--hover: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha--hover, rgba(255, 255, 255, 0.76));
+@vkontakte-im-bubble-button-outgoing-background-alpha--active: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha--active, rgba(255, 255, 255, 0.8));
+@vkontakte-im-bubble-button-foreground: var(--vkui--vkontakte_im_bubble_button_foreground, #000000);
+@vkontakte-im-bubble-button-foreground--hover: var(--vkui--vkontakte_im_bubble_button_foreground--hover, #000102);
+@vkontakte-im-bubble-button-foreground--active: var(--vkui--vkontakte_im_bubble_button_foreground--active, #000105);
+@vkontakte-im-bubble-incoming-highlighted: var(--vkui--vkontakte_im_bubble_incoming_highlighted, #d3d9de);
+@vkontakte-im-bubble-incoming-highlighted--hover: var(--vkui--vkontakte_im_bubble_incoming_highlighted--hover, #CBD1D8);
+@vkontakte-im-bubble-incoming-highlighted--active: var(--vkui--vkontakte_im_bubble_incoming_highlighted--active, #C2C9D1);
+@vkontakte-im-bubble-gift-background: var(--vkui--vkontakte_im_bubble_gift_background, #f4e7c3);
+@vkontakte-im-bubble-gift-background--hover: var(--vkui--vkontakte_im_bubble_gift_background--hover, #EADEBE);
+@vkontakte-im-bubble-gift-background--active: var(--vkui--vkontakte_im_bubble_gift_background--active, #E0D6B8);
+@vkontakte-im-bubble-gift-background-highlighted: var(--vkui--vkontakte_im_bubble_gift_background_highlighted, #e3d3ac);
+@vkontakte-im-bubble-gift-background-highlighted--hover: var(--vkui--vkontakte_im_bubble_gift_background_highlighted--hover, #DACBA8);
+@vkontakte-im-bubble-gift-background-highlighted--active: var(--vkui--vkontakte_im_bubble_gift_background_highlighted--active, #D1C3A3);
+@vkontakte-im-bubble-outgoing-alternate: var(--vkui--vkontakte_im_bubble_outgoing_alternate, #FFFFFF);
+@vkontakte-im-bubble-outgoing-alternate--hover: var(--vkui--vkontakte_im_bubble_outgoing_alternate--hover, #F5F5F7);
+@vkontakte-im-bubble-outgoing-alternate--active: var(--vkui--vkontakte_im_bubble_outgoing_alternate--active, #EBECEF);
+@vkontakte-im-attach-tint: var(--vkui--vkontakte_im_attach_tint, #447bba);
+@vkontakte-im-attach-tint--hover: var(--vkui--vkontakte_im_attach_tint--hover, #4177B5);
+@vkontakte-im-attach-tint--active: var(--vkui--vkontakte_im_attach_tint--active, #3F72B0);
+@vkontakte-im-reply-separator: var(--vkui--vkontakte_im_reply_separator, #2a5885);
+@vkontakte-im-reply-separator--hover: var(--vkui--vkontakte_im_reply_separator--hover, #285582);
+@vkontakte-im-reply-separator--active: var(--vkui--vkontakte_im_reply_separator--active, #27527F);
+@vkontakte-im-toolbar-voice-msg-background: var(--vkui--vkontakte_im_toolbar_voice_msg_background, #99a2ad);
+@vkontakte-im-toolbar-voice-msg-background--hover: var(--vkui--vkontakte_im_toolbar_voice_msg_background--hover, #939CA9);
+@vkontakte-im-toolbar-voice-msg-background--active: var(--vkui--vkontakte_im_toolbar_voice_msg_background--active, #8D96A4);
 @vkontakte-color-im-forward-line-alpha: var(--vkui--vkontakte_color_im_forward_line_alpha, rgba(0, 20, 51, 0.12));
 @vkontakte-color-im-forward-line-alpha--hover: var(--vkui--vkontakte_color_im_forward_line_alpha--hover, rgba(0, 20, 51, 0.16));
 @vkontakte-color-im-forward-line-alpha--active: var(--vkui--vkontakte_color_im_forward_line_alpha--active, rgba(0, 20, 51, 0.2));

package/themes/vkontakteCom/cssVars/theme/fallbacks/index.pcss CHANGED Viewed

@@ -260,6 +260,9 @@
 	--color-link-contrast: var(--vkui--color_link_contrast, #333333);
 	--color-link-contrast--hover: var(--vkui--color_link_contrast--hover, #313233);
 	--color-link-contrast--active: var(--vkui--color_link_contrast--active, #2F3034);
+	--color-text-button: var(--vkui--color_text_button, #346297);
+	--color-text-button--hover: var(--vkui--color_text_button--hover, #325F93);
+	--color-text-button--active: var(--vkui--color_text_button--active, #305B90);
 	--color-icon-accent: var(--vkui--color_icon_accent, #447BBA);
 	--color-icon-accent--hover: var(--vkui--color_icon_accent--hover, #4177B5);
 	--color-icon-accent--active: var(--vkui--color_icon_accent--active, #3F72B0);
@@ -305,6 +308,9 @@
 	--color-icon-negative: var(--vkui--color_icon_negative, #E64646);
 	--color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 	--color-icon-negative--active: var(--vkui--color_icon_negative--active, #D44245);
+	--color-icon-button: var(--vkui--color_icon_button, #346297);
+	--color-icon-button--hover: var(--vkui--color_icon_button--hover, #325F93);
+	--color-icon-button--active: var(--vkui--color_icon_button--active, #305B90);
 	--color-stroke-accent: var(--vkui--color_stroke_accent, #447BBA);
 	--color-stroke-accent--hover: var(--vkui--color_stroke_accent--hover, #4177B5);
 	--color-stroke-accent--active: var(--vkui--color_stroke_accent--active, #3F72B0);
@@ -341,6 +347,9 @@
 	--color-field-border-alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 	--color-field-border-alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 	--color-field-border-alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+	--color-stroke-button: var(--vkui--color_stroke_button, #346297);
+	--color-stroke-button--hover: var(--vkui--color_stroke_button--hover, #325F93);
+	--color-stroke-button--active: var(--vkui--color_stroke_button--active, #305B90);
 	--color-accent-blue: var(--vkui--color_accent_blue, #5181B8);
 	--color-accent-blue--hover: var(--vkui--color_accent_blue--hover, #4E7CB3);
 	--color-accent-blue--active: var(--vkui--color_accent_blue--active, #4B78AE);
@@ -428,6 +437,9 @@
 	--vkontakte-color-snippet-border-alpha: var(--vkui--vkontakte_color_snippet_border_alpha, rgba(0, 0, 0, 0.12));
 	--vkontakte-color-snippet-border-alpha--hover: var(--vkui--vkontakte_color_snippet_border_alpha--hover, rgba(0, 0, 0, 0.16));
 	--vkontakte-color-snippet-border-alpha--active: var(--vkui--vkontakte_color_snippet_border_alpha--active, rgba(0, 0, 0, 0.2));
+	--vkontakte-color-snippet-background: var(--vkui--vkontakte_color_snippet_background, #FFFFFF);
+	--vkontakte-color-snippet-background--hover: var(--vkui--vkontakte_color_snippet_background--hover, #F5F5F7);
+	--vkontakte-color-snippet-background--active: var(--vkui--vkontakte_color_snippet_background--active, #EBECEF);
 	--vkontakte-color-modal-card-border-alpha: var(--vkui--vkontakte_color_modal_card_border_alpha, rgba(0, 0, 0, 0));
 	--vkontakte-color-modal-card-border-alpha--hover: var(--vkui--vkontakte_color_modal_card_border_alpha--hover, rgba(0, 0, 0, 0.04));
 	--vkontakte-color-modal-card-border-alpha--active: var(--vkui--vkontakte_color_modal_card_border_alpha--active, rgba(0, 0, 0, 0.08));
@@ -440,6 +452,144 @@
 	--vkontakte-color-input-border: var(--vkui--vkontakte_color_input_border, #D3D9DE);
 	--vkontakte-color-input-border--hover: var(--vkui--vkontakte_color_input_border--hover, #CBD1D8);
 	--vkontakte-color-input-border--active: var(--vkui--vkontakte_color_input_border--active, #C2C9D1);
+	--vkontakte-color-search-bar-background: var(--vkui--vkontakte_color_search_bar_background, #e5ebf1);
+	--vkontakte-color-search-bar-background--hover: var(--vkui--vkontakte_color_search_bar_background--hover, #DCE2EA);
+	--vkontakte-color-search-bar-background--active: var(--vkui--vkontakte_color_search_bar_background--active, #D3D9E3);
+	--vkontakte-color-search-bar-field-tint: var(--vkui--vkontakte_color_search_bar_field_tint, #818c99);
+	--vkontakte-color-search-bar-field-tint--hover: var(--vkui--vkontakte_color_search_bar_field_tint--hover, #7C8795);
+	--vkontakte-color-search-bar-field-tint--active: var(--vkui--vkontakte_color_search_bar_field_tint--active, #778292);
+	--vkontakte-background-hover-alpha: var(--vkui--vkontakte_background_hover_alpha, rgba(174, 183, 194, 0.12));
+	--vkontakte-background-hover-alpha--hover: var(--vkui--vkontakte_background_hover_alpha--hover, rgba(174, 183, 194, 0.16));
+	--vkontakte-background-hover-alpha--active: var(--vkui--vkontakte_background_hover_alpha--active, rgba(174, 183, 194, 0.2));
+	--vkontakte-color-accent-alternate: var(--vkui--vkontakte_color_accent_alternate, #0077ff);
+	--vkontakte-color-accent-alternate--hover: var(--vkui--vkontakte_color_accent_alternate--hover, #0073F7);
+	--vkontakte-color-accent-alternate--active: var(--vkui--vkontakte_color_accent_alternate--active, #006FEF);
+	--vkontakte-color-background-suggestions: var(--vkui--vkontakte_color_background_suggestions, #FFFFFF);
+	--vkontakte-color-background-suggestions--hover: var(--vkui--vkontakte_color_background_suggestions--hover, #F5F5F7);
+	--vkontakte-color-background-suggestions--active: var(--vkui--vkontakte_color_background_suggestions--active, #EBECEF);
+	--vkontakte-color-background-keyboard: var(--vkui--vkontakte_color_background_keyboard, #dce1e6);
+	--vkontakte-color-background-keyboard--hover: var(--vkui--vkontakte_color_background_keyboard--hover, #D3D9DF);
+	--vkontakte-color-background-keyboard--active: var(--vkui--vkontakte_color_background_keyboard--active, #CAD0D8);
+	--vkontakte-color-content-placeholder-icon: var(--vkui--vkontakte_color_content_placeholder_icon, #b2b2b2);
+	--vkontakte-color-content-placeholder-icon--hover: var(--vkui--vkontakte_color_content_placeholder_icon--hover, #ABACAD);
+	--vkontakte-color-content-placeholder-icon--active: var(--vkui--vkontakte_color_content_placeholder_icon--active, #A4A5A9);
+	--vkontakte-color-content-tint-foreground: var(--vkui--vkontakte_color_content_tint_foreground, #939393);
+	--vkontakte-color-content-tint-foreground--hover: var(--vkui--vkontakte_color_content_tint_foreground--hover, #8D8E90);
+	--vkontakte-color-content-tint-foreground--active: var(--vkui--vkontakte_color_content_tint_foreground--active, #87898C);
+	--vkontakte-color-text-name: var(--vkui--vkontakte_color_text_name, #2a5885);
+	--vkontakte-color-text-name--hover: var(--vkui--vkontakte_color_text_name--hover, #285582);
+	--vkontakte-color-text-name--active: var(--vkui--vkontakte_color_text_name--active, #27527F);
+	--vkontakte-color-control-background: var(--vkui--vkontakte_color_control_background, #edeef0);
+	--vkontakte-color-control-background--hover: var(--vkui--vkontakte_color_control_background--hover, #E4E5E9);
+	--vkontakte-color-control-background--active: var(--vkui--vkontakte_color_control_background--active, #DADCE2);
+	--vkontakte-color-control-foreground: var(--vkui--vkontakte_color_control_foreground, #447bba);
+	--vkontakte-color-control-foreground--hover: var(--vkui--vkontakte_color_control_foreground--hover, #4177B5);
+	--vkontakte-color-control-foreground--active: var(--vkui--vkontakte_color_control_foreground--active, #3F72B0);
+	--vkontakte-color-control-tint-muted: var(--vkui--vkontakte_color_control_tint_muted, #828282);
+	--vkontakte-color-control-tint-muted--hover: var(--vkui--vkontakte_color_control_tint_muted--hover, #7D7D7F);
+	--vkontakte-color-control-tint-muted--active: var(--vkui--vkontakte_color_control_tint_muted--active, #78797C);
+	--vkontakte-color-header-search-field-background: var(--vkui--vkontakte_color_header_search_field_background, #edeef0);
+	--vkontakte-color-header-search-field-background--hover: var(--vkui--vkontakte_color_header_search_field_background--hover, #E4E5E9);
+	--vkontakte-color-header-search-field-background--active: var(--vkui--vkontakte_color_header_search_field_background--active, #DADCE2);
+	--vkontakte-color-header-search-field-tint: var(--vkui--vkontakte_color_header_search_field_tint, #818c99);
+	--vkontakte-color-header-search-field-tint--hover: var(--vkui--vkontakte_color_header_search_field_tint--hover, #7C8795);
+	--vkontakte-color-header-search-field-tint--active: var(--vkui--vkontakte_color_header_search_field_tint--active, #778292);
+	--vkontakte-color-header-tab-active-indicator: var(--vkui--vkontakte_color_header_tab_active_indicator, #397dcc);
+	--vkontakte-color-header-tab-active-indicator--hover: var(--vkui--vkontakte_color_header_tab_active_indicator--hover, #3779C6);
+	--vkontakte-color-header-tab-active-indicator--active: var(--vkui--vkontakte_color_header_tab_active_indicator--active, #3474C1);
+	--vkontakte-color-icon-outline-medium: var(--vkui--vkontakte_color_icon_outline_medium, #818c99);
+	--vkontakte-color-icon-outline-medium--hover: var(--vkui--vkontakte_color_icon_outline_medium--hover, #7C8795);
+	--vkontakte-color-icon-outline-medium--active: var(--vkui--vkontakte_color_icon_outline_medium--active, #778292);
+	--vkontakte-color-icon-outline-secondary: var(--vkui--vkontakte_color_icon_outline_secondary, #99a2ad);
+	--vkontakte-color-icon-outline-secondary--hover: var(--vkui--vkontakte_color_icon_outline_secondary--hover, #939CA9);
+	--vkontakte-color-icon-outline-secondary--active: var(--vkui--vkontakte_color_icon_outline_secondary--active, #8D96A4);
+	--vkontakte-color-skeleton-shimmer-from: var(--vkui--vkontakte_color_skeleton_shimmer_from, #FFFFFF);
+	--vkontakte-color-skeleton-shimmer-from--hover: var(--vkui--vkontakte_color_skeleton_shimmer_from--hover, #F5F5F7);
+	--vkontakte-color-skeleton-shimmer-from--active: var(--vkui--vkontakte_color_skeleton_shimmer_from--active, #EBECEF);
+	--vkontakte-color-alpha-skeleton-shimmer-to: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to, transparent);
+	--vkontakte-color-alpha-skeleton-shimmer-to--hover: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to--hover, rgba(0, 16, 61, 0.04));
+	--vkontakte-color-alpha-skeleton-shimmer-to--active: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to--active, rgba(0, 16, 61, 0.08));
+	--vkontakte-color-loader-background: var(--vkui--vkontakte_color_loader_background, #edeef0);
+	--vkontakte-color-loader-background--hover: var(--vkui--vkontakte_color_loader_background--hover, #E4E5E9);
+	--vkontakte-color-loader-background--active: var(--vkui--vkontakte_color_loader_background--active, #DADCE2);
+	--vkontakte-color-loader-tint: var(--vkui--vkontakte_color_loader_tint, #828282);
+	--vkontakte-color-loader-tint--hover: var(--vkui--vkontakte_color_loader_tint--hover, #7D7D7F);
+	--vkontakte-color-loader-tint--active: var(--vkui--vkontakte_color_loader_tint--active, #78797C);
+	--vkontakte-color-music-playback-icon: var(--vkui--vkontakte_color_music_playback_icon, #000000);
+	--vkontakte-color-music-playback-icon--hover: var(--vkui--vkontakte_color_music_playback_icon--hover, #000102);
+	--vkontakte-color-music-playback-icon--active: var(--vkui--vkontakte_color_music_playback_icon--active, #000105);
+	--vkontakte-color-status-background: var(--vkui--vkontakte_color_status_background, #edeef0);
+	--vkontakte-color-status-background--hover: var(--vkui--vkontakte_color_status_background--hover, #E4E5E9);
+	--vkontakte-color-status-background--active: var(--vkui--vkontakte_color_status_background--active, #DADCE2);
+	--vkontakte-color-placeholder-icon-foreground-primary: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary, #99a2ad);
+	--vkontakte-color-placeholder-icon-foreground-primary--hover: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary--hover, #939CA9);
+	--vkontakte-color-placeholder-icon-foreground-primary--active: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary--active, #8D96A4);
+	--vkontakte-color-placeholder-icon-foreground-secondary: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary, #aeb7c2);
+	--vkontakte-color-placeholder-icon-foreground-secondary--hover: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary--hover, #A7B0BD);
+	--vkontakte-color-placeholder-icon-foreground-secondary--active: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary--active, #A0AAB7);
+	--vkontakte-color-placeholder-icon-tint: var(--vkui--vkontakte_color_placeholder_icon_tint, #1d3a5c);
+	--vkontakte-color-placeholder-icon-tint--hover: var(--vkui--vkontakte_color_placeholder_icon_tint--hover, #1C385B);
+	--vkontakte-color-placeholder-icon-tint--active: var(--vkui--vkontakte_color_placeholder_icon_tint--active, #1B375A);
+	--vkontakte-color-poll-option-background: var(--vkui--vkontakte_color_poll_option_background, #447bba);
+	--vkontakte-color-poll-option-background--hover: var(--vkui--vkontakte_color_poll_option_background--hover, #4177B5);
+	--vkontakte-color-poll-option-background--active: var(--vkui--vkontakte_color_poll_option_background--active, #3F72B0);
+	--vkontakte-color-tabbar-active-icon: var(--vkui--vkontakte_color_tabbar_active_icon, #447bba);
+	--vkontakte-color-tabbar-active-icon--hover: var(--vkui--vkontakte_color_tabbar_active_icon--hover, #4177B5);
+	--vkontakte-color-tabbar-active-icon--active: var(--vkui--vkontakte_color_tabbar_active_icon--active, #3F72B0);
+	--vkontakte-color-tabbar-background: var(--vkui--vkontakte_color_tabbar_background, #f7f8fa);
+	--vkontakte-color-tabbar-background--hover: var(--vkui--vkontakte_color_tabbar_background--hover, #EDEFF2);
+	--vkontakte-color-tabbar-background--active: var(--vkui--vkontakte_color_tabbar_background--active, #E3E5EB);
+	--vkontakte-color-tabbar-inactive-icon: var(--vkui--vkontakte_color_tabbar_inactive_icon, #99a2ad);
+	--vkontakte-color-tabbar-inactive-icon--hover: var(--vkui--vkontakte_color_tabbar_inactive_icon--hover, #939CA9);
+	--vkontakte-color-tabbar-inactive-icon--active: var(--vkui--vkontakte_color_tabbar_inactive_icon--active, #8D96A4);
+	--vkontakte-color-tabbar-tablet-text-secondary: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary, #818c99);
+	--vkontakte-color-tabbar-tablet-text-secondary--hover: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary--hover, #7C8795);
+	--vkontakte-color-tabbar-tablet-text-secondary--active: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary--active, #778292);
+	--vkontakte-color-toolbar-attach-background-from: var(--vkui--vkontakte_color_toolbar_attach_background_from, #dce1e6);
+	--vkontakte-color-toolbar-attach-background-from--hover: var(--vkui--vkontakte_color_toolbar_attach_background_from--hover, #D3D9DF);
+	--vkontakte-color-toolbar-attach-background-from--active: var(--vkui--vkontakte_color_toolbar_attach_background_from--active, #CAD0D8);
+	--vkontakte-color-splash-screen-icon: var(--vkui--vkontakte_color_splash_screen_icon, #dce1e6);
+	--vkontakte-color-splash-screen-icon--hover: var(--vkui--vkontakte_color_splash_screen_icon--hover, #D3D9DF);
+	--vkontakte-color-splash-screen-icon--active: var(--vkui--vkontakte_color_splash_screen_icon--active, #CAD0D8);
+	--vkontakte-color-icon-name: var(--vkui--vkontakte_color_icon_name, #8fadc8);
+	--vkontakte-color-icon-name--hover: var(--vkui--vkontakte_color_icon_name--hover, #89A7C2);
+	--vkontakte-color-icon-name--active: var(--vkui--vkontakte_color_icon_name--active, #84A0BD);
+	--vkontakte-color-panel-tab-active-text: var(--vkui--vkontakte_color_panel_tab_active_text, #4e5966);
+	--vkontakte-color-panel-tab-active-text--hover: var(--vkui--vkontakte_color_panel_tab_active_text--hover, #4B5664);
+	--vkontakte-color-panel-tab-active-text--active: var(--vkui--vkontakte_color_panel_tab_active_text--active, #485363);
+	--vkontakte-color-background-text-alpha: var(--vkui--vkontakte_color_background_text_alpha, rgba(81, 129, 184, 0.2));
+	--vkontakte-color-background-text-alpha--hover: var(--vkui--vkontakte_color_background_text_alpha--hover, rgba(81, 129, 184, 0.24));
+	--vkontakte-color-background-text-alpha--active: var(--vkui--vkontakte_color_background_text_alpha--active, rgba(81, 129, 184, 0.28));
+	--vkontakte-color-modal-card-header-close: var(--vkui--vkontakte_color_modal_card_header_close, #000000);
+	--vkontakte-color-modal-card-header-close--hover: var(--vkui--vkontakte_color_modal_card_header_close--hover, #000102);
+	--vkontakte-color-modal-card-header-close--active: var(--vkui--vkontakte_color_modal_card_header_close--active, #000105);
+	--vkontakte-im-bubble-button-outgoing-background-alpha: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha, rgba(255, 255, 255, 0.72));
+	--vkontakte-im-bubble-button-outgoing-background-alpha--hover: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha--hover, rgba(255, 255, 255, 0.76));
+	--vkontakte-im-bubble-button-outgoing-background-alpha--active: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha--active, rgba(255, 255, 255, 0.8));
+	--vkontakte-im-bubble-button-foreground: var(--vkui--vkontakte_im_bubble_button_foreground, #000000);
+	--vkontakte-im-bubble-button-foreground--hover: var(--vkui--vkontakte_im_bubble_button_foreground--hover, #000102);
+	--vkontakte-im-bubble-button-foreground--active: var(--vkui--vkontakte_im_bubble_button_foreground--active, #000105);
+	--vkontakte-im-bubble-incoming-highlighted: var(--vkui--vkontakte_im_bubble_incoming_highlighted, #d3d9de);
+	--vkontakte-im-bubble-incoming-highlighted--hover: var(--vkui--vkontakte_im_bubble_incoming_highlighted--hover, #CBD1D8);
+	--vkontakte-im-bubble-incoming-highlighted--active: var(--vkui--vkontakte_im_bubble_incoming_highlighted--active, #C2C9D1);
+	--vkontakte-im-bubble-gift-background: var(--vkui--vkontakte_im_bubble_gift_background, #f4e7c3);
+	--vkontakte-im-bubble-gift-background--hover: var(--vkui--vkontakte_im_bubble_gift_background--hover, #EADEBE);
+	--vkontakte-im-bubble-gift-background--active: var(--vkui--vkontakte_im_bubble_gift_background--active, #E0D6B8);
+	--vkontakte-im-bubble-gift-background-highlighted: var(--vkui--vkontakte_im_bubble_gift_background_highlighted, #e3d3ac);
+	--vkontakte-im-bubble-gift-background-highlighted--hover: var(--vkui--vkontakte_im_bubble_gift_background_highlighted--hover, #DACBA8);
+	--vkontakte-im-bubble-gift-background-highlighted--active: var(--vkui--vkontakte_im_bubble_gift_background_highlighted--active, #D1C3A3);
+	--vkontakte-im-bubble-outgoing-alternate: var(--vkui--vkontakte_im_bubble_outgoing_alternate, #FFFFFF);
+	--vkontakte-im-bubble-outgoing-alternate--hover: var(--vkui--vkontakte_im_bubble_outgoing_alternate--hover, #F5F5F7);
+	--vkontakte-im-bubble-outgoing-alternate--active: var(--vkui--vkontakte_im_bubble_outgoing_alternate--active, #EBECEF);
+	--vkontakte-im-attach-tint: var(--vkui--vkontakte_im_attach_tint, #447bba);
+	--vkontakte-im-attach-tint--hover: var(--vkui--vkontakte_im_attach_tint--hover, #4177B5);
+	--vkontakte-im-attach-tint--active: var(--vkui--vkontakte_im_attach_tint--active, #3F72B0);
+	--vkontakte-im-reply-separator: var(--vkui--vkontakte_im_reply_separator, #2a5885);
+	--vkontakte-im-reply-separator--hover: var(--vkui--vkontakte_im_reply_separator--hover, #285582);
+	--vkontakte-im-reply-separator--active: var(--vkui--vkontakte_im_reply_separator--active, #27527F);
+	--vkontakte-im-toolbar-voice-msg-background: var(--vkui--vkontakte_im_toolbar_voice_msg_background, #99a2ad);
+	--vkontakte-im-toolbar-voice-msg-background--hover: var(--vkui--vkontakte_im_toolbar_voice_msg_background--hover, #939CA9);
+	--vkontakte-im-toolbar-voice-msg-background--active: var(--vkui--vkontakte_im_toolbar_voice_msg_background--active, #8D96A4);
 	--vkontakte-color-im-forward-line-alpha: var(--vkui--vkontakte_color_im_forward_line_alpha, rgba(0, 20, 51, 0.12));
 	--vkontakte-color-im-forward-line-alpha--hover: var(--vkui--vkontakte_color_im_forward_line_alpha--hover, rgba(0, 20, 51, 0.16));
 	--vkontakte-color-im-forward-line-alpha--active: var(--vkui--vkontakte_color_im_forward_line_alpha--active, rgba(0, 20, 51, 0.2));

package/themes/vkontakteCom/cssVars/theme/fallbacks/index.scss CHANGED Viewed

@@ -259,6 +259,9 @@ $color-text-muted--active: var(--vkui--color_text_muted--active, #2F3034);
 $color-link-contrast: var(--vkui--color_link_contrast, #333333);
 $color-link-contrast--hover: var(--vkui--color_link_contrast--hover, #313233);
 $color-link-contrast--active: var(--vkui--color_link_contrast--active, #2F3034);
+$color-text-button: var(--vkui--color_text_button, #346297);
+$color-text-button--hover: var(--vkui--color_text_button--hover, #325F93);
+$color-text-button--active: var(--vkui--color_text_button--active, #305B90);
 $color-icon-accent: var(--vkui--color_icon_accent, #447BBA);
 $color-icon-accent--hover: var(--vkui--color_icon_accent--hover, #4177B5);
 $color-icon-accent--active: var(--vkui--color_icon_accent--active, #3F72B0);
@@ -304,6 +307,9 @@ $color-icon-positive--active: var(--vkui--color_icon_positive--active, #45A64A);
 $color-icon-negative: var(--vkui--color_icon_negative, #E64646);
 $color-icon-negative--hover: var(--vkui--color_icon_negative--hover, #DD4446);
 $color-icon-negative--active: var(--vkui--color_icon_negative--active, #D44245);
+$color-icon-button: var(--vkui--color_icon_button, #346297);
+$color-icon-button--hover: var(--vkui--color_icon_button--hover, #325F93);
+$color-icon-button--active: var(--vkui--color_icon_button--active, #305B90);
 $color-stroke-accent: var(--vkui--color_stroke_accent, #447BBA);
 $color-stroke-accent--hover: var(--vkui--color_stroke_accent--hover, #4177B5);
 $color-stroke-accent--active: var(--vkui--color_stroke_accent--active, #3F72B0);
@@ -340,6 +346,9 @@ $color-image-border-alpha--active: var(--vkui--color_image_border_alpha--active,
 $color-field-border-alpha: var(--vkui--color_field_border_alpha, rgba(0, 0, 0, 0.12));
 $color-field-border-alpha--hover: var(--vkui--color_field_border_alpha--hover, rgba(0, 0, 0, 0.24));
 $color-field-border-alpha--active: var(--vkui--color_field_border_alpha--active, rgba(0, 0, 0, 0.36));
+$color-stroke-button: var(--vkui--color_stroke_button, #346297);
+$color-stroke-button--hover: var(--vkui--color_stroke_button--hover, #325F93);
+$color-stroke-button--active: var(--vkui--color_stroke_button--active, #305B90);
 $color-accent-blue: var(--vkui--color_accent_blue, #5181B8);
 $color-accent-blue--hover: var(--vkui--color_accent_blue--hover, #4E7CB3);
 $color-accent-blue--active: var(--vkui--color_accent_blue--active, #4B78AE);
@@ -427,6 +436,9 @@ $color-transparent--active: var(--vkui--color_transparent--active, rgba(0, 16, 6
 $vkontakte-color-snippet-border-alpha: var(--vkui--vkontakte_color_snippet_border_alpha, rgba(0, 0, 0, 0.12));
 $vkontakte-color-snippet-border-alpha--hover: var(--vkui--vkontakte_color_snippet_border_alpha--hover, rgba(0, 0, 0, 0.16));
 $vkontakte-color-snippet-border-alpha--active: var(--vkui--vkontakte_color_snippet_border_alpha--active, rgba(0, 0, 0, 0.2));
+$vkontakte-color-snippet-background: var(--vkui--vkontakte_color_snippet_background, #FFFFFF);
+$vkontakte-color-snippet-background--hover: var(--vkui--vkontakte_color_snippet_background--hover, #F5F5F7);
+$vkontakte-color-snippet-background--active: var(--vkui--vkontakte_color_snippet_background--active, #EBECEF);
 $vkontakte-color-modal-card-border-alpha: var(--vkui--vkontakte_color_modal_card_border_alpha, rgba(0, 0, 0, 0));
 $vkontakte-color-modal-card-border-alpha--hover: var(--vkui--vkontakte_color_modal_card_border_alpha--hover, rgba(0, 0, 0, 0.04));
 $vkontakte-color-modal-card-border-alpha--active: var(--vkui--vkontakte_color_modal_card_border_alpha--active, rgba(0, 0, 0, 0.08));
@@ -439,6 +451,144 @@ $vkontakte-color-action-sheet-separator-alpha--active: var(--vkui--vkontakte_col
 $vkontakte-color-input-border: var(--vkui--vkontakte_color_input_border, #D3D9DE);
 $vkontakte-color-input-border--hover: var(--vkui--vkontakte_color_input_border--hover, #CBD1D8);
 $vkontakte-color-input-border--active: var(--vkui--vkontakte_color_input_border--active, #C2C9D1);
+$vkontakte-color-search-bar-background: var(--vkui--vkontakte_color_search_bar_background, #e5ebf1);
+$vkontakte-color-search-bar-background--hover: var(--vkui--vkontakte_color_search_bar_background--hover, #DCE2EA);
+$vkontakte-color-search-bar-background--active: var(--vkui--vkontakte_color_search_bar_background--active, #D3D9E3);
+$vkontakte-color-search-bar-field-tint: var(--vkui--vkontakte_color_search_bar_field_tint, #818c99);
+$vkontakte-color-search-bar-field-tint--hover: var(--vkui--vkontakte_color_search_bar_field_tint--hover, #7C8795);
+$vkontakte-color-search-bar-field-tint--active: var(--vkui--vkontakte_color_search_bar_field_tint--active, #778292);
+$vkontakte-background-hover-alpha: var(--vkui--vkontakte_background_hover_alpha, rgba(174, 183, 194, 0.12));
+$vkontakte-background-hover-alpha--hover: var(--vkui--vkontakte_background_hover_alpha--hover, rgba(174, 183, 194, 0.16));
+$vkontakte-background-hover-alpha--active: var(--vkui--vkontakte_background_hover_alpha--active, rgba(174, 183, 194, 0.2));
+$vkontakte-color-accent-alternate: var(--vkui--vkontakte_color_accent_alternate, #0077ff);
+$vkontakte-color-accent-alternate--hover: var(--vkui--vkontakte_color_accent_alternate--hover, #0073F7);
+$vkontakte-color-accent-alternate--active: var(--vkui--vkontakte_color_accent_alternate--active, #006FEF);
+$vkontakte-color-background-suggestions: var(--vkui--vkontakte_color_background_suggestions, #FFFFFF);
+$vkontakte-color-background-suggestions--hover: var(--vkui--vkontakte_color_background_suggestions--hover, #F5F5F7);
+$vkontakte-color-background-suggestions--active: var(--vkui--vkontakte_color_background_suggestions--active, #EBECEF);
+$vkontakte-color-background-keyboard: var(--vkui--vkontakte_color_background_keyboard, #dce1e6);
+$vkontakte-color-background-keyboard--hover: var(--vkui--vkontakte_color_background_keyboard--hover, #D3D9DF);
+$vkontakte-color-background-keyboard--active: var(--vkui--vkontakte_color_background_keyboard--active, #CAD0D8);
+$vkontakte-color-content-placeholder-icon: var(--vkui--vkontakte_color_content_placeholder_icon, #b2b2b2);
+$vkontakte-color-content-placeholder-icon--hover: var(--vkui--vkontakte_color_content_placeholder_icon--hover, #ABACAD);
+$vkontakte-color-content-placeholder-icon--active: var(--vkui--vkontakte_color_content_placeholder_icon--active, #A4A5A9);
+$vkontakte-color-content-tint-foreground: var(--vkui--vkontakte_color_content_tint_foreground, #939393);
+$vkontakte-color-content-tint-foreground--hover: var(--vkui--vkontakte_color_content_tint_foreground--hover, #8D8E90);
+$vkontakte-color-content-tint-foreground--active: var(--vkui--vkontakte_color_content_tint_foreground--active, #87898C);
+$vkontakte-color-text-name: var(--vkui--vkontakte_color_text_name, #2a5885);
+$vkontakte-color-text-name--hover: var(--vkui--vkontakte_color_text_name--hover, #285582);
+$vkontakte-color-text-name--active: var(--vkui--vkontakte_color_text_name--active, #27527F);
+$vkontakte-color-control-background: var(--vkui--vkontakte_color_control_background, #edeef0);
+$vkontakte-color-control-background--hover: var(--vkui--vkontakte_color_control_background--hover, #E4E5E9);
+$vkontakte-color-control-background--active: var(--vkui--vkontakte_color_control_background--active, #DADCE2);
+$vkontakte-color-control-foreground: var(--vkui--vkontakte_color_control_foreground, #447bba);
+$vkontakte-color-control-foreground--hover: var(--vkui--vkontakte_color_control_foreground--hover, #4177B5);
+$vkontakte-color-control-foreground--active: var(--vkui--vkontakte_color_control_foreground--active, #3F72B0);
+$vkontakte-color-control-tint-muted: var(--vkui--vkontakte_color_control_tint_muted, #828282);
+$vkontakte-color-control-tint-muted--hover: var(--vkui--vkontakte_color_control_tint_muted--hover, #7D7D7F);
+$vkontakte-color-control-tint-muted--active: var(--vkui--vkontakte_color_control_tint_muted--active, #78797C);
+$vkontakte-color-header-search-field-background: var(--vkui--vkontakte_color_header_search_field_background, #edeef0);
+$vkontakte-color-header-search-field-background--hover: var(--vkui--vkontakte_color_header_search_field_background--hover, #E4E5E9);
+$vkontakte-color-header-search-field-background--active: var(--vkui--vkontakte_color_header_search_field_background--active, #DADCE2);
+$vkontakte-color-header-search-field-tint: var(--vkui--vkontakte_color_header_search_field_tint, #818c99);
+$vkontakte-color-header-search-field-tint--hover: var(--vkui--vkontakte_color_header_search_field_tint--hover, #7C8795);
+$vkontakte-color-header-search-field-tint--active: var(--vkui--vkontakte_color_header_search_field_tint--active, #778292);
+$vkontakte-color-header-tab-active-indicator: var(--vkui--vkontakte_color_header_tab_active_indicator, #397dcc);
+$vkontakte-color-header-tab-active-indicator--hover: var(--vkui--vkontakte_color_header_tab_active_indicator--hover, #3779C6);
+$vkontakte-color-header-tab-active-indicator--active: var(--vkui--vkontakte_color_header_tab_active_indicator--active, #3474C1);
+$vkontakte-color-icon-outline-medium: var(--vkui--vkontakte_color_icon_outline_medium, #818c99);
+$vkontakte-color-icon-outline-medium--hover: var(--vkui--vkontakte_color_icon_outline_medium--hover, #7C8795);
+$vkontakte-color-icon-outline-medium--active: var(--vkui--vkontakte_color_icon_outline_medium--active, #778292);
+$vkontakte-color-icon-outline-secondary: var(--vkui--vkontakte_color_icon_outline_secondary, #99a2ad);
+$vkontakte-color-icon-outline-secondary--hover: var(--vkui--vkontakte_color_icon_outline_secondary--hover, #939CA9);
+$vkontakte-color-icon-outline-secondary--active: var(--vkui--vkontakte_color_icon_outline_secondary--active, #8D96A4);
+$vkontakte-color-skeleton-shimmer-from: var(--vkui--vkontakte_color_skeleton_shimmer_from, #FFFFFF);
+$vkontakte-color-skeleton-shimmer-from--hover: var(--vkui--vkontakte_color_skeleton_shimmer_from--hover, #F5F5F7);
+$vkontakte-color-skeleton-shimmer-from--active: var(--vkui--vkontakte_color_skeleton_shimmer_from--active, #EBECEF);
+$vkontakte-color-alpha-skeleton-shimmer-to: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to, transparent);
+$vkontakte-color-alpha-skeleton-shimmer-to--hover: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to--hover, rgba(0, 16, 61, 0.04));
+$vkontakte-color-alpha-skeleton-shimmer-to--active: var(--vkui--vkontakte_color_alpha_skeleton_shimmer_to--active, rgba(0, 16, 61, 0.08));
+$vkontakte-color-loader-background: var(--vkui--vkontakte_color_loader_background, #edeef0);
+$vkontakte-color-loader-background--hover: var(--vkui--vkontakte_color_loader_background--hover, #E4E5E9);
+$vkontakte-color-loader-background--active: var(--vkui--vkontakte_color_loader_background--active, #DADCE2);
+$vkontakte-color-loader-tint: var(--vkui--vkontakte_color_loader_tint, #828282);
+$vkontakte-color-loader-tint--hover: var(--vkui--vkontakte_color_loader_tint--hover, #7D7D7F);
+$vkontakte-color-loader-tint--active: var(--vkui--vkontakte_color_loader_tint--active, #78797C);
+$vkontakte-color-music-playback-icon: var(--vkui--vkontakte_color_music_playback_icon, #000000);
+$vkontakte-color-music-playback-icon--hover: var(--vkui--vkontakte_color_music_playback_icon--hover, #000102);
+$vkontakte-color-music-playback-icon--active: var(--vkui--vkontakte_color_music_playback_icon--active, #000105);
+$vkontakte-color-status-background: var(--vkui--vkontakte_color_status_background, #edeef0);
+$vkontakte-color-status-background--hover: var(--vkui--vkontakte_color_status_background--hover, #E4E5E9);
+$vkontakte-color-status-background--active: var(--vkui--vkontakte_color_status_background--active, #DADCE2);
+$vkontakte-color-placeholder-icon-foreground-primary: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary, #99a2ad);
+$vkontakte-color-placeholder-icon-foreground-primary--hover: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary--hover, #939CA9);
+$vkontakte-color-placeholder-icon-foreground-primary--active: var(--vkui--vkontakte_color_placeholder_icon_foreground_primary--active, #8D96A4);
+$vkontakte-color-placeholder-icon-foreground-secondary: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary, #aeb7c2);
+$vkontakte-color-placeholder-icon-foreground-secondary--hover: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary--hover, #A7B0BD);
+$vkontakte-color-placeholder-icon-foreground-secondary--active: var(--vkui--vkontakte_color_placeholder_icon_foreground_secondary--active, #A0AAB7);
+$vkontakte-color-placeholder-icon-tint: var(--vkui--vkontakte_color_placeholder_icon_tint, #1d3a5c);
+$vkontakte-color-placeholder-icon-tint--hover: var(--vkui--vkontakte_color_placeholder_icon_tint--hover, #1C385B);
+$vkontakte-color-placeholder-icon-tint--active: var(--vkui--vkontakte_color_placeholder_icon_tint--active, #1B375A);
+$vkontakte-color-poll-option-background: var(--vkui--vkontakte_color_poll_option_background, #447bba);
+$vkontakte-color-poll-option-background--hover: var(--vkui--vkontakte_color_poll_option_background--hover, #4177B5);
+$vkontakte-color-poll-option-background--active: var(--vkui--vkontakte_color_poll_option_background--active, #3F72B0);
+$vkontakte-color-tabbar-active-icon: var(--vkui--vkontakte_color_tabbar_active_icon, #447bba);
+$vkontakte-color-tabbar-active-icon--hover: var(--vkui--vkontakte_color_tabbar_active_icon--hover, #4177B5);
+$vkontakte-color-tabbar-active-icon--active: var(--vkui--vkontakte_color_tabbar_active_icon--active, #3F72B0);
+$vkontakte-color-tabbar-background: var(--vkui--vkontakte_color_tabbar_background, #f7f8fa);
+$vkontakte-color-tabbar-background--hover: var(--vkui--vkontakte_color_tabbar_background--hover, #EDEFF2);
+$vkontakte-color-tabbar-background--active: var(--vkui--vkontakte_color_tabbar_background--active, #E3E5EB);
+$vkontakte-color-tabbar-inactive-icon: var(--vkui--vkontakte_color_tabbar_inactive_icon, #99a2ad);
+$vkontakte-color-tabbar-inactive-icon--hover: var(--vkui--vkontakte_color_tabbar_inactive_icon--hover, #939CA9);
+$vkontakte-color-tabbar-inactive-icon--active: var(--vkui--vkontakte_color_tabbar_inactive_icon--active, #8D96A4);
+$vkontakte-color-tabbar-tablet-text-secondary: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary, #818c99);
+$vkontakte-color-tabbar-tablet-text-secondary--hover: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary--hover, #7C8795);
+$vkontakte-color-tabbar-tablet-text-secondary--active: var(--vkui--vkontakte_color_tabbar_tablet_text_secondary--active, #778292);
+$vkontakte-color-toolbar-attach-background-from: var(--vkui--vkontakte_color_toolbar_attach_background_from, #dce1e6);
+$vkontakte-color-toolbar-attach-background-from--hover: var(--vkui--vkontakte_color_toolbar_attach_background_from--hover, #D3D9DF);
+$vkontakte-color-toolbar-attach-background-from--active: var(--vkui--vkontakte_color_toolbar_attach_background_from--active, #CAD0D8);
+$vkontakte-color-splash-screen-icon: var(--vkui--vkontakte_color_splash_screen_icon, #dce1e6);
+$vkontakte-color-splash-screen-icon--hover: var(--vkui--vkontakte_color_splash_screen_icon--hover, #D3D9DF);
+$vkontakte-color-splash-screen-icon--active: var(--vkui--vkontakte_color_splash_screen_icon--active, #CAD0D8);
+$vkontakte-color-icon-name: var(--vkui--vkontakte_color_icon_name, #8fadc8);
+$vkontakte-color-icon-name--hover: var(--vkui--vkontakte_color_icon_name--hover, #89A7C2);
+$vkontakte-color-icon-name--active: var(--vkui--vkontakte_color_icon_name--active, #84A0BD);
+$vkontakte-color-panel-tab-active-text: var(--vkui--vkontakte_color_panel_tab_active_text, #4e5966);
+$vkontakte-color-panel-tab-active-text--hover: var(--vkui--vkontakte_color_panel_tab_active_text--hover, #4B5664);
+$vkontakte-color-panel-tab-active-text--active: var(--vkui--vkontakte_color_panel_tab_active_text--active, #485363);
+$vkontakte-color-background-text-alpha: var(--vkui--vkontakte_color_background_text_alpha, rgba(81, 129, 184, 0.2));
+$vkontakte-color-background-text-alpha--hover: var(--vkui--vkontakte_color_background_text_alpha--hover, rgba(81, 129, 184, 0.24));
+$vkontakte-color-background-text-alpha--active: var(--vkui--vkontakte_color_background_text_alpha--active, rgba(81, 129, 184, 0.28));
+$vkontakte-color-modal-card-header-close: var(--vkui--vkontakte_color_modal_card_header_close, #000000);
+$vkontakte-color-modal-card-header-close--hover: var(--vkui--vkontakte_color_modal_card_header_close--hover, #000102);
+$vkontakte-color-modal-card-header-close--active: var(--vkui--vkontakte_color_modal_card_header_close--active, #000105);
+$vkontakte-im-bubble-button-outgoing-background-alpha: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha, rgba(255, 255, 255, 0.72));
+$vkontakte-im-bubble-button-outgoing-background-alpha--hover: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha--hover, rgba(255, 255, 255, 0.76));
+$vkontakte-im-bubble-button-outgoing-background-alpha--active: var(--vkui--vkontakte_im_bubble_button_outgoing_background_alpha--active, rgba(255, 255, 255, 0.8));
+$vkontakte-im-bubble-button-foreground: var(--vkui--vkontakte_im_bubble_button_foreground, #000000);
+$vkontakte-im-bubble-button-foreground--hover: var(--vkui--vkontakte_im_bubble_button_foreground--hover, #000102);
+$vkontakte-im-bubble-button-foreground--active: var(--vkui--vkontakte_im_bubble_button_foreground--active, #000105);
+$vkontakte-im-bubble-incoming-highlighted: var(--vkui--vkontakte_im_bubble_incoming_highlighted, #d3d9de);
+$vkontakte-im-bubble-incoming-highlighted--hover: var(--vkui--vkontakte_im_bubble_incoming_highlighted--hover, #CBD1D8);
+$vkontakte-im-bubble-incoming-highlighted--active: var(--vkui--vkontakte_im_bubble_incoming_highlighted--active, #C2C9D1);
+$vkontakte-im-bubble-gift-background: var(--vkui--vkontakte_im_bubble_gift_background, #f4e7c3);
+$vkontakte-im-bubble-gift-background--hover: var(--vkui--vkontakte_im_bubble_gift_background--hover, #EADEBE);
+$vkontakte-im-bubble-gift-background--active: var(--vkui--vkontakte_im_bubble_gift_background--active, #E0D6B8);
+$vkontakte-im-bubble-gift-background-highlighted: var(--vkui--vkontakte_im_bubble_gift_background_highlighted, #e3d3ac);
+$vkontakte-im-bubble-gift-background-highlighted--hover: var(--vkui--vkontakte_im_bubble_gift_background_highlighted--hover, #DACBA8);
+$vkontakte-im-bubble-gift-background-highlighted--active: var(--vkui--vkontakte_im_bubble_gift_background_highlighted--active, #D1C3A3);
+$vkontakte-im-bubble-outgoing-alternate: var(--vkui--vkontakte_im_bubble_outgoing_alternate, #FFFFFF);
+$vkontakte-im-bubble-outgoing-alternate--hover: var(--vkui--vkontakte_im_bubble_outgoing_alternate--hover, #F5F5F7);
+$vkontakte-im-bubble-outgoing-alternate--active: var(--vkui--vkontakte_im_bubble_outgoing_alternate--active, #EBECEF);
+$vkontakte-im-attach-tint: var(--vkui--vkontakte_im_attach_tint, #447bba);
+$vkontakte-im-attach-tint--hover: var(--vkui--vkontakte_im_attach_tint--hover, #4177B5);
+$vkontakte-im-attach-tint--active: var(--vkui--vkontakte_im_attach_tint--active, #3F72B0);
+$vkontakte-im-reply-separator: var(--vkui--vkontakte_im_reply_separator, #2a5885);
+$vkontakte-im-reply-separator--hover: var(--vkui--vkontakte_im_reply_separator--hover, #285582);
+$vkontakte-im-reply-separator--active: var(--vkui--vkontakte_im_reply_separator--active, #27527F);
+$vkontakte-im-toolbar-voice-msg-background: var(--vkui--vkontakte_im_toolbar_voice_msg_background, #99a2ad);
+$vkontakte-im-toolbar-voice-msg-background--hover: var(--vkui--vkontakte_im_toolbar_voice_msg_background--hover, #939CA9);
+$vkontakte-im-toolbar-voice-msg-background--active: var(--vkui--vkontakte_im_toolbar_voice_msg_background--active, #8D96A4);
 $vkontakte-color-im-forward-line-alpha: var(--vkui--vkontakte_color_im_forward_line_alpha, rgba(0, 20, 51, 0.12));
 $vkontakte-color-im-forward-line-alpha--hover: var(--vkui--vkontakte_color_im_forward_line_alpha--hover, rgba(0, 20, 51, 0.16));
 $vkontakte-color-im-forward-line-alpha--active: var(--vkui--vkontakte_color_im_forward_line_alpha--active, rgba(0, 20, 51, 0.2));