@import url(https://fonts.googleapis.com/css2?family=PT+Serif:wght@400;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;1,600&family=Roboto:ital,wght@0,600;1,600&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,400;0,18..144,700;1,18..144,400;1,18..144,700&display=swap);
/* @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap"); */

[class^="ic_"],
[class*=" ic_"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "appicon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


.ic_book:before {
  content: "\ebb7";
}

.ic_equalizer:before {
  content: "\ebb8";
}

.ic_design_services:before {
  content: "\ebb9";
}

.ic_file_export:before {
  content: "\ebba";
}

.ic_box_plot:before {
  content: "\ebae";
}

.ic_bump_chart:before {
  content: "\ebaf";
}

.ic_compare_chart:before {
  content: "\ebb0";
}

.ic_cover_page:before {
  content: "\ebb1";
}

.ic_gantt_chart:before {
  content: "\ebb2";
}

.ic_radar_chart:before {
  content: "\ebb3";
}

.ic_radial_chart:before {
  content: "\ebb4";
}

.ic_section_break:before {
  content: "\ebb5";
}

.ic_waterfall_chart:before {
  content: "\ebb6";
}

.ic_deep_think:before {
  content: "\ebab";
}

.ic_web_search_02:before {
  content: "\ebac";
}

.ic_web_search:before {
  content: "\ebad";
}

.ic_abstract_01:before {
  content: "\e900";
}

.ic_abstract_02:before {
  content: "\e901";
}

.ic_abstract_03:before {
  content: "\e902";
}

.ic_abstract_04:before {
  content: "\e903";
}

.ic_abstract_05:before {
  content: "\e904";
}

.ic_abstract_06:before {
  content: "\e905";
}

.ic_abstract_07:before {
  content: "\e906";
}

.ic_abstract_08:before {
  content: "\e907";
}

.ic_activity:before {
  content: "\e908";
}

.ic_add_circle_outline:before {
  content: "\e909";
}

.ic_add_comment:before {
  content: "\e90a";
}

.ic_add_folders_fill:before {
  content: "\e90b";
}

.ic_add_on:before {
  content: "\e90c";
}

.ic_add_outline:before {
  content: "\e90d";
}

.ic_add_reaction:before {
  content: "\e90e";
}

.ic_add_rect_dotted:before {
  content: "\e90f";
}

.ic_add_rect_outline:before {
  content: "\e910";
}

.ic_add_shape_active:before {
  content: "\e911";
}

.ic_add_shape:before {
  content: "\e912";
}

.ic_add_small:before {
  content: "\e913";
}

.ic_add_subtitle:before {
  content: "\e914";
}

.ic_add_text:before {
  content: "\e915";
}

.ic_add:before {
  content: "\e916";
}

.ic_advice:before {
  content: "\e917";
}

.ic_ai_change_tone:before {
  content: "\e918";
}

.ic_ai_credit_coin_02:before {
  content: "\e919";
}

.ic_ai_credit_coin_03:before {
  content: "\e91a";
}

.ic_ai_credit_coin_04:before {
  content: "\e91b";
}

.ic_ai_credit_coin:before {
  content: "\e91c";
}

.ic_ai_credit:before {
  content: "\e91d";
}

.ic_ai_expand:before {
  content: "\e91e";
}

.ic_ai_ideas_from_topic_active:before {
  content: "\e91f";
}

.ic_ai_ideas_from_topic:before {
  content: "\e920";
}

.ic_ai_reduce:before {
  content: "\e921";
}

.ic_ai_rephrase:before {
  content: "\e922";
}

.ic_ai_summarize:before {
  content: "\e923";
}

.ic_animation_order_active:before {
  content: "\e924";
}

.ic_animation_order:before {
  content: "\e925";
}

.ic_animation_outline:before {
  content: "\e926";
}

.ic_annotation_linehair:before {
  content: "\e927";
}

.ic_annotation_linewave:before {
  content: "\e928";
}

.ic_annotations_02_active:before {
  content: "\e929";
}

.ic_annotations_02:before {
  content: "\e92a";
}

.ic_annotations:before {
  content: "\e92b";
}

.ic_answer:before {
  content: "\e92c";
}

.ic_area_chart:before {
  content: "\e92d";
}

.ic_arrow_backward:before {
  content: "\e92e";
}

.ic_arrow_circle_down:before {
  content: "\e92f";
}

.ic_arrow_circle_up:before {
  content: "\e930";
}

.ic_arrow_divide:before {
  content: "\e931";
}

.ic_arrow_double_head:before {
  content: "\e932";
}

.ic_arrow_double_headed_half_active:before {
  content: "\e933";
}

.ic_arrow_double_headed_half:before {
  content: "\e934";
}

.ic_arrow_equal:before {
  content: "\e935";
}

.ic_arrow_forward:before {
  content: "\e936";
}

.ic_arrow_multiply:before {
  content: "\e937";
}

.ic_arrow_no_head:before {
  content: "\e938";
}

.ic_arrow_not_equal:before {
  content: "\e939";
}

.ic_arrow_plus:before {
  content: "\e93a";
}

.ic_arrow_subract:before {
  content: "\e93b";
}

.ic_arrows_chart_active:before {
  content: "\e93c";
}

.ic_arrows_chart:before {
  content: "\e93d";
}

.ic_attachment:before {
  content: "\e93e";
}

.ic_background_active:before {
  content: "\e93f";
}

.ic_background:before {
  content: "\e940";
}

.ic_badge:before {
  content: "\e941";
}

.ic_bar_100_stacked_chart:before {
  content: "\e942";
}

.ic_bar_chart:before {
  content: "\e943";
}

.ic_bar_single_chart:before {
  content: "\e944";
}

.ic_bar_stacked_chart:before {
  content: "\e945";
}

.ic_bar_stats:before {
  content: "\e946";
}

.ic_bookend:before {
  content: "\e947";
}

.ic_brain:before {
  content: "\e948";
}

.ic_brand_active:before {
  content: "\e949";
}

.ic_brand_voice_active:before {
  content: "\e94a";
}

.ic_brand_voice:before {
  content: "\e94b";
}

.ic_brand:before {
  content: "\e94c";
}

.ic_bring_forward:before {
  content: "\e94d";
}

.ic_bring_to_front:before {
  content: "\e94e";
}

.ic_bullet_list_02:before {
  content: "\e94f";
}

.ic_bullet_list:before {
  content: "\e950";
}

.ic_business_slides_active:before {
  content: "\e951";
}

.ic_business_slides:before {
  content: "\e952";
}

.ic_caption:before {
  content: "\e953";
}

.ic_card_active:before {
  content: "\e954";
}

.ic_card:before {
  content: "\e955";
}

.ic_cart:before {
  content: "\e956";
}

.ic_change_type:before {
  content: "\e957";
}

.ic_chart_active:before {
  content: "\e958";
}

.ic_chart:before {
  content: "\e959";
}

.ic_checklist_active:before {
  content: "\e95a";
}

.ic_checklist:before {
  content: "\e95b";
}

.ic_circle_stats:before {
  content: "\e95c";
}

.ic_clip_e_02:before {
  content: "\e95d";
}

.ic_clip_e_03:before {
  content: "\e95e";
}

.ic_clip_e:before {
  content: "\e95f";
}

.ic_clock:before {
  content: "\e960";
}

.ic_close_circle_outline:before {
  content: "\e961";
}

.ic_close_keyboard:before {
  content: "\e962";
}

.ic_close_small:before {
  content: "\e963";
}

.ic_close:before {
  content: "\e964";
}

.ic_cloud_nointernet:before {
  content: "\e965";
}

.ic_cloud_saved:before {
  content: "\e966";
}

.ic_cloud_unsaved:before {
  content: "\e967";
}

.ic_cloud:before {
  content: "\e968";
}

.ic_code_active:before {
  content: "\e969";
}

.ic_code:before {
  content: "\e96a";
}

.ic_collapse:before {
  content: "\e96b";
}

.ic_color_circle:before {
  content: "\e96c";
}

.ic_color_style_active:before {
  content: "\e96d";
}

.ic_color_style:before {
  content: "\e96e";
}

.ic_column_100_stacked_chart:before {
  content: "\e96f";
}

.ic_column_chart_outline_active:before {
  content: "\e970";
}

.ic_column_chart_outline:before {
  content: "\e971";
}

.ic_column_chart:before {
  content: "\e972";
}

.ic_column_single_chart:before {
  content: "\e973";
}

.ic_column_stacked_chart:before {
  content: "\e974";
}

.ic_columns_four:before {
  content: "\e975";
}

.ic_columns_left:before {
  content: "\e976";
}

.ic_columns_one:before {
  content: "\e977";
}

.ic_columns_right:before {
  content: "\e978";
}

.ic_columns_three:before {
  content: "\e979";
}

.ic_columns_two:before {
  content: "\e97a";
}

.ic_comment_sidebar:before {
  content: "\e97b";
}

.ic_comment:before {
  content: "\e97c";
}

.ic_company_details_active:before {
  content: "\e97d";
}

.ic_company_details:before {
  content: "\e97e";
}

.ic_company_theme_02:before {
  content: "\e97f";
}

.ic_company_theme:before {
  content: "\e980";
}

.ic_comparison_chart:before {
  content: "\e981";
}

.ic_confetti:before {
  content: "\e982";
}

.ic_connector_arrow_left:before {
  content: "\e983";
}

.ic_connector_arrow_right:before {
  content: "\e984";
}

.ic_connector_arrow_two_head:before {
  content: "\e985";
}

.ic_connector_arrow_two_side:before {
  content: "\e986";
}

.ic_connector_divide:before {
  content: "\e987";
}

.ic_connector_equal:before {
  content: "\e988";
}

.ic_connector_inequal:before {
  content: "\e989";
}

.ic_connector_minus:before {
  content: "\e98a";
}

.ic_connector_multiple:before {
  content: "\e98b";
}

.ic_connector_plus:before {
  content: "\e98c";
}

.ic_contact_info:before {
  content: "\e98d";
}

.ic_contrast:before {
  content: "\e98e";
}

.ic_copied:before {
  content: "\e98f";
}

.ic_copy:before {
  content: "\e990";
}

.ic_credit_extralarge:before {
  content: "\e991";
}

.ic_credit_large:before {
  content: "\e992";
}

.ic_credit_medium:before {
  content: "\e993";
}

.ic_credit_small:before {
  content: "\e994";
}

.ic_crop:before {
  content: "\e995";
}

.ic_crown:before {
  content: "\e996";
}

.ic_cta_button:before {
  content: "\e997";
}

.ic_cycle_loop:before {
  content: "\e998";
}

.ic_dark_theme_outline_active:before {
  content: "\e999";
}

.ic_dark_theme_outline:before {
  content: "\e99a";
}

.ic_dashboard_01_active:before {
  content: "\e99b";
}

.ic_dashboard_01:before {
  content: "\e99c";
}

.ic_dashboard_02_active:before {
  content: "\e99d";
}

.ic_dashboard_02:before {
  content: "\e99e";
}

.ic_data_type_number:before {
  content: "\e99f";
}

.ic_date_active:before {
  content: "\e9a0";
}

.ic_date:before {
  content: "\e9a1";
}

.ic_decoration_line_01:before {
  content: "\e9a2";
}

.ic_decoration_line_02:before {
  content: "\e9a3";
}

.ic_delete_outline:before {
  content: "\e9a4";
}

.ic_delete_small:before {
  content: "\e9a5";
}

.ic_devices:before {
  content: "\e9a6";
}

.ic_dice:before {
  content: "\e9a7";
}

.ic_doctoral_phd:before {
  content: "\e9a8";
}

.ic_doughnut:before {
  content: "\e9a9";
}

.ic_down_arrow:before {
  content: "\e9aa";
}

.ic_down_pointer_circle_outline:before {
  content: "\e9ab";
}

.ic_down_pointer_floater_small:before {
  content: "\e9ac";
}

.ic_down_pointer_floater:before {
  content: "\e9ad";
}

.ic_down_pointer_two_head:before {
  content: "\e9ae";
}

.ic_down_pointer:before {
  content: "\e9af";
}

.ic_download:before {
  content: "\e9b0";
}

.ic_drag_handle_horizontal:before {
  content: "\e9b1";
}

.ic_drag_handle:before {
  content: "\e9b2";
}

.ic_drag_outline_horizontal:before {
  content: "\e9b3";
}

.ic_drag_outline:before {
  content: "\e9b4";
}

.ic_drive:before {
  content: "\e9b5";
}

.ic_Dummy:before {
  content: "\e9b6";
}

.ic_duplicate_outline:before {
  content: "\e9b7";
}

.ic_edit_active:before {
  content: "\e9b8";
}

.ic_edit_pencil_active:before {
  content: "\e9b9";
}

.ic_edit_pencil:before {
  content: "\e9ba";
}

.ic_edit:before {
  content: "\e9bb";
}

.ic_email:before {
  content: "\e9bc";
}

.ic_emphasis:before {
  content: "\e9bd";
}

.ic_enter_fullscreen:before {
  content: "\e9be";
}

.ic_enterprise:before {
  content: "\e9bf";
}

.ic_error:before {
  content: "\e9c0";
}

.ic_exit:before {
  content: "\e9c1";
}

.ic_expand:before {
  content: "\e9c2";
}

.ic_explore:before {
  content: "\e9c3";
}

.ic_export_pdf:before {
  content: "\e9c4";
}

.ic_export:before {
  content: "\e9c5";
}

.ic_facebook:before {
  content: "\e9c6";
}

.ic_fav_star_selected:before {
  content: "\e9c7";
}

.ic_fav_star:before {
  content: "\e9c8";
}

.ic_favourite_fill:before {
  content: "\e9c9";
}

.ic_favourite_outline:before {
  content: "\e9ca";
}

.ic_feedback_active:before {
  content: "\e9cb";
}

.ic_feedback:before {
  content: "\e9cc";
}

.ic_file_type:before {
  content: "\e9cd";
}

.ic_file:before {
  content: "\e9ce";
}

.ic_filter_02:before {
  content: "\e9cf";
}

.ic_filter:before {
  content: "\e9d0";
}

.ic_fire:before {
  content: "\e9d1";
}

.ic_fit_to_screen:before {
  content: "\e9d2";
}

.ic_flag_02:before {
  content: "\e9d3";
}

.ic_flag:before {
  content: "\e9d4";
}

.ic_floppy_disk:before {
  content: "\e9d5";
}

.ic_flowchart:before {
  content: "\e9d6";
}

.ic_folder_doc_list:before {
  content: "\e9d7";
}

.ic_folder_open_active:before {
  content: "\e9d8";
}

.ic_folder_open:before {
  content: "\e9d9";
}

.ic_folder_outline_active:before {
  content: "\e9da";
}

.ic_folder_outline:before {
  content: "\e9db";
}

.ic_folder_share_single:before {
  content: "\e9dc";
}

.ic_folder_share:before {
  content: "\e9dd";
}

.ic_footer_active:before {
  content: "\e9de";
}

.ic_footer:before {
  content: "\e9df";
}

.ic_framework:before {
  content: "\e9e0";
}

.ic_frequency:before {
  content: "\e9e1";
}

.ic_funnel:before {
  content: "\e9e2";
}

.ic_gift_active:before {
  content: "\e9e3";
}

.ic_gift:before {
  content: "\e9e4";
}

.ic_globe_active:before {
  content: "\e9e5";
}

.ic_globe:before {
  content: "\e9e6";
}

.ic_go_live:before {
  content: "\e9e7";
}

.ic_graduate_studies:before {
  content: "\e9e8";
}

.ic_graphic_settings_outline:before {
  content: "\e9e9";
}

.ic_graphic_styles_outline_active:before {
  content: "\e9ea";
}

.ic_graphic_styles_outline:before {
  content: "\e9eb";
}

.ic_greyscale:before {
  content: "\e9ec";
}

.ic_grid_view_outline_active:before {
  content: "\e9ed";
}

.ic_grid_view_outline:before {
  content: "\e9ee";
}

.ic_grid:before {
  content: "\e9ef";
}

.ic_group:before {
  content: "\e9f0";
}

.ic_hd:before {
  content: "\e9f1";
}

.ic_heading_2:before {
  content: "\e9f2";
}

.ic_heading_3:before {
  content: "\e9f3";
}

.ic_heading_outline:before {
  content: "\e9f4";
}

.ic_help_fill:before {
  content: "\e9f5";
}

.ic_hide:before {
  content: "\e9f6";
}

.ic_highlight_caption:before {
  content: "\e9f7";
}

.ic_highlight_circle_outline:before {
  content: "\e9f8";
}

.ic_highlight_with_text_01:before {
  content: "\e9f9";
}

.ic_highlight_with_text_02:before {
  content: "\e9fa";
}

.ic_hire_our_team_active:before {
  content: "\e9fb";
}

.ic_hire_our_team:before {
  content: "\e9fc";
}

.ic_home_active:before {
  content: "\e9fd";
}

.ic_home:before {
  content: "\e9fe";
}

.ic_icon_graphics_active:before {
  content: "\e9ff";
}

.ic_icon_graphics:before {
  content: "\ea00";
}

.ic_icon_list:before {
  content: "\ea01";
}

.ic_idea_to_deck:before {
  content: "\ea02";
}

.ic_illustration:before {
  content: "\ea03";
}

.ic_image_ai:before {
  content: "\ea04";
}

.ic_image_filter_active:before {
  content: "\ea05";
}

.ic_image_filter_fill:before {
  content: "\ea06";
}

.ic_image_filter:before {
  content: "\ea07";
}

.ic_image_flip_horizontal:before {
  content: "\ea08";
}

.ic_image_flip_vertical:before {
  content: "\ea09";
}

.ic_image_grid_active:before {
  content: "\ea0a";
}

.ic_image_grid:before {
  content: "\ea0b";
}

.ic_image_layout_left:before {
  content: "\ea0c";
}

.ic_image_layout_right:before {
  content: "\ea0d";
}

.ic_image_layout_top:before {
  content: "\ea0e";
}

.ic_image_list:before {
  content: "\ea0f";
}

.ic_image_rect_outline_active:before {
  content: "\ea10";
}

.ic_image_rect_outline:before {
  content: "\ea11";
}

.ic_image_resize:before {
  content: "\ea12";
}

.ic_image_rotate:before {
  content: "\ea13";
}

.ic_image_search_small:before {
  content: "\ea14";
}

.ic_image_small:before {
  content: "\ea15";
}

.ic_image_stack:before {
  content: "\ea16";
}

.ic_impact_slide:before {
  content: "\ea17";
}

.ic_import_file:before {
  content: "\ea18";
}

.ic_import:before {
  content: "\ea19";
}

.ic_indent:before {
  content: "\ea1a";
}

.ic_individuals_active:before {
  content: "\ea1b";
}

.ic_individuals:before {
  content: "\ea1c";
}

.ic_info_active:before {
  content: "\ea1d";
}

.ic_info_alt:before {
  content: "\ea1e";
}

.ic_info_small_full_active:before {
  content: "\ea1f";
}

.ic_info_small:before {
  content: "\ea20";
}

.ic_info:before {
  content: "\ea21";
}

.ic_instagram:before {
  content: "\ea22";
}

.ic_intro_video_active:before {
  content: "\ea23";
}

.ic_intro_video:before {
  content: "\ea24";
}

.ic_jet:before {
  content: "\ea25";
}

.ic_keyboard_command:before {
  content: "\ea26";
}

.ic_keyboard:before {
  content: "\ea27";
}

.ic_language:before {
  content: "\ea28";
}

.ic_layout_active:before {
  content: "\ea29";
}

.ic_layout_center:before {
  content: "\ea2a";
}

.ic_layout_full:before {
  content: "\ea2b";
}

.ic_layout_left:before {
  content: "\ea2c";
}

.ic_layout_right:before {
  content: "\ea2d";
}

.ic_layout:before {
  content: "\ea2e";
}

.ic_leadership:before {
  content: "\ea2f";
}

.ic_left_arrow:before {
  content: "\ea30";
}

.ic_left_pointer_circle_outline:before {
  content: "\ea31";
}

.ic_left_pointer:before {
  content: "\ea32";
}

.ic_legal:before {
  content: "\ea33";
}

.ic_length_large:before {
  content: "\ea34";
}

.ic_length_medium:before {
  content: "\ea35";
}

.ic_length_small:before {
  content: "\ea36";
}

.ic_lifebuoy:before {
  content: "\ea37";
}

.ic_light_theme_active:before {
  content: "\ea38";
}

.ic_light_theme:before {
  content: "\ea39";
}

.ic_lighting_active:before {
  content: "\ea3a";
}

.ic_lighting:before {
  content: "\ea3b";
}

.ic_like_active:before {
  content: "\ea3c";
}

.ic_like:before {
  content: "\ea3d";
}

.ic_line_chart:before {
  content: "\ea3e";
}

.ic_line_dash:before {
  content: "\ea3f";
}

.ic_line_dotted:before {
  content: "\ea40";
}

.ic_line_height:before {
  content: "\ea41";
}

.ic_line_solid:before {
  content: "\ea42";
}

.ic_line_weight_thick:before {
  content: "\ea43";
}

.ic_link:before {
  content: "\ea44";
}

.ic_linked_in:before {
  content: "\ea45";
}

.ic_list_view_active:before {
  content: "\ea46";
}

.ic_list_view:before {
  content: "\ea47";
}

.ic_location:before {
  content: "\ea48";
}

.ic_lock_active:before {
  content: "\ea49";
}

.ic_lock:before {
  content: "\ea4a";
}

.ic_logo_active:before {
  content: "\ea4b";
}

.ic_logo_grid:before {
  content: "\ea4c";
}

.ic_logo:before {
  content: "\ea4d";
}

.ic_loop:before {
  content: "\ea4e";
}

.ic_lowercase:before {
  content: "\ea4f";
}

.ic_map_zoom_minus:before {
  content: "\ea50";
}

.ic_map_zoom_plus:before {
  content: "\ea51";
}

.ic_markdown:before {
  content: "\ea52";
}

.ic_medical:before {
  content: "\ea53";
}

.ic_meeting_active:before {
  content: "\ea54";
}

.ic_meeting:before {
  content: "\ea55";
}

.ic_mention:before {
  content: "\ea56";
}

.ic_menu:before {
  content: "\ea57";
}

.ic_merge_cells:before {
  content: "\ea58";
}

.ic_microchart:before {
  content: "\ea59";
}

.ic_microphone_active:before {
  content: "\ea5a";
}

.ic_microphone_disabled:before {
  content: "\ea5b";
}

.ic_microphone:before {
  content: "\ea5c";
}

.ic_mind_map_circle:before {
  content: "\ea5d";
}

.ic_mind_map_diamond:before {
  content: "\ea5e";
}

.ic_mind_map_oval:before {
  content: "\ea5f";
}

.ic_mind_map_pill:before {
  content: "\ea60";
}

.ic_mind_map_rectangle:before {
  content: "\ea61";
}

.ic_mind_map_right_parallelogram:before {
  content: "\ea62";
}

.ic_mind_map_rounded:before {
  content: "\ea63";
}

.ic_mind_map_triangel_downwards:before {
  content: "\ea64";
}

.ic_mind_map_triangle:before {
  content: "\ea65";
}

.ic_minus_circle_oultine:before {
  content: "\ea66";
}

.ic_minus_small:before {
  content: "\ea67";
}

.ic_money_saveing_active:before {
  content: "\ea68";
}

.ic_money_saveing:before {
  content: "\ea69";
}

.ic_money:before {
  content: "\ea6a";
}

.ic_moods_style:before {
  content: "\ea6b";
}

.ic_more_arrow_outline:before {
  content: "\ea6c";
}

.ic_more_option_small:before {
  content: "\ea6d";
}

.ic_more_option_vertical:before {
  content: "\ea6e";
}

.ic_more_option:before {
  content: "\ea6f";
}

.ic_move_map:before {
  content: "\ea70";
}

.ic_mt_presentation_active:before {
  content: "\ea71";
}

.ic_mt_presentation:before {
  content: "\ea72";
}

.ic_multislide:before {
  content: "\ea73";
}

.ic_new_page:before {
  content: "\ea74";
}

.ic_newslide_background_illustration_active:before {
  content: "\ea75";
}

.ic_newslide_background_illustration:before {
  content: "\ea76";
}

.ic_newslide_bookend:before {
  content: "\ea77";
}

.ic_newslide_datachart:before {
  content: "\ea78";
}

.ic_newslide_default:before {
  content: "\ea79";
}

.ic_newslide_distribution:before {
  content: "\ea7a";
}

.ic_newslide_essentialslides:before {
  content: "\ea7b";
}

.ic_newslide_flow:before {
  content: "\ea7c";
}

.ic_newslide_frameworks:before {
  content: "\ea7d";
}

.ic_newslide_list:before {
  content: "\ea7e";
}

.ic_newslide_product_screenshot:before {
  content: "\ea7f";
}

.ic_newslide_relationship:before {
  content: "\ea80";
}

.ic_newslide_segment:before {
  content: "\ea81";
}

.ic_newslide_stack:before {
  content: "\ea82";
}

.ic_notification_assign_slide:before {
  content: "\ea83";
}

.ic_notification_comment:before {
  content: "\ea84";
}

.ic_notification_info:before {
  content: "\ea85";
}

.ic_notification_invite_doc:before {
  content: "\ea86";
}

.ic_notification_invite_workspace:before {
  content: "\ea87";
}

.ic_notification_mention:before {
  content: "\ea88";
}

.ic_notification_reply:before {
  content: "\ea89";
}

.ic_notification_resolved:before {
  content: "\ea8a";
}

.ic_notification:before {
  content: "\ea8b";
}

.ic_numbered_list:before {
  content: "\ea8c";
}

.ic_obj_align_bottom:before {
  content: "\ea8d";
}

.ic_obj_align_center:before {
  content: "\ea8e";
}

.ic_obj_align_left:before {
  content: "\ea8f";
}

.ic_obj_align_middle:before {
  content: "\ea90";
}

.ic_obj_align_right:before {
  content: "\ea91";
}

.ic_obj_align_top:before {
  content: "\ea92";
}

.ic_obj_arrange_bring_to_back:before {
  content: "\ea93";
}

.ic_obj_arrange_bring_to_front:before {
  content: "\ea94";
}

.ic_obj_distribute_horizontal:before {
  content: "\ea95";
}

.ic_obj_distribute_vertical:before {
  content: "\ea96";
}

.ic_object_position:before {
  content: "\ea97";
}

.ic_offer_badge:before {
  content: "\ea98";
}

.ic_offer_tag:before {
  content: "\ea99";
}

.ic_open_link:before {
  content: "\ea9a";
}

.ic_orders_active:before {
  content: "\ea9b";
}

.ic_orders:before {
  content: "\ea9c";
}

.ic_orientation_20_left:before {
  content: "\ea9d";
}

.ic_orientation_20_right:before {
  content: "\ea9e";
}

.ic_orientation_50_left:before {
  content: "\ea9f";
}

.ic_orientation_50_right:before {
  content: "\eaa0";
}

.ic_orientation_80_left:before {
  content: "\eaa1";
}

.ic_orientation_80_right:before {
  content: "\eaa2";
}

.ic_orientation_100:before {
  content: "\eaa3";
}

.ic_origami_active:before {
  content: "\eaa4";
}

.ic_origami_icon:before {
  content: "\eaa5";
}

.ic_origami:before {
  content: "\eaa6";
}

.ic_original_size:before {
  content: "\eaa7";
}

.ic_outdent:before {
  content: "\eaa8";
}

.ic_outline_40:before {
  content: "\eaa9";
}

.ic_outline_60:before {
  content: "\eaaa";
}

.ic_outline_full:before {
  content: "\eaab";
}

.ic_outline_line_close:before {
  content: "\eaac";
}

.ic_outline_line_open:before {
  content: "\eaad";
}

.ic_outline_section_break:before {
  content: "\eaae";
}

.ic_outline_slide:before {
  content: "\eaaf";
}

.ic_outline:before {
  content: "\eab0";
}

.ic_owner_power:before {
  content: "\eab1";
}

.ic_pai_gallery:before {
  content: "\eab2";
}

.ic_paint_bucket:before {
  content: "\eab3";
}

.ic_paragraph:before {
  content: "\eab4";
}

.ic_paste:before {
  content: "\eab5";
}

.ic_pause:before {
  content: "\eab6";
}

.ic_pen_dot_01:before {
  content: "\eab7";
}

.ic_pen_dot_02:before {
  content: "\eab8";
}

.ic_pen_dot_03:before {
  content: "\eab9";
}

.ic_pen:before {
  content: "\eaba";
}

.ic_people_slides:before {
  content: "\eabb";
}

.ic_percent:before {
  content: "\eabc";
}

.ic_percentage:before {
  content: "\eabd";
}

.ic_persona:before {
  content: "\eabe";
}

.ic_pie:before {
  content: "\eabf";
}

.ic_pinterest:before {
  content: "\eac0";
}

.ic_play_circle_outline:before {
  content: "\eac1";
}

.ic_ppt:before {
  content: "\eac2";
}

.ic_premium_template:before {
  content: "\eac3";
}

.ic_presentation_fingerprint_active:before {
  content: "\eac4";
}

.ic_presentation_fingerprint:before {
  content: "\eac5";
}

.ic_presentation_settings:before {
  content: "\eac6";
}

.ic_presentation_template_active:before {
  content: "\eac7";
}

.ic_presentation_template:before {
  content: "\eac8";
}

.ic_primary_school:before {
  content: "\eac9";
}

.ic_private_doc_list:before {
  content: "\eaca";
}

.ic_pro_lightning:before {
  content: "\eacb";
}

.ic_pro_star:before {
  content: "\eacc";
}

.ic_process:before {
  content: "\eacd";
}

.ic_project_doc_list:before {
  content: "\eace";
}

.ic_public_sector:before {
  content: "\eacf";
}

.ic_pyramid:before {
  content: "\ead0";
}

.ic_question:before {
  content: "\ead1";
}

.ic_quote_active:before {
  content: "\ead2";
}

.ic_quote:before {
  content: "\ead3";
}

.ic_re_generate:before {
  content: "\ead4";
}

.ic_recent:before {
  content: "\ead5";
}

.ic_record_active:before {
  content: "\ead6";
}

.ic_record_dot:before {
  content: "\ead7";
}

.ic_record:before {
  content: "\ead8";
}

.ic_redo:before {
  content: "\ead9";
}

.ic_refresh:before {
  content: "\eada";
}

.ic_regenerate_slide:before {
  content: "\eadb";
}

.ic_remove_subtitle:before {
  content: "\eadc";
}

.ic_rename:before {
  content: "\eadd";
}

.ic_replay_presentation:before {
  content: "\eade";
}

.ic_report:before {
  content: "\eadf";
}

.ic_request_input_active:before {
  content: "\eae0";
}

.ic_request_input:before {
  content: "\eae1";
}

.ic_reset_edit:before {
  content: "\eae2";
}

.ic_reset:before {
  content: "\eae3";
}

.ic_resize_horizontal:before {
  content: "\eae4";
}

.ic_resize_vertical:before {
  content: "\eae5";
}

.ic_resize:before {
  content: "\eae6";
}

.ic_revision:before {
  content: "\eae7";
}

.ic_right_arrow:before {
  content: "\eae8";
}

.ic_right_pointer_circle_outline:before {
  content: "\eae9";
}

.ic_right_pointer_small:before {
  content: "\eaea";
}

.ic_right_pointer:before {
  content: "\eaeb";
}

.ic_rocket:before {
  content: "\eaec";
}

.ic_rotate:before {
  content: "\eaed";
}

.ic_save_document_as_template:before {
  content: "\eaee";
}

.ic_save_presentation_02:before {
  content: "\eaef";
}

.ic_save_presentation:before {
  content: "\eaf0";
}

.ic_save_slide_as_template:before {
  content: "\eaf1";
}

.ic_save_time_active:before {
  content: "\eaf2";
}

.ic_save_time:before {
  content: "\eaf3";
}

.ic_save_version:before {
  content: "\eaf4";
}

.ic_search_small:before {
  content: "\eaf5";
}

.ic_search:before {
  content: "\eaf6";
}

.ic_secondary_school_active:before {
  content: "\eaf7";
}

.ic_secondary_school:before {
  content: "\eaf8";
}

.ic_secure_content:before {
  content: "\eaf9";
}

.ic_secure:before {
  content: "\eafa";
}

.ic_semipie:before {
  content: "\eafb";
}

.ic_send_backward:before {
  content: "\eafc";
}

.ic_send_message_fill:before {
  content: "\eafd";
}

.ic_send_message:before {
  content: "\eafe";
}

.ic_send_to_back:before {
  content: "\eaff";
}

.ic_sequence:before {
  content: "\eb00";
}

.ic_settings_small:before {
  content: "\eb01";
}

.ic_share_active:before {
  content: "\eb02";
}

.ic_share:before {
  content: "\eb03";
}

.ic_shared_by_me_active:before {
  content: "\eb04";
}

.ic_shared_by_me:before {
  content: "\eb05";
}

.ic_shared_doc_list:before {
  content: "\eb06";
}

.ic_show_active:before {
  content: "\eb07";
}

.ic_show:before {
  content: "\eb08";
}

.ic_shuffle:before {
  content: "\eb09";
}

.ic_signout:before {
  content: "\eb0a";
}

.ic_skip:before {
  content: "\eb0b";
}

.ic_slide_layout_active:before {
  content: "\eb0c";
}

.ic_slide_layout:before {
  content: "\eb0d";
}

.ic_slide_setting_active:before {
  content: "\eb0e";
}

.ic_slide_setting:before {
  content: "\eb0f";
}

.ic_slide_thumbnail_close:before {
  content: "\eb10";
}

.ic_slide_thumbnail:before {
  content: "\eb11";
}

.ic_slide_title:before {
  content: "\eb12";
}

.ic_slide_with_ai:before {
  content: "\eb13";
}

.ic_slideshow_animation_off:before {
  content: "\eb14";
}

.ic_slideshow_animation:before {
  content: "\eb15";
}

.ic_slideshow_close:before {
  content: "\eb16";
}

.ic_slideshow_comments_large:before {
  content: "\eb17";
}

.ic_slideshow_comments:before {
  content: "\eb18";
}

.ic_slideshow_emoji_large:before {
  content: "\eb19";
}

.ic_slideshow_emoji:before {
  content: "\eb1a";
}

.ic_slideshow_eraser:before {
  content: "\eb1b";
}

.ic_slideshow_exit_fullscreen:before {
  content: "\eb1c";
}

.ic_slideshow_exit_fulscreen_large:before {
  content: "\eb1d";
}

.ic_slideshow_fullscreen:before {
  content: "\eb1e";
}

.ic_slideshow_fulscreen_large:before {
  content: "\eb1f";
}

.ic_slideshow_grid_large:before {
  content: "\eb20";
}

.ic_slideshow_grid:before {
  content: "\eb21";
}

.ic_slideshow_left_pointer_large:before {
  content: "\eb22";
}

.ic_slideshow_marker_large:before {
  content: "\eb23";
}

.ic_slideshow_marker:before {
  content: "\eb24";
}

.ic_slideshow_pause_large:before {
  content: "\eb25";
}

.ic_slideshow_pause:before {
  content: "\eb26";
}

.ic_slideshow_pen_02:before {
  content: "\eb27";
}

.ic_slideshow_pen_large:before {
  content: "\eb28";
}

.ic_slideshow_pen:before {
  content: "\eb29";
}

.ic_slideshow_play_large:before {
  content: "\eb2a";
}

.ic_slideshow_play:before {
  content: "\eb2b";
}

.ic_slideshow_ppt:before {
  content: "\eb2c";
}

.ic_slideshow_presenter_view:before {
  content: "\eb2d";
}

.ic_slideshow_report_large:before {
  content: "\eb2e";
}

.ic_slideshow_right_pointer_large:before {
  content: "\eb2f";
}

.ic_slideshow_settings_large:before {
  content: "\eb30";
}

.ic_slideshow_settings:before {
  content: "\eb31";
}

.ic_slideshow_share_large:before {
  content: "\eb32";
}

.ic_slideshow_speaker_notes_large:before {
  content: "\eb33";
}

.ic_slideshow_speaker_notes:before {
  content: "\eb34";
}

.ic_smallcase:before {
  content: "\eb35";
}

.ic_social_info:before {
  content: "\eb36";
}

.ic_sorter_arrow:before {
  content: "\eb37";
}

.ic_speaker:before {
  content: "\eb38";
}

.ic_speed_delivery:before {
  content: "\eb39";
}

.ic_speed:before {
  content: "\eb3a";
}

.ic_Staircase:before {
  content: "\eb3b";
}

.ic_status_circle:before {
  content: "\eb3c";
}

.ic_status_none:before {
  content: "\eb3d";
}

.ic_sticker_active:before {
  content: "\eb3e";
}

.ic_sticker:before {
  content: "\eb3f";
}

.ic_stock_line:before {
  content: "\eb40";
}

.ic_students:before {
  content: "\eb41";
}

.ic_subscription_outline_active:before {
  content: "\eb42";
}

.ic_subscription_outline:before {
  content: "\eb43";
}

.ic_subtitle_outline_active:before {
  content: "\eb44";
}

.ic_subtitle_outline:before {
  content: "\eb45";
}

.ic_subtitle:before {
  content: "\eb46";
}

.ic_swap_down:before {
  content: "\eb47";
}

.ic_swap_left:before {
  content: "\eb48";
}

.ic_swap_right:before {
  content: "\eb49";
}

.ic_swap_up:before {
  content: "\eb4a";
}

.ic_swot:before {
  content: "\eb4b";
}

.ic_table_active:before {
  content: "\eb4c";
}

.ic_table_down_arrow:before {
  content: "\eb4d";
}

.ic_table:before {
  content: "\eb4e";
}

.ic_take_away:before {
  content: "\eb4f";
}

.ic_target:before {
  content: "\eb50";
}

.ic_team_collab_active:before {
  content: "\eb51";
}

.ic_team_collab:before {
  content: "\eb52";
}

.ic_text_ai:before {
  content: "\eb53";
}

.ic_text_align_bottom_position:before {
  content: "\eb54";
}

.ic_text_align_bottom:before {
  content: "\eb55";
}

.ic_text_align_center_position:before {
  content: "\eb56";
}

.ic_text_align_center:before {
  content: "\eb57";
}

.ic_text_align_justified:before {
  content: "\eb58";
}

.ic_text_align_left:before {
  content: "\eb59";
}

.ic_text_align_right:before {
  content: "\eb5a";
}

.ic_text_align_top_position:before {
  content: "\eb5b";
}

.ic_text_align_top:before {
  content: "\eb5c";
}

.ic_text_background_color:before {
  content: "\eb5d";
}

.ic_text_background:before {
  content: "\eb5e";
}

.ic_text_box_active:before {
  content: "\eb5f";
}

.ic_text_box:before {
  content: "\eb60";
}

.ic_text_color:before {
  content: "\eb61";
}

.ic_text_format_bold:before {
  content: "\eb62";
}

.ic_text_format_italics:before {
  content: "\eb63";
}

.ic_text_format_strikeout:before {
  content: "\eb64";
}

.ic_text_format_subscript:before {
  content: "\eb65";
}

.ic_text_format_superscript:before {
  content: "\eb66";
}

.ic_text_format_underline:before {
  content: "\eb67";
}

.ic_text_size:before {
  content: "\eb68";
}

.ic_text_spacing:before {
  content: "\eb69";
}

.ic_text_stack_01:before {
  content: "\eb6a";
}

.ic_text_stack:before {
  content: "\eb6b";
}

.ic_text:before {
  content: "\eb6c";
}

.ic_tick_circle_outline_active:before {
  content: "\eb6d";
}

.ic_tick_circle_outline:before {
  content: "\eb6e";
}

.ic_tick_small:before {
  content: "\eb6f";
}

.ic_tick:before {
  content: "\eb70";
}

.ic_time:before {
  content: "\eb71";
}

.ic_timeline:before {
  content: "\eb72";
}

.ic_tips_active:before {
  content: "\eb73";
}

.ic_tips:before {
  content: "\eb74";
}

.ic_titlecase:before {
  content: "\eb75";
}

.ic_toggle:before {
  content: "\eb76";
}

.ic_tranfer_ownership:before {
  content: "\eb77";
}

.ic_transfer:before {
  content: "\eb78";
}

.ic_transition:before {
  content: "\eb79";
}

.ic_trim_video:before {
  content: "\eb7a";
}

.ic_turn_into:before {
  content: "\eb7b";
}

.ic_twitter:before {
  content: "\eb7c";
}

.ic_un_group:before {
  content: "\eb7d";
}

.ic_undo:before {
  content: "\eb7e";
}

.ic_unlock:before {
  content: "\eb7f";
}

.ic_unpublish:before {
  content: "\eb80";
}

.ic_up_arrow_active:before {
  content: "\eb81";
}

.ic_up_arrow:before {
  content: "\eb82";
}

.ic_up_pointer_circle_outline:before {
  content: "\eb83";
}

.ic_up_pointer_floater_small:before {
  content: "\eb84";
}

.ic_up_pointer_floater:before {
  content: "\eb85";
}

.ic_up_pointer:before {
  content: "\eb86";
}

.ic_update_share_small:before {
  content: "\eb87";
}

.ic_update_share:before {
  content: "\eb88";
}

.ic_upgrade:before {
  content: "\eb89";
}

.ic_upload_image_active:before {
  content: "\eb8a";
}

.ic_upload_image:before {
  content: "\eb8b";
}

.ic_uppercase:before {
  content: "\eb8c";
}

.ic_user_active:before {
  content: "\eb8d";
}

.ic_user_fill:before {
  content: "\eb8e";
}

.ic_user_profile_active:before {
  content: "\eb8f";
}

.ic_user_profile:before {
  content: "\eb90";
}

.ic_user:before {
  content: "\eb91";
}

.ic_value_list:before {
  content: "\eb92";
}

.ic_variations_active:before {
  content: "\eb93";
}

.ic_variations_outline:before {
  content: "\eb94";
}

.ic_variations:before {
  content: "\eb95";
}

.ic_version_history_play:before {
  content: "\eb96";
}

.ic_video_active:before {
  content: "\eb97";
}

.ic_video_disabled:before {
  content: "\eb98";
}

.ic_video_meeting:before {
  content: "\eb99";
}

.ic_video:before {
  content: "\eb9a";
}

.ic_view_version:before {
  content: "\eb9b";
}

.ic_warning_fill:before {
  content: "\eb9c";
}

.ic_warning:before {
  content: "\eb9d";
}

.ic_web_video:before {
  content: "\eb9e";
}

.ic_workspace_assets_active:before {
  content: "\eb9f";
}

.ic_workspace_assets:before {
  content: "\eba0";
}

.ic_workspace_image_active:before {
  content: "\eba1";
}

.ic_workspace_image:before {
  content: "\eba2";
}

.ic_workspace_theme_active:before {
  content: "\eba3";
}

.ic_workspace_theme:before {
  content: "\eba4";
}

.ic_xyplot:before {
  content: "\eba5";
}

.ic_youtube_active:before {
  content: "\eba6";
}

.ic_youtube:before {
  content: "\eba7";
}

.ic_zen_present_scroll:before {
  content: "\eba8";
}

.ic_zen_present_slideshow:before {
  content: "\eba9";
}

.ic_zoom_section:before {
  content: "\ebaa";
}
* {
    -webkit-overflow-scrolling: touch;
}

html, body {
    background: #ffffff !important;
}

.PTSerif {
    font-family: "PT Serif";
}
.InterFont {
    font-family: "Inter";
}
span[contentEditable="plaintext-only"]:empty:before {
    content: attr(data-prompt);
    color: #c6c6c6;
}

span.lightText[contentEditable="plaintext-only"]:empty:before {
    content: attr(data-prompt);
    color: rgba(255, 255, 255, 0.3);
}

/* Hide placeholders when editor has content */
.editor-container.has-content .ProseMirror .is-empty::before {
    display: none !important;
}
.editor-container.has-content .ProseMirror .is-editor-empty::before {
    display: none !important;
}

.editorContainerMarginTop {
    margin-top: 12px !important;
}

/* Style placeholder text */
.ProseMirror .is-empty::before {
    color: #9ca3af !important; /* text-gray-400 */
    font-size: 0.875rem !important; /* text-sm */
    line-height: 1.25rem !important; /* leading-[17px] */
}
.ProseMirror .is-editor-empty::before {
    color: #9ca3af !important; /* text-gray-400 */
    font-size: 0.875rem !important; /* text-sm */
    line-height: 1.25rem !important; /* leading-[17px] */
}

.bg-pattern {
    opacity: 0.15;
    background-image: repeating-linear-gradient(45deg, #000000 25%, transparent 25%, transparent 75%, #000000 0%, #000000), repeating-linear-gradient(45deg, #ffc107 25%, #ffffff 25%, #ffffff 75%, #000000 75%, #000000);
    background-position:
        0 0,
        5px 5px;
    background-size: 10px 10px;
}

/* //animation */
.mainOpacity {
    animation: opacityanimation 2.9s ease forwards;
}

@keyframes opacityanimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* //animation */
.zoomInAnimation {
    animation: zoomInAnimation 0.2s ease forwards;
}

@keyframes zoomInAnimation {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.bottomToTop {
    animation: bottomToTop 1s ease forwards;
}

.bottomToTopFast {
    animation: bottomToTop 0.5s ease forwards;
}

@keyframes bottomToTop {
    0% {
        transform: translateY(30px);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

/* Staggered fade-in animation for onboarding */
.staggerFadeIn > * {
    animation: fadeInUp 0.4s ease forwards;
    opacity: 0;
}

.staggerFadeIn > *:nth-child(1) {
    animation-delay: 0.05s;
}
.staggerFadeIn > *:nth-child(2) {
    animation-delay: 0.1s;
}
.staggerFadeIn > *:nth-child(3) {
    animation-delay: 0.15s;
}
.staggerFadeIn > *:nth-child(4) {
    animation-delay: 0.2s;
}
.staggerFadeIn > *:nth-child(5) {
    animation-delay: 0.25s;
}
.staggerFadeIn > *:nth-child(6) {
    animation-delay: 0.3s;
}
.staggerFadeIn > *:nth-child(7) {
    animation-delay: 0.35s;
}
.staggerFadeIn > *:nth-child(8) {
    animation-delay: 0.4s;
}
.staggerFadeIn > *:nth-child(9) {
    animation-delay: 0.45s;
}
.staggerFadeIn > *:nth-child(10) {
    animation-delay: 0.5s;
}
.staggerFadeIn > *:nth-child(11) {
    animation-delay: 0.55s;
}
.staggerFadeIn > *:nth-child(12) {
    animation-delay: 0.6s;
}
.staggerFadeIn > *:nth-child(13) {
    animation-delay: 0.65s;
}
.staggerFadeIn > *:nth-child(14) {
    animation-delay: 0.7s;
}
.staggerFadeIn > *:nth-child(15) {
    animation-delay: 0.75s;
}
.staggerFadeIn > *:nth-child(16) {
    animation-delay: 0.8s;
}
.staggerFadeIn > *:nth-child(17) {
    animation-delay: 0.85s;
}
.staggerFadeIn > *:nth-child(18) {
    animation-delay: 0.9s;
}
.staggerFadeIn > *:nth-child(19) {
    animation-delay: 0.95s;
}
.staggerFadeIn > *:nth-child(20) {
    animation-delay: 1s;
}

/* Infinite logo marquee for the login / role-selection value-prop panel.
   The track renders 4 identical copies of the logo set, so translating the
   track by -25% scrolls exactly one copy width and loops seamlessly. */
.animate-logo-marquee {
    animation: logo-marquee 24s linear infinite;
}

@keyframes logo-marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-25%);
    }
}

/* Role-selection ("Select your role") screen — brand blue #2237F9.
   Kept here as classes so the JSX carries no hardcoded hex values. */
.role-continue-button {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.2) 100%), #2237f9 !important;
}
.role-card-selected {
    /* button/selected: border/primary-inverted (#0b0f14) + border/secondary-inverted (48%). */
    box-shadow: 0 0 0 0.75px #0b0f14, 0 0 0 2px rgba(11, 15, 20, 0.48);
}

@keyframes fadeInUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.animate-fadeInOpacity {
    animation: fadeInOpacity 0.5s ease-out forwards;
    opacity: 0;
}
@keyframes fadeInOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.topToBottom {
    animation: topToBottom 0.5s ease forwards;
}

@keyframes topToBottom {
    0% {
        transform: translateY(-30px);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

.aiTemplateInput:empty:before {
    content: attr(data-prompt);
    opacity: 0.4;
}

.blinkAnimation {
    animation: zoom-in-zoom-out 1s ease infinite;
}

@keyframes zoom-in-zoom-out {
    0% {
        transform: scale(1, 1);
    }
    50% {
        transform: scale(1.3, 1.3);
    }
    100% {
        transform: scale(1, 1);
    }
}

.blinkAnimation2 {
    animation: zoom-in-zoom-out2 1s ease infinite;
}

@keyframes zoom-in-zoom-out2 {
    0% {
        transform: scale(1, 1);
    }
    50% {
        transform: scale(1.03, 1.03);
    }
    100% {
        transform: scale(1, 1);
    }
}

.floating-text1 {
    animation: floatAnimation1 12s ease-in-out forwards infinite;
    animation-delay: 0s;
}

.floating-text2 {
    animation: floatAnimation2 12s ease-in-out forwards infinite;
    animation-delay: 3s;
}

.floating-text3 {
    animation: floatAnimation1 12s ease-in-out forwards infinite;
    animation-delay: 6s;
}

.floating-text4 {
    animation: floatAnimation2 12s ease-in-out forwards infinite;
    animation-delay: 9s;
}

@keyframes floatAnimation1 {
    0% {
        opacity: 0;
        transform: translate(0, 200px);
    }

    5% {
        opacity: 1;
    }

    15% {
        transform: translate(100px, -200px);
    }

    20% {
        opacity: 1;
        transform: translate(100px, -200px);
    }

    25% {
        opacity: 0;
        transform: scale(0.5) translate(200px, -400px);
    }

    100% {
        opacity: 0;
    }
}

@keyframes floatAnimation2 {
    0% {
        opacity: 0;
        transform: translate(200px, 200px);
    }

    5% {
        opacity: 1;
    }

    15% {
        transform: translate(-100px, -200px);
    }

    20% {
        opacity: 1;
        transform: translate(-100px, -200px);
    }

    25% {
        opacity: 0;
        transform: scale(0.5) translate(-100px, -400px);
    }

    100% {
        opacity: 0;
    }
}

/* //progress-bar start */
.progress-bar-width-animation {
    animation: progress-bar-width-animation 5s ease forwards;
}

@keyframes progress-bar-width-animation {
    0% {
        width: 0;
    }
    35% {
        width: 40%;
    }
    70% {
        width: 60%;
    }
    85% {
        width: 75%;
    }
    100% {
        width: 90%;
    }
}

.progress-bar-stripes-animation {
    background-size: 40px 40px;
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    animation: progress-bar-stripes-animation 1s linear infinite;
}

@keyframes progress-bar-stripes-animation {
    0% {
        background-position: 40px 0;
    }
    100% {
        background-position: 0 0;
    }
}
/* //progress-bar end */

.enableDelay {
    display: none;
    animation: enableDelay 2s linear forwards;
}

@keyframes enableDelay {
    0% {
        display: none;
    }
    99% {
        display: none;
    }
    100% {
        display: flex;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(-10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.gradientText {
    background: linear-gradient(274.01deg, #7732d3 0%, #2563eb 105.01%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow:
        transparent 0px 0px 0px,
        rgb(0, 0, 0, 0) 0px 0px 0px !important;
}

.gradientText2 {
    background: linear-gradient(276deg, #3a8ee6 0%, #c03ae7 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow:
        transparent 0px 0px 0px,
        rgb(0, 0, 0, 0) 0px 0px 0px !important;
}

.hideFocus {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.pdcTextInput.hideOutlineOnFocus {
    outline: none !important;
    box-shadow: none !important;
    outline-offset: 0px !important;
}
/* //image-carousel */

.image-carousel .carousel .control-dots .dot {
    width: 6px;
    height: 6px;
    margin: 0 3px;
    box-shadow: none;
    transition: all 0.3s;
    opacity: 0.4;
}
.image-carousel .carousel .control-dots .dot.selected {
    width: 16px;
    border-radius: 100px;
}
.image-carousel .carousel-root {
    height: 100%;
}
.image-carousel .carousel.carousel-slider {
    height: 100%;
    position: static;
}
.image-carousel .carousel .control-dots {
    bottom: 30px;
    margin: 0;
    left: 0;
}
.image-carousel .carousel .slider-wrapper.axis-horizontal .slider {
    height: 100%;
    align-items: center;
}
.image-carousel .slider-wrapper {
    height: 100%;
}
.image-carousel .slider .slide {
    height: 100%;
}
.image-carousel .slider .slide img {
    width: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
}

#pdoTemplateEditor .ql-editor li,
#pdoTemplateEditor .ql-editor p{
    margin-bottom: 0.25rem;
    border-style: none;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 300;
    --tw-text-opacity: 1;
    color: rgb(22 22 22 / var(--tw-text-opacity, 1));
    outline: 2px solid transparent;
    outline-offset: 2px;
}
#wsTaskEditor .ql-editor{
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    letter-spacing: 0.035em;
}

#wsTaskEditor .ql-editor.ql-blank::before {
    letter-spacing: 0.035em;
    left: 12px;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    opacity: 0.6;
}

#headlessui-portal-root {
    position: absolute;
    z-index: 50;
}

#mainquilleditor .quill-container .is-empty{
    font-size: 1rem;
    line-height: 1.5rem;
}

.divInput[contentEditable="true"]:empty:before {
    content: attr(data-prompt);
    font-size: 0.875rem;
    line-height: 1.25rem;
    opacity: 0.4;
}

.chatInput:empty:before {
    content: attr(data-prompt);
    font-size: 0.875rem;
    line-height: 1.25rem;
    opacity: 0.4;
}

.dot-flashing {
    position: relative;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    --tw-bg-opacity: 1;
    background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 94 255 / var(--tw-text-opacity, 1));
    animation: dot-flashing 1s infinite linear alternate;
    animation-delay: 0.5s;
}
.dot-flashing::before,
.dot-flashing::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
}
.dot-flashing::before {
    left: -9px;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    --tw-bg-opacity: 1;
    background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 94 255 / var(--tw-text-opacity, 1));
    animation: dot-flashing 1s infinite alternate;
    animation-delay: 0s;
}
.dot-flashing::after {
    left: 9px;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    --tw-bg-opacity: 1;
    background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 94 255 / var(--tw-text-opacity, 1));
    animation: dot-flashing 1s infinite alternate;
    animation-delay: 1s;
}
.dot-flasingsize::before {
    left: -19px;
    width: 15px;
    height: 15px;
    border-radius: 15px;
}
.dot-flasingsize::after {
    left: 19px;
    width: 15px;
    height: 15px;
    border-radius: 15px;
}
.dot-flasingsize {
    width: 15px;
    height: 15px;
    border-radius: 15px;
    margin: auto;
}
@keyframes dot-flashing {
    0%{
        --tw-bg-opacity: 1;
        background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
    }
    50%,
    100%{
        background-color: rgb(168 85 247 / var(--tw-bg-opacity, 1));
        --tw-bg-opacity: 0.2;
    }
}

/* For Webkit-based browsers (Chrome, Safari and Opera) */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}
/* Media query for height 620px and below */
@media (max-height: 620px) {
    .height-responsive-padding {
        padding-top: 72px;
    }
    .padding-theme-responsive {
        padding-bottom: 120px;
    }
}

.rightToLeft {
    animation: rightToLeft 0.5s ease forwards;
}
@keyframes rightToLeft {
    0% {
        margin-right: -100px;
        /* opacity: 0; */
    }
    100% {
        margin-right: 0px;
        /* opacity: 1; */
    }
}
.leftToRight {
    animation: leftToRight 0.5s ease forwards;
}
@keyframes leftToRight {
    0% {
        transform: translateX(-50px);
        /* opacity: 0; */
    }
    100% {
        transform: translateX(0px);
        /* opacity: 1; */
    }
}
.buttonLoader{
    position: absolute;
    height: 1.5rem !important;
    width: 1.5rem !important;
    opacity: 0.8;
}

.pdcTextInputInlineFloater.pdcTextInput:focus {
    outline: 2px solid rgb(22, 22, 22) !important;
}

/* //image-carousel*/
.image-carousel .carousel-root {
    width: 100%;
}
.image-carousel .carousel .control-dots .dot{
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 3px;
    margin-right: 3px;
    height: 6px;
    width: 6px;
    opacity: 0.4;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}
.image-carousel .carousel .control-dots .dot.selected{
    width: 1rem;
    border-radius: 100px;
}
.image-carousel .carousel-root{
    height: 100%;
}
.image-carousel .carousel.carousel-slider{
    position: static;
    height: 100%;
}
.image-carousel .carousel .control-dots{
    bottom: 30px;
    left: 0px;
    margin: 0px;
}
.image-carousel .carousel .slider-wrapper.axis-horizontal .slider{
    height: 100%;
    align-items: center;
}
.image-carousel .slider-wrapper{
    height: 100%;
}
.image-carousel .slider .slide{
    height: 100%;
}
.image-carousel .slider .slide img{
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
    width: 100%;
    max-width: 490px;
}

/* // meeting mode*/
.meetingmodePopupRoot .meetingList:hover .meetingListButtonHolder{
    display: flex;
}

/* // outline table */
.outlineTable {
    border-collapse: separate;
}
.outlineTable .tbody td{
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
    border-style: none solid solid none;
}
.outlineTable .tbody tr:first-child td:first-child {
    border-top-left-radius: 6px;
}
.outlineTable .tbody tr:first-child td:nth-last-child(2) {
    border-top-right-radius: 6px;
}
.outlineTable .tbody tr:last-child td:first-child {
    border-bottom-left-radius: 6px;
}
.outlineTable .tbody tr:last-child td:nth-last-child(2) {
    border-bottom-right-radius: 6px;
}
.outlineTable .tbody tr:first-child td {
    border-top-style: solid;
}
/* .outlineTable .tbody tr:first-child td div {
    padding-top: 10px !important;
} */
.outlineTable .tbody tr td:first-child div {
    padding-left: 10px !important;
}
.outlineTable .tbody tr td:first-child {
    border-left-style: solid;
}
.outlineTable .tbody tr td:last-child{
    position: absolute;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-right-width: 0px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}

/* Resize slider style starts */
.resizeSliderParent .resizeSlider {
    cursor: col-resize;
    border-width: 2px !important;
    --tw-border-opacity: 1 !important;
    border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
    --tw-bg-opacity: 1 !important;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.resizeSliderParent .resizeSlider:hover{
    --tw-bg-opacity: 1 !important;
    background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1)) !important;
}
.resizeSliderParent[data-direction="topBottom"]{
    left: 0px;
    right: 0px;
    height: 2.75rem;
    width: 100%;
}
.resizeSliderLine{
    --tw-bg-opacity: 1 !important;
    background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1)) !important;
}
.resizeSliderParent[data-direction="topBottom"] .resizeSliderLine {
    width: 100% !important;
    height: 2px !important;
}
.resizeSliderParent[data-direction="leftRight"] .resizeSliderLine {
    width: 2px !important;
    height: 100% !important;
}
.resizeSliderParent[data-direction="leftRight"] .resizeSlider {
    height: 44px !important;
    width: 10px !important;
}
.resizeSliderParent[data-direction="topBottom"] .resizeSlider {
    width: 44px !important;
    height: 10px !important;
}
.commonLayout:hover .resizeSliderParent{
    visibility: visible;
    opacity: 1;
}
.commonLayout:hover .resizeSliderParent .resizeSliderLine,
.commonLayout:hover .resizeSliderParent .resizeSlider{
    opacity: 1;
}
.commonLayout[data-slidetype="origami"] .resizeSliderParent{
    display: none;
    opacity: 0;
}
.resizeSliderIcon {
    display: none;
}

/* slide floater  */
.editorScreenWorkspaceRoot #SLIDE_FLOATER_PROPERTIES_BASE hr {
    z-index: 0 !important;
}
.floaterBarProperties .floaterBaseListItemWithRightBorder{
    margin-right: 0.25rem;
    border-right-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(38 38 38 / var(--tw-border-opacity, 1));
    padding-right: 0.25rem;
}
.floaterBarProperties .floaterBaseListItemWithRightBorder:last-child{
    border-width: 0px;
    padding-right: 0px;
}
.floaterBarProperties .floaterInputDatePicker ::-webkit-inner-spin-button,
.floaterBarProperties .floaterInputDatePicker ::-webkit-outer-spin-button{
    margin: 0px;
    display: none;
}
.floaterBarProperties .floaterInputDatePicker ::-webkit-calendar-picker-indicator{
    margin-left: -14px;
    padding: 0px;
    --tw-text-opacity: 1;
    color: rgb(82 82 82 / var(--tw-text-opacity, 1));
    opacity: 0;
}
.flcSettingsDropdownRoot .moreFloaterTextOptionsContentList::before {
    content: "";
    position: absolute;
    bottom: 0px;
    z-index: 50;
    margin-top: -1px;
    height: 1px;
    width: 100%;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

/* // custom styles */
#driver-page-overlay {
    opacity: 0.4 !important;
}
div#driver-highlighted-element-stage {
    background-color: transparent !important;
}
.ql-editor {
    -webkit-user-select: text !important;
       -moz-user-select: text !important;
            user-select: text !important;
}
.ql-editor p {
    -webkit-user-select: text !important;
       -moz-user-select: text !important;
            user-select: text !important;
}

#sliderInput::-webkit-outer-spin-button,
#sliderInput::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
#sliderInput[type="number"] {
    -moz-appearance: textfield;
}
.documentName:focus {
    text-overflow: unset;
}
.assetExtraText {
    max-width: 240px;
}
.slideReaction:hover span {
    transform: rotate(10deg) scale(1.15);
    transform-origin: center;
}

.imageCropHandler img{
    pointer-events: none;
}

.imageCropHandler img {
        position: absolute;
        max-width: unset !important;
    }

.roiSlider input[type="range"]::-webkit-slider-thumb{
    height: 1rem !important;
    width: 1rem !important;
}

/* //button animation clip-e */
.flashAnimation {
    animation: gradient 3s ease infinite;
}
.flashAnimation:before {
    content: "";
    position: absolute;
    width: 200%;
    height: 20px;
    top: -100%;
    right: 0;
    background-color: rgba(255, 255, 255, 0.5);
    transform: rotate(-45deg);
    box-shadow: 10px 0 2px white;
    filter: blur(10px);
    animation: flashAnimation 3s ease infinite;
}
.flashAnimationcustom:before {
    transform: rotate(-64deg);
}
.hoverprorperty {
    --tw-bg-opacity: 1;
    background-color: rgb(237 245 255 / var(--tw-bg-opacity)) !important;
    --tw-border-opacity: 1;
    border-color: rgb(15 98 254 / var(--tw-border-opacity)) !important;
}
@keyframes flashAnimation {
    0% {
    }
    100% {
        transform: translate(200%, 500%);
    }
}
.hoverFlashAnimationParent:hover .hoverFlashAnimation {
    width: 200%;
    left: -300px;
    top: -50px;
    opacity: 0.5;
    background-color: rgba(255, 255, 255, 0.5);
    transform: scale(0.6) rotate(-60deg);
    filter: blur(45px);
    animation: flashAnimation 2s ease;
}
@keyframes flashAnimation {
    0% {
    }
    100% {
        transform: translate(200%, 200%);
    }
}
.minheightAnimation .chatInput:not(:empty) {
    height: 63px;
}

.minheightAnimation {
    animation: minheightAnimation1 0.3s ease-in-out forwards;
}
@keyframes minheightAnimation1 {
    0% {
        min-height: 63px;
    }
    100% {
        min-height: 44px;
    }
}
.minheightAnimation:hover {
    animation: minheightAnimation2 0.3s ease-in-out forwards;
}
@keyframes minheightAnimation2 {
    0% {
        min-height: 44px;
    }
    100% {
        min-height: 63px;
    }
}

/* //loader */
.progressFullLoader,
.progressFullLoader:after {
    border-radius: 50%;
    width: 44px;
    height: 44px;
}

.progressFullLoader {
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    border-top: 4px solid rgba(255, 255, 255, 0.2);
    border-right: 4px solid rgba(255, 255, 255, 0.2);
    border-bottom: 4px solid rgba(255, 255, 255, 0.2);
    border-left: 4px solid #ffffff;
    transform: translateZ(0);
    animation: pflanimation 1.1s infinite linear;
}
@keyframes pflanimation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.fadeInAnimation {
    animation: fadeIn 0.5s 0.5s ease-in forwards;
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.progressLoader {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    position: relative;
    animation: rotate 1s linear infinite;
}

.progressLoader::before,
.progressLoader::after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    inset: 0px;
    border-radius: 50%;
    border: 2px solid #c6c6c6;
    animation: prixClipFix 2s linear infinite;
}

.progressLoader::after {
    transform: rotate3d(90, 90, 0, 180deg);
    border-color: #0f62fe;
}

.buttonLoader {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    position: relative;
    animation: rotate 1s linear infinite;
}

.buttonLoader::before,
.buttonLoader::after {
    content: "";
    box-sizing: border-box;
    position: absolute;
    inset: 0px;
    border-radius: 50%;
    border: 4px solid #fff;
    animation: prixClipFix 2s linear infinite;
}

.buttonLoader::after {
    transform: rotate3d(90, 90, 0, 180deg);
    border-color: #ffffff;
}

.buttonLoaderGray::before,
.buttonLoaderGray::after{
    --tw-border-opacity: 1 !important;
    border-color: rgb(141 141 141 / var(--tw-border-opacity, 1)) !important;
}

.buttonLoaderGray::after{
    --tw-border-opacity: 1 !important;
    border-color: rgb(141 141 141 / var(--tw-border-opacity, 1)) !important;
}

.buttonLoaderApp::before,
.buttonLoaderApp::after{
    --tw-border-opacity: 1 !important;
    border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
}

.buttonLoaderApp::after{
    --tw-border-opacity: 1 !important;
    border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
}

.loaderbg {
    background: linear-gradient(-45deg, #2563eb, #7732d3, #9520c9, #6d25cc);
    background-size: 400% 400%;
    animation: loaderbggradient 5s ease infinite;
}

@keyframes loaderbggradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* //animation */
.fadein-animation {
    animation: 0.5s ease-in-out fadein-animation;
}
@keyframes fadein-animation {
    0% {
        opacity: 0.01;
        transform: translate3d(0, 150px, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* //progress-bar */
.progress-bar {
    animation: 1s ease-in-out progress-bar;
}
@keyframes progress-bar {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}
.aiCreateFlowPasteContentNovelEditor .ProseMirror,
.aiCreateFlowIdeaToDeckNovelEditor .ProseMirror{
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    padding-top: 0.75rem !important;
    padding-bottom: 0px !important;
}
.ProseMirror{
    padding: 3rem;
    padding-left: 2rem;
    padding-right: 2rem;
}
@media (min-width: 640px){
    .ProseMirror{
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

.ProseMirror .is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    float: left;
    color: var(--novel-stone-400);
    pointer-events: none;
    height: 0;
}
.ProseMirror .is-empty::before {
    content: attr(data-placeholder);
    float: left;
    color: var(--novel-stone-400);
    pointer-events: none;
    height: 0;
}

/* Custom image styles */

.ProseMirror img {
    transition: filter 0.1s ease-in-out;
}

.ProseMirror img:hover {
        cursor: pointer;
        filter: brightness(90%);
    }

.ProseMirror img.ProseMirror-selectednode {
        outline: 3px solid #5abbf7;
        filter: brightness(90%);
    }

.img-placeholder {
    position: relative;
}

.img-placeholder:before {
        content: "";
        box-sizing: border-box;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        border: 3px solid var(--novel-stone-200);
        border-top-color: var(--novel-stone-800);
        animation: spinning 0.6s linear infinite;
    }

@keyframes spinning {
    to {
        transform: rotate(360deg);
    }
}

/* //import loader */
.loader01 {
    width: 60px;
    height: 60px;
    border: 2px solid #0052ec;
    border-right-color: transparent;
    border-radius: 50%;
    position: relative;
    animation: loader-rotate 1s linear infinite;
}
@keyframes loader-rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.truncate-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Number of lines to display */
    -webkit-box-orient: vertical;
}
.truncate-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Number of lines to display */
    -webkit-box-orient: vertical;
}
.truncate-4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4; /* Number of lines to display */
    -webkit-box-orient: vertical;
}
.textGradientWithBorderBtn::after {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    width: 100%;
    border-radius: 0.375rem;
}
.textGradientWithBorderBtn:hover::after{
    background-image: linear-gradient(274.01deg, #7732D3 0%, #2563EB 105.01%);
    opacity: 0.15;
}
.exploreStyleBtn {
    background: transparent !important;
}

/* //analytics chart styles */
.highchartsReact .recharts-layer.recharts-cartesian-axis-tick{
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    line-height: 18px;
    --tw-text-opacity: 1;
    color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
.highchartsReact .xAxis .recharts-layer.recharts-cartesian-axis-tick {
    transform: translateY(4px);
}
.highchartsReact .yAxis .recharts-layer.recharts-cartesian-axis-tick {
    transform: translateX(-4px);
}
.highchartsReact .recharts-layer.recharts-cartesian-axis-tick line {
    display: none;
}
.floaterPropsContentList:empty{
    background-color: transparent !important;
    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}
.disableBrTab br {
    display: none;
}
@media screen and (min-width: 640px) {
    .sm-full-shadow {
        box-shadow:
            0px 4px 10px 0px rgba(0, 0, 0, 0.06),
            0px 1px 2px 0px rgba(0, 0, 0, 0.08);
    }
}
.dr_cr_flow .ProseMirror{
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}
.createflow-gradient-bg {
    background-color: hsla(230, 82%, 95%, 0.56);
    background-image: radial-gradient(at 100% 100%, hsla(217, 100%, 88%, 1) 0px, transparent 50%), radial-gradient(at 0% 100%, hsla(226, 100%, 91%, 1) 0px, transparent 50%);
}
.app-gradient-bg {
    background: radial-gradient(at 47% 44%, rgba(103, 228, 193, 0.3) 0px, transparent 50%), radial-gradient(at 56% 53%, rgba(88, 41, 245, 0.2) 0px, transparent 50%);
    background-color: #f5f5f5;
}
.sm-app-gradient-bg{
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
@media screen and (min-width: 640px) {
    .sm-app-gradient-bg {
        background: radial-gradient(at 47% 44%, rgba(103, 228, 193, 0.3) 0px, transparent 50%), radial-gradient(at 56% 53%, rgba(88, 41, 245, 0.2) 0px, transparent 50%);
        background-color: #f5f5f5;
    }
}
input.hideoutline:focus,
span.hideoutline:focus,
div.hideoutline:focus {
    outline: 0 !important;
}

.tableWrapper {
    overflow-x: auto;
}

.animate {
    opacity: 0;
    animation: sizingAnimation 2s forwards;
}

@keyframes sizingAnimation {
    from {
        opacity: 0.5;
        transform: none;
    }
    to {
        opacity: 1;
        transform: translateX(10px);
    }
}

.outlineTextSelector[contentEditable="true"]:empty:before {
    content: attr(data-prompt);
    outline: none;
}
.defaultPrompt[contentEditable="true"]:empty:before {
    content: attr(data-prompt);
    outline: none;
}
.outlineTextSelector:focus {
    outline: none !important;
}

.transition-max-height {
    transition: max-height 0.4s ease-in-out;
}
.no-zoom {
    transform: scale(1); /* Prevent zooming */
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none; /* Prevent text selection */
    touch-action: none; /* Prevent pinch zoom */
}

.first-letter-capitalize {
    text-transform: lowercase;
}
.first-letter-capitalize::first-letter {
    text-transform: uppercase;
}

.comingsoon{
    pointer-events: none;
    display: flex;
    height: 1.25rem;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    background-image: linear-gradient(275.68deg, #3A8EE6 0%, #C03AE7 100%);
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    font-size: 8px;
    font-weight: 600;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

#docOptionList::-webkit-scrollbar-thumb {
    background: transparent !important;
}

#docOptionList::-webkit-scrollbar-thumb:hover {
    background: transparent !important;
}

/* //default scrollbar style */
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

::-webkit-scrollbar:hover {
    width: 4px;
    height: 4px;
}

::-webkit-scrollbar-track {
    background: transparent !important;
    border: unset !important;
}

::-webkit-scrollbar-thumb {
    border-radius: 24px;
    --tw-bg-opacity: 1;
    background-color: rgb(217 217 217 / var(--tw-bg-opacity, 1));
    -webkit-transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}

::-webkit-scrollbar-thumb:hover {
    width: 4px;
    height: 4px;
    border-radius: 24px;
    background: #d1d5db;
}

/* //scrollbar end */
/* Shine Animation for AI Assist */
.aiAssistShineAnimation {
    pointer-events: none;
    overflow: hidden !important;
}

.blackthemebg .aiAssistShineAnimation:after,
.blackthemebg.aiAssistShineAnimation:after,
.whitethemebg .aiAssistShineAnimation:after,
.whitethemebg.aiAssistShineAnimation:after,
.themeBlackbg .aiAssistShineAnimation:after,
.themeBlackbg.aiAssistShineAnimation:after {
    content: "";
    position: absolute;
    top: -110%;
    left: -210%;
    width: 200%;
    height: 200%;
    opacity: 0;
    transform: rotate(30deg);
    background: linear-gradient(to right, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.13) 77%, rgba(255, 255, 255, 0.5) 92%, rgba(255, 255, 255, 0) 100%) !important;
    animation: aiAssistShineAnimation 1.5s ease-out;
}

.aiAssistShineAnimation:after {
    content: "";
    position: absolute;
    top: -110%;
    left: -210%;
    width: 200%;
    height: 200%;
    opacity: 0;
    transform: rotate(30deg);
    background: linear-gradient(to right, rgba(70, 70, 70, 0.13) 0%, rgba(70, 70, 70, 0.13) 77%, rgba(70, 70, 70, 0.5) 92%, rgba(70, 70, 70, 0) 100%);
    animation: aiAssistShineAnimation 1.5s ease-out;
}

@keyframes aiAssistShineAnimation {
    0% {
        opacity: 0;
        top: -110%;
        left: -210%;
    }
    30% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        top: -30%;
        left: -30%;
    }
}

#promptquilleditor .ProseMirror{
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}
#promptquilleditor.aiAddSlideInput .ProseMirror{
    padding-bottom: 2.25rem;
}

#createflow-pastecontent-editor .ProseMirror{
    padding: 1.25rem;
    padding-top: 1rem;
}

#createflow-pastecontent-editor.createflow-pastecontent-editor .ProseMirror{
    padding: 0.5rem;
    padding-top: 0px;
}

.changegraphicpanel .editor-container h1{
    margin-top: 0.75rem !important;
}

.speakerNotesEditor .ProseMirror{
    padding: 0px;
    padding-bottom: 1rem;
}

.speakerNotesEditor [data-tippy-root] {
    display: none !important;
}

/* ripple.css */
@keyframes ripple {
    0% {
        opacity: 1;
        transform: scale(0.75);
    }
    100% {
        opacity: 0;
        transform: scale(2);
    }
}

.ripple-effect {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 100%;
    background-color: rgba(4, 96, 204, 0.5); /* Same color as the border */
    opacity: 0;
    animation: ripple 2s cubic-bezier(0.65, 0, 0.34, 1) infinite;
    z-index: -1;
}

.mobile-absolute {
    position: absolute;
}

@media (min-width: 640px) {
    .mobile-absolute {
        position: relative;
    }
}
.jump-animation {
    animation: jump 1s ease-in-out infinite;
}

@keyframes jump {
    0%,
    100% {
        transform: translateY(-15%);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }

    50% {
        transform: translateY(0);
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

.markdown-content-section ol {
    list-style: auto !important;
    margin-left: 1rem !important;
}

.markdown-content-section ul {
    list-style: disc !important;
    margin-left: 1rem !important;
}

.html-content-node {
    margin: 8px 0;
    position: relative;
}
.ProseMirror {
    min-height: 100px;
    padding: 8px;
    outline: none;
}
.ProseMirror p {
    margin: 12px 0;
    line-height: 1.5;
}
.aiCreateFlowPasteContentNovelEditor .ProseMirror p {
    line-height: 1.75;
}
/* Pulse scale animation - Export Success Screen start */
.animate-pulse-scale {
    animation: pulse-scale 1.5s ease-in infinite;
}

@keyframes pulse-scale {
    0% {
        transform: scale(0.5);
    }
    50% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.5);
    }
}
/* Pulse scale animation - Export Success Screen end */
/* Blob animations for LinkedIn share popup start */
.animate-blob1 {
    animation: blob1 8.5s ease-in-out infinite;
}

.animate-blob2 {
    animation: blob2 8.5s ease-in-out infinite;
}

.animate-blob3 {
    animation: blob3 8.5s ease-in-out infinite;
}

@keyframes blob1 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(123px, -30px) scale(1);
    }
    66% {
        transform: translate(65px, 60px) scale(0.6);
    }
}

@keyframes blob2 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(-69px, -62px) scale(1.65);
    }
    66% {
        transform: translate(63px, -83px) scale(1.75);
    }
}

@keyframes blob3 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(-57px, 88px) scale(0.6);
    }
    66% {
        transform: translate(-117px, 18px) scale(1);
    }
}
/* Blob animations for LinkedIn share popup end */

/* Loading text animation - LinkedIn share popup start */
.loading-text-animation {
    animation: textSlideFade 3s ease-in-out infinite;
}

@keyframes textSlideFade {
    0%,
    100% {
        opacity: 1;
        transform: translateY(0);
    }
    15% {
        opacity: 0;
        transform: translateY(-8px);
    }
    85% {
        opacity: 0;
        transform: translateY(8px);
    }
}
/* Loading text animation - LinkedIn share popup end */

/* Heading transition animation - LinkedIn share popup start */
.heading-transition {
    transition: all 0.8s ease-in-out;
}

.heading-fade-in {
    opacity: 1;
    transform: translateY(0);
}

.heading-fade-out {
    opacity: 0;
    transform: translateY(-15px);
}

/* Loading text set transition - LinkedIn share popup start */
.loading-text-set-transition {
    transition: all 0.8s ease-in-out;
}

.loading-text-set-fade-in {
    opacity: 1;
    transform: translateY(0);
}

.loading-text-set-fade-out {
    opacity: 0;
    transform: translateY(20px);
}
/* Loading text set transition - LinkedIn share popup end */

/* Spin slow animation - LinkedIn share popup start */
@keyframes spin-slow {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.animate-spin-slow {
    animation: spin-slow 3s linear infinite;
}
/* Spin slow animation - LinkedIn share popup end */

.editorScreenBase #workspacebasediv .slideHolderEditorListItem .commonLayout[data-type="SLIDE"] {
    border-radius: inherit;
}

/* Modal animations */
.animate-fadeIn {
    animation: fadeIn 0.3s ease-out forwards;
}

.animate-fadeOut {
    animation: fadeOut 0.3s ease-out forwards;
}

.animate-slideUp {
    animation: slideUp 0.4s ease-out forwards;
}

.animate-slideDown {
    animation: slideDown 0.4s ease-out forwards;
}

.animate-slideInFromRight {
    animation: slideInFromRight 0.3s ease-out forwards;
}

@keyframes slideInFromRight {
    0% {
        opacity: 0;
        transform: translateX(20px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes slideUp {
    0% {
        opacity: 0;
        transform: translateY(20px) scale(0.95);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes slideDown {
    0% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    100% {
        opacity: 0;
        transform: translateY(20px) scale(0.95);
    }
}
.createflow-prompt-editor table{
    text-align: left;
}

/* Shimmer text animation */
.shimmer-text {
    background: linear-gradient(90deg, #727272 25%, #e0e0e0 50%, #4a4a4a 75%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shimmer-text-slide 4s linear infinite;
}

@keyframes shimmer-text-slide {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}
@keyframes shimmer-switch {
    0% {
        background-position: -200% center;
    }
    50% {
        background-position: 0% center;
    }
    100% {
        background-position: 200% center;
    }
}
@keyframes pulse-switch {
    0%,
    100% {
        opacity: 1;
        filter: brightness(1) saturate(1);
    }
    25% {
        opacity: 0.85;
        filter: brightness(1.15) saturate(1.1);
    }
    50% {
        opacity: 1;
        filter: brightness(1.1) saturate(1.15);
    }
    75% {
        opacity: 0.9;
        filter: brightness(1.2) saturate(1.2);
    }
}
.calculating-score-animated {
    background: linear-gradient(90deg, #00e0dc 0%, #5522ef 25%, #a946ff 50%, #5522ef 75%, #00e0dc 100%);
    background-size: 300% auto;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation:
        shimmer-switch 6s ease-in-out infinite,
        pulse-switch 4s ease-in-out infinite;
}

.pricingProGradientText {
    /* background: linear-gradient(180deg, #a6c8ff 0%, #0f62fe 100%); */
    background: linear-gradient(180deg, #ffd1ba 0%, #f50 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.gradientTextStyle1 {
    background: linear-gradient(90deg, #2abfff 0%, #3e5df7 31.73%, #9c4cff 59.13%, #e14cff 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Placeholder text fade animation */
@keyframes fadeInOut {
    0% {
        opacity: 0;
        transform: translateY(5px);
    }
    20% {
        opacity: 1;
        transform: translateY(0);
    }
    80% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(-5px);
    }
}
/* Hide background gradient on mobile devices */
@media (max-width: 639px) {
    .mobile-no-gradient {
        background: none !important;
    }
}

.animate-fade-in {
    animation: fadeInOut 1.8s ease-in-out;
    animation-fill-mode: both;
}

/* Smooth entry when opening the presentation / slideshow view (a gentle fade +
   slight zoom-out from oversize so it doesn't snap in too fast). */
@keyframes presentViewIn {
    from {
        opacity: 0;
        transform: scale(1.02);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
.animate-present-in {
    animation: presentViewIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Markdown styling for outline content */
.createflow-prompt-editor .outline-content {
    line-height: 1.6;
}
/* IMPORTANT NOTE: While updting this below code please check the speaker notes editor styles once */
.speakerNotesEditor h1,
.speakerNotesEditor h2,
.speakerNotesEditor h3,
.speakerNotesEditor h4,
.speakerNotesEditor h5,
.speakerNotesEditor h6,
.createflow-prompt-editor .outline-content h1,
.createflow-prompt-editor .outline-content h2,
.createflow-prompt-editor .outline-content h3,
.createflow-prompt-editor .outline-content h4,
.createflow-prompt-editor .outline-content h5,
.createflow-prompt-editor .outline-content h6 {
    font-weight: 600;
    margin: 12px 0 12px 0;
    line-height: 1.3;
}

.speakerNotesEditor h1,
.createflow-prompt-editor .outline-content h1 {
    font-size: 28px;
}
.speakerNotesEditor h2,
.createflow-prompt-editor .outline-content h2 {
    font-size: 20px;
}
.speakerNotesEditor h3,
.createflow-prompt-editor .outline-content h3 {
    font-size: 20px;
}
.speakerNotesEditor h4,
.createflow-prompt-editor .outline-content h4 {
    font-size: 20px;
}
.speakerNotesEditor h5,
.createflow-prompt-editor .outline-content h5 {
    font-size: 16px;
}
.speakerNotesEditor h6,
.createflow-prompt-editor .outline-content h6 {
    font-size: 14px;
}

.speakerNotesEditor p {
    margin: 12px 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.3;
}

.createflow-prompt-editor .outline-content p {
    margin: 12px 0;
    font-size: 14px;
}

.speakerNotesEditor ul,
.speakerNotesEditor ol,
.createflow-prompt-editor .outline-content ul,
.createflow-prompt-editor .outline-content ol {
    margin: 12px 0;
    padding-left: 24px;
}

.speakerNotesEditor li,
.createflow-prompt-editor .outline-content li {
    font-size: 14px;
    margin: 6px 0;
}

.speakerNotesEditor strong,
.speakerNotesEditor b,
.createflow-prompt-editor .outline-content strong,
.createflow-prompt-editor .outline-content b {
    font-weight: 700;
}

.speakerNotesEditor em,
.speakerNotesEditor i,
.createflow-prompt-editor .outline-content em,
.createflow-prompt-editor .outline-content i {
    font-style: italic;
}

.speakerNotesEditor code,
.createflow-prompt-editor .outline-content code {
    background-color: #f3f4f6;
    padding: 0.125em 0.25em;
    border-radius: 0.25em;
    font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
    font-size: 13px;
}

.speakerNotesEditor pre,
.createflow-prompt-editor .outline-content pre {
    background-color: #f3f4f6;
    padding: 10px;
    border-radius: 12px;
    overflow-x: auto;
    margin: 12px 0;
}

.speakerNotesEditor pre code,
.createflow-prompt-editor .outline-content pre code {
    background-color: transparent;
    padding: 0;
}

.speakerNotesEditor blockquote,
.createflow-prompt-editor .outline-content blockquote {
    border-left: 3px solid #d1d5db;
    padding-left: 16px;
    margin: 12px 0;
    color: #6b7280;
}

.speakerNotesEditor a,
.createflow-prompt-editor .outline-content a {
    color: #3b82f6;
    text-decoration: underline;
}

.speakerNotesEditor a:hover,
.createflow-prompt-editor .outline-content a:hover {
    color: #2563eb;
}

.speakerNotesEditor hr,
.createflow-prompt-editor .outline-content hr {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 16px 0;
}

.speakerNotesEditor table,
.createflow-prompt-editor .outline-content table {
    border-collapse: collapse;
    width: 100%;
    margin: 12px 0;
}

.speakerNotesEditor th,
.speakerNotesEditor td,
.createflow-prompt-editor .outline-content th,
.createflow-prompt-editor .outline-content td {
    border: 1px solid #d1d5db;
    padding: 12px;
    text-align: left;
}

.speakerNotesEditor th,
.createflow-prompt-editor .outline-content th {
    background-color: #f9fafb;
    font-weight: 600;
}

/* Additional markdown styling for outline context */
.speakerNotesEditor h1:first-child,
.speakerNotesEditor h2:first-child,
.speakerNotesEditor h3:first-child,
.createflow-prompt-editor .outline-content h1:first-child,
.createflow-prompt-editor .outline-content h2:first-child,
.createflow-prompt-editor .outline-content h3:first-child {
    margin-top: 0;
}

.speakerNotesEditor ul:last-child,
.speakerNotesEditor ol:last-child,
.speakerNotesEditor p:last-child,
.createflow-prompt-editor .outline-content ul:last-child,
.createflow-prompt-editor .outline-content ol:last-child,
.createflow-prompt-editor .outline-content p:last-child {
    margin-bottom: 0;
}

.speakerNotesEditor code,
.createflow-prompt-editor .outline-content code {
    word-break: break-word;
}

.speakerNotesEditor pre,
.createflow-prompt-editor .outline-content pre {
    white-space: pre-wrap;
    word-wrap: break-word;
}

.createflow-prompt-editor .outline-content img {
    width: auto;
    height: auto;
    max-width: 220px;
    max-height: 220px;
}

/* Ensure cursor visibility in outline content */
.createflow-prompt-editor .outline-content {
    caret-color: #000000;
}

.speakerNotesEditor:focus,
.createflow-prompt-editor .outline-content:focus {
    outline: none;
    caret-color: #000000;
}

.speakerNotesEditor:focus-visible,
.createflow-prompt-editor .outline-content:focus-visible {
    outline: none;
    caret-color: #000000;
}
.pro-gradient-text {
    background: linear-gradient(276deg, #3a8ee6 0%, #c03ae7 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out both;
}

/* For table cell selected in ci-table-cell-selected class */
body:not(:has(.widgetView)) .ci-table-cell-selected {
    outline-style: solid;
    outline-width: 2px;
    outline-offset: -2px;
    outline-color: #0055ED;
}

/* Flip clock timer styles */
.fc-digit {
    width: 80px;
    height: 68px;
    perspective: 400px;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

/* Shared pseudo-element text style */
.fc-upper::after,
.fc-lower::after,
.fc-fold-top::after,
.fc-fold-bot::after {
    content: attr(data-value);
    position: absolute;
    left: 0;
    width: 100%;
    height: 68px;
    text-align: center;
    line-height: 68px;
    font-size: 36px;
    font-weight: 700;
    color: #fff;
}

/* --- Static top half (shows NEW value behind falling flap) --- */
.fc-upper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: hidden;
    background: #333;
    border-radius: 10px 10px 0 0;
}
.fc-upper::after {
    top: 0;
}

/* --- Static bottom half (shows OLD value, covered by unfolding flap) --- */
.fc-lower {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: hidden;
    background: #2b2b2b;
    border-radius: 0 0 10px 10px;
}
.fc-lower::after {
    bottom: 0;
}

/* --- Center divider line (always visible above everything) --- */
.fc-divider {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    background: #000;
    z-index: 20;
    transform: translateY(-1px);
    pointer-events: none;
}

/* --- Top fold: OLD value falls down (hinged at center) --- */
.fc-fold-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: hidden;
    background: #333;
    border-radius: 10px 10px 0 0;
    transform-origin: center bottom;
    animation: fc-foldTop 0.3s cubic-bezier(0.37, 0.01, 0.94, 0.35) both;
    z-index: 10;
}
.fc-fold-top::after {
    top: 0;
}

/* --- Bottom fold: NEW value unfolds down (hinged at center) --- */
.fc-fold-bot {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: hidden;
    background: #2b2b2b;
    border-radius: 0 0 10px 10px;
    transform-origin: center top;
    animation: fc-foldBot 0.6s cubic-bezier(0.15, 0.45, 0.28, 1) both;
    z-index: 10;
}
.fc-fold-bot::after {
    bottom: 0;
}

@keyframes fc-foldTop {
    0% {
        transform: rotateX(0deg);
    }
    100% {
        transform: rotateX(-90deg);
    }
}

@keyframes fc-foldBot {
    0%,
    50% {
        transform: rotateX(90deg);
    }
    100% {
        transform: rotateX(0deg);
    }
}

.animate-bounce-slow {
    animation: bounce-slow-slow 1.5s infinite;
}

@keyframes bounce-slow-slow {
    0%,
    100% {
        transform: translateY(-15%);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
        transform: none;
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

@keyframes rotateTextSlideUp {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(-100%);
    }
}

@keyframes rotateTextSlideIn {
    0% {
        opacity: 0;
        transform: translateY(100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/*! purgecss start ignore */.commonLayout{width:var(--slideWidth);height:var(--slideHeight);position:relative;overflow:hidden;box-sizing:border-box;background:rgba(var(--th-slide-primary), 1)}.commonLayout sub,.commonLayout sup{line-height:1}.commonLayout [contentEditable=true]{caret-color:var(--secondary-color)}.commonLayout [contentEditable=true].subtitleColorBg{caret-color:var(--alter-secondary-color)}.commonLayout [contentEditable=true] .cs-heading-highlight-text-style,.commonLayout [contentEditable=true] .cs-body-highlight-text-style{caret-color:rgba(var(--th-section-color1), 1)}.commonLayout [contentEditable=true]:empty:before{text-shadow:0 0 var(--secondary-color)}.commonLayout [contentEditable=true]:empty:before.subtitleColorBg{text-shadow:0 0 var(--alter-secondary-color)}.commonLayout [contentEditable=true]{-webkit-user-select:text;-moz-user-select:text;user-select:text}.widgetView{-webkit-user-select:none;-moz-user-select:none;user-select:none}.widgetView .selectedTextHyperlink,.widgetView .selectedTextSlideHyperlink{cursor:pointer}.widgetView .selectedTextHyperlink *,.widgetView .selectedTextSlideHyperlink *{pointer-events:none}.widgetView canvas{pointer-events:none}.widgetView [data-name=DragView]{display:none}.widgetView [data-name=OrigamView]{pointer-events:none}.widgetView .mood.commonLayout[data-showhidetitle=show] #slide-element .moodanimation,.widgetView .mood.commonLayout[data-showhidegraphic=show] #slide-element .moodanimation{opacity:0}.widgetView .mood.commonLayout[data-showhidetitle=hide] #slide-element .moodanimation,.widgetView .mood.commonLayout[data-showhidegraphic=hide] #slide-element .moodanimation{opacity:1}.widgetView .mood.commonLayout[data-showhidegraphic=hide] #slide-element .cs-legend-shape.moodanimation[data-animation=""]{opacity:0}.widgetView .mood.commonLayout[data-showhidegraphic=show] #slide-element .cs-legend-shape.moodanimation[data-animation=""]{opacity:0 !important}.widgetView .resizeSliderParent{display:none !important}.widgetViewPaused{animation-play-state:paused !important}.widgetViewPaused .mood.commonLayout[data-showhidetitle=show] #slide-element .moodanimation,.widgetViewPaused .mood.commonLayout[data-showhidetitle=hide] #slide-element .moodanimation,.widgetViewPaused .mood.commonLayout[data-showhidegraphic=hide] #slide-element .moodanimation,.widgetViewPaused .mood.commonLayout[data-showhidegraphic=show] #slide-element .moodanimation{animation-play-state:paused !important}.widgetViewPaused .maskOverlay,.widgetViewPaused .section{animation-play-state:paused !important}.widgetView .mood.commonLayout[data-showhidetitle=show] #title .section,.widgetView .mood.commonLayout[data-showhidetitle=show] .slide-label .section,.widgetView .mood.commonLayout[data-showhidetitle=show] #subtitle .section{opacity:0;padding-top:0em}.widgetView .mood.commonLayout[data-showhidetitle=show] #subtitle>div:first-child{padding-top:0em}.widgetView .bar .label .labeltext .section,.widgetView .column .label .labeltext .section{opacity:0}.widgetView .mood.commonLayout[data-showhidetitle=hide] #title .maskOverlay,.widgetView .mood.commonLayout[data-showhidetitle=hide] .slide-label .maskOverlay,.widgetView .mood.commonLayout[data-showhidetitle=hide] #subtitle .maskOverlay{overflow:hidden}.widgetView .mood.commonLayout[data-showhidetitle=hide] #title .section,.widgetView .mood.commonLayout[data-showhidetitle=hide] .slide-label .section,.widgetView .mood.commonLayout[data-showhidetitle=hide] #subtitle .section{opacity:1}.widgetView .mood.commonLayout[data-showtitle=true] #title,.widgetView .mood.commonLayout[data-showtitle=true] .slide-label,.widgetView .mood.commonLayout[data-showtitle=true] #subtitle{opacity:1}.widgetView .mood.commonLayout[data-showtitle=true] #title .maskOverlay,.widgetView .mood.commonLayout[data-showtitle=true] .slide-label .maskOverlay,.widgetView .mood.commonLayout[data-showtitle=true] #subtitle .maskOverlay{overflow:hidden}.widgetView .mood.commonLayout[data-showtitle=true] #title .section,.widgetView .mood.commonLayout[data-showtitle=true] .slide-label .section,.widgetView .mood.commonLayout[data-showtitle=true] #subtitle .section{opacity:1}.widgetView .mood.commonLayout[data-showhidetitle=show] #subtitle .section{word-break:normal}.widgetView .maskOverlay{overflow:hidden}.widgetView .mood.commonLayout[data-showhidetitle=show] .section{opacity:0}.widgetView .wordanimation .section{word-break:break-all;display:inline-block}.widgetView .wordanimation.singlewordanimation .section{word-break:normal}.widgetView .title[contentEditable=false]:empty:before,.widgetView .subtitle[contentEditable=false]:empty:before,.widgetView .slide-label[contentEditable=false]:empty:before,.widgetView .cta-button[contentEditable=false]:empty:before{content:""}.relative.overlayDiv {
        position: absolute;
    }.overlayDiv{pointer-events:none;position:absolute;top:0px;left:0px;right:0px;bottom:0px;z-index:1;height:100%;width:100%;overflow:hidden;opacity:0.5;background-image:var(--overlay-bgimage)}.imageCropHandler img{pointer-events:none;position:absolute;max-width:unset !important}.resize-handler.y-end{bottom:-4px}.resize-handler.x-end{right:-4px}.resize-handler.y-start{top:-4px}.resize-handler.x-start{left:-4px}.resize-handler.horizontal{bottom:calc(50% - 4px)}.resize-handler.rams-selection-box{box-shadow:0px 0px 6px rgba(27,24,60,.1),0px 0px 2px rgba(39,34,93,.75);background:linear-gradient(0deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)),#f6f6f9;bottom:calc(50% - 5.5px);right:calc(50% - 5.5px);position:absolute;pointer-events:none}.resize-handler.rams-selection-box.x-start.y-start,.resize-handler.rams-selection-box.x-end.y-start,.resize-handler.rams-selection-box.x-start.y-end,.resize-handler.rams-selection-box.x-end.y-end{width:11px;height:11px;border-radius:9px;margin:0;position:absolute;pointer-events:none}.resize-handler.rams-selection-box.y-end{bottom:-5.5px}.resize-handler.rams-selection-box.x-end{right:-5.5px}.resize-handler.rams-selection-box.y-start{top:-5.5px}.resize-handler.rams-selection-box.x-start{left:-5.5px}.resize-handler.rams-selection-box.y-end:not(.x-start):not(.x-end),.resize-handler.rams-selection-box.y-start:not(.x-start):not(.x-end){right:calc(50% - 9px);width:18px;height:6px;border-radius:3px;margin:2.5px 0;position:absolute;pointer-events:none}.resize-handler.rams-selection-box.x-end:not(.y-start):not(.y-end),.resize-handler.rams-selection-box.x-start:not(.y-start):not(.y-end){bottom:calc(50% - 9px);width:6px;height:18px;border-radius:3px;margin:0 2.5px;position:absolute;pointer-events:none}.resize-handler.rams-selection-box.x-end:not(.y-start):not(.y-end).line,.resize-handler.rams-selection-box.x-start:not(.y-start):not(.y-end).line{cursor:ew-resize;width:11px;height:11px;border-radius:9px;margin:0;bottom:calc(50% - 5.5px);position:absolute;pointer-events:none}.rotation-handler.rams-rotation-handler{width:17px;height:17px;bottom:calc(50% - 9px);right:calc(50% - 9px);position:absolute;pointer-events:none;cursor:move}.rotation-handler.rams-rotation-handler.x-start{left:-28px}.rotation-handler.rams-rotation-handler.x-end{right:-28px}.rotation-handler.rams-rotation-handler.y-start{top:-28px}.rotation-handler.rams-rotation-handler.y-end{bottom:-28px}*{-moz-osx-font-smoothing:grayscale;backface-visibility:hidden;-webkit-font-smoothing:subpixel-antialiased}/*! purgecss end ignore */
*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}/*
! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e5e5; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/
dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #a3a3a3; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #a3a3a3; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */
[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

input:where([type='text']),input:where(:not([type])),input:where([type='email']),input:where([type='url']),input:where([type='password']),input:where([type='number']),input:where([type='date']),input:where([type='datetime-local']),input:where([type='month']),input:where([type='search']),input:where([type='tel']),input:where([type='time']),input:where([type='week']),select:where([multiple]),textarea,select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: #fff;
  border-color: #737373;
  border-width: 1px;
  border-radius: 0px;
  padding-top: 0.5rem;
  padding-right: 0.75rem;
  padding-bottom: 0.5rem;
  padding-left: 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-shadow: 0 0 #0000;
}

input:where([type='text']):focus, input:where(:not([type])):focus, input:where([type='email']):focus, input:where([type='url']):focus, input:where([type='password']):focus, input:where([type='number']):focus, input:where([type='date']):focus, input:where([type='datetime-local']):focus, input:where([type='month']):focus, input:where([type='search']):focus, input:where([type='tel']):focus, input:where([type='time']):focus, input:where([type='week']):focus, select:where([multiple]):focus, textarea:focus, select:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #2563eb;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  border-color: #2563eb;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: #737373;
  opacity: 1;
}

input::placeholder,textarea::placeholder {
  color: #737373;
  opacity: 1;
}

::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}

::-webkit-date-and-time-value {
  min-height: 1.5em;
  text-align: inherit;
}

::-webkit-datetime-edit {
  display: inline-flex;
}

::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field {
  padding-top: 0;
  padding-bottom: 0;
}

select {
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 20 20%27%3e%3cpath stroke=%27%23737373%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.5%27 d=%27M6 8l4 4 4-4%27/%3e%3c/svg%3e");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
}

select:where([multiple]),select:where([size]:not([size="1"])) {
  background-image: initial;
  background-position: initial;
  background-repeat: unset;
  background-size: initial;
  padding-right: 0.75rem;
  -webkit-print-color-adjust: unset;
          print-color-adjust: unset;
}

input:where([type='checkbox']),input:where([type='radio']) {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 0;
  -webkit-print-color-adjust: exact;
          print-color-adjust: exact;
  display: inline-block;
  vertical-align: middle;
  background-origin: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  flex-shrink: 0;
  height: 1rem;
  width: 1rem;
  color: #2563eb;
  background-color: #fff;
  border-color: #737373;
  border-width: 1px;
  --tw-shadow: 0 0 #0000;
}

input:where([type='checkbox']) {
  border-radius: 0px;
}

input:where([type='radio']) {
  border-radius: 100%;
}

input:where([type='checkbox']):focus,input:where([type='radio']):focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
  --tw-ring-offset-width: 2px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #2563eb;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}

input:where([type='checkbox']):checked,input:where([type='radio']):checked {
  border-color: transparent;
  background-color: currentColor;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
}

input:where([type='checkbox']):checked {
  background-image: url("data:image/svg+xml,%3csvg viewBox=%270 0 16 16%27 fill=%27white%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z%27/%3e%3c/svg%3e");
}

@media (forced-colors: active)  {

  input:where([type='checkbox']):checked {
    -webkit-appearance: auto;
       -moz-appearance: auto;
            appearance: auto;
  }
}

input:where([type='radio']):checked {
  background-image: url("data:image/svg+xml,%3csvg viewBox=%270 0 16 16%27 fill=%27white%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3ccircle cx=%278%27 cy=%278%27 r=%273%27/%3e%3c/svg%3e");
}

@media (forced-colors: active)  {

  input:where([type='radio']):checked {
    -webkit-appearance: auto;
       -moz-appearance: auto;
            appearance: auto;
  }
}

input:where([type='checkbox']):checked:hover,input:where([type='checkbox']):checked:focus,input:where([type='radio']):checked:hover,input:where([type='radio']):checked:focus {
  border-color: transparent;
  background-color: currentColor;
}

input:where([type='checkbox']):indeterminate {
  background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 fill=%27none%27 viewBox=%270 0 16 16%27%3e%3cpath stroke=%27white%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%272%27 d=%27M4 8h8%27/%3e%3c/svg%3e");
  border-color: transparent;
  background-color: currentColor;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
}

@media (forced-colors: active)  {

  input:where([type='checkbox']):indeterminate {
    -webkit-appearance: auto;
       -moz-appearance: auto;
            appearance: auto;
  }
}

input:where([type='checkbox']):indeterminate:hover,input:where([type='checkbox']):indeterminate:focus {
  border-color: transparent;
  background-color: currentColor;
}

input:where([type='file']) {
  background: unset;
  border-color: inherit;
  border-width: 0;
  border-radius: 0;
  padding: 0;
  font-size: unset;
  line-height: inherit;
}

input:where([type='file']):focus {
  outline: 1px solid ButtonText;
  outline: 1px auto -webkit-focus-ring-color;
}
.\!container {
  width: 100% !important;
}
.container {
  width: 100%;
}
@media (min-width: 640px) {

  .\!container {
    max-width: 640px !important;
  }

  .container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {

  .\!container {
    max-width: 768px !important;
  }

  .container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {

  .\!container {
    max-width: 1024px !important;
  }

  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {

  .\!container {
    max-width: 1280px !important;
  }

  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {

  .\!container {
    max-width: 1536px !important;
  }

  .container {
    max-width: 1536px;
  }
}
.aspect-h-7 {
  --tw-aspect-h: 7;
}
.aspect-h-9 {
  --tw-aspect-h: 9;
}
.aspect-w-10 {
  position: relative;
  padding-bottom: calc(var(--tw-aspect-h) / var(--tw-aspect-w) * 100%);
  --tw-aspect-w: 10;
}
.aspect-w-10 > * {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.aspect-w-16 {
  position: relative;
  padding-bottom: calc(var(--tw-aspect-h) / var(--tw-aspect-w) * 100%);
  --tw-aspect-w: 16;
}
.aspect-w-16 > * {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.prose {
  color: var(--tw-prose-body);
  max-width: 65ch;
}
.prose :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-lead);
  font-size: 1.25em;
  line-height: 1.6;
  margin-top: 1.2em;
  margin-bottom: 1.2em;
}
.prose :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-links);
  text-decoration: underline;
  font-weight: 500;
}
.prose :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-bold);
  font-weight: 600;
}
.prose :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: decimal;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-inline-start: 1.625em;
}
.prose :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-alpha;
}
.prose :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-alpha;
}
.prose :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-alpha;
}
.prose :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-alpha;
}
.prose :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-roman;
}
.prose :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-roman;
}
.prose :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: upper-roman;
}
.prose :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: lower-roman;
}
.prose :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: decimal;
}
.prose :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  list-style-type: disc;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-inline-start: 1.625em;
}
.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
  font-weight: 400;
  color: var(--tw-prose-counters);
}
.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
  color: var(--tw-prose-bullets);
}
.prose :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  margin-top: 1.25em;
}
.prose :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-color: var(--tw-prose-hr);
  border-top-width: 1px;
  margin-top: 3em;
  margin-bottom: 3em;
}
.prose :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 500;
  font-style: italic;
  color: var(--tw-prose-quotes);
  border-inline-start-width: 0.25rem;
  border-inline-start-color: var(--tw-prose-quote-borders);
  quotes: "\201C""\201D""\2018""\2019";
  margin-top: 1.6em;
  margin-bottom: 1.6em;
  padding-inline-start: 1em;
}
.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
  content: open-quote;
}
.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
  content: close-quote;
}
.prose :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 800;
  font-size: 2.25em;
  margin-top: 0;
  margin-bottom: 0.8888889em;
  line-height: 1.1111111;
}
.prose :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 900;
  color: inherit;
}
.prose :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 700;
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  line-height: 1.3333333;
}
.prose :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 800;
  color: inherit;
}
.prose :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  font-size: 1.25em;
  margin-top: 1.6em;
  margin-bottom: 0.6em;
  line-height: 1.6;
}
.prose :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 700;
  color: inherit;
}
.prose :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
.prose :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 700;
  color: inherit;
}
.prose :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  display: block;
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-weight: 500;
  font-family: inherit;
  color: var(--tw-prose-kbd);
  box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows);
  font-size: 0.875em;
  border-radius: 0.3125rem;
  padding-top: 0.1875em;
  padding-inline-end: 0.375em;
  padding-bottom: 0.1875em;
  padding-inline-start: 0.375em;
}
.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-code);
  font-weight: 600;
  font-size: 0.875em;
}
.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
  content: "`";
}
.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
  content: "`";
}
.prose :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
  font-size: 0.875em;
}
.prose :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
  font-size: 0.9em;
}
.prose :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-pre-code);
  background-color: var(--tw-prose-pre-bg);
  overflow-x: auto;
  font-weight: 400;
  font-size: 0.875em;
  line-height: 1.7142857;
  margin-top: 1.7142857em;
  margin-bottom: 1.7142857em;
  border-radius: 0.375rem;
  padding-top: 0.8571429em;
  padding-inline-end: 1.1428571em;
  padding-bottom: 0.8571429em;
  padding-inline-start: 1.1428571em;
}
.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  background-color: transparent;
  border-width: 0;
  border-radius: 0;
  padding: 0;
  font-weight: inherit;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
}
.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
  content: none;
}
.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
  content: none;
}
.prose :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  width: 100%;
  table-layout: auto;
  margin-top: 2em;
  margin-bottom: 2em;
  font-size: 0.875em;
  line-height: 1.7142857;
}
.prose :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-bottom-width: 1px;
  border-bottom-color: var(--tw-prose-th-borders);
}
.prose :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  vertical-align: bottom;
  padding-inline-end: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-inline-start: 0.5714286em;
}
.prose :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-bottom-width: 1px;
  border-bottom-color: var(--tw-prose-td-borders);
}
.prose :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-bottom-width: 0;
}
.prose :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  vertical-align: baseline;
}
.prose :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  border-top-width: 1px;
  border-top-color: var(--tw-prose-th-borders);
}
.prose :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  vertical-align: top;
}
.prose :where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  text-align: start;
}
.prose :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  color: var(--tw-prose-captions);
  font-size: 0.875em;
  line-height: 1.4285714;
  margin-top: 0.8571429em;
}
.prose {
  --tw-prose-body: #374151;
  --tw-prose-headings: #111827;
  --tw-prose-lead: #4b5563;
  --tw-prose-links: #111827;
  --tw-prose-bold: #111827;
  --tw-prose-counters: #6b7280;
  --tw-prose-bullets: #d1d5db;
  --tw-prose-hr: #e5e7eb;
  --tw-prose-quotes: #111827;
  --tw-prose-quote-borders: #e5e7eb;
  --tw-prose-captions: #6b7280;
  --tw-prose-kbd: #111827;
  --tw-prose-kbd-shadows: rgb(17 24 39 / 10%);
  --tw-prose-code: #111827;
  --tw-prose-pre-code: #e5e7eb;
  --tw-prose-pre-bg: #1f2937;
  --tw-prose-th-borders: #d1d5db;
  --tw-prose-td-borders: #e5e7eb;
  --tw-prose-invert-body: #d1d5db;
  --tw-prose-invert-headings: #fff;
  --tw-prose-invert-lead: #9ca3af;
  --tw-prose-invert-links: #fff;
  --tw-prose-invert-bold: #fff;
  --tw-prose-invert-counters: #9ca3af;
  --tw-prose-invert-bullets: #4b5563;
  --tw-prose-invert-hr: #374151;
  --tw-prose-invert-quotes: #f3f4f6;
  --tw-prose-invert-quote-borders: #374151;
  --tw-prose-invert-captions: #9ca3af;
  --tw-prose-invert-kbd: #fff;
  --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);
  --tw-prose-invert-code: #fff;
  --tw-prose-invert-pre-code: #d1d5db;
  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
  --tw-prose-invert-th-borders: #4b5563;
  --tw-prose-invert-td-borders: #374151;
  font-size: 1rem;
  line-height: 1.75;
}
.prose :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0.375em;
}
.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0.375em;
}
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.5em;
  padding-inline-start: 1.625em;
}
.prose :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0;
}
.prose :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0;
}
.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-top: 0.5714286em;
  padding-inline-end: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-inline-start: 0.5714286em;
}
.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0;
}
.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0;
}
.prose :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 0;
}
.prose-base {
  font-size: 1rem;
  line-height: 1.75;
}
.prose-base :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose-base :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 1.25em;
  line-height: 1.6;
  margin-top: 1.2em;
  margin-bottom: 1.2em;
}
.prose-base :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.6em;
  margin-bottom: 1.6em;
  padding-inline-start: 1em;
}
.prose-base :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 2.25em;
  margin-top: 0;
  margin-bottom: 0.8888889em;
  line-height: 1.1111111;
}
.prose-base :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  line-height: 1.3333333;
}
.prose-base :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 1.25em;
  margin-top: 1.6em;
  margin-bottom: 0.6em;
  line-height: 1.6;
}
.prose-base :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
.prose-base :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose-base :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose-base :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose-base :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose-base :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
  border-radius: 0.3125rem;
  padding-top: 0.1875em;
  padding-inline-end: 0.375em;
  padding-bottom: 0.1875em;
  padding-inline-start: 0.375em;
}
.prose-base :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
}
.prose-base :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
}
.prose-base :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.9em;
}
.prose-base :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
  line-height: 1.7142857;
  margin-top: 1.7142857em;
  margin-bottom: 1.7142857em;
  border-radius: 0.375rem;
  padding-top: 0.8571429em;
  padding-inline-end: 1.1428571em;
  padding-bottom: 0.8571429em;
  padding-inline-start: 1.1428571em;
}
.prose-base :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-inline-start: 1.625em;
}
.prose-base :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-inline-start: 1.625em;
}
.prose-base :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.prose-base :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0.375em;
}
.prose-base :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0.375em;
}
.prose-base :where(.prose-base > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose-base :where(.prose-base > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose-base :where(.prose-base > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose-base :where(.prose-base > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose-base :where(.prose-base > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose-base :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose-base :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose-base :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose-base :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.5em;
  padding-inline-start: 1.625em;
}
.prose-base :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 3em;
  margin-bottom: 3em;
}
.prose-base :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-base :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-base :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-base :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-base :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
  line-height: 1.7142857;
}
.prose-base :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-inline-start: 0.5714286em;
}
.prose-base :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0;
}
.prose-base :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0;
}
.prose-base :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-top: 0.5714286em;
  padding-inline-end: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-inline-start: 0.5714286em;
}
.prose-base :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0;
}
.prose-base :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0;
}
.prose-base :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose-base :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose-base :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
  line-height: 1.4285714;
  margin-top: 0.8571429em;
}
.prose-base :where(.prose-base > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-base :where(.prose-base > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 0;
}
.prose-lg {
  font-size: 1.125rem;
  line-height: 1.7777778;
}
.prose-lg :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
  margin-bottom: 1.3333333em;
}
.prose-lg :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 1.2222222em;
  line-height: 1.4545455;
  margin-top: 1.0909091em;
  margin-bottom: 1.0909091em;
}
.prose-lg :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.6666667em;
  margin-bottom: 1.6666667em;
  padding-inline-start: 1em;
}
.prose-lg :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 2.6666667em;
  margin-top: 0;
  margin-bottom: 0.8333333em;
  line-height: 1;
}
.prose-lg :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 1.6666667em;
  margin-top: 1.8666667em;
  margin-bottom: 1.0666667em;
  line-height: 1.3333333;
}
.prose-lg :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 1.3333333em;
  margin-top: 1.6666667em;
  margin-bottom: 0.6666667em;
  line-height: 1.5;
}
.prose-lg :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.7777778em;
  margin-bottom: 0.4444444em;
  line-height: 1.5555556;
}
.prose-lg :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.7777778em;
  margin-bottom: 1.7777778em;
}
.prose-lg :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.7777778em;
  margin-bottom: 1.7777778em;
}
.prose-lg :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose-lg :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.7777778em;
  margin-bottom: 1.7777778em;
}
.prose-lg :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.8888889em;
  border-radius: 0.3125rem;
  padding-top: 0.2222222em;
  padding-inline-end: 0.4444444em;
  padding-bottom: 0.2222222em;
  padding-inline-start: 0.4444444em;
}
.prose-lg :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.8888889em;
}
.prose-lg :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.8666667em;
}
.prose-lg :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.875em;
}
.prose-lg :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.8888889em;
  line-height: 1.75;
  margin-top: 2em;
  margin-bottom: 2em;
  border-radius: 0.375rem;
  padding-top: 1em;
  padding-inline-end: 1.5em;
  padding-bottom: 1em;
  padding-inline-start: 1.5em;
}
.prose-lg :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
  margin-bottom: 1.3333333em;
  padding-inline-start: 1.5555556em;
}
.prose-lg :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
  margin-bottom: 1.3333333em;
  padding-inline-start: 1.5555556em;
}
.prose-lg :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.6666667em;
  margin-bottom: 0.6666667em;
}
.prose-lg :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0.4444444em;
}
.prose-lg :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0.4444444em;
}
.prose-lg :where(.prose-lg > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.8888889em;
  margin-bottom: 0.8888889em;
}
.prose-lg :where(.prose-lg > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
}
.prose-lg :where(.prose-lg > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.3333333em;
}
.prose-lg :where(.prose-lg > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
}
.prose-lg :where(.prose-lg > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 1.3333333em;
}
.prose-lg :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.8888889em;
  margin-bottom: 0.8888889em;
}
.prose-lg :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
  margin-bottom: 1.3333333em;
}
.prose-lg :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.3333333em;
}
.prose-lg :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0.6666667em;
  padding-inline-start: 1.5555556em;
}
.prose-lg :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 3.1111111em;
  margin-bottom: 3.1111111em;
}
.prose-lg :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-lg :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-lg :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-lg :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-lg :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.8888889em;
  line-height: 1.5;
}
.prose-lg :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0.75em;
  padding-bottom: 0.75em;
  padding-inline-start: 0.75em;
}
.prose-lg :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0;
}
.prose-lg :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0;
}
.prose-lg :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-top: 0.75em;
  padding-inline-end: 0.75em;
  padding-bottom: 0.75em;
  padding-inline-start: 0.75em;
}
.prose-lg :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-start: 0;
}
.prose-lg :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  padding-inline-end: 0;
}
.prose-lg :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 1.7777778em;
  margin-bottom: 1.7777778em;
}
.prose-lg :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose-lg :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  font-size: 0.8888889em;
  line-height: 1.5;
  margin-top: 1em;
}
.prose-lg :where(.prose-lg > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-top: 0;
}
.prose-lg :where(.prose-lg > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
  margin-bottom: 0;
}
.prose-stone {
  --tw-prose-body: #44403c;
  --tw-prose-headings: #1c1917;
  --tw-prose-lead: #57534e;
  --tw-prose-links: #1c1917;
  --tw-prose-bold: #1c1917;
  --tw-prose-counters: #78716c;
  --tw-prose-bullets: #d6d3d1;
  --tw-prose-hr: #e7e5e4;
  --tw-prose-quotes: #1c1917;
  --tw-prose-quote-borders: #e7e5e4;
  --tw-prose-captions: #78716c;
  --tw-prose-kbd: #1c1917;
  --tw-prose-kbd-shadows: rgb(28 25 23 / 10%);
  --tw-prose-code: #1c1917;
  --tw-prose-pre-code: #e7e5e4;
  --tw-prose-pre-bg: #292524;
  --tw-prose-th-borders: #d6d3d1;
  --tw-prose-td-borders: #e7e5e4;
  --tw-prose-invert-body: #d6d3d1;
  --tw-prose-invert-headings: #fff;
  --tw-prose-invert-lead: #a8a29e;
  --tw-prose-invert-links: #fff;
  --tw-prose-invert-bold: #fff;
  --tw-prose-invert-counters: #a8a29e;
  --tw-prose-invert-bullets: #57534e;
  --tw-prose-invert-hr: #44403c;
  --tw-prose-invert-quotes: #f5f5f4;
  --tw-prose-invert-quote-borders: #44403c;
  --tw-prose-invert-captions: #a8a29e;
  --tw-prose-invert-kbd: #fff;
  --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);
  --tw-prose-invert-code: #fff;
  --tw-prose-invert-pre-code: #d6d3d1;
  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
  --tw-prose-invert-th-borders: #57534e;
  --tw-prose-invert-td-borders: #44403c;
}
.text-overline-small {
  font-size: 0.625rem;
  line-height: 1.33;
  letter-spacing: 0.03em;
  font-weight: 600;
  text-transform: uppercase;
}
    * {
        -webkit-font-smoothing: antialiased;
    }
    .pdButtonStyle {
  display: flex;
  align-items: center;
  border-radius: 0.25rem;
  font-size: 0.813rem;
  font-weight: 500;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}
    .pdButtonStyle:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
    .sidepanel-slider {
        transform: translate3d(0, 0, 0);
        transition: transform 320ms cubic-bezier(0.32, 0.72, 0, 1);
        will-change: transform;
    }
    .sidepanel-slider[data-settings="true"] {
        transform: translate3d(-260px, 0, 0);
    }
    @media (prefers-reduced-motion: reduce) {
        .sidepanel-slider {
            transition: none;
        }
    }
    .primaryBtn {
  --tw-bg-opacity: 1;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
    .primaryBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(35 48 59 / var(--tw-bg-opacity, 1));
}
    .primaryBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
    .primaryBtn:active {
  --tw-bg-opacity: 1;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
    .primaryLightBtn {
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
    .primaryLightBtn:hover {
  background-color: rgb(191 213 252 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.9;
}
    .primaryLightBtn:focus {
  background-color: rgb(191 213 252 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.9;
}
    .secondaryBtn,
    .outlineBtn {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
    .secondaryBtn:hover,
    .outlineBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
    .secondaryBtn:focus,
    .outlineBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
    .tertiaryBtn {
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(38 38 38 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}
    .tertiaryBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
    .tertiaryBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
    .tertiaryBtn.active {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
    .tertiaryBtn.\!active {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
    .tertiaryBtn.floaterBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
    .tertiaryBtn.floaterBtn:focus {
  background-color: transparent;
}
    .tertiaryBtn.floaterBtn:active {
  background-color: transparent;
}
    .tertiaryBtn.floaterBtn.active {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1)) !important;
  --tw-text-opacity: 1 !important;
  color: rgb(10 10 10 / var(--tw-text-opacity, 1)) !important;
}
    .tertiaryBtn.floaterBtn.active:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1)) !important;
}
    .tertiaryBtn.floaterBtn.\!active {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1)) !important;
  --tw-text-opacity: 1 !important;
  color: rgb(10 10 10 / var(--tw-text-opacity, 1)) !important;
}
    .tertiaryBtn.floaterBtn.\!active:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1)) !important;
}
    .tertiaryDarkBtn {
  --tw-bg-opacity: 1;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(244 244 244 / var(--tw-text-opacity, 1));
}
    .tertiaryDarkBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
}
    .textPropertyPanel .tertiaryDarkBtn.active {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
    .tertiaryDarkBtn.active {
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.4;
}
    .textPropertyPanel .tertiaryDarkBtn.\!active {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
    .tertiaryDarkBtn.\!active {
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.4;
}
    .tertiaryBlueBtn {
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(38 38 38 / var(--tw-text-opacity, 1));
}
    .tertiaryBlueBtn:hover {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
    .tertiaryBlueBtn.active.bottomborder {
  border-radius: 0px;
}
    .tertiaryBlueBtn.\!active.bottomborder {
  border-radius: 0px;
}
    .tertiaryBlueHoverBtn {
  background-color: transparent;
  --tw-text-opacity: 1;
  color: rgb(38 38 38 / var(--tw-text-opacity, 1));
}
    .tertiaryBlueHoverBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1));
}
    .errorBtn {
  --tw-bg-opacity: 1;
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
    .errorBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}
    .errorBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}
    .errorLinkBtn {
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}
    .errorLinkBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}
    .criticalBtn {
  --tw-bg-opacity: 1;
  background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}
    .criticalBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));
}
    .criticalBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(254 202 202 / var(--tw-bg-opacity, 1));
}
    .pptBtn {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(208 68 35 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 243 240 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
    .pptBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(250 231 223 / var(--tw-bg-opacity, 1));
}
    .goldBtn i.proIcon::before {
  font-size: 1.125rem;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgb(251 190 40 / var(--tw-text-opacity, 1));
}
    .darkBtn {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(22 22 22 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(244 244 244 / var(--tw-text-opacity, 1));
}
    .darkBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
}
    .grayBtn {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
    .grayBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
    .grayBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
    .linkBtn {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
    .linkBtn:hover {
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
  --tw-text-opacity: 0.9;
}
    .linkBtn:focus {
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
  --tw-text-opacity: 0.9;
}
    .whiteShadowBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.125rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  font-size: 0.813rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}
    .whiteShadowBtn:hover {
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
  --tw-bg-opacity: 0.3;
}
    .whiteShadowBtn:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
    .accentBtn {
  border-width: 1px;
  border-color: transparent;
  --tw-bg-opacity: 1;
  background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
    .accentBtn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(126 34 206 / var(--tw-bg-opacity, 1));
}
    .accentBtn:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(126 34 206 / var(--tw-bg-opacity, 1));
}

    /* //gradient button */
    .bgGradientBtn {
  background-image: linear-gradient(274.01deg, #7732D3 0%, #2563EB 105.01%);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
    .bgGradientBtn2 {
  background-image: linear-gradient(275.68deg, #3A8EE6 0%, #C03AE7 100%);
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
    .textGradientBtn span,
    .textGradientBtn i::before {
  background-image: linear-gradient(274.01deg, #7732D3 0%, #2563EB 105.01%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-shadow: transparent 0px 0px 0px, rgb(0, 0, 0, 0) 0px 0px 0px !important;
}
    .textGradientBtn:hover {
        background: unset;
        --tw-bg-opacity: 1;
        background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1));
    }
    /* Gradient-fill a Phosphor SVG icon (e.g. Remix in the slide context menu) to
       match the gradient text. Relies on the <linearGradient id="ctxIconGradient"> def. */
    /* Fill-based icon shapes get a gradient fill (skips the transparent bg rect). */
    .ctxGradientIcon *:not([fill="none"]) {
        fill: url(#ctxIconGradient) !important;
    }
    /* Stroke-based icons (e.g. MagicWand = stroked lines, fill="none") gradient the
       stroke instead; :not(:first-child) leaves phosphor's 256×256 bg rect untouched. */
    .ctxGradientIcon [fill="none"]:not(:first-child) {
        stroke: url(#ctxIconGradient) !important;
    }
    .textGradientWithBorderBtn {
        background: linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255)) padding-box, linear-gradient(to right, #3a8ee6, #c03ae7) border-box;
        border-radius: 0.375rem;
        border-width: 2px;
        border-color: transparent;
    }
    .textGradientWithBorderBtn span,
    .textGradientWithBorderBtn i::before {
  background-image: linear-gradient(274.01deg, #7732D3 0%, #2563EB 105.01%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-shadow: transparent 0px 0px 0px, rgb(0, 0, 0, 0) 0px 0px 0px !important;
}
    @keyframes pinkGradient {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }

    .bgGradientBtn:hover {
        background: linear-gradient(274.01deg, #5c19b2 0%, #2563eb 105.01%);
    }
    .bgGradientBtn2:hover,
    .bgLightGradientBtn:hover {
        animation: gradient 2s ease infinite;
    }
    @keyframes gradient {
        0% {
            background-size: 100% 100%;
        }
        50% {
            background-position: 100% 50%;
            background-size: 150% 100%;
        }
        100% {
            background-size: 100% 100%;
        }
    }

    /* // button styles */
    .pdcBtnIcon {
  font-size: 1.25rem;
  line-height: 1rem;
}
    .small {
  height: 2rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 0.813rem;
}
    .medium {
  height: 2.25rem;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  font-size: 0.813rem;
}
    .large {
  height: 2.75rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
}
    .small.onlyicon {
  height: 2rem !important;
  width: 2rem !important;
  padding: 0px !important;
}
    .medium.onlyicon {
  height: 2.25rem !important;
  width: 2.25rem !important;
  padding: 0px !important;
}
    .large.onlyicon {
  height: 2.75rem !important;
  width: 2.75rem !important;
  padding: 0px !important;
}
    .extralarge.onlyicon {
  height: 3rem !important;
  width: 3rem !important;
  padding: 0px !important;
}
    .small.withiconlable {
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}
    .medium.withiconlable {
  padding-left: 10px !important;
  padding-right: 0.75rem !important;
}
    .large.withiconlable {
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}
    .extralarge.withiconlable {
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}
    .tooltipBtn .pdButtonToolTip {
  transition-duration: 300ms;
  transition-timing-function: linear;
}
    .tooltipBtn:hover .pdButtonToolTip {
  visibility: visible;
  opacity: 1;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
  transition-timing-function: linear;
}
    .onlyimage {
  height: 2rem;
  width: 2rem;
  justify-content: center;
  padding: 0px;
}
    /* Text property side panel: slider fill from bundled PDHSlider still uses brand orange */
    .textPropertyPanel .bg-app-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}

    /* //input range */
    input[type="range"] {
        -webkit-appearance: none;
        background: none;
    }
    input[type="range"]::-webkit-slider-runnable-track {
  height: 0.125rem;
  width: 100%;
  border-radius: 0.25rem;
  border-style: none;
  background-color: transparent;
}
    input[type="range"]::-webkit-slider-thumb {
        z-index: 1;
        -webkit-appearance: none;
        border: 2px solid;
        height: 0.75rem;
        width: 0.75rem;
        border-radius: 0.5rem;
        --tw-border-opacity: 1;
        border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    }
    input[type="range"]::-webkit-slider-thumb:hover {
        z-index: 1;
        -webkit-appearance: none;
        border: none;
        outline-style: solid;
        outline-width: 3px;
        outline-color: rgb(10 25 37 / 0.2);
        height: 0.75rem;
        width: 0.75rem;
        border-radius: 0.5rem;
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
    }
    input[type="range"]::-webkit-slider-thumb:focus {
        z-index: 1;
        -webkit-appearance: none;
        outline-style: solid;
        outline-width: 3px;
        outline-color: rgb(10 25 37 / 0.2);
        border: none;
        height: 1rem;
        width: 1rem;
        border-radius: 0.5rem;
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
    }
    input[type="range"]:focus {
        outline: none;
    }
    input[type="range"]::-moz-range-thumb {
  height: 0.75rem;
  width: 0.75rem;
  border-radius: 0.5rem;
  border-width: 2px;
  --tw-border-opacity: 1;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
    input[type="range"]::-moz-range-thumb:hover,
    input[type="range"]::-moz-range-thumb:active {
  --tw-border-opacity: 1;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
    input.slider-thumb:focus {
        top: 5px;
    }
    input[type="text"]:focus,
    textarea:focus {
        box-shadow: none;
    }

    @-moz-document url-prefix() {
        input.slider-thumb,
        input.slider-thumb:focus {
            top: 0 !important;
        }
    }

    .tagInput[contentEditable="true"]:empty:before,
    .pdcTextInput[contentEditable="true"]:empty:before,
    .pdcTextArea[contentEditable="true"]:empty:before,
    .tagInput[contentEditable="plaintext-only"]:empty:before,
    .pdcTextInputInlineFloater[contentEditable="true"]:empty:before {
        opacity: 0.4;
        content: attr(data-prompt);
    }

    .\!relative.absolute {
        position: absolute !important;
    }

    .relative.absolute {
        position: absolute !important;
    }

    .relative.\!absolute {
        position: absolute !important;
    }

    .center {
  align-items: center;
  text-align: center;
}
    .\!end {
  align-items: flex-end;
  text-align: right;
}
    .end {
  align-items: flex-end;
  text-align: right;
}
    .\!start {
  align-items: flex-start;
  text-align: left;
}
    .start {
  align-items: flex-start;
  text-align: left;
}

    /* Skeleton Loader */
    .\!skeletonLoader {
  border-radius: 0.375rem;
  --tw-bg-opacity: 1;
  background-color: rgb(236 236 236 / var(--tw-bg-opacity, 1));
  background-image: linear-gradient(110deg, #ececec 8%, #f4f4f4 18%, #ececec 33%);
}
    .skeletonLoader {
  border-radius: 0.375rem;
  --tw-bg-opacity: 1;
  background-color: rgb(236 236 236 / var(--tw-bg-opacity, 1));
  background-image: linear-gradient(110deg, #ececec 8%, #f4f4f4 18%, #ececec 33%);
}
    .\!skeletonLoader {
        background-size: 200% 100% !important;
        animation: 1.5s shine linear infinite !important;
    }
    .skeletonLoader {
        background-size: 200% 100%;
        animation: 1.5s shine linear infinite;
    }
    @keyframes shine {
        to {
            background-position-x: -200%;
        }
    }
    @keyframes shimmerSweep {
        0% {
            left: -40%;
        }
        100% {
            left: 100%;
        }
    }
    .animate-shimmerSweep {
        animation: 2s shimmerSweep ease-in-out infinite;
    }
    @keyframes textShimmer {
        0% { background-position: 100% 0; }
        100% { background-position: -100% 0; }
    }
    .animate-textShimmer {
        background: linear-gradient(90deg, #a3a3a3 0%, #a3a3a3 42%, #262626 50%, #a3a3a3 58%, #a3a3a3 100%);
        background-size: 220% 100%;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        animation: 2s textShimmer linear infinite;
    }

    /* Animated loading ellipsis.
       Loading headings end in "..." / "…". <LoadingText> strips those characters
       and renders three <AnimatedEllipsis> dots in their place, which travel up
       and down in sequence the way a chat typing indicator does.

       Geometry is matched to a real Inter period so the dots read as punctuation,
       not as a widget: measured at 24px, a period's ink is 0.132em across with a
       0.156em gap to the next and a 0.078em left side bearing. Everything is in em
       and coloured with currentColor, so one rule holds at every size and colour.

       Motion only — no opacity animation. At rest the three dots are a genuine
       ellipsis; the movement alone carries "still working", at a travel of just
       under one dot diameter so the line stays calm. */
    @keyframes ellipsisPulse {
        0%,
        70%,
        100% {
            transform: translateY(0);
        }
        35% {
            transform: translateY(-0.115em);
        }
    }
    .animated-ellipsis {
        display: inline-block;
        vertical-align: baseline;
        white-space: nowrap;
        /* A touch more than the period's own 0.078em left side bearing: round dots
           that move need slightly more air off the word than static punctuation. */
        margin-left: 0.14em;
        /* Keeps the dots from being pulled apart by a letter-spaced parent. */
        letter-spacing: normal;
    }
    .animated-ellipsis-dot {
        display: inline-block;
        vertical-align: baseline;
        width: 0.132em;
        height: 0.132em;
        border-radius: 50%;
        background-color: currentColor;
        animation: 1.2s ellipsisPulse ease-in-out infinite;
    }
    .animated-ellipsis-dot + .animated-ellipsis-dot {
        margin-left: 0.156em;
    }
    .animated-ellipsis-dot:nth-child(2) {
        animation-delay: 0.16s;
    }
    .animated-ellipsis-dot:nth-child(3) {
        animation-delay: 0.32s;
    }
    /* Frozen states settle into a plain, correctly-spaced ellipsis. */
    .animated-ellipsis-dot--paused,
    body.disable-shimmer .animated-ellipsis-dot {
        animation: none !important;
    }
    @media (prefers-reduced-motion: reduce) {
        .animated-ellipsis-dot {
            animation: none !important;
        }
    }

    /* Mobile shimmer kill-switch.
       Each infinite background-position animation (skeleton shine, shimmer sweep,
       text shimmer) promotes its element to its own GPU compositing layer that
       repaints every frame. On phones — especially iOS Safari / the WebView — the
       thumbnail panel alone renders dozens of these at once, which spikes memory
       and crashes the tab. We freeze them to a static placeholder on mobile while
       leaving the layout untouched.
       Two triggers, so coverage is orientation-independent:
       - body.disable-shimmer: added from JS via the UA-based isMobileBrowser check
         (EditorScreen / MobileApp), so it also catches iPhone landscape (>767px).
       - max-width media query: safety net for any mobile-width surface that does
         not set the body class. */
    body.disable-shimmer .skeletonLoader,
    body.disable-shimmer .animate-shimmerSweep,
    body.disable-shimmer .animate-textShimmer {
        animation: none !important;
    }
    body.disable-shimmer .\!skeletonLoader {
        animation: none !important;
    }
    @media (max-width: 767px) {
        .\!skeletonLoader {
            animation: none !important;
        }
        .skeletonLoader,
        .animate-shimmerSweep,
        .animate-textShimmer {
            animation: none !important;
        }
    }
    .scrollbar-hide::-webkit-scrollbar {
        display: none;
    }

    @keyframes TextFadeInRight {
        from {
            opacity: 0;
            transform: translateX(100%);
        }
        to {
            opacity: 1;
            transform: translateX(0);
        }
    }

    @keyframes TextFadeOutLeft {
        from {
            opacity: 1;
            transform: translateX(0);
        }
        to {
            opacity: 0;
            transform: translateX(-100%);
        }
    }

    /* Background Gradient Animation Keyframes */
    @keyframes moveHorizontal {
        0% {
            transform: translateX(-50%) translateY(-10%);
        }

        50% {
            transform: translateX(50%) translateY(10%);
        }

        100% {
            transform: translateX(-50%) translateY(-10%);
        }
    }

    @keyframes moveInCircle {
        0% {
            transform: rotate(0deg);
        }

        50% {
            transform: rotate(180deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    @keyframes moveVertical {
        0% {
            transform: translateY(-50%);
        }

        50% {
            transform: translateY(50%);
        }

        100% {
            transform: translateY(-50%);
        }
    }

    /* Background Gradient Animation Classes */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.not-sr-only {
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}
.\!pointer-events-none {
  pointer-events: none !important;
}
.pointer-events-none {
  pointer-events: none;
}
.pointer-events-auto {
  pointer-events: auto;
}
.\!visible {
  visibility: visible !important;
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.collapse {
  visibility: collapse;
}
.static {
  position: static;
}
.\!fixed {
  position: fixed !important;
}
.fixed {
  position: fixed;
}
.\!absolute {
  position: absolute !important;
}
.absolute {
  position: absolute;
}
.\!relative {
  position: relative !important;
}
.relative {
  position: relative;
}
.\!sticky {
  position: sticky !important;
}
.sticky {
  position: sticky;
}
.-inset-1 {
  inset: -0.25rem;
}
.inset-0 {
  inset: 0px;
}
.inset-3 {
  inset: 0.75rem;
}
.inset-\[-6px\] {
  inset: -6px;
}
.inset-\[10px\] {
  inset: 10px;
}
.inset-\[14px\] {
  inset: 14px;
}
.inset-\[22\.5px\] {
  inset: 22.5px;
}
.inset-\[34\%\] {
  inset: 34%;
}
.inset-x-0 {
  left: 0px;
  right: 0px;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.inset-y-\[22\.5px\] {
  top: 22.5px;
  bottom: 22.5px;
}
.\!-right-1 {
  right: -0.25rem !important;
}
.\!-right-7 {
  right: -1.75rem !important;
}
.\!bottom-0 {
  bottom: 0px !important;
}
.\!bottom-10 {
  bottom: 2.5rem !important;
}
.\!bottom-\[28px\] {
  bottom: 28px !important;
}
.\!bottom-\[unset\] {
  bottom: unset !important;
}
.\!left-0 {
  left: 0px !important;
}
.\!left-\[-0px\] {
  left: -0px !important;
}
.\!left-\[-146px\] {
  left: -146px !important;
}
.\!left-\[-24px\] {
  left: -24px !important;
}
.\!left-\[-33px\] {
  left: -33px !important;
}
.\!left-\[-60px\] {
  left: -60px !important;
}
.\!left-\[-74px\] {
  left: -74px !important;
}
.\!left-\[-80px\] {
  left: -80px !important;
}
.\!left-\[12px\] {
  left: 12px !important;
}
.\!right-0 {
  right: 0px !important;
}
.\!right-3 {
  right: 0.75rem !important;
}
.\!right-5 {
  right: 1.25rem !important;
}
.\!right-\[6px\] {
  right: 6px !important;
}
.\!top-0 {
  top: 0px !important;
}
.\!top-1 {
  top: 0.25rem !important;
}
.\!top-10 {
  top: 2.5rem !important;
}
.\!top-11 {
  top: 2.75rem !important;
}
.\!top-3 {
  top: 0.75rem !important;
}
.\!top-4 {
  top: 1rem !important;
}
.\!top-5 {
  top: 1.25rem !important;
}
.\!top-7 {
  top: 1.75rem !important;
}
.\!top-\[2px\] {
  top: 2px !important;
}
.\!top-\[34px\] {
  top: 34px !important;
}
.\!top-\[50\%\] {
  top: 50% !important;
}
.\!top-\[70px\] {
  top: 70px !important;
}
.\!top-\[72px\] {
  top: 72px !important;
}
.\!top-\[unset\] {
  top: unset !important;
}
.-bottom-1 {
  bottom: -0.25rem;
}
.-bottom-12 {
  bottom: -3rem;
}
.-bottom-6 {
  bottom: -1.5rem;
}
.-bottom-\[18px\] {
  bottom: -18px;
}
.-bottom-\[200vh\] {
  bottom: -200vh;
}
.-bottom-\[22px\] {
  bottom: -22px;
}
.-bottom-\[46px\] {
  bottom: -46px;
}
.-left-1 {
  left: -0.25rem;
}
.-left-2 {
  left: -0.5rem;
}
.-left-20 {
  left: -5rem;
}
.-left-6 {
  left: -1.5rem;
}
.-left-\[0\] {
  left: 0;
}
.-left-\[106px\] {
  left: -106px;
}
.-left-\[130px\] {
  left: -130px;
}
.-left-\[132px\] {
  left: -132px;
}
.-left-\[18px\] {
  left: -18px;
}
.-left-\[22px\] {
  left: -22px;
}
.-left-\[242px\] {
  left: -242px;
}
.-left-\[244px\] {
  left: -244px;
}
.-left-\[32px\] {
  left: -32px;
}
.-left-\[36px\] {
  left: -36px;
}
.-left-\[39px\] {
  left: -39px;
}
.-left-\[57px\] {
  left: -57px;
}
.-left-\[66px\] {
  left: -66px;
}
.-left-\[74px\] {
  left: -74px;
}
.-left-\[78px\] {
  left: -78px;
}
.-right-1 {
  right: -0.25rem;
}
.-right-1\.5 {
  right: -0.375rem;
}
.-right-10 {
  right: -2.5rem;
}
.-right-12 {
  right: -3rem;
}
.-right-16 {
  right: -4rem;
}
.-right-2 {
  right: -0.5rem;
}
.-right-4 {
  right: -1rem;
}
.-right-8 {
  right: -2rem;
}
.-right-9 {
  right: -2.25rem;
}
.-right-\[14px\] {
  right: -14px;
}
.-right-\[18px\] {
  right: -18px;
}
.-right-\[242px\] {
  right: -242px;
}
.-right-\[26px\] {
  right: -26px;
}
.-right-\[3px\] {
  right: -3px;
}
.-right-\[42px\] {
  right: -42px;
}
.-right-\[44px\] {
  right: -44px;
}
.-right-\[54px\] {
  right: -54px;
}
.-right-\[6px\] {
  right: -6px;
}
.-top-1 {
  top: -0.25rem;
}
.-top-1\.5 {
  top: -0.375rem;
}
.-top-10 {
  top: -2.5rem;
}
.-top-11 {
  top: -2.75rem;
}
.-top-14 {
  top: -3.5rem;
}
.-top-2 {
  top: -0.5rem;
}
.-top-2\.5 {
  top: -0.625rem;
}
.-top-20 {
  top: -5rem;
}
.-top-3 {
  top: -0.75rem;
}
.-top-4 {
  top: -1rem;
}
.-top-8 {
  top: -2rem;
}
.-top-\[-1px\] {
  top: 1px;
}
.-top-\[10px\] {
  top: -10px;
}
.-top-\[11px\] {
  top: -11px;
}
.-top-\[172px\] {
  top: -172px;
}
.-top-\[18px\] {
  top: -18px;
}
.-top-\[1px\] {
  top: -1px;
}
.-top-\[20px\] {
  top: -20px;
}
.-top-\[22px\] {
  top: -22px;
}
.-top-\[240px\] {
  top: -240px;
}
.-top-\[28px\] {
  top: -28px;
}
.-top-\[2px\] {
  top: -2px;
}
.-top-\[44px\] {
  top: -44px;
}
.-top-\[68px\] {
  top: -68px;
}
.-top-\[6px\] {
  top: -6px;
}
.-top-\[9px\] {
  top: -9px;
}
.bottom-0 {
  bottom: 0px;
}
.bottom-1 {
  bottom: 0.25rem;
}
.bottom-10 {
  bottom: 2.5rem;
}
.bottom-12 {
  bottom: 3rem;
}
.bottom-16 {
  bottom: 4rem;
}
.bottom-2 {
  bottom: 0.5rem;
}
.bottom-20 {
  bottom: 5rem;
}
.bottom-3 {
  bottom: 0.75rem;
}
.bottom-4 {
  bottom: 1rem;
}
.bottom-5 {
  bottom: 1.25rem;
}
.bottom-6 {
  bottom: 1.5rem;
}
.bottom-8 {
  bottom: 2rem;
}
.bottom-9 {
  bottom: 2.25rem;
}
.bottom-\[-1px\] {
  bottom: -1px;
}
.bottom-\[-2px\] {
  bottom: -2px;
}
.bottom-\[-320px\] {
  bottom: -320px;
}
.bottom-\[-3px\] {
  bottom: -3px;
}
.bottom-\[-40px\] {
  bottom: -40px;
}
.bottom-\[-42px\] {
  bottom: -42px;
}
.bottom-\[-72px\] {
  bottom: -72px;
}
.bottom-\[0\%\] {
  bottom: 0%;
}
.bottom-\[10px\] {
  bottom: 10px;
}
.bottom-\[11\.125px\] {
  bottom: 11.125px;
}
.bottom-\[11px\] {
  bottom: 11px;
}
.bottom-\[12px\] {
  bottom: 12px;
}
.bottom-\[240px\] {
  bottom: 240px;
}
.bottom-\[28px\] {
  bottom: 28px;
}
.bottom-\[2px\] {
  bottom: 2px;
}
.bottom-\[30px\] {
  bottom: 30px;
}
.bottom-\[40px\] {
  bottom: 40px;
}
.bottom-\[42px\] {
  bottom: 42px;
}
.bottom-\[44px\] {
  bottom: 44px;
}
.bottom-\[4px\] {
  bottom: 4px;
}
.bottom-\[50px\] {
  bottom: 50px;
}
.bottom-\[58px\] {
  bottom: 58px;
}
.bottom-\[64px\] {
  bottom: 64px;
}
.bottom-\[66px\] {
  bottom: 66px;
}
.bottom-\[68px\] {
  bottom: 68px;
}
.bottom-\[70px\] {
  bottom: 70px;
}
.bottom-\[88px\] {
  bottom: 88px;
}
.bottom-\[92px\] {
  bottom: 92px;
}
.bottom-\[calc\(100\%\+10px\)\] {
  bottom: calc(100% + 10px);
}
.bottom-full {
  bottom: 100%;
}
.left-0 {
  left: 0px;
}
.left-1 {
  left: 0.25rem;
}
.left-1\.5 {
  left: 0.375rem;
}
.left-1\/2 {
  left: 50%;
}
.left-14 {
  left: 3.5rem;
}
.left-16 {
  left: 4rem;
}
.left-2 {
  left: 0.5rem;
}
.left-2\.5 {
  left: 0.625rem;
}
.left-20 {
  left: 5rem;
}
.left-28 {
  left: 7rem;
}
.left-3 {
  left: 0.75rem;
}
.left-4 {
  left: 1rem;
}
.left-5 {
  left: 1.25rem;
}
.left-6 {
  left: 1.5rem;
}
.left-\[-100px\] {
  left: -100px;
}
.left-\[-13px\] {
  left: -13px;
}
.left-\[-15px\] {
  left: -15px;
}
.left-\[-160px\] {
  left: -160px;
}
.left-\[-1px\] {
  left: -1px;
}
.left-\[-20px\] {
  left: -20px;
}
.left-\[-220px\] {
  left: -220px;
}
.left-\[-240px\] {
  left: -240px;
}
.left-\[-280px\] {
  left: -280px;
}
.left-\[-2px\] {
  left: -2px;
}
.left-\[-60px\] {
  left: -60px;
}
.left-\[-6px\] {
  left: -6px;
}
.left-\[-850px\] {
  left: -850px;
}
.left-\[-9px\] {
  left: -9px;
}
.left-\[10\%\] {
  left: 10%;
}
.left-\[10\.25rem\] {
  left: 10.25rem;
}
.left-\[10px\] {
  left: 10px;
}
.left-\[116px\] {
  left: 116px;
}
.left-\[12px\] {
  left: 12px;
}
.left-\[13\.5px\] {
  left: 13.5px;
}
.left-\[13px\] {
  left: 13px;
}
.left-\[14px\] {
  left: 14px;
}
.left-\[15px\] {
  left: 15px;
}
.left-\[160px\] {
  left: 160px;
}
.left-\[164px\] {
  left: 164px;
}
.left-\[169px\] {
  left: 169px;
}
.left-\[16px\] {
  left: 16px;
}
.left-\[178px\] {
  left: 178px;
}
.left-\[184px\] {
  left: 184px;
}
.left-\[18px\] {
  left: 18px;
}
.left-\[19px\] {
  left: 19px;
}
.left-\[1px\] {
  left: 1px;
}
.left-\[240px\] {
  left: 240px;
}
.left-\[24px\] {
  left: 24px;
}
.left-\[2px\] {
  left: 2px;
}
.left-\[300px\] {
  left: 300px;
}
.left-\[30px\] {
  left: 30px;
}
.left-\[32px\] {
  left: 32px;
}
.left-\[3px\] {
  left: 3px;
}
.left-\[424px\] {
  left: 424px;
}
.left-\[42px\] {
  left: 42px;
}
.left-\[45\%\] {
  left: 45%;
}
.left-\[50\%\] {
  left: 50%;
}
.left-\[5px\] {
  left: 5px;
}
.left-\[64px\] {
  left: 64px;
}
.left-\[6px\] {
  left: 6px;
}
.left-\[98px\] {
  left: 98px;
}
.left-\[9px\] {
  left: 9px;
}
.left-\[calc\(-50\%\+190px\)\] {
  left: calc(-50% + 190px);
}
.left-\[calc\(100\%\)\] {
  left: calc(100%);
}
.left-\[calc\(50\%\+12px\)\] {
  left: calc(50% + 12px);
}
.left-\[calc\(50\%-614px\)\] {
  left: calc(50% - 614px);
}
.left-\[calc\(50\%_-_2px\)\] {
  left: calc(50% - 2px);
}
.left-\[unset\] {
  left: unset;
}
.left-full {
  left: 100%;
}
.right-0 {
  right: 0px;
}
.right-0\.5 {
  right: 0.125rem;
}
.right-1 {
  right: 0.25rem;
}
.right-1\/2 {
  right: 50%;
}
.right-10 {
  right: 2.5rem;
}
.right-16 {
  right: 4rem;
}
.right-2 {
  right: 0.5rem;
}
.right-2\.5 {
  right: 0.625rem;
}
.right-3 {
  right: 0.75rem;
}
.right-3\.5 {
  right: 0.875rem;
}
.right-4 {
  right: 1rem;
}
.right-5 {
  right: 1.25rem;
}
.right-6 {
  right: 1.5rem;
}
.right-7 {
  right: 1.75rem;
}
.right-\[-0\.2px\] {
  right: -0.2px;
}
.right-\[-1200px\] {
  right: -1200px;
}
.right-\[-1px\] {
  right: -1px;
}
.right-\[-220px\] {
  right: -220px;
}
.right-\[-28px\] {
  right: -28px;
}
.right-\[-32px\] {
  right: -32px;
}
.right-\[-36px\] {
  right: -36px;
}
.right-\[-38px\] {
  right: -38px;
}
.right-\[-6px\] {
  right: -6px;
}
.right-\[10\%\] {
  right: 10%;
}
.right-\[10px\] {
  right: 10px;
}
.right-\[12px\] {
  right: 12px;
}
.right-\[140px\] {
  right: 140px;
}
.right-\[14px\] {
  right: 14px;
}
.right-\[16px\] {
  right: 16px;
}
.right-\[18px\] {
  right: 18px;
}
.right-\[20px\] {
  right: 20px;
}
.right-\[22\.5px\] {
  right: 22.5px;
}
.right-\[22px\] {
  right: 22px;
}
.right-\[24px\] {
  right: 24px;
}
.right-\[27px\] {
  right: 27px;
}
.right-\[308px\] {
  right: 308px;
}
.right-\[30px\] {
  right: 30px;
}
.right-\[34px\] {
  right: 34px;
}
.right-\[35px\] {
  right: 35px;
}
.right-\[3px\] {
  right: 3px;
}
.right-\[4px\] {
  right: 4px;
}
.right-\[52px\] {
  right: 52px;
}
.right-\[5px\] {
  right: 5px;
}
.right-\[6px\] {
  right: 6px;
}
.right-\[7px\] {
  right: 7px;
}
.right-\[8px\] {
  right: 8px;
}
.right-\[92px\] {
  right: 92px;
}
.right-\[calc\(100\%\+10px\)\] {
  right: calc(100% + 10px);
}
.right-\[calc\(100\%\/2\)\] {
  right: calc(100% / 2);
}
.right-full {
  right: 100%;
}
.start-2 {
  inset-inline-start: 0.5rem;
}
.top-0 {
  top: 0px;
}
.top-0\.5 {
  top: 0.125rem;
}
.top-1 {
  top: 0.25rem;
}
.top-1\.5 {
  top: 0.375rem;
}
.top-1\/2 {
  top: 50%;
}
.top-10 {
  top: 2.5rem;
}
.top-11 {
  top: 2.75rem;
}
.top-12 {
  top: 3rem;
}
.top-14 {
  top: 3.5rem;
}
.top-2 {
  top: 0.5rem;
}
.top-2\.5 {
  top: 0.625rem;
}
.top-24 {
  top: 6rem;
}
.top-3 {
  top: 0.75rem;
}
.top-4 {
  top: 1rem;
}
.top-5 {
  top: 1.25rem;
}
.top-56 {
  top: 14rem;
}
.top-6 {
  top: 1.5rem;
}
.top-7 {
  top: 1.75rem;
}
.top-8 {
  top: 2rem;
}
.top-9 {
  top: 2.25rem;
}
.top-\[-106px\] {
  top: -106px;
}
.top-\[-120px\] {
  top: -120px;
}
.top-\[-124px\] {
  top: -124px;
}
.top-\[-140px\] {
  top: -140px;
}
.top-\[-14px\] {
  top: -14px;
}
.top-\[-160px\] {
  top: -160px;
}
.top-\[-16px\] {
  top: -16px;
}
.top-\[-18px\] {
  top: -18px;
}
.top-\[-1px\] {
  top: -1px;
}
.top-\[-200px\] {
  top: -200px;
}
.top-\[-240px\] {
  top: -240px;
}
.top-\[-260px\] {
  top: -260px;
}
.top-\[-280px\] {
  top: -280px;
}
.top-\[-2px\] {
  top: -2px;
}
.top-\[-30\%\] {
  top: -30%;
}
.top-\[-360px\] {
  top: -360px;
}
.top-\[-3px\] {
  top: -3px;
}
.top-\[-50\%\] {
  top: -50%;
}
.top-\[-5px\] {
  top: -5px;
}
.top-\[-60px\] {
  top: -60px;
}
.top-\[108px\] {
  top: 108px;
}
.top-\[10px\] {
  top: 10px;
}
.top-\[11px\] {
  top: 11px;
}
.top-\[12px\] {
  top: 12px;
}
.top-\[13\.5px\] {
  top: 13.5px;
}
.top-\[134px\] {
  top: 134px;
}
.top-\[138px\] {
  top: 138px;
}
.top-\[13px\] {
  top: 13px;
}
.top-\[148px\] {
  top: 148px;
}
.top-\[14px\] {
  top: 14px;
}
.top-\[15px\] {
  top: 15px;
}
.top-\[18\%\] {
  top: 18%;
}
.top-\[184px\] {
  top: 184px;
}
.top-\[18px\] {
  top: 18px;
}
.top-\[1px\] {
  top: 1px;
}
.top-\[204px\] {
  top: 204px;
}
.top-\[21px\] {
  top: 21px;
}
.top-\[22px\] {
  top: 22px;
}
.top-\[24px\] {
  top: 24px;
}
.top-\[25px\] {
  top: 25px;
}
.top-\[26px\] {
  top: 26px;
}
.top-\[28px\] {
  top: 28px;
}
.top-\[2px\] {
  top: 2px;
}
.top-\[30px\] {
  top: 30px;
}
.top-\[32px\] {
  top: 32px;
}
.top-\[33px\] {
  top: 33px;
}
.top-\[35\%\] {
  top: 35%;
}
.top-\[37px\] {
  top: 37px;
}
.top-\[38px\] {
  top: 38px;
}
.top-\[3px\] {
  top: 3px;
}
.top-\[40px\] {
  top: 40px;
}
.top-\[42px\] {
  top: 42px;
}
.top-\[44px\] {
  top: 44px;
}
.top-\[46px\] {
  top: 46px;
}
.top-\[48px\] {
  top: 48px;
}
.top-\[49px\] {
  top: 49px;
}
.top-\[4px\] {
  top: 4px;
}
.top-\[50\%\] {
  top: 50%;
}
.top-\[50px\] {
  top: 50px;
}
.top-\[52px\] {
  top: 52px;
}
.top-\[56\%\] {
  top: 56%;
}
.top-\[56px\] {
  top: 56px;
}
.top-\[57px\] {
  top: 57px;
}
.top-\[5px\] {
  top: 5px;
}
.top-\[60px\] {
  top: 60px;
}
.top-\[63px\] {
  top: 63px;
}
.top-\[65px\] {
  top: 65px;
}
.top-\[67px\] {
  top: 67px;
}
.top-\[68px\] {
  top: 68px;
}
.top-\[69px\] {
  top: 69px;
}
.top-\[6px\] {
  top: 6px;
}
.top-\[71px\] {
  top: 71px;
}
.top-\[7px\] {
  top: 7px;
}
.top-\[80px\] {
  top: 80px;
}
.top-\[86px\] {
  top: 86px;
}
.top-\[9px\] {
  top: 9px;
}
.top-\[calc\(100\%\+5px\)\] {
  top: calc(100% + 5px);
}
.top-\[calc\(100\%\+6px\)\] {
  top: calc(100% + 6px);
}
.top-\[calc\(100\%\+8px\)\] {
  top: calc(100% + 8px);
}
.top-\[calc\(57px\+40px\)\] {
  top: calc(57px + 40px);
}
.top-\[unset\] {
  top: unset;
}
.top-auto {
  top: auto;
}
.top-full {
  top: 100%;
}
.top-px {
  top: 1px;
}
.isolate {
  isolation: isolate;
}
.isolation-auto {
  isolation: auto;
}
.\!z-50 {
  z-index: 50 !important;
}
.\!z-\[11\] {
  z-index: 11 !important;
}
.\!z-\[60\] {
  z-index: 60 !important;
}
.\!z-\[99999\] {
  z-index: 99999 !important;
}
.\!z-\[999\] {
  z-index: 999 !important;
}
.\!z-\[n\] {
  z-index: n !important;
}
.z-0 {
  z-index: 0;
}
.z-10 {
  z-index: 10;
}
.z-20 {
  z-index: 20;
}
.z-30 {
  z-index: 30;
}
.z-40 {
  z-index: 40;
}
.z-50 {
  z-index: 50;
}
.z-\[-1\] {
  z-index: -1;
}
.z-\[0\] {
  z-index: 0;
}
.z-\[1000000\] {
  z-index: 1000000;
}
.z-\[1000002\] {
  z-index: 1000002;
}
.z-\[1000\] {
  z-index: 1000;
}
.z-\[10\] {
  z-index: 10;
}
.z-\[110\] {
  z-index: 110;
}
.z-\[1112\] {
  z-index: 1112;
}
.z-\[1113\] {
  z-index: 1113;
}
.z-\[119\] {
  z-index: 119;
}
.z-\[120\] {
  z-index: 120;
}
.z-\[12\] {
  z-index: 12;
}
.z-\[1\] {
  z-index: 1;
}
.z-\[1px\] {
  z-index: 1px;
}
.z-\[2\] {
  z-index: 2;
}
.z-\[3\] {
  z-index: 3;
}
.z-\[40\] {
  z-index: 40;
}
.z-\[41\] {
  z-index: 41;
}
.z-\[48\] {
  z-index: 48;
}
.z-\[49\] {
  z-index: 49;
}
.z-\[4\] {
  z-index: 4;
}
.z-\[50\] {
  z-index: 50;
}
.z-\[51\] {
  z-index: 51;
}
.z-\[5\] {
  z-index: 5;
}
.z-\[60\] {
  z-index: 60;
}
.z-\[70\] {
  z-index: 70;
}
.z-\[75\] {
  z-index: 75;
}
.z-\[80\] {
  z-index: 80;
}
.z-\[90\] {
  z-index: 90;
}
.z-\[990\] {
  z-index: 990;
}
.z-\[998\] {
  z-index: 998;
}
.z-\[9998\] {
  z-index: 9998;
}
.z-\[99999999\] {
  z-index: 99999999;
}
.z-\[9999999\] {
  z-index: 9999999;
}
.z-\[999999\] {
  z-index: 999999;
}
.z-\[99999\] {
  z-index: 99999;
}
.z-\[9999\] {
  z-index: 9999;
}
.z-\[999\] {
  z-index: 999;
}
.z-\[99\] {
  z-index: 99;
}
.z-\[9\] {
  z-index: 9;
}
.z-\[unset\] {
  z-index: unset;
}
.z-auto {
  z-index: auto;
}
.order-1 {
  order: 1;
}
.order-2 {
  order: 2;
}
.col-span-1 {
  grid-column: span 1 / span 1;
}
.col-span-10 {
  grid-column: span 10 / span 10;
}
.col-span-11 {
  grid-column: span 11 / span 11;
}
.col-span-12 {
  grid-column: span 12 / span 12;
}
.col-span-2 {
  grid-column: span 2 / span 2;
}
.col-span-3 {
  grid-column: span 3 / span 3;
}
.col-span-4 {
  grid-column: span 4 / span 4;
}
.col-span-5 {
  grid-column: span 5 / span 5;
}
.col-span-6 {
  grid-column: span 6 / span 6;
}
.col-span-7 {
  grid-column: span 7 / span 7;
}
.col-span-8 {
  grid-column: span 8 / span 8;
}
.col-span-9 {
  grid-column: span 9 / span 9;
}
.float-right {
  float: right;
}
.float-left {
  float: left;
}
.\!m-0 {
  margin: 0px !important;
}
.\!m-3 {
  margin: 0.75rem !important;
}
.\!m-auto {
  margin: auto !important;
}
.-m-1 {
  margin: -0.25rem;
}
.-m-\[1px\] {
  margin: -1px;
}
.m-0 {
  margin: 0px;
}
.m-0\.5 {
  margin: 0.125rem;
}
.m-1\.5 {
  margin: 0.375rem;
}
.m-2 {
  margin: 0.5rem;
}
.m-5 {
  margin: 1.25rem;
}
.m-\[5px\] {
  margin: 5px;
}
.m-auto {
  margin: auto;
}
.\!mx-\[6px\] {
  margin-left: 6px !important;
  margin-right: 6px !important;
}
.\!my-0 {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}
.-mx-0\.5 {
  margin-left: -0.125rem;
  margin-right: -0.125rem;
}
.-mx-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}
.-mx-2 {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}
.-mx-3 {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}
.-mx-4 {
  margin-left: -1rem;
  margin-right: -1rem;
}
.-mx-6 {
  margin-left: -1.5rem;
  margin-right: -1.5rem;
}
.-my-1 {
  margin-top: -0.25rem;
  margin-bottom: -0.25rem;
}
.-my-2 {
  margin-top: -0.5rem;
  margin-bottom: -0.5rem;
}
.-my-4 {
  margin-top: -1rem;
  margin-bottom: -1rem;
}
.mx-0 {
  margin-left: 0px;
  margin-right: 0px;
}
.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}
.mx-10 {
  margin-left: 2.5rem;
  margin-right: 2.5rem;
}
.mx-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.mx-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
.mx-4 {
  margin-left: 1rem;
  margin-right: 1rem;
}
.mx-5 {
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}
.mx-6 {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}
.mx-\[-1px\] {
  margin-left: -1px;
  margin-right: -1px;
}
.mx-\[10px\] {
  margin-left: 10px;
  margin-right: 10px;
}
.mx-\[11px\] {
  margin-left: 11px;
  margin-right: 11px;
}
.mx-\[14px\] {
  margin-left: 14px;
  margin-right: 14px;
}
.mx-\[16px\] {
  margin-left: 16px;
  margin-right: 16px;
}
.mx-\[1px\] {
  margin-left: 1px;
  margin-right: 1px;
}
.mx-\[2px\] {
  margin-left: 2px;
  margin-right: 2px;
}
.mx-\[3px\] {
  margin-left: 3px;
  margin-right: 3px;
}
.mx-\[4px\] {
  margin-left: 4px;
  margin-right: 4px;
}
.mx-\[5px\] {
  margin-left: 5px;
  margin-right: 5px;
}
.mx-\[6px\] {
  margin-left: 6px;
  margin-right: 6px;
}
.mx-\[8px\] {
  margin-left: 8px;
  margin-right: 8px;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.my-0 {
  margin-top: 0px;
  margin-bottom: 0px;
}
.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.my-1\.5 {
  margin-top: 0.375rem;
  margin-bottom: 0.375rem;
}
.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.my-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}
.my-6 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.my-\[10px\] {
  margin-top: 10px;
  margin-bottom: 10px;
}
.my-\[2px\] {
  margin-top: 2px;
  margin-bottom: 2px;
}
.my-\[5px\] {
  margin-top: 5px;
  margin-bottom: 5px;
}
.my-\[8px\] {
  margin-top: 8px;
  margin-bottom: 8px;
}
.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}
.\!-mb-\[72px\] {
  margin-bottom: -72px !important;
}
.\!-ml-2 {
  margin-left: -0.5rem !important;
}
.\!-mt-1 {
  margin-top: -0.25rem !important;
}
.\!-mt-3 {
  margin-top: -0.75rem !important;
}
.\!mb-0 {
  margin-bottom: 0px !important;
}
.\!mb-2 {
  margin-bottom: 0.5rem !important;
}
.\!mb-3 {
  margin-bottom: 0.75rem !important;
}
.\!mb-3\.5 {
  margin-bottom: 0.875rem !important;
}
.\!mb-4 {
  margin-bottom: 1rem !important;
}
.\!mb-5 {
  margin-bottom: 1.25rem !important;
}
.\!mb-7 {
  margin-bottom: 1.75rem !important;
}
.\!mb-\[10px\] {
  margin-bottom: 10px !important;
}
.\!mb-\[2px\] {
  margin-bottom: 2px !important;
}
.\!ml-0 {
  margin-left: 0px !important;
}
.\!ml-2 {
  margin-left: 0.5rem !important;
}
.\!ml-5 {
  margin-left: 1.25rem !important;
}
.\!ml-\[2px\] {
  margin-left: 2px !important;
}
.\!mr-0 {
  margin-right: 0px !important;
}
.\!mr-2 {
  margin-right: 0.5rem !important;
}
.\!mr-\[10px\] {
  margin-right: 10px !important;
}
.\!mr-\[2px\] {
  margin-right: 2px !important;
}
.\!mt-0 {
  margin-top: 0px !important;
}
.\!mt-1 {
  margin-top: 0.25rem !important;
}
.\!mt-2 {
  margin-top: 0.5rem !important;
}
.\!mt-3\.5 {
  margin-top: 0.875rem !important;
}
.\!mt-4 {
  margin-top: 1rem !important;
}
.\!mt-7 {
  margin-top: 1.75rem !important;
}
.\!mt-8 {
  margin-top: 2rem !important;
}
.\!mt-9 {
  margin-top: 2.25rem !important;
}
.\!mt-\[-14px\] {
  margin-top: -14px !important;
}
.\!mt-\[-5px\] {
  margin-top: -5px !important;
}
.\!mt-\[-7px\] {
  margin-top: -7px !important;
}
.\!mt-\[10px\] {
  margin-top: 10px !important;
}
.\!mt-\[2px\] {
  margin-top: 2px !important;
}
.\!mt-\[48px\] {
  margin-top: 48px !important;
}
.\!mt-\[5px\] {
  margin-top: 5px !important;
}
.\!mt-\[6px\] {
  margin-top: 6px !important;
}
.-mb-1 {
  margin-bottom: -0.25rem;
}
.-mb-2 {
  margin-bottom: -0.5rem;
}
.-mb-3 {
  margin-bottom: -0.75rem;
}
.-mb-4 {
  margin-bottom: -1rem;
}
.-mb-\[2px\] {
  margin-bottom: -2px;
}
.-mb-\[60px\] {
  margin-bottom: -60px;
}
.-mb-\[6px\] {
  margin-bottom: -6px;
}
.-mb-px {
  margin-bottom: -1px;
}
.-ml-1 {
  margin-left: -0.25rem;
}
.-ml-1\.5 {
  margin-left: -0.375rem;
}
.-ml-10 {
  margin-left: -2.5rem;
}
.-ml-2 {
  margin-left: -0.5rem;
}
.-ml-2\.5 {
  margin-left: -0.625rem;
}
.-ml-3 {
  margin-left: -0.75rem;
}
.-ml-5 {
  margin-left: -1.25rem;
}
.-ml-6 {
  margin-left: -1.5rem;
}
.-ml-7 {
  margin-left: -1.75rem;
}
.-ml-\[10px\] {
  margin-left: -10px;
}
.-ml-\[11px\] {
  margin-left: -11px;
}
.-ml-\[1px\] {
  margin-left: -1px;
}
.-ml-\[2px\] {
  margin-left: -2px;
}
.-ml-\[5px\] {
  margin-left: -5px;
}
.-ml-\[6px\] {
  margin-left: -6px;
}
.-ml-\[8px\] {
  margin-left: -8px;
}
.-mr-1 {
  margin-right: -0.25rem;
}
.-mr-2 {
  margin-right: -0.5rem;
}
.-mr-3 {
  margin-right: -0.75rem;
}
.-mr-\[2px\] {
  margin-right: -2px;
}
.-mt-0\.5 {
  margin-top: -0.125rem;
}
.-mt-1 {
  margin-top: -0.25rem;
}
.-mt-1\.5 {
  margin-top: -0.375rem;
}
.-mt-10 {
  margin-top: -2.5rem;
}
.-mt-2 {
  margin-top: -0.5rem;
}
.-mt-20 {
  margin-top: -5rem;
}
.-mt-3 {
  margin-top: -0.75rem;
}
.-mt-4 {
  margin-top: -1rem;
}
.-mt-5 {
  margin-top: -1.25rem;
}
.-mt-6 {
  margin-top: -1.5rem;
}
.-mt-\[1px\] {
  margin-top: -1px;
}
.-mt-\[2px\] {
  margin-top: -2px;
}
.-mt-\[32px\] {
  margin-top: -32px;
}
.-mt-\[44px\] {
  margin-top: -44px;
}
.-mt-\[4px\] {
  margin-top: -4px;
}
.-mt-\[6px\] {
  margin-top: -6px;
}
.mb-0 {
  margin-bottom: 0px;
}
.mb-0\.5 {
  margin-bottom: 0.125rem;
}
.mb-1 {
  margin-bottom: 0.25rem;
}
.mb-1\.5 {
  margin-bottom: 0.375rem;
}
.mb-10 {
  margin-bottom: 2.5rem;
}
.mb-12 {
  margin-bottom: 3rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.mb-2\.5 {
  margin-bottom: 0.625rem;
}
.mb-20 {
  margin-bottom: 5rem;
}
.mb-3 {
  margin-bottom: 0.75rem;
}
.mb-3\.5 {
  margin-bottom: 0.875rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mb-5 {
  margin-bottom: 1.25rem;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-7 {
  margin-bottom: 1.75rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.mb-9 {
  margin-bottom: 2.25rem;
}
.mb-\[-60px\] {
  margin-bottom: -60px;
}
.mb-\[-66px\] {
  margin-bottom: -66px;
}
.mb-\[10px\] {
  margin-bottom: 10px;
}
.mb-\[12px\] {
  margin-bottom: 12px;
}
.mb-\[14px\] {
  margin-bottom: 14px;
}
.mb-\[16px\] {
  margin-bottom: 16px;
}
.mb-\[17px\] {
  margin-bottom: 17px;
}
.mb-\[18px\] {
  margin-bottom: 18px;
}
.mb-\[1px\] {
  margin-bottom: 1px;
}
.mb-\[20px\] {
  margin-bottom: 20px;
}
.mb-\[21px\] {
  margin-bottom: 21px;
}
.mb-\[22px\] {
  margin-bottom: 22px;
}
.mb-\[24px\] {
  margin-bottom: 24px;
}
.mb-\[2px\] {
  margin-bottom: 2px;
}
.mb-\[30px\] {
  margin-bottom: 30px;
}
.mb-\[32px\] {
  margin-bottom: 32px;
}
.mb-\[3px\] {
  margin-bottom: 3px;
}
.mb-\[48px\] {
  margin-bottom: 48px;
}
.mb-\[4px\] {
  margin-bottom: 4px;
}
.mb-\[5px\] {
  margin-bottom: 5px;
}
.mb-\[60px\] {
  margin-bottom: 60px;
}
.mb-\[6px\] {
  margin-bottom: 6px;
}
.mb-\[84px\] {
  margin-bottom: 84px;
}
.mb-\[8px\] {
  margin-bottom: 8px;
}
.me-1 {
  margin-inline-end: 0.25rem;
}
.ml-0 {
  margin-left: 0px;
}
.ml-0\.5 {
  margin-left: 0.125rem;
}
.ml-1 {
  margin-left: 0.25rem;
}
.ml-10 {
  margin-left: 2.5rem;
}
.ml-11 {
  margin-left: 2.75rem;
}
.ml-2 {
  margin-left: 0.5rem;
}
.ml-2\.5 {
  margin-left: 0.625rem;
}
.ml-3 {
  margin-left: 0.75rem;
}
.ml-4 {
  margin-left: 1rem;
}
.ml-5 {
  margin-left: 1.25rem;
}
.ml-6 {
  margin-left: 1.5rem;
}
.ml-7 {
  margin-left: 1.75rem;
}
.ml-8 {
  margin-left: 2rem;
}
.ml-9 {
  margin-left: 2.25rem;
}
.ml-\[-12px\] {
  margin-left: -12px;
}
.ml-\[-15px\] {
  margin-left: -15px;
}
.ml-\[-1px\] {
  margin-left: -1px;
}
.ml-\[-2px\] {
  margin-left: -2px;
}
.ml-\[-7px\] {
  margin-left: -7px;
}
.ml-\[10px\] {
  margin-left: 10px;
}
.ml-\[11px\] {
  margin-left: 11px;
}
.ml-\[120px\] {
  margin-left: 120px;
}
.ml-\[12px\] {
  margin-left: 12px;
}
.ml-\[13px\] {
  margin-left: 13px;
}
.ml-\[14px\] {
  margin-left: 14px;
}
.ml-\[18px\] {
  margin-left: 18px;
}
.ml-\[1px\] {
  margin-left: 1px;
}
.ml-\[24px\] {
  margin-left: 24px;
}
.ml-\[25px\] {
  margin-left: 25px;
}
.ml-\[2px\] {
  margin-left: 2px;
}
.ml-\[30px\] {
  margin-left: 30px;
}
.ml-\[35px\] {
  margin-left: 35px;
}
.ml-\[3px\] {
  margin-left: 3px;
}
.ml-\[56px\] {
  margin-left: 56px;
}
.ml-\[5px\] {
  margin-left: 5px;
}
.ml-\[6px\] {
  margin-left: 6px;
}
.ml-\[8px\] {
  margin-left: 8px;
}
.ml-auto {
  margin-left: auto;
}
.ml-px {
  margin-left: 1px;
}
.mr-0 {
  margin-right: 0px;
}
.mr-1 {
  margin-right: 0.25rem;
}
.mr-1\.5 {
  margin-right: 0.375rem;
}
.mr-10 {
  margin-right: 2.5rem;
}
.mr-2 {
  margin-right: 0.5rem;
}
.mr-3 {
  margin-right: 0.75rem;
}
.mr-4 {
  margin-right: 1rem;
}
.mr-5 {
  margin-right: 1.25rem;
}
.mr-6 {
  margin-right: 1.5rem;
}
.mr-7 {
  margin-right: 1.75rem;
}
.mr-\[-10px\] {
  margin-right: -10px;
}
.mr-\[-6px\] {
  margin-right: -6px;
}
.mr-\[10px\] {
  margin-right: 10px;
}
.mr-\[14px\] {
  margin-right: 14px;
}
.mr-\[1px\] {
  margin-right: 1px;
}
.mr-\[20px\] {
  margin-right: 20px;
}
.mr-\[25px\] {
  margin-right: 25px;
}
.mr-\[2px\] {
  margin-right: 2px;
}
.mr-\[30px\] {
  margin-right: 30px;
}
.mr-\[45px\] {
  margin-right: 45px;
}
.mr-\[4px\] {
  margin-right: 4px;
}
.mr-\[5px\] {
  margin-right: 5px;
}
.mr-\[6px\] {
  margin-right: 6px;
}
.mr-auto {
  margin-right: auto;
}
.mr-px {
  margin-right: 1px;
}
.mt-0 {
  margin-top: 0px;
}
.mt-0\.5 {
  margin-top: 0.125rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-10 {
  margin-top: 2.5rem;
}
.mt-12 {
  margin-top: 3rem;
}
.mt-14 {
  margin-top: 3.5rem;
}
.mt-16 {
  margin-top: 4rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-2\.5 {
  margin-top: 0.625rem;
}
.mt-20 {
  margin-top: 5rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-3\.5 {
  margin-top: 0.875rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-40 {
  margin-top: 10rem;
}
.mt-5 {
  margin-top: 1.25rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.mt-64 {
  margin-top: 16rem;
}
.mt-7 {
  margin-top: 1.75rem;
}
.mt-8 {
  margin-top: 2rem;
}
.mt-9 {
  margin-top: 2.25rem;
}
.mt-\[-10px\] {
  margin-top: -10px;
}
.mt-\[-12px\] {
  margin-top: -12px;
}
.mt-\[-15px\] {
  margin-top: -15px;
}
.mt-\[-1px\] {
  margin-top: -1px;
}
.mt-\[-28px\] {
  margin-top: -28px;
}
.mt-\[-29px\] {
  margin-top: -29px;
}
.mt-\[-2px\] {
  margin-top: -2px;
}
.mt-\[-3px\] {
  margin-top: -3px;
}
.mt-\[-4px\] {
  margin-top: -4px;
}
.mt-\[-5px\] {
  margin-top: -5px;
}
.mt-\[-64px\] {
  margin-top: -64px;
}
.mt-\[-6px\] {
  margin-top: -6px;
}
.mt-\[-8px\] {
  margin-top: -8px;
}
.mt-\[0\] {
  margin-top: 0;
}
.mt-\[100px\] {
  margin-top: 100px;
}
.mt-\[10px\] {
  margin-top: 10px;
}
.mt-\[112px\] {
  margin-top: 112px;
}
.mt-\[12px\] {
  margin-top: 12px;
}
.mt-\[14px\] {
  margin-top: 14px;
}
.mt-\[15px\] {
  margin-top: 15px;
}
.mt-\[16px\] {
  margin-top: 16px;
}
.mt-\[18px\] {
  margin-top: 18px;
}
.mt-\[1px\] {
  margin-top: 1px;
}
.mt-\[20px\] {
  margin-top: 20px;
}
.mt-\[22px\] {
  margin-top: 22px;
}
.mt-\[23px\] {
  margin-top: 23px;
}
.mt-\[24px\] {
  margin-top: 24px;
}
.mt-\[25px\] {
  margin-top: 25px;
}
.mt-\[26px\] {
  margin-top: 26px;
}
.mt-\[27px\] {
  margin-top: 27px;
}
.mt-\[28px\] {
  margin-top: 28px;
}
.mt-\[29px\] {
  margin-top: 29px;
}
.mt-\[2px\] {
  margin-top: 2px;
}
.mt-\[30px\] {
  margin-top: 30px;
}
.mt-\[35px\] {
  margin-top: 35px;
}
.mt-\[38px\] {
  margin-top: 38px;
}
.mt-\[3px\] {
  margin-top: 3px;
}
.mt-\[4px\] {
  margin-top: 4px;
}
.mt-\[50px\] {
  margin-top: 50px;
}
.mt-\[52px\] {
  margin-top: 52px;
}
.mt-\[54px\] {
  margin-top: 54px;
}
.mt-\[56px\] {
  margin-top: 56px;
}
.mt-\[5px\] {
  margin-top: 5px;
}
.mt-\[60px\] {
  margin-top: 60px;
}
.mt-\[64px\] {
  margin-top: 64px;
}
.mt-\[68px\] {
  margin-top: 68px;
}
.mt-\[6px\] {
  margin-top: 6px;
}
.mt-\[7px\] {
  margin-top: 7px;
}
.mt-\[88px\] {
  margin-top: 88px;
}
.mt-\[8px\] {
  margin-top: 8px;
}
.mt-\[90px\] {
  margin-top: 90px;
}
.mt-auto {
  margin-top: auto;
}
.mt-px {
  margin-top: 1px;
}
.box-border {
  box-sizing: border-box;
}
.box-content {
  box-sizing: content-box;
}
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.line-clamp-4 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}
.\!block {
  display: block !important;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.\!flex {
  display: flex !important;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.\!table {
  display: table !important;
}
.table {
  display: table;
}
.inline-table {
  display: inline-table;
}
.table-caption {
  display: table-caption;
}
.table-cell {
  display: table-cell;
}
.table-column {
  display: table-column;
}
.table-column-group {
  display: table-column-group;
}
.table-footer-group {
  display: table-footer-group;
}
.table-header-group {
  display: table-header-group;
}
.table-row-group {
  display: table-row-group;
}
.table-row {
  display: table-row;
}
.flow-root {
  display: flow-root;
}
.grid {
  display: grid;
}
.inline-grid {
  display: inline-grid;
}
.contents {
  display: contents;
}
.list-item {
  display: list-item;
}
.\!hidden {
  display: none !important;
}
.hidden {
  display: none;
}
.\!size-4 {
  width: 1rem !important;
  height: 1rem !important;
}
.\!size-7 {
  width: 1.75rem !important;
  height: 1.75rem !important;
}
.size-1 {
  width: 0.25rem;
  height: 0.25rem;
}
.size-10 {
  width: 2.5rem;
  height: 2.5rem;
}
.size-11 {
  width: 2.75rem;
  height: 2.75rem;
}
.size-12 {
  width: 3rem;
  height: 3rem;
}
.size-2 {
  width: 0.5rem;
  height: 0.5rem;
}
.size-24 {
  width: 6rem;
  height: 6rem;
}
.size-3\.5 {
  width: 0.875rem;
  height: 0.875rem;
}
.size-4 {
  width: 1rem;
  height: 1rem;
}
.size-5 {
  width: 1.25rem;
  height: 1.25rem;
}
.size-7 {
  width: 1.75rem;
  height: 1.75rem;
}
.size-8 {
  width: 2rem;
  height: 2rem;
}
.size-9 {
  width: 2.25rem;
  height: 2.25rem;
}
.size-\[10px\] {
  width: 10px;
  height: 10px;
}
.size-\[200px\] {
  width: 200px;
  height: 200px;
}
.size-\[20px\] {
  width: 20px;
  height: 20px;
}
.size-\[24\.75px\] {
  width: 24.75px;
  height: 24.75px;
}
.size-\[24px\] {
  width: 24px;
  height: 24px;
}
.size-\[36px\] {
  width: 36px;
  height: 36px;
}
.size-\[62\%\] {
  width: 62%;
  height: 62%;
}
.size-\[88px\] {
  width: 88px;
  height: 88px;
}
.size-fit {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.size-full {
  width: 100%;
  height: 100%;
}
.\!h-10 {
  height: 2.5rem !important;
}
.\!h-11 {
  height: 2.75rem !important;
}
.\!h-12 {
  height: 3rem !important;
}
.\!h-2 {
  height: 0.5rem !important;
}
.\!h-4 {
  height: 1rem !important;
}
.\!h-5 {
  height: 1.25rem !important;
}
.\!h-6 {
  height: 1.5rem !important;
}
.\!h-7 {
  height: 1.75rem !important;
}
.\!h-8 {
  height: 2rem !important;
}
.\!h-9 {
  height: 2.25rem !important;
}
.\!h-\[100px\] {
  height: 100px !important;
}
.\!h-\[10px\] {
  height: 10px !important;
}
.\!h-\[140px\] {
  height: 140px !important;
}
.\!h-\[16px\] {
  height: 16px !important;
}
.\!h-\[170px\] {
  height: 170px !important;
}
.\!h-\[18px\] {
  height: 18px !important;
}
.\!h-\[22px\] {
  height: 22px !important;
}
.\!h-\[26px\] {
  height: 26px !important;
}
.\!h-\[28px\] {
  height: 28px !important;
}
.\!h-\[300px\] {
  height: 300px !important;
}
.\!h-\[30px\] {
  height: 30px !important;
}
.\!h-\[366px\] {
  height: 366px !important;
}
.\!h-\[36px\] {
  height: 36px !important;
}
.\!h-\[48px\] {
  height: 48px !important;
}
.\!h-\[52px\] {
  height: 52px !important;
}
.\!h-\[68px\] {
  height: 68px !important;
}
.\!h-\[calc\(100\%-58px\)\] {
  height: calc(100% - 58px) !important;
}
.\!h-\[var\(--slideHeight\)\] {
  height: var(--slideHeight) !important;
}
.\!h-\[var\(--slideWidth\)\] {
  height: var(--slideWidth) !important;
}
.\!h-auto {
  height: auto !important;
}
.\!h-fit {
  height: -moz-fit-content !important;
  height: fit-content !important;
}
.\!h-full {
  height: 100% !important;
}
.h-0 {
  height: 0px;
}
.h-0\.5 {
  height: 0.125rem;
}
.h-1 {
  height: 0.25rem;
}
.h-1\.5 {
  height: 0.375rem;
}
.h-1\/2 {
  height: 50%;
}
.h-10 {
  height: 2.5rem;
}
.h-11 {
  height: 2.75rem;
}
.h-12 {
  height: 3rem;
}
.h-14 {
  height: 3.5rem;
}
.h-16 {
  height: 4rem;
}
.h-2 {
  height: 0.5rem;
}
.h-2\.5 {
  height: 0.625rem;
}
.h-20 {
  height: 5rem;
}
.h-24 {
  height: 6rem;
}
.h-28 {
  height: 7rem;
}
.h-3 {
  height: 0.75rem;
}
.h-3\.5 {
  height: 0.875rem;
}
.h-32 {
  height: 8rem;
}
.h-4 {
  height: 1rem;
}
.h-40 {
  height: 10rem;
}
.h-44 {
  height: 11rem;
}
.h-5 {
  height: 1.25rem;
}
.h-6 {
  height: 1.5rem;
}
.h-60 {
  height: 15rem;
}
.h-64 {
  height: 16rem;
}
.h-7 {
  height: 1.75rem;
}
.h-8 {
  height: 2rem;
}
.h-9 {
  height: 2.25rem;
}
.h-96 {
  height: 24rem;
}
.h-\[0\.875em\] {
  height: 0.875em;
}
.h-\[100px\] {
  height: 100px;
}
.h-\[106px\] {
  height: 106px;
}
.h-\[108px\] {
  height: 108px;
}
.h-\[10px\] {
  height: 10px;
}
.h-\[110px\] {
  height: 110px;
}
.h-\[112px\] {
  height: 112px;
}
.h-\[120px\] {
  height: 120px;
}
.h-\[122px\] {
  height: 122px;
}
.h-\[126px\] {
  height: 126px;
}
.h-\[128px\] {
  height: 128px;
}
.h-\[129px\] {
  height: 129px;
}
.h-\[12px\] {
  height: 12px;
}
.h-\[130px\] {
  height: 130px;
}
.h-\[132px\] {
  height: 132px;
}
.h-\[134px\] {
  height: 134px;
}
.h-\[135px\] {
  height: 135px;
}
.h-\[136px\] {
  height: 136px;
}
.h-\[140px\] {
  height: 140px;
}
.h-\[144px\] {
  height: 144px;
}
.h-\[148px\] {
  height: 148px;
}
.h-\[14px\] {
  height: 14px;
}
.h-\[150px\] {
  height: 150px;
}
.h-\[152px\] {
  height: 152px;
}
.h-\[153px\] {
  height: 153px;
}
.h-\[156px\] {
  height: 156px;
}
.h-\[160px\] {
  height: 160px;
}
.h-\[162px\] {
  height: 162px;
}
.h-\[164px\] {
  height: 164px;
}
.h-\[166px\] {
  height: 166px;
}
.h-\[168px\] {
  height: 168px;
}
.h-\[16px\] {
  height: 16px;
}
.h-\[170px\] {
  height: 170px;
}
.h-\[172px\] {
  height: 172px;
}
.h-\[173px\] {
  height: 173px;
}
.h-\[174px\] {
  height: 174px;
}
.h-\[176px\] {
  height: 176px;
}
.h-\[180px\] {
  height: 180px;
}
.h-\[185px\] {
  height: 185px;
}
.h-\[18px\] {
  height: 18px;
}
.h-\[192px\] {
  height: 192px;
}
.h-\[19px\] {
  height: 19px;
}
.h-\[1px\] {
  height: 1px;
}
.h-\[200px\] {
  height: 200px;
}
.h-\[206px\] {
  height: 206px;
}
.h-\[20px\] {
  height: 20px;
}
.h-\[212px\] {
  height: 212px;
}
.h-\[214px\] {
  height: 214px;
}
.h-\[220px\] {
  height: 220px;
}
.h-\[221px\] {
  height: 221px;
}
.h-\[222px\] {
  height: 222px;
}
.h-\[22px\] {
  height: 22px;
}
.h-\[230px\] {
  height: 230px;
}
.h-\[232px\] {
  height: 232px;
}
.h-\[238px\] {
  height: 238px;
}
.h-\[239px\] {
  height: 239px;
}
.h-\[24px\] {
  height: 24px;
}
.h-\[250px\] {
  height: 250px;
}
.h-\[25px\] {
  height: 25px;
}
.h-\[26px\] {
  height: 26px;
}
.h-\[28\%\] {
  height: 28%;
}
.h-\[28\.625px\] {
  height: 28.625px;
}
.h-\[288px\] {
  height: 288px;
}
.h-\[28px\] {
  height: 28px;
}
.h-\[29\.333px\] {
  height: 29.333px;
}
.h-\[290px\] {
  height: 290px;
}
.h-\[2px\] {
  height: 2px;
}
.h-\[300px\] {
  height: 300px;
}
.h-\[30px\] {
  height: 30px;
}
.h-\[31px\] {
  height: 31px;
}
.h-\[320px\] {
  height: 320px;
}
.h-\[32px\] {
  height: 32px;
}
.h-\[33px\] {
  height: 33px;
}
.h-\[340px\] {
  height: 340px;
}
.h-\[34px\] {
  height: 34px;
}
.h-\[350px\] {
  height: 350px;
}
.h-\[35px\] {
  height: 35px;
}
.h-\[360px\] {
  height: 360px;
}
.h-\[36px\] {
  height: 36px;
}
.h-\[370px\] {
  height: 370px;
}
.h-\[38px\] {
  height: 38px;
}
.h-\[3px\] {
  height: 3px;
}
.h-\[400px\] {
  height: 400px;
}
.h-\[40px\] {
  height: 40px;
}
.h-\[428px\] {
  height: 428px;
}
.h-\[42px\] {
  height: 42px;
}
.h-\[440px\] {
  height: 440px;
}
.h-\[44px\] {
  height: 44px;
}
.h-\[458px\] {
  height: 458px;
}
.h-\[46px\] {
  height: 46px;
}
.h-\[480px\] {
  height: 480px;
}
.h-\[48px\] {
  height: 48px;
}
.h-\[4px\] {
  height: 4px;
}
.h-\[500px\] {
  height: 500px;
}
.h-\[50px\] {
  height: 50px;
}
.h-\[512px\] {
  height: 512px;
}
.h-\[52px\] {
  height: 52px;
}
.h-\[540px\] {
  height: 540px;
}
.h-\[54px\] {
  height: 54px;
}
.h-\[56px\] {
  height: 56px;
}
.h-\[570px\] {
  height: 570px;
}
.h-\[572px\] {
  height: 572px;
}
.h-\[58px\] {
  height: 58px;
}
.h-\[600px\] {
  height: 600px;
}
.h-\[60px\] {
  height: 60px;
}
.h-\[61px\] {
  height: 61px;
}
.h-\[62px\] {
  height: 62px;
}
.h-\[63px\] {
  height: 63px;
}
.h-\[64px\] {
  height: 64px;
}
.h-\[66px\] {
  height: 66px;
}
.h-\[68px\] {
  height: 68px;
}
.h-\[6px\] {
  height: 6px;
}
.h-\[70px\] {
  height: 70px;
}
.h-\[71px\] {
  height: 71px;
}
.h-\[720px\] {
  height: 720px;
}
.h-\[72px\] {
  height: 72px;
}
.h-\[75px\] {
  height: 75px;
}
.h-\[76px\] {
  height: 76px;
}
.h-\[78px\] {
  height: 78px;
}
.h-\[80\%\] {
  height: 80%;
}
.h-\[80px\] {
  height: 80px;
}
.h-\[80vh\] {
  height: 80vh;
}
.h-\[84px\] {
  height: 84px;
}
.h-\[87px\] {
  height: 87px;
}
.h-\[88px\] {
  height: 88px;
}
.h-\[90px\] {
  height: 90px;
}
.h-\[92px\] {
  height: 92px;
}
.h-\[94px\] {
  height: 94px;
}
.h-\[calc\(100\%\)\] {
  height: calc(100%);
}
.h-\[calc\(100\%\+160px\)\] {
  height: calc(100% + 160px);
}
.h-\[calc\(100\%\+16px\)\] {
  height: calc(100% + 16px);
}
.h-\[calc\(100\%-0px\)\] {
  height: calc(100% - 0px);
}
.h-\[calc\(100\%-100px\)\] {
  height: calc(100% - 100px);
}
.h-\[calc\(100\%-106px\)\] {
  height: calc(100% - 106px);
}
.h-\[calc\(100\%-108px\)\] {
  height: calc(100% - 108px);
}
.h-\[calc\(100\%-10px\)\] {
  height: calc(100% - 10px);
}
.h-\[calc\(100\%-112px\)\] {
  height: calc(100% - 112px);
}
.h-\[calc\(100\%-113px\)\] {
  height: calc(100% - 113px);
}
.h-\[calc\(100\%-120px\)\] {
  height: calc(100% - 120px);
}
.h-\[calc\(100\%-128px\)\] {
  height: calc(100% - 128px);
}
.h-\[calc\(100\%-135px\)\] {
  height: calc(100% - 135px);
}
.h-\[calc\(100\%-148px\)\] {
  height: calc(100% - 148px);
}
.h-\[calc\(100\%-16px\)\] {
  height: calc(100% - 16px);
}
.h-\[calc\(100\%-16px\+36px\)\] {
  height: calc(100% - 16px + 36px);
}
.h-\[calc\(100\%-180px\)\] {
  height: calc(100% - 180px);
}
.h-\[calc\(100\%-190px\)\] {
  height: calc(100% - 190px);
}
.h-\[calc\(100\%-22px\)\] {
  height: calc(100% - 22px);
}
.h-\[calc\(100\%-23px\)\] {
  height: calc(100% - 23px);
}
.h-\[calc\(100\%-2px\)\] {
  height: calc(100% - 2px);
}
.h-\[calc\(100\%-32px-12px-12px\)\] {
  height: calc(100% - 32px - 12px - 12px);
}
.h-\[calc\(100\%-40px\)\] {
  height: calc(100% - 40px);
}
.h-\[calc\(100\%-44px\)\] {
  height: calc(100% - 44px);
}
.h-\[calc\(100\%-46px-65px\)\] {
  height: calc(100% - 46px - 65px);
}
.h-\[calc\(100\%-48px\)\] {
  height: calc(100% - 48px);
}
.h-\[calc\(100\%-52px\)\] {
  height: calc(100% - 52px);
}
.h-\[calc\(100\%-56px\)\] {
  height: calc(100% - 56px);
}
.h-\[calc\(100\%-57px\)\] {
  height: calc(100% - 57px);
}
.h-\[calc\(100\%-57px-40px\)\] {
  height: calc(100% - 57px - 40px);
}
.h-\[calc\(100\%-58px\)\] {
  height: calc(100% - 58px);
}
.h-\[calc\(100\%-60px\)\] {
  height: calc(100% - 60px);
}
.h-\[calc\(100\%-64px\)\] {
  height: calc(100% - 64px);
}
.h-\[calc\(100\%-65px\)\] {
  height: calc(100% - 65px);
}
.h-\[calc\(100\%-68px\)\] {
  height: calc(100% - 68px);
}
.h-\[calc\(100\%-78px\)\] {
  height: calc(100% - 78px);
}
.h-\[calc\(100\%-80px\)\] {
  height: calc(100% - 80px);
}
.h-\[calc\(100\%-85px\)\] {
  height: calc(100% - 85px);
}
.h-\[calc\(100\%-8px\)\] {
  height: calc(100% - 8px);
}
.h-\[calc\(100\%-92px-40px\)\] {
  height: calc(100% - 92px - 40px);
}
.h-\[calc\(100\%-96px\)\] {
  height: calc(100% - 96px);
}
.h-\[calc\(100vh\)\] {
  height: calc(100vh);
}
.h-\[calc\(100vh-10px-20px-56px\)\] {
  height: calc(100vh - 10px - 20px - 56px);
}
.h-\[calc\(100vh-186px\)\] {
  height: calc(100vh - 186px);
}
.h-\[calc\(100vh-302px\)\] {
  height: calc(100vh - 302px);
}
.h-\[calc\(100vh-346px-48px\)\] {
  height: calc(100vh - 346px - 48px);
}
.h-\[calc\(100vh-40px\)\] {
  height: calc(100vh - 40px);
}
.h-\[calc\(100vh-48px-32px-56px\)\] {
  height: calc(100vh - 48px - 32px - 56px);
}
.h-\[calc\(100vh-50px-80px\)\] {
  height: calc(100vh - 50px - 80px);
}
.h-\[calc\(100vh-56px\)\] {
  height: calc(100vh - 56px);
}
.h-\[calc\(100vh-56px-20px\)\] {
  height: calc(100vh - 56px - 20px);
}
.h-\[calc\(100vh-56px-40px\)\] {
  height: calc(100vh - 56px - 40px);
}
.h-\[calc\(100vh-56px-60px-48px-28px\)\] {
  height: calc(100vh - 56px - 60px - 48px - 28px);
}
.h-\[calc\(100vh-58px\)\] {
  height: calc(100vh - 58px);
}
.h-\[calc\(100vh-58px-48px-36px\)\] {
  height: calc(100vh - 58px - 48px - 36px);
}
.h-\[calc\(100vh-65px\)\] {
  height: calc(100vh - 65px);
}
.h-\[calc\(100vh-69px\)\] {
  height: calc(100vh - 69px);
}
.h-\[calc\(100vh-80px\)\] {
  height: calc(100vh - 80px);
}
.h-\[calc\(100vh-90px\)\] {
  height: calc(100vh - 90px);
}
.h-\[calc\(100vh-92px-48px-24px\)\] {
  height: calc(100vh - 92px - 48px - 24px);
}
.h-\[inherit\] {
  height: inherit;
}
.h-auto {
  height: auto;
}
.h-fit {
  height: -moz-fit-content;
  height: fit-content;
}
.h-full {
  height: 100%;
}
.h-px {
  height: 1px;
}
.h-screen {
  height: 100vh;
}
.\!max-h-\[252px\] {
  max-height: 252px !important;
}
.\!max-h-\[254px\] {
  max-height: 254px !important;
}
.\!max-h-\[272px\] {
  max-height: 272px !important;
}
.\!max-h-\[304px\] {
  max-height: 304px !important;
}
.\!max-h-\[336px\] {
  max-height: 336px !important;
}
.\!max-h-\[50vh\] {
  max-height: 50vh !important;
}
.max-h-0 {
  max-height: 0px;
}
.max-h-12 {
  max-height: 3rem;
}
.max-h-14 {
  max-height: 3.5rem;
}
.max-h-16 {
  max-height: 4rem;
}
.max-h-40 {
  max-height: 10rem;
}
.max-h-48 {
  max-height: 12rem;
}
.max-h-56 {
  max-height: 14rem;
}
.max-h-60 {
  max-height: 15rem;
}
.max-h-64 {
  max-height: 16rem;
}
.max-h-72 {
  max-height: 18rem;
}
.max-h-80 {
  max-height: 20rem;
}
.max-h-96 {
  max-height: 24rem;
}
.max-h-\[100\%\] {
  max-height: 100%;
}
.max-h-\[100px\] {
  max-height: 100px;
}
.max-h-\[100svh\] {
  max-height: 100svh;
}
.max-h-\[100vh-68px\] {
  max-height: 100vh-68px;
}
.max-h-\[100vh\] {
  max-height: 100vh;
}
.max-h-\[1204px\] {
  max-height: 1204px;
}
.max-h-\[120px\] {
  max-height: 120px;
}
.max-h-\[134px\] {
  max-height: 134px;
}
.max-h-\[140px\] {
  max-height: 140px;
}
.max-h-\[144px\] {
  max-height: 144px;
}
.max-h-\[156px\] {
  max-height: 156px;
}
.max-h-\[160px\] {
  max-height: 160px;
}
.max-h-\[164px\] {
  max-height: 164px;
}
.max-h-\[16px\] {
  max-height: 16px;
}
.max-h-\[180px\] {
  max-height: 180px;
}
.max-h-\[18px\] {
  max-height: 18px;
}
.max-h-\[190px\] {
  max-height: 190px;
}
.max-h-\[200px\] {
  max-height: 200px;
}
.max-h-\[20px\] {
  max-height: 20px;
}
.max-h-\[220px\] {
  max-height: 220px;
}
.max-h-\[226px\] {
  max-height: 226px;
}
.max-h-\[22px\] {
  max-height: 22px;
}
.max-h-\[234px\] {
  max-height: 234px;
}
.max-h-\[240px\] {
  max-height: 240px;
}
.max-h-\[242px\] {
  max-height: 242px;
}
.max-h-\[244px\] {
  max-height: 244px;
}
.max-h-\[248px\] {
  max-height: 248px;
}
.max-h-\[24px\] {
  max-height: 24px;
}
.max-h-\[252px\] {
  max-height: 252px;
}
.max-h-\[256px\] {
  max-height: 256px;
}
.max-h-\[258px\] {
  max-height: 258px;
}
.max-h-\[260px\] {
  max-height: 260px;
}
.max-h-\[264px\] {
  max-height: 264px;
}
.max-h-\[280px\] {
  max-height: 280px;
}
.max-h-\[28px\] {
  max-height: 28px;
}
.max-h-\[28vh\] {
  max-height: 28vh;
}
.max-h-\[290px\] {
  max-height: 290px;
}
.max-h-\[292px\] {
  max-height: 292px;
}
.max-h-\[300px\] {
  max-height: 300px;
}
.max-h-\[320px\] {
  max-height: 320px;
}
.max-h-\[326px\] {
  max-height: 326px;
}
.max-h-\[32px\] {
  max-height: 32px;
}
.max-h-\[330px\] {
  max-height: 330px;
}
.max-h-\[350px\] {
  max-height: 350px;
}
.max-h-\[364px\] {
  max-height: 364px;
}
.max-h-\[372px\] {
  max-height: 372px;
}
.max-h-\[380px\] {
  max-height: 380px;
}
.max-h-\[400px\] {
  max-height: 400px;
}
.max-h-\[408px\] {
  max-height: 408px;
}
.max-h-\[40px\] {
  max-height: 40px;
}
.max-h-\[430px\] {
  max-height: 430px;
}
.max-h-\[44px\] {
  max-height: 44px;
}
.max-h-\[46px\] {
  max-height: 46px;
}
.max-h-\[500px\] {
  max-height: 500px;
}
.max-h-\[50vh\] {
  max-height: 50vh;
}
.max-h-\[550px\] {
  max-height: 550px;
}
.max-h-\[572px\] {
  max-height: 572px;
}
.max-h-\[580px\] {
  max-height: 580px;
}
.max-h-\[592px\] {
  max-height: 592px;
}
.max-h-\[594px\] {
  max-height: 594px;
}
.max-h-\[600px\] {
  max-height: 600px;
}
.max-h-\[606px\] {
  max-height: 606px;
}
.max-h-\[608px\] {
  max-height: 608px;
}
.max-h-\[60vh\] {
  max-height: 60vh;
}
.max-h-\[627px\] {
  max-height: 627px;
}
.max-h-\[64px\] {
  max-height: 64px;
}
.max-h-\[68px\] {
  max-height: 68px;
}
.max-h-\[70vh\] {
  max-height: 70vh;
}
.max-h-\[720px\] {
  max-height: 720px;
}
.max-h-\[72px\] {
  max-height: 72px;
}
.max-h-\[800px\] {
  max-height: 800px;
}
.max-h-\[80px\] {
  max-height: 80px;
}
.max-h-\[80vh\] {
  max-height: 80vh;
}
.max-h-\[82vh\] {
  max-height: 82vh;
}
.max-h-\[85svh\] {
  max-height: 85svh;
}
.max-h-\[86vh\] {
  max-height: 86vh;
}
.max-h-\[90vh\] {
  max-height: 90vh;
}
.max-h-\[95svh\] {
  max-height: 95svh;
}
.max-h-\[calc\(100\%-140px\)\] {
  max-height: calc(100% - 140px);
}
.max-h-\[calc\(100\%-148px\)\] {
  max-height: calc(100% - 148px);
}
.max-h-\[calc\(100\%-48px-92px\)\] {
  max-height: calc(100% - 48px - 92px);
}
.max-h-\[calc\(100\%-56px\)\] {
  max-height: calc(100% - 56px);
}
.max-h-\[calc\(100\%-64px\)\] {
  max-height: calc(100% - 64px);
}
.max-h-\[calc\(100\%-64px-122px\)\] {
  max-height: calc(100% - 64px - 122px);
}
.max-h-\[calc\(100svh\)\] {
  max-height: calc(100svh);
}
.max-h-\[calc\(100svh-118px\)\] {
  max-height: calc(100svh - 118px);
}
.max-h-\[calc\(100svh-40px\)\] {
  max-height: calc(100svh - 40px);
}
.max-h-\[calc\(100svh-56px\)\] {
  max-height: calc(100svh - 56px);
}
.max-h-\[calc\(100svh-56px-40px\)\] {
  max-height: calc(100svh - 56px - 40px);
}
.max-h-\[calc\(100svh-98px-40px\)\] {
  max-height: calc(100svh - 98px - 40px);
}
.max-h-\[calc\(100vh-120px\)\] {
  max-height: calc(100vh - 120px);
}
.max-h-\[calc\(100vh-200px\)\] {
  max-height: calc(100vh - 200px);
}
.max-h-\[calc\(100vh-240px\)\] {
  max-height: calc(100vh - 240px);
}
.max-h-\[calc\(100vh-280px\)\] {
  max-height: calc(100vh - 280px);
}
.max-h-\[calc\(100vh-32px\)\] {
  max-height: calc(100vh - 32px);
}
.max-h-\[calc\(100vh-40px\)\] {
  max-height: calc(100vh - 40px);
}
.max-h-\[calc\(100vh-48px\)\] {
  max-height: calc(100vh - 48px);
}
.max-h-\[calc\(100vh-56px\)\] {
  max-height: calc(100vh - 56px);
}
.max-h-\[calc\(100vh-58px\)\] {
  max-height: calc(100vh - 58px);
}
.max-h-\[min\(50vh\2c 440px\)\] {
  max-height: min(50vh, 440px);
}
.max-h-full {
  max-height: 100%;
}
.\!min-h-9 {
  min-height: 2.25rem !important;
}
.\!min-h-\[160px\] {
  min-height: 160px !important;
}
.\!min-h-\[28px\] {
  min-height: 28px !important;
}
.\!min-h-\[40px\] {
  min-height: 40px !important;
}
.\!min-h-\[44px\] {
  min-height: 44px !important;
}
.\!min-h-\[48px\] {
  min-height: 48px !important;
}
.\!min-h-\[80px\] {
  min-height: 80px !important;
}
.\!min-h-\[unset\] {
  min-height: unset !important;
}
.min-h-0 {
  min-height: 0px;
}
.min-h-10 {
  min-height: 2.5rem;
}
.min-h-11 {
  min-height: 2.75rem;
}
.min-h-5 {
  min-height: 1.25rem;
}
.min-h-6 {
  min-height: 1.5rem;
}
.min-h-7 {
  min-height: 1.75rem;
}
.min-h-9 {
  min-height: 2.25rem;
}
.min-h-\[100\%\] {
  min-height: 100%;
}
.min-h-\[100px\] {
  min-height: 100px;
}
.min-h-\[100svh\] {
  min-height: 100svh;
}
.min-h-\[100vh\] {
  min-height: 100vh;
}
.min-h-\[104px\] {
  min-height: 104px;
}
.min-h-\[105px\] {
  min-height: 105px;
}
.min-h-\[108px\] {
  min-height: 108px;
}
.min-h-\[120px\] {
  min-height: 120px;
}
.min-h-\[124px\] {
  min-height: 124px;
}
.min-h-\[128px\] {
  min-height: 128px;
}
.min-h-\[130px\] {
  min-height: 130px;
}
.min-h-\[136px\] {
  min-height: 136px;
}
.min-h-\[138px\] {
  min-height: 138px;
}
.min-h-\[140px\] {
  min-height: 140px;
}
.min-h-\[142px\] {
  min-height: 142px;
}
.min-h-\[148px\] {
  min-height: 148px;
}
.min-h-\[150px\] {
  min-height: 150px;
}
.min-h-\[160px\] {
  min-height: 160px;
}
.min-h-\[164px\] {
  min-height: 164px;
}
.min-h-\[168px\] {
  min-height: 168px;
}
.min-h-\[173px\] {
  min-height: 173px;
}
.min-h-\[188px\] {
  min-height: 188px;
}
.min-h-\[190px\] {
  min-height: 190px;
}
.min-h-\[1px\] {
  min-height: 1px;
}
.min-h-\[200px\] {
  min-height: 200px;
}
.min-h-\[206px\] {
  min-height: 206px;
}
.min-h-\[20px\] {
  min-height: 20px;
}
.min-h-\[220px\] {
  min-height: 220px;
}
.min-h-\[226px\] {
  min-height: 226px;
}
.min-h-\[240px\] {
  min-height: 240px;
}
.min-h-\[248px\] {
  min-height: 248px;
}
.min-h-\[24px\] {
  min-height: 24px;
}
.min-h-\[26px\] {
  min-height: 26px;
}
.min-h-\[280px\] {
  min-height: 280px;
}
.min-h-\[286px\] {
  min-height: 286px;
}
.min-h-\[28px\] {
  min-height: 28px;
}
.min-h-\[300px\] {
  min-height: 300px;
}
.min-h-\[30px\] {
  min-height: 30px;
}
.min-h-\[312px\] {
  min-height: 312px;
}
.min-h-\[320px\] {
  min-height: 320px;
}
.min-h-\[32px\] {
  min-height: 32px;
}
.min-h-\[344px\] {
  min-height: 344px;
}
.min-h-\[34px\] {
  min-height: 34px;
}
.min-h-\[36px\] {
  min-height: 36px;
}
.min-h-\[380px\] {
  min-height: 380px;
}
.min-h-\[38px\] {
  min-height: 38px;
}
.min-h-\[400px\] {
  min-height: 400px;
}
.min-h-\[40px\] {
  min-height: 40px;
}
.min-h-\[415px\] {
  min-height: 415px;
}
.min-h-\[420px\] {
  min-height: 420px;
}
.min-h-\[446px\] {
  min-height: 446px;
}
.min-h-\[44px\] {
  min-height: 44px;
}
.min-h-\[46px\] {
  min-height: 46px;
}
.min-h-\[48px\] {
  min-height: 48px;
}
.min-h-\[500px\] {
  min-height: 500px;
}
.min-h-\[50px\] {
  min-height: 50px;
}
.min-h-\[520px\] {
  min-height: 520px;
}
.min-h-\[52px\] {
  min-height: 52px;
}
.min-h-\[544px\] {
  min-height: 544px;
}
.min-h-\[56px\] {
  min-height: 56px;
}
.min-h-\[58px\] {
  min-height: 58px;
}
.min-h-\[600px\] {
  min-height: 600px;
}
.min-h-\[60px\] {
  min-height: 60px;
}
.min-h-\[63px\] {
  min-height: 63px;
}
.min-h-\[64px\] {
  min-height: 64px;
}
.min-h-\[66px\] {
  min-height: 66px;
}
.min-h-\[68px\] {
  min-height: 68px;
}
.min-h-\[6px\] {
  min-height: 6px;
}
.min-h-\[72px\] {
  min-height: 72px;
}
.min-h-\[74px\] {
  min-height: 74px;
}
.min-h-\[80px\] {
  min-height: 80px;
}
.min-h-\[82px\] {
  min-height: 82px;
}
.min-h-\[88px\] {
  min-height: 88px;
}
.min-h-\[90px\] {
  min-height: 90px;
}
.min-h-\[92px\] {
  min-height: 92px;
}
.min-h-\[\<n\>px\] {
  min-height: <n>px;
}
.min-h-\[calc\(100\%-16px\+36px\)\] {
  min-height: calc(100% - 16px + 36px);
}
.min-h-\[calc\(100vh-100px\)\] {
  min-height: calc(100vh - 100px);
}
.min-h-\[calc\(100vh-156px-32px\)\] {
  min-height: calc(100vh - 156px - 32px);
}
.min-h-\[calc\(100vh-16px\)\] {
  min-height: calc(100vh - 16px);
}
.min-h-\[calc\(100vh-40px\)\] {
  min-height: calc(100vh - 40px);
}
.min-h-\[min\(572px\2c calc\(100vh-40px\)\)\] {
  min-height: min(572px, calc(100vh - 40px));
}
.min-h-fit {
  min-height: -moz-fit-content;
  min-height: fit-content;
}
.min-h-full {
  min-height: 100%;
}
.min-h-min {
  min-height: -moz-min-content;
  min-height: min-content;
}
.min-h-px {
  min-height: 1px;
}
.min-h-screen {
  min-height: 100vh;
}
.\!w-1\/2 {
  width: 50% !important;
}
.\!w-10 {
  width: 2.5rem !important;
}
.\!w-11 {
  width: 2.75rem !important;
}
.\!w-12 {
  width: 3rem !important;
}
.\!w-2 {
  width: 0.5rem !important;
}
.\!w-3 {
  width: 0.75rem !important;
}
.\!w-4 {
  width: 1rem !important;
}
.\!w-5 {
  width: 1.25rem !important;
}
.\!w-6 {
  width: 1.5rem !important;
}
.\!w-7 {
  width: 1.75rem !important;
}
.\!w-8 {
  width: 2rem !important;
}
.\!w-9 {
  width: 2.25rem !important;
}
.\!w-\[100px\] {
  width: 100px !important;
}
.\!w-\[102px\] {
  width: 102px !important;
}
.\!w-\[16px\] {
  width: 16px !important;
}
.\!w-\[18px\] {
  width: 18px !important;
}
.\!w-\[200px\] {
  width: 200px !important;
}
.\!w-\[212px\] {
  width: 212px !important;
}
.\!w-\[216px\] {
  width: 216px !important;
}
.\!w-\[220px\] {
  width: 220px !important;
}
.\!w-\[224px\] {
  width: 224px !important;
}
.\!w-\[228px\] {
  width: 228px !important;
}
.\!w-\[232px\] {
  width: 232px !important;
}
.\!w-\[240px\] {
  width: 240px !important;
}
.\!w-\[244px\] {
  width: 244px !important;
}
.\!w-\[248px\] {
  width: 248px !important;
}
.\!w-\[256px\] {
  width: 256px !important;
}
.\!w-\[26px\] {
  width: 26px !important;
}
.\!w-\[28px\] {
  width: 28px !important;
}
.\!w-\[300px\] {
  width: 300px !important;
}
.\!w-\[320px\] {
  width: 320px !important;
}
.\!w-\[360px\] {
  width: 360px !important;
}
.\!w-\[366px\] {
  width: 366px !important;
}
.\!w-\[48px\] {
  width: 48px !important;
}
.\!w-\[68px\] {
  width: 68px !important;
}
.\!w-\[calc\(100\%-34px-34px-8px\)\] {
  width: calc(100% - 34px - 34px - 8px) !important;
}
.\!w-\[var\(--slideWidth\)\] {
  width: var(--slideWidth) !important;
}
.\!w-auto {
  width: auto !important;
}
.\!w-full {
  width: 100% !important;
}
.w-0 {
  width: 0px;
}
.w-0\.5 {
  width: 0.125rem;
}
.w-1 {
  width: 0.25rem;
}
.w-1\.5 {
  width: 0.375rem;
}
.w-1\/2 {
  width: 50%;
}
.w-1\/3 {
  width: 33.333333%;
}
.w-10 {
  width: 2.5rem;
}
.w-11 {
  width: 2.75rem;
}
.w-12 {
  width: 3rem;
}
.w-14 {
  width: 3.5rem;
}
.w-16 {
  width: 4rem;
}
.w-2 {
  width: 0.5rem;
}
.w-2\.5 {
  width: 0.625rem;
}
.w-2\/3 {
  width: 66.666667%;
}
.w-20 {
  width: 5rem;
}
.w-24 {
  width: 6rem;
}
.w-28 {
  width: 7rem;
}
.w-3 {
  width: 0.75rem;
}
.w-3\.5 {
  width: 0.875rem;
}
.w-3\/4 {
  width: 75%;
}
.w-3\/5 {
  width: 60%;
}
.w-32 {
  width: 8rem;
}
.w-4 {
  width: 1rem;
}
.w-40 {
  width: 10rem;
}
.w-44 {
  width: 11rem;
}
.w-48 {
  width: 12rem;
}
.w-5 {
  width: 1.25rem;
}
.w-56 {
  width: 14rem;
}
.w-6 {
  width: 1.5rem;
}
.w-60 {
  width: 15rem;
}
.w-64 {
  width: 16rem;
}
.w-7 {
  width: 1.75rem;
}
.w-72 {
  width: 18rem;
}
.w-8 {
  width: 2rem;
}
.w-80 {
  width: 20rem;
}
.w-9 {
  width: 2.25rem;
}
.w-\[0px\] {
  width: 0px;
}
.w-\[1\.5px\] {
  width: 1.5px;
}
.w-\[100px\] {
  width: 100px;
}
.w-\[102px\] {
  width: 102px;
}
.w-\[106px\] {
  width: 106px;
}
.w-\[10px\] {
  width: 10px;
}
.w-\[110px\] {
  width: 110px;
}
.w-\[112px\] {
  width: 112px;
}
.w-\[116px\] {
  width: 116px;
}
.w-\[117px\] {
  width: 117px;
}
.w-\[120px\] {
  width: 120px;
}
.w-\[122px\] {
  width: 122px;
}
.w-\[124px\] {
  width: 124px;
}
.w-\[1280px\] {
  width: 1280px;
}
.w-\[128px\] {
  width: 128px;
}
.w-\[12px\] {
  width: 12px;
}
.w-\[130px\] {
  width: 130px;
}
.w-\[134px\] {
  width: 134px;
}
.w-\[135px\] {
  width: 135px;
}
.w-\[140px\] {
  width: 140px;
}
.w-\[141px\] {
  width: 141px;
}
.w-\[142px\] {
  width: 142px;
}
.w-\[148px\] {
  width: 148px;
}
.w-\[14px\] {
  width: 14px;
}
.w-\[150px\] {
  width: 150px;
}
.w-\[152px\] {
  width: 152px;
}
.w-\[153px\] {
  width: 153px;
}
.w-\[160px\] {
  width: 160px;
}
.w-\[165px\] {
  width: 165px;
}
.w-\[168px\] {
  width: 168px;
}
.w-\[16px\] {
  width: 16px;
}
.w-\[170px\] {
  width: 170px;
}
.w-\[172px\] {
  width: 172px;
}
.w-\[174px\] {
  width: 174px;
}
.w-\[175px\] {
  width: 175px;
}
.w-\[178px\] {
  width: 178px;
}
.w-\[17px\] {
  width: 17px;
}
.w-\[18\.5px\] {
  width: 18.5px;
}
.w-\[180px\] {
  width: 180px;
}
.w-\[184px\] {
  width: 184px;
}
.w-\[185px\] {
  width: 185px;
}
.w-\[186px\] {
  width: 186px;
}
.w-\[18px\] {
  width: 18px;
}
.w-\[190px\] {
  width: 190px;
}
.w-\[192px\] {
  width: 192px;
}
.w-\[194px\] {
  width: 194px;
}
.w-\[197px\] {
  width: 197px;
}
.w-\[19px\] {
  width: 19px;
}
.w-\[1px\] {
  width: 1px;
}
.w-\[200px\] {
  width: 200px;
}
.w-\[204px\] {
  width: 204px;
}
.w-\[206px\] {
  width: 206px;
}
.w-\[208px\] {
  width: 208px;
}
.w-\[20px\] {
  width: 20px;
}
.w-\[210px\] {
  width: 210px;
}
.w-\[212px\] {
  width: 212px;
}
.w-\[220px\] {
  width: 220px;
}
.w-\[224px\] {
  width: 224px;
}
.w-\[22px\] {
  width: 22px;
}
.w-\[230px\] {
  width: 230px;
}
.w-\[231px\] {
  width: 231px;
}
.w-\[232px\] {
  width: 232px;
}
.w-\[234px\] {
  width: 234px;
}
.w-\[236px\] {
  width: 236px;
}
.w-\[240px\] {
  width: 240px;
}
.w-\[243px\] {
  width: 243px;
}
.w-\[244px\] {
  width: 244px;
}
.w-\[248px\] {
  width: 248px;
}
.w-\[24px\] {
  width: 24px;
}
.w-\[250px\] {
  width: 250px;
}
.w-\[255px\] {
  width: 255px;
}
.w-\[256px\] {
  width: 256px;
}
.w-\[260px\] {
  width: 260px;
}
.w-\[264px\] {
  width: 264px;
}
.w-\[266px\] {
  width: 266px;
}
.w-\[268px\] {
  width: 268px;
}
.w-\[26px\] {
  width: 26px;
}
.w-\[270px\] {
  width: 270px;
}
.w-\[272px\] {
  width: 272px;
}
.w-\[280px\] {
  width: 280px;
}
.w-\[288px\] {
  width: 288px;
}
.w-\[28px\] {
  width: 28px;
}
.w-\[29\.333px\] {
  width: 29.333px;
}
.w-\[294px\] {
  width: 294px;
}
.w-\[298px\] {
  width: 298px;
}
.w-\[2px\] {
  width: 2px;
}
.w-\[300px\] {
  width: 300px;
}
.w-\[302px\] {
  width: 302px;
}
.w-\[304px\] {
  width: 304px;
}
.w-\[306px\] {
  width: 306px;
}
.w-\[309px\] {
  width: 309px;
}
.w-\[30px\] {
  width: 30px;
}
.w-\[310px\] {
  width: 310px;
}
.w-\[320px\] {
  width: 320px;
}
.w-\[324px\] {
  width: 324px;
}
.w-\[32px\] {
  width: 32px;
}
.w-\[330px\] {
  width: 330px;
}
.w-\[338px\] {
  width: 338px;
}
.w-\[340px\] {
  width: 340px;
}
.w-\[345px\] {
  width: 345px;
}
.w-\[34px\] {
  width: 34px;
}
.w-\[350px\] {
  width: 350px;
}
.w-\[36\%\] {
  width: 36%;
}
.w-\[360px\] {
  width: 360px;
}
.w-\[380px\] {
  width: 380px;
}
.w-\[38px\] {
  width: 38px;
}
.w-\[3px\] {
  width: 3px;
}
.w-\[40\%\] {
  width: 40%;
}
.w-\[400px\] {
  width: 400px;
}
.w-\[408px\] {
  width: 408px;
}
.w-\[40px\] {
  width: 40px;
}
.w-\[410px\] {
  width: 410px;
}
.w-\[420px\] {
  width: 420px;
}
.w-\[42px\] {
  width: 42px;
}
.w-\[44\%\] {
  width: 44%;
}
.w-\[440px\] {
  width: 440px;
}
.w-\[448px\] {
  width: 448px;
}
.w-\[44px\] {
  width: 44px;
}
.w-\[45px\] {
  width: 45px;
}
.w-\[470px\] {
  width: 470px;
}
.w-\[48px\] {
  width: 48px;
}
.w-\[500px\] {
  width: 500px;
}
.w-\[508px\] {
  width: 508px;
}
.w-\[50px\] {
  width: 50px;
}
.w-\[512px\] {
  width: 512px;
}
.w-\[518px\] {
  width: 518px;
}
.w-\[520px\] {
  width: 520px;
}
.w-\[528px\] {
  width: 528px;
}
.w-\[52px\] {
  width: 52px;
}
.w-\[540px\] {
  width: 540px;
}
.w-\[55\%\] {
  width: 55%;
}
.w-\[56px\] {
  width: 56px;
}
.w-\[580px\] {
  width: 580px;
}
.w-\[58px\] {
  width: 58px;
}
.w-\[600px\] {
  width: 600px;
}
.w-\[60px\] {
  width: 60px;
}
.w-\[64px\] {
  width: 64px;
}
.w-\[68px\] {
  width: 68px;
}
.w-\[6px\] {
  width: 6px;
}
.w-\[70px\] {
  width: 70px;
}
.w-\[72px\] {
  width: 72px;
}
.w-\[73px\] {
  width: 73px;
}
.w-\[75\%\] {
  width: 75%;
}
.w-\[76px\] {
  width: 76px;
}
.w-\[78px\] {
  width: 78px;
}
.w-\[80\%\] {
  width: 80%;
}
.w-\[800px\] {
  width: 800px;
}
.w-\[80px\] {
  width: 80px;
}
.w-\[84px\] {
  width: 84px;
}
.w-\[86px\] {
  width: 86px;
}
.w-\[880px\] {
  width: 880px;
}
.w-\[88px\] {
  width: 88px;
}
.w-\[90px\] {
  width: 90px;
}
.w-\[91px\] {
  width: 91px;
}
.w-\[93px\] {
  width: 93px;
}
.w-\[940px\] {
  width: 940px;
}
.w-\[96\%\] {
  width: 96%;
}
.w-\[96px\] {
  width: 96px;
}
.w-\[calc\(100\%\+10px\)\] {
  width: calc(100% + 10px);
}
.w-\[calc\(100\%\+12px\)\] {
  width: calc(100% + 12px);
}
.w-\[calc\(100\%\+14px\)\] {
  width: calc(100% + 14px);
}
.w-\[calc\(100\%\+160px\)\] {
  width: calc(100% + 160px);
}
.w-\[calc\(100\%\+16px\)\] {
  width: calc(100% + 16px);
}
.w-\[calc\(100\%\+20\)\] {
  width: calc(100% + 20);
}
.w-\[calc\(100\%\+20px\)\] {
  width: calc(100% + 20px);
}
.w-\[calc\(100\%\+24px\)\] {
  width: calc(100% + 24px);
}
.w-\[calc\(100\%\+32px\)\] {
  width: calc(100% + 32px);
}
.w-\[calc\(100\%\+34px\)\] {
  width: calc(100% + 34px);
}
.w-\[calc\(100\%\+40px\)\] {
  width: calc(100% + 40px);
}
.w-\[calc\(100\%\+48px\)\] {
  width: calc(100% + 48px);
}
.w-\[calc\(100\%\+4px\)\] {
  width: calc(100% + 4px);
}
.w-\[calc\(100\%-0px\)\] {
  width: calc(100% - 0px);
}
.w-\[calc\(100\%-100px-16px-24px\)\] {
  width: calc(100% - 100px - 16px - 24px);
}
.w-\[calc\(100\%-112px\)\] {
  width: calc(100% - 112px);
}
.w-\[calc\(100\%-16px\)\] {
  width: calc(100% - 16px);
}
.w-\[calc\(100\%-190px\)\] {
  width: calc(100% - 190px);
}
.w-\[calc\(100\%-20px\)\] {
  width: calc(100% - 20px);
}
.w-\[calc\(100\%-24px\)\] {
  width: calc(100% - 24px);
}
.w-\[calc\(100\%-280px\)\] {
  width: calc(100% - 280px);
}
.w-\[calc\(100\%-28px\)\] {
  width: calc(100% - 28px);
}
.w-\[calc\(100\%-2px\)\] {
  width: calc(100% - 2px);
}
.w-\[calc\(100\%-30px\)\] {
  width: calc(100% - 30px);
}
.w-\[calc\(100\%-32px\)\] {
  width: calc(100% - 32px);
}
.w-\[calc\(100\%-36px\)\] {
  width: calc(100% - 36px);
}
.w-\[calc\(100\%-40px\)\] {
  width: calc(100% - 40px);
}
.w-\[calc\(100\%-40px-10px\)\] {
  width: calc(100% - 40px - 10px);
}
.w-\[calc\(100\%-40px-40px\)\] {
  width: calc(100% - 40px - 40px);
}
.w-\[calc\(100\%-440px\)\] {
  width: calc(100% - 440px);
}
.w-\[calc\(100\%-48px\)\] {
  width: calc(100% - 48px);
}
.w-\[calc\(100\%-4px\)\] {
  width: calc(100% - 4px);
}
.w-\[calc\(100\%-66px\)\] {
  width: calc(100% - 66px);
}
.w-\[calc\(100\%-80px\)\] {
  width: calc(100% - 80px);
}
.w-\[calc\(100\%-8px\)\] {
  width: calc(100% - 8px);
}
.w-\[calc\(100vw-160px\)\] {
  width: calc(100vw - 160px);
}
.w-\[calc\(100vw-186px-58px-66px-68px\)\] {
  width: calc(100vw - 186px - 58px - 66px - 68px);
}
.w-\[calc\(100vw-48px\)\] {
  width: calc(100vw - 48px);
}
.w-\[calc\(100vw-80px\)\] {
  width: calc(100vw - 80px);
}
.w-\[min\(480px\2c 94vw\)\] {
  width: min(480px, 94vw);
}
.w-\[min\(560px\2c 88vw\)\] {
  width: min(560px, 88vw);
}
.w-\[min-content\] {
  width: -moz-min-content;
  width: min-content;
}
.w-auto {
  width: auto;
}
.w-fit {
  width: -moz-fit-content;
  width: fit-content;
}
.w-full {
  width: 100%;
}
.w-max {
  width: -moz-max-content;
  width: max-content;
}
.w-min {
  width: -moz-min-content;
  width: min-content;
}
.w-px {
  width: 1px;
}
.w-screen {
  width: 100vw;
}
.\!min-w-0 {
  min-width: 0px !important;
}
.\!min-w-\[100px\] {
  min-width: 100px !important;
}
.\!min-w-\[102px\] {
  min-width: 102px !important;
}
.\!min-w-\[150px\] {
  min-width: 150px !important;
}
.\!min-w-\[180px\] {
  min-width: 180px !important;
}
.\!min-w-\[200px\] {
  min-width: 200px !important;
}
.\!min-w-\[20px\] {
  min-width: 20px !important;
}
.\!min-w-\[210px\] {
  min-width: 210px !important;
}
.\!min-w-\[220px\] {
  min-width: 220px !important;
}
.\!min-w-\[228px\] {
  min-width: 228px !important;
}
.\!min-w-\[248px\] {
  min-width: 248px !important;
}
.\!min-w-\[28px\] {
  min-width: 28px !important;
}
.\!min-w-\[32px\] {
  min-width: 32px !important;
}
.\!min-w-\[34px\] {
  min-width: 34px !important;
}
.\!min-w-\[36px\] {
  min-width: 36px !important;
}
.\!min-w-\[40px\] {
  min-width: 40px !important;
}
.\!min-w-\[48px\] {
  min-width: 48px !important;
}
.\!min-w-\[94px\] {
  min-width: 94px !important;
}
.\!min-w-full {
  min-width: 100% !important;
}
.min-w-0 {
  min-width: 0px;
}
.min-w-1 {
  min-width: 0.25rem;
}
.min-w-10 {
  min-width: 2.5rem;
}
.min-w-3 {
  min-width: 0.75rem;
}
.min-w-4 {
  min-width: 1rem;
}
.min-w-5 {
  min-width: 1.25rem;
}
.min-w-6 {
  min-width: 1.5rem;
}
.min-w-60 {
  min-width: 15rem;
}
.min-w-7 {
  min-width: 1.75rem;
}
.min-w-8 {
  min-width: 2rem;
}
.min-w-9 {
  min-width: 2.25rem;
}
.min-w-\[100px\] {
  min-width: 100px;
}
.min-w-\[104px\] {
  min-width: 104px;
}
.min-w-\[110px\] {
  min-width: 110px;
}
.min-w-\[120px\] {
  min-width: 120px;
}
.min-w-\[122px\] {
  min-width: 122px;
}
.min-w-\[124px\] {
  min-width: 124px;
}
.min-w-\[130px\] {
  min-width: 130px;
}
.min-w-\[132px\] {
  min-width: 132px;
}
.min-w-\[134px\] {
  min-width: 134px;
}
.min-w-\[140px\] {
  min-width: 140px;
}
.min-w-\[144px\] {
  min-width: 144px;
}
.min-w-\[148px\] {
  min-width: 148px;
}
.min-w-\[14px\] {
  min-width: 14px;
}
.min-w-\[150px\] {
  min-width: 150px;
}
.min-w-\[152px\] {
  min-width: 152px;
}
.min-w-\[157px\] {
  min-width: 157px;
}
.min-w-\[158px\] {
  min-width: 158px;
}
.min-w-\[160px\] {
  min-width: 160px;
}
.min-w-\[162px\] {
  min-width: 162px;
}
.min-w-\[16px\] {
  min-width: 16px;
}
.min-w-\[174px\] {
  min-width: 174px;
}
.min-w-\[178px\] {
  min-width: 178px;
}
.min-w-\[180px\] {
  min-width: 180px;
}
.min-w-\[184px\] {
  min-width: 184px;
}
.min-w-\[186px\] {
  min-width: 186px;
}
.min-w-\[200px\] {
  min-width: 200px;
}
.min-w-\[204px\] {
  min-width: 204px;
}
.min-w-\[208px\] {
  min-width: 208px;
}
.min-w-\[20px\] {
  min-width: 20px;
}
.min-w-\[210px\] {
  min-width: 210px;
}
.min-w-\[212px\] {
  min-width: 212px;
}
.min-w-\[216px\] {
  min-width: 216px;
}
.min-w-\[220px\] {
  min-width: 220px;
}
.min-w-\[230px\] {
  min-width: 230px;
}
.min-w-\[236px\] {
  min-width: 236px;
}
.min-w-\[240px\] {
  min-width: 240px;
}
.min-w-\[248px\] {
  min-width: 248px;
}
.min-w-\[24px\] {
  min-width: 24px;
}
.min-w-\[250px\] {
  min-width: 250px;
}
.min-w-\[252px\] {
  min-width: 252px;
}
.min-w-\[260px\] {
  min-width: 260px;
}
.min-w-\[264px\] {
  min-width: 264px;
}
.min-w-\[26px\] {
  min-width: 26px;
}
.min-w-\[280px\] {
  min-width: 280px;
}
.min-w-\[28px\] {
  min-width: 28px;
}
.min-w-\[300px\] {
  min-width: 300px;
}
.min-w-\[30px\] {
  min-width: 30px;
}
.min-w-\[32\%\] {
  min-width: 32%;
}
.min-w-\[32px\] {
  min-width: 32px;
}
.min-w-\[340px\] {
  min-width: 340px;
}
.min-w-\[36px\] {
  min-width: 36px;
}
.min-w-\[38px\] {
  min-width: 38px;
}
.min-w-\[40px\] {
  min-width: 40px;
}
.min-w-\[42px\] {
  min-width: 42px;
}
.min-w-\[44px\] {
  min-width: 44px;
}
.min-w-\[48px\] {
  min-width: 48px;
}
.min-w-\[49px\] {
  min-width: 49px;
}
.min-w-\[4px\] {
  min-width: 4px;
}
.min-w-\[50\%\] {
  min-width: 50%;
}
.min-w-\[50px\] {
  min-width: 50px;
}
.min-w-\[52px\] {
  min-width: 52px;
}
.min-w-\[60px\] {
  min-width: 60px;
}
.min-w-\[654px\] {
  min-width: 654px;
}
.min-w-\[6px\] {
  min-width: 6px;
}
.min-w-\[72px\] {
  min-width: 72px;
}
.min-w-\[76px\] {
  min-width: 76px;
}
.min-w-\[80px\] {
  min-width: 80px;
}
.min-w-\[82px\] {
  min-width: 82px;
}
.min-w-\[84px\] {
  min-width: 84px;
}
.min-w-\[88px\] {
  min-width: 88px;
}
.min-w-\[90px\] {
  min-width: 90px;
}
.min-w-\[92px\] {
  min-width: 92px;
}
.min-w-\[calc\(100\%-40px-40px\)\] {
  min-width: calc(100% - 40px - 40px);
}
.min-w-\[unset\] {
  min-width: unset;
}
.min-w-fit {
  min-width: -moz-fit-content;
  min-width: fit-content;
}
.min-w-full {
  min-width: 100%;
}
.min-w-max {
  min-width: -moz-max-content;
  min-width: max-content;
}
.min-w-min {
  min-width: -moz-min-content;
  min-width: min-content;
}
.min-w-px {
  min-width: 1px;
}
.\!max-w-\[100\%\] {
  max-width: 100% !important;
}
.\!max-w-\[280px\] {
  max-width: 280px !important;
}
.\!max-w-\[300px\] {
  max-width: 300px !important;
}
.\!max-w-\[344px\] {
  max-width: 344px !important;
}
.\!max-w-\[34px\] {
  max-width: 34px !important;
}
.\!max-w-\[620px\] {
  max-width: 620px !important;
}
.\!max-w-\[800px\] {
  max-width: 800px !important;
}
.\!max-w-none {
  max-width: none !important;
}
.max-w-0 {
  max-width: 0px;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-6xl {
  max-width: 72rem;
}
.max-w-\[100\%\] {
  max-width: 100%;
}
.max-w-\[1000px\] {
  max-width: 1000px;
}
.max-w-\[1001px\] {
  max-width: 1001px;
}
.max-w-\[100vw\] {
  max-width: 100vw;
}
.max-w-\[1020px\] {
  max-width: 1020px;
}
.max-w-\[1024px\] {
  max-width: 1024px;
}
.max-w-\[1080px\] {
  max-width: 1080px;
}
.max-w-\[1090px\] {
  max-width: 1090px;
}
.max-w-\[1100px\] {
  max-width: 1100px;
}
.max-w-\[110px\] {
  max-width: 110px;
}
.max-w-\[1120px\] {
  max-width: 1120px;
}
.max-w-\[1128px\] {
  max-width: 1128px;
}
.max-w-\[1144px\] {
  max-width: 1144px;
}
.max-w-\[1160px\] {
  max-width: 1160px;
}
.max-w-\[1180px\] {
  max-width: 1180px;
}
.max-w-\[1200px\] {
  max-width: 1200px;
}
.max-w-\[120px\] {
  max-width: 120px;
}
.max-w-\[122px\] {
  max-width: 122px;
}
.max-w-\[1242px\] {
  max-width: 1242px;
}
.max-w-\[1250px\] {
  max-width: 1250px;
}
.max-w-\[1260px\] {
  max-width: 1260px;
}
.max-w-\[1280px\] {
  max-width: 1280px;
}
.max-w-\[135px\] {
  max-width: 135px;
}
.max-w-\[140px\] {
  max-width: 140px;
}
.max-w-\[144px\] {
  max-width: 144px;
}
.max-w-\[1600px\] {
  max-width: 1600px;
}
.max-w-\[160px\] {
  max-width: 160px;
}
.max-w-\[16px\] {
  max-width: 16px;
}
.max-w-\[172px\] {
  max-width: 172px;
}
.max-w-\[176px\] {
  max-width: 176px;
}
.max-w-\[180px\] {
  max-width: 180px;
}
.max-w-\[183px\] {
  max-width: 183px;
}
.max-w-\[188px\] {
  max-width: 188px;
}
.max-w-\[18px\] {
  max-width: 18px;
}
.max-w-\[1920px\] {
  max-width: 1920px;
}
.max-w-\[192px\] {
  max-width: 192px;
}
.max-w-\[200px\] {
  max-width: 200px;
}
.max-w-\[208px\] {
  max-width: 208px;
}
.max-w-\[210px\] {
  max-width: 210px;
}
.max-w-\[212px\] {
  max-width: 212px;
}
.max-w-\[2142px\] {
  max-width: 2142px;
}
.max-w-\[220px\] {
  max-width: 220px;
}
.max-w-\[240px\] {
  max-width: 240px;
}
.max-w-\[243px\] {
  max-width: 243px;
}
.max-w-\[250px\] {
  max-width: 250px;
}
.max-w-\[256px\] {
  max-width: 256px;
}
.max-w-\[260px\] {
  max-width: 260px;
}
.max-w-\[272px\] {
  max-width: 272px;
}
.max-w-\[274px\] {
  max-width: 274px;
}
.max-w-\[280px\] {
  max-width: 280px;
}
.max-w-\[284px\] {
  max-width: 284px;
}
.max-w-\[295px\] {
  max-width: 295px;
}
.max-w-\[296px\] {
  max-width: 296px;
}
.max-w-\[300px\] {
  max-width: 300px;
}
.max-w-\[304px\] {
  max-width: 304px;
}
.max-w-\[310px\] {
  max-width: 310px;
}
.max-w-\[320px\] {
  max-width: 320px;
}
.max-w-\[324px\] {
  max-width: 324px;
}
.max-w-\[335px\] {
  max-width: 335px;
}
.max-w-\[340px\] {
  max-width: 340px;
}
.max-w-\[344px\] {
  max-width: 344px;
}
.max-w-\[350px\] {
  max-width: 350px;
}
.max-w-\[353px\] {
  max-width: 353px;
}
.max-w-\[356px\] {
  max-width: 356px;
}
.max-w-\[360px\] {
  max-width: 360px;
}
.max-w-\[368px\] {
  max-width: 368px;
}
.max-w-\[372px\] {
  max-width: 372px;
}
.max-w-\[378px\] {
  max-width: 378px;
}
.max-w-\[380px\] {
  max-width: 380px;
}
.max-w-\[390px\] {
  max-width: 390px;
}
.max-w-\[392px\] {
  max-width: 392px;
}
.max-w-\[40\%\] {
  max-width: 40%;
}
.max-w-\[400px\] {
  max-width: 400px;
}
.max-w-\[404px\] {
  max-width: 404px;
}
.max-w-\[410px\] {
  max-width: 410px;
}
.max-w-\[414px\] {
  max-width: 414px;
}
.max-w-\[420px\] {
  max-width: 420px;
}
.max-w-\[436px\] {
  max-width: 436px;
}
.max-w-\[440px\] {
  max-width: 440px;
}
.max-w-\[452px\] {
  max-width: 452px;
}
.max-w-\[458px\] {
  max-width: 458px;
}
.max-w-\[460px\] {
  max-width: 460px;
}
.max-w-\[470px\] {
  max-width: 470px;
}
.max-w-\[472px\] {
  max-width: 472px;
}
.max-w-\[474px\] {
  max-width: 474px;
}
.max-w-\[480px\] {
  max-width: 480px;
}
.max-w-\[500px\] {
  max-width: 500px;
}
.max-w-\[506px\] {
  max-width: 506px;
}
.max-w-\[510px\] {
  max-width: 510px;
}
.max-w-\[520px\] {
  max-width: 520px;
}
.max-w-\[528px\] {
  max-width: 528px;
}
.max-w-\[532px\] {
  max-width: 532px;
}
.max-w-\[540px\] {
  max-width: 540px;
}
.max-w-\[542px\] {
  max-width: 542px;
}
.max-w-\[546px\] {
  max-width: 546px;
}
.max-w-\[55\%\] {
  max-width: 55%;
}
.max-w-\[550px\] {
  max-width: 550px;
}
.max-w-\[554px\] {
  max-width: 554px;
}
.max-w-\[560px\] {
  max-width: 560px;
}
.max-w-\[568px\] {
  max-width: 568px;
}
.max-w-\[580px\] {
  max-width: 580px;
}
.max-w-\[584px\] {
  max-width: 584px;
}
.max-w-\[60\%\] {
  max-width: 60%;
}
.max-w-\[600px\] {
  max-width: 600px;
}
.max-w-\[60px\] {
  max-width: 60px;
}
.max-w-\[612px\] {
  max-width: 612px;
}
.max-w-\[616px\] {
  max-width: 616px;
}
.max-w-\[620px\] {
  max-width: 620px;
}
.max-w-\[624px\] {
  max-width: 624px;
}
.max-w-\[640px\] {
  max-width: 640px;
}
.max-w-\[654px\] {
  max-width: 654px;
}
.max-w-\[664px\] {
  max-width: 664px;
}
.max-w-\[66px\] {
  max-width: 66px;
}
.max-w-\[680px\] {
  max-width: 680px;
}
.max-w-\[70\%\] {
  max-width: 70%;
}
.max-w-\[700px\] {
  max-width: 700px;
}
.max-w-\[720px\] {
  max-width: 720px;
}
.max-w-\[722px\] {
  max-width: 722px;
}
.max-w-\[742px\] {
  max-width: 742px;
}
.max-w-\[75\%\] {
  max-width: 75%;
}
.max-w-\[750px\] {
  max-width: 750px;
}
.max-w-\[752px\] {
  max-width: 752px;
}
.max-w-\[760px\] {
  max-width: 760px;
}
.max-w-\[768px\] {
  max-width: 768px;
}
.max-w-\[80\%\] {
  max-width: 80%;
}
.max-w-\[800px\] {
  max-width: 800px;
}
.max-w-\[80px\] {
  max-width: 80px;
}
.max-w-\[810px\] {
  max-width: 810px;
}
.max-w-\[820px\] {
  max-width: 820px;
}
.max-w-\[84px\] {
  max-width: 84px;
}
.max-w-\[85\%\] {
  max-width: 85%;
}
.max-w-\[880px\] {
  max-width: 880px;
}
.max-w-\[90\%\] {
  max-width: 90%;
}
.max-w-\[900px\] {
  max-width: 900px;
}
.max-w-\[920px\] {
  max-width: 920px;
}
.max-w-\[92vw\] {
  max-width: 92vw;
}
.max-w-\[938px\] {
  max-width: 938px;
}
.max-w-\[940px\] {
  max-width: 940px;
}
.max-w-\[960px\] {
  max-width: 960px;
}
.max-w-\[calc\(100\%-40px\)\] {
  max-width: calc(100% - 40px);
}
.max-w-\[calc\(100\%-48px\)\] {
  max-width: calc(100% - 48px);
}
.max-w-\[calc\(100\%-50px\)\] {
  max-width: calc(100% - 50px);
}
.max-w-\[calc\(100\%-68px\)\] {
  max-width: calc(100% - 68px);
}
.max-w-\[calc\(100\%-80px-4px-8px\)\] {
  max-width: calc(100% - 80px - 4px - 8px);
}
.max-w-\[calc\(100vw-24px\)\] {
  max-width: calc(100vw - 24px);
}
.max-w-\[calc\(100vw-32px\)\] {
  max-width: calc(100vw - 32px);
}
.max-w-\[calc\(100vw-48px\)\] {
  max-width: calc(100vw - 48px);
}
.max-w-\[unset\] {
  max-width: unset;
}
.max-w-fit {
  max-width: -moz-fit-content;
  max-width: fit-content;
}
.max-w-full {
  max-width: 100%;
}
.max-w-md {
  max-width: 28rem;
}
.max-w-none {
  max-width: none;
}
.max-w-screen-lg {
  max-width: 1024px;
}
.max-w-xl {
  max-width: 36rem;
}
.max-w-xs {
  max-width: 20rem;
}
.\!flex-none {
  flex: none !important;
}
.flex-1 {
  flex: 1 1 0%;
}
.flex-\[1_0_0\] {
  flex: 1 0 0;
}
.flex-none {
  flex: none;
}
.flex-shrink-0 {
  flex-shrink: 0;
}
.\!shrink {
  flex-shrink: 1 !important;
}
.shrink {
  flex-shrink: 1;
}
.shrink-0 {
  flex-shrink: 0;
}
.flex-grow {
  flex-grow: 1;
}
.grow {
  flex-grow: 1;
}
.grow-0 {
  flex-grow: 0;
}
.basis-0 {
  flex-basis: 0px;
}
.basis-1\/2 {
  flex-basis: 50%;
}
.basis-auto {
  flex-basis: auto;
}
.table-fixed {
  table-layout: fixed;
}
.border-collapse {
  border-collapse: collapse;
}
.\!origin-center {
  transform-origin: center !important;
}
.origin-bottom {
  transform-origin: bottom;
}
.origin-bottom-left {
  transform-origin: bottom left;
}
.origin-top {
  transform-origin: top;
}
.origin-top-left {
  transform-origin: top left;
}
.origin-top-right {
  transform-origin: top right;
}
.-translate-x-1\/2 {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-x-full {
  --tw-translate-x: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-0\.5 {
  --tw-translate-y: -0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2 {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-2 {
  --tw-translate-y: -0.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-\[55\%\] {
  --tw-translate-y: -55%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-full {
  --tw-translate-y: -100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-0 {
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-4 {
  --tw-translate-x: 1rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[-16px\] {
  --tw-translate-x: -16px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[-4px\] {
  --tw-translate-x: -4px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[-50\%\] {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[-6px\] {
  --tw-translate-x: -6px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[120\%\] {
  --tw-translate-x: 120%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[12px\] {
  --tw-translate-x: 12px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-\[50\%\] {
  --tw-translate-x: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-full {
  --tw-translate-x: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-0 {
  --tw-translate-y: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-0\.5 {
  --tw-translate-y: 0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-1 {
  --tw-translate-y: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-10 {
  --tw-translate-y: 2.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-2 {
  --tw-translate-y: 0.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-4 {
  --tw-translate-y: 1rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-\[-50\%\] {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-\[10\%\] {
  --tw-translate-y: 10%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-\[100\%\] {
  --tw-translate-y: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-\[50\%\] {
  --tw-translate-y: 50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-full {
  --tw-translate-y: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\!-rotate-90 {
  --tw-rotate: -90deg !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}
.rotate-0 {
  --tw-rotate: 0deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-45 {
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-\[-180deg\] {
  --tw-rotate: -180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-\[-3deg\] {
  --tw-rotate: -3deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-\[2\.732deg\] {
  --tw-rotate: 2.732deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-\[2\.73deg\] {
  --tw-rotate: 2.73deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-100 {
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-110 {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-95 {
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-\[\$\{slideScale\}\] {
  --tw-scale-x: ${slideScale};
  --tw-scale-y: ${slideScale};
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-\[0\.1415666667\] {
  --tw-scale-x: 0.1415666667;
  --tw-scale-y: 0.1415666667;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-\[0\.2064\] {
  --tw-scale-x: 0.2064;
  --tw-scale-y: 0.2064;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-\[0\.94\] {
  --tw-scale-x: 0.94;
  --tw-scale-y: 0.94;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-\[1\.25\] {
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-\[1\.2\] {
  --tw-scale-x: 1.2;
  --tw-scale-y: 1.2;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\!transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}
.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.animate-\[card-shimmer_1\.5s_ease-in-out_0\.5s_1_forwards\] {
  animation: card-shimmer 1.5s ease-in-out 0.5s 1 forwards;
}
.animate-\[fadeIn_0\.3s_ease-out\] {
  animation: fadeIn 0.3s ease-out;
}
.animate-\[pn-fade-in_0\.18s_ease\] {
  animation: pn-fade-in 0.18s ease;
}
.animate-\[pn-section-reveal_0\.45s_cubic-bezier\(0\.22\2c 0\.61\2c 0\.36\2c 1\)_forwards\] {
  animation: pn-section-reveal 0.45s cubic-bezier(0.22,0.61,0.36,1) forwards;
}
.animate-\[pn-success-glow_2s_ease-out_0\.6s_infinite\] {
  animation: pn-success-glow 2s ease-out 0.6s infinite;
}
.animate-\[pn-success-pop_0\.5s_cubic-bezier\(0\.34\2c 1\.56\2c 0\.64\2c 1\)_both\] {
  animation: pn-success-pop 0.5s cubic-bezier(0.34,1.56,0.64,1) both;
}
@keyframes bounce {

  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}
.animate-bounce {
  animation: bounce 1s infinite;
}
@keyframes fel-panel-in {

  from {
    opacity: 0;
    transform: translate(100%, -50%);
  }

  to {
    opacity: 1;
    transform: translate(0, -50%);
  }
}
.animate-fel-panel-in {
  animation: fel-panel-in 380ms cubic-bezier(0.32, 0.72, 0, 1) forwards;
}
@keyframes fel-step-pulse {

  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(0, 85, 237, 0.50);
  }

  50% {
    transform: scale(0.78);
    box-shadow: 0 0 0 5px rgba(0, 85, 237, 0);
  }
}
.animate-fel-step-pulse {
  animation: fel-step-pulse 1.1s ease-in-out infinite;
}
@keyframes pulse {

  50% {
    opacity: .5;
  }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes spin {

  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.\!cursor-default {
  cursor: default !important;
}
.\!cursor-none {
  cursor: none !important;
}
.cursor-auto {
  cursor: auto;
}
.cursor-col-resize {
  cursor: col-resize;
}
.cursor-crosshair {
  cursor: crosshair;
}
.cursor-default {
  cursor: default;
}
.cursor-ew-resize {
  cursor: ew-resize;
}
.cursor-grab {
  cursor: grab;
}
.cursor-grabbing {
  cursor: grabbing;
}
.cursor-help {
  cursor: help;
}
.cursor-move {
  cursor: move;
}
.cursor-nesw-resize {
  cursor: nesw-resize;
}
.cursor-not-allowed {
  cursor: not-allowed;
}
.cursor-ns-resize {
  cursor: ns-resize;
}
.cursor-nwse-resize {
  cursor: nwse-resize;
}
.cursor-pointer {
  cursor: pointer;
}
.cursor-progress {
  cursor: progress;
}
.cursor-text {
  cursor: text;
}
.touch-pinch-zoom {
  --tw-pinch-zoom: pinch-zoom;
  touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom);
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.select-all {
  -webkit-user-select: all;
     -moz-user-select: all;
          user-select: all;
}
.resize-none {
  resize: none;
}
.resize-y {
  resize: vertical;
}
.resize {
  resize: both;
}
.snap-x {
  scroll-snap-type: x var(--tw-scroll-snap-strictness);
}
.snap-mandatory {
  --tw-scroll-snap-strictness: mandatory;
}
.snap-center {
  scroll-snap-align: center;
}
.scroll-mt-10 {
  scroll-margin-top: 2.5rem;
}
.scroll-mt-6 {
  scroll-margin-top: 1.5rem;
}
.scroll-pt-3 {
  scroll-padding-top: 0.75rem;
}
.list-inside {
  list-style-position: inside;
}
.list-outside {
  list-style-position: outside;
}
.list-decimal {
  list-style-type: decimal;
}
.list-disc {
  list-style-type: disc;
}
.list-none {
  list-style-type: none;
}
.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.columns-2 {
  -moz-columns: 2;
       columns: 2;
}
.break-inside-avoid {
  -moz-column-break-inside: avoid;
       break-inside: avoid;
}
.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.grid-cols-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.grid-cols-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
.grid-cols-9 {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}
.grid-cols-\[180px_1fr\] {
  grid-template-columns: 180px 1fr;
}
.grid-cols-\[1fr_30px\] {
  grid-template-columns: 1fr 30px;
}
.grid-cols-\[1fr_60px\] {
  grid-template-columns: 1fr 60px;
}
.grid-cols-\[320px_1fr_1fr\] {
  grid-template-columns: 320px 1fr 1fr;
}
.grid-cols-\[320px_1fr_1fr_1fr\] {
  grid-template-columns: 320px 1fr 1fr 1fr;
}
.grid-rows-3 {
  grid-template-rows: repeat(3, minmax(0, 1fr));
}
.grid-rows-\[0fr\] {
  grid-template-rows: 0fr;
}
.grid-rows-\[1fr\] {
  grid-template-rows: 1fr;
}
.flex-row {
  flex-direction: row;
}
.flex-row-reverse {
  flex-direction: row-reverse;
}
.flex-col {
  flex-direction: column;
}
.flex-col-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.\!flex-nowrap {
  flex-wrap: nowrap !important;
}
.flex-nowrap {
  flex-wrap: nowrap;
}
.place-items-center {
  place-items: center;
}
.content-center {
  align-content: center;
}
.content-start {
  align-content: flex-start;
}
.content-between {
  align-content: space-between;
}
.content-evenly {
  align-content: space-evenly;
}
.content-stretch {
  align-content: stretch;
}
.\!items-start {
  align-items: flex-start !important;
}
.items-start {
  align-items: flex-start;
}
.items-end {
  align-items: flex-end;
}
.items-center {
  align-items: center;
}
.items-baseline {
  align-items: baseline;
}
.items-stretch {
  align-items: stretch;
}
.\!justify-start {
  justify-content: flex-start !important;
}
.justify-start {
  justify-content: flex-start;
}
.justify-end {
  justify-content: flex-end;
}
.\!justify-center {
  justify-content: center !important;
}
.justify-center {
  justify-content: center;
}
.\!justify-between {
  justify-content: space-between !important;
}
.justify-between {
  justify-content: space-between;
}
.justify-evenly {
  justify-content: space-evenly;
}
.justify-items-start {
  justify-items: start;
}
.\!gap-0 {
  gap: 0px !important;
}
.\!gap-2 {
  gap: 0.5rem !important;
}
.\!gap-3 {
  gap: 0.75rem !important;
}
.gap-0 {
  gap: 0px;
}
.gap-0\.5 {
  gap: 0.125rem;
}
.gap-1 {
  gap: 0.25rem;
}
.gap-1\.5 {
  gap: 0.375rem;
}
.gap-10 {
  gap: 2.5rem;
}
.gap-12 {
  gap: 3rem;
}
.gap-16 {
  gap: 4rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-2\.5 {
  gap: 0.625rem;
}
.gap-3 {
  gap: 0.75rem;
}
.gap-3\.5 {
  gap: 0.875rem;
}
.gap-4 {
  gap: 1rem;
}
.gap-5 {
  gap: 1.25rem;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-8 {
  gap: 2rem;
}
.gap-\[10px\] {
  gap: 10px;
}
.gap-\[11px\] {
  gap: 11px;
}
.gap-\[12px\] {
  gap: 12px;
}
.gap-\[13px\] {
  gap: 13px;
}
.gap-\[14px\] {
  gap: 14px;
}
.gap-\[15px\] {
  gap: 15px;
}
.gap-\[16px\] {
  gap: 16px;
}
.gap-\[17px\] {
  gap: 17px;
}
.gap-\[18px\] {
  gap: 18px;
}
.gap-\[19px\] {
  gap: 19px;
}
.gap-\[20px\] {
  gap: 20px;
}
.gap-\[21px\] {
  gap: 21px;
}
.gap-\[24px\] {
  gap: 24px;
}
.gap-\[26px\] {
  gap: 26px;
}
.gap-\[2px\] {
  gap: 2px;
}
.gap-\[30px\] {
  gap: 30px;
}
.gap-\[32px\] {
  gap: 32px;
}
.gap-\[3px\] {
  gap: 3px;
}
.gap-\[40px\] {
  gap: 40px;
}
.gap-\[44px\] {
  gap: 44px;
}
.gap-\[4px\] {
  gap: 4px;
}
.gap-\[50px\] {
  gap: 50px;
}
.gap-\[5px\] {
  gap: 5px;
}
.gap-\[6px\] {
  gap: 6px;
}
.gap-\[8px\] {
  gap: 8px;
}
.gap-\[9px\] {
  gap: 9px;
}
.gap-\[clamp\(0\.75rem\2c 2vh\2c 1\.25rem\)\] {
  gap: clamp(0.75rem, 2vh, 1.25rem);
}
.gap-\[clamp\(1\.75rem\2c 4\.5vh\2c 3\.5rem\)\] {
  gap: clamp(1.75rem, 4.5vh, 3.5rem);
}
.gap-px {
  gap: 1px;
}
.gap-x-1\.5 {
  -moz-column-gap: 0.375rem;
       column-gap: 0.375rem;
}
.gap-x-12 {
  -moz-column-gap: 3rem;
       column-gap: 3rem;
}
.gap-x-2 {
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.gap-x-3 {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-x-5 {
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
}
.gap-x-6 {
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
.gap-x-8 {
  -moz-column-gap: 2rem;
       column-gap: 2rem;
}
.gap-x-\[16px\] {
  -moz-column-gap: 16px;
       column-gap: 16px;
}
.gap-x-\[8px\] {
  -moz-column-gap: 8px;
       column-gap: 8px;
}
.gap-y-0\.5 {
  row-gap: 0.125rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-y-10 {
  row-gap: 2.5rem;
}
.gap-y-2 {
  row-gap: 0.5rem;
}
.gap-y-3 {
  row-gap: 0.75rem;
}
.gap-y-4 {
  row-gap: 1rem;
}
.gap-y-6 {
  row-gap: 1.5rem;
}
.gap-y-8 {
  row-gap: 2rem;
}
.gap-y-9 {
  row-gap: 2.25rem;
}
.gap-y-\[10px\] {
  row-gap: 10px;
}
.gap-y-\[2px\] {
  row-gap: 2px;
}
.-space-x-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(-0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(-0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.-space-x-\[6px\] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(-6px * var(--tw-space-x-reverse));
  margin-left: calc(-6px * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(1rem * var(--tw-space-x-reverse));
  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.space-x-\[60px\] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 0;
  margin-right: calc(60px * var(--tw-space-x-reverse));
  margin-left: calc(60px * calc(1 - var(--tw-space-x-reverse)));
}
.space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
}
.space-y-10 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2.5rem * var(--tw-space-y-reverse));
}
.space-y-12 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(3rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-20 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(5rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}
.space-y-5 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.space-y-\[26px\] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(26px * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(26px * var(--tw-space-y-reverse));
}
.space-y-\[6px\] > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(6px * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(6px * var(--tw-space-y-reverse));
}
.space-y-reverse > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 1;
}
.space-x-reverse > :not([hidden]) ~ :not([hidden]) {
  --tw-space-x-reverse: 1;
}
.divide-x > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-x-reverse: 0;
  border-right-width: calc(1px * var(--tw-divide-x-reverse));
  border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
}
.divide-y > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-y-reverse > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 1;
}
.divide-x-reverse > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-x-reverse: 1;
}
.divide-border-secondary > :not([hidden]) ~ :not([hidden]) {
  border-color: rgba(11, 15, 20, 0.09);
}
.divide-border-tertiary > :not([hidden]) ~ :not([hidden]) {
  border-color: rgba(11, 15, 20, 0.06);
}
.divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(224 224 224 / var(--tw-divide-opacity, 1));
}
.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(198 198 198 / var(--tw-divide-opacity, 1));
}
.self-start {
  align-self: flex-start;
}
.self-end {
  align-self: flex-end;
}
.\!self-center {
  align-self: center !important;
}
.self-center {
  align-self: center;
}
.self-stretch {
  align-self: stretch;
}
.overflow-auto {
  overflow: auto;
}
.\!overflow-hidden {
  overflow: hidden !important;
}
.overflow-hidden {
  overflow: hidden;
}
.overflow-clip {
  overflow: clip;
}
.\!overflow-visible {
  overflow: visible !important;
}
.overflow-visible {
  overflow: visible;
}
.overflow-scroll {
  overflow: scroll;
}
.overflow-x-auto {
  overflow-x: auto;
}
.\!overflow-y-auto {
  overflow-y: auto !important;
}
.overflow-y-auto {
  overflow-y: auto;
}
.overflow-x-hidden {
  overflow-x: hidden;
}
.\!overflow-y-hidden {
  overflow-y: hidden !important;
}
.overflow-y-hidden {
  overflow-y: hidden;
}
.overflow-x-clip {
  overflow-x: clip;
}
.overflow-y-scroll {
  overflow-y: scroll;
}
.overscroll-contain {
  overscroll-behavior: contain;
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.text-ellipsis {
  text-overflow: ellipsis;
}
.text-clip {
  text-overflow: clip;
}
.whitespace-normal {
  white-space: normal;
}
.\!whitespace-nowrap {
  white-space: nowrap !important;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.whitespace-pre {
  white-space: pre;
}
.whitespace-pre-line {
  white-space: pre-line;
}
.whitespace-pre-wrap {
  white-space: pre-wrap;
}
.\!whitespace-break-spaces {
  white-space: break-spaces !important;
}
.whitespace-break-spaces {
  white-space: break-spaces;
}
.text-wrap {
  text-wrap: wrap;
}
.text-balance {
  text-wrap: balance;
}
.text-pretty {
  text-wrap: pretty;
}
.break-words {
  overflow-wrap: break-word;
}
.break-all {
  word-break: break-all;
}
.\!rounded {
  border-radius: 0.25rem !important;
}
.\!rounded-\[10px\] {
  border-radius: 10px !important;
}
.\!rounded-\[24px\] {
  border-radius: 24px !important;
}
.\!rounded-\[4px\] {
  border-radius: 4px !important;
}
.\!rounded-\[5px\] {
  border-radius: 5px !important;
}
.\!rounded-\[6px\] {
  border-radius: 6px !important;
}
.\!rounded-full {
  border-radius: 9999px !important;
}
.\!rounded-lg {
  border-radius: 0.5rem !important;
}
.\!rounded-md {
  border-radius: 0.375rem !important;
}
.\!rounded-none {
  border-radius: 0px !important;
}
.\!rounded-sm {
  border-radius: 0.125rem !important;
}
.rounded {
  border-radius: 0.25rem;
}
.rounded-2xl {
  border-radius: 1rem;
}
.rounded-3xl {
  border-radius: 1.5rem;
}
.rounded-\[1\.125px\] {
  border-radius: 1.125px;
}
.rounded-\[100\%\] {
  border-radius: 100%;
}
.rounded-\[100px\] {
  border-radius: 100px;
}
.rounded-\[10px\] {
  border-radius: 10px;
}
.rounded-\[11\.765px\] {
  border-radius: 11.765px;
}
.rounded-\[11px\] {
  border-radius: 11px;
}
.rounded-\[1280px\] {
  border-radius: 1280px;
}
.rounded-\[12px\] {
  border-radius: 12px;
}
.rounded-\[14px\] {
  border-radius: 14px;
}
.rounded-\[15px\] {
  border-radius: 15px;
}
.rounded-\[16px\] {
  border-radius: 16px;
}
.rounded-\[17\.647px\] {
  border-radius: 17.647px;
}
.rounded-\[1px\] {
  border-radius: 1px;
}
.rounded-\[20px\] {
  border-radius: 20px;
}
.rounded-\[22px\] {
  border-radius: 22px;
}
.rounded-\[24px\] {
  border-radius: 24px;
}
.rounded-\[288px\] {
  border-radius: 288px;
}
.rounded-\[28px\] {
  border-radius: 28px;
}
.rounded-\[2px\] {
  border-radius: 2px;
}
.rounded-\[30px\] {
  border-radius: 30px;
}
.rounded-\[32px\] {
  border-radius: 32px;
}
.rounded-\[34px\] {
  border-radius: 34px;
}
.rounded-\[380px\] {
  border-radius: 380px;
}
.rounded-\[3px\] {
  border-radius: 3px;
}
.rounded-\[40px\] {
  border-radius: 40px;
}
.rounded-\[48px\] {
  border-radius: 48px;
}
.rounded-\[4px\] {
  border-radius: 4px;
}
.rounded-\[50px\] {
  border-radius: 50px;
}
.rounded-\[5px\] {
  border-radius: 5px;
}
.rounded-\[6px\] {
  border-radius: 6px;
}
.rounded-\[7px\] {
  border-radius: 7px;
}
.rounded-\[8px\] {
  border-radius: 8px;
}
.rounded-\[inherit\] {
  border-radius: inherit;
}
.rounded-full {
  border-radius: 9999px;
}
.rounded-lg {
  border-radius: 0.5rem;
}
.rounded-md {
  border-radius: 0.375rem;
}
.rounded-none {
  border-radius: 0px;
}
.rounded-sm {
  border-radius: 0.125rem;
}
.rounded-xl {
  border-radius: 0.75rem;
}
.\!rounded-l-none {
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}
.\!rounded-r-md {
  border-top-right-radius: 0.375rem !important;
  border-bottom-right-radius: 0.375rem !important;
}
.\!rounded-r-none {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
}
.rounded-b {
  border-bottom-right-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}
.rounded-b-\[7px\] {
  border-bottom-right-radius: 7px;
  border-bottom-left-radius: 7px;
}
.rounded-b-lg {
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.rounded-b-md {
  border-bottom-right-radius: 0.375rem;
  border-bottom-left-radius: 0.375rem;
}
.rounded-e {
  border-start-end-radius: 0.25rem;
  border-end-end-radius: 0.25rem;
}
.rounded-l {
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}
.rounded-l-\[12px\] {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}
.rounded-l-full {
  border-top-left-radius: 9999px;
  border-bottom-left-radius: 9999px;
}
.rounded-l-md {
  border-top-left-radius: 0.375rem;
  border-bottom-left-radius: 0.375rem;
}
.rounded-l-xl {
  border-top-left-radius: 0.75rem;
  border-bottom-left-radius: 0.75rem;
}
.rounded-r {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}
.rounded-r-\[100px\] {
  border-top-right-radius: 100px;
  border-bottom-right-radius: 100px;
}
.rounded-r-\[12px\] {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}
.rounded-r-full {
  border-top-right-radius: 9999px;
  border-bottom-right-radius: 9999px;
}
.rounded-r-md {
  border-top-right-radius: 0.375rem;
  border-bottom-right-radius: 0.375rem;
}
.rounded-r-none {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
.rounded-r-xl {
  border-top-right-radius: 0.75rem;
  border-bottom-right-radius: 0.75rem;
}
.rounded-s {
  border-start-start-radius: 0.25rem;
  border-end-start-radius: 0.25rem;
}
.rounded-t {
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}
.rounded-t-2xl {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}
.rounded-t-3xl {
  border-top-left-radius: 1.5rem;
  border-top-right-radius: 1.5rem;
}
.rounded-t-\[1\.5px\] {
  border-top-left-radius: 1.5px;
  border-top-right-radius: 1.5px;
}
.rounded-t-\[10px\] {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.rounded-t-\[12px\] {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}
.rounded-t-\[15px\] {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}
.rounded-t-\[2px\] {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
}
.rounded-t-\[4px\] {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.rounded-t-lg {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}
.rounded-t-md {
  border-top-left-radius: 0.375rem;
  border-top-right-radius: 0.375rem;
}
.rounded-t-xl {
  border-top-left-radius: 0.75rem;
  border-top-right-radius: 0.75rem;
}
.rounded-bl {
  border-bottom-left-radius: 0.25rem;
}
.rounded-bl-3xl {
  border-bottom-left-radius: 1.5rem;
}
.rounded-bl-\[8px\] {
  border-bottom-left-radius: 8px;
}
.rounded-bl-lg {
  border-bottom-left-radius: 0.5rem;
}
.rounded-bl-none {
  border-bottom-left-radius: 0px;
}
.rounded-bl-xl {
  border-bottom-left-radius: 0.75rem;
}
.rounded-br {
  border-bottom-right-radius: 0.25rem;
}
.rounded-br-2xl {
  border-bottom-right-radius: 1rem;
}
.rounded-br-\[8px\] {
  border-bottom-right-radius: 8px;
}
.rounded-br-none {
  border-bottom-right-radius: 0px;
}
.rounded-br-xl {
  border-bottom-right-radius: 0.75rem;
}
.rounded-ee {
  border-end-end-radius: 0.25rem;
}
.rounded-es {
  border-end-start-radius: 0.25rem;
}
.rounded-se {
  border-start-end-radius: 0.25rem;
}
.rounded-ss {
  border-start-start-radius: 0.25rem;
}
.rounded-tl {
  border-top-left-radius: 0.25rem;
}
.rounded-tl-lg {
  border-top-left-radius: 0.5rem;
}
.rounded-tl-md {
  border-top-left-radius: 0.375rem;
}
.rounded-tl-xl {
  border-top-left-radius: 0.75rem;
}
.rounded-tr {
  border-top-right-radius: 0.25rem;
}
.\!border {
  border-width: 1px !important;
}
.\!border-0 {
  border-width: 0px !important;
}
.border {
  border-width: 1px;
}
.border-0 {
  border-width: 0px;
}
.border-2 {
  border-width: 2px;
}
.border-4 {
  border-width: 4px;
}
.border-\[0\.5px\] {
  border-width: 0.5px;
}
.border-\[1\.5px\] {
  border-width: 1.5px;
}
.border-\[12px\] {
  border-width: 12px;
}
.border-\[1px\] {
  border-width: 1px;
}
.border-\[2px\] {
  border-width: 2px;
}
.border-\[4px\] {
  border-width: 4px;
}
.border-\[5px\] {
  border-width: 5px;
}
.border-\[6px\] {
  border-width: 6px;
}
.border-x {
  border-left-width: 1px;
  border-right-width: 1px;
}
.border-y {
  border-top-width: 1px;
  border-bottom-width: 1px;
}
.border-y-0 {
  border-top-width: 0px;
  border-bottom-width: 0px;
}
.\!border-b-2 {
  border-bottom-width: 2px !important;
}
.\!border-l {
  border-left-width: 1px !important;
}
.\!border-t {
  border-top-width: 1px !important;
}
.\!border-t-0 {
  border-top-width: 0px !important;
}
.border-b {
  border-bottom-width: 1px;
}
.border-b-2 {
  border-bottom-width: 2px;
}
.border-b-\[2px\] {
  border-bottom-width: 2px;
}
.border-b-\[7px\] {
  border-bottom-width: 7px;
}
.border-e {
  border-inline-end-width: 1px;
}
.border-l {
  border-left-width: 1px;
}
.border-l-0 {
  border-left-width: 0px;
}
.border-l-2 {
  border-left-width: 2px;
}
.border-l-4 {
  border-left-width: 4px;
}
.border-l-\[7px\] {
  border-left-width: 7px;
}
.border-r {
  border-right-width: 1px;
}
.border-r-0 {
  border-right-width: 0px;
}
.border-r-\[7px\] {
  border-right-width: 7px;
}
.border-s {
  border-inline-start-width: 1px;
}
.border-t {
  border-top-width: 1px;
}
.border-t-0 {
  border-top-width: 0px;
}
.border-t-2 {
  border-top-width: 2px;
}
.border-solid {
  border-style: solid;
}
.\!border-dashed {
  border-style: dashed !important;
}
.border-dashed {
  border-style: dashed;
}
.border-dotted {
  border-style: dotted;
}
.\!border-none {
  border-style: none !important;
}
.border-none {
  border-style: none;
}
.\!border-\[\#0b0f14\] {
  --tw-border-opacity: 1 !important;
  border-color: rgb(11 15 20 / var(--tw-border-opacity, 1)) !important;
}
.\!border-\[\#CED1D3\] {
  --tw-border-opacity: 1 !important;
  border-color: rgb(206 209 211 / var(--tw-border-opacity, 1)) !important;
}
.\!border-\[\#FFFFFF17\] {
  border-color: #FFFFFF17 !important;
}
.\!border-app-600 {
  --tw-border-opacity: 1 !important;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
}
.\!border-border-brand {
  --tw-border-opacity: 1 !important;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
}
.\!border-border-danger {
  --tw-border-opacity: 1 !important;
  border-color: rgb(220 38 38 / var(--tw-border-opacity, 1)) !important;
}
.\!border-border-primary {
  border-color: rgba(11, 15, 20, 0.20) !important;
}
.\!border-border-primary-inverted {
  --tw-border-opacity: 1 !important;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1)) !important;
}
.\!border-transparent {
  border-color: transparent !important;
}
.\!border-white {
  --tw-border-opacity: 1 !important;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1)) !important;
}
.border-\[\#00ff00\] {
  --tw-border-opacity: 1;
  border-color: rgb(0 255 0 / var(--tw-border-opacity, 1));
}
.border-\[\#0b0f14\] {
  --tw-border-opacity: 1;
  border-color: rgb(11 15 20 / var(--tw-border-opacity, 1));
}
.border-\[\#2563EB\] {
  --tw-border-opacity: 1;
  border-color: rgb(37 99 235 / var(--tw-border-opacity, 1));
}
.border-\[\#525252\] {
  --tw-border-opacity: 1;
  border-color: rgb(82 82 82 / var(--tw-border-opacity, 1));
}
.border-\[\#FFFFFF17\] {
  border-color: #FFFFFF17;
}
.border-\[\#b8c1cc\] {
  --tw-border-opacity: 1;
  border-color: rgb(184 193 204 / var(--tw-border-opacity, 1));
}
.border-\[\#e0e0e0\] {
  --tw-border-opacity: 1;
  border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
}
.border-\[rgba\(11\2c 15\2c 20\2c 0\.09\)\] {
  border-color: rgba(11,15,20,0.09);
}
.border-\[rgba\(11\2c 15\2c 20\2c 0\.12\)\] {
  border-color: rgba(11,15,20,0.12);
}
.border-\[rgba\(11\2c 15\2c 20\2c 0\.2\)\] {
  border-color: rgba(11,15,20,0.2);
}
.border-\[rgba\(143\2c 184\2c 255\2c 0\.3\)\] {
  border-color: rgba(143,184,255,0.3);
}
.border-\[rgba\(213\2c 51\2c 11\2c 0\)\] {
  border-color: rgba(213,51,11,0);
}
.border-\[rgba\(26\2c 26\2c 26\2c 0\.2\)\] {
  border-color: rgba(26,26,26,0.2);
}
.border-\[rgba\(26\2c 26\2c 26\2c 0\.55\)\] {
  border-color: rgba(26,26,26,0.55);
}
.border-alpha-light-100 {
  border-color: rgba(26, 26, 26, 0.09);
}
.border-alpha-light-50 {
  border-color: rgba(26, 26, 26, 0.06);
}
.border-amber-100 {
  --tw-border-opacity: 1;
  border-color: rgb(254 249 195 / var(--tw-border-opacity, 1));
}
.border-amber-300 {
  --tw-border-opacity: 1;
  border-color: rgb(253 224 71 / var(--tw-border-opacity, 1));
}
.border-app-100 {
  --tw-border-opacity: 1;
  border-color: rgb(191 213 252 / var(--tw-border-opacity, 1));
}
.border-app-200 {
  --tw-border-opacity: 1;
  border-color: rgb(148 187 255 / var(--tw-border-opacity, 1));
}
.border-app-300 {
  --tw-border-opacity: 1;
  border-color: rgb(105 160 255 / var(--tw-border-opacity, 1));
}
.border-app-500 {
  --tw-border-opacity: 1;
  border-color: rgb(0 94 255 / var(--tw-border-opacity, 1));
}
.border-app-600 {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.border-app-650 {
  --tw-border-opacity: 1;
  border-color: rgb(0 77 209 / var(--tw-border-opacity, 1));
}
.border-bg-default-primary {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.border-bg-primary {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.border-bg-primary-inverted {
  --tw-border-opacity: 1;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
}
.border-bg-quaternary {
  --tw-border-opacity: 1;
  border-color: rgb(229 229 229 / var(--tw-border-opacity, 1));
}
.border-black {
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0 / var(--tw-border-opacity, 1));
}
.border-blue-200 {
  --tw-border-opacity: 1;
  border-color: rgb(191 219 254 / var(--tw-border-opacity, 1));
}
.border-blue-400 {
  --tw-border-opacity: 1;
  border-color: rgb(96 165 250 / var(--tw-border-opacity, 1));
}
.border-blue-500 {
  --tw-border-opacity: 1;
  border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));
}
.border-blue-600 {
  --tw-border-opacity: 1;
  border-color: rgb(37 99 235 / var(--tw-border-opacity, 1));
}
.border-border-brand {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.border-border-brand-secondary {
  --tw-border-opacity: 1;
  border-color: rgb(143 184 255 / var(--tw-border-opacity, 1));
}
.border-border-danger {
  --tw-border-opacity: 1;
  border-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
}
.border-border-danger-secondary {
  --tw-border-opacity: 1;
  border-color: rgb(254 202 202 / var(--tw-border-opacity, 1));
}
.border-border-info-secondary {
  --tw-border-opacity: 1;
  border-color: rgb(191 219 254 / var(--tw-border-opacity, 1));
}
.border-border-neutral {
  --tw-border-opacity: 1;
  border-color: rgb(10 10 10 / var(--tw-border-opacity, 1));
}
.border-border-primary {
  border-color: rgba(11, 15, 20, 0.20);
}
.border-border-primary-inverted {
  --tw-border-opacity: 1;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
}
.border-border-primary-inverted\/25 {
  border-color: rgb(10 25 37 / 0.25);
}
.border-border-quaternary {
  --tw-border-opacity: 1;
  border-color: rgb(212 212 212 / var(--tw-border-opacity, 1));
}
.border-border-secondary {
  border-color: rgba(11, 15, 20, 0.09);
}
.border-border-secondary-inverted {
  border-color: rgba(10, 25, 37, 0.48);
}
.border-border-secondary\/10 {
  border-color: rgba(11, 15, 20, 0.1);
}
.border-border-success-secondary {
  --tw-border-opacity: 1;
  border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));
}
.border-border-tertiary {
  border-color: rgba(11, 15, 20, 0.06);
}
.border-border-warning-secondary {
  --tw-border-opacity: 1;
  border-color: rgb(254 240 138 / var(--tw-border-opacity, 1));
}
.border-darkblue-500\/30 {
  border-color: rgb(25 51 81 / 0.3);
}
.border-darkblue-500\/40 {
  border-color: rgb(25 51 81 / 0.4);
}
.border-gray-100 {
  --tw-border-opacity: 1;
  border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
}
.border-gray-200 {
  --tw-border-opacity: 1;
  border-color: rgb(198 198 198 / var(--tw-border-opacity, 1));
}
.border-gray-200\/80 {
  border-color: rgb(198 198 198 / 0.8);
}
.border-gray-300 {
  --tw-border-opacity: 1;
  border-color: rgb(168 168 168 / var(--tw-border-opacity, 1));
}
.border-gray-400 {
  --tw-border-opacity: 1;
  border-color: rgb(141 141 141 / var(--tw-border-opacity, 1));
}
.border-gray-50 {
  --tw-border-opacity: 1;
  border-color: rgb(244 244 244 / var(--tw-border-opacity, 1));
}
.border-gray-500 {
  --tw-border-opacity: 1;
  border-color: rgb(111 111 111 / var(--tw-border-opacity, 1));
}
.border-gray-600 {
  --tw-border-opacity: 1;
  border-color: rgb(82 82 82 / var(--tw-border-opacity, 1));
}
.border-gray-700 {
  --tw-border-opacity: 1;
  border-color: rgb(57 57 57 / var(--tw-border-opacity, 1));
}
.border-gray-800 {
  --tw-border-opacity: 1;
  border-color: rgb(38 38 38 / var(--tw-border-opacity, 1));
}
.border-gray-900 {
  --tw-border-opacity: 1;
  border-color: rgb(22 22 22 / var(--tw-border-opacity, 1));
}
.border-green-200 {
  --tw-border-opacity: 1;
  border-color: rgb(189 231 203 / var(--tw-border-opacity, 1));
}
.border-green-400 {
  --tw-border-opacity: 1;
  border-color: rgb(71 190 112 / var(--tw-border-opacity, 1));
}
.border-green-600 {
  --tw-border-opacity: 1;
  border-color: rgb(1 140 60 / var(--tw-border-opacity, 1));
}
.border-indigo-200 {
  --tw-border-opacity: 1;
  border-color: rgb(199 210 254 / var(--tw-border-opacity, 1));
}
.border-indigo-300 {
  --tw-border-opacity: 1;
  border-color: rgb(165 180 252 / var(--tw-border-opacity, 1));
}
.border-indigo-600 {
  --tw-border-opacity: 1;
  border-color: rgb(79 70 229 / var(--tw-border-opacity, 1));
}
.border-red-200 {
  --tw-border-opacity: 1;
  border-color: rgb(254 202 202 / var(--tw-border-opacity, 1));
}
.border-red-300 {
  --tw-border-opacity: 1;
  border-color: rgb(252 165 165 / var(--tw-border-opacity, 1));
}
.border-red-500 {
  --tw-border-opacity: 1;
  border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));
}
.border-red-600 {
  --tw-border-opacity: 1;
  border-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
}
.border-success-50 {
  --tw-border-opacity: 1;
  border-color: rgb(239 249 242 / var(--tw-border-opacity, 1));
}
.border-text-brand {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.border-text-primary {
  --tw-border-opacity: 1;
  border-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.border-text-tertiary {
  --tw-border-opacity: 1;
  border-color: rgb(163 163 163 / var(--tw-border-opacity, 1));
}
.border-text-white\/20 {
  border-color: rgb(255 255 255 / 0.2);
}
.border-text-white\/40 {
  border-color: rgb(255 255 255 / 0.4);
}
.border-transparent {
  border-color: transparent;
}
.border-white {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.border-white\/\[0\.14\] {
  border-color: rgb(255 255 255 / 0.14);
}
.\!border-b-gray-700 {
  --tw-border-opacity: 1 !important;
  border-bottom-color: rgb(57 57 57 / var(--tw-border-opacity, 1)) !important;
}
.\!border-l-gray-700 {
  --tw-border-opacity: 1 !important;
  border-left-color: rgb(57 57 57 / var(--tw-border-opacity, 1)) !important;
}
.\!border-r-gray-700 {
  --tw-border-opacity: 1 !important;
  border-right-color: rgb(57 57 57 / var(--tw-border-opacity, 1)) !important;
}
.\!border-t-gray-700 {
  --tw-border-opacity: 1 !important;
  border-top-color: rgb(57 57 57 / var(--tw-border-opacity, 1)) !important;
}
.border-b-black {
  --tw-border-opacity: 1;
  border-bottom-color: rgb(0 0 0 / var(--tw-border-opacity, 1));
}
.border-b-gray-900 {
  --tw-border-opacity: 1;
  border-bottom-color: rgb(22 22 22 / var(--tw-border-opacity, 1));
}
.border-l-bg-blackout {
  --tw-border-opacity: 1;
  border-left-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.border-l-gray-800 {
  --tw-border-opacity: 1;
  border-left-color: rgb(38 38 38 / var(--tw-border-opacity, 1));
}
.border-l-gray-900 {
  --tw-border-opacity: 1;
  border-left-color: rgb(22 22 22 / var(--tw-border-opacity, 1));
}
.border-l-transparent {
  border-left-color: transparent;
}
.border-r-gray-800 {
  --tw-border-opacity: 1;
  border-right-color: rgb(38 38 38 / var(--tw-border-opacity, 1));
}
.border-r-gray-900 {
  --tw-border-opacity: 1;
  border-right-color: rgb(22 22 22 / var(--tw-border-opacity, 1));
}
.border-r-transparent {
  border-right-color: transparent;
}
.border-t-\[\#2F5EE9\] {
  --tw-border-opacity: 1;
  border-top-color: rgb(47 94 233 / var(--tw-border-opacity, 1));
}
.border-t-border-brand {
  --tw-border-opacity: 1;
  border-top-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.border-t-border-tertiary {
  border-top-color: rgba(11, 15, 20, 0.06);
}
.border-t-gray-900 {
  --tw-border-opacity: 1;
  border-top-color: rgb(22 22 22 / var(--tw-border-opacity, 1));
}
.border-t-text-brand {
  --tw-border-opacity: 1;
  border-top-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.border-t-text-primary {
  --tw-border-opacity: 1;
  border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.border-t-text-secondary {
  --tw-border-opacity: 1;
  border-top-color: rgb(82 82 82 / var(--tw-border-opacity, 1));
}
.border-t-transparent {
  border-top-color: transparent;
}
.border-t-white {
  --tw-border-opacity: 1;
  border-top-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}
.\!border-opacity-20 {
  --tw-border-opacity: 0.2 !important;
}
.border-opacity-10 {
  --tw-border-opacity: 0.1;
}
.border-opacity-20 {
  --tw-border-opacity: 0.2;
}
.border-opacity-40 {
  --tw-border-opacity: 0.4;
}
.border-opacity-60 {
  --tw-border-opacity: 0.6;
}
.\!bg-\[\#000\] {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-\[\#212D3B\] {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(33 45 59 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-\[\#E6E8E9\] {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(230 232 233 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-\[\#ede9fe\] {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(237 233 254 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-alpha-light-100 {
  background-color: rgba(26, 26, 26, 0.09) !important;
}
.\!bg-app-100 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(191 213 252 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-app-50 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-app-500 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-default-alpha-800 {
  background-color: rgba(255, 255, 255, 0.8) !important;
}
.\!bg-bg-default-primary {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-default-secondary {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-elevated {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-primary {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-primary-inverted {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-quaternary {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-bg-secondary {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-blue-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-gray-100 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-gray-200 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-gray-300 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(168 168 168 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-gray-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(82 82 82 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-gray-700 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(57 57 57 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-gray-900 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-green-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(1 140 60 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-indigo-500 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(99 102 241 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-orange-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(234 88 12 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-ppt-500 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(208 68 35 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-purple-100 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-red-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1)) !important;
}
.\!bg-transparent {
  background-color: transparent !important;
}
.\!bg-white {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.bg-\[\#000205\] {
  --tw-bg-opacity: 1;
  background-color: rgb(0 2 5 / var(--tw-bg-opacity, 1));
}
.bg-\[\#000\] {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.bg-\[\#0040FF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(0 64 255 / var(--tw-bg-opacity, 1));
}
.bg-\[\#01AB4A\] {
  --tw-bg-opacity: 1;
  background-color: rgb(1 171 74 / var(--tw-bg-opacity, 1));
}
.bg-\[\#0284C7\] {
  --tw-bg-opacity: 1;
  background-color: rgb(2 132 199 / var(--tw-bg-opacity, 1));
}
.bg-\[\#0285FF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(2 133 255 / var(--tw-bg-opacity, 1));
}
.bg-\[\#040404\] {
  --tw-bg-opacity: 1;
  background-color: rgb(4 4 4 / var(--tw-bg-opacity, 1));
}
.bg-\[\#0A66C2\] {
  --tw-bg-opacity: 1;
  background-color: rgb(10 102 194 / var(--tw-bg-opacity, 1));
}
.bg-\[\#0F46C4\] {
  --tw-bg-opacity: 1;
  background-color: rgb(15 70 196 / var(--tw-bg-opacity, 1));
}
.bg-\[\#141414\] {
  --tw-bg-opacity: 1;
  background-color: rgb(20 20 20 / var(--tw-bg-opacity, 1));
}
.bg-\[\#14222C\] {
  --tw-bg-opacity: 1;
  background-color: rgb(20 34 44 / var(--tw-bg-opacity, 1));
}
.bg-\[\#16A34A\] {
  --tw-bg-opacity: 1;
  background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
}
.bg-\[\#1877F2\] {
  --tw-bg-opacity: 1;
  background-color: rgb(24 119 242 / var(--tw-bg-opacity, 1));
}
.bg-\[\#212D3B\] {
  --tw-bg-opacity: 1;
  background-color: rgb(33 45 59 / var(--tw-bg-opacity, 1));
}
.bg-\[\#2563EB\] {
  --tw-bg-opacity: 1;
  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
}
.bg-\[\#2967B0\] {
  --tw-bg-opacity: 1;
  background-color: rgb(41 103 176 / var(--tw-bg-opacity, 1));
}
.bg-\[\#2B3B4F\] {
  --tw-bg-opacity: 1;
  background-color: rgb(43 59 79 / var(--tw-bg-opacity, 1));
}
.bg-\[\#2F5EE9CC\] {
  background-color: #2F5EE9CC;
}
.bg-\[\#2f5ee980\] {
  background-color: #2f5ee980;
}
.bg-\[\#3498E2\] {
  --tw-bg-opacity: 1;
  background-color: rgb(52 152 226 / var(--tw-bg-opacity, 1));
}
.bg-\[\#3574BA\] {
  --tw-bg-opacity: 1;
  background-color: rgb(53 116 186 / var(--tw-bg-opacity, 1));
}
.bg-\[\#36A3FE\] {
  --tw-bg-opacity: 1;
  background-color: rgb(54 163 254 / var(--tw-bg-opacity, 1));
}
.bg-\[\#3D8CE6\] {
  --tw-bg-opacity: 1;
  background-color: rgb(61 140 230 / var(--tw-bg-opacity, 1));
}
.bg-\[\#7335D599\] {
  background-color: #7335D599;
}
.bg-\[\#7335d566\] {
  background-color: #7335d566;
}
.bg-\[\#9333EA\] {
  --tw-bg-opacity: 1;
  background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
}
.bg-\[\#9D4FE6\] {
  --tw-bg-opacity: 1;
  background-color: rgb(157 79 230 / var(--tw-bg-opacity, 1));
}
.bg-\[\#ABC8DB\] {
  --tw-bg-opacity: 1;
  background-color: rgb(171 200 219 / var(--tw-bg-opacity, 1));
}
.bg-\[\#D04423\] {
  --tw-bg-opacity: 1;
  background-color: rgb(208 68 35 / var(--tw-bg-opacity, 1));
}
.bg-\[\#D0E2FF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(208 226 255 / var(--tw-bg-opacity, 1));
}
.bg-\[\#D1FAE5\] {
  --tw-bg-opacity: 1;
  background-color: rgb(209 250 229 / var(--tw-bg-opacity, 1));
}
.bg-\[\#D35230\] {
  --tw-bg-opacity: 1;
  background-color: rgb(211 82 48 / var(--tw-bg-opacity, 1));
}
.bg-\[\#DAF0FF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(218 240 255 / var(--tw-bg-opacity, 1));
}
.bg-\[\#E6F3FF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(230 243 255 / var(--tw-bg-opacity, 1));
}
.bg-\[\#E9652F\] {
  --tw-bg-opacity: 1;
  background-color: rgb(233 101 47 / var(--tw-bg-opacity, 1));
}
.bg-\[\#EB5E2A\] {
  --tw-bg-opacity: 1;
  background-color: rgb(235 94 42 / var(--tw-bg-opacity, 1));
}
.bg-\[\#EDFFF2\] {
  --tw-bg-opacity: 1;
  background-color: rgb(237 255 242 / var(--tw-bg-opacity, 1));
}
.bg-\[\#EEEEEE\] {
  --tw-bg-opacity: 1;
  background-color: rgb(238 238 238 / var(--tw-bg-opacity, 1));
}
.bg-\[\#EEF2F6\] {
  --tw-bg-opacity: 1;
  background-color: rgb(238 242 246 / var(--tw-bg-opacity, 1));
}
.bg-\[\#F5BB19\] {
  --tw-bg-opacity: 1;
  background-color: rgb(245 187 25 / var(--tw-bg-opacity, 1));
}
.bg-\[\#F7F7F7\] {
  --tw-bg-opacity: 1;
  background-color: rgb(247 247 247 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FA3913B2\] {
  background-color: #FA3913B2;
}
.bg-\[\#FA423E\] {
  --tw-bg-opacity: 1;
  background-color: rgb(250 66 62 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FAF5FF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(250 245 255 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FCF8EF\] {
  --tw-bg-opacity: 1;
  background-color: rgb(252 248 239 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FF6A00\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 106 0 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFCDBC\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 205 188 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFD92C\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 217 44 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFE9E8\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 233 232 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFF3F0\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 243 240 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFF6DC\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 246 220 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFF7ED\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 247 237 / var(--tw-bg-opacity, 1));
}
.bg-\[\#FFF8E1\] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 248 225 / var(--tw-bg-opacity, 1));
}
.bg-\[\#Fafafa\] {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.bg-\[\#eef2f6\] {
  --tw-bg-opacity: 1;
  background-color: rgb(238 242 246 / var(--tw-bg-opacity, 1));
}
.bg-\[\#f2f5f9\] {
  --tw-bg-opacity: 1;
  background-color: rgb(242 245 249 / var(--tw-bg-opacity, 1));
}
.bg-\[\#f5f5f5\] {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}
.bg-\[rgba\(10\2c 25\2c 37\2c 0\.08\)\] {
  background-color: rgba(10,25,37,0.08);
}
.bg-\[rgba\(11\2c 15\2c 20\2c 0\.04\)\] {
  background-color: rgba(11,15,20,0.04);
}
.bg-\[rgba\(11\2c 15\2c 20\2c 0\.09\)\] {
  background-color: rgba(11,15,20,0.09);
}
.bg-\[rgba\(115\2c 53\2c 213\2c 0\.40\)\] {
  background-color: rgba(115,53,213,0.40);
}
.bg-\[rgba\(157\2c 79\2c 230\2c 0\.40\)\] {
  background-color: rgba(157,79,230,0.40);
}
.bg-\[rgba\(22\2c 22\2c 22\2c 0\.40\)\] {
  background-color: rgba(22,22,22,0.40);
}
.bg-\[rgba\(22\2c 22\2c 22\2c 0\.60\)\] {
  background-color: rgba(22,22,22,0.60);
}
.bg-\[rgba\(250\2c 250\2c 252\2c 0\.7\)\] {
  background-color: rgba(250,250,252,0.7);
}
.bg-\[rgba\(26\2c 26\2c 26\2c 0\.03\)\] {
  background-color: rgba(26,26,26,0.03);
}
.bg-\[rgba\(26\2c 26\2c 26\2c 0\.06\)\] {
  background-color: rgba(26,26,26,0.06);
}
.bg-\[rgba\(47\2c 94\2c 233\2c 0\.50\)\] {
  background-color: rgba(47,94,233,0.50);
}
.bg-\[rgba\(57\2c 57\2c 57\2c 0\.30\)\] {
  background-color: rgba(57,57,57,0.30);
}
.bg-\[rgba\(61\2c 140\2c 230\2c 0\.20\)\] {
  background-color: rgba(61,140,230,0.20);
}
.bg-alpha-light-100 {
  background-color: rgba(26, 26, 26, 0.09);
}
.bg-alpha-light-50 {
  background-color: rgba(26, 26, 26, 0.06);
}
.bg-amber-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 249 195 / var(--tw-bg-opacity, 1));
}
.bg-amber-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1));
}
.bg-app-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(191 213 252 / var(--tw-bg-opacity, 1));
}
.bg-app-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(148 187 255 / var(--tw-bg-opacity, 1));
}
.bg-app-300 {
  --tw-bg-opacity: 1;
  background-color: rgb(105 160 255 / var(--tw-bg-opacity, 1));
}
.bg-app-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(60 130 255 / var(--tw-bg-opacity, 1));
}
.bg-app-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1));
}
.bg-app-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
}
.bg-app-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.bg-app-650 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 77 209 / var(--tw-bg-opacity, 1));
}
.bg-app-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 67 184 / var(--tw-bg-opacity, 1));
}
.bg-app-75 {
  --tw-bg-opacity: 1;
  background-color: rgb(214 229 255 / var(--tw-bg-opacity, 1));
}
.bg-app-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(4 52 133 / var(--tw-bg-opacity, 1));
}
.bg-app-900 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 34 92 / var(--tw-bg-opacity, 1));
}
.bg-bg-blackout {
  --tw-bg-opacity: 1;
  background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
}
.bg-bg-brand {
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.bg-bg-brand-hover {
  --tw-bg-opacity: 1;
  background-color: rgb(0 67 184 / var(--tw-bg-opacity, 1));
}
.bg-bg-brand-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1));
}
.bg-bg-brand-pressed {
  --tw-bg-opacity: 1;
  background-color: rgb(0 47 128 / var(--tw-bg-opacity, 1));
}
.bg-bg-brand-selected {
  background-color: rgba(0, 85, 237, 0.12);
}
.bg-bg-brand\/5 {
  background-color: rgb(0 85 237 / 0.05);
}
.bg-bg-danger {
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}
.bg-bg-danger-hover {
  --tw-bg-opacity: 1;
  background-color: rgb(185 28 28 / var(--tw-bg-opacity, 1));
}
.bg-bg-danger-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}
.bg-bg-danger-pressed {
  --tw-bg-opacity: 1;
  background-color: rgb(153 27 27 / var(--tw-bg-opacity, 1));
}
.bg-bg-default-alpha-800 {
  background-color: rgba(255, 255, 255, 0.8);
}
.bg-bg-default-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-bg-default-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.bg-bg-default-tertiary {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}
.bg-bg-elevated {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-bg-elevated-hover {
  background-color: rgba(11, 15, 20, 0.08);
}
.bg-bg-elevated\/40 {
  background-color: rgb(255 255 255 / 0.4);
}
.bg-bg-elevated\/70 {
  background-color: rgb(255 255 255 / 0.7);
}
.bg-bg-elevation-hover {
  background-color: rgba(26, 26, 26, 0.12);
}
.bg-bg-info {
  --tw-bg-opacity: 1;
  background-color: rgb(12 75 255 / var(--tw-bg-opacity, 1));
}
.bg-bg-info-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(232 247 255 / var(--tw-bg-opacity, 1));
}
.bg-bg-muted {
  --tw-bg-opacity: 1;
  background-color: rgb(249 249 249 / var(--tw-bg-opacity, 1));
}
.bg-bg-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-bg-primary-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
.bg-bg-primary-inverted-hover {
  --tw-bg-opacity: 1;
  background-color: rgb(35 48 59 / var(--tw-bg-opacity, 1));
}
.bg-bg-primary-inverted\/40 {
  background-color: rgb(10 25 37 / 0.4);
}
.bg-bg-primary-inverted\/50 {
  background-color: rgb(10 25 37 / 0.5);
}
.bg-bg-primary-inverted\/60 {
  background-color: rgb(10 25 37 / 0.6);
}
.bg-bg-primary\/85 {
  background-color: rgb(255 255 255 / 0.85);
}
.bg-bg-quaternary {
  --tw-bg-opacity: 1;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1));
}
.bg-bg-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.bg-bg-secondary-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(28 53 80 / var(--tw-bg-opacity, 1));
}
.bg-bg-subtle {
  --tw-bg-opacity: 1;
  background-color: rgb(252 252 252 / var(--tw-bg-opacity, 1));
}
.bg-bg-success {
  --tw-bg-opacity: 1;
  background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
}
.bg-bg-success-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
}
.bg-bg-tertiary {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}
.bg-bg-tertiary-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(40 75 113 / var(--tw-bg-opacity, 1));
}
.bg-bg-warning {
  --tw-bg-opacity: 1;
  background-color: rgb(240 177 0 / var(--tw-bg-opacity, 1));
}
.bg-bg-warning-inverted {
  --tw-bg-opacity: 1;
  background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1));
}
.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}
.bg-black\/40 {
  background-color: rgb(0 0 0 / 0.4);
}
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}
.bg-black\/55 {
  background-color: rgb(0 0 0 / 0.55);
}
.bg-black\/60 {
  background-color: rgb(0 0 0 / 0.6);
}
.bg-black\/80 {
  background-color: rgb(0 0 0 / 0.8);
}
.bg-black\/\[0\.08\] {
  background-color: rgb(0 0 0 / 0.08);
}
.bg-blue-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(219 234 254 / var(--tw-bg-opacity, 1));
}
.bg-blue-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(191 219 254 / var(--tw-bg-opacity, 1));
}
.bg-blue-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1));
}
.bg-blue-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));
}
.bg-blue-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
}
.bg-border-primary {
  background-color: rgba(11, 15, 20, 0.20);
}
.bg-border-secondary {
  background-color: rgba(11, 15, 20, 0.09);
}
.bg-border-success-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(187 247 208 / var(--tw-bg-opacity, 1));
}
.bg-border-tertiary {
  background-color: rgba(11, 15, 20, 0.06);
}
.bg-current {
  background-color: currentColor;
}
.bg-darkblue-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(25 51 81 / var(--tw-bg-opacity, 1));
}
.bg-darkblue-500\/10 {
  background-color: rgb(25 51 81 / 0.1);
}
.bg-darkblue-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(15 35 58 / var(--tw-bg-opacity, 1));
}
.bg-gold-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(251 190 40 / var(--tw-bg-opacity, 1));
}
.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
.bg-gray-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1));
}
.bg-gray-25 {
  --tw-bg-opacity: 1;
  background-color: rgb(246 246 246 / var(--tw-bg-opacity, 1));
}
.bg-gray-300 {
  --tw-bg-opacity: 1;
  background-color: rgb(168 168 168 / var(--tw-bg-opacity, 1));
}
.bg-gray-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(141 141 141 / var(--tw-bg-opacity, 1));
}
.bg-gray-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
.bg-gray-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(111 111 111 / var(--tw-bg-opacity, 1));
}
.bg-gray-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(82 82 82 / var(--tw-bg-opacity, 1));
}
.bg-gray-700 {
  --tw-bg-opacity: 1;
  background-color: rgb(57 57 57 / var(--tw-bg-opacity, 1));
}
.bg-gray-75 {
  --tw-bg-opacity: 1;
  background-color: rgb(236 236 236 / var(--tw-bg-opacity, 1));
}
.bg-gray-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
}
.bg-gray-850 {
  --tw-bg-opacity: 1;
  background-color: rgb(27 27 27 / var(--tw-bg-opacity, 1));
}
.bg-gray-900 {
  --tw-bg-opacity: 1;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
}
.bg-gray-900\/50 {
  background-color: rgb(22 22 22 / 0.5);
}
.bg-gray-950 {
  --tw-bg-opacity: 1;
  background-color: rgb(10 10 10 / var(--tw-bg-opacity, 1));
}
.bg-green-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(218 241 226 / var(--tw-bg-opacity, 1));
}
.bg-green-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(71 190 112 / var(--tw-bg-opacity, 1));
}
.bg-green-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(239 249 242 / var(--tw-bg-opacity, 1));
}
.bg-green-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 164 73 / var(--tw-bg-opacity, 1));
}
.bg-green-500\/10 {
  background-color: rgb(0 164 73 / 0.1);
}
.bg-indigo-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(224 231 255 / var(--tw-bg-opacity, 1));
}
.bg-indigo-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(129 140 248 / var(--tw-bg-opacity, 1));
}
.bg-indigo-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(238 242 255 / var(--tw-bg-opacity, 1));
}
.bg-indigo-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(99 102 241 / var(--tw-bg-opacity, 1));
}
.bg-indigo-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(79 70 229 / var(--tw-bg-opacity, 1));
}
.bg-orange-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(255 247 237 / var(--tw-bg-opacity, 1));
}
.bg-ppt-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(250 231 223 / var(--tw-bg-opacity, 1));
}
.bg-ppt-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(255 243 240 / var(--tw-bg-opacity, 1));
}
.bg-ppt-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(208 68 35 / var(--tw-bg-opacity, 1));
}
.bg-ppt-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(196 62 28 / var(--tw-bg-opacity, 1));
}
.bg-profile-app-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(2 132 199 / var(--tw-bg-opacity, 1));
}
.bg-purple-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1));
}
.bg-purple-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(250 245 255 / var(--tw-bg-opacity, 1));
}
.bg-purple-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
}
.bg-red-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
}
.bg-red-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}
.bg-red-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
}
.bg-red-500\/10 {
  background-color: rgb(239 68 68 / 0.1);
}
.bg-red-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));
}
.bg-success-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(218 241 226 / var(--tw-bg-opacity, 1));
}
.bg-success-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(239 249 242 / var(--tw-bg-opacity, 1));
}
.bg-success-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(1 140 60 / var(--tw-bg-opacity, 1));
}
.bg-text-brand {
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.bg-text-inverted-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-text-primary {
  --tw-bg-opacity: 1;
  background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
}
.bg-text-tertiary {
  --tw-bg-opacity: 1;
  background-color: rgb(163 163 163 / var(--tw-bg-opacity, 1));
}
.bg-transparent {
  background-color: transparent;
}
.bg-violet-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(237 233 254 / var(--tw-bg-opacity, 1));
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.bg-white\/0 {
  background-color: rgb(255 255 255 / 0);
}
.bg-white\/10 {
  background-color: rgb(255 255 255 / 0.1);
}
.bg-white\/30 {
  background-color: rgb(255 255 255 / 0.3);
}
.bg-white\/40 {
  background-color: rgb(255 255 255 / 0.4);
}
.bg-white\/50 {
  background-color: rgb(255 255 255 / 0.5);
}
.bg-white\/60 {
  background-color: rgb(255 255 255 / 0.6);
}
.bg-white\/80 {
  background-color: rgb(255 255 255 / 0.8);
}
.bg-white\/95 {
  background-color: rgb(255 255 255 / 0.95);
}
.\!bg-opacity-30 {
  --tw-bg-opacity: 0.3 !important;
}
.\!bg-opacity-40 {
  --tw-bg-opacity: 0.4 !important;
}
.\!bg-opacity-50 {
  --tw-bg-opacity: 0.5 !important;
}
.bg-opacity-0 {
  --tw-bg-opacity: 0;
}
.bg-opacity-10 {
  --tw-bg-opacity: 0.1;
}
.bg-opacity-20 {
  --tw-bg-opacity: 0.2;
}
.bg-opacity-30 {
  --tw-bg-opacity: 0.3;
}
.bg-opacity-40 {
  --tw-bg-opacity: 0.4;
}
.bg-opacity-5 {
  --tw-bg-opacity: 0.05;
}
.bg-opacity-50 {
  --tw-bg-opacity: 0.5;
}
.bg-opacity-60 {
  --tw-bg-opacity: 0.6;
}
.bg-opacity-70 {
  --tw-bg-opacity: 0.7;
}
.bg-opacity-75 {
  --tw-bg-opacity: 0.75;
}
.bg-opacity-80 {
  --tw-bg-opacity: 0.8;
}
.bg-opacity-90 {
  --tw-bg-opacity: 0.9;
}
.bg-opacity-\[0\.001\] {
  --tw-bg-opacity: 0.001;
}
.bg-opacity-\[0\.08\] {
  --tw-bg-opacity: 0.08;
}
.bg-opacity-\[0\.15\] {
  --tw-bg-opacity: 0.15;
}
.bg-opacity-\[0\.1\] {
  --tw-bg-opacity: 0.1;
}
.\!bg-gradient-03 {
  background-image: linear-gradient(275.68deg, rgba(58, 142, 230, 0.2) 0%, rgba(192, 58, 231, 0.2) 100%) !important;
}
.bg-\[linear-gradient\(101deg\2c _\#6F7378_8\.29\%\2c _\#CDCDCD_55\.21\%\2c _\#4F5054_96\.51\%\)\] {
  background-image: linear-gradient(101deg, #6F7378 8.29%, #CDCDCD 55.21%, #4F5054 96.51%);
}
.bg-\[linear-gradient\(147deg\2c \#FFF_2\.19\%\2c \#EEF2F6_98\.14\%\)\] {
  background-image: linear-gradient(147deg,#FFF 2.19%,#EEF2F6 98.14%);
}
.bg-\[linear-gradient\(180deg\2c \#3084CD_0\%\2c \#62B8F2_30\%\2c \#99D8FB_55\%\2c \#B5E3FD_80\%\2c \#BDE6FD_100\%\)\] {
  background-image: linear-gradient(180deg,#3084CD 0%,#62B8F2 30%,#99D8FB 55%,#B5E3FD 80%,#BDE6FD 100%);
}
.bg-\[linear-gradient\(270deg\2c rgb\(244\2c 244\2c 244\)85\.6\%\2c rgba\(244\2c 244\2c 244\2c 0\.00\)93\.82\%\)\] {
  background-image: linear-gradient(270deg,rgb(244,244,244)85.6%,rgba(244,244,244,0.00)93.82%);
}
.bg-\[linear-gradient\(270deg\2c rgb\(255\2c 255\2c 255\)85\%\2c rgba\(255\2c 255\2c 255\2c 0\.00\)125\%\)\] {
  background-image: linear-gradient(270deg,rgb(255,255,255)85%,rgba(255,255,255,0.00)125%);
}
.bg-gradient-01 {
  background-image: linear-gradient(275.68deg, #3A8EE6 0%, #C03AE7 100%);
}
.bg-gradient-02 {
  background-image: linear-gradient(274.01deg, #7732D3 0%, #2563EB 105.01%);
}
.bg-gradient-03 {
  background-image: linear-gradient(275.68deg, rgba(58, 142, 230, 0.2) 0%, rgba(192, 58, 231, 0.2) 100%);
}
.bg-gradient-05 {
  background-image: linear-gradient(275.68deg, rgba(58, 142, 230, 0.1) 0%, rgba(192, 58, 231, 0.1) 100%);
}
.bg-gradient-06 {
  background-image: linear-gradient(229deg, rgba(63, 225, 176, 0.10) -2.97%, rgba(0, 179, 244, 0.10) 34.14%, rgba(3, 176, 244, 0.10) 35.51%, rgba(85, 97, 233, 0.10) 71.8%, rgba(117, 66, 229, 0.10) 88.43%);
}
.bg-gradient-07 {
  background-image: linear-gradient(90deg, #AE49F6 0%, #2941F5 100%);
}
.bg-gradient-basic {
  background-image: linear-gradient(101deg, #6F7378 8.29%, #CDCDCD 55.21%, #4F5054 96.51%);
}
.bg-gradient-brand-01 {
  background-image: linear-gradient(90deg, #2ABFFF -58.35%, #3E5DF7 22.24%, #9C4CFF 75.71%, #E14CFF 99.69%);
}
.bg-gradient-brand-02 {
  background-image: linear-gradient(274deg, #7732D3 0%, #2563EB 105.01%);
}
.bg-gradient-brand-03 {
  background-image: radial-gradient(145.58% 149.6% at 29.59% -25%, var(--brand-100, #C2D8FF) 0%, var(--brand-300, #5291FF) 31.73%, var(--brand-600, #0055ED) 76.78%, var(--brand-900, #00225C) 100%);
}
.bg-gradient-brand-04 {
  background-image: linear-gradient(90deg, #00225C 0%, #003C9E 24%, #0055ED 50%, #0F60EF 66%, #1C6BF3 78%, #2A75F6 91.83%, #74A6FF 100%);
}
.bg-gradient-gold {
  background-image: linear-gradient(90deg, #FFDB82 0%, #FCB813 100%);
}
.bg-gradient-primary-button {
  background-image: linear-gradient(180deg, #1C3550 0%, #0A1925 100%);
}
.bg-gradient-pro {
  background-image: linear-gradient(101deg, #652CD1 8.29%, #3362E9 91.71%);
}
.bg-gradient-to-b {
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
}
.bg-gradient-to-br {
  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}
.bg-gradient-to-l {
  background-image: linear-gradient(to left, var(--tw-gradient-stops));
}
.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}
.from-\[\#EEF2FF\] {
  --tw-gradient-from: #EEF2FF var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(238 242 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-amber-50 {
  --tw-gradient-from: #fefce8 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(254 252 232 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-bg-info-inverted {
  --tw-gradient-from: #E8F7FF var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(232 247 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-bg-primary {
  --tw-gradient-from: #ffffff var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-blue-50 {
  --tw-gradient-from: #eff6ff var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(239 246 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-green-50 {
  --tw-gradient-from: #EFF9F2 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(239 249 242 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-green-600 {
  --tw-gradient-from: #018C3C var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(1 140 60 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-indigo-500 {
  --tw-gradient-from: #6366f1 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(99 102 241 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-indigo-600 {
  --tw-gradient-from: #4f46e5 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(79 70 229 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-purple-700 {
  --tw-gradient-from: #7e22ce var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(126 34 206 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-white {
  --tw-gradient-from: #fff var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-\[\#F0F4FF\] {
  --tw-gradient-to: rgb(240 244 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #F0F4FF var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.via-white {
  --tw-gradient-to: rgb(255 255 255 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), #fff var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-\[\#F5F3FF\] {
  --tw-gradient-to: #F5F3FF var(--tw-gradient-to-position);
}
.to-\[\#eef2f6\] {
  --tw-gradient-to: #eef2f6 var(--tw-gradient-to-position);
}
.to-\[\#f0f3f7\] {
  --tw-gradient-to: #f0f3f7 var(--tw-gradient-to-position);
}
.to-app-50 {
  --tw-gradient-to: #E6EFFF var(--tw-gradient-to-position);
}
.to-app-600 {
  --tw-gradient-to: #0055ED var(--tw-gradient-to-position);
}
.to-bg-primary {
  --tw-gradient-to: #ffffff var(--tw-gradient-to-position);
}
.to-indigo-50 {
  --tw-gradient-to: #eef2ff var(--tw-gradient-to-position);
}
.to-purple-600 {
  --tw-gradient-to: #9333ea var(--tw-gradient-to-position);
}
.to-transparent {
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}
.bg-contain {
  background-size: contain;
}
.bg-clip-padding {
  background-clip: padding-box;
}
.bg-clip-text {
  -webkit-background-clip: text;
          background-clip: text;
}
.bg-center {
  background-position: center;
}
.bg-repeat {
  background-repeat: repeat;
}
.bg-no-repeat {
  background-repeat: no-repeat;
}
.fill-text-brand {
  fill: #0055ED;
}
.fill-text-primary {
  fill: #171717;
}
.fill-text-secondary {
  fill: #525252;
}
.stroke-\[rgba\(11\2c 15\2c 20\2c 0\.20\)\] {
  stroke: rgba(11,15,20,0.20);
}
.stroke-white {
  stroke: #fff;
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}
.object-right {
  -o-object-position: right;
     object-position: right;
}
.object-top {
  -o-object-position: top;
     object-position: top;
}
.\!p-0 {
  padding: 0px !important;
}
.\!p-2 {
  padding: 0.5rem !important;
}
.\!p-\[1px\] {
  padding: 1px !important;
}
.\!p-\[2px\] {
  padding: 2px !important;
}
.p-0 {
  padding: 0px;
}
.p-0\.5 {
  padding: 0.125rem;
}
.p-1 {
  padding: 0.25rem;
}
.p-1\.5 {
  padding: 0.375rem;
}
.p-10 {
  padding: 2.5rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-2\.5 {
  padding: 0.625rem;
}
.p-3 {
  padding: 0.75rem;
}
.p-3\.5 {
  padding: 0.875rem;
}
.p-4 {
  padding: 1rem;
}
.p-5 {
  padding: 1.25rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-7 {
  padding: 1.75rem;
}
.p-8 {
  padding: 2rem;
}
.p-\[10px\] {
  padding: 10px;
}
.p-\[12px\] {
  padding: 12px;
}
.p-\[14px\] {
  padding: 14px;
}
.p-\[16px\] {
  padding: 16px;
}
.p-\[1px\] {
  padding: 1px;
}
.p-\[20px\] {
  padding: 20px;
}
.p-\[21px\] {
  padding: 21px;
}
.p-\[24px\] {
  padding: 24px;
}
.p-\[26px\] {
  padding: 26px;
}
.p-\[2px\] {
  padding: 2px;
}
.p-\[30px\] {
  padding: 30px;
}
.p-\[32px\] {
  padding: 32px;
}
.p-\[3px\] {
  padding: 3px;
}
.p-\[4px\] {
  padding: 4px;
}
.p-\[6px\] {
  padding: 6px;
}
.p-\[8px\] {
  padding: 8px;
}
.\!px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.\!px-1 {
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
}
.\!px-12 {
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}
.\!px-2 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
.\!px-2\.5 {
  padding-left: 0.625rem !important;
  padding-right: 0.625rem !important;
}
.\!px-3 {
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}
.\!px-4 {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}
.\!px-5 {
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}
.\!px-6 {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}
.\!px-\[10px\] {
  padding-left: 10px !important;
  padding-right: 10px !important;
}
.\!px-\[14px\] {
  padding-left: 14px !important;
  padding-right: 14px !important;
}
.\!px-\[6px\] {
  padding-left: 6px !important;
  padding-right: 6px !important;
}
.\!py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.\!py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}
.\!py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}
.\!py-3 {
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}
.px-0 {
  padding-left: 0px;
  padding-right: 0px;
}
.px-0\.5 {
  padding-left: 0.125rem;
  padding-right: 0.125rem;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.px-10 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
.px-11 {
  padding-left: 2.75rem;
  padding-right: 2.75rem;
}
.px-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}
.px-14 {
  padding-left: 3.5rem;
  padding-right: 3.5rem;
}
.px-16 {
  padding-left: 4rem;
  padding-right: 4rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.px-24 {
  padding-left: 6rem;
  padding-right: 6rem;
}
.px-28 {
  padding-left: 7rem;
  padding-right: 7rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-3\.5 {
  padding-left: 0.875rem;
  padding-right: 0.875rem;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-7 {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.px-9 {
  padding-left: 2.25rem;
  padding-right: 2.25rem;
}
.px-\[100px\] {
  padding-left: 100px;
  padding-right: 100px;
}
.px-\[10px\] {
  padding-left: 10px;
  padding-right: 10px;
}
.px-\[120px\] {
  padding-left: 120px;
  padding-right: 120px;
}
.px-\[12px\] {
  padding-left: 12px;
  padding-right: 12px;
}
.px-\[14px\] {
  padding-left: 14px;
  padding-right: 14px;
}
.px-\[16px\] {
  padding-left: 16px;
  padding-right: 16px;
}
.px-\[18px\] {
  padding-left: 18px;
  padding-right: 18px;
}
.px-\[19px\] {
  padding-left: 19px;
  padding-right: 19px;
}
.px-\[1px\] {
  padding-left: 1px;
  padding-right: 1px;
}
.px-\[20px\] {
  padding-left: 20px;
  padding-right: 20px;
}
.px-\[21px\] {
  padding-left: 21px;
  padding-right: 21px;
}
.px-\[22px\] {
  padding-left: 22px;
  padding-right: 22px;
}
.px-\[24px\] {
  padding-left: 24px;
  padding-right: 24px;
}
.px-\[26px\] {
  padding-left: 26px;
  padding-right: 26px;
}
.px-\[2px\] {
  padding-left: 2px;
  padding-right: 2px;
}
.px-\[30px\] {
  padding-left: 30px;
  padding-right: 30px;
}
.px-\[3px\] {
  padding-left: 3px;
  padding-right: 3px;
}
.px-\[5px\] {
  padding-left: 5px;
  padding-right: 5px;
}
.px-\[60px\] {
  padding-left: 60px;
  padding-right: 60px;
}
.px-\[6px\] {
  padding-left: 6px;
  padding-right: 6px;
}
.px-\[7px\] {
  padding-left: 7px;
  padding-right: 7px;
}
.px-\[80px\] {
  padding-left: 80px;
  padding-right: 80px;
}
.px-\[8px\] {
  padding-left: 8px;
  padding-right: 8px;
}
.px-\[9px\] {
  padding-left: 9px;
  padding-right: 9px;
}
.px-\[max\(clamp\(20px\2c 4vw\2c 56px\)\2c calc\(\(100vw-min\(1320px\2c 88vw\)\)\/2\)\)\] {
  padding-left: max(clamp(20px, 4vw, 56px), calc((100vw - min(1320px, 88vw)) / 2));
  padding-right: max(clamp(20px, 4vw, 56px), calc((100vw - min(1320px, 88vw)) / 2));
}
.py-0 {
  padding-top: 0px;
  padding-bottom: 0px;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-1\.5 {
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
}
.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-3\.5 {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.py-\[10px\] {
  padding-top: 10px;
  padding-bottom: 10px;
}
.py-\[12px\] {
  padding-top: 12px;
  padding-bottom: 12px;
}
.py-\[14px\] {
  padding-top: 14px;
  padding-bottom: 14px;
}
.py-\[15px\] {
  padding-top: 15px;
  padding-bottom: 15px;
}
.py-\[16px\] {
  padding-top: 16px;
  padding-bottom: 16px;
}
.py-\[18px\] {
  padding-top: 18px;
  padding-bottom: 18px;
}
.py-\[1px\] {
  padding-top: 1px;
  padding-bottom: 1px;
}
.py-\[20px\] {
  padding-top: 20px;
  padding-bottom: 20px;
}
.py-\[22px\] {
  padding-top: 22px;
  padding-bottom: 22px;
}
.py-\[24px\] {
  padding-top: 24px;
  padding-bottom: 24px;
}
.py-\[2px\] {
  padding-top: 2px;
  padding-bottom: 2px;
}
.py-\[30px\] {
  padding-top: 30px;
  padding-bottom: 30px;
}
.py-\[32px\] {
  padding-top: 32px;
  padding-bottom: 32px;
}
.py-\[3px\] {
  padding-top: 3px;
  padding-bottom: 3px;
}
.py-\[40px\] {
  padding-top: 40px;
  padding-bottom: 40px;
}
.py-\[48px\] {
  padding-top: 48px;
  padding-bottom: 48px;
}
.py-\[5px\] {
  padding-top: 5px;
  padding-bottom: 5px;
}
.py-\[60px\] {
  padding-top: 60px;
  padding-bottom: 60px;
}
.py-\[64px\] {
  padding-top: 64px;
  padding-bottom: 64px;
}
.py-\[6px\] {
  padding-top: 6px;
  padding-bottom: 6px;
}
.py-\[7px\] {
  padding-top: 7px;
  padding-bottom: 7px;
}
.py-\[80px\] {
  padding-top: 80px;
  padding-bottom: 80px;
}
.py-\[8px\] {
  padding-top: 8px;
  padding-bottom: 8px;
}
.py-\[9px\] {
  padding-top: 9px;
  padding-bottom: 9px;
}
.py-\[clamp\(5rem\2c 10vh\2c 7rem\)\] {
  padding-top: clamp(5rem, 10vh, 7rem);
  padding-bottom: clamp(5rem, 10vh, 7rem);
}
.\!pb-0 {
  padding-bottom: 0px !important;
}
.\!pb-1 {
  padding-bottom: 0.25rem !important;
}
.\!pb-3 {
  padding-bottom: 0.75rem !important;
}
.\!pb-5 {
  padding-bottom: 1.25rem !important;
}
.\!pb-\[2px\] {
  padding-bottom: 2px !important;
}
.\!pl-0 {
  padding-left: 0px !important;
}
.\!pl-1 {
  padding-left: 0.25rem !important;
}
.\!pl-2 {
  padding-left: 0.5rem !important;
}
.\!pl-2\.5 {
  padding-left: 0.625rem !important;
}
.\!pl-3 {
  padding-left: 0.75rem !important;
}
.\!pl-9 {
  padding-left: 2.25rem !important;
}
.\!pl-\[1px\] {
  padding-left: 1px !important;
}
.\!pl-\[8px\] {
  padding-left: 8px !important;
}
.\!pr-0 {
  padding-right: 0px !important;
}
.\!pr-1 {
  padding-right: 0.25rem !important;
}
.\!pr-2 {
  padding-right: 0.5rem !important;
}
.\!pr-3 {
  padding-right: 0.75rem !important;
}
.\!pr-4 {
  padding-right: 1rem !important;
}
.\!pr-6 {
  padding-right: 1.5rem !important;
}
.\!pr-\[10px\] {
  padding-right: 10px !important;
}
.\!pr-\[1px\] {
  padding-right: 1px !important;
}
.\!pr-\[56px\] {
  padding-right: 56px !important;
}
.\!pr-\[60px\] {
  padding-right: 60px !important;
}
.\!pr-\[8px\] {
  padding-right: 8px !important;
}
.\!pt-0 {
  padding-top: 0px !important;
}
.\!pt-10 {
  padding-top: 2.5rem !important;
}
.\!pt-2 {
  padding-top: 0.5rem !important;
}
.\!pt-3 {
  padding-top: 0.75rem !important;
}
.\!pt-4 {
  padding-top: 1rem !important;
}
.\!pt-\[3px\] {
  padding-top: 3px !important;
}
.\!pt-\[6px\] {
  padding-top: 6px !important;
}
.pb-0 {
  padding-bottom: 0px;
}
.pb-0\.5 {
  padding-bottom: 0.125rem;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.pb-10 {
  padding-bottom: 2.5rem;
}
.pb-16 {
  padding-bottom: 4rem;
}
.pb-2 {
  padding-bottom: 0.5rem;
}
.pb-20 {
  padding-bottom: 5rem;
}
.pb-24 {
  padding-bottom: 6rem;
}
.pb-3 {
  padding-bottom: 0.75rem;
}
.pb-3\.5 {
  padding-bottom: 0.875rem;
}
.pb-32 {
  padding-bottom: 8rem;
}
.pb-4 {
  padding-bottom: 1rem;
}
.pb-5 {
  padding-bottom: 1.25rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pb-7 {
  padding-bottom: 1.75rem;
}
.pb-8 {
  padding-bottom: 2rem;
}
.pb-9 {
  padding-bottom: 2.25rem;
}
.pb-\[0px\] {
  padding-bottom: 0px;
}
.pb-\[100px\] {
  padding-bottom: 100px;
}
.pb-\[10px\] {
  padding-bottom: 10px;
}
.pb-\[120px\] {
  padding-bottom: 120px;
}
.pb-\[124px\] {
  padding-bottom: 124px;
}
.pb-\[12px\] {
  padding-bottom: 12px;
}
.pb-\[130px\] {
  padding-bottom: 130px;
}
.pb-\[14px\] {
  padding-bottom: 14px;
}
.pb-\[16px\] {
  padding-bottom: 16px;
}
.pb-\[18px\] {
  padding-bottom: 18px;
}
.pb-\[1px\] {
  padding-bottom: 1px;
}
.pb-\[20px\] {
  padding-bottom: 20px;
}
.pb-\[24px\] {
  padding-bottom: 24px;
}
.pb-\[2px\] {
  padding-bottom: 2px;
}
.pb-\[30px\] {
  padding-bottom: 30px;
}
.pb-\[32px\] {
  padding-bottom: 32px;
}
.pb-\[40px\] {
  padding-bottom: 40px;
}
.pb-\[44px\] {
  padding-bottom: 44px;
}
.pb-\[4px\] {
  padding-bottom: 4px;
}
.pb-\[52px\] {
  padding-bottom: 52px;
}
.pb-\[55px\] {
  padding-bottom: 55px;
}
.pb-\[5px\] {
  padding-bottom: 5px;
}
.pb-\[60px\] {
  padding-bottom: 60px;
}
.pb-\[68px\] {
  padding-bottom: 68px;
}
.pb-\[6px\] {
  padding-bottom: 6px;
}
.pl-0 {
  padding-left: 0px;
}
.pl-0\.5 {
  padding-left: 0.125rem;
}
.pl-1 {
  padding-left: 0.25rem;
}
.pl-1\.5 {
  padding-left: 0.375rem;
}
.pl-10 {
  padding-left: 2.5rem;
}
.pl-11 {
  padding-left: 2.75rem;
}
.pl-12 {
  padding-left: 3rem;
}
.pl-2 {
  padding-left: 0.5rem;
}
.pl-2\.5 {
  padding-left: 0.625rem;
}
.pl-3 {
  padding-left: 0.75rem;
}
.pl-4 {
  padding-left: 1rem;
}
.pl-5 {
  padding-left: 1.25rem;
}
.pl-6 {
  padding-left: 1.5rem;
}
.pl-7 {
  padding-left: 1.75rem;
}
.pl-8 {
  padding-left: 2rem;
}
.pl-9 {
  padding-left: 2.25rem;
}
.pl-\[100px\] {
  padding-left: 100px;
}
.pl-\[10px\] {
  padding-left: 10px;
}
.pl-\[12px\] {
  padding-left: 12px;
}
.pl-\[130px\] {
  padding-left: 130px;
}
.pl-\[131px\] {
  padding-left: 131px;
}
.pl-\[14px\] {
  padding-left: 14px;
}
.pl-\[18px\] {
  padding-left: 18px;
}
.pl-\[1px\] {
  padding-left: 1px;
}
.pl-\[21px\] {
  padding-left: 21px;
}
.pl-\[22px\] {
  padding-left: 22px;
}
.pl-\[2px\] {
  padding-left: 2px;
}
.pl-\[30px\] {
  padding-left: 30px;
}
.pl-\[35px\] {
  padding-left: 35px;
}
.pl-\[36px\] {
  padding-left: 36px;
}
.pl-\[43px\] {
  padding-left: 43px;
}
.pl-\[50px\] {
  padding-left: 50px;
}
.pl-\[52px\] {
  padding-left: 52px;
}
.pl-\[56px\] {
  padding-left: 56px;
}
.pl-\[5px\] {
  padding-left: 5px;
}
.pl-\[68px\] {
  padding-left: 68px;
}
.pl-\[6px\] {
  padding-left: 6px;
}
.pl-\[89px\] {
  padding-left: 89px;
}
.pr-1 {
  padding-right: 0.25rem;
}
.pr-1\.5 {
  padding-right: 0.375rem;
}
.pr-10 {
  padding-right: 2.5rem;
}
.pr-11 {
  padding-right: 2.75rem;
}
.pr-12 {
  padding-right: 3rem;
}
.pr-2 {
  padding-right: 0.5rem;
}
.pr-3 {
  padding-right: 0.75rem;
}
.pr-3\.5 {
  padding-right: 0.875rem;
}
.pr-4 {
  padding-right: 1rem;
}
.pr-5 {
  padding-right: 1.25rem;
}
.pr-6 {
  padding-right: 1.5rem;
}
.pr-7 {
  padding-right: 1.75rem;
}
.pr-8 {
  padding-right: 2rem;
}
.pr-9 {
  padding-right: 2.25rem;
}
.pr-\[104px\] {
  padding-right: 104px;
}
.pr-\[10px\] {
  padding-right: 10px;
}
.pr-\[112px\] {
  padding-right: 112px;
}
.pr-\[14px\] {
  padding-right: 14px;
}
.pr-\[15px\] {
  padding-right: 15px;
}
.pr-\[16px\] {
  padding-right: 16px;
}
.pr-\[1px\] {
  padding-right: 1px;
}
.pr-\[200px\] {
  padding-right: 200px;
}
.pr-\[2px\] {
  padding-right: 2px;
}
.pr-\[30px\] {
  padding-right: 30px;
}
.pr-\[32px\] {
  padding-right: 32px;
}
.pr-\[34px\] {
  padding-right: 34px;
}
.pr-\[44px\] {
  padding-right: 44px;
}
.pr-\[56px\] {
  padding-right: 56px;
}
.pr-\[68px\] {
  padding-right: 68px;
}
.pr-\[6px\] {
  padding-right: 6px;
}
.pr-\[80px\] {
  padding-right: 80px;
}
.pr-\[88px\] {
  padding-right: 88px;
}
.pt-0 {
  padding-top: 0px;
}
.pt-1 {
  padding-top: 0.25rem;
}
.pt-10 {
  padding-top: 2.5rem;
}
.pt-12 {
  padding-top: 3rem;
}
.pt-14 {
  padding-top: 3.5rem;
}
.pt-16 {
  padding-top: 4rem;
}
.pt-2 {
  padding-top: 0.5rem;
}
.pt-2\.5 {
  padding-top: 0.625rem;
}
.pt-20 {
  padding-top: 5rem;
}
.pt-3 {
  padding-top: 0.75rem;
}
.pt-4 {
  padding-top: 1rem;
}
.pt-5 {
  padding-top: 1.25rem;
}
.pt-6 {
  padding-top: 1.5rem;
}
.pt-7 {
  padding-top: 1.75rem;
}
.pt-8 {
  padding-top: 2rem;
}
.pt-9 {
  padding-top: 2.25rem;
}
.pt-\[0px\] {
  padding-top: 0px;
}
.pt-\[10\.5rem\] {
  padding-top: 10.5rem;
}
.pt-\[10px\] {
  padding-top: 10px;
}
.pt-\[128px\] {
  padding-top: 128px;
}
.pt-\[12px\] {
  padding-top: 12px;
}
.pt-\[14px\] {
  padding-top: 14px;
}
.pt-\[16px\] {
  padding-top: 16px;
}
.pt-\[18px\] {
  padding-top: 18px;
}
.pt-\[1px\] {
  padding-top: 1px;
}
.pt-\[22px\] {
  padding-top: 22px;
}
.pt-\[24px\] {
  padding-top: 24px;
}
.pt-\[26px\] {
  padding-top: 26px;
}
.pt-\[28px\] {
  padding-top: 28px;
}
.pt-\[2px\] {
  padding-top: 2px;
}
.pt-\[30px\] {
  padding-top: 30px;
}
.pt-\[32px\] {
  padding-top: 32px;
}
.pt-\[34px\] {
  padding-top: 34px;
}
.pt-\[35px\] {
  padding-top: 35px;
}
.pt-\[38px\] {
  padding-top: 38px;
}
.pt-\[3px\] {
  padding-top: 3px;
}
.pt-\[40px\] {
  padding-top: 40px;
}
.pt-\[4px\] {
  padding-top: 4px;
}
.pt-\[52px\] {
  padding-top: 52px;
}
.pt-\[54px\] {
  padding-top: 54px;
}
.pt-\[56px\] {
  padding-top: 56px;
}
.pt-\[5px\] {
  padding-top: 5px;
}
.pt-\[60px\] {
  padding-top: 60px;
}
.pt-\[64px\] {
  padding-top: 64px;
}
.pt-\[66px\] {
  padding-top: 66px;
}
.pt-\[68px\] {
  padding-top: 68px;
}
.pt-\[6px\] {
  padding-top: 6px;
}
.pt-\[72px\] {
  padding-top: 72px;
}
.pt-\[7px\] {
  padding-top: 7px;
}
.pt-\[84px\] {
  padding-top: 84px;
}
.pt-\[8px\] {
  padding-top: 8px;
}
.pt-\[8vh\] {
  padding-top: 8vh;
}
.pt-px {
  padding-top: 1px;
}
.text-left {
  text-align: left;
}
.\!text-center {
  text-align: center !important;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-start {
  text-align: start;
}
.indent-0 {
  text-indent: 0px;
}
.align-top {
  vertical-align: top;
}
.align-middle {
  vertical-align: middle;
}
.align-bottom {
  vertical-align: bottom;
}
.align-\[0\.22em\] {
  vertical-align: 0.22em;
}
.font-\[\'Inter\'\] {
  font-family: 'Inter';
}
.font-robotoCondensed {
  font-family: "Roboto Condensed", sans-serif;
}
.\!text-2xl {
  font-size: 1.5rem !important;
  line-height: 2rem !important;
}
.\!text-2xs {
  font-size: 0.813rem !important;
}
.\!text-\[10px\] {
  font-size: 10px !important;
}
.\!text-\[11px\] {
  font-size: 11px !important;
}
.\!text-\[13px\] {
  font-size: 13px !important;
}
.\!text-\[14px\] {
  font-size: 14px !important;
}
.\!text-\[8px\] {
  font-size: 8px !important;
}
.\!text-base {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}
.\!text-body-base-regular {
  font-size: 0.875rem !important;
  line-height: 1.43 !important;
  font-weight: 400 !important;
}
.\!text-lg {
  font-size: 1.125rem !important;
  line-height: 1.75rem !important;
}
.\!text-sm {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}
.\!text-xl {
  font-size: 1.25rem !important;
  line-height: 1.75rem !important;
}
.\!text-xs {
  font-size: 0.75rem !important;
  line-height: 1rem !important;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-2xs {
  font-size: 0.813rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}
.text-5xl {
  font-size: 3rem;
  line-height: 1;
}
.text-\[0\.58em\] {
  font-size: 0.58em;
}
.text-\[10\.1px\] {
  font-size: 10.1px;
}
.text-\[100px\] {
  font-size: 100px;
}
.text-\[10px\] {
  font-size: 10px;
}
.text-\[11\.2px\] {
  font-size: 11.2px;
}
.text-\[116px\] {
  font-size: 116px;
}
.text-\[11px\] {
  font-size: 11px;
}
.text-\[12\.3px\] {
  font-size: 12.3px;
}
.text-\[120px\] {
  font-size: 120px;
}
.text-\[12px\] {
  font-size: 12px;
}
.text-\[13\.4px\] {
  font-size: 13.4px;
}
.text-\[13px\] {
  font-size: 13px;
}
.text-\[14\.6px\] {
  font-size: 14.6px;
}
.text-\[14px\] {
  font-size: 14px;
}
.text-\[15px\] {
  font-size: 15px;
}
.text-\[16px\] {
  font-size: 16px;
}
.text-\[17px\] {
  font-size: 17px;
}
.text-\[18px\] {
  font-size: 18px;
}
.text-\[19px\] {
  font-size: 19px;
}
.text-\[200px\] {
  font-size: 200px;
}
.text-\[20px\] {
  font-size: 20px;
}
.text-\[22px\] {
  font-size: 22px;
}
.text-\[24px\] {
  font-size: 24px;
}
.text-\[26px\] {
  font-size: 26px;
}
.text-\[27px\] {
  font-size: 27px;
}
.text-\[28px\] {
  font-size: 28px;
}
.text-\[3\.9px\] {
  font-size: 3.9px;
}
.text-\[30px\] {
  font-size: 30px;
}
.text-\[31px\] {
  font-size: 31px;
}
.text-\[32px\] {
  font-size: 32px;
}
.text-\[34px\] {
  font-size: 34px;
}
.text-\[36px\] {
  font-size: 36px;
}
.text-\[4\.5px\] {
  font-size: 4.5px;
}
.text-\[40px\] {
  font-size: 40px;
}
.text-\[41px\] {
  font-size: 41px;
}
.text-\[42px\] {
  font-size: 42px;
}
.text-\[48px\] {
  font-size: 48px;
}
.text-\[5\.6px\] {
  font-size: 5.6px;
}
.text-\[52px\] {
  font-size: 52px;
}
.text-\[54px\] {
  font-size: 54px;
}
.text-\[58px\] {
  font-size: 58px;
}
.text-\[5px\] {
  font-size: 5px;
}
.text-\[6\.7px\] {
  font-size: 6.7px;
}
.text-\[64px\] {
  font-size: 64px;
}
.text-\[66px\] {
  font-size: 66px;
}
.text-\[80px\] {
  font-size: 80px;
}
.text-\[8px\] {
  font-size: 8px;
}
.text-\[9px\] {
  font-size: 9px;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-body-base-medium {
  font-size: 0.875rem;
  line-height: 1.43;
  font-weight: 500;
}
.text-body-base-regular {
  font-size: 0.875rem;
  line-height: 1.43;
  font-weight: 400;
}
.text-body-base-semibold {
  font-size: 0.875rem;
  line-height: 1.43;
  font-weight: 600;
}
.text-body-lg-medium {
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 500;
}
.text-body-lg-regular {
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 400;
}
.text-body-lg-semibold {
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 600;
}
.text-body-sm-medium {
  font-size: 0.75rem;
  line-height: 1.33;
  font-weight: 500;
}
.text-body-sm-regular {
  font-size: 0.75rem;
  line-height: 1.33;
  font-weight: 400;
}
.text-body-xl-medium {
  font-size: 1.125rem;
  line-height: 1.55;
  font-weight: 500;
}
.text-body-xl-regular {
  font-size: 1.125rem;
  line-height: 1.55;
  font-weight: 400;
}
.text-body-xs-medium {
  font-size: 0.625rem;
  line-height: normal;
  font-weight: 500;
}
.text-body-xs-regular {
  font-size: 0.625rem;
  line-height: normal;
  font-weight: 400;
}
.text-heading-2xl {
  font-size: 1.5rem;
  line-height: 1.3;
  letter-spacing: -0.01em;
  font-weight: 400;
}
.text-heading-3xl {
  font-size: 2rem;
  line-height: normal;
  letter-spacing: -0.0075em;
  font-weight: 400;
}
.text-heading-4xl {
  font-size: 2.25rem;
  line-height: normal;
  letter-spacing: -0.0075em;
  font-weight: 400;
}
.text-heading-base {
  font-size: 1rem;
  line-height: normal;
  font-weight: 500;
}
.text-heading-lg {
  font-size: 1.125rem;
  line-height: normal;
  font-weight: 500;
}
.text-heading-sm {
  font-size: 0.875rem;
  line-height: normal;
  font-weight: 500;
}
.text-heading-xl {
  font-size: 1.25rem;
  line-height: normal;
  font-weight: 500;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.\!font-bold {
  font-weight: 700 !important;
}
.\!font-medium {
  font-weight: 500 !important;
}
.\!font-normal {
  font-weight: 400 !important;
}
.\!font-semibold {
  font-weight: 600 !important;
}
.font-bold {
  font-weight: 700;
}
.font-extrabold {
  font-weight: 800;
}
.font-light {
  font-weight: 300;
}
.font-medium {
  font-weight: 500;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.uppercase {
  text-transform: uppercase;
}
.lowercase {
  text-transform: lowercase;
}
.capitalize {
  text-transform: capitalize;
}
.\!normal-case {
  text-transform: none !important;
}
.normal-case {
  text-transform: none;
}
.italic {
  font-style: italic;
}
.not-italic {
  font-style: normal;
}
.normal-nums {
  font-variant-numeric: normal;
}
.ordinal {
  --tw-ordinal: ordinal;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.slashed-zero {
  --tw-slashed-zero: slashed-zero;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.lining-nums {
  --tw-numeric-figure: lining-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.oldstyle-nums {
  --tw-numeric-figure: oldstyle-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.proportional-nums {
  --tw-numeric-spacing: proportional-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.diagonal-fractions {
  --tw-numeric-fraction: diagonal-fractions;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.\!leading-4 {
  line-height: 1rem !important;
}
.\!leading-6 {
  line-height: 1.5rem !important;
}
.\!leading-\[32px\] {
  line-height: 32px !important;
}
.\!leading-normal {
  line-height: 1.5 !important;
}
.leading-10 {
  line-height: 2.5rem;
}
.leading-3 {
  line-height: .75rem;
}
.leading-4 {
  line-height: 1rem;
}
.leading-5 {
  line-height: 1.25rem;
}
.leading-6 {
  line-height: 1.5rem;
}
.leading-7 {
  line-height: 1.75rem;
}
.leading-8 {
  line-height: 2rem;
}
.leading-9 {
  line-height: 2.25rem;
}
.leading-\[0\.1\] {
  line-height: 0.1;
}
.leading-\[0\] {
  line-height: 0;
}
.leading-\[1\.05\] {
  line-height: 1.05;
}
.leading-\[1\.14\] {
  line-height: 1.14;
}
.leading-\[1\.15\] {
  line-height: 1.15;
}
.leading-\[1\.1\] {
  line-height: 1.1;
}
.leading-\[1\.2\] {
  line-height: 1.2;
}
.leading-\[1\.33\] {
  line-height: 1.33;
}
.leading-\[1\.35\] {
  line-height: 1.35;
}
.leading-\[1\.3\] {
  line-height: 1.3;
}
.leading-\[1\.43\] {
  line-height: 1.43;
}
.leading-\[1\.4\] {
  line-height: 1.4;
}
.leading-\[1\.55\] {
  line-height: 1.55;
}
.leading-\[1\.5\] {
  line-height: 1.5;
}
.leading-\[12px\] {
  line-height: 12px;
}
.leading-\[14px\] {
  line-height: 14px;
}
.leading-\[15px\] {
  line-height: 15px;
}
.leading-\[16px\] {
  line-height: 16px;
}
.leading-\[17px\] {
  line-height: 17px;
}
.leading-\[18px\] {
  line-height: 18px;
}
.leading-\[20\.02px\] {
  line-height: 20.02px;
}
.leading-\[20px\] {
  line-height: 20px;
}
.leading-\[21px\] {
  line-height: 21px;
}
.leading-\[22px\] {
  line-height: 22px;
}
.leading-\[24px\] {
  line-height: 24px;
}
.leading-\[26px\] {
  line-height: 26px;
}
.leading-\[27px\] {
  line-height: 27px;
}
.leading-\[28px\] {
  line-height: 28px;
}
.leading-\[30\.4px\] {
  line-height: 30.4px;
}
.leading-\[30px\] {
  line-height: 30px;
}
.leading-\[32px\] {
  line-height: 32px;
}
.leading-\[35px\] {
  line-height: 35px;
}
.leading-\[36px\] {
  line-height: 36px;
}
.leading-\[38px\] {
  line-height: 38px;
}
.leading-\[40px\] {
  line-height: 40px;
}
.leading-\[44px\] {
  line-height: 44px;
}
.leading-\[48px\] {
  line-height: 48px;
}
.leading-\[54px\] {
  line-height: 54px;
}
.leading-\[58px\] {
  line-height: 58px;
}
.leading-\[60px\] {
  line-height: 60px;
}
.leading-\[80px\] {
  line-height: 80px;
}
.leading-\[8px\] {
  line-height: 8px;
}
.leading-\[normal\] {
  line-height: normal;
}
.leading-none {
  line-height: 1;
}
.leading-normal {
  line-height: 1.5;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-snug {
  line-height: 1.375;
}
.leading-tight {
  line-height: 1.25;
}
.\!tracking-normal {
  letter-spacing: 0em !important;
}
.-tracking-\[0\.24px\] {
  letter-spacing: -0.24px;
}
.tracking-\[-0\.0075em\] {
  letter-spacing: -0.0075em;
}
.tracking-\[-0\.01em\] {
  letter-spacing: -0.01em;
}
.tracking-\[-0\.025em\] {
  letter-spacing: -0.025em;
}
.tracking-\[-0\.02em\] {
  letter-spacing: -0.02em;
}
.tracking-\[-0\.24px\] {
  letter-spacing: -0.24px;
}
.tracking-\[-0\.2px\] {
  letter-spacing: -0.2px;
}
.tracking-\[-0\.64px\] {
  letter-spacing: -0.64px;
}
.tracking-\[0\.009em\] {
  letter-spacing: 0.009em;
}
.tracking-\[0\.04em\] {
  letter-spacing: 0.04em;
}
.tracking-\[0\.06em\] {
  letter-spacing: 0.06em;
}
.tracking-\[0\.08em\] {
  letter-spacing: 0.08em;
}
.tracking-\[0\.14em\] {
  letter-spacing: 0.14em;
}
.tracking-\[0\.1em\] {
  letter-spacing: 0.1em;
}
.tracking-\[0\.24px\] {
  letter-spacing: 0.24px;
}
.tracking-\[0\.3px\] {
  letter-spacing: 0.3px;
}
.tracking-\[0\.4px\] {
  letter-spacing: 0.4px;
}
.tracking-\[0\.5px\] {
  letter-spacing: 0.5px;
}
.tracking-\[0\.6px\] {
  letter-spacing: 0.6px;
}
.tracking-normal {
  letter-spacing: 0em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-wide {
  letter-spacing: 0.025em;
}
.tracking-wider {
  letter-spacing: 0.05em;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.\!text-\[\#9333ea\] {
  --tw-text-opacity: 1 !important;
  color: rgb(147 51 234 / var(--tw-text-opacity, 1)) !important;
}
.\!text-app-600 {
  --tw-text-opacity: 1 !important;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1)) !important;
}
.\!text-border-brand {
  --tw-text-opacity: 1 !important;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1)) !important;
}
.\!text-gray-100 {
  --tw-text-opacity: 1 !important;
  color: rgb(224 224 224 / var(--tw-text-opacity, 1)) !important;
}
.\!text-gray-400 {
  --tw-text-opacity: 1 !important;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1)) !important;
}
.\!text-gray-700 {
  --tw-text-opacity: 1 !important;
  color: rgb(57 57 57 / var(--tw-text-opacity, 1)) !important;
}
.\!text-gray-900 {
  --tw-text-opacity: 1 !important;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1)) !important;
}
.\!text-purple-600 {
  --tw-text-opacity: 1 !important;
  color: rgb(147 51 234 / var(--tw-text-opacity, 1)) !important;
}
.\!text-red-600 {
  --tw-text-opacity: 1 !important;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1)) !important;
}
.\!text-success-200 {
  --tw-text-opacity: 1 !important;
  color: rgb(189 231 203 / var(--tw-text-opacity, 1)) !important;
}
.\!text-text-brand {
  --tw-text-opacity: 1 !important;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1)) !important;
}
.\!text-text-danger-primary {
  --tw-text-opacity: 1 !important;
  color: rgb(185 28 28 / var(--tw-text-opacity, 1)) !important;
}
.\!text-text-inverted-primary {
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}
.\!text-text-primary {
  --tw-text-opacity: 1 !important;
  color: rgb(23 23 23 / var(--tw-text-opacity, 1)) !important;
}
.\!text-text-secondary {
  --tw-text-opacity: 1 !important;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1)) !important;
}
.\!text-text-tertiary {
  --tw-text-opacity: 1 !important;
  color: rgb(163 163 163 / var(--tw-text-opacity, 1)) !important;
}
.\!text-white {
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}
.text-\[\#0A1925\] {
  --tw-text-opacity: 1;
  color: rgb(10 25 37 / var(--tw-text-opacity, 1));
}
.text-\[\#0A66C2\] {
  --tw-text-opacity: 1;
  color: rgb(10 102 194 / var(--tw-text-opacity, 1));
}
.text-\[\#0F46C4\] {
  --tw-text-opacity: 1;
  color: rgb(15 70 196 / var(--tw-text-opacity, 1));
}
.text-\[\#10B981\] {
  --tw-text-opacity: 1;
  color: rgb(16 185 129 / var(--tw-text-opacity, 1));
}
.text-\[\#15803d\] {
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity, 1));
}
.text-\[\#16a34a\] {
  --tw-text-opacity: 1;
  color: rgb(22 163 74 / var(--tw-text-opacity, 1));
}
.text-\[\#2563EB\] {
  --tw-text-opacity: 1;
  color: rgb(37 99 235 / var(--tw-text-opacity, 1));
}
.text-\[\#2EC357\] {
  --tw-text-opacity: 1;
  color: rgb(46 195 87 / var(--tw-text-opacity, 1));
}
.text-\[\#7a7a7a\] {
  --tw-text-opacity: 1;
  color: rgb(122 122 122 / var(--tw-text-opacity, 1));
}
.text-\[\#9333EA\] {
  --tw-text-opacity: 1;
  color: rgb(147 51 234 / var(--tw-text-opacity, 1));
}
.text-\[\#EA580C\] {
  --tw-text-opacity: 1;
  color: rgb(234 88 12 / var(--tw-text-opacity, 1));
}
.text-\[\#F59E0B\] {
  --tw-text-opacity: 1;
  color: rgb(245 158 11 / var(--tw-text-opacity, 1));
}
.text-\[\#F5BB19\] {
  --tw-text-opacity: 1;
  color: rgb(245 187 25 / var(--tw-text-opacity, 1));
}
.text-\[\#FCB813\] {
  --tw-text-opacity: 1;
  color: rgb(252 184 19 / var(--tw-text-opacity, 1));
}
.text-\[\#c9932a\] {
  --tw-text-opacity: 1;
  color: rgb(201 147 42 / var(--tw-text-opacity, 1));
}
.text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(250 204 21 / var(--tw-text-opacity, 1));
}
.text-amber-500 {
  --tw-text-opacity: 1;
  color: rgb(234 179 8 / var(--tw-text-opacity, 1));
}
.text-amber-600 {
  --tw-text-opacity: 1;
  color: rgb(202 138 4 / var(--tw-text-opacity, 1));
}
.text-amber-800 {
  --tw-text-opacity: 1;
  color: rgb(133 77 14 / var(--tw-text-opacity, 1));
}
.text-app-100 {
  --tw-text-opacity: 1;
  color: rgb(191 213 252 / var(--tw-text-opacity, 1));
}
.text-app-500 {
  --tw-text-opacity: 1;
  color: rgb(0 94 255 / var(--tw-text-opacity, 1));
}
.text-app-600 {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.text-app-700 {
  --tw-text-opacity: 1;
  color: rgb(0 67 184 / var(--tw-text-opacity, 1));
}
.text-app-800 {
  --tw-text-opacity: 1;
  color: rgb(4 52 133 / var(--tw-text-opacity, 1));
}
.text-app-900 {
  --tw-text-opacity: 1;
  color: rgb(0 34 92 / var(--tw-text-opacity, 1));
}
.text-bg-brand {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.text-bg-primary-inverted {
  --tw-text-opacity: 1;
  color: rgb(10 25 37 / var(--tw-text-opacity, 1));
}
.text-bg-secondary-inverted {
  --tw-text-opacity: 1;
  color: rgb(28 53 80 / var(--tw-text-opacity, 1));
}
.text-black {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}
.text-black\/70 {
  color: rgb(0 0 0 / 0.7);
}
.text-black\/\[0\.47\] {
  color: rgb(0 0 0 / 0.47);
}
.text-blue-500 {
  --tw-text-opacity: 1;
  color: rgb(59 130 246 / var(--tw-text-opacity, 1));
}
.text-blue-600 {
  --tw-text-opacity: 1;
  color: rgb(37 99 235 / var(--tw-text-opacity, 1));
}
.text-blue-700 {
  --tw-text-opacity: 1;
  color: rgb(29 78 216 / var(--tw-text-opacity, 1));
}
.text-blue-800 {
  --tw-text-opacity: 1;
  color: rgb(30 64 175 / var(--tw-text-opacity, 1));
}
.text-darkblue-500 {
  --tw-text-opacity: 1;
  color: rgb(25 51 81 / var(--tw-text-opacity, 1));
}
.text-gold-500 {
  --tw-text-opacity: 1;
  color: rgb(251 190 40 / var(--tw-text-opacity, 1));
}
.text-gray-100 {
  --tw-text-opacity: 1;
  color: rgb(224 224 224 / var(--tw-text-opacity, 1));
}
.text-gray-200 {
  --tw-text-opacity: 1;
  color: rgb(198 198 198 / var(--tw-text-opacity, 1));
}
.text-gray-300 {
  --tw-text-opacity: 1;
  color: rgb(168 168 168 / var(--tw-text-opacity, 1));
}
.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1));
}
.text-gray-50 {
  --tw-text-opacity: 1;
  color: rgb(244 244 244 / var(--tw-text-opacity, 1));
}
.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(111 111 111 / var(--tw-text-opacity, 1));
}
.text-gray-600 {
  --tw-text-opacity: 1;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1));
}
.text-gray-700 {
  --tw-text-opacity: 1;
  color: rgb(57 57 57 / var(--tw-text-opacity, 1));
}
.text-gray-800 {
  --tw-text-opacity: 1;
  color: rgb(38 38 38 / var(--tw-text-opacity, 1));
}
.text-gray-900 {
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
.text-green-500 {
  --tw-text-opacity: 1;
  color: rgb(0 164 73 / var(--tw-text-opacity, 1));
}
.text-green-600 {
  --tw-text-opacity: 1;
  color: rgb(1 140 60 / var(--tw-text-opacity, 1));
}
.text-green-700 {
  --tw-text-opacity: 1;
  color: rgb(1 119 53 / var(--tw-text-opacity, 1));
}
.text-green-800 {
  --tw-text-opacity: 1;
  color: rgb(16 97 49 / var(--tw-text-opacity, 1));
}
.text-indigo-500 {
  --tw-text-opacity: 1;
  color: rgb(99 102 241 / var(--tw-text-opacity, 1));
}
.text-indigo-600 {
  --tw-text-opacity: 1;
  color: rgb(79 70 229 / var(--tw-text-opacity, 1));
}
.text-indigo-700 {
  --tw-text-opacity: 1;
  color: rgb(67 56 202 / var(--tw-text-opacity, 1));
}
.text-orange-500 {
  --tw-text-opacity: 1;
  color: rgb(249 115 22 / var(--tw-text-opacity, 1));
}
.text-purple-600 {
  --tw-text-opacity: 1;
  color: rgb(147 51 234 / var(--tw-text-opacity, 1));
}
.text-purple-700 {
  --tw-text-opacity: 1;
  color: rgb(126 34 206 / var(--tw-text-opacity, 1));
}
.text-red-500 {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}
.text-red-600 {
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}
.text-red-700 {
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.text-success-600 {
  --tw-text-opacity: 1;
  color: rgb(1 140 60 / var(--tw-text-opacity, 1));
}
.text-text-brand {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.text-text-brand-hover {
  --tw-text-opacity: 1;
  color: rgb(0 47 128 / var(--tw-text-opacity, 1));
}
.text-text-brand-secondary {
  --tw-text-opacity: 1;
  color: rgb(0 94 255 / var(--tw-text-opacity, 1));
}
.text-text-danger-hover {
  --tw-text-opacity: 1;
  color: rgb(153 27 27 / var(--tw-text-opacity, 1));
}
.text-text-danger-primary {
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.text-text-danger-secondary {
  --tw-text-opacity: 1;
  color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}
.text-text-inverted-primary {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-text-inverted-secondary {
  color: rgba(255, 255, 255, 0.6);
}
.text-text-neutral {
  --tw-text-opacity: 1;
  color: rgb(10 10 10 / var(--tw-text-opacity, 1));
}
.text-text-primary {
  --tw-text-opacity: 1;
  color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.text-text-secondary {
  --tw-text-opacity: 1;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1));
}
.text-text-success-primary {
  --tw-text-opacity: 1;
  color: rgb(21 128 61 / var(--tw-text-opacity, 1));
}
.text-text-success-secondary {
  --tw-text-opacity: 1;
  color: rgb(22 163 74 / var(--tw-text-opacity, 1));
}
.text-text-tertiary {
  --tw-text-opacity: 1;
  color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.text-text-warning-primary {
  --tw-text-opacity: 1;
  color: rgb(161 98 7 / var(--tw-text-opacity, 1));
}
.text-text-warning-secondary {
  --tw-text-opacity: 1;
  color: rgb(202 138 4 / var(--tw-text-opacity, 1));
}
.text-text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-text-white\/70 {
  color: rgb(255 255 255 / 0.7);
}
.text-transparent {
  color: transparent;
}
.text-violet-700 {
  --tw-text-opacity: 1;
  color: rgb(109 40 217 / var(--tw-text-opacity, 1));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.text-white\/70 {
  color: rgb(255 255 255 / 0.7);
}
.text-opacity-40 {
  --tw-text-opacity: 0.4;
}
.text-opacity-50 {
  --tw-text-opacity: 0.5;
}
.text-opacity-60 {
  --tw-text-opacity: 0.6;
}
.text-opacity-80 {
  --tw-text-opacity: 0.8;
}
.underline {
  text-decoration-line: underline;
}
.overline {
  text-decoration-line: overline;
}
.line-through {
  text-decoration-line: line-through;
}
.no-underline {
  text-decoration-line: none;
}
.decoration-text-brand {
  text-decoration-color: #0055ED;
}
.decoration-from-font {
  text-decoration-thickness: from-font;
}
.underline-offset-2 {
  text-underline-offset: 2px;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.underline-offset-\[3px\] {
  text-underline-offset: 3px;
}
.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.subpixel-antialiased {
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}
.placeholder-gray-400::-moz-placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(141 141 141 / var(--tw-placeholder-opacity, 1));
}
.placeholder-gray-400::placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(141 141 141 / var(--tw-placeholder-opacity, 1));
}
.placeholder-gray-500::-moz-placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(111 111 111 / var(--tw-placeholder-opacity, 1));
}
.placeholder-gray-500::placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(111 111 111 / var(--tw-placeholder-opacity, 1));
}
.placeholder-text-secondary::-moz-placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(82 82 82 / var(--tw-placeholder-opacity, 1));
}
.placeholder-text-secondary::placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(82 82 82 / var(--tw-placeholder-opacity, 1));
}
.placeholder-text-tertiary::-moz-placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(163 163 163 / var(--tw-placeholder-opacity, 1));
}
.placeholder-text-tertiary::placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(163 163 163 / var(--tw-placeholder-opacity, 1));
}
.accent-bg-primary-inverted {
  accent-color: #0A1925;
}
.accent-text-brand {
  accent-color: #0055ED;
}
.\!opacity-0 {
  opacity: 0 !important;
}
.\!opacity-100 {
  opacity: 1 !important;
}
.\!opacity-30 {
  opacity: 0.3 !important;
}
.opacity-0 {
  opacity: 0;
}
.opacity-10 {
  opacity: 0.1;
}
.opacity-100 {
  opacity: 1;
}
.opacity-20 {
  opacity: 0.2;
}
.opacity-25 {
  opacity: 0.25;
}
.opacity-30 {
  opacity: 0.3;
}
.opacity-40 {
  opacity: 0.4;
}
.opacity-45 {
  opacity: 0.45;
}
.opacity-5 {
  opacity: 0.05;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-60 {
  opacity: 0.6;
}
.opacity-70 {
  opacity: 0.7;
}
.opacity-75 {
  opacity: 0.75;
}
.opacity-80 {
  opacity: 0.8;
}
.opacity-90 {
  opacity: 0.9;
}
.opacity-\[0\.95\] {
  opacity: 0.95;
}
.mix-blend-multiply {
  mix-blend-mode: multiply;
}
.mix-blend-darken {
  mix-blend-mode: darken;
}
.mix-blend-soft-light {
  mix-blend-mode: soft-light;
}
.\!shadow-\[0px_0px_0px_1px_rgba\(26\2c 26\2c 26\2c 0\.06\)\] {
  --tw-shadow: 0px 0px 0px 1px rgba(26,26,26,0.06) !important;
  --tw-shadow-colored: 0px 0px 0px 1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-\[0px_1px_2px_0px_rgba\(26\2c 26\2c 26\2c 0\.06\)\] {
  --tw-shadow: 0px 1px 2px 0px rgba(26,26,26,0.06) !important;
  --tw-shadow-colored: 0px 1px 2px 0px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-\[inset_0px_0px_0px_1px_rgba\(255\2c 255\2c 255\2c 0\.80\)\] {
  --tw-shadow: inset 0px 0px 0px 1px rgba(255,255,255,0.80) !important;
  --tw-shadow-colored: inset 0px 0px 0px 1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-elevation-02 {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09) !important;
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-elevation-button {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 1px rgba(9, 15, 21, 0.06) !important;
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-elevation-input {
  --tw-shadow: 0 0 0 1px rgba(11, 15, 20, 0.09), 0 1px 2px 0 rgba(16, 24, 40, 0.05) !important;
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-elevation-pill {
  --tw-shadow: 0 2px 6px 0 rgba(11, 15, 20, 0.09), 0 0 0 1px rgba(11, 15, 20, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.80) inset !important;
  --tw-shadow-colored: 0 2px 6px 0 var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), inset 0 0 0 1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\!shadow-none {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-01 {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.06), 0 2px 4px -2px rgb(0 0 0 / 0.06);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-03 {
  --tw-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.05);
  --tw-shadow-colored: 0 1px 0 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-04 {
  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.08), 0 4px 10px 0 rgba(0, 0, 0, 0.06);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color), 0 4px 10px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl {
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_-8px_16px_-8px_rgba\(11\2c 15\2c 20\2c 0\.08\)\] {
  --tw-shadow: 0 -8px 16px -8px rgba(11,15,20,0.08);
  --tw-shadow-colored: 0 -8px 16px -8px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_0_10px_\#fff\2c 0_-20px_14px_-2px_rgba\(255\2c 255\2c 255\2c 0\.96\)\] {
  --tw-shadow: 0 0 0 10px #fff,0 -20px 14px -2px rgba(255,255,255,0.96);
  --tw-shadow-colored: 0 0 0 10px var(--tw-shadow-color), 0 -20px 14px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_0_2px_rgba\(11\2c 15\2c 20\2c 0\.48\)\2c 0_0_0_0\.75px_\#0B0F14\2c 0_24px_40px_-16px_rgba\(11\2c 15\2c 20\2c 0\.09\)\2c 0_4px_6px_0_rgba\(11\2c 15\2c 20\2c 0\.09\)\2c 0_1px_2px_0_rgba\(11\2c 15\2c 20\2c 0\.09\)\2c 0_0_0_1px_rgba\(11\2c 15\2c 20\2c 0\.09\)\2c inset_0_0_0_1px_rgba\(255\2c 255\2c 255\2c 0\.80\)\] {
  --tw-shadow: 0 0 0 2px rgba(11,15,20,0.48),0 0 0 0.75px #0B0F14,0 24px 40px -16px rgba(11,15,20,0.09),0 4px 6px 0 rgba(11,15,20,0.09),0 1px 2px 0 rgba(11,15,20,0.09),0 0 0 1px rgba(11,15,20,0.09),inset 0 0 0 1px rgba(255,255,255,0.80);
  --tw-shadow-colored: 0 0 0 2px var(--tw-shadow-color), 0 0 0 0.75px var(--tw-shadow-color), 0 24px 40px -16px var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_0_4px_rgba\(10\2c 25\2c 37\2c 0\.08\)\] {
  --tw-shadow: 0 0 0 4px rgba(10,25,37,0.08);
  --tw-shadow-colored: 0 0 0 4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_1px_0_0_var\(--shadow-inner\2c rgba\(255\2c 255\2c 255\2c 0\.80\)\)\] {
  --tw-shadow: 0 1px 0 0 var(--shadow-inner,rgba(255,255,255,0.80));
  --tw-shadow-colored: 0 1px 0 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_1px_2px_rgba\(0\2c 0\2c 0\2c 0\.04\)\] {
  --tw-shadow: 0 1px 2px rgba(0,0,0,0.04);
  --tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_1px_2px_rgba\(11\2c 15\2c 20\2c 0\.04\)\] {
  --tw-shadow: 0 1px 2px rgba(11,15,20,0.04);
  --tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_1px_2px_rgba\(15\2c 23\2c 42\2c 0\.04\)\] {
  --tw-shadow: 0 1px 2px rgba(15,23,42,0.04);
  --tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_1px_2px_rgba\(15\2c 23\2c 42\2c 0\.06\)\] {
  --tw-shadow: 0 1px 2px rgba(15,23,42,0.06);
  --tw-shadow-colored: 0 1px 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_1px_4px_-1px_rgba\(11\2c 15\2c 20\2c 0\.09\)\2c inset_0_0_0_1px_rgba\(11\2c 15\2c 20\2c 0\.09\)\] {
  --tw-shadow: 0 1px 4px -1px rgba(11,15,20,0.09),inset 0 0 0 1px rgba(11,15,20,0.09);
  --tw-shadow-colored: 0 1px 4px -1px var(--tw-shadow-color), inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_4px_12px_rgba\(10\2c 25\2c 37\2c 0\.10\)\] {
  --tw-shadow: 0 4px 12px rgba(10,25,37,0.10);
  --tw-shadow-colored: 0 4px 12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_0px_0px_1px_rgba\(11\2c 15\2c 20\2c 0\.09\)\2c 0px_1px_2px_1px_rgba\(11\2c 15\2c 20\2c 0\.06\)\2c inset_0px_0px_0px_1px_rgba\(255\2c 255\2c 255\2c 0\.8\)\] {
  --tw-shadow: 0px 0px 0px 1px rgba(11,15,20,0.09),0px 1px 2px 1px rgba(11,15,20,0.06),inset 0px 0px 0px 1px rgba(255,255,255,0.8);
  --tw-shadow-colored: 0px 0px 0px 1px var(--tw-shadow-color), 0px 1px 2px 1px var(--tw-shadow-color), inset 0px 0px 0px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_0px_0px_1px_rgba\(227\2c 225\2c 222\2c 0\.25\)\] {
  --tw-shadow: 0px 0px 0px 1px rgba(227,225,222,0.25);
  --tw-shadow-colored: 0px 0px 0px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_0px_0px_1px_rgba\(26\2c 26\2c 26\2c 0\.09\)\2c 0px_1px_2px_1px_rgba\(26\2c 26\2c 26\2c 0\.06\)\2c inset_0px_0px_0px_1px_rgba\(255\2c 255\2c 255\2c 0\.8\)\] {
  --tw-shadow: 0px 0px 0px 1px rgba(26,26,26,0.09),0px 1px 2px 1px rgba(26,26,26,0.06),inset 0px 0px 0px 1px rgba(255,255,255,0.8);
  --tw-shadow-colored: 0px 0px 0px 1px var(--tw-shadow-color), 0px 1px 2px 1px var(--tw-shadow-color), inset 0px 0px 0px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_0px_0px_2px_rgba\(11\2c 15\2c 20\2c 0\.48\)\2c 0px_0px_0px_0\.75px_rgba\(11\2c 15\2c 20\2c 1\.00\)\] {
  --tw-shadow: 0px 0px 0px 2px rgba(11,15,20,0.48),0px 0px 0px 0.75px rgba(11,15,20,1.00);
  --tw-shadow-colored: 0px 0px 0px 2px var(--tw-shadow-color), 0px 0px 0px 0.75px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_1px_2px_1px_rgba\(11\2c 15\2c 20\2c 0\.06\)\2c inset_0px_0px_0px_1px_rgba\(255\2c 255\2c 255\2c 0\.8\)\] {
  --tw-shadow: 0px 1px 2px 1px rgba(11,15,20,0.06),inset 0px 0px 0px 1px rgba(255,255,255,0.8);
  --tw-shadow-colored: 0px 1px 2px 1px var(--tw-shadow-color), inset 0px 0px 0px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_1px_4px_-1px_rgba\(26\2c 26\2c 26\2c 0\.09\)\2c inset_0px_0px_0px_1px_rgba\(26\2c 26\2c 26\2c 0\.09\)\] {
  --tw-shadow: 0px 1px 4px -1px rgba(26,26,26,0.09),inset 0px 0px 0px 1px rgba(26,26,26,0.09);
  --tw-shadow-colored: 0px 1px 4px -1px var(--tw-shadow-color), inset 0px 0px 0px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[inset_0_0_0_1\.5px_\#0A1925\] {
  --tw-shadow: inset 0 0 0 1.5px #0A1925;
  --tw-shadow-colored: inset 0 0 0 1.5px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[inset_0_0_0_1px_rgba\(11\2c 15\2c 20\2c 0\.08\)\] {
  --tw-shadow: inset 0 0 0 1px rgba(11,15,20,0.08);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[inset_0_0_0_1px_rgba\(11\2c 15\2c 20\2c 0\.09\)\] {
  --tw-shadow: inset 0 0 0 1px rgba(11,15,20,0.09);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[inset_0_0_0_1px_rgba\(11\2c 15\2c 20\2c 0\.18\)\] {
  --tw-shadow: inset 0 0 0 1px rgba(11,15,20,0.18);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-01 {
  --tw-shadow: 0 0 0 1px rgba(9, 15, 21, 0.06), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-02 {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-03 {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09), 0 4px 6px 0 rgba(9, 15, 21, 0.09), 0 24px 40px -16px rgba(9, 15, 21, 0.09);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 24px 40px -16px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-04 {
  --tw-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.30) inset, 0 0 0 0.5px rgba(11, 15, 20, 0.09), 0 1px 2px 0 rgba(26, 26, 26, 0.06), 0 4px 6px 0 rgba(26, 26, 26, 0.06), 0 40px 40px -24px rgba(26, 26, 26, 0.06), 0 56px 56px -32px rgba(26, 26, 26, 0.09), 0 24px 40px 0 rgba(26, 26, 26, 0.06);
  --tw-shadow-colored: inset 0 0 0 1.5px var(--tw-shadow-color), 0 0 0 0.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 40px 40px -24px var(--tw-shadow-color), 0 56px 56px -32px var(--tw-shadow-color), 0 24px 40px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-05 {
  --tw-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.30) inset, 0 0 10px 4px rgba(255, 255, 255, 0.40) inset;
  --tw-shadow-colored: inset 0 0 0 0.5px var(--tw-shadow-color), inset 0 0 10px 4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-06 {
  --tw-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-button {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 1px rgba(9, 15, 21, 0.06);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-focused {
  --tw-shadow: 0 0 0 1px rgba(26, 26, 26, 0.06), 0 0 0 2px #56A0FF;
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-input {
  --tw-shadow: 0 0 0 1px rgba(11, 15, 20, 0.09), 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-input-dark {
  --tw-shadow: 0 0 0 2.5px rgba(38, 38, 38, 0.55), 0 0 0 0.75px rgba(26, 26, 26, 0.50), 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 2.5px var(--tw-shadow-color), 0 0 0 0.75px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-input-error {
  --tw-shadow: 0 0 0 2px rgba(248, 113, 113, 0.40), 0 0 0 1px #FECACA, 0 1px 2px 0 rgba(26, 26, 26, 0.06);
  --tw-shadow-colored: 0 0 0 2px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-input-focused {
  --tw-shadow: 0 0 0 1.5px #0A1925, 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-input-hover {
  --tw-shadow: 0 0 0 1px #a3a3a3, 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-new-03 {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(26, 26, 26, 0.09), 0 1px 2px 0 rgba(26, 26, 26, 0.09), 0 4px 6px 0 rgba(26, 26, 26, 0.09), 0 24px 40px -16px rgba(26, 26, 26, 0.09);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 24px 40px -16px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-new-04 {
  --tw-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(11, 15, 20, 0.09), 0 1px 2px 0 rgba(11, 15, 20, 0.09), 0 4px 6px 0 rgba(11, 15, 20, 0.09), 0 40px 40px -24px rgba(11, 15, 20, 0.09), 0 56px 56px -32px rgba(11, 15, 20, 0.20), 0 24px 40px 0 rgba(11, 15, 20, 0.09);
  --tw-shadow-colored: inset 0 0 0 1.5px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 40px 40px -24px var(--tw-shadow-color), 0 56px 56px -32px var(--tw-shadow-color), 0 24px 40px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-pill {
  --tw-shadow: 0 2px 6px 0 rgba(11, 15, 20, 0.09), 0 0 0 1px rgba(11, 15, 20, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.80) inset;
  --tw-shadow-colored: 0 2px 6px 0 var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), inset 0 0 0 1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-prompt-card {
  --tw-shadow: 0 24px 40px -16px rgba(9, 15, 21, 0.09), 0 4px 6px 0 rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
  --tw-shadow-colored: 0 24px 40px -16px var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-elevation-white-border-bottom {
  --tw-shadow: 0 1px 0 0 #FFFFFF;
  --tw-shadow-colored: 0 1px 0 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-none {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-xl {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-black\/10 {
  --tw-shadow-color: rgb(0 0 0 / 0.1);
  --tw-shadow: var(--tw-shadow-colored);
}
.\!outline-none {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.\!outline {
  outline-style: solid !important;
}
.outline {
  outline-style: solid;
}
.\!outline-0 {
  outline-width: 0px !important;
}
.outline-0 {
  outline-width: 0px;
}
.outline-1 {
  outline-width: 1px;
}
.outline-2 {
  outline-width: 2px;
}
.outline-\[2px\] {
  outline-width: 2px;
}
.outline-offset-0 {
  outline-offset: 0px;
}
.outline-offset-2 {
  outline-offset: 2px;
}
.outline-offset-\[3px\] {
  outline-offset: 3px;
}
.outline-app-400 {
  outline-color: #3C82FF;
}
.outline-app-400\/50 {
  outline-color: rgb(60 130 255 / 0.5);
}
.outline-app-500 {
  outline-color: #005EFF;
}
.outline-app-600 {
  outline-color: #0055ED;
}
.outline-black {
  outline-color: #000;
}
.outline-border-primary-inverted {
  outline-color: #0A1925;
}
.outline-gray-700 {
  outline-color: #393939;
}
.outline-text-inverted-primary {
  outline-color: #ffffff;
}
.ring {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-0 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-1 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-\[1\.5px\] {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1.5px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-\[3px\] {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-inset {
  --tw-ring-inset: inset;
}
.\!ring-transparent {
  --tw-ring-color: transparent !important;
}
.ring-app-600 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 85 237 / var(--tw-ring-opacity, 1));
}
.ring-black {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity, 1));
}
.ring-black\/10 {
  --tw-ring-color: rgb(0 0 0 / 0.1);
}
.ring-border-brand {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 85 237 / var(--tw-ring-opacity, 1));
}
.ring-border-danger-secondary {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(254 202 202 / var(--tw-ring-opacity, 1));
}
.ring-border-primary-inverted {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(10 25 37 / var(--tw-ring-opacity, 1));
}
.ring-border-secondary {
  --tw-ring-color: rgba(11, 15, 20, 0.09);
}
.ring-border-tertiary {
  --tw-ring-color: rgba(11, 15, 20, 0.06);
}
.ring-gray-100 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(224 224 224 / var(--tw-ring-opacity, 1));
}
.ring-gray-200 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(198 198 198 / var(--tw-ring-opacity, 1));
}
.ring-gray-300 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(168 168 168 / var(--tw-ring-opacity, 1));
}
.ring-gray-500\/10 {
  --tw-ring-color: rgb(111 111 111 / 0.1);
}
.ring-indigo-200 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(199 210 254 / var(--tw-ring-opacity, 1));
}
.ring-indigo-500 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1));
}
.ring-success-600 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(1 140 60 / var(--tw-ring-opacity, 1));
}
.ring-text-brand {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 85 237 / var(--tw-ring-opacity, 1));
}
.ring-transparent {
  --tw-ring-color: transparent;
}
.ring-white {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity, 1));
}
.ring-opacity-5 {
  --tw-ring-opacity: 0.05;
}
.ring-opacity-50 {
  --tw-ring-opacity: 0.5;
}
.ring-opacity-\[0\.15\] {
  --tw-ring-opacity: 0.15;
}
.ring-offset-0 {
  --tw-ring-offset-width: 0px;
}
.ring-offset-2 {
  --tw-ring-offset-width: 2px;
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-0 {
  --tw-blur: blur(0);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[100px\] {
  --tw-blur: blur(100px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[128px\] {
  --tw-blur: blur(128px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[160px\] {
  --tw-blur: blur(160px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[38px\] {
  --tw-blur: blur(38px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[3px\] {
  --tw-blur: blur(3px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[40px\] {
  --tw-blur: blur(40px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[4px\] {
  --tw-blur: blur(4px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[5px\] {
  --tw-blur: blur(5px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[60px\] {
  --tw-blur: blur(60px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[6px\] {
  --tw-blur: blur(6px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[70px\] {
  --tw-blur: blur(70px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[80px\] {
  --tw-blur: blur(80px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-\[9\.4px\] {
  --tw-blur: blur(9.4px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.blur-sm {
  --tw-blur: blur(4px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow {
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.grayscale {
  --tw-grayscale: grayscale(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.invert {
  --tw-invert: invert(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.sepia {
  --tw-sepia: sepia(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.\!filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
}
.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur {
  --tw-backdrop-blur: blur(8px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-\[10px\] {
  --tw-backdrop-blur: blur(10px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-\[22px\] {
  --tw-backdrop-blur: blur(22px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-\[28px\] {
  --tw-backdrop-blur: blur(28px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-\[2px\] {
  --tw-backdrop-blur: blur(2px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-\[5px\] {
  --tw-backdrop-blur: blur(5px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm {
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-grayscale {
  --tw-backdrop-grayscale: grayscale(100%);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-invert {
  --tw-backdrop-invert: invert(100%);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-saturate-\[1\.8\] {
  --tw-backdrop-saturate: saturate(1.8);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-sepia {
  --tw-backdrop-sepia: sepia(100%);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-filter {
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[background-color\2c border-radius\] {
  transition-property: background-color,border-radius;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[background-color\2c margin\] {
  transition-property: background-color,margin;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[border-color\2c box-shadow\2c transform\] {
  transition-property: border-color,box-shadow,transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[border-color\] {
  transition-property: border-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[grid-template-rows\2c opacity\] {
  transition-property: grid-template-rows,opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[grid-template-rows\] {
  transition-property: grid-template-rows;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[height\] {
  transition-property: height;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[max-width\] {
  transition-property: max-width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[min-height\2c border-color\] {
  transition-property: min-height,border-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[opacity\2c filter\2c transform\] {
  transition-property: opacity,filter,transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[opacity\2c transform\] {
  transition-property: opacity,transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[transform\2c opacity\] {
  transition-property: transform,opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[width\] {
  transition-property: width;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-100 {
  transition-duration: 100ms;
}
.duration-1000 {
  transition-duration: 1000ms;
}
.duration-150 {
  transition-duration: 150ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.duration-500 {
  transition-duration: 500ms;
}
.duration-700 {
  transition-duration: 700ms;
}
.duration-75 {
  transition-duration: 75ms;
}
.duration-\[120ms\] {
  transition-duration: 120ms;
}
.duration-\[160ms\] {
  transition-duration: 160ms;
}
.duration-\[180ms\] {
  transition-duration: 180ms;
}
.duration-\[200ms\] {
  transition-duration: 200ms;
}
.duration-\[220ms\] {
  transition-duration: 220ms;
}
.duration-\[240ms\] {
  transition-duration: 240ms;
}
.duration-\[260ms\] {
  transition-duration: 260ms;
}
.duration-\[280ms\] {
  transition-duration: 280ms;
}
.duration-\[420ms\] {
  transition-duration: 420ms;
}
.duration-\[5000ms\] {
  transition-duration: 5000ms;
}
.ease-\[cubic-bezier\(0\.23\2c 1\2c 0\.32\2c 1\)\] {
  transition-timing-function: cubic-bezier(0.23,1,0.32,1);
}
.ease-\[cubic-bezier\(0\.34\2c 1\.45\2c 0\.64\2c 1\)\] {
  transition-timing-function: cubic-bezier(0.34,1.45,0.64,1);
}
.ease-in {
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.will-change-\[height\2c top\2c transform\] {
  will-change: height,top,transform;
}
.will-change-transform {
  will-change: transform;
}
.\[-\:\|\\s\] {
  -: |\s;
}
.\[-\:\|\] {
  -: |;
}
.\[animation-delay\:0\.08s\] {
  animation-delay: 0.08s;
}
.\[animation-delay\:0\.16s\] {
  animation-delay: 0.16s;
}
.\[animation-delay\:0\.24s\] {
  animation-delay: 0.24s;
}
.\[animation-delay\:0s\] {
  animation-delay: 0s;
}
.\[animation-duration\:1\.6s\] {
  animation-duration: 1.6s;
}
.\[aspect-ratio\:16\/9\] {
  aspect-ratio: 16/9;
}
.\[mask-image\:linear-gradient\(to_right\2c black_calc\(100\%-120px\)\2c transparent_calc\(100\%-90px\)\)\] {
  -webkit-mask-image: linear-gradient(to right,black calc(100% - 120px),transparent calc(100% - 90px));
          mask-image: linear-gradient(to right,black calc(100% - 120px),transparent calc(100% - 90px));
}
.\[scrollbar-gutter\:stable\] {
  scrollbar-gutter: stable;
}
.\[text-wrap\:balance\] {
  text-wrap: balance;
}
.\[text-wrap\:pretty\] {
  text-wrap: pretty;
}
.\[transition-timing-function\:cubic-bezier\(0\.23\2c 1\2c 0\.32\2c 1\)\] {
  transition-timing-function: cubic-bezier(0.23,1,0.32,1);
}
.\[writing-mode\:vertical-rl\] {
  writing-mode: vertical-rl;
}

@property --angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}

@keyframes cometSpin {
    to { --angle: 360deg; }
}

/* Generating pill halo glow */
.generating-pill-glow {
    position: relative;
    isolation: isolate;
}
.generating-pill-inner {
    position: absolute;
    left: 2px;
    right: 2px;
    top: 50%;
    transform: translateY(-50%);
    height: 24px;
    background: #ffffff;
    filter: blur(6px);
    pointer-events: none;
    z-index: 1;
}
.generating-pill-glow::after {
    content: "";
    position: absolute;
    inset: -10px;
    border-radius: 20px;
    background: conic-gradient(
        from var(--angle),
        transparent 0deg,
        transparent 220deg,
        rgba(186, 140, 235, 0.55) 280deg,
        rgba(220, 150, 220, 0.7) 320deg,
        rgba(240, 170, 210, 0.5) 350deg,
        transparent 360deg
    );
    filter: blur(12px);
    opacity: 0.9;
    animation: cometSpin 3s linear infinite;
    pointer-events: none;
    z-index: -1;
}

/* Shimmer for the creation progress label ("Designing slide X of N").
   Defined OUTSIDE @layer (plain CSS) so it is always emitted and never purged.
   Figma: grey (#525252) sweeping to brand blue (#0060FF) and back — the blue band
   travels across the text via the animated background-position. NOT covered by the
   mobile shimmer kill-switch — it's a single lightweight element in the mobile
   Presentation View, not the dozens of skeleton shimmers that crash tabs. */
@keyframes labelShimmer {
    0% { background-position: 100% 50%; }
    100% { background-position: -100% 50%; }
}
.animate-labelShimmer {
    background-image: linear-gradient(90deg, #525252 0%, #0060ff 60%, #525252 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: labelShimmer 2.2s linear infinite;
}

    .before\:absolute.relative::before {
        content: var(--tw-content);
        position: absolute !important;
    }
    .before\:animate-shimmerSweep::before {
        content: var(--tw-content);
        animation: 2s shimmerSweep ease-in-out infinite;
    }
    
    body.disable-shimmer .before\:animate-shimmerSweep::before {
        content: var(--tw-content);
        animation: none !important;
    }
    @media (max-width: 767px) {
        .before\:animate-shimmerSweep::before {
            content: var(--tw-content);
            animation: none !important;
        }
    }

    .after\:absolute.relative::after {
        content: var(--tw-content);
        position: absolute !important;
    }
    .textPropertyPanel .checked\:bg-app-600:checked {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
    .textPropertyPanel .hover\:bg-app-600:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
    .textPropertyPanel .group:hover .group-hover\:bg-app-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
@media (min-width: 640px) {

    .sm\:relative.absolute {
        position: absolute !important;
    }

    .sm\:absolute.relative {
        position: absolute !important;
    }
}
@media (min-width: 768px) {

    .md\:relative.absolute {
        position: absolute !important;
    }

    .md\:absolute.relative {
        position: absolute !important;
    }
}
@media (prefers-color-scheme: dark) {

  .dark\:prose-invert {
    --tw-prose-body: var(--tw-prose-invert-body);
    --tw-prose-headings: var(--tw-prose-invert-headings);
    --tw-prose-lead: var(--tw-prose-invert-lead);
    --tw-prose-links: var(--tw-prose-invert-links);
    --tw-prose-bold: var(--tw-prose-invert-bold);
    --tw-prose-counters: var(--tw-prose-invert-counters);
    --tw-prose-bullets: var(--tw-prose-invert-bullets);
    --tw-prose-hr: var(--tw-prose-invert-hr);
    --tw-prose-quotes: var(--tw-prose-invert-quotes);
    --tw-prose-quote-borders: var(--tw-prose-invert-quote-borders);
    --tw-prose-captions: var(--tw-prose-invert-captions);
    --tw-prose-kbd: var(--tw-prose-invert-kbd);
    --tw-prose-kbd-shadows: var(--tw-prose-invert-kbd-shadows);
    --tw-prose-code: var(--tw-prose-invert-code);
    --tw-prose-pre-code: var(--tw-prose-invert-pre-code);
    --tw-prose-pre-bg: var(--tw-prose-invert-pre-bg);
    --tw-prose-th-borders: var(--tw-prose-invert-th-borders);
    --tw-prose-td-borders: var(--tw-prose-invert-td-borders);
  }
}
.file\:mr-2::file-selector-button {
  margin-right: 0.5rem;
}
.file\:rounded::file-selector-button {
  border-radius: 0.25rem;
}
.file\:border-0::file-selector-button {
  border-width: 0px;
}
.file\:bg-blue-600::file-selector-button {
  --tw-bg-opacity: 1;
  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
}
.file\:px-3::file-selector-button {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.file\:py-1::file-selector-button {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.file\:text-xs::file-selector-button {
  font-size: 0.75rem;
  line-height: 1rem;
}
.file\:font-medium::file-selector-button {
  font-weight: 500;
}
.file\:text-white::file-selector-button {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.placeholder\:font-normal::-moz-placeholder {
  font-weight: 400;
}
.placeholder\:font-normal::placeholder {
  font-weight: 400;
}
.placeholder\:text-darkblue-500\/50::-moz-placeholder {
  color: rgb(25 51 81 / 0.5);
}
.placeholder\:text-darkblue-500\/50::placeholder {
  color: rgb(25 51 81 / 0.5);
}
.placeholder\:text-gray-200::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(198 198 198 / var(--tw-text-opacity, 1));
}
.placeholder\:text-gray-200::placeholder {
  --tw-text-opacity: 1;
  color: rgb(198 198 198 / var(--tw-text-opacity, 1));
}
.placeholder\:text-gray-400::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1));
}
.placeholder\:text-gray-400::placeholder {
  --tw-text-opacity: 1;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1));
}
.placeholder\:text-text-tertiary::-moz-placeholder {
  --tw-text-opacity: 1;
  color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.placeholder\:text-text-tertiary::placeholder {
  --tw-text-opacity: 1;
  color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.placeholder\:opacity-60::-moz-placeholder {
  opacity: 0.6;
}
.placeholder\:opacity-60::placeholder {
  opacity: 0.6;
}
.before\:absolute::before {
  content: var(--tw-content);
  position: absolute;
}
.before\:top-0::before {
  content: var(--tw-content);
  top: 0px;
}
.before\:h-full::before {
  content: var(--tw-content);
  height: 100%;
}
.before\:w-\[40\%\]::before {
  content: var(--tw-content);
  width: 40%;
}
.before\:bg-\[linear-gradient\(90deg\2c transparent\2c var\(--color-bg-brand\)\2c transparent\)\]::before {
  content: var(--tw-content);
  background-image: linear-gradient(90deg,transparent,var(--color-bg-brand),transparent);
}
.before\:opacity-20::before {
  content: var(--tw-content);
  opacity: 0.2;
}
.before\:content-\[\'\'\]::before {
  --tw-content: '';
  content: var(--tw-content);
}
.after\:absolute::after {
  content: var(--tw-content);
  position: absolute;
}
.after\:inset-x-5::after {
  content: var(--tw-content);
  left: 1.25rem;
  right: 1.25rem;
}
.after\:-right-\[3px\]::after {
  content: var(--tw-content);
  right: -3px;
}
.after\:bottom-0::after {
  content: var(--tw-content);
  bottom: 0px;
}
.after\:left-full::after {
  content: var(--tw-content);
  left: 100%;
}
.after\:top-1\/2::after {
  content: var(--tw-content);
  top: 50%;
}
.after\:-z-10::after {
  content: var(--tw-content);
  z-index: -10;
}
.after\:h-2::after {
  content: var(--tw-content);
  height: 0.5rem;
}
.after\:h-px::after {
  content: var(--tw-content);
  height: 1px;
}
.after\:w-2::after {
  content: var(--tw-content);
  width: 0.5rem;
}
.after\:-translate-y-1\/2::after {
  content: var(--tw-content);
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.after\:rotate-45::after {
  content: var(--tw-content);
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.after\:rounded-\[1px\]::after {
  content: var(--tw-content);
  border-radius: 1px;
}
.after\:border-4::after {
  content: var(--tw-content);
  border-width: 4px;
}
.after\:border-transparent::after {
  content: var(--tw-content);
  border-color: transparent;
}
.after\:border-l-bg-blackout::after {
  content: var(--tw-content);
  --tw-border-opacity: 1;
  border-left-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.after\:bg-bg-brand::after {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.after\:bg-border-secondary::after {
  content: var(--tw-content);
  background-color: rgba(11, 15, 20, 0.09);
}
.after\:content-\[\'\'\]::after {
  --tw-content: '';
  content: var(--tw-content);
}
.first\:ml-0:first-child {
  margin-left: 0px;
}
.first\:ml-3:first-child {
  margin-left: 0.75rem;
}
.first\:ml-4:first-child {
  margin-left: 1rem;
}
.first\:mt-0:first-child {
  margin-top: 0px;
}
.first\:mt-6:first-child {
  margin-top: 1.5rem;
}
.first\:rounded-t-lg:first-child {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}
.last\:mb-0:last-child {
  margin-bottom: 0px;
}
.last\:mr-0:last-child {
  margin-right: 0px;
}
.last\:mr-3:last-child {
  margin-right: 0.75rem;
}
.last\:mr-5:last-child {
  margin-right: 1.25rem;
}
.last\:rounded-b-lg:last-child {
  border-bottom-right-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}
.last\:border-0:last-child {
  border-width: 0px;
}
.last\:border-b-0:last-child {
  border-bottom-width: 0px;
}
.last\:border-none:last-child {
  border-style: none;
}
.checked\:\!border-border-primary:checked {
  border-color: rgba(11, 15, 20, 0.20) !important;
}
.checked\:\!border-transparent:checked {
  border-color: transparent !important;
}
.checked\:border-app-600:checked {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.checked\:\!bg-bg-primary-inverted:checked {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
.checked\:bg-app-600:checked {
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.checked\:bg-bg-primary-inverted:checked {
  --tw-bg-opacity: 1;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
.indeterminate\:\!border-border-primary:indeterminate {
  border-color: rgba(11, 15, 20, 0.20) !important;
}
.indeterminate\:\!bg-bg-primary-inverted:indeterminate {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1)) !important;
}
.empty\:before\:text-text-tertiary:empty::before {
  content: var(--tw-content);
  --tw-text-opacity: 1;
  color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.empty\:before\:content-\[attr\(data-placeholder\)\]:empty::before {
  --tw-content: attr(data-placeholder);
  content: var(--tw-content);
}
.focus-within\:opacity-100:focus-within {
  opacity: 1;
}
.focus-within\:\!shadow-elevation-input-focused:focus-within {
  --tw-shadow: 0 0 0 1.5px #0A1925, 0 1px 2px 0 rgba(16, 24, 40, 0.05) !important;
  --tw-shadow-colored: 0 0 0 1.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.focus-within\:shadow-elevation-input-focused:focus-within {
  --tw-shadow: 0 0 0 1.5px #0A1925, 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.focus-within\:ring-2:focus-within {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-within\:ring-indigo-500:focus-within {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1));
}
.focus-within\:ring-offset-2:focus-within {
  --tw-ring-offset-width: 2px;
}
.focus-within\:ring-offset-gray-100:focus-within {
  --tw-ring-offset-color: #E0E0E0;
}
.hover\:w-\[194px\]:hover {
  width: 194px;
}
.hover\:-translate-y-0\.5:hover {
  --tw-translate-y: -0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:scale-105:hover {
  --tw-scale-x: 1.05;
  --tw-scale-y: 1.05;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:scale-110:hover {
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:scale-125:hover {
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:rounded-\[1px\]:hover {
  border-radius: 1px;
}
.hover\:rounded-lg:hover {
  border-radius: 0.5rem;
}
.hover\:rounded-md:hover {
  border-radius: 0.375rem;
}
.hover\:border:hover {
  border-width: 1px;
}
.hover\:border-2:hover {
  border-width: 2px;
}
.hover\:\!border-app-600:hover {
  --tw-border-opacity: 1 !important;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
}
.hover\:border-app-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(105 160 255 / var(--tw-border-opacity, 1));
}
.hover\:border-app-500:hover {
  --tw-border-opacity: 1;
  border-color: rgb(0 94 255 / var(--tw-border-opacity, 1));
}
.hover\:border-app-600:hover {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.hover\:border-blue-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(147 197 253 / var(--tw-border-opacity, 1));
}
.hover\:border-blue-500:hover {
  --tw-border-opacity: 1;
  border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));
}
.hover\:border-border-brand:hover {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.hover\:border-border-primary:hover {
  border-color: rgba(11, 15, 20, 0.20);
}
.hover\:border-border-primary-inverted:hover {
  --tw-border-opacity: 1;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
}
.hover\:border-border-secondary:hover {
  border-color: rgba(11, 15, 20, 0.09);
}
.hover\:border-gray-100:hover {
  --tw-border-opacity: 1;
  border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
}
.hover\:border-gray-200:hover {
  --tw-border-opacity: 1;
  border-color: rgb(198 198 198 / var(--tw-border-opacity, 1));
}
.hover\:border-gray-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(168 168 168 / var(--tw-border-opacity, 1));
}
.hover\:border-gray-400:hover {
  --tw-border-opacity: 1;
  border-color: rgb(141 141 141 / var(--tw-border-opacity, 1));
}
.hover\:border-gray-800:hover {
  --tw-border-opacity: 1;
  border-color: rgb(38 38 38 / var(--tw-border-opacity, 1));
}
.hover\:border-text-primary:hover {
  --tw-border-opacity: 1;
  border-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.hover\:border-opacity-20:hover {
  --tw-border-opacity: 0.2;
}
.hover\:\!bg-bg-default-primary:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-bg-elevation-hover:hover {
  background-color: rgba(26, 26, 26, 0.12) !important;
}
.hover\:\!bg-bg-quaternary:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-bg-secondary-inverted:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(28 53 80 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-bg-tertiary:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-gray-100:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-gray-400:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(141 141 141 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-gray-50:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-gray-500:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(111 111 111 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-gray-700:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(57 57 57 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-transparent:hover {
  background-color: transparent !important;
}
.hover\:\!bg-white:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:\!bg-white\/80:hover {
  background-color: rgb(255 255 255 / 0.8) !important;
}
.hover\:bg-\[\#D0E2FF\]:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(208 226 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-\[rgba\(11\2c 15\2c 20\2c 0\.04\)\]:hover {
  background-color: rgba(11,15,20,0.04);
}
.hover\:bg-\[rgba\(11\2c 15\2c 20\2c 0\.05\)\]:hover {
  background-color: rgba(11,15,20,0.05);
}
.hover\:bg-\[rgba\(11\2c 15\2c 20\2c 0\.06\)\]:hover {
  background-color: rgba(11,15,20,0.06);
}
.hover\:bg-app-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(191 213 252 / var(--tw-bg-opacity, 1));
}
.hover\:bg-app-200:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(148 187 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-app-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(230 239 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-app-500:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-app-600:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.hover\:bg-app-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(0 67 184 / var(--tw-bg-opacity, 1));
}
.hover\:bg-bg-brand-selected:hover {
  background-color: rgba(0, 85, 237, 0.12);
}
.hover\:bg-bg-default-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.hover\:bg-bg-default-tertiary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}
.hover\:bg-bg-elevated-hover:hover {
  background-color: rgba(11, 15, 20, 0.08);
}
.hover\:bg-bg-elevation-hover:hover {
  background-color: rgba(26, 26, 26, 0.12);
}
.hover\:bg-bg-primary-inverted-hover:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(35 48 59 / var(--tw-bg-opacity, 1));
}
.hover\:bg-bg-primary\/60:hover {
  background-color: rgb(255 255 255 / 0.6);
}
.hover\:bg-bg-quaternary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1));
}
.hover\:bg-bg-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.hover\:bg-bg-tertiary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}
.hover\:bg-black\/\[0\.04\]:hover {
  background-color: rgb(0 0 0 / 0.04);
}
.hover\:bg-blue-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-blue-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1));
}
.hover\:bg-darkblue-500:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(25 51 81 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-100:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-100\/70:hover {
  background-color: rgb(224 224 224 / 0.7);
}
.hover\:bg-gray-200:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-300:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(168 168 168 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-400:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(141 141 141 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-500:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(111 111 111 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-600:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(82 82 82 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(57 57 57 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-800:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
}
.hover\:bg-gray-900:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
}
.hover\:bg-indigo-200:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(199 210 254 / var(--tw-bg-opacity, 1));
}
.hover\:bg-indigo-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(67 56 202 / var(--tw-bg-opacity, 1));
}
.hover\:bg-ppt-600:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(196 62 28 / var(--tw-bg-opacity, 1));
}
.hover\:bg-purple-700:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(126 34 206 / var(--tw-bg-opacity, 1));
}
.hover\:bg-red-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}
.hover\:bg-text-white\/10:hover {
  background-color: rgb(255 255 255 / 0.1);
}
.hover\:bg-transparent:hover {
  background-color: transparent;
}
.hover\:bg-white:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.hover\:bg-white\/20:hover {
  background-color: rgb(255 255 255 / 0.2);
}
.hover\:bg-white\/\[0\.08\]:hover {
  background-color: rgb(255 255 255 / 0.08);
}
.hover\:\!bg-opacity-50:hover {
  --tw-bg-opacity: 0.5 !important;
}
.hover\:\!bg-opacity-90:hover {
  --tw-bg-opacity: 0.9 !important;
}
.hover\:bg-opacity-10:hover {
  --tw-bg-opacity: 0.1;
}
.hover\:bg-opacity-100:hover {
  --tw-bg-opacity: 1;
}
.hover\:bg-opacity-20:hover {
  --tw-bg-opacity: 0.2;
}
.hover\:bg-opacity-30:hover {
  --tw-bg-opacity: 0.3;
}
.hover\:bg-opacity-40:hover {
  --tw-bg-opacity: 0.4;
}
.hover\:bg-opacity-60:hover {
  --tw-bg-opacity: 0.6;
}
.hover\:bg-opacity-70:hover {
  --tw-bg-opacity: 0.7;
}
.hover\:bg-opacity-80:hover {
  --tw-bg-opacity: 0.8;
}
.hover\:bg-none:hover {
  background-image: none;
}
.hover\:from-green-700:hover {
  --tw-gradient-from: #017735 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(1 119 53 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.hover\:from-indigo-600:hover {
  --tw-gradient-from: #4f46e5 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(79 70 229 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.hover\:from-indigo-700:hover {
  --tw-gradient-from: #4338ca var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(67 56 202 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.hover\:to-purple-700:hover {
  --tw-gradient-to: #7e22ce var(--tw-gradient-to-position);
}
.hover\:\!text-border-brand\/80:hover {
  color: rgb(0 85 237 / 0.8) !important;
}
.hover\:\!text-text-brand:hover {
  --tw-text-opacity: 1 !important;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1)) !important;
}
.hover\:\!text-text-secondary:hover {
  --tw-text-opacity: 1 !important;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1)) !important;
}
.hover\:text-app-500:hover {
  --tw-text-opacity: 1;
  color: rgb(0 94 255 / var(--tw-text-opacity, 1));
}
.hover\:text-app-600:hover {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.hover\:text-app-700:hover {
  --tw-text-opacity: 1;
  color: rgb(0 67 184 / var(--tw-text-opacity, 1));
}
.hover\:text-gray-600:hover {
  --tw-text-opacity: 1;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1));
}
.hover\:text-gray-700:hover {
  --tw-text-opacity: 1;
  color: rgb(57 57 57 / var(--tw-text-opacity, 1));
}
.hover\:text-gray-800:hover {
  --tw-text-opacity: 1;
  color: rgb(38 38 38 / var(--tw-text-opacity, 1));
}
.hover\:text-gray-900:hover {
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
.hover\:text-indigo-800:hover {
  --tw-text-opacity: 1;
  color: rgb(55 48 163 / var(--tw-text-opacity, 1));
}
.hover\:text-red-700:hover {
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.hover\:text-text-brand:hover {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.hover\:text-text-brand-hover:hover {
  --tw-text-opacity: 1;
  color: rgb(0 47 128 / var(--tw-text-opacity, 1));
}
.hover\:text-text-danger-primary:hover {
  --tw-text-opacity: 1;
  color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.hover\:text-text-inverted-primary:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.hover\:text-text-primary:hover {
  --tw-text-opacity: 1;
  color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.hover\:text-text-secondary:hover {
  --tw-text-opacity: 1;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1));
}
.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.hover\:text-opacity-90:hover {
  --tw-text-opacity: 0.9;
}
.hover\:underline:hover {
  text-decoration-line: underline;
}
.hover\:opacity-100:hover {
  opacity: 1;
}
.hover\:opacity-70:hover {
  opacity: 0.7;
}
.hover\:opacity-80:hover {
  opacity: 0.8;
}
.hover\:opacity-85:hover {
  opacity: 0.85;
}
.hover\:opacity-90:hover {
  opacity: 0.9;
}
.hover\:opacity-95:hover {
  opacity: 0.95;
}
.hover\:shadow-04:hover {
  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.08), 0 4px 10px 0 rgba(0, 0, 0, 0.06);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color), 0 4px 10px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-\[0_6px_18px_rgba\(10\2c 25\2c 37\2c 0\.10\)\2c 0_2px_4px_rgba\(0\2c 0\2c 0\2c 0\.05\)\]:hover {
  --tw-shadow: 0 6px 18px rgba(10,25,37,0.10),0 2px 4px rgba(0,0,0,0.05);
  --tw-shadow-colored: 0 6px 18px var(--tw-shadow-color), 0 2px 4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-elevation-02:hover {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-elevation-03:hover {
  --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09), 0 4px 6px 0 rgba(9, 15, 21, 0.09), 0 24px 40px -16px rgba(9, 15, 21, 0.09);
  --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 24px 40px -16px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-lg:hover {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-md:hover {
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-xl:hover {
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:ring:hover {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.hover\:ring-app-600:hover {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 85 237 / var(--tw-ring-opacity, 1));
}
.hover\:ring-bg-brand-pressed:hover {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 47 128 / var(--tw-ring-opacity, 1));
}
.hover\:ring-border-brand:hover {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 85 237 / var(--tw-ring-opacity, 1));
}
.hover\:ring-text-tertiary:hover {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(163 163 163 / var(--tw-ring-opacity, 1));
}
.hover\:ring-offset-\[-1px\]:hover {
  --tw-ring-offset-width: -1px;
}
.hover\:file\:bg-blue-700::file-selector-button:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(29 78 216 / var(--tw-bg-opacity, 1));
}
.focus\:top-\[2px\]:focus {
  top: 2px;
}
.focus\:m-0:focus {
  margin: 0px;
}
.focus\:scale-125:focus {
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.focus\:rounded-md:focus {
  border-radius: 0.375rem;
}
.focus\:border-2:focus {
  border-width: 2px;
}
.focus\:\!border-app-600:focus {
  --tw-border-opacity: 1 !important;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1)) !important;
}
.focus\:border-app-500:focus {
  --tw-border-opacity: 1;
  border-color: rgb(0 94 255 / var(--tw-border-opacity, 1));
}
.focus\:border-app-600:focus {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.focus\:border-border-primary:focus {
  border-color: rgba(11, 15, 20, 0.20);
}
.focus\:border-border-primary-inverted:focus {
  --tw-border-opacity: 1;
  border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
}
.focus\:border-indigo-500:focus {
  --tw-border-opacity: 1;
  border-color: rgb(99 102 241 / var(--tw-border-opacity, 1));
}
.focus\:border-transparent:focus {
  border-color: transparent;
}
.focus\:\!bg-bg-quaternary:focus {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 229 229 / var(--tw-bg-opacity, 1)) !important;
}
.focus\:\!bg-transparent:focus {
  background-color: transparent !important;
}
.focus\:bg-app-500:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(0 94 255 / var(--tw-bg-opacity, 1));
}
.focus\:bg-black\/\[0\.03\]:focus {
  background-color: rgb(0 0 0 / 0.03);
}
.focus\:bg-white:focus {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.focus\:bg-opacity-30:focus {
  --tw-bg-opacity: 0.3;
}
.focus\:from-indigo-600:focus {
  --tw-gradient-from: #4f46e5 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(79 70 229 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.focus\:to-purple-700:focus {
  --tw-gradient-to: #7e22ce var(--tw-gradient-to-position);
}
.focus\:pl-\[11px\]:focus {
  padding-left: 11px;
}
.focus\:pl-\[37px\]:focus {
  padding-left: 37px;
}
.focus\:placeholder-gray-500:focus::-moz-placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(111 111 111 / var(--tw-placeholder-opacity, 1));
}
.focus\:placeholder-gray-500:focus::placeholder {
  --tw-placeholder-opacity: 1;
  color: rgb(111 111 111 / var(--tw-placeholder-opacity, 1));
}
.focus\:\!shadow-elevation-focused:focus {
  --tw-shadow: 0 0 0 1px rgba(26, 26, 26, 0.06), 0 0 0 2px #56A0FF !important;
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 0 0 2px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.focus\:shadow-elevation-input-focused:focus {
  --tw-shadow: 0 0 0 1.5px #0A1925, 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus\:\!ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}
.focus\:ring-0:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-1:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:\!ring-border-secondary-inverted:focus {
  --tw-ring-color: rgba(10, 25, 37, 0.48) !important;
}
.focus\:ring-app-100:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(191 213 252 / var(--tw-ring-opacity, 1));
}
.focus\:ring-app-200:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(148 187 255 / var(--tw-ring-opacity, 1));
}
.focus\:ring-app-500:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 94 255 / var(--tw-ring-opacity, 1));
}
.focus\:ring-app-600:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 85 237 / var(--tw-ring-opacity, 1));
}
.focus\:ring-app-650:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 77 209 / var(--tw-ring-opacity, 1));
}
.focus\:ring-blue-500:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
}
.focus\:ring-border-primary-inverted:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(10 25 37 / var(--tw-ring-opacity, 1));
}
.focus\:ring-indigo-500:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1));
}
.focus\:ring-indigo-500\/50:focus {
  --tw-ring-color: rgb(99 102 241 / 0.5);
}
.focus\:ring-offset-0:focus {
  --tw-ring-offset-width: 0px;
}
.focus\:ring-offset-2:focus {
  --tw-ring-offset-width: 2px;
}
.focus-visible\:outline-offset-0:focus-visible {
  outline-offset: 0px;
}
.focus-visible\:ring-2:focus-visible {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus-visible\:ring-app-500:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(0 94 255 / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-bg-primary-inverted:focus-visible {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(10 25 37 / var(--tw-ring-opacity, 1));
}
.focus-visible\:ring-offset-0:focus-visible {
  --tw-ring-offset-width: 0px;
}
.focus-visible\:ring-offset-2:focus-visible {
  --tw-ring-offset-width: 2px;
}
.active\:scale-125:active {
  --tw-scale-x: 1.25;
  --tw-scale-y: 1.25;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.active\:scale-95:active {
  --tw-scale-x: .95;
  --tw-scale-y: .95;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.active\:scale-\[0\.985\]:active {
  --tw-scale-x: 0.985;
  --tw-scale-y: 0.985;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.active\:\!bg-bg-default-primary:active {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
}
.active\:\!bg-transparent:active {
  background-color: transparent !important;
}
.active\:bg-bg-default-secondary:active {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.active\:bg-gray-100:active {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
.active\:bg-gray-200:active {
  --tw-bg-opacity: 1;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1));
}
.active\:bg-purple-200:active {
  --tw-bg-opacity: 1;
  background-color: rgb(233 213 255 / var(--tw-bg-opacity, 1));
}
.disabled\:cursor-default:disabled {
  cursor: default;
}
.disabled\:cursor-not-allowed:disabled {
  cursor: not-allowed;
}
.disabled\:no-underline:disabled {
  text-decoration-line: none;
}
.disabled\:opacity-30:disabled {
  opacity: 0.3;
}
.disabled\:opacity-40:disabled {
  opacity: 0.4;
}
.disabled\:opacity-50:disabled {
  opacity: 0.5;
}
.disabled\:opacity-60:disabled {
  opacity: 0.6;
}
.disabled\:opacity-70:disabled {
  opacity: 0.7;
}
.disabled\:hover\:bg-transparent:hover:disabled {
  background-color: transparent;
}
.group:hover .group-hover\:visible {
  visibility: visible;
}
.group:hover .group-hover\:block {
  display: block;
}
.group\/social:hover .group-hover\/social\:flex {
  display: flex;
}
.group\/sw:hover .group-hover\/sw\:flex {
  display: flex;
}
.group:hover .group-hover\:flex {
  display: flex;
}
.group:hover .group-hover\:inline-flex {
  display: inline-flex;
}
.group:hover .group-hover\:w-auto {
  width: auto;
}
.group:hover .group-hover\:translate-x-0\.5 {
  --tw-translate-x: 0.125rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:translate-y-0 {
  --tw-translate-y: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:border-app-600 {
  --tw-border-opacity: 1;
  border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
}
.group:hover .group-hover\:bg-app-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(191 213 252 / var(--tw-bg-opacity, 1));
}
.group:hover .group-hover\:bg-app-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.group:hover .group-hover\:bg-bg-default-secondary {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.group:hover .group-hover\:bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}
.group:hover .group-hover\:bg-purple-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
}
.group:hover .group-hover\:bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.group\/step:hover .group-hover\/step\:text-text-brand {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.group:hover .group-hover\:text-app-600 {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.group:hover .group-hover\:text-gray-900 {
  --tw-text-opacity: 1;
  color: rgb(22 22 22 / var(--tw-text-opacity, 1));
}
.group:hover .group-hover\:text-text-primary {
  --tw-text-opacity: 1;
  color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.group:hover .group-hover\:text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.group\/step:hover .group-hover\/step\:underline {
  text-decoration-line: underline;
}
.group\/add-between:hover .group-hover\/add-between\:opacity-100 {
  opacity: 1;
}
.group\/point:hover .group-hover\/point\:opacity-100 {
  opacity: 1;
}
.group:hover .group-hover\:opacity-100 {
  opacity: 1;
}
.group:hover .group-hover\:opacity-75 {
  opacity: 0.75;
}
.group:hover .group-hover\:\[animation-play-state\:paused\] {
  animation-play-state: paused;
}
.group.toaster .group-\[\.toaster\]\:shadow-lg {
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.aria-disabled\:opacity-60[aria-disabled="true"] {
  opacity: 0.6;
}
@container (min-width: 800px) {

  .\@\[800px\]\:block {
    display: block;
  }
}
.group-parent:hover .group-parent-hover\:opacity-100 {
  opacity: 1;
}
.group-buttongroup:hover .group-buttongroup-hover\:text-app-600 {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.group-buttongroup:hover .group-buttongroup-hover\:opacity-100 {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {

  .motion-reduce\:scale-100 {
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .motion-reduce\:animate-none {
    animation: none;
  }

  .motion-reduce\:blur-0 {
    --tw-blur: blur(0);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
  }

  .motion-reduce\:\!transition-none {
    transition-property: none !important;
  }

  .motion-reduce\:transition-none {
    transition-property: none;
  }

  .motion-reduce\:transition-opacity {
    transition-property: opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
  }
}
@media not all and (min-width: 768px) {

  .max-md\:z-\[60\] {
    z-index: 60;
  }
}
@media (min-width: 640px) {

  .sm\:pointer-events-auto {
    pointer-events: auto;
  }

  .sm\:absolute {
    position: absolute;
  }

  .sm\:relative {
    position: relative;
  }

  .sm\:-right-10 {
    right: -2.5rem;
  }

  .sm\:-right-7 {
    right: -1.75rem;
  }

  .sm\:-right-9 {
    right: -2.25rem;
  }

  .sm\:-top-1 {
    top: -0.25rem;
  }

  .sm\:bottom-\[10px\] {
    bottom: 10px;
  }

  .sm\:bottom-\[44px\] {
    bottom: 44px;
  }

  .sm\:bottom-\[84px\] {
    bottom: 84px;
  }

  .sm\:left-8 {
    left: 2rem;
  }

  .sm\:left-\[42px\] {
    left: 42px;
  }

  .sm\:left-\[58px\] {
    left: 58px;
  }

  .sm\:left-\[unset\] {
    left: unset;
  }

  .sm\:left-auto {
    left: auto;
  }

  .sm\:right-10 {
    right: 2.5rem;
  }

  .sm\:right-2 {
    right: 0.5rem;
  }

  .sm\:right-3 {
    right: 0.75rem;
  }

  .sm\:right-4 {
    right: 1rem;
  }

  .sm\:right-5 {
    right: 1.25rem;
  }

  .sm\:right-6 {
    right: 1.5rem;
  }

  .sm\:right-\[17px\] {
    right: 17px;
  }

  .sm\:right-\[44px\] {
    right: 44px;
  }

  .sm\:right-\[6px\] {
    right: 6px;
  }

  .sm\:top-0 {
    top: 0px;
  }

  .sm\:top-1 {
    top: 0.25rem;
  }

  .sm\:top-3 {
    top: 0.75rem;
  }

  .sm\:top-4 {
    top: 1rem;
  }

  .sm\:top-5 {
    top: 1.25rem;
  }

  .sm\:top-6 {
    top: 1.5rem;
  }

  .sm\:top-\[-66px\] {
    top: -66px;
  }

  .sm\:top-\[18px\] {
    top: 18px;
  }

  .sm\:top-\[2px\] {
    top: 2px;
  }

  .sm\:top-\[calc\(56px\+12px\)\] {
    top: calc(56px + 12px);
  }

  .sm\:top-\[unset\] {
    top: unset;
  }

  .sm\:z-10 {
    z-index: 10;
  }

  .sm\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .sm\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .sm\:col-span-7 {
    grid-column: span 7 / span 7;
  }

  .sm\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .sm\:-mx-6 {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
  }

  .sm\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .sm\:mx-\[22px\] {
    margin-left: 22px;
    margin-right: 22px;
  }

  .sm\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }

  .sm\:my-8 {
    margin-top: 2rem;
    margin-bottom: 2rem;
  }

  .sm\:my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }

  .sm\:-mb-\[80px\] {
    margin-bottom: -80px;
  }

  .sm\:-mt-1 {
    margin-top: -0.25rem;
  }

  .sm\:-mt-3 {
    margin-top: -0.75rem;
  }

  .sm\:-mt-4 {
    margin-top: -1rem;
  }

  .sm\:mb-0 {
    margin-bottom: 0px;
  }

  .sm\:mb-1 {
    margin-bottom: 0.25rem;
  }

  .sm\:mb-\[calc\(20vh\)\] {
    margin-bottom: calc(20vh);
  }

  .sm\:ml-0 {
    margin-left: 0px;
  }

  .sm\:ml-16 {
    margin-left: 4rem;
  }

  .sm\:ml-2 {
    margin-left: 0.5rem;
  }

  .sm\:ml-3 {
    margin-left: 0.75rem;
  }

  .sm\:ml-4 {
    margin-left: 1rem;
  }

  .sm\:ml-5 {
    margin-left: 1.25rem;
  }

  .sm\:ml-6 {
    margin-left: 1.5rem;
  }

  .sm\:ml-\[10px\] {
    margin-left: 10px;
  }

  .sm\:ml-\[6px\] {
    margin-left: 6px;
  }

  .sm\:mr-0 {
    margin-right: 0px;
  }

  .sm\:mr-3 {
    margin-right: 0.75rem;
  }

  .sm\:mr-5 {
    margin-right: 1.25rem;
  }

  .sm\:mr-\[10px\] {
    margin-right: 10px;
  }

  .sm\:mr-\[160px\] {
    margin-right: 160px;
  }

  .sm\:mt-0 {
    margin-top: 0px;
  }

  .sm\:mt-1 {
    margin-top: 0.25rem;
  }

  .sm\:mt-10 {
    margin-top: 2.5rem;
  }

  .sm\:mt-11 {
    margin-top: 2.75rem;
  }

  .sm\:mt-12 {
    margin-top: 3rem;
  }

  .sm\:mt-2 {
    margin-top: 0.5rem;
  }

  .sm\:mt-28 {
    margin-top: 7rem;
  }

  .sm\:mt-3 {
    margin-top: 0.75rem;
  }

  .sm\:mt-4 {
    margin-top: 1rem;
  }

  .sm\:mt-5 {
    margin-top: 1.25rem;
  }

  .sm\:mt-8 {
    margin-top: 2rem;
  }

  .sm\:mt-9 {
    margin-top: 2.25rem;
  }

  .sm\:mt-\[10px\] {
    margin-top: 10px;
  }

  .sm\:mt-\[30px\] {
    margin-top: 30px;
  }

  .sm\:mt-\[60px\] {
    margin-top: 60px;
  }

  .sm\:block {
    display: block;
  }

  .sm\:inline-block {
    display: inline-block;
  }

  .sm\:inline {
    display: inline;
  }

  .sm\:\!flex {
    display: flex !important;
  }

  .sm\:flex {
    display: flex;
  }

  .sm\:\!inline-flex {
    display: inline-flex !important;
  }

  .sm\:inline-flex {
    display: inline-flex;
  }

  .sm\:table-cell {
    display: table-cell;
  }

  .sm\:grid {
    display: grid;
  }

  .sm\:\!hidden {
    display: none !important;
  }

  .sm\:hidden {
    display: none;
  }

  .sm\:\!h-7 {
    height: 1.75rem !important;
  }

  .sm\:h-10 {
    height: 2.5rem;
  }

  .sm\:h-11 {
    height: 2.75rem;
  }

  .sm\:h-20 {
    height: 5rem;
  }

  .sm\:h-7 {
    height: 1.75rem;
  }

  .sm\:h-8 {
    height: 2rem;
  }

  .sm\:h-9 {
    height: 2.25rem;
  }

  .sm\:h-\[152px\] {
    height: 152px;
  }

  .sm\:h-\[180px\] {
    height: 180px;
  }

  .sm\:h-\[220px\] {
    height: 220px;
  }

  .sm\:h-\[6px\] {
    height: 6px;
  }

  .sm\:h-\[800px\] {
    height: 800px;
  }

  .sm\:h-\[calc\(100\%-242px\)\] {
    height: calc(100% - 242px);
  }

  .sm\:h-\[calc\(100\%-80px\)\] {
    height: calc(100% - 80px);
  }

  .sm\:h-\[calc\(100vh-56px-24px\)\] {
    height: calc(100vh - 56px - 24px);
  }

  .sm\:h-auto {
    height: auto;
  }

  .sm\:h-full {
    height: 100%;
  }

  .sm\:h-screen {
    height: 100vh;
  }

  .sm\:max-h-0 {
    max-height: 0px;
  }

  .sm\:max-h-\[372px\] {
    max-height: 372px;
  }

  .sm\:max-h-\[456px\] {
    max-height: 456px;
  }

  .sm\:max-h-\[592px\] {
    max-height: 592px;
  }

  .sm\:max-h-\[598px\] {
    max-height: 598px;
  }

  .sm\:max-h-\[600px\] {
    max-height: 600px;
  }

  .sm\:max-h-\[70vh\] {
    max-height: 70vh;
  }

  .sm\:min-h-9 {
    min-height: 2.25rem;
  }

  .sm\:min-h-\[215px\] {
    min-height: 215px;
  }

  .sm\:min-h-\[300px\] {
    min-height: 300px;
  }

  .sm\:min-h-\[308px\] {
    min-height: 308px;
  }

  .sm\:min-h-\[40px\] {
    min-height: 40px;
  }

  .sm\:min-h-\[500px\] {
    min-height: 500px;
  }

  .sm\:\!w-auto {
    width: auto !important;
  }

  .sm\:w-1\/2 {
    width: 50%;
  }

  .sm\:w-10 {
    width: 2.5rem;
  }

  .sm\:w-20 {
    width: 5rem;
  }

  .sm\:w-8 {
    width: 2rem;
  }

  .sm\:w-9 {
    width: 2.25rem;
  }

  .sm\:w-\[132px\] {
    width: 132px;
  }

  .sm\:w-\[140px\] {
    width: 140px;
  }

  .sm\:w-\[144px\] {
    width: 144px;
  }

  .sm\:w-\[160px\] {
    width: 160px;
  }

  .sm\:w-\[180px\] {
    width: 180px;
  }

  .sm\:w-\[190px\] {
    width: 190px;
  }

  .sm\:w-\[200px\] {
    width: 200px;
  }

  .sm\:w-\[210px\] {
    width: 210px;
  }

  .sm\:w-\[250px\] {
    width: 250px;
  }

  .sm\:w-\[254px\] {
    width: 254px;
  }

  .sm\:w-\[260px\] {
    width: 260px;
  }

  .sm\:w-\[265px\] {
    width: 265px;
  }

  .sm\:w-\[282px\] {
    width: 282px;
  }

  .sm\:w-\[308px\] {
    width: 308px;
  }

  .sm\:w-\[320px\] {
    width: 320px;
  }

  .sm\:w-\[324px\] {
    width: 324px;
  }

  .sm\:w-\[340px\] {
    width: 340px;
  }

  .sm\:w-\[352px\] {
    width: 352px;
  }

  .sm\:w-\[365px\] {
    width: 365px;
  }

  .sm\:w-\[50\%\] {
    width: 50%;
  }

  .sm\:w-\[580px\] {
    width: 580px;
  }

  .sm\:w-\[640px\] {
    width: 640px;
  }

  .sm\:w-\[6px\] {
    width: 6px;
  }

  .sm\:w-\[800px\] {
    width: 800px;
  }

  .sm\:w-\[calc\(33\.333\%-21px\)\] {
    width: calc(33.333% - 21px);
  }

  .sm\:w-\[calc\(50\%-12px\)\] {
    width: calc(50% - 12px);
  }

  .sm\:w-\[calc\(50\%_-_12px\)\] {
    width: calc(50% - 12px);
  }

  .sm\:w-auto {
    width: auto;
  }

  .sm\:w-full {
    width: 100%;
  }

  .sm\:min-w-9 {
    min-width: 2.25rem;
  }

  .sm\:min-w-\[100px\] {
    min-width: 100px;
  }

  .sm\:min-w-\[164px\] {
    min-width: 164px;
  }

  .sm\:min-w-\[175px\] {
    min-width: 175px;
  }

  .sm\:min-w-\[248px\] {
    min-width: 248px;
  }

  .sm\:min-w-\[32px\] {
    min-width: 32px;
  }

  .sm\:min-w-\[52px\] {
    min-width: 52px;
  }

  .sm\:min-w-\[72px\] {
    min-width: 72px;
  }

  .sm\:max-w-\[216px\] {
    max-width: 216px;
  }

  .sm\:max-w-\[260px\] {
    max-width: 260px;
  }

  .sm\:max-w-\[280px\] {
    max-width: 280px;
  }

  .sm\:max-w-\[310px\] {
    max-width: 310px;
  }

  .sm\:max-w-\[320px\] {
    max-width: 320px;
  }

  .sm\:max-w-\[340px\] {
    max-width: 340px;
  }

  .sm\:max-w-\[360px\] {
    max-width: 360px;
  }

  .sm\:max-w-\[370px\] {
    max-width: 370px;
  }

  .sm\:max-w-\[380px\] {
    max-width: 380px;
  }

  .sm\:max-w-\[390px\] {
    max-width: 390px;
  }

  .sm\:max-w-\[400px\] {
    max-width: 400px;
  }

  .sm\:max-w-\[414px\] {
    max-width: 414px;
  }

  .sm\:max-w-\[430px\] {
    max-width: 430px;
  }

  .sm\:max-w-\[480px\] {
    max-width: 480px;
  }

  .sm\:max-w-\[520px\] {
    max-width: 520px;
  }

  .sm\:max-w-\[604px\] {
    max-width: 604px;
  }

  .sm\:max-w-\[612px\] {
    max-width: 612px;
  }

  .sm\:max-w-\[640px\] {
    max-width: 640px;
  }

  .sm\:max-w-\[680px\] {
    max-width: 680px;
  }

  .sm\:max-w-\[calc\(50\%-20px\)\] {
    max-width: calc(50% - 20px);
  }

  .sm\:max-w-full {
    max-width: 100%;
  }

  .sm\:max-w-lg {
    max-width: 32rem;
  }

  .sm\:flex-1 {
    flex: 1 1 0%;
  }

  .sm\:flex-auto {
    flex: 1 1 auto;
  }

  .sm\:flex-none {
    flex: none;
  }

  .sm\:flex-shrink-0 {
    flex-shrink: 0;
  }

  .sm\:shrink-0 {
    flex-shrink: 0;
  }

  .sm\:translate-x-0 {
    --tw-translate-x: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .sm\:translate-y-0 {
    --tw-translate-y: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .sm\:scale-100 {
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .sm\:scale-95 {
    --tw-scale-x: .95;
    --tw-scale-y: .95;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .sm\:columns-3 {
    -moz-columns: 3;
         columns: 3;
  }

  .sm\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .sm\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .sm\:grid-cols-\[2fr_1fr_1fr_120px_40px\] {
    grid-template-columns: 2fr 1fr 1fr 120px 40px;
  }

  .sm\:grid-cols-\[3fr_1fr_1fr_1fr_60px\] {
    grid-template-columns: 3fr 1fr 1fr 1fr 60px;
  }

  .sm\:grid-cols-\[3fr_1fr_60px\] {
    grid-template-columns: 3fr 1fr 60px;
  }

  .sm\:flex-row {
    flex-direction: row;
  }

  .sm\:flex-row-reverse {
    flex-direction: row-reverse;
  }

  .sm\:flex-col {
    flex-direction: column;
  }

  .sm\:flex-nowrap {
    flex-wrap: nowrap;
  }

  .sm\:items-start {
    align-items: flex-start;
  }

  .sm\:items-end {
    align-items: flex-end;
  }

  .sm\:items-center {
    align-items: center;
  }

  .sm\:justify-start {
    justify-content: flex-start;
  }

  .sm\:justify-end {
    justify-content: flex-end;
  }

  .sm\:justify-center {
    justify-content: center;
  }

  .sm\:justify-between {
    justify-content: space-between;
  }

  .sm\:gap-0 {
    gap: 0px;
  }

  .sm\:gap-3 {
    gap: 0.75rem;
  }

  .sm\:gap-4 {
    gap: 1rem;
  }

  .sm\:gap-5 {
    gap: 1.25rem;
  }

  .sm\:gap-6 {
    gap: 1.5rem;
  }

  .sm\:gap-x-6 {
    -moz-column-gap: 1.5rem;
         column-gap: 1.5rem;
  }

  .sm\:gap-y-0 {
    row-gap: 0px;
  }

  .sm\:space-y-0 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0px * var(--tw-space-y-reverse));
  }

  .sm\:space-y-1 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
  }

  .sm\:overflow-hidden {
    overflow: hidden;
  }

  .sm\:overflow-visible {
    overflow: visible;
  }

  .sm\:overflow-x-auto {
    overflow-x: auto;
  }

  .sm\:overflow-y-auto {
    overflow-y: auto;
  }

  .sm\:overflow-y-hidden {
    overflow-y: hidden;
  }

  .sm\:whitespace-nowrap {
    white-space: nowrap;
  }

  .sm\:rounded-2xl {
    border-radius: 1rem;
  }

  .sm\:rounded-\[14px\] {
    border-radius: 14px;
  }

  .sm\:rounded-lg {
    border-radius: 0.5rem;
  }

  .sm\:rounded-md {
    border-radius: 0.375rem;
  }

  .sm\:rounded-none {
    border-radius: 0px;
  }

  .sm\:rounded-xl {
    border-radius: 0.75rem;
  }

  .sm\:border {
    border-width: 1px;
  }

  .sm\:border-0 {
    border-width: 0px;
  }

  .sm\:border-2 {
    border-width: 2px;
  }

  .sm\:border-b {
    border-bottom-width: 1px;
  }

  .sm\:border-b-0 {
    border-bottom-width: 0px;
  }

  .sm\:border-l {
    border-left-width: 1px;
  }

  .sm\:border-r {
    border-right-width: 1px;
  }

  .sm\:border-border-secondary {
    border-color: rgba(11, 15, 20, 0.09);
  }

  .sm\:border-gray-100 {
    --tw-border-opacity: 1;
    border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
  }

  .sm\:bg-\[\#E6F3FF\] {
    --tw-bg-opacity: 1;
    background-color: rgb(230 243 255 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-\[\#EDFFF2\] {
    --tw-bg-opacity: 1;
    background-color: rgb(237 255 242 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-bg-default-secondary {
    --tw-bg-opacity: 1;
    background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-bg-default-tertiary {
    --tw-bg-opacity: 1;
    background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-bg-primary {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-gray-900 {
    --tw-bg-opacity: 1;
    background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-ppt-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(255 243 240 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-transparent {
    background-color: transparent;
  }

  .sm\:bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  }

  .sm\:bg-opacity-60 {
    --tw-bg-opacity: 0.6;
  }

  .sm\:p-0 {
    padding: 0px;
  }

  .sm\:p-1 {
    padding: 0.25rem;
  }

  .sm\:p-10 {
    padding: 2.5rem;
  }

  .sm\:p-4 {
    padding: 1rem;
  }

  .sm\:p-5 {
    padding: 1.25rem;
  }

  .sm\:p-6 {
    padding: 1.5rem;
  }

  .sm\:p-7 {
    padding: 1.75rem;
  }

  .sm\:p-8 {
    padding: 2rem;
  }

  .sm\:p-\[30px\] {
    padding: 30px;
  }

  .sm\:p-\[52px\] {
    padding: 52px;
  }

  .sm\:px-0 {
    padding-left: 0px;
    padding-right: 0px;
  }

  .sm\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .sm\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .sm\:px-2 {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }

  .sm\:px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .sm\:px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .sm\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .sm\:px-7 {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
  }

  .sm\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .sm\:px-\[30px\] {
    padding-left: 30px;
    padding-right: 30px;
  }

  .sm\:px-\[32px\] {
    padding-left: 32px;
    padding-right: 32px;
  }

  .sm\:px-\[56px\] {
    padding-left: 56px;
    padding-right: 56px;
  }

  .sm\:py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .sm\:py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .sm\:py-28 {
    padding-top: 7rem;
    padding-bottom: 7rem;
  }

  .sm\:py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .sm\:py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .sm\:py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
  }

  .sm\:py-\[28px\] {
    padding-top: 28px;
    padding-bottom: 28px;
  }

  .sm\:\!pr-3 {
    padding-right: 0.75rem !important;
  }

  .sm\:\!pt-0 {
    padding-top: 0px !important;
  }

  .sm\:pb-0 {
    padding-bottom: 0px;
  }

  .sm\:pb-11 {
    padding-bottom: 2.75rem;
  }

  .sm\:pb-2 {
    padding-bottom: 0.5rem;
  }

  .sm\:pb-20 {
    padding-bottom: 5rem;
  }

  .sm\:pb-3 {
    padding-bottom: 0.75rem;
  }

  .sm\:pb-4 {
    padding-bottom: 1rem;
  }

  .sm\:pb-5 {
    padding-bottom: 1.25rem;
  }

  .sm\:pb-\[10px\] {
    padding-bottom: 10px;
  }

  .sm\:pb-\[30px\] {
    padding-bottom: 30px;
  }

  .sm\:pl-11 {
    padding-left: 2.75rem;
  }

  .sm\:pl-3 {
    padding-left: 0.75rem;
  }

  .sm\:pl-4 {
    padding-left: 1rem;
  }

  .sm\:pl-6 {
    padding-left: 1.5rem;
  }

  .sm\:pl-\[52px\] {
    padding-left: 52px;
  }

  .sm\:pr-0 {
    padding-right: 0px;
  }

  .sm\:pr-10 {
    padding-right: 2.5rem;
  }

  .sm\:pr-11 {
    padding-right: 2.75rem;
  }

  .sm\:pr-2 {
    padding-right: 0.5rem;
  }

  .sm\:pr-3 {
    padding-right: 0.75rem;
  }

  .sm\:pr-6 {
    padding-right: 1.5rem;
  }

  .sm\:pr-\[100px\] {
    padding-right: 100px;
  }

  .sm\:pr-\[104px\] {
    padding-right: 104px;
  }

  .sm\:pr-\[10px\] {
    padding-right: 10px;
  }

  .sm\:pr-\[30px\] {
    padding-right: 30px;
  }

  .sm\:pr-\[72px\] {
    padding-right: 72px;
  }

  .sm\:pt-0 {
    padding-top: 0px;
  }

  .sm\:pt-1 {
    padding-top: 0.25rem;
  }

  .sm\:pt-10 {
    padding-top: 2.5rem;
  }

  .sm\:pt-3 {
    padding-top: 0.75rem;
  }

  .sm\:pt-6 {
    padding-top: 1.5rem;
  }

  .sm\:pt-\[100px\] {
    padding-top: 100px;
  }

  .sm\:pt-\[106px\] {
    padding-top: 106px;
  }

  .sm\:pt-\[114px\] {
    padding-top: 114px;
  }

  .sm\:pt-\[14vh\] {
    padding-top: 14vh;
  }

  .sm\:pt-\[15vh\] {
    padding-top: 15vh;
  }

  .sm\:pt-\[56px\] {
    padding-top: 56px;
  }

  .sm\:pt-\[88px\] {
    padding-top: 88px;
  }

  .sm\:text-left {
    text-align: left;
  }

  .sm\:text-center {
    text-align: center;
  }

  .sm\:text-right {
    text-align: right;
  }

  .sm\:align-middle {
    vertical-align: middle;
  }

  .sm\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .sm\:text-2xs {
    font-size: 0.813rem;
  }

  .sm\:text-\[1\.75rem\] {
    font-size: 1.75rem;
  }

  .sm\:text-\[20px\] {
    font-size: 20px;
  }

  .sm\:text-\[27px\] {
    font-size: 27px;
  }

  .sm\:text-\[30px\] {
    font-size: 30px;
  }

  .sm\:text-\[32px\] {
    font-size: 32px;
  }

  .sm\:text-\[36px\] {
    font-size: 36px;
  }

  .sm\:text-\[52px\] {
    font-size: 52px;
  }

  .sm\:text-\[62px\] {
    font-size: 62px;
  }

  .sm\:text-\[68px\] {
    font-size: 68px;
  }

  .sm\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .sm\:text-heading-4xl {
    font-size: 2.25rem;
    line-height: normal;
    letter-spacing: -0.0075em;
    font-weight: 400;
  }

  .sm\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .sm\:text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .sm\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .sm\:text-xs {
    font-size: 0.75rem;
    line-height: 1rem;
  }

  .sm\:font-medium {
    font-weight: 500;
  }

  .sm\:leading-5 {
    line-height: 1.25rem;
  }

  .sm\:leading-6 {
    line-height: 1.5rem;
  }

  .sm\:leading-\[1\.3\] {
    line-height: 1.3;
  }

  .sm\:leading-\[30px\] {
    line-height: 30px;
  }

  .sm\:leading-\[32px\] {
    line-height: 32px;
  }

  .sm\:leading-\[40px\] {
    line-height: 40px;
  }

  .sm\:leading-\[45px\] {
    line-height: 45px;
  }

  .sm\:leading-\[68px\] {
    line-height: 68px;
  }

  .sm\:tracking-\[unset\] {
    letter-spacing: unset;
  }

  .sm\:opacity-0 {
    opacity: 0;
  }

  .sm\:opacity-100 {
    opacity: 1;
  }

  .sm\:shadow-elevation-02 {
    --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
    --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .sm\:shadow-elevation-03 {
    --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09), 0 4px 6px 0 rgba(9, 15, 21, 0.09), 0 24px 40px -16px rgba(9, 15, 21, 0.09);
    --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 24px 40px -16px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .sm\:shadow-elevation-04 {
    --tw-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.30) inset, 0 0 0 0.5px rgba(11, 15, 20, 0.09), 0 1px 2px 0 rgba(26, 26, 26, 0.06), 0 4px 6px 0 rgba(26, 26, 26, 0.06), 0 40px 40px -24px rgba(26, 26, 26, 0.06), 0 56px 56px -32px rgba(26, 26, 26, 0.09), 0 24px 40px 0 rgba(26, 26, 26, 0.06);
    --tw-shadow-colored: inset 0 0 0 1.5px var(--tw-shadow-color), 0 0 0 0.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 40px 40px -24px var(--tw-shadow-color), 0 56px 56px -32px var(--tw-shadow-color), 0 24px 40px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .sm\:shadow-lg {
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .sm\:shadow-xl {
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .sm\:outline-none {
    outline: 2px solid transparent;
    outline-offset: 2px;
  }

  .sm\:transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
  }

  .sm\:duration-300 {
    transition-duration: 300ms;
  }

  .sm\:ease-in-out {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }

  .hover\:sm\:bg-bg-default-secondary:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
  }

  .sm\:hover\:bg-gray-100:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
  }

  .sm\:hover\:shadow-elevation-04:hover {
    --tw-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.30) inset, 0 0 0 0.5px rgba(11, 15, 20, 0.09), 0 1px 2px 0 rgba(26, 26, 26, 0.06), 0 4px 6px 0 rgba(26, 26, 26, 0.06), 0 40px 40px -24px rgba(26, 26, 26, 0.06), 0 56px 56px -32px rgba(26, 26, 26, 0.09), 0 24px 40px 0 rgba(26, 26, 26, 0.06);
    --tw-shadow-colored: inset 0 0 0 1.5px var(--tw-shadow-color), 0 0 0 0.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 40px 40px -24px var(--tw-shadow-color), 0 56px 56px -32px var(--tw-shadow-color), 0 24px 40px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .sm\:active\:bg-bg-elevated:active {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  }

  .group:hover .sm\:group-hover\:top-\[-76px\] {
    top: -76px;
  }

  .group:hover .sm\:group-hover\:top-\[-96px\] {
    top: -96px;
  }

  .group:hover .sm\:group-hover\:max-h-20 {
    max-height: 5rem;
  }

  .group:hover .sm\:group-hover\:opacity-100 {
    opacity: 1;
  }

  .group:hover .sm\:group-hover\:opacity-80 {
    opacity: 0.8;
  }
}
@media (min-width: 768px) {

  .md\:pointer-events-auto {
    pointer-events: auto;
  }

  .md\:static {
    position: static;
  }

  .md\:absolute {
    position: absolute;
  }

  .md\:relative {
    position: relative;
  }

  .md\:\!right-\[-44px\] {
    right: -44px !important;
  }

  .md\:\!top-0 {
    top: 0px !important;
  }

  .md\:-right-10 {
    right: -2.5rem;
  }

  .md\:-right-11 {
    right: -2.75rem;
  }

  .md\:-right-14 {
    right: -3.5rem;
  }

  .md\:-right-4 {
    right: -1rem;
  }

  .md\:bottom-\[15px\] {
    bottom: 15px;
  }

  .md\:left-12 {
    left: 3rem;
  }

  .md\:left-20 {
    left: 5rem;
  }

  .md\:left-6 {
    left: 1.5rem;
  }

  .md\:left-\[14px\] {
    left: 14px;
  }

  .md\:left-\[276px\] {
    left: 276px;
  }

  .md\:left-\[46px\] {
    left: 46px;
  }

  .md\:left-\[62px\] {
    left: 62px;
  }

  .md\:right-0 {
    right: 0px;
  }

  .md\:right-20 {
    right: 5rem;
  }

  .md\:right-3 {
    right: 0.75rem;
  }

  .md\:right-5 {
    right: 1.25rem;
  }

  .md\:top-0 {
    top: 0px;
  }

  .md\:top-3 {
    top: 0.75rem;
  }

  .md\:top-6 {
    top: 1.5rem;
  }

  .md\:top-7 {
    top: 1.75rem;
  }

  .md\:top-\[-10px\] {
    top: -10px;
  }

  .md\:top-\[-32px\] {
    top: -32px;
  }

  .md\:top-\[14px\] {
    top: 14px;
  }

  .md\:z-20 {
    z-index: 20;
  }

  .md\:z-\[1\] {
    z-index: 1;
  }

  .md\:order-1 {
    order: 1;
  }

  .md\:order-2 {
    order: 2;
  }

  .md\:order-none {
    order: 0;
  }

  .md\:col-span-1 {
    grid-column: span 1 / span 1;
  }

  .md\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .md\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .md\:col-span-6 {
    grid-column: span 6 / span 6;
  }

  .md\:col-span-7 {
    grid-column: span 7 / span 7;
  }

  .md\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .md\:-mx-10 {
    margin-left: -2.5rem;
    margin-right: -2.5rem;
  }

  .md\:mx-0 {
    margin-left: 0px;
    margin-right: 0px;
  }

  .md\:my-\[52px\] {
    margin-top: 52px;
    margin-bottom: 52px;
  }

  .md\:-mt-6 {
    margin-top: -1.5rem;
  }

  .md\:mb-0 {
    margin-bottom: 0px;
  }

  .md\:mb-20 {
    margin-bottom: 5rem;
  }

  .md\:ml-0 {
    margin-left: 0px;
  }

  .md\:ml-2 {
    margin-left: 0.5rem;
  }

  .md\:ml-3 {
    margin-left: 0.75rem;
  }

  .md\:ml-5 {
    margin-left: 1.25rem;
  }

  .md\:ml-\[18px\] {
    margin-left: 18px;
  }

  .md\:ml-\[24px\] {
    margin-left: 24px;
  }

  .md\:ml-\[25px\] {
    margin-left: 25px;
  }

  .md\:ml-auto {
    margin-left: auto;
  }

  .md\:mr-10 {
    margin-right: 2.5rem;
  }

  .md\:mr-4 {
    margin-right: 1rem;
  }

  .md\:mr-\[14px\] {
    margin-right: 14px;
  }

  .md\:mr-\[25px\] {
    margin-right: 25px;
  }

  .md\:mr-auto {
    margin-right: auto;
  }

  .md\:mt-0 {
    margin-top: 0px;
  }

  .md\:mt-1 {
    margin-top: 0.25rem;
  }

  .md\:mt-10 {
    margin-top: 2.5rem;
  }

  .md\:mt-2 {
    margin-top: 0.5rem;
  }

  .md\:mt-20 {
    margin-top: 5rem;
  }

  .md\:mt-3 {
    margin-top: 0.75rem;
  }

  .md\:mt-32 {
    margin-top: 8rem;
  }

  .md\:mt-5 {
    margin-top: 1.25rem;
  }

  .md\:mt-8 {
    margin-top: 2rem;
  }

  .md\:mt-auto {
    margin-top: auto;
  }

  .md\:block {
    display: block;
  }

  .md\:\!flex {
    display: flex !important;
  }

  .md\:flex {
    display: flex;
  }

  .md\:inline-flex {
    display: inline-flex;
  }

  .md\:grid {
    display: grid;
  }

  .md\:\!hidden {
    display: none !important;
  }

  .md\:hidden {
    display: none;
  }

  .md\:\!h-12 {
    height: 3rem !important;
  }

  .md\:h-12 {
    height: 3rem;
  }

  .md\:h-\[130px\] {
    height: 130px;
  }

  .md\:h-\[140px\] {
    height: 140px;
  }

  .md\:h-\[242px\] {
    height: 242px;
  }

  .md\:h-\[280px\] {
    height: 280px;
  }

  .md\:h-\[288px\] {
    height: 288px;
  }

  .md\:h-\[290px\] {
    height: 290px;
  }

  .md\:h-\[540px\] {
    height: 540px;
  }

  .md\:h-\[54px\] {
    height: 54px;
  }

  .md\:h-\[570px\] {
    height: 570px;
  }

  .md\:h-\[60px\] {
    height: 60px;
  }

  .md\:h-\[68px\] {
    height: 68px;
  }

  .md\:h-\[86px\] {
    height: 86px;
  }

  .md\:h-\[calc\(100\%\+48px\)\] {
    height: calc(100% + 48px);
  }

  .md\:h-\[calc\(100\%-104px\)\] {
    height: calc(100% - 104px);
  }

  .md\:h-\[calc\(100\%-66px\)\] {
    height: calc(100% - 66px);
  }

  .md\:h-\[calc\(100\%-85px\)\] {
    height: calc(100% - 85px);
  }

  .md\:h-\[calc\(100vh-12px\)\] {
    height: calc(100vh - 12px);
  }

  .md\:h-auto {
    height: auto;
  }

  .md\:h-full {
    height: 100%;
  }

  .md\:max-h-\[544px\] {
    max-height: 544px;
  }

  .md\:max-h-\[580px\] {
    max-height: 580px;
  }

  .md\:max-h-\[603px\] {
    max-height: 603px;
  }

  .md\:max-h-\[615px\] {
    max-height: 615px;
  }

  .md\:max-h-\[631px\] {
    max-height: 631px;
  }

  .md\:max-h-\[681px\] {
    max-height: 681px;
  }

  .md\:max-h-\[690px\] {
    max-height: 690px;
  }

  .md\:max-h-\[90vh\] {
    max-height: 90vh;
  }

  .md\:max-h-\[auto\] {
    max-height: auto;
  }

  .md\:max-h-\[calc\(100vh-64px\)\] {
    max-height: calc(100vh - 64px);
  }

  .md\:min-h-0 {
    min-height: 0px;
  }

  .md\:min-h-\[auto\] {
    min-height: auto;
  }

  .md\:min-h-\[min\(540px\2c 66vh\)\] {
    min-height: min(540px, 66vh);
  }

  .md\:\!w-\[260px\] {
    width: 260px !important;
  }

  .md\:w-1\/2 {
    width: 50%;
  }

  .md\:w-\[100px\] {
    width: 100px;
  }

  .md\:w-\[120px\] {
    width: 120px;
  }

  .md\:w-\[140px\] {
    width: 140px;
  }

  .md\:w-\[150px\] {
    width: 150px;
  }

  .md\:w-\[185px\] {
    width: 185px;
  }

  .md\:w-\[200px\] {
    width: 200px;
  }

  .md\:w-\[208px\] {
    width: 208px;
  }

  .md\:w-\[230px\] {
    width: 230px;
  }

  .md\:w-\[245px\] {
    width: 245px;
  }

  .md\:w-\[249px\] {
    width: 249px;
  }

  .md\:w-\[260px\] {
    width: 260px;
  }

  .md\:w-\[280px\] {
    width: 280px;
  }

  .md\:w-\[360px\] {
    width: 360px;
  }

  .md\:w-\[384px\] {
    width: 384px;
  }

  .md\:w-\[400px\] {
    width: 400px;
  }

  .md\:w-\[41\%\] {
    width: 41%;
  }

  .md\:w-\[428px\] {
    width: 428px;
  }

  .md\:w-\[434px\] {
    width: 434px;
  }

  .md\:w-\[436px\] {
    width: 436px;
  }

  .md\:w-\[512px\] {
    width: 512px;
  }

  .md\:w-\[59\%\] {
    width: 59%;
  }

  .md\:w-\[80px\] {
    width: 80px;
  }

  .md\:w-\[calc\(100\%-104px\)\] {
    width: calc(100% - 104px);
  }

  .md\:w-\[calc\(100\%-212px\)\] {
    width: calc(100% - 212px);
  }

  .md\:w-\[calc\(100\%-240px\)\] {
    width: calc(100% - 240px);
  }

  .md\:w-\[calc\(100\%-276px\)\] {
    width: calc(100% - 276px);
  }

  .md\:w-\[calc\(100vw-264px\)\] {
    width: calc(100vw - 264px);
  }

  .md\:w-\[min\(1320px\2c 88vw\)\] {
    width: min(1320px, 88vw);
  }

  .md\:w-auto {
    width: auto;
  }

  .md\:w-full {
    width: 100%;
  }

  .md\:min-w-\[280px\] {
    min-width: 280px;
  }

  .md\:min-w-\[800px\] {
    min-width: 800px;
  }

  .md\:\!max-w-\[620px\] {
    max-width: 620px !important;
  }

  .md\:max-w-\[1000px\] {
    max-width: 1000px;
  }

  .md\:max-w-\[234px\] {
    max-width: 234px;
  }

  .md\:max-w-\[240px\] {
    max-width: 240px;
  }

  .md\:max-w-\[300px\] {
    max-width: 300px;
  }

  .md\:max-w-\[384px\] {
    max-width: 384px;
  }

  .md\:max-w-\[390px\] {
    max-width: 390px;
  }

  .md\:max-w-\[400px\] {
    max-width: 400px;
  }

  .md\:max-w-\[408px\] {
    max-width: 408px;
  }

  .md\:max-w-\[440px\] {
    max-width: 440px;
  }

  .md\:max-w-\[450px\] {
    max-width: 450px;
  }

  .md\:max-w-\[480px\] {
    max-width: 480px;
  }

  .md\:max-w-\[500px\] {
    max-width: 500px;
  }

  .md\:max-w-\[540px\] {
    max-width: 540px;
  }

  .md\:max-w-\[550px\] {
    max-width: 550px;
  }

  .md\:max-w-\[552px\] {
    max-width: 552px;
  }

  .md\:max-w-\[600px\] {
    max-width: 600px;
  }

  .md\:max-w-\[620px\] {
    max-width: 620px;
  }

  .md\:max-w-\[722px\] {
    max-width: 722px;
  }

  .md\:max-w-\[938px\] {
    max-width: 938px;
  }

  .md\:max-w-\[94\%\] {
    max-width: 94%;
  }

  .md\:max-w-\[unset\] {
    max-width: unset;
  }

  .md\:max-w-full {
    max-width: 100%;
  }

  .md\:flex-1 {
    flex: 1 1 0%;
  }

  .md\:shrink-0 {
    flex-shrink: 0;
  }

  .md\:translate-x-0 {
    --tw-translate-x: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .md\:scale-\[0\.2222\] {
    --tw-scale-x: 0.2222;
    --tw-scale-y: 0.2222;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .md\:scale-\[0\.3264\] {
    --tw-scale-x: 0.3264;
    --tw-scale-y: 0.3264;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .md\:grid-cols-\[1fr_120px_120px_30px\] {
    grid-template-columns: 1fr 120px 120px 30px;
  }

  .md\:grid-cols-\[35fr_65fr\] {
    grid-template-columns: 35fr 65fr;
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:flex-wrap {
    flex-wrap: wrap;
  }

  .md\:flex-nowrap {
    flex-wrap: nowrap;
  }

  .md\:items-start {
    align-items: flex-start;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:justify-start {
    justify-content: flex-start;
  }

  .md\:justify-end {
    justify-content: flex-end;
  }

  .md\:justify-center {
    justify-content: center;
  }

  .md\:justify-between {
    justify-content: space-between;
  }

  .md\:gap-0 {
    gap: 0px;
  }

  .md\:gap-1 {
    gap: 0.25rem;
  }

  .md\:gap-10 {
    gap: 2.5rem;
  }

  .md\:gap-2\.5 {
    gap: 0.625rem;
  }

  .md\:gap-3 {
    gap: 0.75rem;
  }

  .md\:gap-4 {
    gap: 1rem;
  }

  .md\:gap-5 {
    gap: 1.25rem;
  }

  .md\:gap-8 {
    gap: 2rem;
  }

  .md\:space-y-1 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
  }

  .md\:overflow-visible {
    overflow: visible;
  }

  .md\:overflow-y-auto {
    overflow-y: auto;
  }

  .md\:overflow-x-hidden {
    overflow-x: hidden;
  }

  .md\:rounded-\[20px\] {
    border-radius: 20px;
  }

  .md\:rounded-lg {
    border-radius: 0.5rem;
  }

  .md\:rounded-xl {
    border-radius: 0.75rem;
  }

  .md\:\!rounded-l-\[0px\] {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
  }

  .md\:\!rounded-r-\[0px\] {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
  }

  .md\:border {
    border-width: 1px;
  }

  .md\:\!border-l-\[0px\] {
    border-left-width: 0px !important;
  }

  .md\:\!border-r-\[0px\] {
    border-right-width: 0px !important;
  }

  .md\:border-l {
    border-left-width: 1px;
  }

  .md\:border-r {
    border-right-width: 1px;
  }

  .md\:border-t-0 {
    border-top-width: 0px;
  }

  .md\:border-none {
    border-style: none;
  }

  .md\:border-border-secondary {
    border-color: rgba(11, 15, 20, 0.09);
  }

  .md\:border-gray-100 {
    --tw-border-opacity: 1;
    border-color: rgb(224 224 224 / var(--tw-border-opacity, 1));
  }

  .md\:bg-bg-default-primary {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  }

  .md\:bg-bg-muted {
    --tw-bg-opacity: 1;
    background-color: rgb(249 249 249 / var(--tw-bg-opacity, 1));
  }

  .md\:bg-gray-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
  }

  .md\:bg-gray-900 {
    --tw-bg-opacity: 1;
    background-color: rgb(22 22 22 / var(--tw-bg-opacity, 1));
  }

  .md\:bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  }

  .md\:bg-opacity-0 {
    --tw-bg-opacity: 0;
  }

  .md\:bg-opacity-50 {
    --tw-bg-opacity: 0.5;
  }

  .md\:object-cover {
    -o-object-fit: cover;
       object-fit: cover;
  }

  .md\:p-0 {
    padding: 0px;
  }

  .md\:p-10 {
    padding: 2.5rem;
  }

  .md\:p-12 {
    padding: 3rem;
  }

  .md\:p-4 {
    padding: 1rem;
  }

  .md\:p-6 {
    padding: 1.5rem;
  }

  .md\:p-8 {
    padding: 2rem;
  }

  .md\:p-\[30px\] {
    padding: 30px;
  }

  .md\:px-0 {
    padding-left: 0px;
    padding-right: 0px;
  }

  .md\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .md\:px-12 {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .md\:px-20 {
    padding-left: 5rem;
    padding-right: 5rem;
  }

  .md\:px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .md\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .md\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .md\:px-\[16px\] {
    padding-left: 16px;
    padding-right: 16px;
  }

  .md\:px-\[24px\] {
    padding-left: 24px;
    padding-right: 24px;
  }

  .md\:px-\[252px\] {
    padding-left: 252px;
    padding-right: 252px;
  }

  .md\:px-\[30px\] {
    padding-left: 30px;
    padding-right: 30px;
  }

  .md\:py-0 {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .md\:py-1 {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }

  .md\:py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .md\:py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .md\:py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }

  .md\:py-\[16px\] {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  .md\:\!pb-10 {
    padding-bottom: 2.5rem !important;
  }

  .md\:pb-0 {
    padding-bottom: 0px;
  }

  .md\:pb-2 {
    padding-bottom: 0.5rem;
  }

  .md\:pb-6 {
    padding-bottom: 1.5rem;
  }

  .md\:pb-8 {
    padding-bottom: 2rem;
  }

  .md\:pb-\[30px\] {
    padding-bottom: 30px;
  }

  .md\:pl-0 {
    padding-left: 0px;
  }

  .md\:pl-10 {
    padding-left: 2.5rem;
  }

  .md\:pl-3 {
    padding-left: 0.75rem;
  }

  .md\:pl-4 {
    padding-left: 1rem;
  }

  .md\:pl-6 {
    padding-left: 1.5rem;
  }

  .md\:pl-\[16px\] {
    padding-left: 16px;
  }

  .md\:pl-\[24px\] {
    padding-left: 24px;
  }

  .md\:pl-\[2px\] {
    padding-left: 2px;
  }

  .md\:pl-\[30px\] {
    padding-left: 30px;
  }

  .md\:pl-\[56px\] {
    padding-left: 56px;
  }

  .md\:pr-10 {
    padding-right: 2.5rem;
  }

  .md\:pr-12 {
    padding-right: 3rem;
  }

  .md\:pr-2 {
    padding-right: 0.5rem;
  }

  .md\:pr-4 {
    padding-right: 1rem;
  }

  .md\:pr-8 {
    padding-right: 2rem;
  }

  .md\:pr-\[14px\] {
    padding-right: 14px;
  }

  .md\:pr-\[16px\] {
    padding-right: 16px;
  }

  .md\:pr-\[200px\] {
    padding-right: 200px;
  }

  .md\:pr-\[30px\] {
    padding-right: 30px;
  }

  .md\:pr-\[52px\] {
    padding-right: 52px;
  }

  .md\:pr-\[8px\] {
    padding-right: 8px;
  }

  .md\:pt-0 {
    padding-top: 0px;
  }

  .md\:pt-10 {
    padding-top: 2.5rem;
  }

  .md\:pt-20 {
    padding-top: 5rem;
  }

  .md\:pt-6 {
    padding-top: 1.5rem;
  }

  .md\:pt-8 {
    padding-top: 2rem;
  }

  .md\:pt-\[30px\] {
    padding-top: 30px;
  }

  .md\:pt-\[60px\] {
    padding-top: 60px;
  }

  .md\:text-left {
    text-align: left;
  }

  .md\:text-center {
    text-align: center;
  }

  .md\:text-right {
    text-align: right;
  }

  .md\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .md\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }

  .md\:text-\[14px\] {
    font-size: 14px;
  }

  .md\:text-\[24px\] {
    font-size: 24px;
  }

  .md\:text-\[26px\] {
    font-size: 26px;
  }

  .md\:text-\[280px\] {
    font-size: 280px;
  }

  .md\:text-\[28px\] {
    font-size: 28px;
  }

  .md\:text-\[36px\] {
    font-size: 36px;
  }

  .md\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .md\:text-heading-2xl {
    font-size: 1.5rem;
    line-height: 1.3;
    letter-spacing: -0.01em;
    font-weight: 400;
  }

  .md\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .md\:text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .md\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .md\:leading-4 {
    line-height: 1rem;
  }

  .md\:leading-5 {
    line-height: 1.25rem;
  }

  .md\:leading-6 {
    line-height: 1.5rem;
  }

  .md\:leading-\[44px\] {
    line-height: 44px;
  }

  .md\:text-text-primary {
    --tw-text-opacity: 1;
    color: rgb(23 23 23 / var(--tw-text-opacity, 1));
  }

  .md\:opacity-0 {
    opacity: 0;
  }

  .md\:opacity-70 {
    opacity: 0.7;
  }

  .md\:shadow-md {
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }

  .md\:transition-none {
    transition-property: none;
  }

  .md\:\[background\:linear-gradient\(to_right\2c theme\(colors\.bg-muted\)_260px\2c theme\(colors\.bg-subtle\)_260px\)\] {
    background: linear-gradient(to right,#F9F9F9 260px,#FCFCFC 260px);
  }

  .md\:last\:mr-0:last-child {
    margin-right: 0px;
  }
}
@media (min-width: 1024px) {

  .lg\:static {
    position: static;
  }

  .lg\:bottom-\[18px\] {
    bottom: 18px;
  }

  .lg\:col-span-2 {
    grid-column: span 2 / span 2;
  }

  .lg\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .lg\:col-span-6 {
    grid-column: span 6 / span 6;
  }

  .lg\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .lg\:-mx-8 {
    margin-left: -2rem;
    margin-right: -2rem;
  }

  .lg\:-my-4 {
    margin-top: -1rem;
    margin-bottom: -1rem;
  }

  .lg\:my-0 {
    margin-top: 0px;
    margin-bottom: 0px;
  }

  .lg\:-ml-7 {
    margin-left: -1.75rem;
  }

  .lg\:ml-1 {
    margin-left: 0.25rem;
  }

  .lg\:mr-2 {
    margin-right: 0.5rem;
  }

  .lg\:mt-0 {
    margin-top: 0px;
  }

  .lg\:mt-\[66px\] {
    margin-top: 66px;
  }

  .lg\:block {
    display: block;
  }

  .lg\:inline {
    display: inline;
  }

  .lg\:\!flex {
    display: flex !important;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:inline-flex {
    display: inline-flex;
  }

  .lg\:table-cell {
    display: table-cell;
  }

  .lg\:\!hidden {
    display: none !important;
  }

  .lg\:hidden {
    display: none;
  }

  .lg\:\!w-\[240px\] {
    width: 240px !important;
  }

  .lg\:w-\[258px\] {
    width: 258px;
  }

  .lg\:w-\[296px\] {
    width: 296px;
  }

  .lg\:w-\[400px\] {
    width: 400px;
  }

  .lg\:w-\[408px\] {
    width: 408px;
  }

  .lg\:w-\[540px\] {
    width: 540px;
  }

  .lg\:w-\[calc\(100\%\+56px\)\] {
    width: calc(100% + 56px);
  }

  .lg\:w-\[calc\(100\%-8px\)\] {
    width: calc(100% - 8px);
  }

  .lg\:w-\[calc\(33\.333\%_-_16px\)\] {
    width: calc(33.333% - 16px);
  }

  .lg\:min-w-0 {
    min-width: 0px;
  }

  .lg\:min-w-\[258px\] {
    min-width: 258px;
  }

  .lg\:min-w-\[340px\] {
    min-width: 340px;
  }

  .lg\:max-w-\[376px\] {
    max-width: 376px;
  }

  .lg\:max-w-\[550px\] {
    max-width: 550px;
  }

  .lg\:max-w-\[668px\] {
    max-width: 668px;
  }

  .lg\:max-w-\[768px\] {
    max-width: 768px;
  }

  .lg\:max-w-\[calc\(33\.333\%-20px\)\] {
    max-width: calc(33.333% - 20px);
  }

  .lg\:flex-1 {
    flex: 1 1 0%;
  }

  .lg\:flex-none {
    flex: none;
  }

  .lg\:shrink-0 {
    flex-shrink: 0;
  }

  .lg\:translate-y-0 {
    --tw-translate-y: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .lg\:columns-4 {
    -moz-columns: 4;
         columns: 4;
  }

  .lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .lg\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .lg\:grid-cols-\[14\] {
    grid-template-columns: 14;
  }

  .lg\:grid-cols-\[1fr_160px_160px_160px_160px\] {
    grid-template-columns: 1fr 160px 160px 160px 160px;
  }

  .lg\:flex-row {
    flex-direction: row;
  }

  .lg\:flex-wrap {
    flex-wrap: wrap;
  }

  .lg\:items-center {
    align-items: center;
  }

  .lg\:justify-start {
    justify-content: flex-start;
  }

  .lg\:justify-end {
    justify-content: flex-end;
  }

  .lg\:gap-0 {
    gap: 0px;
  }

  .lg\:gap-5 {
    gap: 1.25rem;
  }

  .lg\:gap-7 {
    gap: 1.75rem;
  }

  .lg\:gap-\[10px\] {
    gap: 10px;
  }

  .lg\:space-y-0 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0px * var(--tw-space-y-reverse));
  }

  .lg\:overflow-visible {
    overflow: visible;
  }

  .lg\:rounded-lg {
    border-radius: 0.5rem;
  }

  .lg\:rounded-l-none {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
  }

  .lg\:rounded-r-none {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  }

  .lg\:border {
    border-width: 1px;
  }

  .lg\:border-b {
    border-bottom-width: 1px;
  }

  .lg\:border-l {
    border-left-width: 1px;
  }

  .lg\:border-l-0 {
    border-left-width: 0px;
  }

  .lg\:border-r {
    border-right-width: 1px;
  }

  .lg\:border-r-0 {
    border-right-width: 0px;
  }

  .lg\:border-t {
    border-top-width: 1px;
  }

  .lg\:border-border-secondary {
    border-color: rgba(11, 15, 20, 0.09);
  }

  .lg\:px-0 {
    padding-left: 0px;
    padding-right: 0px;
  }

  .lg\:px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  .lg\:px-20 {
    padding-left: 5rem;
    padding-right: 5rem;
  }

  .lg\:px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .lg\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .lg\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .lg\:px-\[32px\] {
    padding-left: 32px;
    padding-right: 32px;
  }

  .lg\:py-0 {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .lg\:py-\[32px\] {
    padding-top: 32px;
    padding-bottom: 32px;
  }

  .lg\:pb-28 {
    padding-bottom: 7rem;
  }

  .lg\:pl-20 {
    padding-left: 5rem;
  }

  .lg\:pl-4 {
    padding-left: 1rem;
  }

  .lg\:pl-\[100px\] {
    padding-left: 100px;
  }

  .lg\:pr-0 {
    padding-right: 0px;
  }

  .lg\:pr-20 {
    padding-right: 5rem;
  }

  .lg\:pr-4 {
    padding-right: 1rem;
  }

  .lg\:pr-\[100px\] {
    padding-right: 100px;
  }

  .lg\:pt-10 {
    padding-top: 2.5rem;
  }

  .lg\:text-start {
    text-align: start;
  }

  .lg\:text-2xs {
    font-size: 0.813rem;
  }

  .lg\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .lg\:leading-5 {
    line-height: 1.25rem;
  }

  .lg\:leading-6 {
    line-height: 1.5rem;
  }

  .lg\:\[mask-image\:none\] {
    -webkit-mask-image: none;
            mask-image: none;
  }
}
@media (min-width: 1280px) {

  .xl\:left-\[101\%\] {
    left: 101%;
  }

  .xl\:right-auto {
    right: auto;
  }

  .xl\:top-0 {
    top: 0px;
  }

  .xl\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .xl\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .xl\:block {
    display: block;
  }

  .xl\:flex {
    display: flex;
  }

  .xl\:table-cell {
    display: table-cell;
  }

  .xl\:hidden {
    display: none;
  }

  .xl\:h-\[344px\] {
    height: 344px;
  }

  .xl\:h-auto {
    height: auto;
  }

  .xl\:max-h-12 {
    max-height: 3rem;
  }

  .xl\:max-h-9 {
    max-height: 2.25rem;
  }

  .xl\:w-1\/2 {
    width: 50%;
  }

  .xl\:w-\[1px\] {
    width: 1px;
  }

  .xl\:w-\[280px\] {
    width: 280px;
  }

  .xl\:w-\[460px\] {
    width: 460px;
  }

  .xl\:min-w-\[280px\] {
    min-width: 280px;
  }

  .xl\:max-w-\[500px\] {
    max-width: 500px;
  }

  .xl\:max-w-\[75\%\] {
    max-width: 75%;
  }

  .xl\:flex-none {
    flex: none;
  }

  .xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .xl\:flex-row {
    flex-direction: row;
  }

  .xl\:flex-col {
    flex-direction: column;
  }

  .xl\:items-stretch {
    align-items: stretch;
  }

  .xl\:justify-start {
    justify-content: flex-start;
  }

  .xl\:justify-between {
    justify-content: space-between;
  }

  .xl\:gap-0 {
    gap: 0px;
  }

  .xl\:gap-\[32px\] {
    gap: 32px;
  }

  .xl\:gap-x-6 {
    -moz-column-gap: 1.5rem;
         column-gap: 1.5rem;
  }

  .xl\:gap-x-8 {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }

  .xl\:\!rounded-full {
    border-radius: 9999px !important;
  }

  .xl\:p-6 {
    padding: 1.5rem;
  }

  .xl\:px-16 {
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .xl\:px-\[40px\] {
    padding-left: 40px;
    padding-right: 40px;
  }

  .xl\:py-\[40px\] {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .xl\:pb-\[40px\] {
    padding-bottom: 40px;
  }

  .xl\:pb-\[56px\] {
    padding-bottom: 56px;
  }

  .xl\:pl-\[16px\] {
    padding-left: 16px;
  }

  .xl\:pt-\[56px\] {
    padding-top: 56px;
  }

  .xl\:\!shadow-elevation-button {
    --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 1px rgba(9, 15, 21, 0.06) !important;
    --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 1px var(--tw-shadow-color) !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
  }
}
@media (min-width: 1536px) {

  .\32xl\:h-\[286px\] {
    height: 286px;
  }

  .\32xl\:h-\[334px\] {
    height: 334px;
  }

  .\32xl\:min-h-\[167px\] {
    min-height: 167px;
  }

  .\32xl\:w-\[502px\] {
    width: 502px;
  }

  .\32xl\:w-\[510px\] {
    width: 510px;
  }

  .\32xl\:w-\[calc\(25\%_-_18px\)\] {
    width: calc(25% - 18px);
  }

  .\32xl\:scale-\[0\.2613583333\] {
    --tw-scale-x: 0.2613583333;
    --tw-scale-y: 0.2613583333;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .\32xl\:scale-\[0\.386\] {
    --tw-scale-x: 0.386;
    --tw-scale-y: 0.386;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  .\32xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .\32xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .\32xl\:gap-x-8 {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }

  .\32xl\:px-\[72px\] {
    padding-left: 72px;
    padding-right: 72px;
  }

  .\32xl\:pb-\[72px\] {
    padding-bottom: 72px;
  }

  .\32xl\:pt-\[72px\] {
    padding-top: 72px;
  }
}
@media (prefers-color-scheme: dark) {

  .dark\:bg-gray-700 {
    --tw-bg-opacity: 1;
    background-color: rgb(57 57 57 / var(--tw-bg-opacity, 1));
  }

  .dark\:text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  }
}
.\[\&\:hover\:not\(\:focus\)\]\:shadow-elevation-input-hover:hover:not(:focus) {
  --tw-shadow: 0 0 0 1px #a3a3a3, 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.\[\&\:hover\:not\(\:focus-within\)\]\:\!shadow-elevation-input-hover:hover:not(:focus-within) {
  --tw-shadow: 0 0 0 1px #a3a3a3, 0 1px 2px 0 rgba(16, 24, 40, 0.05) !important;
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\[\&\:hover\:not\(\:focus-within\)\]\:shadow-elevation-input-hover:hover:not(:focus-within) {
  --tw-shadow: 0 0 0 1px #a3a3a3, 0 1px 2px 0 rgba(16, 24, 40, 0.05);
  --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.\[\&\>\*\+\*\]\:mt-4>*+* {
  margin-top: 1rem;
}
.\[\&\>\*\:first-child\]\:-ml-\[6px\]>*:first-child {
  margin-left: -6px;
}
.\[\&\>\*\:first-child\]\:ml-\[1px\]>*:first-child {
  margin-left: 1px;
}
.\[\&\>\*\:nth-child\(-n\+3\)\]\:border-t-0>*:nth-child(-n+3) {
  border-top-width: 0px;
}
.\[\&\>\*\:nth-child\(-n\+4\)\]\:border-t-0>*:nth-child(-n+4) {
  border-top-width: 0px;
}
.\[\&\>\*\:nth-child\(-n\+N\)\]\:border-t-0>*:nth-child(-n+N) {
  border-top-width: 0px;
}
.\[\&\>\*\:nth-child\(1n\+26\)\]\:text-red-500>*:nth-child(1n+26) {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}
.\[\&\>\*\]\:mb-3>* {
  margin-bottom: 0.75rem;
}
.\[\&\>button\]\:shrink-0>button {
  flex-shrink: 0;
}
.\[\&\>div\>\.sticky\]\:hidden>div>.sticky {
  display: none;
}
.\[\&\>div\>div\:focus-within\]\:\!shadow-elevation-input-focused>div>div:focus-within {
  --tw-shadow: 0 0 0 1.5px #0A1925, 0 1px 2px 0 rgba(16, 24, 40, 0.05) !important;
  --tw-shadow-colored: 0 0 0 1.5px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\[\&\>div\>div\]\:\!shadow-none>div>div {
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.\[\&\>ol\]\:mb-0>ol {
  margin-bottom: 0px;
}
.\[\&\>ol\]\:mt-1>ol {
  margin-top: 0.25rem;
}
.\[\&\>ol\]\:list-decimal>ol {
  list-style-type: decimal;
}
.\[\&\>ol\]\:pl-4>ol {
  padding-left: 1rem;
}
.\[\&\>p\]\:m-0>p {
  margin: 0px;
}
.\[\&\>svg\]\:\!h-6>svg {
  height: 1.5rem !important;
}
.\[\&\>svg\]\:\!w-6>svg {
  width: 1.5rem !important;
}
.\[\&\>ul\]\:mb-0>ul {
  margin-bottom: 0px;
}
.\[\&\>ul\]\:mt-1>ul {
  margin-top: 0.25rem;
}
.\[\&\>ul\]\:list-disc>ul {
  list-style-type: disc;
}
.\[\&\>ul\]\:pl-4>ul {
  padding-left: 1rem;
}
.\[\&_\*\]\:pointer-events-none * {
  pointer-events: none;
}
.\[\&_\.button-label\]\:\!text-text-brand .button-label {
  --tw-text-opacity: 1 !important;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1)) !important;
}
.\[\&_\.dropdown-item-header\]\:\!mt-0 .dropdown-item-header {
  margin-top: 0px !important;
}
.\[\&_\.group-buttongroup\]\:inline-flex .group-buttongroup {
  display: inline-flex;
}
.\[\&_\.tab-item\]\:text-\[14px\] .tab-item {
  font-size: 14px;
}
.\[\&_a\]\:text-text-brand a {
  --tw-text-opacity: 1;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.\[\&_a\]\:underline a {
  text-decoration-line: underline;
}
.\[\&_button\]\:\!outline-none button {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
.\[\&_button\]\:outline-none button {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.\[\&_button\]\:focus-visible\:\!outline-none:focus-visible button {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
.\[\&_input\]\:\!border-transparent input {
  border-color: transparent !important;
}
.\[\&_input\]\:\!outline-none input {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
.\[\&_input\]\:\!ring-0 input {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}
.\[\&_input\]\:focus\:\!ring-0:focus input {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}
.\[\&_li\]\:my-0\.5 li {
  margin-top: 0.125rem;
  margin-bottom: 0.125rem;
}
.\[\&_li\]\:marker\:text-text-tertiary * li::marker {
  color: rgb(163 163 163 );
}
.\[\&_li\]\:marker\:text-text-tertiary li::marker {
  color: rgb(163 163 163 );
}
.\[\&_strong\]\:font-normal strong {
  font-weight: 400;
}
.\[\&_strong\]\:text-text-secondary strong {
  --tw-text-opacity: 1;
  color: rgb(82 82 82 / var(--tw-text-opacity, 1));
}
.\[\&_svg\]\:-rotate-180 svg {
  --tw-rotate: -180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.\[\&_svg\]\:fill-text-brand svg {
  fill: #0055ED;
}
.\[\&_svg\]\:\!text-text-brand svg {
  --tw-text-opacity: 1 !important;
  color: rgb(0 85 237 / var(--tw-text-opacity, 1)) !important;
}
.\[\&_svg\]\:transition-transform svg {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.\[\&_svg\]\:duration-\[220ms\] svg {
  transition-duration: 220ms;
}
.\[\&_svg\]\:ease-\[cubic-bezier\(0\.34\2c 1\.45\2c 0\.64\2c 1\)\] svg {
  transition-timing-function: cubic-bezier(0.34,1.45,0.64,1);
}
.\[\&_textarea\]\:\!outline-none textarea {
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}
.\[\&_textarea\]\:outline-none textarea {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.\[\&_textarea\]\:\!ring-0 textarea {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}

#sliderInput::-webkit-outer-spin-button,#sliderInput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}#sliderInput[type="number"]{-moz-appearance:textfield;}.textFieldOnFocus,.pdcTextInput:focus,.pdcTextArea:focus{outline:2px solid var(--pd-focus-ring,#ffe0d0) !important;outline-offset:0 !important;}.pdcTextInput.hideOutlineOnFocus,.pdcTextInput.hideOutlineOnFocus:focus{outline:none !important;box-shadow:none !important;outline-offset:0px !important;}.pdoTemplateContainerHolder .quill .ql-floater-btn{width:32px;display:flex;margin:0 2px;height:32px;transition:all 0.3s;}.pdoTemplateContainerHolder .quill .ql-floater-btn i{font-size:18px;}.pdoTemplateContainerHolder .quill .ql-floater-btn i.ic_outdent{font-size:22px;}.pdoTemplateContainerHolder .quill .ql-floater-btn i.ic_outdent,.pdoTemplateContainerHolder .quill .ql-floater-btn i.ic_outdent{font-size:17px;}.pdoTemplateContainerHolder .quill .ql-floater-btn:hover{background-color:rgb(38,38,38);}.pdoTemplateContainerHolder .quill .ql-floater-btn:hover i{color:white;}.loading-card.is-loading .image{background:#eee;background:linear-gradient(110deg,#ececec 8%,#f5f5f5 18%,#ececec 33%);background-size:200% 100%;animation:1.5s shine linear infinite;border-radius:0;}@keyframes shine{to{background-position-x:-200%;}}.buttonLoader{width:32px;height:32px;border-radius:50%;position:relative;animation:rotate 1s linear infinite;}.buttonLoader::before,.buttonLoader::after{content:"";box-sizing:border-box;position:absolute;inset:0px;border-radius:50%;border:3px solid #fff;animation:prixClipFix 2s linear infinite;}.buttonLoader::after{transform:rotate3d(90,90,0,180deg);border-color:#ffffff;}@keyframes rotate{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}@keyframes prixClipFix{0%{clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0);}50%{clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0);}75%,100%{clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%);}}@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}@keyframes slideUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}.animate-fadeIn{animation:fadeIn 0.3s ease-out forwards;}.animate-slideUp{animation:slideUp 0.3s ease-out forwards;}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}@keyframes shimmer{0%{background-position:100% 0;}100%{background-position:-100% 0;}}.typing-cursor{animation:blink 1s step-end infinite;margin-left:2px;}@keyframes blink{0%,50%{opacity:1;}51%,100%{opacity:0;}}.animate-fadeInUp{opacity:0;transform:translateY(30px);animation:fadeInUp 0.6s ease-out forwards;}.animation-delay-300{animation-delay:0.3s;}.animation-delay-600{animation-delay:0.6s;}.animation-delay-900{animation-delay:0.9s;}
@keyframes progressLoaderShimmer{0%{background-position:100% 0;}100%{background-position:-100% 0;}}.progress-loader-title{background:linear-gradient(90deg,#525252 0%,#525252 40%,#9ca3af 50%,#525252 60%,#525252 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:progressLoaderShimmer 2s ease-in-out infinite;}.animated-dots span{-webkit-text-fill-color:initial;background:none;-webkit-background-clip:initial;background-clip:initial;color:inherit;opacity:0;}.animated-dots span:nth-child(1){animation:dot1Show 1.5s infinite;}.animated-dots span:nth-child(2){animation:dot2Show 1.5s infinite;}.animated-dots span:nth-child(3){animation:dot3Show 1.5s infinite;}@keyframes dot1Show{0%,20%{opacity:0;}25%,100%{opacity:1;}}@keyframes dot2Show{0%,40%{opacity:0;}45%,100%{opacity:1;}}@keyframes dot3Show{0%,60%{opacity:0;}65%,100%{opacity:1;}}

.ProseMirror{
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
@media (min-width: 640px){
  .ProseMirror{
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
  }
}
/* .ProseMirror {
  @apply p-12 px-8 sm:px-12;
} */
.prose-lg :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)){
  margin-bottom: 0.55em;
}
.ProseMirror .is-editor-empty:first-child::before {
  content: attr(data-placeholder);
  float: left;
  /*  @apply text-gray-400; */
  --tw-text-opacity: 1;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1));
  pointer-events: none;
  height: 0;
}
.ProseMirror .is-empty::before {
  content: attr(data-placeholder);
  float: left;
  --tw-text-opacity: 1;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1));
  pointer-events: none;
  height: 0;
}

/* Custom image styles */

.ProseMirror img {
  transition: filter 0.1s ease-in-out;
}

.ProseMirror img:hover {
    cursor: pointer;
    filter: brightness(90%);
  }

.ProseMirror img.ProseMirror-selectednode {
    outline: 3px solid #5abbf7;
    filter: brightness(90%);
  }

.img-placeholder {
  position: relative;
}

.img-placeholder:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 3px solid #999999;
    animation: spinning 0.6s linear infinite;
  }

@keyframes spinning {
  to {
    transform: rotate(360deg);
  }
}

/* Custom TODO list checkboxes – shoutout to this awesome tutorial: https://moderncss.dev/pure-css-custom-checkbox-style/ */

ul[data-type="taskList"] li > label {
  margin-right: 0.2rem;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

@media screen and (max-width: 768px) {
  ul[data-type="taskList"] li > label {
    margin-right: 0.5rem;
  }
}

ul[data-type="taskList"] li > label input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  background-color: white;
  margin: 0;
  cursor: pointer;
  width: 1.2em;
  height: 1.2em;
  position: relative;
  top: 5px;
  border: 2px solid black;
  margin-right: 0.3rem;
  display: grid;
  place-content: center;
}

ul[data-type="taskList"] li > label input[type="checkbox"]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
}

ul[data-type="taskList"] li > label input[type="checkbox"]:active{
  --tw-bg-opacity: 1;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1));
}

ul[data-type="taskList"] li > label input[type="checkbox"]::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em;
    transform-origin: center;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  }

ul[data-type="taskList"] li > label input[type="checkbox"]:checked::before {
    transform: scale(1);
  }

ul[data-type="taskList"] li[data-checked="true"] > div > p{
  --tw-text-opacity: 1;
  color: rgb(141 141 141 / var(--tw-text-opacity, 1));
  text-decoration: line-through;
  text-decoration-thickness: 2px;
}

/* Overwrite tippy-box original max-width */

.tippy-box {
  max-width: 400px !important;
}

.ProseMirror:not(.dragging) .ProseMirror-selectednode {
  outline: none !important;
  border-radius: 0.2rem;
  background-color: var(--p-border-highlight);
  transition: background-color 0.2s;
  box-shadow: none;
}

.drag-handle {
  position: fixed;
  opacity: 1;
  transition: opacity ease-in 0.2s;
  border-radius: 0.25rem;

  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 10 10%27 style=%27fill: rgba%280, 0, 0, 0.5%29%27%3E%3Cpath d=%27M3,2 C2.44771525,2 2,1.55228475 2,1 C2,0.44771525 2.44771525,0 3,0 C3.55228475,0 4,0.44771525 4,1 C4,1.55228475 3.55228475,2 3,2 Z M3,6 C2.44771525,6 2,5.55228475 2,5 C2,4.44771525 2.44771525,4 3,4 C3.55228475,4 4,4.44771525 4,5 C4,5.55228475 3.55228475,6 3,6 Z M3,10 C2.44771525,10 2,9.55228475 2,9 C2,8.44771525 2.44771525,8 3,8 C3.55228475,8 4,8.44771525 4,9 C4,9.55228475 3.55228475,10 3,10 Z M7,2 C6.44771525,2 6,1.55228475 6,1 C6,0.44771525 6.44771525,0 7,0 C7.55228475,0 8,0.44771525 8,1 C8,1.55228475 7.55228475,2 7,2 Z M7,6 C6.44771525,6 6,5.55228475 6,5 C6,4.44771525 6.44771525,4 7,4 C7.55228475,4 8,4.44771525 8,5 C8,5.55228475 7.55228475,6 7,6 Z M7,10 C6.44771525,10 6,9.55228475 6,9 C6,8.44771525 6.44771525,8 7,8 C7.55228475,8 8,8.44771525 8,9 C8,9.55228475 7.55228475,10 7,10 Z%27%3E%3C/path%3E%3C/svg%3E");
  background-size: calc(0.5em + 0.375rem) calc(0.5em + 0.375rem);
  background-repeat: no-repeat;
  background-position: center;
  width: 1.2rem;
  height: 1.5rem;
  z-index: 50;
  cursor: grab;
}

.drag-handle:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(224 224 224 / var(--tw-bg-opacity, 1));
}

.drag-handle:hover {
    transition: background-color 0.2s;
  }

.drag-handle:active{
  --tw-bg-opacity: 1;
  background-color: rgb(198 198 198 / var(--tw-bg-opacity, 1));
}

.drag-handle:active {
    transition: background-color 0.2s;
  }

.drag-handle.hide {
    opacity: 0;
    pointer-events: none;
  }

@media screen and (max-width: 600px) {

.drag-handle {
    display: none;
    pointer-events: none
}
  }

.dark-theme .drag-handle {
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 10 10%27 style=%27fill: rgba%28255, 255, 255, 0.5%29%27%3E%3Cpath d=%27M3,2 C2.44771525,2 2,1.55228475 2,1 C2,0.44771525 2.44771525,0 3,0 C3.55228475,0 4,0.44771525 4,1 C4,1.55228475 3.55228475,2 3,2 Z M3,6 C2.44771525,6 2,5.55228475 2,5 C2,4.44771525 2.44771525,4 3,4 C3.55228475,4 4,4.44771525 4,5 C4,5.55228475 3.55228475,6 3,6 Z M3,10 C2.44771525,10 2,9.55228475 2,9 C2,8.44771525 2.44771525,8 3,8 C3.55228475,8 4,8.44771525 4,9 C4,9.55228475 3.55228475,10 3,10 Z M7,2 C6.44771525,2 6,1.55228475 6,1 C6,0.44771525 6.44771525,0 7,0 C7.55228475,0 8,0.44771525 8,1 C8,1.55228475 7.55228475,2 7,2 Z M7,6 C6.44771525,6 6,5.55228475 6,5 C6,4.44771525 6.44771525,4 7,4 C7.55228475,4 8,4.44771525 8,5 C8,5.55228475 7.55228475,6 7,6 Z M7,10 C6.44771525,10 6,9.55228475 6,9 C6,8.44771525 6.44771525,8 7,8 C7.55228475,8 8,8.44771525 8,9 C8,9.55228475 7.55228475,10 7,10 Z%27%3E%3C/path%3E%3C/svg%3E");
}

/* button start*/
/* //default button styles */
.button-style.absolute {
        position: absolute;
    }
.button-style {
        position: relative;
        display: flex;
        cursor: pointer;
        align-items: center;
        justify-content: center;
        transition-property: all;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
    /* @apply relative flex items-center justify-center cursor-pointer focus:outline-[3px] focus:[outline-style:solid] focus:outline-offset-[1px] focus:outline-[#56A0FF] focus:!shadow-none transition-all duration-300; */
}

/* //button sizes */
.button-large {
        height: 2.75rem;
        border-radius: 0.25rem;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        font-size: 0.875rem;
        font-weight: 500;
        line-height: 1.25rem;
}
.button-medium {
        height: 2.25rem;
        border-radius: 0.25rem;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        font-size: 0.875rem;
        font-weight: 500;
        line-height: 1.25rem;
}
.button-small {
        height: 1.75rem;
        border-radius: 0.25rem;
        padding-left: 10px;
        padding-right: 10px;
        font-size: 0.75rem;
        font-weight: 500;
        line-height: 1rem;
}

/* //button colors */
.button-primary {
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.button-primary:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(35 48 59 / var(--tw-bg-opacity, 1));
}
.button-primary:focus {
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
.button-primary:active {
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
.button-primary-brand {
        --tw-bg-opacity: 1;
        background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.button-primary-brand:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(0 67 184 / var(--tw-bg-opacity, 1));
}
.button-primary-brand:focus {
        --tw-bg-opacity: 1;
        background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.button-primary-brand:active {
        --tw-bg-opacity: 1;
        background-color: rgb(0 85 237 / var(--tw-bg-opacity, 1));
}
.button-primary-dark {
        border-width: 1px;
        border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
        --tw-border-opacity: 0.2;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.button-primary-danger {
        background-image: linear-gradient(180deg, #DC2626 0%, #B91C1C 100%);
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    background-size: 100% 200%;
    background-position: 0% 0%;
    transition: background-position 300ms ease;
}
.button-primary-danger:hover {
    background-position: 0% 100%;
}
.button-primary-danger:focus,
.button-primary-danger:active {
    background-position: 0% 0%;
}
.button-secondary {
        border-width: 1px;
        --tw-border-opacity: 1;
        border-color: rgb(10 10 10 / var(--tw-border-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(10 10 10 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 0 0 1px rgba(9, 15, 21, 0.06), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
        --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.button-secondary:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-secondary:active {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-secondary-brand {
        border-width: 1px;
        --tw-border-opacity: 1;
        border-color: rgb(0 85 237 / var(--tw-border-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}
.button-secondary-brand:hover {
        background-color: rgba(0, 85, 237, 0.12);
}
.button-secondary-brand:active {
        background-color: rgba(0, 85, 237, 0.12);
}
.button-secondary-danger {
        border-width: 1px;
        --tw-border-opacity: 1;
        border-color: rgb(254 202 202 / var(--tw-border-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 0 0 1px rgba(9, 15, 21, 0.06), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
        --tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.button-secondary-danger:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-secondary-danger:active {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-tertiary {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 1px rgba(9, 15, 21, 0.06);
        --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 1px var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.button-tertiary:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-tertiary:active {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-tertiary-danger {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 1px rgba(9, 15, 21, 0.06);
        --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 1px var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.button-tertiary-danger:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-tertiary-danger:active {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-ghost {
        background-color: transparent;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.button-ghost:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-ghost:active {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-ghost-danger {
        background-color: transparent;
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.button-ghost-danger:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-ghost-danger:active {
        background-color: rgba(11, 15, 20, 0.08);
}
.button-dark {
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.button-dark:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(35 48 59 / var(--tw-bg-opacity, 1));
}
.button-dark:focus {
        --tw-bg-opacity: 1;
        background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
}
.button-dark:active {
        --tw-bg-opacity: 1;
        background-color: rgb(40 75 113 / var(--tw-bg-opacity, 1));
}
.button-gradient-primary.absolute {
        position: absolute;
    }
.button-gradient-primary {
        position: relative;
        overflow: hidden;
        background-image: radial-gradient(145.58% 149.6% at 29.59% -25%, var(--brand-100, #C2D8FF) 0%, var(--brand-300, #5291FF) 31.73%, var(--brand-600, #0055ED) 76.78%, var(--brand-900, #00225C) 100%);
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.30) inset, 0 0 10px 4px rgba(255, 255, 255, 0.40) inset;
        --tw-shadow-colored: inset 0 0 0 0.5px var(--tw-shadow-color), inset 0 0 10px 4px var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.button-gradient-02 {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
.button-gradient-02:hover {
        opacity: 0.9;
}
.button-gradient-02 {
    background: linear-gradient(180deg, #ff732d 0%, #f50 100%);
}
.button-gradient-primary-border,
.gradient-primary-border {
    box-shadow: 0 1px 2px 0 rgba(255, 85, 0, 0.15);
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(255 229 205 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.button-gradient-primary-border span,
.gradient-primary-border span {
        background-image: radial-gradient(145.58% 149.6% at 29.59% -25%, var(--brand-100, #C2D8FF) 0%, var(--brand-300, #5291FF) 31.73%, var(--brand-600, #0055ED) 76.78%, var(--brand-900, #00225C) 100%);
        -webkit-background-clip: text;
                background-clip: text;
        color: transparent;
}

.button-gradient-primary::before {
    content: "";
}

.relative.button-gradient-primary::before {
        position: absolute;
    }

.button-gradient-primary::before {
        position: absolute;
        inset: 0px;
        opacity: 0;
        transition-property: opacity;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    background-size: 200% 100%;
}

.button-gradient-primary:hover::before {
        opacity: 1;
    animation: shimmer 3s ease-in-out infinite;
}

@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

/* Gold shimmer — filled gold gradient with a gloss + repeating shimmer sweep
   (ref: v6.2.html .gold-btn). Brand gradient, no semantic token available. */
.button-gold-shimmer.absolute {
        position: absolute;
    }
.button-gold-shimmer {
        position: relative;
        overflow: hidden;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    background: linear-gradient(90deg, #dcb05e 0%, #ca9e4c 30%, #c39643 65%, #b8893a 100%);
    box-shadow: 0 1px 2px 0 rgba(11, 15, 20, 0.09), 0 3px 12px rgba(202, 158, 76, 0.45);
    transition: filter 0.16s ease, box-shadow 0.16s ease;
}
.button-gold-shimmer:hover:not(:disabled) {
    filter: brightness(1.08);
    box-shadow: 0 1px 2px 0 rgba(11, 15, 20, 0.09), 0 4px 18px rgba(202, 158, 76, 0.65);
}
/* Keep the label/icon above the gloss + shimmer layers. */
.button-gold-shimmer > *.absolute {
        position: absolute;
    }
.button-gold-shimmer > * {
        position: relative;
        z-index: 1;
}
.button-gold-shimmer::before {
    content: "";
}
.relative.button-gold-shimmer::before {
        position: absolute;
    }
.button-gold-shimmer::before {
        pointer-events: none;
        position: absolute;
        inset: 0px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.06) 45%, transparent 55%);
}
.button-gold-shimmer::after {
    content: "";
}
.relative.button-gold-shimmer::after {
        position: absolute;
    }
.button-gold-shimmer::after {
        pointer-events: none;
        position: absolute;
        top: 0px;
        bottom: 0px;
    left: -75%;
    width: 50%;
    background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.65) 50%, transparent 100%);
    transform: skewX(-20deg);
    animation: gold-shimmer-sweep 2.8s ease-in-out infinite;
}
@keyframes gold-shimmer-sweep {
    0% {
        left: -75%;
    }
    60% {
        left: 125%;
    }
    100% {
        left: 125%;
    }
}

/* Pro — dark navy gradient (matches v6.2 .pro-btn / the upgrade popup's Buy Pro). */
.button-pro-dark {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    background: linear-gradient(180deg, #1c3550 0%, #0a1925 100%);
    box-shadow: 0 1px 2px 0 rgba(11, 15, 20, 0.09);
}
.button-pro-dark:hover:not(:disabled) {
    background: linear-gradient(180deg, #24425f 0%, #12202e 100%);
}

/* Brand gradient — blue linear gradient CTA (ref: offer-gradient-v3).
   Brand offer gradient, no semantic token available. */
.button-gradient-brand {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    background: linear-gradient(96deg, #00225c 0%, #003c9e 24%, #0055ed 50%, #0f60ef 66%, #1c6bf3 78%, #2a75f6 86%, #3f82fa 92%, #5990fc 96%, #74a6ff 100%);
    box-shadow: 0 2px 8px -2px rgba(0, 85, 237, 0.55);
    transition: background 200ms ease, box-shadow 160ms ease;
}
.button-gradient-brand:hover:not(:disabled) {
    background: linear-gradient(96deg, #063070 0%, #0a48b4 24%, #1667f5 50%, #2170f7 66%, #2e7af9 78%, #3c84fc 86%, #5292fe 92%, #6fa2ff 96%, #8cb6ff 100%);
    box-shadow: 0 6px 16px -4px rgba(0, 85, 237, 0.6);
}

/* Label + smaller inline sub-label, side by side (e.g. "Buy Pro  Save 20%"). */
.button-label-stack.absolute {
        position: absolute;
    }
.button-label-stack {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: baseline;
        justify-content: center;
        gap: 0.375rem;
}
.button-sublabel {
        font-weight: 500;
        line-height: 1.2;
        opacity: 0.8;
}

/* //button disabled */
.button-disabled {
        pointer-events: none;
        cursor: not-allowed;
}
.button-disabled-40 {
        opacity: 0.4;
}
.button-disabled-60 {
        opacity: 0.6;
}

/* button with icon only */
.button-large.icon-only {
        height: 2.75rem;
        width: 2.75rem;
        min-width: 44px;
        padding-left: 0px;
        padding-right: 0px;
}
.button-medium.icon-only {
        height: 2.25rem;
        width: 2.25rem;
        min-width: 36px;
        padding-left: 0px;
        padding-right: 0px;
}
.button-small.icon-only {
        height: 1.75rem;
        width: 1.75rem;
        min-width: 28px;
        padding-left: 0px;
        padding-right: 0px;
}

/* Tooltip styles */
.relative.button-tooltip {
        position: absolute;
    }
.button-tooltip {
        pointer-events: none;
        visibility: hidden;
        position: absolute;
        z-index: 50;
        width: -moz-max-content !important;
        width: max-content !important;
        max-width: 192px !important;
        white-space: normal;
        overflow-wrap: break-word;
        border-radius: 0.375rem;
        --tw-bg-opacity: 1;
        background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        text-align: left !important;
        text-align: center;
        font-size: 0.75rem;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
        opacity: 0;
        transition-property: all;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
/* Single-line variant: lets the dark box grow to fit one line of text and
   centers it (higher specificity so it wins over the base !important rules). */
.button-tooltip.button-tooltip-single-line {
        max-width: none !important;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        --tw-bg-opacity: 1 !important;
        background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1)) !important;
        text-align: center !important;
}
.button-tooltip-header {
        margin-bottom: 0.25rem;
        display: block;
        font-size: 13px;
        font-weight: 600;
        line-height: 1rem;
}
.button-tooltip-body {
        display: block;
}
.button-style:hover .button-tooltip {
        visibility: visible;
        opacity: 1;
}
.tooltip-top {
        bottom: 100%;
        left: 50%;
        margin-bottom: 0.5rem;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-top::after {
    content: "";
}
.relative.tooltip-top::after {
        position: absolute;
    }
.tooltip-top::after {
        position: absolute;
        top: 100%;
        left: 50%;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-topleft {
        bottom: 100%;
        left: 0px;
        margin-bottom: 0.5rem;
}
.tooltip-topleft::after {
    content: "";
}
.relative.tooltip-topleft::after {
        position: absolute;
    }
.tooltip-topleft::after {
        position: absolute;
        top: 100%;
        left: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-topright {
        bottom: 100%;
        right: 0px;
        margin-bottom: 0.5rem;
}
.tooltip-topright::after {
    content: "";
}
.relative.tooltip-topright::after {
        position: absolute;
    }
.tooltip-topright::after {
        position: absolute;
        top: 100%;
        right: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-bottom {
        top: 100%;
        left: 50%;
        margin-top: 0.5rem;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-bottom::after {
    content: "";
}
.relative.tooltip-bottom::after {
        position: absolute;
    }
.tooltip-bottom::after {
        position: absolute;
        bottom: 100%;
        left: 50%;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-left {
        right: 100%;
        top: 50%;
        margin-right: 0.5rem;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-left::after {
    content: "";
}
.relative.tooltip-left::after {
        position: absolute;
    }
.tooltip-left::after {
        position: absolute;
        left: 100%;
        top: 50%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-left-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-right {
        left: 100%;
        top: 50%;
        margin-left: 0.5rem;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-right::after {
    content: "";
}
.relative.tooltip-right::after {
        position: absolute;
    }
.tooltip-right::after {
        position: absolute;
        right: 100%;
        top: 50%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-right-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-bottomleft {
        top: 100%;
        left: 0px;
        margin-top: 0.5rem;
}
.tooltip-bottomleft::after {
    content: "";
}
.relative.tooltip-bottomleft::after {
        position: absolute;
    }
.tooltip-bottomleft::after {
        position: absolute;
        bottom: 100%;
        left: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-bottomright {
        top: 100%;
        right: 0px;
        margin-top: 0.5rem;
}
.tooltip-bottomright::after {
    content: "";
}
.relative.tooltip-bottomright::after {
        position: absolute;
    }
.tooltip-bottomright::after {
        position: absolute;
        bottom: 100%;
        right: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

/* Netflix-style progress loader */
.relative.button-progress-wrapper {
        position: absolute;
    }
.button-progress-wrapper {
        position: absolute;
        inset: 0px;
        overflow: hidden;
        border-radius: inherit;
}
.relative.button-progress-fill {
        position: absolute;
    }
.button-progress-fill {
        position: absolute;
        inset: 0px;
        transform-origin: left;
        will-change: transform;
    transform: scaleX(0);
}
.button-progress-fill.progress-complete {
    transform: scaleX(1) !important;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.relative.button-shimmer-wrapper {
        position: absolute;
    }
.button-shimmer-wrapper {
        pointer-events: none;
        position: absolute;
        top: 0px;
        left: 0px;
        height: 100%;
        overflow: hidden;
        border-radius: inherit;
}
.relative.button-shimmer-effect {
        position: absolute;
    }
.button-shimmer-effect {
        position: absolute;
        top: 0px;
        left: 0px;
        height: 100%;
        width: 40%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0) 100%);
    animation: progress-shimmer 2s linear infinite;
    will-change: transform;
}
@keyframes progress-shimmer {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(350%);
    }
}

/* button loader */
.relative.button-loader {
        position: absolute;
    }
.button-loader {
        position: absolute;
}
.button-loader-white .spinner-path {
        fill: #ffffff;
}
.button-loader-dark .spinner-path {
        fill: #171717;
}
.button-loader-brand .spinner-path {
        fill: #0055ED;
}
.button-loader-danger .spinner-path {
        fill: #b91c1c;
}
.button-disabled-tooltip {
    background-color: rgba(245, 245, 245, 0.2) !important;
}
.button-disabled-tooltip *:not(.button-tooltip) {
        opacity: 0.6;
}
.button-disabled-tooltip .button-tooltip,
.button-disabled-tooltip .button-tooltip * {
        opacity: 1 !important;
}
.button-disabled-tooltip.button-style:hover .button-tooltip {
        pointer-events: auto !important;
        visibility: visible;
        opacity: 1;
}
/* LinkedIn share dropdown – divider before caret */
.linkedin-share-btn .button-label + div {
    margin-left: 8px;
    padding-left: 8px;
    position: relative;
}

.linkedin-share-btn .button-label + div::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 16px;
    background-color: var(--border-primary, rgba(26, 26, 26, 0.2));
}

/* button end*/

/* chip start*/
/* //default chip styles */
.chip-style.absolute {
        position: absolute;
    }
.chip-style {
        position: relative;
        display: inline-flex;
        cursor: pointer;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
        align-items: center;
        justify-content: center;
        border-radius: 9999px;
        border-width: 1px;
        transition-property: all;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}

/* //chip sizes */
.chip-medium {
        height: 2.25rem;
        gap: 6px;
        padding-left: 1rem;
        padding-right: 1rem;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 1.25rem;
}
.chip-small {
        height: 1.75rem;
        gap: 0.25rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        font-size: 0.75rem;
        font-weight: 400;
        line-height: 1rem;
}

/* //base face: white + soft ring. Tone modifiers recolor the label and ring only. */
.chip-default {
        border-color: rgba(11, 15, 20, 0.09);
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
        --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.chip-default:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.chip-tone-success {
        --tw-border-opacity: 1;
        border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(21 128 61 / var(--tw-text-opacity, 1));
}
.chip-tone-success:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));
}
.chip-tone-danger {
        --tw-border-opacity: 1;
        border-color: rgb(254 202 202 / var(--tw-border-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.chip-tone-danger:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}

/* //selected: the stroke takes the label color; neutral adds a whisper of tint for legibility */
.chip-selected {
        border-color: currentColor;
        background-color: rgba(26, 26, 26, 0.06);
}
/* toned selected keeps a white face — the hue in label + stroke is already the signal */
.chip-tone-success.chip-selected,
.chip-tone-danger.chip-selected {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

/* //trailing remove affordance: inherits the label color, dimmed until hover */
.chip-remove {
        display: flex;
        cursor: pointer;
        align-items: center;
        justify-content: center;
        opacity: 0.6;
}
.chip-remove:hover {
        opacity: 1;
}

/* chip input (create-new) */
.chip-input {
    /* container color = placeholder color so the plus icon matches the text; typed text overrides to primary below */
    cursor: text;
    border-width: 1px;
    border-style: dashed;
    --tw-border-opacity: 1;
    border-color: rgb(163 163 163 / var(--tw-border-opacity, 1));
    background-color: transparent;
    --tw-text-opacity: 1;
    color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.chip-input:focus-within {
        border-style: solid;
        --tw-border-opacity: 1;
        border-color: rgb(10 25 37 / var(--tw-border-opacity, 1));
}
.chip-input:hover {
        border-color: rgba(10, 25, 37, 0.48);
}
.chip-input-field {
        border-style: none;
        background-color: transparent;
        padding: 0px;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
        outline: 2px solid transparent;
        outline-offset: 2px;
}
.chip-input-field::-moz-placeholder {
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.chip-input-field::placeholder {
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.chip-input-field:focus {
        --tw-shadow: 0 0 #0000 !important;
        --tw-shadow-colored: 0 0 #0000 !important;
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
        --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
        --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
        box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
}
.chip-input-field {
    /* inputs don't inherit typography from their parent by default — take the chip's size styles */
    font: inherit;
}
/* chip end*/

/* dropdown start */
/* dropdown container */
.dropdown-container.absolute {
        position: absolute;
    }
.dropdown-container {
        position: relative;
        display: inline-block;
}

/* dropdown menu styles */
.relative.dropdown-menu-style {
        position: absolute;
    }
.dropdown-menu-style {
        position: absolute;
        z-index: 50;
        width: 248px;
        transform-origin: top right;
        overflow-x: hidden;
        border-radius: 0.25rem;
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        padding: 0.25rem;
        padding-right: 0.5rem;
        --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
        --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
}
.dropdown-menu-style:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
}
.dropdown-menu-style[data-closed] {
    transform: scale(0.95);
    opacity: 0;
}
.dropdown-menu-style[data-enter] {
    transition-duration: 100ms;
    transition-timing-function: ease-out;
}
.dropdown-menu-style[data-leave] {
    transition-duration: 75ms;
    transition-timing-function: ease-in;
}

/* dropdown menu positions */
.dropdown-menu-bottom-right {
        right: 0px;
        margin-top: 0.25rem;
        transform-origin: top right;
}
.dropdown-menu-bottom-left {
        left: 0px;
        margin-top: 0.25rem;
        transform-origin: top left;
}
.dropdown-menu-top-right {
        right: 0px;
        bottom: 100%;
        margin-bottom: 0.25rem;
        transform-origin: bottom right;
}
.dropdown-menu-top-left {
        left: 0px;
        bottom: 100%;
        margin-bottom: 0.25rem;
        transform-origin: bottom left;
}

/* dropdown header styles */
.dropdown-header {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
        width: 100%;
}
.dropdown-heading {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 1.25rem;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.dropdown-subheading {
        margin-top: 0.25rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        font-size: 0.75rem;
        font-weight: 400;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(82 82 82 / var(--tw-text-opacity, 1));
}
.dropdown-header-divider {
        margin-top: 1rem;
        border-top-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
}

/* dropdown item header styles */
.dropdown-item-header {
        margin-top: 1rem;
        width: 100%;
}
.dropdown-item-heading {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: capitalize;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.dropdown-item-subheading {
        margin-top: 0.25rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        font-size: 0.75rem;
        font-weight: 400;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.dropdown-item-header-divider {
        margin-top: 1rem;
        border-top-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
}

/* dropdown item offer styles */
.dropdown-item-offer-container {
        margin-top: 0.5rem;
        display: flex;
        width: 100%;
        border-top-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
        padding-top: 0.5rem;
}
.dropdown-item-offer {
        display: flex;
        height: 1.25rem;
        align-items: center;
        justify-content: center;
        border-radius: 0.375rem;
        --tw-bg-opacity: 1;
        background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
        padding-left: 10px;
        padding-right: 10px;
        font-size: 0.75rem;
        line-height: 1rem;
        font-weight: 400;
        text-transform: capitalize;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

/* dropdown search styles */
.dropdown-search-container {
        margin-bottom: 0.5rem;
        width: 100%;
}
.dropdown-search-wrapper-input.absolute {
        position: absolute;
    }
.dropdown-search-wrapper-input {
        position: relative;
        display: flex;
        align-items: center;
        gap: 0.5rem;
}
.relative.dropdown-search-clear {
        position: absolute;
    }
.dropdown-search-clear {
        position: absolute;
        right: 0.75rem;
        top: 50%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-radius: 0.25rem;
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 200ms;
}
.dropdown-search-clear:hover {
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.dropdown-search-clear:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
        --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
        --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
        box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.dropdown-search-clear {
        z-index: 10;
}
.dropdown-no-results {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        padding-top: 2rem;
        padding-bottom: 2rem;
}

/* dropdown item styles */
.dropdown-item-style {
        display: flex;
        width: 100%;
        cursor: pointer;
        align-items: center;
        gap: 10px;
        border-radius: 0.125rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 1.25rem;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
.dropdown-item-style:first-child {
        margin-top: 0px;
}
.dropdown-item-style:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.dropdown-item-style:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
}
.dropdown-item-focus {
        background-color: rgba(11, 15, 20, 0.08);
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.dropdown-item-disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: 0.5;
}
.dropdown-item-danger {
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.dropdown-item-danger.dropdown-item-focus {
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
/* brand-accented item (e.g. "Improve Presentation"); colors label + icon via currentColor */
.dropdown-item-brand,
.dropdown-item-brand.dropdown-item-focus {
        --tw-text-opacity: 1;
        color: rgb(0 85 237 / var(--tw-text-opacity, 1));
}

/* dropdown item components */
.dropdown-item-icon {
        flex-shrink: 0;
}
.dropdown-item-label {
        flex: 1 1 0%;
        text-align: left;
}
.dropdown-item-shortcut {
        margin-left: auto;
        font-size: 0.75rem;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.dropdown-item-right-icon {
        margin-left: auto;
        flex-shrink: 0;
}

/* dropdown items list container with scroll */
.dropdown-items-list {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        overflow-y: auto;
        padding-left: 0.75rem;
        padding-right: 0.5rem;
}

/* dropdown divider */
.dropdown-divider {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
        width: 100%;
        border-top-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
}

/* dropdown item tooltip (portal-based, same visual style as button-tooltip) */
.dropdown-item-tooltip-portal {
        pointer-events: none;
        width: -moz-max-content;
        width: max-content;
        max-width: 192px;
        white-space: normal;
        overflow-wrap: break-word;
        border-radius: 0.375rem;
        --tw-bg-opacity: 1;
        background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        text-align: left;
        text-align: center;
        font-size: 0.75rem;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    animation: dropdownTooltipFadeIn 0.3s ease-out;
}
@keyframes dropdownTooltipFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.relative.dropdown-item-tooltip-arrow {
        position: absolute;
    }
.dropdown-item-tooltip-arrow {
        position: absolute;
        top: 50%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-right-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
    right: 100%;
}

/* split trigger: label and right icon are separate hover zones with a divider between.
   Hover matches the social icon buttons: a rounded bg-bg-elevated-hover fill inset with a small gap from the border. */
.dropdown-split-trigger {
        overflow: hidden;
        padding: 0.25rem !important;
}
.dropdown-split-trigger.button-tertiary:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.dropdown-split-trigger.button-tertiary:active {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.dropdown-split-trigger .dropdown-split-left {
        display: flex;
        height: 100%;
        cursor: pointer;
        align-items: center;
        border-radius: 0.375rem;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
.dropdown-split-trigger .dropdown-split-left:hover {
        background-color: rgba(11, 15, 20, 0.08);
}
.dropdown-split-trigger .dropdown-split-divider {
        height: 1rem;
        align-self: center;
        border-left-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
}
.dropdown-split-trigger .dropdown-split-right {
        display: flex;
        height: 100%;
        cursor: pointer;
        align-items: center;
        justify-content: center;
        border-radius: 0.375rem;
        padding-left: 8px;
        padding-right: 8px;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
.dropdown-split-trigger .dropdown-split-right:hover {
        background-color: rgba(11, 15, 20, 0.08);
}

/* ── opt-in: animated + expandable dropdown (doc-card hover menu) ─────────────
   All rules below are scoped to opt-in classes/flags, so existing dropdowns are
   untouched. Timing mirrors the design-protos "dashboard-hover" prototype:
   global ease cubic-bezier(0.23,1,0.32,1); spring cubic-bezier(0.34,1.45,0.64,1). */

/* Per-item cascade when the menu opens. Applied only to non-expandable (compact)
   items so it never fights the expandable collapse/reveal transition below. */
@keyframes dropdown-cascade-in {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
}
.dropdown-menu-cascade .dropdown-item-cascade {
    animation: dropdown-cascade-in 220ms cubic-bezier(0.23, 1, 0.32, 1) both;
    animation-delay: calc(28ms * var(--casc-i, 0));
}

/* Menu container spring open / quick close. The two-class selectors out-rank
   .dropdown-menu-style's @apply transition (150ms default), which otherwise
   overrides the Transition enter/leave utility classes. Values mirror the
   prototype: open = opacity 140ms ease + transform 260ms spring;
   close = opacity 130ms / transform 160ms ease. */
.dropdown-menu-style.dropdown-menu-cascade {
    transition: opacity 140ms cubic-bezier(0.23, 1, 0.32, 1),
        transform 260ms cubic-bezier(0.34, 1.45, 0.64, 1);
}
.dropdown-menu-style.dropdown-cascade-leave {
    transition: opacity 130ms cubic-bezier(0.23, 1, 0.32, 1),
        transform 160ms cubic-bezier(0.23, 1, 0.32, 1);
}

/* Expandable "More..." tier — extra items (and the More toggle once expanded)
   collapse to zero height and cascade back in with a per-item stagger. The
   max-height trick lets height animate (each row is a single ~40px line). */
.dropdown-item-expandable {
    overflow: hidden;
    max-height: 60px;
    opacity: 1;
    transform: translateY(0);
    /* Prototype timing: box (height/padding/margin) 220ms; reveal
       (opacity/translate) 200ms with a 30ms + 26ms-per-item stagger
       (menu-extra-in). Collapse is instant-delay via the rule below. */
    transition: max-height 220ms cubic-bezier(0.23, 1, 0.32, 1),
        opacity 200ms cubic-bezier(0.23, 1, 0.32, 1),
        transform 200ms cubic-bezier(0.23, 1, 0.32, 1),
        padding 220ms cubic-bezier(0.23, 1, 0.32, 1),
        margin 220ms cubic-bezier(0.23, 1, 0.32, 1),
        background-color 200ms ease;
    transition-delay: calc(30ms + 26ms * var(--extra-i, 0));
}
.dropdown-item-expandable.dropdown-item-collapsed {
    max-height: 0;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-top-width: 0;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
    transition-delay: 0ms;
}

@media (prefers-reduced-motion: reduce) {
    .dropdown-menu-cascade .dropdown-item-cascade {
        animation: none !important;
    }
    .dropdown-menu-style.dropdown-menu-cascade,
    .dropdown-menu-style.dropdown-cascade-leave {
        transition-duration: 1ms !important;
    }
    .dropdown-item-expandable {
        transition: max-height 1ms linear, opacity 1ms linear !important;
    }
}

/* dropdown end */

/* hierarchical-toggle-dropdown start */

/* Container */
.hierarchical-toggle-dropdown-container.absolute {
        position: absolute;
    }
.hierarchical-toggle-dropdown-container {
        position: relative;
        display: inline-block;
}

/* Menu styles */
.relative.hierarchical-toggle-dropdown-menu {
        position: absolute;
    }
.hierarchical-toggle-dropdown-menu {
        position: absolute;
        z-index: 50;
        width: 248px;
        transform-origin: top right;
        border-radius: 0.5rem;
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        padding: 0.5rem;
        padding-right: 0.75rem;
        --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09);
        --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 150ms;
}
.hierarchical-toggle-dropdown-menu:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
}

.hierarchical-toggle-dropdown-menu[data-closed] {
    transform: scale(0.95);
    opacity: 0;
}

.hierarchical-toggle-dropdown-menu[data-enter] {
    transition-duration: 100ms;
    transition-timing-function: ease-out;
}

.hierarchical-toggle-dropdown-menu[data-leave] {
    transition-duration: 75ms;
    transition-timing-function: ease-in;
}

/* Menu positions */
.hierarchical-toggle-dropdown-menu-bottom-right {
        right: 0px;
        margin-top: 0.25rem;
        transform-origin: top right;
}

.hierarchical-toggle-dropdown-menu-bottom-left {
        left: 0px;
        margin-top: 0.25rem;
        transform-origin: top left;
}

.hierarchical-toggle-dropdown-menu-top-right {
        right: 0px;
        bottom: 100%;
        margin-bottom: 0.25rem;
        transform-origin: bottom right;
}

.hierarchical-toggle-dropdown-menu-top-left {
        left: 0px;
        bottom: 100%;
        margin-bottom: 0.5rem;
        transform-origin: bottom left;
}

/* Parent toggle item (Title) */
.hierarchical-toggle-parent-item {
        display: flex;
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 0.25rem;
        align-self: stretch;
        border-radius: 0.375rem;
        padding-top: 0.375rem;
        padding-bottom: 0.375rem;
}

.hierarchical-toggle-parent-content {
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0.5rem;
        align-self: stretch;
        border-radius: 0.25rem;
        padding-left: 0.375rem;
        padding-right: 0.375rem;
}

.hierarchical-toggle-parent-label {
        flex: 1 1 0%;
        text-align: left;
        font-size: 0.875rem;
        font-weight: 500;
        line-height: 1.25rem;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}

.hierarchical-toggle-parent-message {
        margin-top: 0.25rem;
        padding-left: 0.375rem;
        padding-right: 0.375rem;
        font-size: 0.75rem;
        font-weight: 400;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
    word-break: break-word;
}

/* Child toggle items */
.hierarchical-toggle-child-item {
        display: inline-flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        gap: 0.25rem;
        align-self: stretch;
        border-radius: 0.375rem;
        padding: 0.375rem;
}

.hierarchical-toggle-child-content {
        display: flex;
        min-width: 0px;
        flex: 1 1 0%;
        align-items: center;
        justify-content: flex-start;
        gap: 0.375rem;
}

.hierarchical-toggle-child-indicator {
    width: 5px;
    height: 0;
    outline: 1px solid rgba(255, 255, 255, 1);
    outline-offset: -0.5px;
}

.hierarchical-toggle-child-label {
        flex: 1 1 0%;
        text-align: left;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 1.25rem;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}

.hierarchical-toggle-child-label-disabled {
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}

/* Toggle switch container */
.hierarchical-toggle-switch-container {
        display: flex;
        cursor: pointer;
        align-items: center;
        justify-content: flex-start;
        gap: 0.5rem;
}

/* Toggle switch - ON state */
.hierarchical-toggle-switch-on {
        display: flex;
        height: 1.25rem;
        width: 2rem;
        align-items: center;
        justify-content: flex-end;
        gap: 0.5rem;
        border-radius: 50px;
        padding: 3px;
    background-color: var(--bg-primary-inverted, #000000);
    outline: 1px solid rgba(255, 255, 255, 0.1);
    outline-offset: -1px;
}

/* Toggle switch - OFF state */
.hierarchical-toggle-switch-off {
        display: flex;
        height: 1.25rem;
        width: 2rem;
        align-items: center;
        justify-content: flex-start;
        gap: 0.5rem;
        border-radius: 50px;
        padding: 3px;
    background-color: rgba(245, 245, 245, 0.05);
    outline: 1px solid rgba(26, 26, 26, 0.02);
    outline-offset: -1px;
}

/* Toggle switch - Disabled state */
.hierarchical-toggle-switch-disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: 0.4;
}

/* Toggle handle */
.hierarchical-toggle-handle {
    width: 14px;
    height: 14px;
    background-color: var(--bg-elevated, #ffffff);
    border-radius: 9999px;
    box-shadow:
        0px 1px 2px 0px rgba(26, 26, 26, 0.06),
        0px 0px 0px 1px rgba(26, 26, 26, 0.03),
        inset 0px 0px 0px 1px rgba(255, 255, 255, 1);
}

/* Divider between parent groups */
.hierarchical-toggle-divider {
        margin-top: 0.25rem;
        margin-bottom: 0.25rem;
        width: 100%;
        border-top-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
}

/* Items list container */
.hierarchical-toggle-items-list {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 0.125rem;
        align-self: stretch;
}

/* hierarchical-toggle-dropdown end */

/* tooltip start */
.tooltip-wrapper.absolute {
        position: absolute;
    }
.tooltip-wrapper {
        position: relative;
        display: inline-flex;
}

.relative.tooltip-content {
        position: absolute;
    }

.tooltip-content {
        pointer-events: none;
        visibility: hidden;
        position: absolute;
        z-index: 50;
        width: -moz-max-content !important;
        width: max-content !important;
        max-width: 192px !important;
        white-space: normal;
        overflow-wrap: break-word;
        border-radius: 0.375rem;
        --tw-bg-opacity: 1;
        background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        text-align: left;
        font-size: 0.75rem;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
        opacity: 0;
        transition-property: all;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}

.tooltip-wrapper:hover .tooltip-content {
        visibility: visible;
        opacity: 1;
}
/* TEMP (review only): force a non-portal tooltip open without hover. */
.tooltip-content.tooltip-force-open {
        visibility: visible;
        opacity: 1;
}

/* Controlled mode (Tooltip `open` prop): visibility comes from the prop, and hover
   must NOT re-open it — used for programmatic coachmarks the parent dismisses.
   Placed AFTER the :hover rule on purpose: it has the same specificity (3 classes),
   so source order is what makes it win. The .tooltip-open rule adds a 4th class and
   beats both. */
.tooltip-wrapper.tooltip-controlled .tooltip-content {
        visibility: hidden;
        opacity: 0;
}
.tooltip-wrapper.tooltip-controlled .tooltip-content.tooltip-open {
        visibility: visible;
        opacity: 1;
}

.tooltip-title {
        margin-bottom: 0.25rem;
        display: block;
        font-size: 13px;
        font-weight: 600;
        line-height: 1rem;
}

.tooltip-description {
        display: block;
        font-size: 0.75rem;
        line-height: 1rem;
        opacity: 0.8;
}

/* Tooltip positions */
.tooltip-content.tooltip-top {
        bottom: 100%;
        left: 50%;
        margin-bottom: 0.5rem;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-content.tooltip-top::after {
    content: "";
}
.relative.tooltip-content.tooltip-top::after {
        position: absolute;
    }
.tooltip-content.tooltip-top::after {
        position: absolute;
        top: 100%;
        left: 50%;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-bottom {
        top: 100%;
        left: 50%;
        margin-top: 0.5rem;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-content.tooltip-bottom::after {
    content: "";
}
.relative.tooltip-content.tooltip-bottom::after {
        position: absolute;
    }
.tooltip-content.tooltip-bottom::after {
        position: absolute;
        bottom: 100%;
        left: 50%;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-left {
        right: 100%;
        top: 50%;
        margin-right: 0.5rem;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-content.tooltip-left::after {
    content: "";
}
.relative.tooltip-content.tooltip-left::after {
        position: absolute;
    }
.tooltip-content.tooltip-left::after {
        position: absolute;
        left: 100%;
        top: 50%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-left-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-right {
        left: 100%;
        top: 50%;
        margin-left: 0.5rem;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.tooltip-content.tooltip-right::after {
    content: "";
}
.relative.tooltip-content.tooltip-right::after {
        position: absolute;
    }
.tooltip-content.tooltip-right::after {
        position: absolute;
        right: 100%;
        top: 50%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-right-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-topleft {
        bottom: 100%;
        left: 0px;
        margin-bottom: 0.5rem;
}
.tooltip-content.tooltip-topleft::after {
    content: "";
}
.relative.tooltip-content.tooltip-topleft::after {
        position: absolute;
    }
.tooltip-content.tooltip-topleft::after {
        position: absolute;
        top: 100%;
        left: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-topright {
        bottom: 100%;
        right: 0px;
        margin-bottom: 0.5rem;
}
.tooltip-content.tooltip-topright::after {
    content: "";
}
.relative.tooltip-content.tooltip-topright::after {
        position: absolute;
    }
.tooltip-content.tooltip-topright::after {
        position: absolute;
        top: 100%;
        right: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-bottomleft {
        top: 100%;
        left: 0px;
        margin-top: 0.5rem;
}
.tooltip-content.tooltip-bottomleft::after {
    content: "";
}
.relative.tooltip-content.tooltip-bottomleft::after {
        position: absolute;
    }
.tooltip-content.tooltip-bottomleft::after {
        position: absolute;
        bottom: 100%;
        left: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}

.tooltip-content.tooltip-bottomright {
        top: 100%;
        right: 0px;
        margin-top: 0.5rem;
}
.tooltip-content.tooltip-bottomright::after {
    content: "";
}
.relative.tooltip-content.tooltip-bottomright::after {
        position: absolute;
    }
.tooltip-content.tooltip-bottomright::after {
        position: absolute;
        bottom: 100%;
        right: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
/* Portal tooltip - rendered via portal to escape overflow containers */
.tooltip-portal-content {
        pointer-events: none;
        visibility: hidden;
        position: fixed;
        z-index: 9999;
        width: -moz-max-content;
        width: max-content;
        max-width: 192px;
        white-space: normal;
        overflow-wrap: break-word;
        border-radius: 0.375rem;
        --tw-bg-opacity: 1;
        background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        text-align: left;
        font-size: 0.75rem;
        line-height: 1rem;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
        opacity: 0;
        transition-property: all;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
.tooltip-portal-content.tooltip-portal-visible {
        visibility: visible;
        opacity: 1;
}
.tooltip-portal-content::before {
    content: "";
}
.relative.tooltip-portal-content::before {
        position: absolute;
    }
.tooltip-portal-content::before {
        position: absolute;
        top: 100%;
        left: 1rem;
        border-width: 4px;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-top-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
/* Position-aware arrow for portal tooltips. The default above points DOWN
   (tooltip above the trigger). These overrides repoint it for side/below
   placements — e.g. position="right" puts the arrow on the LEFT edge. */
.tooltip-portal-content.tooltip-right::before {
        top: 50%;
        left: 0px;
        --tw-translate-y: -50%;
        --tw-translate-x: -100%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-color: transparent;
        --tw-border-opacity: 1;
        border-right-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-portal-content.tooltip-left::before {
        top: 50%;
        left: 100%;
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
        border-color: transparent;
        --tw-border-opacity: 1;
        border-left-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
.tooltip-portal-content.tooltip-bottom::before,
.tooltip-portal-content.tooltip-bottomleft::before,
.tooltip-portal-content.tooltip-bottomright::before {
        top: auto;
        bottom: 100%;
        border-color: transparent;
        --tw-border-opacity: 1;
        border-bottom-color: rgb(23 23 23 / var(--tw-border-opacity, 1));
}
/* Centered placements (top/bottom): center the arrow under/over the trigger.
   The default left-4 anchor is meant for the left-aligned topleft/bottomleft
   variants, so a centered tooltip would otherwise point off to one side. */
.tooltip-portal-content.tooltip-top::before,
.tooltip-portal-content.tooltip-bottom::before {
        left: 50%;
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
/* Right-anchored placements (topright/bottomright): the bubble's RIGHT edge sits
   at the trigger, so the arrow must move to the right edge to point at it. */
.tooltip-portal-content.tooltip-topright::before,
.tooltip-portal-content.tooltip-bottomright::before {
        left: auto;
        right: 1rem;
}
/* Coachmark variant — for controlled (`open`) tooltips that carry a full sentence
   instead of a short hover hint: Figma's 240px centred bubble (2706:13703) instead
   of the 192px left-aligned hover default. Declared here rather than passed as
   utilities because the base .tooltip-content width/alignment are !important, so an
   inline contentClassName of equal specificity loses on source order. */
.tooltip-content.tooltip-coachmark,
.tooltip-portal-content.tooltip-coachmark {
        width: 240px !important;
        max-width: 240px !important;
        text-align: center !important;
}
/* Coachmark GEOMETRY (Figma 2706:13703). The generic bottomright placement anchors to
   the trigger, but this coachmark's visual anchor is the 36px editor toolbar that the
   28px ⋮ icon button is centred inside — so both offsets need the extra 4px accounted
   for. Measured off the Figma export at 1.5x:
     - mt-4 (16px), not the base mt-2: `top-full` starts at the BUTTON's bottom, which
       sits 4px above the toolbar's, so 16 − 4 leaves Figma's 12px gap below the BAR.
     - arrow right:10px, not the base right-4 (16px): the bubble is right-aligned to the
       28px button, whose centre is 14px from that edge; the caret box is 8px wide, so
       14 − 4 = 10px lands its tip on the ⋮.
   Scoped with .tooltip-coachmark (3 classes) so it outranks the 2-class base rules and
   leaves every generic bottomright hover tooltip untouched. */
.tooltip-content.tooltip-bottomright.tooltip-coachmark {
        margin-top: 1rem;
}
.tooltip-content.tooltip-bottomright.tooltip-coachmark::after {
        right: 10px;
}

/* Rich (light) portal tooltip — white bubble with a matching arrow, for custom
   `content` bodies (e.g. a discount breakdown). Width/padding come from the
   content itself. */
/* White bubble for BOTH the portal (.tooltip-portal-content) and non-portal
   (.tooltip-content) render paths. */
.tooltip-portal-content.tooltip-rich,
.tooltip-content.tooltip-rich {
        width: -moz-max-content;
        width: max-content;
        max-width: none;
        border-radius: 0.5rem;
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        padding: 0px;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
        --tw-shadow: 0 0 0 1px rgba(255, 255, 255, 0.80) inset, 0 0 0 1px rgba(9, 15, 21, 0.09), 0 1px 2px 0 rgba(9, 15, 21, 0.09), 0 4px 6px 0 rgba(9, 15, 21, 0.09), 0 24px 40px -16px rgba(9, 15, 21, 0.09);
        --tw-shadow-colored: inset 0 0 0 1px var(--tw-shadow-color), 0 0 0 1px var(--tw-shadow-color), 0 1px 2px 0 var(--tw-shadow-color), 0 4px 6px 0 var(--tw-shadow-color), 0 24px 40px -16px var(--tw-shadow-color);
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
/* Rich tooltips render their OWN white arrow inside `content` (inline-styled, so
   its color is fully under our control). Hide the shared dark arrow — the portal
   path uses ::before, the non-portal path uses ::after, so hide BOTH. Overriding
   just the border color proved unreliable in the app build. */
.tooltip-portal-content.tooltip-rich::before,
.tooltip-portal-content.tooltip-rich::after,
.tooltip-content.tooltip-rich::before,
.tooltip-content.tooltip-rich::after {
    display: none !important;
}
/* tooltip end */

/* tabs start */
/* //strip: a flat row of text tabs */
.tabs-strip.absolute {
        position: absolute;
    }
.tabs-strip {
        position: relative;
        display: flex;
        align-items: center;
}
.tabs-strip-small {
        gap: 1rem;
}
.tabs-strip-medium {
        gap: 1.5rem;
}

/* //stretch: tabs split the row equally (side-panel pattern) */
.tabs-stretch {
        gap: 0px;
}
.tabs-stretch .tab-item {
        flex: 1 1 0%;
}

/* //track: hairline rule under the whole strip; the active 2px underline overlaps it */
.tabs-track {
        border-bottom-width: 1px;
        border-color: rgba(11, 15, 20, 0.09);
}
.tabs-track .tab-item {
        margin-bottom: -1px;
}

/* //tab item: gray at rest, dark on hover; selection = dark medium label. The 2px
   underline is drawn by the shared .tabs-indicator that slides between tabs, so
   items keep a transparent 2px bottom border only to reserve its baseline. */
.tab-item.absolute {
        position: absolute;
    }
.tab-item {
        position: relative;
        display: inline-flex;
        cursor: pointer;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
        border-bottom-width: 2px;
        border-color: transparent;
        font-weight: 400;
        --tw-text-opacity: 1;
        color: rgb(82 82 82 / var(--tw-text-opacity, 1));
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
.tab-item:hover {
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.tab-item-small {
        height: 2rem;
        font-size: 0.75rem;
        line-height: 1rem;
}
.tab-item-medium {
        height: 2.5rem;
        padding-left: 0.25rem;
        padding-right: 0.25rem;
        font-size: 0.875rem;
        line-height: 1.25rem;
}
.tab-item-selected {
        font-weight: 500;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}

/* //indicator: a single 2px bar that slides (translateX + width) under the active
   tab instead of each tab toggling its own border. Geometry is set inline. */
.relative.tabs-indicator {
        position: absolute;
    }
.tabs-indicator {
        pointer-events: none;
        position: absolute;
        left: 0px;
        bottom: 0px;
        height: 0.125rem;
        --tw-bg-opacity: 1;
        background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
    will-change: transform, width;
}
/* //track: drop the bar 1px so it sits ON TOP of the strip's hairline instead of
   stacking above it — the active underline and the divider read as one clean line. */
.tabs-track .tabs-indicator {
    bottom: -1px;
}
.tabs-indicator-glide {
    transition: transform 280ms cubic-bezier(0.65, 0, 0.35, 1), width 280ms cubic-bezier(0.65, 0, 0.35, 1), opacity 160ms linear;
}
@media (prefers-reduced-motion: reduce) {
    .tabs-indicator-glide {
        transition: none;
    }
}

/* //reserve the medium-weight width so neighbors don't shift when selection moves */
.tab-item-label {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
}
.tab-item-label::after {
    content: attr(data-label);
    visibility: hidden;
    height: 0px;
    overflow: hidden;
    font-weight: 500;
}
/* tabs end */

/* listitem start */
/* //row: a flat list row — icon? + (title over subtitle?) + trailing?
   Styling mirrors the editor three-dot context menu (Dropdown's .dropdown-item-*):
   14px/regular title, sharp rounded-sm hover, elevated-hover fill, 10px icon gap. */
.listitem {
        display: flex;
        width: 100%;
        -webkit-user-select: none;
           -moz-user-select: none;
                user-select: none;
        align-items: center;
        border-radius: 0.125rem;
        border-width: 0px;
        background-color: transparent;
        text-align: left;
}
/* //stacked: with a subtitle, the row top-aligns so the icon (and trailing) sit against
   the TITLE line, not the vertical center of the title+subtitle group. */
.listitem-stacked {
        align-items: flex-start;
}
.listitem-interactive {
        cursor: pointer;
        transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
}
/* hover only when not already selected, so the selected tint isn't overridden */
.listitem-interactive:not(.listitem-selected):hover {
        background-color: rgba(11, 15, 20, 0.08);
}
/* //selected: reads the same as hover — a neutral fill, no brand tint or coloured text */
.listitem-selected {
        background-color: rgba(11, 15, 20, 0.08);
}
.listitem-disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: 0.5;
}

/* //danger tone: destructive actions (Delete, Remove) — red title + icon, red-tinted hover */
.listitem-danger .listitem-title,
.listitem-danger .listitem-icon {
        --tw-text-opacity: 1;
        color: rgb(185 28 28 / var(--tw-text-opacity, 1));
}
.listitem-interactive.listitem-danger:not(.listitem-selected):hover {
        --tw-bg-opacity: 1;
        background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}

/* //sizes: medium mirrors the context menu (px-2, py-2, 10px gap) */
.listitem-medium {
        gap: 10px;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
}
.listitem-small {
        gap: 0.5rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        padding-top: 0.375rem;
        padding-bottom: 0.375rem;
}

/* //icon: fixed-width leading slot (glyph centered), inherits the row's text color;
   red on danger, brand when selected. */
.listitem-icon {
        display: flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.listitem-medium .listitem-icon {
        height: 1.25rem;
        width: 1.25rem;
}
.listitem-small .listitem-icon {
        height: 1rem;
        width: 1rem;
}

/* //image: alternate leading slot for a logo/thumbnail (e.g. the brand-kit dropdown) —
   a rounded box with the image contained; same footprint as the icon slot. */
.listitem-image.absolute {
        position: absolute;
    }
.listitem-image {
        position: relative;
        display: flex;
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        border-radius: 0.25rem;
        --tw-bg-opacity: 1;
        background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1));
}
.listitem-image img {
        height: 100%;
        width: 100%;
        -o-object-fit: contain;
           object-fit: contain;
}
/* border-primary (rgba 11,15,20 / 0.20) drawn as an INSET ring on a pseudo-element so it
   overlays the image's own edge, instead of a border sitting outside the content. */
.listitem-image::after {
    content: "";
}
.relative.listitem-image::after {
        position: absolute;
    }
.listitem-image::after {
        pointer-events: none;
        position: absolute;
        inset: 0px;
        border-radius: 0.25rem;
    box-shadow: inset 0 0 0 1px rgba(11, 15, 20, 0.2);
}
.listitem-medium .listitem-image {
        height: 1.25rem;
        width: 1.25rem;
}
.listitem-small .listitem-image {
        height: 1rem;
        width: 1rem;
}

/* //text block: title over optional subtitle; min-w-0 so the title can truncate */
.listitem-body {
        display: flex;
        min-width: 0px;
        flex: 1 1 0%;
        flex-direction: column;
}
.listitem-title {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 0.875rem;
        line-height: 1.43;
        font-weight: 400;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
.listitem-subtitle {
        margin-top: 0.125rem;
        font-size: 0.75rem;
        line-height: 1.33;
        font-weight: 400;
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
}
.listitem-small .listitem-title {
        font-size: 0.75rem;
        line-height: 1.33;
        font-weight: 500;
}
/* small subtitle stays at 12px (text-body-sm-regular from the base rule) — 10px is too small */

/* //trailing: pinned to the right (chevron, badge, check, shortcut…); top-aligns with the
   title in stacked rows. Trailing icons inherit primary; a badge/shortcut sets its own color. */
.listitem-trailing {
        margin-left: auto;
        display: flex;
        flex-shrink: 0;
        align-items: center;
        padding-left: 0.5rem;
        --tw-text-opacity: 1;
        color: rgb(23 23 23 / var(--tw-text-opacity, 1));
}
/* listitem end */

/* OfferTimerPill — gradient fill + directional tuck-behind nub.
   Fill on ::before (z-index -1) so the nub ::after (z-index -2) sits BEHIND it;
   only the nub's outer point shows past the pill's rounded edge, colored to that
   edge's gradient stop so it reads as a seamless pointed tail. The pill sets an
   explicit z-index so both negative-z pseudos stay contained (stacking context).
   9-stop brand offer gradient (ref: offer-gradient-v3) — no semantic token. */

.otp-pill {
    background: transparent;
    z-index: 0;
}

.otp-pill::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    z-index: -1;
    background: linear-gradient(96deg, #00225c 0%, #003c9e 24%, #0055ed 50%, #0f60ef 66%, #1c6bf3 78%, #2a75f6 86%, #3f82fa 92%, #5990fc 96%, #74a6ff 100%);
}
.otp-pill:hover::before {
    background: linear-gradient(96deg, #063070 0%, #0a48b4 24%, #1667f5 50%, #2170f7 66%, #2e7af9 78%, #3c84fc 86%, #5292fe 92%, #6fa2ff 96%, #8cb6ff 100%);
}

/* Nub — a rotated square tucked behind the fill. Its solid color = the pill's
   gradient stop at that edge, so the visible point continues the fill seamlessly. */
.otp-pill::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    transform: rotate(45deg);
    z-index: -2;
}
.otp-pill[data-arrow="none"]::after {
    display: none;
}

/* Right → gradient 100% stop (#74a6ff). */
.otp-pill[data-arrow="right"]::after {
    right: -3px;
    top: 50%;
    margin-top: -4px;
    background: #74a6ff;
}
.otp-pill[data-arrow="right"]:hover::after {
    background: #8cb6ff;
}

/* Left → gradient 0% stop (#00225c). */
.otp-pill[data-arrow="left"]::after {
    left: -3px;
    top: 50%;
    margin-top: -4px;
    background: #00225c;
}
.otp-pill[data-arrow="left"]:hover::after {
    background: #063070;
}

/* Top / Bottom → the nub sits at the horizontal centre, where the 96° gradient
   is mid-way, so it uses the 50% stop (#0055ed). */
.otp-pill[data-arrow="top"]::after {
    top: -3px;
    left: 50%;
    margin-left: -4px;
    background: #0055ed;
}
.otp-pill[data-arrow="top"]:hover::after {
    background: #1667f5;
}
.otp-pill[data-arrow="bottom"]::after {
    bottom: -3px;
    left: 50%;
    margin-left: -4px;
    background: #0055ed;
}
.otp-pill[data-arrow="bottom"]:hover::after {
    background: #1667f5;
}

/* Motion — glow always; bob axis follows the arrow (horizontal for left/right,
   vertical for top/bottom). */
@keyframes otp-bob-x {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(-6px); }
}
@keyframes otp-bob-y {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-4px); }
}
@keyframes otp-glow {
    0%, 100% { box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18), 0 0 0 0 rgba(0, 85, 237, 0.55); }
    70%      { box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18), 0 0 0 9px rgba(0, 85, 237, 0); }
    100%     { box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18), 0 0 0 0 rgba(0, 85, 237, 0); }
}

.otp-animate {
    animation: otp-glow 2.2s ease-in-out infinite;
}
.otp-animate[data-arrow="right"],
.otp-animate[data-arrow="left"] {
    animation:
        otp-bob-x 1.8s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite,
        otp-glow 2.2s ease-in-out infinite;
}
.otp-animate[data-arrow="top"],
.otp-animate[data-arrow="bottom"] {
    animation:
        otp-bob-y 2.6s ease-in-out infinite,
        otp-glow 2.2s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
    .otp-animate {
        animation: none !important;
    }
}

.ci-textbox-editor {
    overflow: hidden;
    width: 100%;
    position: relative;
    min-height: 30px;
    max-height: 100%;
    height: 100%;
    outline: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

/* List container */
.ci-textbox-editor ol {
    display: flex;
    flex-direction: column;
    list-style: none;
    width: 100%;
    flex-shrink: 0;
}

/* List items */
.ci-textbox-editor ol li {
    position: relative;
    outline: none;
    cursor: text;
    min-height: 1em;
}

/* Marker container */
.ci-textbox-editor ol li .ci-textbox-li-before {
    position: absolute;
    top: 0;
    pointer-events: none !important;
}

.ci-textbox-editor ol li[data-list="checkbox"] .ci-textbox-li-before {
    pointer-events: auto !important;
    cursor: pointer !important;
}

.ci-textbox-editor ol li .ci-textbox-li-before::before {
    white-space: nowrap;
}

/* Text lists (no marker) */
.ci-textbox-editor ol li[data-list="text"] {
    padding-left: 0;
}

.ci-textbox-editor ol li[data-list="text"] .ci-textbox-li-before {
    display: none;
}

/* Element size mapping */
.ci-textbox-editor ol li.cs-element-bullet-style {
    --element-size: var(--element-bullet-size);
}
.ci-textbox-editor ol li.cs-element-sequence-style {
    --element-size: var(--element-sequence-size);
}
.ci-textbox-editor ol li.cs-element-checkbox-style {
    --element-size: var(--element-checkbox-size);
}
.ci-textbox-editor ol li.cs-element-paragraph-style {
    --element-size: var(--element-paragraph-size);
}

/* Indentation levels */
.ci-textbox-editor ol li.ql-indent-1 {
    padding-left: calc(var(--element-size) + 20px + 56px) !important;
}
.ci-textbox-editor ol li.ql-indent-2 {
    padding-left: calc(var(--element-size) + 20px + 112px) !important;
}
.ci-textbox-editor ol li.ql-indent-3 {
    padding-left: calc(var(--element-size) + 20px + 168px) !important;
}
.ci-textbox-editor ol li.ql-indent-4 {
    padding-left: calc(var(--element-size) + 20px + 224px) !important;
}
.ci-textbox-editor ol li.ql-indent-5 {
    padding-left: calc(var(--element-size) + 20px + 280px) !important;
}
.ci-textbox-editor ol li.ql-indent-6 {
    padding-left: calc(var(--element-size) + 20px + 336px) !important;
}
.ci-textbox-editor ol li.ql-indent-7 {
    padding-left: calc(var(--element-size) + 20px + 392px) !important;
}
.ci-textbox-editor ol li.ql-indent-8 {
    padding-left: calc(var(--element-size) + 20px + 448px) !important;
}
.ci-textbox-editor ol li.ql-indent-9 {
    padding-left: calc(var(--element-size) + 20px + 504px) !important;
}

/* Placeholder text for empty elements — only when editor is focused */
.ci-textbox-editor:focus-within [data-placeholder].is-empty::after {
    content: attr(data-placeholder);
    color: #aaa;
    opacity: 0.7;
    pointer-events: none;
    speak: never;
}


/* No focus outline — parent app handles selection visuals */
.ci-textbox-editor:focus-visible {
    outline: none;
}

/* Column layout support
 * Strategy: Apply column-count on the parent div directly.
 * display: block is required for CSS columns to work (flex disables column layout).
 */
.ci-textbox-editor.columnCount {
    display: block;
    -moz-column-fill: auto;
         column-fill: auto;
    -moz-column-gap: 24px;
         column-gap: 24px;
}

/* Heading div base styles */
.ci-textbox-editor > div[data-heading] {
    outline: none;
    cursor: text;
    min-height: 1em;
    width: 100%;
    flex-shrink: 0;
}

/* In column mode, OL must be display: block for CSS columns to work */
.ci-textbox-editor.columnCount > ol {
    display: block;
}

/* Per-element gap system — --gap-after is set inline by buildHTML based on gapConfig prop.
 * Works with any class name (h1, h5_1, p5, etc.) since gaps are computed in JS.
 * Fallback: --gap-default on the parent template class, then 0px.
 */
.ci-textbox-editor > div[data-heading] { margin-bottom: var(--gap-after, var(--gap-default, 0px)); }
.ci-textbox-editor > ol { margin-bottom: var(--gap-after-ol, var(--gap-default, 0px)); }
.ci-textbox-editor > ol > li { margin-bottom: var(--gap-after-li, var(--gap-default, 0px)); }

/* No trailing space on last elements */
.ci-textbox-editor > *:last-child { margin-bottom: 0; }
.ci-textbox-editor > ol > li:last-child { margin-bottom: 0; }


/* ==============================================================================
   React Chart - Professional CSS
   Convention: ci- = chart item, cs- = chart shape, cf- = chart format
   Integrates with pitchdeckdoclist theme color classes.
   ============================================================================== */

/* ---- Container ---- */

.ci-react-chart-container {
    width: 100%;
    position: relative;
    cursor: pointer;
    box-sizing: border-box;
}

/* All contentEditable chart text preserves user-entered line breaks
   (Enter -> <br>, stored as "\n") across blur/save. Single-line numeric
   fields (data-type="value" / "baselineValue") opt out — their Enter handler
   blurs instead of inserting a break, and their own classes keep
   `white-space: nowrap`. Specificity is intentionally low (0,1,1) so
   chart-specific overrides (e.g. bump year labels: `nowrap`) still win. */
.ci-react-chart-container [contenteditable="true"]:not([data-type="value"]):not([data-type="baselineValue"]) {
    white-space: pre-wrap;
}

/* Top-level orientation hooks — added to the chart container based on chart type.
   - `cs-column` → vertical-axis charts (column, line, area). Bars/points grow along Y.
   - `cs-row`    → horizontal-axis charts (bar). Bars grow along X.
   Pie/Doughnut are radial and get no orientation class.
   Empty rules so themes/moods can target either family without coupling to chart type. */
.cs-column .ci-axis-x-tick-row {
    position: absolute;
}
.cs-row .ci-axis-y-tick-row {
    position: absolute;
}

/* ---- Chart Wrapper ---- */

.ci-chart-wrapper {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

/* ---- Series Column ---- */

.ci-series {
    flex: 1;
    display: flex;
    min-width: 0;
    min-height: 0;
    position: relative;
}

/* ---- Bar ---- */

.ci-bar {
    flex: none;
    transition:
        filter 0.15s ease,
        box-shadow 0.2s ease;
}

.ci-bar:hover {
    cursor: pointer;
}

/* ---- Asset Bar (9-slice SVG asset for ColumnSimpleAssetScale) ----
   The bar div carries `color: currentColor` and the wrapping series-item
   carries `th-section{N}` which sets `color: rgba(var(--itemN-color-rgb), 1)`.
   Setting fill/stroke to `currentColor` on the inner <use> elements lets the
   theme color cascade automatically. The asset's symbol shapes have no
   intrinsic fill, so they paint with whatever the cascade resolves.
   Background and border-radius are forced transparent / 0 — defensive
   override so column-family theme rules
   (`.cs-item-style-solid .cs-graphic-item { background-color: ... }`,
    `.cs-column .cs-graphic-item { border-radius: ... }`)
   don't paint a solid rectangle behind the asset shape. */
.ci-asset-bar {
    color: currentColor;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

/* Uniform-scale asset bar (SimpleColumnShapePosition). Inherits transparency
   from .ci-asset-bar; overflow:hidden is set inline (the legacy clip-by-bar
   behaviour where short bars clip the asset's bottom). */
.ci-shape-position-bar-svg {
    overflow: visible;
    pointer-events: none;
}

/* Variant-selection asset bar (BuildingPositionColumn). Inherits
   transparency from .ci-asset-bar. The asset is rendered at native
   viewBoxDefault aspect with preserveAspectRatio="xMidYMax meet" — the
   asset's natural Y range is bottom-anchored within the bar slot; the
   chosen variant's drawn extent determines visual height. */
.ci-building-position-bar-svg {
    overflow: visible;
    pointer-events: none;
}

/* ---- Value Text ---- */

.ci-value-text-wrap {
    position: absolute;
    width: 100%;
    flex-shrink: 0;
    pointer-events: all;
}

.ci-value-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    outline: none;
    pointer-events: all;
    cursor: text;
}

/* ---- Label ---- */

.ci-label-text-wrap {
    flex: 1;
    outline: none;
    min-width: 0;
    pointer-events: all;
}

.ci-label-text {
    overflow: hidden;
    outline: none;
    word-break: break-word;
    /* Preserve user-entered line breaks (Enter -> <br>, stored as "\n") so
       multi-line category labels render with the breaks the user typed
       after blur/save — without this, `\n` collapses and word-wrap takes
       over, mangling the layout the user intended. */
    white-space: pre-wrap;
    width: 100%;
    pointer-events: all;
    cursor: text;
}

/* ---- Value-position theme hooks ----
   Empty by design — themes/moods override these to apply
   position-specific styling (bg, padding, text-shadow, etc.)
   without changing the inline geometry set by each chart component.
   Classes are applied to `.ci-value-text-wrap` via wrapperExtraClass. */
.cs-value-pos-outside-end,
.cs-value-pos-inside-end,
.cs-value-pos-inside-center,
.cs-value-pos-inside-start,
.cs-value-pos-outside-start,
.cs-value-pos-outside-top-start,
.cs-value-pos-outside-top-center,
.cs-value-pos-outside-top-end,
.cs-value-pos-outside-bottom-start,
.cs-value-pos-outside-bottom-center,
.cs-value-pos-outside-bottom-end,
.cs-value-pos-outside-left-start,
.cs-value-pos-outside-left-center,
.cs-value-pos-outside-left-end,
.cs-value-pos-outside-right-start,
.cs-value-pos-outside-right-center,
.cs-value-pos-outside-right-end,
.cs-value-pos-above,
.cs-value-pos-below,
.cs-value-pos-center {
}

/* ---- Chart Legend ---- */

.ci-chart-legend {
    display: flex;
    flex-wrap: wrap;
    flex-shrink: 0;
}
.ci-chart-legend-horizontal {
    flex-direction: row;
    justify-content: center;
    /* Override the shared .ci-chart-legend `flex-shrink: 0` for horizontal
       layouts. Without shrinking the legend takes its max-content width and
       extends past the parent, so the inner `flex-wrap: wrap` never triggers
       when there are many legend items. */
    flex-shrink: 1;
    min-width: 0;
    max-width: 100%;
    /* Top/bottom legend: cap the strip to 45% of the graphic area height so a
       legend that wraps onto many rows can't eat more than ~half the plot. */
    max-height: 45%;
    overflow: hidden;
}
.ci-chart-legend-vertical {
    flex-direction: column;
    justify-content: flex-start;
    /* Left/right legend: cap the whole strip to 45% of the graphic area
       (the row-flex main area it lives in) so a long label wraps inside the
       strip instead of stretching it across the plot. */
    max-width: 45%;
}
.ci-chart-legend-floating {
    position: absolute;
    z-index: 10;
}

/* ---- Shared legend layout primitives (chart-agnostic) ----
   Single source of truth for the 12-position legend alignment used by
   pie / polar-area / waffle / gauge / funnel (anything with a settable
   legend position). Every chart's legend root MUST stamp:
     • `ci-chart-legend-base-{top|bottom|left|right}`   — flex sizing /
       direction for the strip itself (horizontal vs vertical column).
     • `ci-chart-legend-pos-{full position name}`       — alignment
       within its flex parent (`align-self` for column-direction sides,
       `justify-content` for row-direction strips).
   The chart's flex parent is responsible for being a row (when legend is
   left/right) or column (when legend is top/bottom). With `align-items:
   stretch` (default) the top/bottom legend strip is full-width, so its
   own `justify-content` positions items along the row.

   All rules below share specificity 0,1,0 — DO NOT introduce parent-
   descendant compound selectors that would silently override these. Add
   any chart-family theming via SCOPING classes (e.g. `.cs-waffle-legend`)
   on PAINT properties, not layout. */
.ci-chart-legend-base-left,
.ci-chart-legend-base-right {
    flex: 0 0 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}
/* Side strips (left/right base) — `align-self` aligns the strip
   vertically within its row-direction parent. Bare `left`/`right` are
   vertically CENTERED (mirrors bare `top`/`bottom` being horizontally
   centered); the off-center variants are the explicit `-top` / `-bottom`
   rows. `-middle` is a legacy alias of the bare (centered) position kept
   only so saved slides round-trip — it is no longer offered in the
   dropdown. */
.ci-chart-legend-pos-left,
.ci-chart-legend-pos-right,
.ci-chart-legend-pos-left-middle,
.ci-chart-legend-pos-right-middle {
    align-self: center;
}
.ci-chart-legend-pos-left-top,
.ci-chart-legend-pos-right-top {
    align-self: flex-start;
}
.ci-chart-legend-pos-left-bottom,
.ci-chart-legend-pos-right-bottom {
    align-self: flex-end;
}
/* Top/bottom strips — anchor items to one end of the full-width strip.
   Sets BOTH `justify-content` (main axis) AND `align-items` (cross axis)
   so the rule works regardless of the legend's internal flex-direction:
     • Row-direction legend (pie / polar / gauge / funnel):
       `justify-content` is horizontal → left/center/right wins.
     • Column-direction legend (waffle, with stacked value+label items):
       `align-items` is horizontal → left/center/right wins.
   The other property is benign in each case. With `align-items: stretch`
   (default flex on parent) the strip spans the full width of its column-
   direction parent so the alignment math has room to work. */
.ci-chart-legend-pos-top,
.ci-chart-legend-pos-bottom {
    justify-content: center;
    align-items: center;
}
.ci-chart-legend-pos-top-left,
.ci-chart-legend-pos-bottom-left {
    justify-content: flex-start;
    align-items: flex-start;
}
.ci-chart-legend-pos-top-right,
.ci-chart-legend-pos-bottom-right {
    justify-content: flex-end;
    align-items: flex-end;
}

.ci-chart-legend-item {
    display: flex;
    align-items: center;
    /* Allow the label child to shrink/wrap inside the item instead of
       forcing the item to its max-content width. */
    min-width: 0;
}
/* Top/bottom legend: items size to their own content (no per-item width cap).
   flex-wrap on the strip wraps a crowded legend onto extra rows, and the
   label's own `overflow-wrap: break-word` (+ item `min-width: 0`) breaks a
   single over-long label so it can't overrun the plot — so a lone label like
   "Revenue Performance" uses the free width instead of wrapping mid-word. */

/* ---- Legend Label ---- */

/* Scope to .ci-react-chart-container so this rule beats the host theme's
   `.cs-legend-label { white-space: nowrap }` — legend labels need pre-wrap so
   user-inserted Enter breaks survive render after blur. */
.ci-react-chart-container .ci-legend-label {
    white-space: pre-wrap;
    outline: none;
    /* Wrap inside the 30%-capped legend/item: min-width:0 lets the flex
       child shrink below content size, overflow-wrap breaks long unbroken
       strings so they don't overrun the cap. */
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* ---- Legend Shape (color swatch) ---- */
.cs-legend-shape {
    display: inline-block;
}
.ci-legend-shape {
    flex-shrink: 0;
    overflow: hidden;
}

.ci-legend-shape-fill {
    display: block;
    width: 100%;
    height: 100%;
}

/* ---- Legend Value (percent / data) ---- */

/* ---- Data Label ---- */
.trendlinePathElement {
    fill: none;
}

/* ---- Grid ----
   POSITIONING MODEL: every grid line and axis line is "centered at its position".
   - Horizontal lines use `bottom: pct%, transform: translateY(50%)` so that the
     line's vertical CENTER (not its bottom edge) sits at `pct%` from the parent
     bottom. Whatever height the theme CSS gives the line, the center stays put.
   - Vertical lines use `left: pct%, transform: translateX(-50%)` for the same
     reason on the X axis.
   This is the SAME math `.ci-axis-y-tick-row` already uses, so tickmarks, grid
   lines, and axis lines all share one coordinate system — they line up exactly.
   At edge positions (pct=0 / pct=100), half the line stays inside the parent and
   half overflows, which is the standard chart appearance for the baseline and
   the topmost grid line. */

.ci-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.ci-grid-line {
    box-sizing: border-box;
    position: absolute;
}
.ci-grid-line-horizontal {
    left: 0;
    right: 0;
    transform: translateY(50%);
}
.ci-grid-line-vertical {
    top: 0;
    bottom: 0;
    transform: translateX(-50%);
    height: 100% !important;
}

/* ---- Axis Lines ----
   Base `.ci-axis-line` stays in normal flow so BarChart's bottom value-axis line
   (rendered as a flow child of the value-axis area) can sit naturally above its
   ticks. Only the *variant* classes opt into absolute positioning, because they're
   used as grid overlays inside the relatively-positioned plot area.

   POSITIONING model:
   - The variant rules declare ONLY the axis the line spans (left/right for a
     horizontal line, top/bottom for a vertical line). The position along the
     perpendicular axis is set INLINE by the chart component, because it depends
     on the data:
       * Positive-only data → line sits just OUTSIDE the plot area, in the tick-
         mark gap, so bars don't overlap the line. Horizontal lines use inline
         `top: "100%"`; vertical lines use inline `right: "100%"` (left-side) or
         `left: "100%"` (right-side).
       * Mixed-sign data → line sits at the zero crossing inside the plot, and
         the chart component adds inline `transform: translateY(50%)` (horizontal)
         or `translateX(-50%)` (vertical) to CENTER it on the zero value — same
         math as `.ci-grid-line-*` and `.ci-axis-y-tick-row`, so it aligns with
         grid lines and tick rows exactly.

   IMPORTANT: do NOT add `position: absolute` to the base class — without a
   positioned ancestor, an absolutely-positioned base line escapes to the chart
   container and stretches across the full chart width, producing an extra line
   that extends past the value axis ticks. The *variants* below carry their own
   `position: absolute` because they're always rendered inside the plot-inner
   overlay, which is the positioned ancestor they resolve against. */

.ci-axis-line-horizontal {
    position: absolute;
    left: 0;
    right: 0;
    /* `top` / `bottom` set inline */
}
.ci-axis-line-vertical,
.ci-axis-line-vertical-left {
    position: absolute;
    top: 0;
    bottom: 0;
    /* `left` / `right` set inline */
}

/* ---- Axis Tick ---- */

/* ---- Tick Marks ---- */

.ci-value-tickmark {
    flex-shrink: 0;
}

/* ---- Axis X ---- */

.ci-axis-x {
    position: relative;
    flex-shrink: 0;
}
.ci-axis-x-tick-row {
    display: flex;
    width: 100%;
}
.ci-axis-x-tick-cell {
    display: flex;
}
.ci-axis-x-tick-cell-center {
    flex: 1;
    justify-content: center;
}
.ci-axis-x-tick-cell-start {
    flex: 1 1 0%;
    justify-content: flex-start;
}
.ci-axis-x-labels {
    display: flex;
    width: 100%;
}

/* ---- Axis Y ---- */

.ci-axis-y {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    overflow: visible;
}
.ci-axis-y-tick-col {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}
.ci-axis-y-tick-area {
    flex: 1;
    position: relative;
    overflow: visible;
}
.ci-axis-y-tick-measure {
    visibility: hidden;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.ci-axis-y-tick-positioner {
    position: absolute;
    right: 0;
    left: 0;
    overflow: visible;
}
.ci-axis-y-tick-row {
    position: absolute;
    right: 0;
    transform: translateY(50%);
    display: flex;
    align-items: center;
    white-space: nowrap;
}

/* ---- Axis Title ----
   Rotation depends on chart ORIENTATION, not data axis:
   - cs-column charts (column / line / area):  Y-axis title is on the LEFT  (rotated), X is bottom (horizontal)
   - cs-row    charts (bar):                   X-axis title is on the LEFT  (rotated), Y is bottom (horizontal)
   So we scope the writing-mode rule by orientation class, not by `ci-axis-title-y` alone. */

.ci-axis-title-x,
.ci-axis-title-y {
    flex-shrink: 0;
    /* Preserve user-entered line breaks across blur/save. */
    white-space: pre-wrap;
}

/* Column-based charts: rotate the Y-axis title (sits on the left) */
.cs-column .ci-axis-title-y {
    writing-mode: sideways-lr;
}

/* Row-based charts (BarChart): rotate the X-axis title (sits on the left) */
.cs-row .ci-axis-title-x {
    writing-mode: sideways-lr;
}

/* Per-axis theme hooks — themes/moods override color/font for X vs Y separately.
   `cs-x-axis-title` lives on every xAxis.title element regardless of chart type;
   `cs-y-axis-title` lives on every yAxis.title element. Same for axis lines. */

/* ---- Chart Title Block ----
   Each title/subtitle is wrapped in a parent div so layout (padding, flex-shrink,
   align) lives on the parent and the contentEditable child stays a pure text node.
   - cs-graphic-title-text-parent / cs-graphic-title-text-child
   - cs-graphic-subtitle-text-parent / cs-graphic-subtitle-text-child */

.ci-chart-title-block {
    flex-shrink: 0;
}
.ci-chart-title-parent,
.ci-chart-subtitle-parent {
    flex-shrink: 0;
}
.ci-chart-title,
.ci-chart-subtitle {
    outline: none;
    /* Preserve user-entered line breaks (Enter -> <br>, stored as "\n") so
       multi-line titles/subtitles render with breaks after blur/save. */
    white-space: pre-wrap;
}
.ci-chart-title-parent + .ci-chart-subtitle-parent {
    margin-top: 2px;
}

/* ---- Source Text ----
   Wrapped in a parent div for the same reason — parent owns padding/flex-shrink,
   child owns only the text styles.
   - cs-graphic-source-text-parent / cs-graphic-source-text-child */

.ci-source-text-parent {
    flex-shrink: 0;
}
.ci-source-text {
    /* Preserve user-entered line breaks across blur/save. */
    white-space: pre-wrap;
}

/* ---- Pie Chart ---- */

.ci-pie-slice {
    transition:
        opacity 0.3s ease,
        filter 0.3s ease;
    cursor: pointer;
}
.ci-pie-slice:hover {
    opacity: 0.85;
    filter: brightness(1.1);
}

/* Pie slices sit at computed polar positions. Any hover translate (applied by
   host MoodsUtil via data-animation="item", which is designed for axis-aligned
   bars) would push slices out of their arc geometry and into adjacent slices.
   Lock transforms on the slice <path> and its <g> wrapper so hover only
   changes opacity/brightness. */
.ci-react-chart-container .ci-pie-slice,
.ci-react-chart-container .ci-pie-slice:hover,
.ci-react-chart-container g.seriesnodeelements:has(.ci-pie-slice),
.ci-react-chart-container g.seriesnodeelements:has(.ci-pie-slice):hover {
    transform: none !important;
}

/* ---- Pie data-label positioning ---- */

/* 3-point polyline connector (rim → radial kick → horizontal) between a slice
   and its outside label. Class-only styling — no inline style in JSX. Defaults
   are dashed with 1px stroke-width at slide-contrast color; themes override via
   the paired `.cs-pie-connector-line` hook per mood (solid vs dashed, custom
   color, thicker stroke, etc.). `stroke-linejoin: arcs` gives the elbow a
   subtle rounded corner matching legacy LayoutManagerRoundedConnector. */
.ci-pie-connector-line {
    stroke: rgba(var(--th-slide-contrast), 0.5);
    stroke-width: 1;
    stroke-dasharray: 4 3;
    stroke-linejoin: arcs;
    fill: none;
}

/* Outside label — boxed layout with dashed border to match the reference
   design. Color / font come from the existing cs-value-text chain. */
.ci-pie-outside-label {
    white-space: nowrap;
    border: 1px dashed rgba(var(--th-slide-contrast), 0.4);
    border-radius: 2px;
    padding: 2px 6px;
}

/* Outside callout box (label.position === "outside") — holds the category
   label and/or the value as flex children (orientation + order set inline by
   slice direction). Dashed pill matches the value-only outside-label look; the
   box grows with its content (width:max-content inline) and the label child
   wraps long text rather than overflowing. Per-child color/font come from the
   cs-value-text / cs-legend-label chains; themes restyle via `.cs-pie-callout`. */
.ci-pie-callout {
    border: 1px dashed rgba(var(--th-slide-contrast), 0.4);
    border-radius: 4px;
    padding: 3px 8px;
    box-sizing: border-box;
    pointer-events: auto;
}
.ci-pie-callout .ci-pie-callout-value {
    white-space: nowrap;
}
.ci-pie-callout .ci-pie-callout-label {
    line-height: 1.15;
}

/* Legend mode (dataLabels.position === "legend") places the percent next to
   the editable label. No separator — label and value are adjacent flex items
   and the existing .ci-chart-legend-item gap handles spacing. */
.ci-chart-legend-with-value .ci-legend-value {
    margin-left: 4px;
}

/* ---- Realistic Assets Pie Chart ---- */

/* Per-slice raster image — the visible art. Pointer events flow here so
   clicks land on the slice (slice <path> below is pointer-events:none).
   No transition — opacity/brightness changes look wrong on a photo, so we
   don't reuse the standard slice hover. */
.ci-realistic-pie-image {
    cursor: pointer;
}

/* Invisible slice path — carries the data-animation="item" hook for
   MoodsUtil's slice-grow keyframes. Layout transforms are wiped on the
   chart container's slice <g> by the rule above, so this stays in place
   during animation. */
.ci-realistic-pie-slice {
    fill: transparent;
    stroke: none;
    pointer-events: none;
}

/* Stronger hover affordance for image slices — the standard pie-slice
   opacity nudge isn't visible enough on a photographic asset. A subtle
   brightness lift + saturation bump reads as "active" without altering
   the slice's geometric area. */
.ci-realistic-pie-image:hover {
    filter: brightness(1.08) saturate(1.05);
}

/* Legend swatch — per-series pizza image instead of a flat colored fill.
   The wrapper `.ci-legend-shape` already has `overflow: hidden` (line 175 above)
   so the image is clipped to whatever border-radius the host theme applies
   via `.cs-legend-style-{rect|roundedRect|circle|...}`. `object-fit: cover`
   makes the image fill the swatch without empty space; with the legend
   shape's typical aspect (~22x12), the image crops naturally to the
   swatch dimensions. The host's `.cs-legend-shape` background-color rule
   would normally show under a transparent image — pizzas are fully opaque
   raster so it's invisible, but we also clear it via background:transparent
   so a future translucent asset can't double-paint with the theme tint. */
.ci-realistic-pie-legend-shape {
    background: transparent !important;
    background-color: transparent !important;
}
.ci-realistic-pie-legend-image {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
}

/* ---- Overlay Asset Pie Chart ----
   Image renders BEHIND the slices as a continuous backdrop (clipped to the
   pie outline, full opacity, no animation interference). Slices ON TOP carry
   `fill-opacity` (set inline from `cp.assetOverlay.opacity`) so the slider
   directly controls how much slice color shows vs the image underneath.
   Mirrors legacy RealObjectOverlayPieChart's fill-opacity pattern.

   pointer-events:none on the image so clicks fall through to the slice
   paths (node floater + tooltip stay wired).

   Stroke neutralised on `.ci-overlay-pie-slice`: the shared
   `cs-pie-slice-fill` host theme rule paints
   `stroke: rgba(var(--th-slide-primary), 1); stroke-width: var(--dt-border-4)`
   which would draw a dark border between every translucent slice — visually
   wrong on top of an image. Inline `style={{ stroke: "none" }}` already
   overrides on the JSX side; the !important rule below is a defense-in-depth
   layer for any future host CSS that wraps the slice in a more-specific
   selector. */
.ci-overlay-pie-image {
    pointer-events: none;
}
.ci-overlay-pie-slice,
.ci-overlay-pie-slice.cs-pie-slice-fill {
    stroke: none !important;
    stroke-width: 0 !important;
}

/* Legend swatch — same image+fill blend as the slice. The wrapper
   `.ci-legend-shape` keeps `overflow: hidden` from its base rule so both
   children clip to the swatch's border-radius (set by host's
   cs-legend-style-{rect|roundedRect|circle}). Image and fill are absolute
   so they stack at the same spot; image first (DOM-order behind), fill
   second (on top with controlled opacity). */
.ci-overlay-pie-legend-shape {
    position: relative;
    background: transparent !important;
    background-color: transparent !important;
}
.ci-overlay-pie-legend-image {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
}
.ci-overlay-pie-legend-fill {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* ---- Highlight Difference ---- */

.ci-highlight-difference-callout {
    white-space: nowrap;
}

/* ---- Baseline ----
   Horizontal reference line + editable callout. Base layout only; visual
   styling (dash pattern, callout bg / border / color, text color, arrow) lives
   in the host `cs-*` theme CSS.
   - `.ci-baseline-line` uses the grid-line positioning model (bottom: pct%,
     transform: translateY(50%) applied inline), so it aligns with grid lines
     and tick rows exactly.
   - `.ci-baseline-callout` sits at horizontal center of the plot, with its
     vertical edge 8px away from the line. The flip (above vs below) is driven
     by inline positioning in ColumnChart; `data-position="above|below"` is a
     CSS hook for theme overrides (e.g. the arrow on the callout).
   - `.ci-baseline-value` is rendered in the Y-axis tick column — same styling
     path as regular tick labels, but carries its own `ci-baseline-value /
     cs-baseline-value` classes so themes can style it distinctly. */

.ci-baseline-callout {
    white-space: nowrap;
    pointer-events: all;
}

.ci-baseline-text {
    outline: none;
    pointer-events: all;
    cursor: text;
    /* Preserve user-entered line breaks across blur/save. */
    white-space: pre-wrap;
}

.ci-baseline-value {
    outline: none;
    pointer-events: all;
    cursor: text;
}

/* ---- Tooltip ----
   Lib-owned. Moved here from design_assets/commonfiles/css/core-chart-styles.css
   so the lib ships its own tooltip layout (single-value `value · label` row
   and multi-line OHLC stack) without depending on host CSS being in sync. */

.cs-chart-tooltip {
    background: rgba(var(--th-slide-contrast), 1);
    border-radius: var(--dt-radius-6);
    padding: var(--dt-spacing-8) var(--dt-spacing-12);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    pointer-events: none;
    animation: cs-tooltipFadeIn 0.12s ease;
    max-width: 40%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    z-index: 50;
    display: flex;
    align-items: center;
    gap: var(--dt-spacing-8);
}

.cs-chart-tooltip-label {
    font-size: 24px;
    font-weight: 400;
    line-height: 1.3;
    color: rgba(var(--th-slide-primary), 0.6);
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.cs-chart-tooltip-label::before {
    content: "·";
    margin-right: var(--dt-spacing-6);
    color: rgba(var(--th-slide-primary), 0.6);
}

.cs-chart-tooltip-value {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.3;
    color: rgba(var(--th-slide-primary), 1);
    flex-shrink: 0;
}

/* Multi-line variant (OHLC candlestick + any future multi-metric tooltip).
   Activated by :has() — the wrapper switches to column flow only when at
   least one .cs-chart-tooltip-line row is present, so single-value bar /
   pie / line tooltips keep the existing inline layout untouched. */
.cs-chart-tooltip:has(.cs-chart-tooltip-line) {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--dt-spacing-4);
}

.cs-chart-tooltip-line {
    display: flex;
    gap: var(--dt-spacing-4);
    font-size: 24px;
    line-height: 1.3;
    /* Keep numeric values like "1,700,000" on one line — they were wrapping
       mid-comma when the wrapper's max-width: 40% squeezed the column. */
    white-space: nowrap;
}

.cs-chart-tooltip-line-name {
    font-weight: 400;
    color: rgba(var(--th-slide-primary), 0.6);
    text-transform: lowercase;
}

.cs-chart-tooltip-line-value {
    font-weight: 500;
    color: rgba(var(--th-slide-primary), 1);
}

/* Suppress the inline "·" prefix on the label when it follows OHLC rows.
   In the single-value layout the dot reads as a separator between value
   and label; in the stacked layout it becomes an orphan glyph. */
.cs-chart-tooltip:has(.cs-chart-tooltip-line) .cs-chart-tooltip-label::before {
    content: none;
    margin: 0;
}

@keyframes cs-tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateY(2px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ---- Editable text elements: ensure clickable + cursor ---- */
/* NOTE: chartnew.css defines `.series * { pointer-events: none }` which applies
   to descendants of any element with the `series` class. Our chart items use
   that class for legacy compatibility, so we must explicitly re-enable pointer
   events on contentEditable text nodes and bars/legends inside chart. */

.ci-react-chart-container [contentEditable="true"],
.ci-react-chart-container .series [contentEditable="true"],
.ci-react-chart-container .series .ci-value-text,
.ci-react-chart-container .series .ci-label-text {
    pointer-events: all !important;
    cursor: text;
}

.ci-react-chart-container .series .ci-bar,
.ci-react-chart-container .series .cs-graphic-item,
.ci-react-chart-container .cs-legend-shape,
.ci-react-chart-container .cs-legend-label,
.ci-react-chart-container .ci-legend-label,
.ci-react-chart-container .ci-pie-slice,
.ci-react-chart-container .ci-polar-arc,
/* Size-scale comparison nodes carry the node-link (data-navigate-to-slide-on-click)
   on the graphic box. The host's present-mode linkClickHandler walks UP from the
   click target, so the box must be hittable — otherwise `.series *`
   (pointer-events:none) drops the click onto the .series ancestor and the link
   on the descendant box is never reached (bug 21908). The image sibling escapes
   this via chartnew.css `.series img{pointer-events:all}`; the CSS-shape sibling
   has no <img>, so it needs this explicit re-enable. */
/* ComparisonColumn's cell wrapper carries the `series` node-selection class, so
   chartnew.css `.series *` now reaches its bar. The bar is the tooltip hit-test
   target (`data-type="ITEM"`) and the click target that opens the node floater —
   both die on pointer-events:none. `.ci-comparison-fill` inherits the re-enable
   from `.cs-graphic-item` above; the bar box needs its own. */
.ci-react-chart-container .ci-comparison-bar,
.ci-react-chart-container .ci-sszc-graphic-box {
    pointer-events: all !important;
}

/* ---- Prompt Text (placeholder for empty contentEditable elements) ----
   Two strategies are used:
     1. `:empty::before` covers static text nodes that React renders empty.
     2. `[data-empty="true"]::before` covers contentEditable elements (legend
        labels, etc.) where the browser may auto-insert <br>/&nbsp; on focus,
        which would break `:empty`. Components stamp `data-empty="true"` based
        on the prop value at render time. */

.ci-react-chart-container [contentEditable="true"]:empty::before,
.ci-react-chart-container [contentEditable="false"]:empty::before,
.ci-react-chart-container [contentEditable="true"][data-empty="true"]::before,
.ci-react-chart-container [contentEditable="false"][data-empty="true"]::before {
    content: attr(data-prompt-text);
    opacity: 0.4;
    pointer-events: none;
    display: inline-block;
}

/* Hide prompt text in presentation/widgetView mode */
.widgetView .ci-react-chart-container [contentEditable="true"]:empty::before,
.widgetView .ci-react-chart-container [contentEditable="false"]:empty::before,
.widgetView .ci-react-chart-container [contentEditable="true"][data-empty="true"]::before,
.widgetView .ci-react-chart-container [contentEditable="false"][data-empty="true"]::before {
    content: "" !important;
}

/* Hide entire empty legend label + its swatch in presenter mode so the legend
   collapses gracefully when a label has not been entered yet. The swatch is
   already handled via `data-animation=""` on `.cs-legend-shape`; this hides
   the empty label text alongside it. */
.widgetView .ci-react-chart-container .ci-legend-label[data-empty="true"] {
    display: none !important;
}

/* ---- Superscript / subscript inside chart text ----
   The selected-text floater persists these as real <sup>/<sub> tags (the host's
   TextHighLightUtils writes them; hydrateHighlightContent re-creates them on
   every render). The lib shipped no rules of its own, so they fell through to
   Tailwind's preflight — which pins `vertical-align: baseline` and does the
   raise with `position: relative; top: -0.5em` instead. That offset paints the
   glyph OUTSIDE its line box, where `.ci-label-text { overflow: hidden }` clips
   it away: the run shrank to 75% but never lifted.

   Raise with `vertical-align` instead — it grows the line box rather than
   escaping it — and explicitly drop preflight's `top`/`bottom` so the two
   cannot stack into a double offset. */
.ci-react-chart-container sup,
.ci-react-chart-container sub {
    font-size: 0.75em;
    line-height: 1;
    position: static;
    top: auto;
    bottom: auto;
}
.ci-react-chart-container sup {
    vertical-align: super;
}
.ci-react-chart-container sub {
    vertical-align: sub;
}

.cs-column .ci-axis-y-title-wrapper,
.cs-row .ci-axis-x-title-wrapper {
    display: flex;
}

/* ---- Projection ----
   When projection is active, each bar / point / line-path half carries
   `cs-projection-enabled` (projected side) or `cs-projection-disabled`
   (pre-projection side). Fill / pattern / opacity are applied by the host
   theme (core-chart-styles.css). This file keeps only the bits the lib
   strictly owns — the dashed stroke on the projected line path.

   Projection captions live INSIDE the chart legend (appended after multi-
   series items). See ChartLegend.jsx: each legend item stamps
   `cs-projection-enabled` or `cs-projection-disabled` on its swatch so the
   swatch picks up the same fill/pattern that the bars/points use — visual
   parity between the legend marker and the chart element. */

.cs-line-path.cs-projection-enabled {
    stroke-dasharray: 6 6;
}

/* ==========================================================================
   PRIMARY PLACEHOLDER
   Shared layer rendered below the X-axis label row on column / line / area
   / bar charts. DOM structure mirrors the legacy
   `BaseColumnSeries.doAddPrimaryPlaceholder` (js-chart-new.js) so host theme
   CSS (`cs-*`) hits the same hooks. Two-tier layout:
     .ci-primary-placeholder-layer → flex row (whole strip)
       .ci-primary-placeholder-slot → per-category flex cell (owns column width)
         .ci-primary-placeholder-cell → fixed-size block (owns visual size)
           .primaryplaceholder → holder containing bg + img/svg + overlay
   Size comes from `cs-primary-placeholder-size-{large|medium|small}` on the
   cell — CSS class only, never inline style, so themes can override.
   Image / logo fitting uses `object-fit` (cover / contain) — no JS math.
   ========================================================================== */
.ci-primary-placeholder-layer {
    display: flex;
    flex-direction: row;
    flex-shrink: 0;
    align-items: flex-start;
    overflow: visible;
}
.ci-primary-placeholder-slot {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    min-width: 0;
    overflow: hidden;
}
.ci-primary-placeholder-cell {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex-shrink: 0;
}
.ci-primary-placeholder-cell .primaryplaceholder {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.ci-primary-placeholder-cell .primaryplaceholder > .shapeBgElement {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Logo brightness hooks — preserved from legacy. The per-mood CSS
   (moods/<mood>/<mood>.css) owns the positive `filter: brightness(...)`
   rules keyed off host-set ancestors (.fixedlightText / .fixeddarkText /
   .themeWhitebg / .blackthemebg / [data-graphiccontrast=true]). This
   block is the lib-side neutralizer for `logoContrast=false`: two
   selectors so either the class toggle (`logoBrightnessUnset`) or the
   mirrored HTML attr (`logocontrast="false"`) wins specificity against
   the deepest mood positives. */
.ci-primary-placeholder-cell .logoBrightness.logoBrightnessUnset,
.ci-primary-placeholder-cell img.logoBrightness[logocontrast="false"] {
    filter: none !important;
}
.ci-primary-placeholder-cell img.logoBrightness[logocontrast="true"] {
    filter: brightness(0) invert(1) !important;
}

/* ==========================================================================
   COMMON PLACEHOLDER (pie/doughnut hole)
   A single icon / image / logo / text rendered in the doughnut hole. Size +
   centering are owned by PieCenterPlaceholder.jsx inline styles and scale with
   the inner radius (cellSize ∝ innerR). Deliberately does NOT reuse the
   primaryPlaceholder DOM classes (`primaryplaceholder` / `imageHolder` /
   `cs-chart-element-*`) — those carry host CSS that pins the box to a fixed
   `var(--dt-size-80)`, shrinking the asset regardless of the hole. The holder
   + asset fill 100% of the dynamic cell; image/logo fit via object-fit.
   ========================================================================== */
.ci-common-placeholder-cell {
    box-sizing: border-box;
}
.ci-common-placeholder-holder {
    position: relative;
}
/* Logo contrast — same neutralizer/positive hooks as the primary placeholder,
   scoped to the common-placeholder image. */
.ci-common-placeholder-img.logoBrightness.logoBrightnessUnset,
.ci-common-placeholder-img.logoBrightness[logocontrast="false"] {
    filter: none !important;
}
.ci-common-placeholder-img.logoBrightness[logocontrast="true"] {
    filter: brightness(0) invert(1) !important;
}
.ci-common-placeholder-text {
    overflow: hidden;
    word-break: break-word;
    line-height: 1.2;
}
/* ==============================================================================
   Template Background Layers
   Ports the `createTemplateBgLayers` concept from legacy js-chart-new.js.
   Two optional layers sit behind the chart, each gated by a menu key:
     - menu["graphic-bg"]       → .ci-graphic-bg       (color/decoration)
     - menu["graphic-image-bg"] → .ci-graphic-image-bg (image + overlays)
   Themes/moods attach padding to these classes; that padding is measured in
   React and fed to .ci-chart-inset to shrink the drawable plot area.
   ============================================================================== */

.ci-graphic-bg,
.ci-graphic-image-bg {
    position: absolute;
    inset: 0;
    box-sizing: border-box;
}

.ci-graphic-bg {
    pointer-events: none;
    z-index: 0;
}

.ci-graphic-image-bg {
    z-index: 0;
    overflow: hidden;
}

.ci-graphic-image-bg-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    display: block;
}

.ci-element-image-overlay1,
.ci-element-image-overlay2 {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Chart inset — always mounted, zero padding when no bg layers are active. */
.ci-chart-inset {
    z-index: 1;
    box-sizing: border-box;
}

/* ===== Waterfall ===== */
/* Connector layer sits above bars. Stroke color falls back to currentColor so
   the line renders against any theme without host CSS — themes can override
   via .cs-waterfall-connector-line. Style suffix
   (cs-waterfall-connector-line-{dashed|dotted|solid}) drives stroke-dasharray.
   data-animation="waterfallline" lives on each inner <line>, not the wrapper
   (matches legacy js-chart-new.js:78892 createWaterfallLineSvg). */
.ci-waterfall-connector-layer {
    z-index: 2;
}

/* ===== Dumbbell =====
   Layout-only rules. Themed colours / marker shapes / connector style
   live in host core-chart-styles.css under .cs-dumbbell-* + th-section{N}.
   data-animation hooks: dumbbellmarkerstart, dumbbellmarkerend, dumbbellconnector. */
.ci-dumbbell-layer {
    z-index: 2;
}

.ci-dumbbell-pair {
    box-sizing: border-box;
}

.ci-dumbbell-line {
    box-sizing: border-box;
    pointer-events: none;
}

.ci-dumbbell-marker-start,
.ci-dumbbell-marker-end {
    box-sizing: border-box;
    pointer-events: auto;
}

.ci-dumbbell-label-start,
.ci-dumbbell-label-end {
    pointer-events: auto;
    white-space: nowrap;
}
.ci-has-graphic-bg.ci-react-chart-container {
    z-index: 2;
}

/* ===== Radar / radial family =====
   Layout + minimal stroke defaults. Theme colours live in host
   core-chart-styles.css under cs-radar-* + cs-line-element / cs-area-element /
   cs-line-point + th-section{N}. data-animation hooks: gridlines (rings +
   spokes), itemline (series stroke), itemarea (series fill), item (dots),
   xaxistitle (category labels). Per memory feedback_chart_remount_dummy_render,
   the chart self-measures its plot area; the SVG body is gated on outerR > 0
   so the first commit after a remount doesn't paint empty geometry. */
.ci-radar-wrapper {
    position: relative;
}

.ci-radar-plot-area,
.ci-polar-plot-area {
    overflow: visible;
}

/* PolarArea is deliberately EXCLUDED from these shared radar `none` rules.
   See the PolarArea block below for why a `none` <svg> ancestor breaks
   present-mode tooltips. */
.ci-radar-svg-wrap {
    pointer-events: none;
}

.ci-radar-svg {
    overflow: visible;
    pointer-events: none;
}

/* The series wrapper <g> needs pointer events so dots are hoverable / clickable
   even though the parent SVG sets pointer-events: none for label overlay
   bleed-through. */
.ci-radar-svg .series,
.ci-polar-svg .series {
    pointer-events: auto;
}

/* Series fill — colour from host .cs-line-area. fill-opacity applied inline
   from radarconfig.fillOpacity. Grid rings, axis spokes and dash-style
   variants (cs-grid-line-{solid|dashed|dotted}) are themed entirely by the
   host — lib emits the hooks but no stroke / fill / opacity defaults. */
.ci-radar-fill {
    pointer-events: none;
}

/* Per-vertex dot — HTML div. Size + background-color + border inherited from
   host .seriesnodeelements rule under the th-section{N} cascade. Lib owns the
   circle shape + pointer affordance. */
.ci-radar-point {
    border-radius: 50%;
    pointer-events: auto;
    cursor: pointer;
}

/* Category labels around the perimeter. Click-to-format
   (contentEditable=false + data-text-readonly="true") — user changes
   font / colour via the inline text floater; the underlying string is
   edited from Edit Data. cursor:pointer signals "opens a panel". */
.ci-radar-axis-label,
.ci-polar-axis-label {
    /* white-space: normal so long category labels wrap inside their measured
       max-width (set inline from JSX). Only `overflow-wrap: break-word` —
       breaks a word ONLY when the word itself would overflow the box. We
       deliberately avoid `word-break: break-word` (non-standard, aliased to
       `overflow-wrap: anywhere` in some browsers) because it can split inside
       words that already fit — e.g. "Security" inside a 330px max-width was
       still wrapping to "Securit / y" on certain Chrome builds. With
       `overflow-wrap: break-word` alone, intra-word breaks only fire when
       absolutely necessary, and short single-word labels stay on one line
       inside the available room. RadarChart's measure pass reads the wrapped
       box size and shrinks outerR so the radar makes room. */
    white-space: normal;
    overflow-wrap: break-word;
    cursor: pointer;
    pointer-events: auto;
    -moz-user-select: none;
         user-select: none;
    -webkit-user-select: none;
}

.ci-radar-axis-label[data-empty="true"]:empty::before,
.ci-polar-axis-label[data-empty="true"]:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}

/* Per-vertex value labels (data labels). Same click-to-format model as axis
   labels. fontSize may be inline-overridden via chartProperties.dataLabels.fontSize. */
.ci-radar-value {
    white-space: nowrap;
    cursor: pointer;
    pointer-events: auto;
    -moz-user-select: none;
         user-select: none;
    -webkit-user-select: none;
}
.ci-radar-value:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}

/* ===== Polar Area family =====
   Single-series radial chart where each category becomes a pie-style sector
   whose RADIUS encodes the value (Nightingale rose). Shares grid + spoke +
   perimeter-label scaffold with RadarChart (same class hooks reused — see
   PolarAreaChart.jsx, which double-stamps ci-polar-* AND ci-radar-* on the
   wrapper/plot-area/svg-wrap for theme rule reuse). Slice paint rides
   th-section{i} cascade indexed by CATEGORY (per-slice tint, like Pie) with
   cs-line-area on the <path> for fill colour (host theme owns paint per
   reference_cs_line_area_for_svg_fill). Lib stays paint-free except for
   pointer affordance + cursor + visibility logic.
   onChartRendered gated on plotSize > 0 per feedback_chart_remount_dummy_render. */
.ci-polar-wrapper {
    position: relative;
}

.ci-polar-plot-area {
    overflow: visible;
}

/* PolarArea tooltips (editor + PRESENT mode).
   The arc <path> lives inside the `.series` <g> wrapper, so the host
   chartnew.css rule `.series * { pointer-events: none }` sets the arc itself
   to `none`. With the arc non-hittable, document.elementsFromPoint never
   returns it and the `.ci-polar-arc` branch in findChartElementUnderCursor
   finds nothing — hover tooltips silently die. The fix is an explicit
   `pointer-events: all !important` on `.ci-polar-arc`, applied in the shared
   re-enable block above next to `.ci-pie-slice` (which needed the identical
   override for the same reason). NOTE: a plain `pointer-events: auto` does
   NOT survive the build — `auto` is the initial value and cssnano strips it,
   so it can't override the inherited/`.series *` `none`; `all !important` is
   required. PolarArea is also kept OUT of the shared `.ci-radar-svg*`
   pointer-events:none rules so no `none` ancestor shadows the arc. */
.ci-polar-svg {
    overflow: visible;
}

/* Non-interactive svg children — grid rings, axis spokes and the slice's
   thin outline stroke paint but must NOT capture the pointer (they would
   shadow click-through over the empty plot area now that the <svg> root is
   hit-testable). The filled slice arc is the only hot path; its default
   `visiblePainted` already restricts hits to the filled wedge. */
.ci-polar-grid-line,
.ci-polar-axis-spoke,
.ci-polar-arc-stroke {
    pointer-events: none;
}

.ci-polar-arc {
    cursor: pointer;
}

/* Perimeter category labels — click-to-format (CE=false + data-text-readonly).
   Same wrap rules as radar (overflow-wrap:break-word only) so long category
   names break only when absolutely necessary and JSX's measured maxWidth
   gives them as much room as the wrapper allows. */
.ci-polar-axis-label {
    white-space: normal;
    overflow-wrap: break-word;
    cursor: pointer;
    pointer-events: auto;
    -moz-user-select: none;
         user-select: none;
    -webkit-user-select: none;
}

.ci-polar-axis-label[data-empty="true"]:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}

/* Per-slice value labels — click-to-format. nowrap so the value sits on a
   single line inside the slice; if user picks a font size too large the
   label overflows visibly rather than wrapping into adjacent slices. */
.ci-polar-value {
    white-space: nowrap;
    cursor: pointer;
    pointer-events: auto;
    -moz-user-select: none;
         user-select: none;
    -webkit-user-select: none;
}

.ci-polar-value:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}

/* ===== Circular bars family =====
   Concentric annular bars, one ring per category, series stacked end-to-end
   within each ring. Layout owned here; ALL paint (stroke / fill colour,
   label colour, track colour, dash style) lives in host core-chart-styles.css
   under `.cs-circularbars-*` — this file stays logic-only (geometry, cursor,
   pointer-events, the entry draw-on keyframes). Per memory
   feedback_chart_remount_dummy_render the chart self-measures its plot area
   and the SVG body is gated on outerR > 0. */
.ci-circularbars-wrapper {
    position: relative;
}
.ci-circularbars-plot-area {
    overflow: visible;
}
.ci-circularbars-svg-wrap {
    pointer-events: none;
}
.ci-circularbars-svg {
    overflow: visible;
    pointer-events: none;
}
/* Bars are STROKED arcs — `stroke-width` (set inline) carries the bar
   thickness. Stroke colour is host-themed via `.cs-circularbars-bar` + the
   `th-section{N}` cascade. */
.ci-circularbars-bar {
    pointer-events: auto;
    cursor: pointer;
    transition: opacity 0.2s ease-out;
    fill: none;
}
.ci-circularbars-bar:hover {
    opacity: 0.85;
}
/* Track — background ring behind each bar. Colour + dash style host-themed
   via `.cs-circularbars-track` + `cs-grid-line-{style}`. */
.ci-circularbars-track {
    pointer-events: none;
    fill: none;
}
/* Radial grid spokes at each scale tick — analog of radar/polar spokes, but
   anchored to value-axis ticks (positions along the circumference) since the
   value axis runs around the rim in this chart. Inherits stroke / dash via
   `.cs-grid-line` + `.cs-grid-line-{solid|dashed|dotted}`. */
.ci-circularbars-grid-line {
    pointer-events: none;
    fill: none;
}
/* Category labels — click-to-format (contentEditable=false +
   data-text-readonly). Colour host-themed via `.cs-circularbars-category-label`. */
.ci-circularbars-category-label {
    white-space: nowrap;
    cursor: pointer;
    pointer-events: auto;
    -moz-user-select: none;
         user-select: none;
    -webkit-user-select: none;
}
.ci-circularbars-category-label[data-empty="true"]:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}
/* Per-bar value labels — same click-to-format model. Colour host-themed. */
.ci-circularbars-value {
    white-space: nowrap;
    cursor: pointer;
    pointer-events: auto;
    -moz-user-select: none;
         user-select: none;
    -webkit-user-select: none;
}
.ci-circularbars-value:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}
/* Scale tick labels around the rim — decorative reference numbers. */
.ci-circularbars-grid-value {
    pointer-events: none;
    white-space: nowrap;
}

/* ----- Entry draw-on animation -----
   Bars render at final geometry with `pathLength=100`; the draw-on sweeps
   `stroke-dashoffset` 100 → 0. animation-name lives under the armed wrapper
   class so a settled chart (class removed) holds the final state. Each bar's
   animation-delay / -duration come inline so the stacked segments chain into
   one continuous sweep. Caps + labels fade in behind the sweep. */
@keyframes cs-circularbars-draw {
    from {
        stroke-dashoffset: 100;
    }
    to {
        stroke-dashoffset: 0;
    }
}
@keyframes cs-circularbars-fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.ci-circularbars-animate .ci-circularbars-bar {
    animation-name: cs-circularbars-draw;
    animation-timing-function: linear;
    animation-fill-mode: both;
}
.ci-circularbars-animate .ci-circularbars-value,
.ci-circularbars-animate .ci-circularbars-category-label,
.ci-circularbars-animate .ci-circularbars-grid-value,
.ci-circularbars-animate .ci-circularbars-grid-line {
    animation: cs-circularbars-fade-in 0.4s ease-out both;
    animation-delay: 1s;
}
/* .ci-circularbars-wrapper.skip-animation .ci-circularbars-bar,
.ci-circularbars-wrapper.skip-animation .ci-circularbars-value,
.ci-circularbars-wrapper.skip-animation .ci-circularbars-category-label,
.ci-circularbars-wrapper.skip-animation .ci-circularbars-grid-value,
.ci-circularbars-wrapper.skip-animation .ci-circularbars-grid-line {
    animation: none !important;
} */

/* ===== Funnel family =====
   Vertical (default) and horizontal funnels. Layout owned here; theme colours
   live in host common-template-styles.css via .cs-graphic-item + th-section{N}
   (each segment carries cs-graphic-item so the host's per-section background
   colour applies natively, same as column/bar). Per memory
   feedback_chart_remount_dummy_render, the chart self-measures its plot area;
   SVG body is gated on plotSize.{w,h} > 0 so the first render after a remount
   doesn't paint empty geometry. */
.ci-funnel-wrapper {
    position: relative;
}
.ci-funnel-plot-area {
    overflow: visible;
}
.ci-funnel-svg-wrap {
    pointer-events: none;
}
.ci-funnel-svg {
    overflow: visible;
    pointer-events: none;
}
.ci-funnel-svg .series {
    pointer-events: auto;
}

/* Segment — lib owns only interaction state (cursor, hover transition). All
   colour / fill / stroke comes from host theme via .cs-line-area (which carries
   `fill: rgba(var(--th-section-primary),1)`) layered under the th-section{N}
   cascade on the parent <g>. Matches the BuildingPositionColumn pattern:
   lib stamps cs-* classes, host theme owns paint. */
.ci-funnel-segment {
    cursor: pointer;
    transition: opacity 0.2s ease;
}
.ci-funnel-segment:hover {
    opacity: 0.9;
}

/* Logic-only rules for label / value DOM. Visual styling (font-size,
   line-height, cursor, pointer-events, colour) is owned by host theme via
   .cs-funnel-label / .cs-funnel-value (and inherited .cs-label-text /
   .cs-value-text rules). Per user direction 2026-05-12: lib stops setting
   text styling for funnel labels. */
.ci-funnel-label[data-overflow-hidden="true"],
.ci-funnel-value[data-overflow-hidden="true"] {
    visibility: hidden;
}
.ci-funnel-label[data-empty="true"]:empty::before,
.ci-funnel-value[data-empty="true"]:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.35;
}

/* Connector line — lib owns only fill:none (SVG default for paths is fill,
   which would paint a triangle behind the leader). Stroke colour + width
   + dash come from host theme via .cs-funnel-connector-line. */
.ci-funnel-connector-line {
    fill: none;
}

/* ===== Currency family =====
   SimpleCurrencyChart — proportional currency-share strip with alternating
   top/bottom callouts. Lib carries STRUCTURAL CSS only (layout, overflow,
   pointer-events, wrap + clamp behaviour). All PAINT (stroke colour, stroke
   width, dash pattern, fill, text colour) is owned by host theme via the
   paired `cs-currency-*` classes plus `--seg-color` / `--currency-*-thickness`
   CSS variables published by the component. Mirrors funnel + asset-bar
   lib/host separation. */
.ci-currency-chart {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    /* Clip during resize so callouts that briefly overshoot the plot bounds
       (between an old layout pass and the next overlap-resolve) don't leak
       outside the chart container. The cascade resolver settles within
       one layout commit, so the clip rarely shows during steady state. */
    overflow: hidden;
}
.ci-currency-plot-area {
    overflow: hidden;
}
.ci-currency-strip-svg {
    pointer-events: none;
}
.ci-currency-strip-svg .ci-currency-segment {
    pointer-events: auto;
    cursor: pointer;
    transition: opacity 0.2s ease;
}
.ci-currency-strip-svg .ci-currency-segment:hover {
    opacity: 0.9;
}
.ci-currency-image {
    /* No interaction state needed — the parent <g class="series"> handles
       hit-test routing for tooltip / Replace-flow / node selection. */
    pointer-events: none;
}
.ci-currency-strip-svg .ci-currency-segment-border {
    /* `all` (not the default `visiblePainted`) makes the WHOLE segment
       interior the click target even when the host theme paints the rect
       `fill: none` — otherwise only the thin stroke would be clickable and
       clicks over the bill image (pointer-events:none) would fall through to
       the chart background, breaking per-node selection / Replace / Delete. */
    pointer-events: all;
}

/* Callout block — absolutely positioned over the plot area, centered
   horizontally on the segment via translateX(-50%). Vertical layout uses
   a flex column so label + value stack naturally with the label adjacent to
   the connector terminus (top callouts → label at bottom; bottom callouts →
   label at top — JSX order owns the visual order). `max-width` is set
   inline per chart so long text wraps inside the cap — never bleeds into
   neighbouring callouts. */
.ci-currency-callout {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    pointer-events: none;
    box-sizing: border-box;
}
.ci-currency-callout-top {
    justify-content: flex-end;
}
.ci-currency-callout-bottom {
    justify-content: flex-start;
}
.ci-currency-label-wrap,
.ci-currency-value-wrap {
    pointer-events: auto;
    /* `inline-flex` lets the wrap shrink to its content's natural width so
       short content like "0%" or "Enter Label" doesn't inflate the callout
       block to its max-width cap. The block (`align-items: center`) still
       centers the wraps horizontally within itself. */
    display: inline-flex;
    justify-content: center;
    max-width: 100%;
    min-width: 0;
}
.ci-currency-label,
.ci-currency-value {
    text-align: center;
    cursor: text;
    pointer-events: auto;
    -moz-user-select: text;
         user-select: text;
    -webkit-user-select: text;
    /* Wrap long text on word boundaries. `break-word` only kicks in for
       unbroken tokens (e.g. "qwdqwdqwd…") that won't fit any line — normal
       multi-word labels never break mid-word, so "Enter Label" wraps as
       "Enter / Label" rather than per character. */
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
    max-width: 100%;
    min-width: 0;
    /* Cap callouts at 2 visible lines and truncate overflow with an
       ellipsis — keeps tight callouts readable during resize without the
       text bleeding past the plot bounds. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ci-currency-value {
    /* Value is editable — typing commits on blur / Enter (handleValueBlur
       parses the display text back to a matrix raw value). Text caret +
       selection enabled so the user can edit the number in place. */
    cursor: text;
    -moz-user-select: text;
         user-select: text;
    -webkit-user-select: text;
}
.ci-currency-label[data-empty="true"]:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.4;
}

/* Connector overlay — single SVG layer covering the plot area. */
.ci-currency-connector-svg {
    pointer-events: none;
}
.ci-currency-connector-line {
    /* `fill: none` is structurally required for SVG paths — without it
       the path renders as a filled shape between its endpoints. This is
       behaviour, not paint, so it stays in lib. Stroke colour / width /
       dasharray come from host theme via `.cs-currency-connector-line*`. */
    fill: none;
}
.ci-currency-connector-shape {
    pointer-events: none;
}

/* ---------- GaugeChart (single-value 270° arc) ----------
   Structural classes only. Theme paint (arc fill color, label tint,
   needle accent) lives in the host's core-chart-styles.css under
   `cs-gauge-*`. */
.ci-gauge-chart {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
/* ci-gauge-main wraps plot + legend so the legend's `position` enum
   (top / bottom / left / right) drives flex direction:
     • top / bottom  → column (legend stacks above / below the plot)
     • left / right  → row (legend sits beside the plot)
   The legend element itself is rendered ONCE in JSX but lands in the
   right slot via legendBefore branching, so we don't need flex `order`
   tricks here — flex-direction alone arranges the two children. */
.ci-gauge-main {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
}
.ci-gauge-main-top,
.ci-gauge-main-bottom {
    flex-direction: column;
}
.ci-gauge-main-left,
.ci-gauge-main-right {
    flex-direction: row;
    align-items: stretch;
}
.ci-gauge-plot-area {
    /* Self-measured via ResizeObserver — flex:1 so it gets whatever space
       title / legend / source leave behind. */
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}
/* Side / top / bottom strip alignment is owned by the shared
   `.ci-chart-legend-base-{side}` + `.ci-chart-legend-pos-{full}` rules
   at the top of this file. Gauge's legend root stamps both — no per-
   family layout rules needed. */
.ci-gauge-svg {
    overflow: visible;
}
/* Track arc — the unfilled background. Stroke color lands inline (from
   gaugeConfig.trackColor) so the menu controls the neutral. */
.ci-gauge-track {
    /* Geometry only; paint inline. */
    pointer-events: none;
}
/* Foreground arc — paint via cs-gauge-fill on the host side (theme color
   from th-section{N}). */
.ci-gauge-fill {
    pointer-events: auto;
    cursor: pointer;
}
/* Tick marks — host paints stroke / opacity. Lib only owns positioning. */
.ci-gauge-tick-line {
    pointer-events: none;
}
.ci-gauge-tick-label {
    /* SVG <text> — host paints fill. Default font-size mirrors gridvalue. */
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    font-size: 12px;
    font-weight: 500;
}
/* Needle — color/width inline from gaugeConfig (no theme tint per design). */
.ci-gauge-needle {
    pointer-events: none;
}
.ci-gauge-hub,
.ci-gauge-hub-inner {
    pointer-events: none;
}
/* Center-stack — value (large) + optional label below. Each wrapper is
   absolutely positioned inline by JS to mirror the SVG's meet-fit center
   (so the HTML overlay tracks the hub at any container size). Inline
   font-size scales with the viewBox-meet `scale` so the text stays
   proportional to the gauge dimensions. */
.ci-gauge-center-value {
    font-weight: 700;
    cursor: text;
    -moz-user-select: text;
         user-select: text;
    -webkit-user-select: text;
    white-space: nowrap;
    pointer-events: auto;
    line-height: 1.15;
}
.ci-gauge-center-label {
    font-weight: 400;
    cursor: text;
    -moz-user-select: text;
         user-select: text;
    -webkit-user-select: text;
    white-space: nowrap;
    pointer-events: auto;
    line-height: 1.15;
}
.ci-gauge-center-label[data-empty="true"]:empty::before {
    content: attr(data-prompt-text);
    opacity: 0.4;
}
/* Single-series legend strip — paint/spacing ONLY. Layout (flex-direction +
   alignment) is owned by the shared `.ci-chart-legend-base-{side}` +
   `.ci-chart-legend-pos-{full}` rules near the top of this file, which the
   gauge legend root stamps. Do NOT re-declare flex-direction / align-items /
   justify-content here: those rules live LATER in the file with equal
   specificity, so they would override the shared positioning and freeze the
   legend at center (legend-position dropdown then silently no-ops). */
.ci-gauge-legend {
    gap: 8px;
    padding: 8px 0;
}

/* ---------- WaffleChart (single-value percentage grid) ----------
   DIV-only grid; cells are plain <div> elements whose visible shape is
   selected by the paired `cs-waffle-cell-shape-{shape}` class — themes own
   border-radius / clip-path / transform paint, lib owns ONLY layout
   (display:grid, sizing, square-fit aspect, gap budget) + interaction state
   (pointer-events, cursor). Mirrors funnel / radar / gauge lib-paint
   separation. */
/* ============================================================
   AnimatedPieChart — single-value sprite "realistic" pie.
   Layout only (flex sizing + sprite-cell box). All paint
   (value/label colour, legend swatch) rides shared `cs-*`
   theme classes. Mirrors the waffle lib-paint separation. */
.ci-animated-pie-chart {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
/* `ci-animated-pie-main` wraps body + optional legend; the base-side class
   drives flex-direction so the legend lands above/below/left/right. */
.ci-animated-pie-main {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
}
.ci-animated-pie-main-top,
.ci-animated-pie-main-bottom {
    flex-direction: column;
}
.ci-animated-pie-main-left,
.ci-animated-pie-main-right {
    flex-direction: row;
    align-items: stretch;
}
/* Body = sprite plot (left) + value block (right), per the reference. */
.ci-animated-pie-body {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    gap: 4%;
}
/* Sprite cell — flex:1 so it absorbs the left half; the sprite inside is
   contain-scaled against this box by the component's ResizeObserver. */
.ci-animated-pie-plot {
    position: relative;
    flex: 1 1 0%;
    min-width: 0;
    min-height: 0;
    align-self: stretch;
}
/* Value block — big value over the optional description label. */
.ci-animated-pie-valueblock {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    flex: 1 1 0%;
    min-width: 0;
    gap: 8px;
}
/* Two-layer pie: the background layer (full pizza) rides 0.3 opacity so it
   reads as the faint remainder behind the bright value slice (legacy
   `.pieassetopacity`). */
.ci-animated-pie-sprite-bg,
.ci-animated-pie-chart .pieassetopacity {
    opacity: 0.3;
}
.ci-animated-pie-value {
    font-size: 44px;
    font-weight: 600;
    line-height: 1.1;
}
.ci-animated-pie-label {
    font-size: 13px;
    line-height: 1.4;
    opacity: 0.85;
}

.ci-waffle-chart {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

/* `ci-waffle-main` wraps plot + legend; `cs-waffle-main-{pos}` drives the
   flex-direction so the legend lands above/below/left/right of the grid.
   The legend element itself is rendered ONCE in JSX but slotted via the
   legendBefore branch — flex-direction alone reorders, no `order` tricks. */
.ci-waffle-main {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    /* Centre the [legend + grid] group. Both children shrink-wrap their
       content, so this is what positions them as one adjacent block; host
       theme can override justify-content/align-items to anchor differently. */
    align-items: center;
    justify-content: center;
}
.ci-waffle-main-top,
.ci-waffle-main-bottom {
    flex-direction: column;
}
.ci-waffle-main-left,
.ci-waffle-main-right {
    flex-direction: row;
}

/* Plot REGION — SHRINK-WRAPS the grid (`flex: 0 0 auto`), it does NOT fill the
   space left by the legend. That's what keeps the legend and the grid adjacent
   with no gap between them; the [legend + grid] group is positioned by
   `ci-waffle-main`'s justify-content/align-items. The fit-scale is measured
   from main−legend (see the JS), NOT from this box, so it stays loop-safe. */
.ci-waffle-plot-region {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Plot AREA — shrink-wraps the grid so the two are exactly the same size
   (no empty padding around the grid). `flex: 0 0 auto` + auto width/height
   means it takes the grid's resolved px size; the grid is already scaled to
   fit the region, so the plot-area never exceeds it. Stays `position:
   relative` for the inside-value overlay. */
.ci-waffle-plot-area {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Grid root — STATIC px width/height are stamped INLINE by the lib
   (`cols·CELL_SIZE + gaps` × the row analogue) so every cell stays a square
   and never stretches with the parent box. We must NOT override that size
   here: `flex: none` stops the plot-area flex from shrinking it, and the
   inline width/height win. The plot area centres it and lets it overflow if
   the chart box is smaller than the static grid. */
.ci-waffle-grid {
    position: relative;
    box-sizing: border-box;
    flex: none;
}

/* Bg layer + fill layer — both fill the grid via `inset:0`. Lib publishes
   no width/height — they inherit the grid's resolved size. Bg sits under,
   fill on top; z-index declared explicitly for safety against host theme
   z-stack changes. */
.ci-waffle-bg-layer,
.ci-waffle-fill-layer {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.ci-waffle-bg-layer {
    z-index: 0;
}
.ci-waffle-fill-layer {
    z-index: 1;
}

/* Cell slot — a fixed cellWidth × cellHeight rect. `left`/`top` come from the
   lib as static px (`col·(cellWidth+gap)` / `row·(cellHeight+gap)`); the
   width/height live HERE, driven by the `--cs-waffle-cell-width` /
   `--cs-waffle-cell-height` vars the lib stamps on the grid root. This is what
   keeps each cell at its authored size — percentage width/height used to
   stretch into the wrong aspect ratio when the parent box wasn't proportional. */
.ci-waffle-cell-slot,
.cs-waffle-cell-slot {
    box-sizing: border-box;
    width: var(--cs-waffle-cell-width);
    height: var(--cs-waffle-cell-height);
    pointer-events: none;
}

/* Background shape — emitted for EVERY (row, col) cell. Lib emits the
   class hooks ONLY; paint (background-color, opacity) is owned entirely by
   host theme. Per-value opacity hooks: lib stamps `data-customopacity`
   when a menu ships a non-default `emptyOpacity` — host theme rules can
   target via `.cs-waffle-bg-shape[data-customopacity="0.5"] { opacity: 0.5 }`.
   `width/height: 100%` fills the whole slot — the inter-cell gutter is the
   gap baked into the slot's left/top offset, NOT an inset on the shape.
   (width/height rather than `inset: 0` so a host rule that flips `position`
   on `cs-graphic-item` can't collapse the shape to 0.) */
.ci-waffle-bg-shape {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    pointer-events: none;
}

/* Fill shape — emitted only for cells in the filled-prefix of the fill
   order. Theme-painted via the standard `cs-graphic-item` + `th-section{N}`
   cascade the host already paints for column / bar / line / pie series
   elements. Lib ships no defensive paint — host theme owns the colour.
   `width/height: 100%` fills the whole slot (matches the bg shape exactly). */
.ci-waffle-fill-shape {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    pointer-events: none;
}

/* Cell SHAPE silhouette — applied to BOTH bg + fill children so their
   geometries match exactly. Structural only; host theme owns visual
   paint variants (clip-path for diamond/hexagon, etc.). */
.cs-waffle-shape-square {
}
.cs-waffle-shape-circle {
    border-radius: 50%;
}
.cs-waffle-shape-rounded {
    border-radius: 25%;
}
.cs-waffle-shape-diamond {
}
.cs-waffle-shape-hexagon {
}

/* Big VALUE text — placement-driven. `cs-waffle-value-pos-inside` overlays
   the value at the grid centre; `cs-waffle-value-pos-legend` floats inside
   the legend strip. Lib owns only positioning + interaction; font-size /
   colour / weight come from host theme + textFormatStyles. */
.ci-waffle-value-inside-wrap {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    z-index: 2;
}
.ci-waffle-value-inside-wrap .ci-waffle-value {
    pointer-events: auto;
}
.ci-waffle-value {
    white-space: nowrap;
    cursor: text;
    -moz-user-select: text;
         user-select: text;
    -webkit-user-select: text;
    outline: none;
    line-height: 1.05;
}

/* Single-series legend strip — paint/spacing ONLY. Layout (flex-direction +
   alignment) is owned by the shared `.ci-chart-legend-base-{side}` +
   `.ci-chart-legend-pos-{full}` rules near the top of this file (the legend
   root stamps both). Do NOT re-declare align-items / justify-content here:
   this rule lives LATER in the file with equal specificity, so it would
   override the shared positioning and freeze the legend at center (the
   legend-position dropdown then silently no-ops). */
.ci-waffle-legend {
    display: flex;
    gap: 8px;
    padding: 8px 0;
    flex-shrink: 0;
}
/* Side / top / bottom strip alignment is owned by the shared
   `.ci-chart-legend-base-{side}` + `.ci-chart-legend-pos-{full}` rules
   near the top of this file (single source of truth — pie / polar /
   gauge / waffle all consume it). Only paint here: side-strip horizontal
   gutter mirrors the legacy 8px padding. */
.ci-waffle-legend-base-left,
.ci-waffle-legend-base-right {
    padding: 0 8px;
}
/* Waffle's "legend" strip is the HERO value, not a label list — so the
   shared `.ci-chart-legend-vertical { max-width: 30% }` cap (meant to keep a
   long label list from stretching across the plot) is far too tight here: a
   large data-label value (e.g. 200px "2180%") can't fit 30% and gets clipped
   mid-character by `.ci-chart-legend-base-{left|right} { overflow: hidden }`.
   Raise the cap and drop the clip for the waffle strip so the value sizes to
   its own width. The grid auto-shrinks to fill the rest because the JS
   fit-scale computes availW = mainW − measured legend width (loop-safe: the
   legend's width is content/cap-driven, never grid-driven). The 65% ceiling
   still guarantees the grid keeps ≥ 35% of the width. Specificity 0,2,0
   intentionally beats the shared 0,1,0 rules. */
.cs-waffle-legend.ci-chart-legend-vertical {
    max-width: 65%;
}
.cs-waffle-legend.ci-chart-legend-base-left,
.cs-waffle-legend.ci-chart-legend-base-right {
    overflow: visible;
}
.ci-waffle-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    min-width: 0;
}
.ci-waffle-legend-label {
    white-space: pre-wrap;
    word-break: break-word;
    outline: none;
}

/* ============================================================
   ComparisonColumn — two-series comparison column chart.
   Structural / layout-only rules; host theme owns paint via
   the paired cs-* siblings + th-section{N} tint cascade +
   .cs-graphic-item (which paints .ci-comparison-fill).
   ============================================================ */

.ci-comparison-chart-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.ci-comparison-body {
    flex: 1 1 0;
    min-height: 0;
}

.ci-comparison-plot {
    height: 100%;
}

.ci-comparison-cell {
    cursor: pointer;
    overflow: visible;
}

.ci-comparison-cell-inner {
    overflow: visible;
}

.ci-comparison-label-slot {
    flex-shrink: 0;
    overflow: visible;
}

.ci-comparison-label {
    outline: none;
    word-break: break-word;
    line-height: 1.25;
    min-height: 1em;
    /* Default for inside placement; side cell-side classes override. */
    text-align: center;
}

.ci-comparison-bar-slot {
    overflow: visible;
}

.ci-comparison-bar {
    box-sizing: border-box;
}

/* Outline frame — lib emits the class hook; host theme owns the border
   paint (border-color, border-width, border-style) via cs-comparison-frame. */
.ci-comparison-frame {
    box-sizing: border-box;
}

/* Colored fill rises from the bar bottom up to value%. Lib owns the
   geometry; .cs-graphic-item (host theme) paints the background. */
.ci-comparison-fill {
    box-sizing: border-box;
    min-height: 1px;
}

/* Dashed level finder — visible only in frame mode + outside-value. Lib
   emits the hook; host theme owns stroke / stroke-width / dasharray. */
.ci-comparison-level-finder {
    pointer-events: none;
}

/* Connector — short dashed leader from the bar's value tip to the side
   slot content. Host theme owns the stroke / stroke-width / dasharray on
   the inner line via the paired cs-comparison-connector-line class. */
.ci-comparison-connector {
    pointer-events: none;
}

/* Value wrapper override — comparison absolutely positions the value
   inside the bar / above the fill, so the shared .ci-value-text-wrap
   width:100% rule already lines up with the bar's left/right anchors.
   Per memory feedback_absolute_value_label_width, we don't need
   fit-content here because the wrap spans the bar's full width by
   design (centered with justify-content). */
/* Value / label alignment is class-driven (not inline) so each side anchors
   toward the bar. Inside placement stays centered; a side-slot value/label in
   the LEFT cell right-aligns toward the bar, in the RIGHT cell left-aligns.
   The value wrap is a flexbox (justify-content); the label is a text block
   (text-align). */
.ci-comparison-value-wrap {
    z-index: 1;
    justify-content: center;
}

.cs-comparison-value-place-side.cs-comparison-cell-left {
    justify-content: flex-end;
}

.cs-comparison-value-place-side.cs-comparison-cell-right {
    justify-content: flex-start;
}

.cs-comparison-label-place-side.cs-comparison-cell-left {
    text-align: right;
}

.cs-comparison-label-place-side.cs-comparison-cell-right {
    text-align: left;
}

/* ============================================================
   SizeScaleComparisonChart — size-scale family
   ------------------------------------------------------------
   A row of N raster images sized by value. Lib owns ALL geometry
   (per-item square px, baseline alignment, value/label placement);
   the cs-* classes are theme paint hooks (text color, image
   shadow). NO cs-graphic-item on the image box — host's
   `.cs-column .cs-graphic-item` rule would paint a rectangle
   behind the image (anti-pattern #13); this family uses the
   neutral cs-sizescale orientation class instead.
   ============================================================ */
.ci-szc-chart-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.ci-szc-body {
    flex: 1 1 0;
    min-height: 0;
}

.ci-szc-plot {
    height: 100%;
    overflow: visible;
}

.ci-szc-item {
    overflow: visible;
}

/* Square image box — geometry inline (width/height/transform). The
   image bottom-aligns on the common baseline via the flex-end
   graphic-area. Theme may add a drop-shadow via cs-szc-graphic. */
.ci-szc-graphic {
    box-sizing: border-box;
}

.ci-szc-image {
    -webkit-user-drag: none;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
}

.ci-szc-label,
.ci-szc-secondary {
    outline: none;
    word-break: break-word;
    line-height: 1.25;
    min-height: 1em;
}

/* Value wrapper — flows in normal layout (top/bottom) or overlays the
   image center; the shared .ci-value-text-wrap absolute default is
   overridden inline (position:static). */
.ci-szc-value-wrap {
    z-index: 1;
}

/* ============================================================
   SizeScaleShapeComparisonChart — CSS shapes sized by value
   ------------------------------------------------------------
   Sibling of the size-scale image chart, but the primitive is a
   CSS-drawn shape (circle / rectangle / polygon[hexagon]) with an
   optional max-sized neutral backdrop shape. Lib owns geometry
   (width / height / clip-path / transform inline); cs-* are theme
   paint hooks. Uses the neutral cs-shapescale orientation class —
   NO cs-graphic-item (anti-pattern #13). Shape FILL rides
   th-section{N} via the host theme CSS.
   ============================================================ */
.ci-sszc-chart-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.ci-sszc-body {
    flex: 1 1 0;
    min-height: 0;
}

.ci-sszc-plot {
    height: 100%;
    overflow: visible;
}

.ci-sszc-item {
    overflow: visible;
}

.ci-sszc-graphic-box,
.ci-sszc-shape,
.ci-sszc-bg-shape {
    box-sizing: border-box;
}

.ci-sszc-label,
.ci-sszc-secondary {
    outline: none;
    word-break: break-word;
    line-height: 1.25;
    min-height: 1em;
}

.ci-sszc-value-wrap {
    z-index: 1;
}

/* ============================================================
   CandlestickChart — financial family (OHLC)
   ------------------------------------------------------------
   Lib owns geometry + structural CSS. Theme paint is opt-in:
   defensive defaults below ensure candles render in unthemed
   contexts (storybook, headless render, host CSS not loaded).
   Host theme is expected to override via cs-candle-body-up /
   cs-candle-body-down / cs-candle-wick-* with brand colors.
   The .cs-candle-body div carries .cs-graphic-item, but the
   shared `.series .cs-graphic-item { background-color: var(--g-c1) }`
   cascade would paint EVERY candle the same theme color regardless
   of direction. The direction-specific rules below override that so
   bullish/bearish bodies stay distinguishable. The component sets
   inline backgroundColor when the user picks a non-"auto" up/down
   color, which beats both.
   ============================================================ */
.ci-candle {
    pointer-events: auto;
}

.ci-react-chart-container .ci-candle .cs-candle-body.cs-candle-body-up {
    background-color: #26a69a;
    border-color: #26a69a;
}

.ci-react-chart-container .ci-candle .cs-candle-body.cs-candle-body-down {
    background-color: #ef5350;
    border-color: #ef5350;
}

/* Wick — "auto" wickColor means inherit from body direction. Bodies are
   filled rects; wicks are thin solid lines. Set explicit fallbacks per
   direction. Inline backgroundColor on the wick div overrides when user
   picks a non-"auto" wickColor. */
.ci-react-chart-container .ci-candle .cs-candle-wick.cs-candle-wick-up {
    background-color: #26a69a;
}

.ci-react-chart-container .ci-candle .cs-candle-wick.cs-candle-wick-down {
    background-color: #ef5350;
}

/* Legend swatch — Bullish/Bearish chips mirror candle colors so the
   legend stays consistent without host theme overrides. */
.ci-react-chart-container .ci-legend-shape-fill.cs-candle-body-up {
    background-color: #26a69a;
}

.ci-react-chart-container .ci-legend-shape-fill.cs-candle-body-down {
    background-color: #ef5350;
}

/* Value labels — open/close/high/low. fit-content + nowrap is set
   inline (matches dumbbell's absolute-positioned value-label pattern)
   per memory feedback_absolute_value_label_width. */
.ci-candle-label-high,
.ci-candle-label-low,
.ci-candle-label-open,
.ci-candle-label-close {
    pointer-events: auto;
}

/* ============================================================
   BoxPlotChart — distribution family (box-and-whisker)
   ------------------------------------------------------------
   Structural / position only. Theme paint (cs-box-* colours,
   th-section{N} tint) lives in core-chart-styles.css per the
   3-file CSS contract.
   ============================================================ */
.ci-boxplot-layer {
    pointer-events: none;
}

.ci-box {
    pointer-events: none;
}

.ci-box-rect {
    box-sizing: border-box;
    pointer-events: auto;
    cursor: pointer;
}

.ci-box-whisker,
.ci-box-cap,
.ci-box-median {
    pointer-events: none;
}

.ci-box-outlier {
    box-sizing: border-box;
    pointer-events: auto;
    cursor: pointer;
}

.ci-box-value-label {
    pointer-events: auto;
}

/* ============================================================
   GanttChart — timeline family (project schedule)
   ------------------------------------------------------------
   Structural / position / pointer-events only. Theme paint
   (cs-gantt-* colours, th-section{N} tint) lives in
   core-chart-styles.css per the 3-file CSS contract.
   ============================================================ */
/* Scroll viewport — when the schedule outgrows the slide (many tasks or a
   long timeline) the grid overflows here instead of crushing rows/ticks.
   The grid's inline width/height vs. minWidth/minHeight:100% decide when
   the scrollbars actually appear. */
.ci-gantt-scroll {
    overflow: auto;
}

.ci-gantt-timescale,
.ci-gantt-label-col,
.ci-gantt-lanes {
    overflow: hidden;
}

/* Tick / phase / non-bar layers never intercept pointer events. */
.ci-gantt-gridlines,
.ci-gantt-bands,
.ci-gantt-today,
.ci-gantt-arrows-layer,
.ci-gantt-bar-track {
    pointer-events: none;
}

.ci-gantt-tick-label {
    pointer-events: auto;
}

/* Editable task name — text caret, no focus ring. */
.ci-gantt-task-label {
    cursor: text;
    outline: none;
}

.ci-gantt-phase-name {
    pointer-events: auto;
}

/* Duration bar — the only clickable schedule node. */
.ci-gantt-bar {
    box-sizing: border-box;
    pointer-events: auto;
    cursor: pointer;
    overflow: hidden;
}

.ci-gantt-bar-progress {
    pointer-events: none;
}

/* Unscheduled task marker — a row whose start/end did not parse. Stays
   selectable so the task floater still opens; paint is host-side
   (cs-gantt-unscheduled) with an italic/dim inline fallback. */
.ci-gantt-unscheduled {
    pointer-events: auto;
    cursor: pointer;
}

/* Milestone diamond — outer is the hit-target, inner is the rotated shape. */
.ci-gantt-milestone {
    pointer-events: auto;
    cursor: pointer;
}

.ci-gantt-milestone-shape {
    box-sizing: border-box;
}

.ci-gantt-bar-label {
    pointer-events: auto;
}

.ci-gantt-arrow-head {
    width: 0;
    height: 0;
}

/* --- Icon-fill bar (barSimpleIconRepeatFill) — LAYOUT ONLY -------------
   All color / fill / theming for this chart family is owned by
   `design_assets/commonfiles/css/core-chart-styles.css` under the `.cs-row`
   family — see `seriesnodeelements .cs-line-area` at line 2663 and the
   `cs-label-text` / `cs-value-text` rules.

   Layout guardrail: host theme CSS attaches
   `.cs-graphic-item { background-color: ... }` / `.cs-row .cs-graphic-item
   { border-radius: ... }` which would paint a solid rectangle BEHIND the
   icon row. The bar div omits `cs-graphic-item`; this defensive transparent
   override catches any host-side stylesheet that targets `.ci-bar` more
   aggressively. No fill / color rules in this lib file — those live in
   `core-chart-styles.css`. */
.ci-react-chart-container .ci-icon-repeat-bar {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.ci-react-chart-container .ci-icon-repeat-bar > svg {
    overflow: visible;
}

/* --- Icon-fill compare (fillcompareChart) ---------------------------------
   Variant 2 of the icon-fill family. Faithful port of legacy
   SimpleFillCompareSeriesItem.doAddTopGraphicsContainer (js-chart-new.js:
   71252). Uses legacy class names (.basegraphic, .chartgraphic,
   .basetopgraphic, .seriesitemcond, .fillLevelFinder, #levelfinder,
   .layoutContainer, .alterstylepos, .alterstylenoraml, .minheightvalue)
   so host theme CSS in chartnew.css applies unchanged.

   Defensive bg-transparent on the icon column — host theme `.cs-graphic-
   item` is intentionally omitted on this element, but we add a belt-
   suspenders override here for any host stylesheet that targets the
   class more aggressively. */
.ci-react-chart-container .ci-iconfill-graphic {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.ci-react-chart-container .ci-iconfill-graphic > svg {
    overflow: visible;
}

/* Colour rules live in the host design CSS
   (`design_assets/commonfiles/css/core-chart-styles.css`, `cs-iconfill`
   block): foreground `<use>` paints with `--th-section-primary`,
   background `<use>` with `--th-slide-contrast`, fallback placeholder
   neutral, divider stroke per `cs-iconfill-divider-color-{item|theme}`,
   value/label text via the `cs-{value,label}-text.cs-{value,label}-pos-*`
   pattern. Do not duplicate those rules here. */

/* layoutContainer + content — pointer events wiring. Wrappers pass
   through, individual text spans (.value, .label) re-enable. */
.ci-react-chart-container .ci-iconfill-layout {
    pointer-events: none;
}
.ci-react-chart-container .ci-iconfill-layout .value,
.ci-react-chart-container .ci-iconfill-layout .label,
.ci-react-chart-container .ci-iconfill-value-inside {
    pointer-events: auto;
}

.ci-react-chart-container .ci-iconfill-layout .valuetext,
.ci-react-chart-container .ci-iconfill-layout .labeltext {
    cursor: text;
    outline: none;
}

/* Side value+label alignment — class-driven, mirroring ComparisonColumn's
   cs-comparison-cell-{left|right} rules. The outer row spans the text band;
   `justify-content` pushes the value+label stack toward the divider line on
   the icon side, and `text-align` aligns wrapped/multi-line text to match.
   Left series → flex-end (right-aligned); right series → flex-start (left). */
.ci-react-chart-container .cs-iconfill-callout-left {
    justify-content: flex-end;
}
.ci-react-chart-container .cs-iconfill-callout-right {
    justify-content: flex-start;
}
.ci-react-chart-container .cs-iconfill-callout-left .cs-iconfill-value,
.ci-react-chart-container .cs-iconfill-callout-left .cs-iconfill-label {
    text-align: right;
    justify-content: flex-end;
}
.ci-react-chart-container .cs-iconfill-callout-right .cs-iconfill-value,
.ci-react-chart-container .cs-iconfill-callout-right .cs-iconfill-label {
    text-align: left;
}

/* ============================================================
 * SingleIconFillChart (singleIconFill) — single-value icon-fill
 * with an optional 12-position legend. Structure/layout only; the
 * icon + callout reuse the shared `ci-iconfill-*` rules above, and
 * the legend rides the shared `ci-chart-legend-*` primitives near
 * the top of this file. `th-section{N}` carries the colour.
 * ============================================================ */

/* Main wrapper holds [legend + plot row]; base-side class drives the
   flex-direction so the legend lands above/below/left/right of the plot.
   The plot row fills the leftover space (flex:1) so IconFillCompareElement
   can measure the full region for icon sizing; the legend shrink-wraps. */
.ci-react-chart-container .ci-single-icon-fill-main {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    align-items: stretch;
    justify-content: center;
}
.ci-react-chart-container .ci-single-icon-fill-main-top,
.ci-react-chart-container .ci-single-icon-fill-main-bottom {
    flex-direction: column;
}
.ci-react-chart-container .ci-single-icon-fill-main-left,
.ci-react-chart-container .ci-single-icon-fill-main-right {
    flex-direction: row;
}
.ci-react-chart-container .ci-single-icon-fill-row {
    flex: 1 1 auto;
}

/* Single-entry legend — swatch + (label over optional value) stacked. The
   `ci-chart-legend-base-*` / `ci-chart-legend-pos-*` shared rules own the
   strip's sizing + alignment; these only set the item's internal flow. */
.ci-react-chart-container .ci-single-icon-fill-legend-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
}
.ci-react-chart-container .ci-single-icon-fill-legend-text {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}
.ci-react-chart-container .ci-single-icon-fill-legend-label {
    pointer-events: auto;
    cursor: text;
    outline: none;
}

/* Inside overlay group — value and/or label centered on the icon
   (single-icon "inside" position). Layout is inline; this only owns the
   stacking flow + the inside label's wrapping. */
.ci-react-chart-container .ci-iconfill-inside-group {
    max-width: 80%;
}
.ci-react-chart-container .ci-iconfill-label-inside {
    white-space: pre-wrap;
    max-width: 100%;
}

/* ============================================================
 * SimpleIconFillBarChart (barSimpleIconFill) — horizontal
 * one-row-per-category icon-fill chart. Layout/structure here;
 * the per-row `th-section{N}` cascade carries the colour.
 * ============================================================ */

/* Icon strip — defensive transparent bg (host theme `.cs-graphic-item`
   is intentionally NOT on this element; belt-and-suspenders override). */
.ci-react-chart-container .ci-iconfill-bar-graphic {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.ci-react-chart-container .ci-iconfill-bar-graphic > svg {
    overflow: visible;
}

/* Foreground icons — themed fill. The icon symbols carry no `fill` of
   their own, so they inherit `fill` from the <use>. Colour rides the
   `--th-section-primary` cascade set by the row's `th-section{N}` class;
   the slate fallback keeps test renders visible when the theme var is
   undefined. */
.ci-react-chart-container .ci-iconfill-bar-fg-use {
    fill: rgba(var(--th-section-primary, 71, 85, 105), 1);
    stroke: rgba(var(--th-section-primary, 71, 85, 105), 1);
}

/* Background (unfilled) icons — same themed colour; the low opacity is
   applied inline via `fill-opacity` / `stroke-opacity` so it reads as the
   "empty" portion of the row. */
.ci-react-chart-container .ci-iconfill-bar-bg-use {
    fill: rgba(var(--th-section-primary, 71, 85, 105), 1);
    stroke: rgba(var(--th-section-primary, 71, 85, 105), 1);
}

/* Value callout — themed per-row (matches the filled icons). */
.ci-react-chart-container .cs-iconfill-bar-value {
    color: rgba(var(--th-section-primary, 71, 85, 105), 1);
}

/* Text bands re-enable pointer events for inline editing. */
.ci-react-chart-container .ci-iconfill-bar-value,
.ci-react-chart-container .ci-iconfill-bar-label {
    pointer-events: auto;
    cursor: text;
    outline: none;
}

/* ============================================================
 * Scatter — position / layout only. Color paints live in
 * design_assets/commonfiles/css/core-chart-styles.css under
 * the `cs-scatter-*` selectors.
 * ============================================================ */

.ci-react-chart-container .ci-scatter-plot-area {
    /* plot area inherits flex grow from parent */
}

.ci-react-chart-container .ci-scatter-plot-inner {
    /* anchored inset is set inline (top/bottom/left/right) so reserves
       can track measured Y-axis line width + value-label heights */
}

.ci-react-chart-container .ci-scatter-points-layer {
    pointer-events: none; /* wrapper passes through; point divs re-enable */
}

.ci-react-chart-container .ci-scatter-point-slot {
    /* slot is a full-bleed positioning context so the absolute point +
       its labels share the same coordinate basis (left/top in %) */
    pointer-events: none;
}

.ci-react-chart-container .ci-scatter-point {
    /* size + color come from host theme CSS (cs-scatter-point). Lib
       owns the absolute positioning math only. */
    pointer-events: auto;
    cursor: pointer;
    box-sizing: border-box;
}

.ci-react-chart-container .ci-scatter-point-label,
.ci-react-chart-container .ci-scatter-value-label {
    /* label / value-label position comes from inline style (left/top%
       + transform). Text color / size from host theme (cs-*). */
    pointer-events: auto;
}

.ci-react-chart-container .ci-scatter-xaxis {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

/* The tick row + labels row use the shared ci-axis-x-tick-row / ci-axis-x-labels
   pattern from the column/bar family (see ReactChart.css L302+). Tick mark
   styling comes from host theme cs-label-tickmark (vertical 1×10 dash). */

.ci-react-chart-container .ci-scatter-xaxis-title {
    text-align: center;
    margin-top: 6px;
}

.ci-react-chart-container .ci-grid-vline {
    /* vertical grid line — paired with horizontal lines from GridLayer.
       Theme paints stroke via cs-grid-line / cs-grid-vline. */
    pointer-events: none;
}

/* ============================================================
 * Bubble — position / layout only. Color paints live in
 * design_assets/commonfiles/css/core-chart-styles.css under
 * the `cs-bubble-*` selectors. Mirrors the scatter block above —
 * bubble is a scatter variant with per-point Z-driven radius.
 * ci-bubble-plot-area / ci-bubble-plot-inner intentionally have no
 * rules here — flex grow + inline insets handle their geometry.
 * ============================================================ */

.ci-react-chart-container .ci-bubble-points-layer {
    pointer-events: none; /* wrapper passes through; bubble divs re-enable */
}

.ci-react-chart-container .ci-bubble-point-slot {
    pointer-events: none;
}

.ci-react-chart-container .ci-bubble-point {
    /* Lib owns GEOMETRY only — width/height (z-driven) + position are inline.
       ALL paint (fill, opacity, border) comes from the host theme class
       cs-bubble-point + th-section{N}; nothing visual is set inline. The
       circle shape lives here on the lib class (mirrors cs-scatter-point's
       border-radius) so removing the inline borderRadius can't square the
       bubble. */
    pointer-events: auto;
    cursor: pointer;
    box-sizing: border-box;
}

.ci-react-chart-container .ci-bubble-point-label,
.ci-react-chart-container .ci-bubble-value-label {
    pointer-events: auto;
}

.ci-react-chart-container .ci-bubble-xaxis {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.ci-react-chart-container .ci-bubble-xaxis-title {
    text-align: center;
    margin-top: 6px;
}

/* ============================================================================
   Bump Chart — rank-over-time line variant (BumpChart.jsx)
   Structure / layout only. Colours, fonts and theme paint live in the host
   theme sheet core-chart-styles.css (cs-bump-* rules).
   ============================================================================ */

/* ---- Rank Y-axis (absolute left strip inside ce-plot-area) ----
   A flex row: rotated editable title (reuses the shared ci-axis-title-y /
   cs-y-axis-title classes — rotation is inherited from those) + #N column.
   The whole strip is measured (offsetWidth) to reserve the plot inset. */
.ci-bump-axis-y {
    box-sizing: border-box;
}

.ci-bump-axis-y-col {
    box-sizing: border-box;
}

/* In-flow hidden strut — gives the absolutely-positioned #N column its width. */
.ci-bump-axis-y-strut {
    visibility: hidden;
    pointer-events: none;
}

.ci-bump-axis-y-strut > * {
    display: block;
    white-space: nowrap;
}

.ci-bump-rank-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
}

.ci-bump-rank-label {
    white-space: nowrap;
    pointer-events: none;
}

/* ---- Plot ---- */
.ci-bump-paths-svg {
    overflow: visible;
    pointer-events: none;
}

.ci-bump-line {
    fill: none;
}

.ci-bump-points-layer,
.ci-bump-value-labels-layer {
    pointer-events: none;
}

.ci-bump-point {
    box-sizing: border-box;
}

.ci-bump-axis-line {
    pointer-events: none;
}

/* ---- Right-side series-name panel ---- */
.ci-bump-series-label-panel {
    box-sizing: border-box;
    pointer-events: none;
}

.ci-bump-series-label {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-left: 10px;
    pointer-events: none;
}

/* Wraps within the (capped) panel so a long name never leaves the chart —
   no max-width / ellipsis, the full name always renders. The panel width
   itself is measured live (see BumpChart.measurePanel). */
.ci-bump-series-label-text {
    flex: 1 1 auto;
    min-width: 0;
    /* `pre-wrap` (not `normal`) so user-entered Enter breaks survive
       blur/save round-trip. Width still caps to panel; long words still
       break via overflow-wrap. */
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    outline: none;
    cursor: text;
    pointer-events: all;
}

/* ---- Category (X) axis ---- */
.ci-bump-axis-x,
.ci-bump-axis-x-labels,
.ci-bump-axis-x-inner {
    box-sizing: border-box;
}

/* In-flow, invisible — gives the absolutely-positioned year labels a row
   height to live in. Carries the label font so the height matches. */
.ci-bump-axis-x-strut {
    visibility: hidden;
    white-space: nowrap;
    padding: 5px 0;
}

/* Year labels must never wrap character-by-character — they sit at exact
   point x%; a single line that slightly overhangs the edge is correct. */
.ci-bump-axis-x-inner .ci-label-text {
    white-space: nowrap;
    width: auto;
    word-break: normal;
    overflow: visible;
}

.ci-bump-axis-x-title-wrapper {
    box-sizing: border-box;
    text-align: center;
}

/* The category-axis title wraps within the plot span — never overflows. */
.ci-bump-axis-x-title {
    white-space: normal;
    overflow-wrap: anywhere;
    width: 100%;
}

/* ===== Pictorial chart (PictorialChart — "Candle Burn") =====
   Categorical sprite-pictogram row. Each category renders one frame of a
   CreateJS atlas (frame index = value). Layout is inline (flex row + measured
   contain-scale on the sprite); these rules own structure only — the sprite is
   painted by the atlas image, so paint lives on the cs-* pairs in host theme
   CSS (cs-pictorial-*). */
.ci-pictorial-layer {
    box-sizing: border-box;
}
.ci-pictorial-series {
    box-sizing: border-box;
}
.ci-pictorial-sprite-wrap {
    cursor: pointer;
}
.ci-pictorial-sprite {
    pointer-events: none;
}
.ci-pictorial-value {
    white-space: nowrap;
}

/* ===== Bar Pictorial chart (BarPictorialChart) =====
   Horizontal twin of the pictorial: categories stack vertically (one row each),
   category labels in a left column, value-axis title along the bottom, sprites
   anchored to the left baseline and growing right. Structure only — paint lives
   on the cs-bar-pictorial-* pairs in host theme CSS. */
.ci-bar-pictorial-layer {
    box-sizing: border-box;
}
.ci-bar-pictorial-series {
    box-sizing: border-box;
}
.ci-bar-pictorial-sprite-wrap {
    cursor: pointer;
}
.ci-bar-pictorial-sprite {
    pointer-events: none;
}
.ci-bar-pictorial-value {
    white-space: nowrap;
}
.ci-bar-pictorial-label-col {
    box-sizing: border-box;
}
.ci-bar-pictorial-value-axis {
    box-sizing: border-box;
}

/* ===== Coin-stack column chart (CoinStackColumnChart) =====
   Column variant whose bars are piles of raster coin <img>s (count encodes
   value — legacy charts/coinStackBar.js math). Structure only; the coins are
   painted by the PNG itself. The graphic + holder boxes must stay transparent —
   they are canvas/contract elements for the host's present-mode rebuild
   (MoodsUtil.createCoinChartAnimation), never theme-painted rects. */
.ci-coin-layer {
    box-sizing: border-box;
}
.ci-coin-anchor {
    box-sizing: border-box;
}
.ci-coin-graphic {
    background: transparent;
    cursor: pointer;
}
.ci-coin-graphic .CoinStackBar {
    background: transparent;
    pointer-events: none;
}
.ci-coin-graphic img {
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-user-drag: none;
}

/* ===== FlowChart (category "flow") — node-graph editor ===== *
 * ci-* = structure/layout (lib owns); cs-* = theme paint (host owns).
 * Colours fall back to a sensible default here so the chart is visible in
 * the dev harness where host theme vars aren't loaded. */
.ci-flow-chart {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
         user-select: none;
}

/* palette / style toolbar */
/* Present-mode renders a static DOM clone of the editor canvas. Hide the
   editor-only chrome (palette toolbar + connection ports) so the presented
   flowchart shows only shapes + connectors, never the editing UI. */
.presentViewClass .ci-flow-toolbar,
.presentViewClass .ci-flow-port {
    display: none !important;
}

.ci-flow-toolbar {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 5px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
    /* Unobtrusive: nearly transparent until the chart is hovered / a control is
       focused, so the editing palette doesn't sit over the diagram permanently. */
    opacity: 0.12;
    transition: opacity 0.15s ease;
    max-width: -moz-max-content;
    max-width: max-content;
}
.ci-flow-chart:hover .ci-flow-toolbar,
.ci-flow-toolbar:hover,
.ci-flow-toolbar:focus-within {
    opacity: 1;
}
.ci-flow-add {
    width: 26px;
    height: 22px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.ci-flow-add:hover { background: #eef2ff; }
.ci-flow-add-glyph {
    display: inline-block;
    width: 14px;
    height: 11px;
    background: rgba(var(--th-slide-contrast, 17, 24, 39), 0.65);
}
.cs-flow-glyph-process { border-radius: 2px; }
.cs-flow-glyph-start-end { border-radius: 6px; }
.cs-flow-glyph-circle { border-radius: 50%; width: 11px; }
.cs-flow-glyph-decision { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.cs-flow-glyph-input-output { clip-path: polygon(22% 0, 100% 0, 78% 100%, 0 100%); }
.ci-flow-toolbar-sep {
    width: 1px;
    height: 18px;
    background: rgba(0, 0, 0, 0.12);
    margin: 0 2px;
}
.ci-flow-shape-select,
.ci-flow-conn-select {
    height: 22px;
    font-size: 11px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 5px;
    background: #fff;
}
.ci-flow-delete {
    width: 24px;
    height: 22px;
    border: 1px solid rgba(220, 38, 38, 0.35);
    border-radius: 5px;
    background: #fff;
    color: #dc2626;
    cursor: pointer;
    padding: 0;
}
.ci-flow-delete:hover { background: #fef2f2; }

/* nodes — theme fill: th-section{tint} on the node publishes --th-section-primary
   which cs-graphic-item consumes (same recipe as bar/column/pie). Fallback keeps
   it visible when a per-theme stylesheet isn't loaded. Canonical rule also lives
   in core-chart-styles.css (higher specificity, wins in the host). */
.ci-flow-node {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(var(--th-section-primary, 79, 124, 255), 1);
    /* text sits ON the section-primary fill → use its contrast pair (NOT #fff,
       which vanishes on light themes where section-primary is a pale colour). */
    color: rgba(var(--th-section-contrast, 255, 255, 255), 1);
    border: none;
    overflow: hidden;
    transition: box-shadow 0.12s ease;
}
.cs-flow-node-decision,
.cs-flow-node-input-output { border: none; }
.cs-flow-node-selected {
    box-shadow: 0 0 0 2px #2563eb, 0 2px 8px rgba(0, 0, 0, 0.25);
}
.ci-flow-node-title {
    width: 100%;
    text-align: center;
    font-size: 13px;
    line-height: 1.2;
    padding: 2px 6px;
    outline: none;
    color: inherit;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

/* connection ports — small, subtle dots centered on each side midpoint; hidden
   until the node is hovered/selected. Grab area is larger than the visible dot
   via a transparent padding ring (box-shadow-free) for easier connector starts. */
.ci-flow-port {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid rgba(37, 99, 235, 0.9);
    box-sizing: border-box;
    opacity: 0;
    cursor: crosshair;
    transition: opacity 0.12s ease, transform 0.12s ease;
    z-index: 4;
}
.ci-flow-node:hover .ci-flow-port,
.cs-flow-node-selected .ci-flow-port { opacity: 1; }
.ci-flow-port:hover { transform: scale(1.25); }
.cs-flow-port-top { top: 0; left: 50%; transform: translate(-50%, -50%); }
.cs-flow-port-bottom { bottom: 0; left: 50%; transform: translate(-50%, 50%); }
.cs-flow-port-left { left: 0; top: 50%; transform: translate(-50%, -50%); }
.cs-flow-port-right { right: 0; top: 50%; transform: translate(50%, -50%); }
/* keep the hover-scale transform-origin correct per side */
.ci-flow-port.cs-flow-port-top:hover { transform: translate(-50%, -50%) scale(1.25); }
.ci-flow-port.cs-flow-port-bottom:hover { transform: translate(-50%, 50%) scale(1.25); }
.ci-flow-port.cs-flow-port-left:hover { transform: translate(-50%, -50%) scale(1.25); }
.ci-flow-port.cs-flow-port-right:hover { transform: translate(50%, -50%) scale(1.25); }

/* connectors */
.cs-flow-connector-line {
    stroke: rgba(var(--th-slide-contrast, 17, 24, 39), 0.75);
    stroke-width: 2;
}
.cs-flow-connector-selected .cs-flow-connector-line {
    stroke: #2563eb;
    stroke-width: 3;
}
.cs-flow-arrowhead {
    fill: rgba(var(--th-slide-contrast, 17, 24, 39), 0.75);
}
.cs-flow-connector-preview {
    stroke: #2563eb;
    stroke-width: 2;
    stroke-dasharray: 5 4;
}
/* connector label: hugs its own text (width:max-content) so the flex wrapper
   can centre it exactly on the line midpoint — a fixed-width box drifted the
   pill off-centre. Subtle theme-tinted plate keeps the text legible where it
   crosses the line. */
.ci-flow-conn-label {
    display: inline-block;
    width: -moz-max-content;
    width: max-content;
    max-width: 132px;
    font-size: 11px;
    line-height: 1.3;
    text-align: center;
    white-space: nowrap;
    background: rgba(var(--th-slide-primary, 255, 255, 255), 0.9);
    border-radius: 3px;
    padding: 0 4px;
    outline: none;
    color: rgba(var(--th-slide-contrast, 17, 24, 39), 0.95);
}
/* empty selected-connector label shows a faint prompt until the user types */
.ci-flow-conn-label:empty::before {
    content: "Text";
    opacity: 0.45;
}

/* ---- High value break ----
   The zigzag "cut" across the outsized bar when the value axis is broken
   (engine/HighValueBreak.js). Geometry — position, teeth, band thickness — is
   owned by HighValueBreakMarker.jsx; this block owns only paint.

   FILL ONLY — no stroke. The filled zigzag band alone IS the tear: painted in the
   SLIDE background (`--th-slide-primary`, the same var the pie-slice separator
   strokes use) it reads as the bar being cut open. An earlier version also stroked
   the two torn edges in the section colour; that just drew a dark border which
   fought the bar's own colour, so it's gone. The fallback keeps the marker visible
   in test renders where the theme var is undefined. */
.ci-react-chart-container .ci-high-value-break-notch {
    fill: rgba(var(--th-slide-primary, 255, 255, 255), 1);
}

/* OrderPPTScreenNew — only keyframes that can't be expressed as Tailwind
   utilities. All other styling (layout, colors, spacing, responsive
   behavior) lives inline as Tailwind classes on the JSX. */

/* Modal scale-pop on mount (ported from .nudge-pop in export-ppt-pricing.html). */
@keyframes pn-ex-nudge-pop {
    0%   { transform: scale(0.92); opacity: 0; }
    100% { transform: scale(1);    opacity: 1; }
}

/* Logo ticker: right-to-left infinite marquee. The track holds two copies
   of the logos so a -50% translate produces a seamless loop. */
@keyframes pn-ex-ticker-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Nudge chip — bobbing pill below Pro Buy CTA when discount is active. */
@keyframes pn-ex-pill-bob {
    0%, 100% { transform: translate(-50%, 0); }
    50%      { transform: translate(-50%, -3px); }
}
@keyframes pn-ex-pill-glow {
    0%   { box-shadow: 0 4px 10px rgba(0,0,0,0.18), 0 0 0 0   rgba(0, 85, 237, 0.55); }
    70%  { box-shadow: 0 4px 10px rgba(0,0,0,0.18), 0 0 0 9px rgba(255,85,0,0); }
    100% { box-shadow: 0 4px 10px rgba(0,0,0,0.18), 0 0 0 0   rgba(255,85,0,0); }
}

/* The single-line wrappers below let Tailwind's `animate-[name_dur_easing]`
   arbitrary syntax stay in the JSX while still binding to these keyframes
   (Tailwind's JIT reads the animation property; the keyframe itself must
   be defined in a stylesheet — there's no JIT for @keyframes). */
.pn-ex-modal-pop      { animation: pn-ex-nudge-pop 0.45s cubic-bezier(0.34, 1.35, 0.64, 1); }
.pn-ex-ticker-scroll  { animation: pn-ex-ticker-scroll 40s linear infinite; }
.pn-ex-nudge-pulse    { animation: pn-ex-pill-bob 2.6s ease-in-out infinite, pn-ex-pill-glow 2.2s ease-in-out infinite; }

/* Mask gradient for the logo ticker — fades the marquee at the left/right
   edges so logos enter/exit smoothly. Tailwind has mask-image as an
   arbitrary value but the gradient stops are easier to maintain here. */
.pn-ex-ticker-mask {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
            mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

/*
 * FastEditorLoader scoped styles.
 *
 * The registered @property drives the conic-gradient streak angle; this and the
 * mask-composite ring/glow pseudo-elements have no Tailwind utility equivalent,
 * so they — plus the multi-curve panel transition and the webkit scrollbar —
 * live here. The pulse + panel-in keyframes live in pai.tailwind.config.js
 * (animate-fel-step-pulse / animate-fel-panel-in).
 */
@property --fel-streak-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

@keyframes fel-streak-spin {
    to {
        --fel-streak-angle: 360deg;
    }
}

.fel-panel {
    transition:
        height 380ms cubic-bezier(0.32, 0.72, 0, 1),
        top 380ms cubic-bezier(0.32, 0.72, 0, 1),
        transform 380ms cubic-bezier(0.32, 0.72, 0, 1),
        opacity 380ms cubic-bezier(0.32, 0.72, 0, 1),
        background-color 280ms cubic-bezier(0.23, 1, 0.32, 1);
}

.fel-panel.is-loading::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 50;
    border-radius: inherit;
    padding: 1.5px;
    background: conic-gradient(
        from var(--fel-streak-angle),
        transparent 0deg,
        transparent 280deg,
        rgba(0, 85, 237, 0.0) 290deg,
        rgba(0, 85, 237, 0.6) 320deg,
        #0055ED 340deg,
        rgba(0, 85, 237, 0.6) 350deg,
        rgba(0, 85, 237, 0.0) 358deg,
        transparent 360deg
    );
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
            mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    animation: fel-streak-spin 2.4s linear infinite;
}

.fel-panel.is-loading::after {
    content: "";
    position: absolute;
    inset: -1px;
    pointer-events: none;
    z-index: 49;
    border-radius: inherit;
    box-shadow: 0 0 24px rgba(0, 85, 237, 0.18);
}

.fel-chat-scroll {
    scrollbar-width: thin;
    scrollbar-color: rgba(11, 15, 20, 0.22) transparent;
}

.fel-chat-scroll::-webkit-scrollbar {
    width: 8px;
}

.fel-chat-scroll::-webkit-scrollbar-thumb {
    background: rgba(11, 15, 20, 0.22);
    border-radius: 999px;
}

/* While the fast-editor loader is in its loading stages, dim and disable the
   slide canvas, top menu, the slide action bar (Insert/Remix/Theme), the
   on-canvas element floaters, and the settings panel. The thumbnail rail
   (#leftThumbnailPanel) is intentionally left out so the user can still switch
   slides; the loader panel itself is outside these containers, so it stays live. */
body.fast-editor-loading #topMenuBar,
body.fast-editor-loading #workspacebasediv,
body.fast-editor-loading #SLIDE_FLOATER_PROPERTIES_BASE,
body.fast-editor-loading .floaterPropsContentList,
body.fast-editor-loading .sideSettingPanel {
    transition: opacity 200ms ease;
}

/* Block the chrome around the slide. The slide canvas itself hit-tests by
   coordinates and ignores ancestor pointer-events, so it is blocked separately
   by the injected .fel-slide-block overlay below — NOT here. */
body.fast-editor-loading #topMenuBar,
body.fast-editor-loading #SLIDE_FLOATER_PROPERTIES_BASE,
body.fast-editor-loading .floaterPropsContentList,
body.fast-editor-loading .sideSettingPanel {
    pointer-events: none;
}

/* Thumbnail panel: the rail stays interactive so the user can still switch
   slides, but the editing controls in its header (list/grid view toggle,
   collapse, "+ New slide" — tagged .fel-thumb-control in ThumbnailPanel.jsx)
   are dimmed + disabled during loading. */
body.fast-editor-loading .fel-thumb-control {
    opacity: 0.45;
    pointer-events: none;
}

/* (Re)generation shimmer window (body.fast-editor-shimmer, toggled for a fixed
   duration in FastEditorLoader.jsx): show the shimmer skeleton over every thumbnail
   preview and surface the slide-shaped skeleton over the slide canvas, then reveal
   the real content when the class is removed. The .fel-thumb-shimmer overlay is
   always in the DOM (ThumbnailPanelListItem) but hidden unless this class is set. */
.fel-thumb-shimmer {
    display: none;
}
/* Doc generation reveals every tile's shimmer at once via the body class (fixed
   window). The refine/regenerate flow reveals tiles individually: ThumbnailPanel
   sets fel-thumb-shimmer--on per tile and clears it the moment that slide renders,
   so each thumbnail skeleton hides on its own slide's completion. */
body.fast-editor-shimmer .fel-thumb-shimmer,
.fel-thumb-shimmer--on {
    display: block;
}

/* Slide shimmer: a grey overlay injected over #workspacebasediv for the window
   (FastEditorLoader.jsx). z-index 95 sits above the rendered slide; the transparent
   .fel-slide-block (z-100) above it still captures clicks. .skeletonLoader = the shine. */
.fel-slide-shimmer {
    position: absolute;
    inset: 0;
    z-index: 101;
    pointer-events: none;
}

/* Hide the top-menu Regenerate pill while the fast-editor panel is open — the
   button is what opens the panel, so it's redundant (and the chrome is disabled)
   while the panel is up. Active for the whole panel lifetime (loading AND the
   improvements view). */
body.fast-editor-panel-open #regenerateBtnPill {
    display: none !important;
}

/* One-shot promotional hint on the Regenerate pill's tooltip ("Use your free
   re-generation anytime…"): shown ONLY while body.fast-editor-regen-hint is set,
   which FastEditorLoader.jsx adds for ~3.3s after a regeneration finishes (never
   on document creation). The fade in (class added) and fade out (class removed)
   ride the tooltip's own `transition-all duration-300` — a transition, not a
   keyframe animation, so it can't be lost to the display:none→display restart
   quirk: as soon as the button is visible and the class is set, opacity:1
   applies. The button's :hover rule keeps working once the class clears. */
body.fast-editor-regen-hint #regenerateBtnPill .button-tooltip {
    visibility: visible;
    opacity: 1;
}

/* Real blocking layer injected on top of #workspacebasediv during loading
   (see the body-class effect in FastEditorLoader.jsx). inset:0 makes it cover
   the slide canvas exactly; it captures every click/coordinate hit-test. */
.fel-slide-block {
    position: absolute;
    inset: 0;
    z-index: 100;
    cursor: not-allowed;
    pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
    .fel-panel.is-loading::before {
        animation: none;
    }
}

/* "Get most out of Pro / Gold" pill.
     1. .gmo-pill-gradient      — static brand gradient fill (no animation).
   Applied by TopmenuGetMostOut.jsx. The comet ring freezes under prefers-reduced-motion. */

/* Typed angle so the conic-gradient's start angle can be animated. */
@property --gmo-comet-a {
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
}

/* 1. Static gradient fill — crazy8s base .pro-btn fill (style 01), periwinkle → near-white. */
.gmo-pill-gradient {
    background: linear-gradient(90deg, #ccdcfd 0%, #dfe9fe 45%, #f3f6fe 75%, #fdfdfe 100%);
}


/* Dashboard flash-sale chip / expired-CTA — only keyframes and the
   shimmer pseudo-element gradient that can't be expressed as Tailwind
   utilities. All layout/colour/spacing lives inline as Tailwind on
   the JSX (TopMenu.jsx). Class names prefixed `ds-fs-` so they don't
   collide with .pn-bump-chip from PricingScreenNew. */

/* Active chip — horizontal bob + halo pulse. Tailwind binds via
   `animate-[name_dur_easing]` arbitrary syntax, but @keyframes must
   live in CSS (no JIT for keyframes). */
@keyframes ds-fs-chip-bob {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(-6px); }
}
@keyframes ds-fs-chip-glow {
    0%, 100% {
        box-shadow:
            0 6px 16px rgba(0, 0, 0, 0.18),
            0 0 0 0 rgba(0, 85, 237, 0.55);
    }
    70% {
        box-shadow:
            0 6px 16px rgba(0, 0, 0, 0.18),
            0 0 0 9px rgba(255, 85, 0, 0);
    }
    100% {
        box-shadow:
            0 6px 16px rgba(0, 0, 0, 0.18),
            0 0 0 0 rgba(255, 85, 0, 0);
    }
}
.ds-fs-chip {
    animation:
        ds-fs-chip-bob 1.8s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite,
        ds-fs-chip-glow 2.2s ease-in-out infinite;
}

/* Offer pill fill — same 9-stop brand gradient as the Upgrade CTA
   (button-gradient-brand). Painted on ::before (NOT the element background) so the
   arrow tip (::after, z-index -10 via the JSX) sits BEHIND the fill: only the tip's
   outer point shows past the pill's rounded right edge, reading as a pointed tail
   emerging from behind the pill rather than a diamond overlapping it. The button is
   a stacking context (relative + z-[5]), so both negative-z pseudos stay contained
   and paint under the text. Nine-stop brand gradient — no token. */
.ds-fs-chip-offer {
    background: transparent;
}
.ds-fs-chip-offer::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    z-index: -1;
    background: linear-gradient(96deg, #00225c 0%, #003c9e 24%, #0055ed 50%, #0f60ef 66%, #1c6bf3 78%, #2a75f6 86%, #3f82fa 92%, #5990fc 96%, #74a6ff 100%);
}
.ds-fs-chip-offer:hover::before {
    background: linear-gradient(96deg, #063070 0%, #0a48b4 24%, #1667f5 50%, #2170f7 66%, #2e7af9 78%, #3c84fc 86%, #5292fe 92%, #6fa2ff 96%, #8cb6ff 100%);
}
/* Arrow tip — a SOLID color equal to the fill's 100% stop (ref: offer-gradient-v3
   --offer-tip: #74A6FF). Sits behind the ::before fill, so its point matches the
   pill's light right edge and the pill's rounded corner cleanly covers the rest. */
.ds-fs-chip-offer::after {
    background: #74a6ff;
}
.ds-fs-chip-offer:hover::after {
    background: #8cb6ff;
}

/* Shimmer sweep on the orange Reactivate CTA — diagonal white
   highlight slides across every ~2.6s. The gradient is awkward in
   Tailwind so the pseudo lives here; Tailwind handles the parent
   `.relative.overflow-hidden` shell. */
@keyframes ds-fs-shimmer-sweep {
    0%   { left: -75%; }
    55%  { left: 130%; }
    100% { left: 130%; }
}
.ds-fs-shimmer::after {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.35) 50%, transparent 100%);
    transform: skewX(-20deg);
    pointer-events: none;
    animation: ds-fs-shimmer-sweep 2.6s ease-in-out infinite;
}

/* Expired-state arrow — bounces left↔right between "Missed $X off"
   and the Reactivate CTA. Just the keyframe binding; Tailwind owns
   `inline-flex`. */
@keyframes ds-fs-missed-arrow-bounce {
    0%, 100% { transform: translateX(0);   opacity: 0.85; }
    50%      { transform: translateX(6px); opacity: 1;    }
}
.ds-fs-missed-arrow {
    animation: ds-fs-missed-arrow-bounce 1.2s ease-in-out infinite;
}

/* Tooltip reveal-on-hover — Tailwind's `group-hover` would work but
   would require restructuring the wrap to be the single hover target.
   Keeping the descendant selector here is one line; the tooltip's
   visual styling (bg, padding, font) lives inline as Tailwind. */
.ds-fs-reactivate-wrap:hover .ds-fs-tooltip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* Reactivated confirmation toast — dark pill at bottom-centre.
   `data-open` drives slide-in / slide-out (transition) AND the
   progress-bar drain. Tailwind via @apply for anything expressible;
   raw CSS only for the ::after fill base, the keyframe, and
   animation-play-state on hover. */
.ds-fs-toast {
    /* z-[1000001] sits above the pricing modal (z-[999999]) and the
       feedback popup (z-[1000000]) so the toast stays visible after
       Reactivate opens the pricing screen on top. */
    pointer-events: none;
    position: fixed;
    bottom: 1.5rem;
    left: 50%;
    z-index: 1000001;
    display: inline-flex;
    max-width: calc(100vw - 32px);
    --tw-translate-x: -50%;
    --tw-translate-y: 2rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    align-items: center;
    gap: 0.75rem;
    overflow: hidden;
    white-space: nowrap;
    border-radius: 0.25rem;
    --tw-bg-opacity: 1;
    background-color: rgb(10 25 37 / var(--tw-bg-opacity, 1));
    padding: 0.75rem;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    opacity: 0;
    --tw-shadow: 0 12px 32px rgba(10,25,37,0.32);
    --tw-shadow-colored: 0 12px 32px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: transform,opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 350ms;
    transition-timing-function: cubic-bezier(0.16,1,0.3,1);
}
.ds-fs-toast[data-open="true"] { pointer-events: auto; --tw-translate-y: 0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); opacity: 1;
}
.relative.ds-fs-toast-progress {
        position: absolute;
    }
.ds-fs-toast-progress { position: absolute; left: 0px; right: 0px; bottom: 0px; height: 3px; overflow: hidden; border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem; background-color: rgb(255 255 255 / 0.1);
}
.ds-fs-toast-progress::after {
    content: "";
}
.relative.ds-fs-toast-progress::after {
        position: absolute;
    }
.ds-fs-toast-progress::after { position: absolute; inset: 0px; transform-origin: left; --tw-scale-x: 0; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); background-color: rgb(255 255 255 / 0.55); will-change: transform;
}
.ds-fs-toast[data-open="true"] .ds-fs-toast-progress::after {
    animation: ds-fs-toast-drain var(--ds-fs-toast-duration, 6s) linear forwards;
}
.ds-fs-toast[data-open="true"]:hover .ds-fs-toast-progress::after {
    animation-play-state: paused;
}
@keyframes ds-fs-toast-drain {
    from { transform: scaleX(1); }
    to   { transform: scaleX(0); }
}

/* Reduced-motion override — disable all looping animations. */
@media (prefers-reduced-motion: reduce) {
    .ds-fs-chip,
    .ds-fs-shimmer::after,
    .ds-fs-missed-arrow,
    .ds-fs-toast-progress::after {
        animation: none !important;
    }
}