/* CSS from site configuration */
      #app {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  overflow-x: hidden;
  overflow-y: auto;
  max-width: 100%;
  box-sizing: border-box;
}



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

body {
  background: var(--color-background-page);
  font-family: var(--font-family-body);
  color: var(--color-light-grey-5);
  overflow-x: hidden;
  -webkit-text-size-adjust: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-overflow-scrolling: auto;
  background-color: var(--color-background-page);
  font-weight: 600;
  margin: 0;
  font-style: var(--font-style-base);
  scrollbar-color: var(--color-scrollbar-background) transparent;
}

img {
  max-width: 100%;
  height: auto;
}

body,html {
  height: auto;
  min-height: 100vh;
  scroll-behavior: smooth;
}

section {
  margin: 0 auto;
  max-width: var(--section-width);
  min-width: 320px;
  padding: 0 var(--section-padding-m);
}

ul {
  list-style: none;
}

button {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  font-style: inherit;
  background: 0 0;
}

body, html {
  overflow-x: hidden;
}


:root {

  --color-background-page: #000000;
  --color-menu-top-background: #000000;
  --color-pr500: #FFED00;
  --nav-height: 64px;
  --color-mid-grey-1: #5A5471;
  --color-mid-grey-2: #706685;
  --color-mid-grey-5: #ABA5CD;
  --color-light-grey-3: #D7D6F9;
  --color-light-grey-5: #F2EFFF;
  --color-menu-top-icon: var(--color-mid-grey-5);
  --menu-top-icon-size: 24px;

  
  --color-background-page: var(--color-dark-grey-0);
  --color-background-primary: var(--color-pr500);
  --color-border: #4838764d;
  --color-button-primary: #0B0B0F;
  --color-c1: #0000003D;
  --color-c2: #00000052;
  --color-da800: #A20000;
  --color-dark-grey-0: #000000;
  --color-dark-grey-1: #19162C;
  --color-dark-grey-2: #241F42;
  --color-dark-grey-3: #302958;
  --color-dark-grey-4: #41316C;
  --color-dark-grey-5: #483876;
  --color-dgz000: #060E2A00;
  --color-in050: #D7DEF9;
  --color-in400: #355BE2;
  --color-in500: #1D44CC;
  --color-in700: #12297B;
  --color-light-grey-3: #D7D6F9;
  --color-light-grey-5: #F2EFFF;
  --color-mi700: #5C0080;
  --color-mid-grey-1: #5A5471;
  --color-mid-grey-2: #706685;
  --color-mid-grey-5: #ABA5CD;
  --color-pr050: #EAFBFC;
  --color-pr400: #5BDCE5;
  --color-pr500: #32D3DF;
  --color-pr600: #28A9B2;
  --color-pr700: #1E7F86;
  --color-su400: #09E41F;
  --color-su800: #034C0A;
  --color-w005: #FFFFFF0D;
  --color-w010: #FFFFFF1A;
  --color-w020: #FFFFFF33;
  --color-w050: #FFFFFF80;
  --color-w080: #FFFFFFCC;
  --color-white: #FFFFFF;

  
  --color-button-fill-info-background: var(--color-in400);
  --color-button-fill-info-background-active: var(--color-in700);
  --color-button-fill-info-background-hover: var(--color-in500);
  --color-button-fill-info-icon-container-icon: #FFF;
  --color-button-fill-info-icon-container-icon-active: #FFF;
  --color-button-fill-info-icon-container-icon-hover: #FFF;
  --color-button-fill-info-text: #FFF;
  --color-button-fill-info-text-active: #FFF;
  --color-button-fill-info-text-hover: #FFF;
  --color-button-fill-primary-background: var(--color-pr500);
  --color-button-fill-primary-background-active: var(--color-pr600);
  --color-button-fill-primary-background-hover: var(--color-pr400);
  --color-button-fill-primary-icon-container-icon: var(--color-pr700);
  --color-button-fill-primary-icon-container-icon-active: var(--color-pr700);
  --color-button-fill-primary-icon-container-icon-hover: var(--color-pr700);
  --color-button-fill-primary-text: var(--color-button-primary);
  --color-button-fill-primary-text-active: var(--color-button-primary);
  --color-button-fill-primary-text-hover: var(--color-button-primary);
  --color-button-fill-secondary-background: var(--color-dark-grey-4);
  --color-button-fill-secondary-background-active: var(--color-dark-grey-3);
  --color-button-fill-secondary-background-disabled: var(--color-w005);
  --color-button-fill-secondary-background-hover: var(--color-dark-grey-5);
  --color-button-fill-secondary-icon-container-icon: var(--color-mid-grey-5);
  --color-button-fill-secondary-icon-container-icon-active: var(--color-mid-grey-5);
  --color-button-fill-secondary-icon-container-icon-disabled: var(--color-mid-grey-5);
  --color-button-fill-secondary-icon-container-icon-hover: var(--color-mid-grey-5);
  --color-button-fill-secondary-text: var(--color-white);
  --color-button-fill-secondary-text-active: var(--color-white);
  --color-button-fill-secondary-text-disabled: var(--color-mid-grey-1);
  --color-button-fill-secondary-text-hover: var(--color-white);
  --color-button-outline-info-background-active: var(--color-in700);
  --color-button-outline-info-background-hover: var(--color-in500);
  --color-button-outline-info-border: var(--color-in400);
  --color-button-outline-info-icon-container-icon: var(--color-in050);
  --color-button-outline-info-icon-container-icon-active: var(--color-in050);
  --color-button-outline-info-icon-container-icon-hover: var(--color-in050);
  --color-button-outline-info-text: var(--color-white);
  --color-button-outline-info-text-active: #FFF;
  --color-button-outline-info-text-hover: #FFF;
  --color-button-outline-primary-background-active: var(--color-pr600);
  --color-button-outline-primary-background-hover: var(--color-pr400);
  --color-button-outline-primary-border: var(--color-pr500);
  --color-button-outline-primary-icon-container-icon: var(--color-pr050);
  --color-button-outline-primary-icon-container-icon-active: var(--color-pr700);
  --color-button-outline-primary-icon-container-icon-hover: var(--color-pr700);
  --color-button-outline-primary-text: var(--color-white);
  --color-button-outline-primary-text-active: var(--color-white);
  --color-button-outline-primary-text-hover: var(--color-white);
  --color-button-outline-secondary-background-active: var(--color-dark-grey-3);
  --color-button-outline-secondary-background-hover: var(--color-dark-grey-5);
  --color-button-outline-secondary-border: var(--color-dark-grey-4);
  --color-button-outline-secondary-border-disabled: var(--color-dark-grey-2);
  --color-button-outline-secondary-icon-container-icon: var(--color-mid-grey-5);
  --color-button-outline-secondary-icon-container-icon-active: var(--color-mid-grey-5);
  --color-button-outline-secondary-icon-container-icon-disabled: var(--color-mid-grey-5);
  --color-button-outline-secondary-icon-container-icon-hover: var(--color-mid-grey-5);
  --color-button-outline-secondary-text: var(--color-white);
  --color-button-outline-secondary-text-active: var(--color-white);
  --color-button-outline-secondary-text-disabled: var(--color-mid-grey-1);
  --color-button-outline-secondary-text-hover: var(--color-white);

  
  --color-sidebar-card-mini-background-hover: var(--color-dark-grey-2);
  --color-sidebar-card-mini-icon: #D0D2D7CC;
  --color-sidebar-card-widget-background-finish: var(--color-dark-grey-2);
  --color-sidebar-card-widget-background-finish-hover: var(--color-dark-grey-3);
  --color-sidebar-card-widget-background-start: #19162C;
  --color-sidebar-card-widget-background-start-hover: #241F42;
  --color-sidebar-card-widget-text: var(--color-white);
  --color-sidebar-divider-background: var(--color-dark-grey-3);
  --color-sidebar-header-background: var(--color-dark-grey-1);
  --color-sidebar-list-header-background: var(--color-dark-grey-2);
  --color-sidebar-list-header-text: var(--color-light-grey-3);
  --color-sidebar-list-row-text: var(--color-mid-grey-5);

  
  --color-tab-secondary-background-active: var(--color-dark-grey-4);
  --color-tab-secondary-icon-container-icon: var(--color-w050);
  --color-tab-secondary-icon-container-icon-hover: var(--color-w080);
  --color-tab-secondary-text: var(--color-mid-grey-5);
  --color-tab-secondary-text-active: var(--color-white);
  --color-tab-secondary-text-hover: var(--color-white);
  --color-tab-underline-primary-icon-container-icon: var(--color-w050);
  --color-tab-underline-primary-icon-container-icon-hover: var(--color-w080);
  --color-tab-underline-primary-text: var(--color-mid-grey-5);
  --color-tab-underline-primary-text-active: var(--color-white);
  --color-tab-underline-primary-text-hover: var(--color-white);
  --color-tab-underline-primary-underline-background: var(--color-background-primary);
  --color-table-fill-header-text: var(--color-mid-grey-5);
  --color-table-fill-row-text: var(--color-white);
  --color-tabs-group-fill-secondary-background: var(--color-w010);
  --color-tabs-group-outline-secondary-border: var(--color-dark-grey-4);
  --color-tabs-group-underline-primary-border-bottom: linear-gradient(180deg,var(--color-dark-grey-2) 0%,unset 100%);

  
  --color-badge-info-background: var(--color-in400);
  --color-badge-info-icon-container-icon: var(--color-w080);
  --color-badge-info-text: var(--color-white);
  --color-badge-secondary-background: var(--color-dark-grey-5);
  --color-badge-secondary-icon-container-icon: var(--color-w080);
  --color-badge-secondary-text: var(--color-white);

  
  --color-counter-secondary-background: var(--color-dark-grey-5);

  
  --color-footer-description: var(--color-mid-grey-2);
  --color-footer-menu-text: var(--color-mid-grey-5);
  --color-footer-text: var(--color-mid-grey-5);

  
  --color-game-card-footer-0-background: linear-gradient(180deg,var(--color-dgz000) 0%,var(--color-dark-grey-1) 100%);
  --color-game-card-footer-1-background: linear-gradient(180deg,var(--color-game-card-footer-1-background-start) 0%,var(--color-pr700) 100%);
  --color-game-card-footer-1-background-start: #FFA80000;
  --color-game-card-footer-2-background: linear-gradient(180deg,var(--color-game-card-footer-2-background-start) 0%,var(--color-da800) 100%);
  --color-game-card-footer-2-background-start: #E8001000;
  --color-game-card-footer-3-background: linear-gradient(180deg,var(--color-game-card-footer-3-background-start) 0%,var(--color-in700) 100%);
  --color-game-card-footer-3-background-start: #006EDD00;
  --color-game-card-footer-4-background: linear-gradient(180deg,var(--color-game-card-footer-4-background-start) 0%,var(--color-game-card-footer-4-background-finish) 100%);
  --color-game-card-footer-4-background-finish: #8C0038;
  --color-game-card-footer-4-background-start: #EA005D00;
  --color-game-card-footer-5-background: linear-gradient(180deg,var(--color-game-card-footer-5-background-start) 0%,var(--color-su800) 100%);
  --color-game-card-footer-5-background-start: #2EEB0000;
  --color-game-card-footer-6-background: linear-gradient(180deg,var(--color-game-card-footer-6-background-start) 0%,var(--color-mi700) 100%);
  --color-game-card-footer-6-background-start: #6D00D800;
  --color-game-card-like-icon: var(--color-light-grey-5);

  
  --color-text-secondary: var(--color-mid-grey-5);
  --color-text-success: var(--color-su400);

  
  --color-title-basic-text: var(--color-light-grey-5);

  
  --color-menu-top-background: var(--color-dark-grey-0);
  --color-menu-top-icon: var(--color-mid-grey-5);

  
  --color-scrollbar-background: var(--color-w020);

  
  --font-badge-text-m: var(--font-style-base) 700 12px/16px var(--font-family-body);
  --font-body-bold-m: var(--font-style-base) 700 16px/18px var(--font-family-body);
  --font-body-regular-s: var(--font-style-base) 500 14px/16px var(--font-family-body);
  --font-body-semi-bold-2xs: var(--font-style-base) 600 10px/12px var(--font-family-body);
  --font-body-semi-bold-m: var(--font-style-base) 600 16px/18px var(--font-family-body);
  --font-body-semi-bold-s: var(--font-style-base) 600 14px/16px var(--font-family-body);
  --font-button-text-l: var(--font-style-base) 700 18px/24px var(--font-family-body);
  --font-button-text-m: var(--font-style-base) 600 16px/20px var(--font-family-body);
  --font-button-text-s: var(--font-style-base) 600 12px/16px var(--font-family-body);
  --font-counter-text-l: var(--font-style-base) 700 12px/12px var(--font-family-body);
  --font-family-body: Montserrat,Verdana,sans-serif;
  --font-family-header: Montserrat,Verdana,sans-serif;
  --font-footer-text: var(--font-style-base) 500 14px/14px var(--font-family-body);
  --font-header-black-s: var(--font-style-header) 900 20px/28px var(--font-family-header);
  --font-header-bold-l: var(--font-style-header) 700 28px/36px var(--font-family-header);
  --font-sidebar-card-text-s: var(--font-style-base) 700 10px/10px var(--font-family-body);
  --font-sidebar-list-header: var(--font-style-base) 500 14px/16px var(--font-family-body);
  --font-sidebar-list-text: var(--font-style-base) 500 14px/16px var(--font-family-body);
  --font-style-base: normal;
  --font-style-header: normal;
  --font-tab-text-m: var(--font-style-base) 600 16px/20px var(--font-family-body);
  --font-tab-text-s: var(--font-style-base) 600 12px/16px var(--font-family-body);
  --font-table-header: var(--font-style-base) 700 12px/16px var(--font-family-body);
  --font-table-text: var(--font-style-base) 600 14px/16px var(--font-family-body);
  --font-variant-numeric: normal;

  
  --section-padding-l: 16px;
  --section-padding-m: 16px;
  --spacing-3xs: 4px;
  --spacing-m: 16px;
  --spacing-xs: 8px;

  
  --menu-expand-desktop: 0 16px;
  --menu-top-height-mobile: 56px;
  --menu-top-icon-size: 24px;
  --menu-top-spacing-desktop: 16px;
  --menu-top-spacing-mobile: 8px;
  --menu-top-user-bar-spacing-mobile: 4px;
  --nav-height: var(--menu-top-height-mobile,54px);

  
  --button-border-radius-l: 1000px;
  --button-border-radius-m: 1000px;
  --button-border-radius-s: 1000px;
  --button-border-size-l: 2px;
  --button-border-size-m: 2px;
  --button-border-size-s: 2px;
  --button-content-height-l: 24px;
  --button-content-height-m: 20px;
  --button-content-height-s: 16px;
  --button-expand-l: 16px;
  --button-expand-m: 12px;
  --button-expand-s: 8px;
  --button-icon-container-border-radius-l: 1000px;
  --button-icon-container-border-radius-m: 1000px;
  --button-icon-container-border-radius-s: 1000px;
  --button-icon-container-border-size-l: 1px;
  --button-icon-container-border-size-m: 1px;
  --button-icon-container-border-size-s: 1px;
  --button-icon-container-icon-size-l: 24px;
  --button-icon-container-icon-size-m: 20px;
  --button-icon-container-icon-size-s: 16px;
  --button-text-container-expand-l: 0 8px;
  --button-text-container-expand-m: 0 8px;
  --button-text-container-expand-s: 0 4px;

  
  --badge-border-radius-m: 6px;
  --badge-border-size-m: 2px;
  --badge-content-height-m: 16px;
  --badge-expand-m: 4px;
  --badge-icon-container-border-radius-m: 1000px;
  --badge-icon-container-border-size-m: 1px;
  --badge-icon-container-icon-size-m: 16px;
  --badge-text-container-expand-m: 0 4px;

  
  --tab-border-radius-m: 1000px;
  --tab-border-radius-s: 1000px;
  --tab-border-size-m: 2px;
  --tab-border-size-s: 2px;
  --tab-content-height-m: 20px;
  --tab-content-height-s: 16px;
  --tab-expand-m: 12px;
  --tab-expand-s: 8px;
  --tab-icon-container-icon-size-m: 20px;
  --tab-icon-container-icon-size-s: 16px;
  --tab-text-container-expand-m: 0 8px;
  --tab-text-container-expand-s: 0 4px;
  --tab-underline-expand-m: 12px;
  --tab-underline-line-border-radius: 2px 2px 0 0;
  --tabs-group-border-radius-m: 24px;
  --tabs-group-border-radius-s: 16px;
  --tabs-group-border-size-m: 2px;
  --tabs-group-border-size-s: 2px;
  --tabs-group-underline-border-size-m: 1px;

  
  --counter-border-radius-l: 12px;
  --counter-border-size-l: 2px;
  --counter-expand-l: 0 4px;
  --counter-size-l: 20px;

  
  --card-border-radius-m: 12px;
  --game-card-border-radius: 12px;
  --game-card-border-size: 2px;
  --game-card-header-expand: 8px 8px 0 8px;
  --game-card-header-horizontal-spacing: 4px;
  --game-card-header-vertical-spacing: 4px;

  
  --sidebar-body-spacing: 8px;
  --sidebar-card-border-radius: 8px;
  --sidebar-card-border-size: 2px;
  --sidebar-header-expand: 0 20px;
  --sidebar-header-height: 64px;
  --sidebar-list-item-border-radius: 8px;
  --sidebar-list-item-icon-container-border-size: 1px;
  --sidebar-list-item-icon-container-icon-size: 20px;

  
  --table-row-expand: 12px 16px;
  --table-row-spacing: 8px;

  
  --border-radius-m: 8px;
  --border-radius-xs: 4px;
  --line-size-m: 2px;
  --line-size-s: 1px;
  --title-block-border-size-desktop: 2px;
  --title-block-content-spacing-desktop: 8px;
  --title-block-horizontal-spacing-desktop: 12px;
  --title-block-icon-container-icon-size-desktop: 32px;

  
  --shadow-blur-b1: 1px;
  --shadow-blur-b3: 8px;
  --shadow-position-y2: 4px;
  --shadow-s5: 0 var(--shadow-position-y2) var(--shadow-blur-b3) 0 var(--color-c1),0 0 var(--shadow-blur-b1) 0 var(--color-c2);

  
  --buttons-group-spacing-m: 8px;
  --section-width: 1400px;

}

.m-text {
  margin: 0;
}

.m-text-center {
  text-align: center;
}

.m-fs8 {
  font-size: 8px;
}

.m-fs12 {
  font-size: 12px;
}

.m-fs14 {
  font-size: 14px;
}

.m-fw500 {
  font-weight: 500;
}

.m-fw600 {
  font-weight: 600;
}

.m-fw700 {
  font-weight: 700;
}

.m-lh160 {
  line-height: 160%;
}

.Body-Bold-M {
  font: var(--font-body-bold-m);
}

.Body-Semi-Bold-2XS {
  font: var(--font-body-semi-bold-2xs);
}

.Body-Semi-Bold-S {
  font: var(--font-body-semi-bold-s);
}

.Body-Semi-Bold-M {
  font: var(--font-body-semi-bold-m);
}

.Body-Regular-S {
  font: var(--font-body-regular-s);
}


.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--color-menu-top-background);
  display: flex;
  align-items: center;
  height: 64px;
  padding: 0 16px;
  gap: 12px;
}

.header-toggle {
  display: flex;
  background: transparent;
  border: none;
  cursor: pointer;
  color: #fff;
  width: 44px;
  height: 44px;
  padding: 8px;
  align-items: center;
  position: relative;
  z-index: 10000;
}

.header-auth-buttons .m-button--primary {
  animation: cta-pulse 2s ease-in-out infinite;
}

.game-category__header {
  display: flex;
  align-items: center;
  align-self: stretch;
  gap: var(--title-block-horizontal-spacing-desktop,12px);
  border-bottom: var(--title-block-border-size-desktop,0px) solid var(--color-title-basic-border,transparent);
}

.header-auth-buttons {
  display: flex;
  gap: 8px;
}

.header-auth-buttons .m-button {
  height: 32px;
  padding: 8px 12px;
  font-size: 14px;
  white-space: nowrap;
}

.header-search.m-icon {
  width: var(--menu-top-icon-size);
  height: var(--menu-top-icon-size);
  color: var(--color-menu-top-icon);
  cursor: pointer;
}

.header-toggle__icon.m-icon {
  color: var(--color-menu-top-icon);
  height: var(--menu-top-icon-size);
  width: var(--menu-top-icon-size);
}

.desktop {
  --nav-height: 64px;
}

.desktop .header {
  box-shadow: var(--shadow-s5);
  gap: var(--menu-top-spacing-desktop);
}

.header__content {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 12px;
}


.header-menu {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  display: flex;
  align-items: center;
  padding: 4px;
  gap: 4px;
}

.header__section-right {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}



.recent-big-wins-header {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.recent-big-wins-header__control {
  display: flex;
}

.recent-big-wins-header__title {
  display: flex;
  align-items: center;
}

.recent-big-wins-header__title>svg {
  width: 32px;
  margin-right: 8px;
}

.bets-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid var(--color-dark-grey-2);
}

.m-game-card__header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  padding: var(--game-card-header-expand);
  align-items: flex-start;
  justify-content: flex-end;
  gap: var(--game-card-header-horizontal-spacing);
}

.nav-sidebar-header {
  align-items: center;
  background: var(--color-sidebar-header-background);
  box-shadow: var(--shadow-s5);
  display: flex;
  height: var(--sidebar-header-height);
  justify-content: center;
  padding: var(--sidebar-header-expand);
}

.nav-sidebar-header svg {
  color: var(--color-menu-top-icon);
  height: var(--menu-top-icon-size);
}

.nav-sidebar-header__toggle {
  left: 0;
  margin: var(--sidebar-header-expand);
  cursor: pointer;
  padding: 8px;
}

.Header-Black-S {
  font: var(--font-header-black-s);
  font-variant-numeric: var(--font-variant-numeric);
}

.Header-Bold-L {
  font: var(--font-header-bold-l);
  font-variant-numeric: var(--font-variant-numeric);
}

.header-toggle:hover {
  opacity: 0.8;
}

.nav-sidebar-header.nav-sidebar-expanded__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  gap: 12px;
}

.nav-sidebar-header__toggle:hover {
  opacity: 0.8;
}


.nav-sidebar {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: 240px;
  background: var(--color-dark-grey-1, #19162C);
  z-index: 105;
  height: 100vh;
  transition: transform 0.3s ease, width 0.3s ease;
}

.nav-card {
  display: block;
  text-align: center;
}

.nav-card__button {
  width: 100%;
  align-items: center;
  background: linear-gradient(96deg,var(--color-sidebar-card-widget-background-start) 0,var(--color-sidebar-card-widget-background-finish) 30%);
  border: var(--sidebar-card-border-size) solid var(--color-sidebar-card-widget-border);
  border-radius: var(--border-radius-m);
  color: var(--color-sidebar-card-widget-text);
  cursor: pointer;
  display: flex;
  gap: var(--spacing-3xs);
  -webkit-mask-image: -webkit-radial-gradient(#fff,#000);
  padding: var(--spacing-3xs);
  position: relative;
  text-align: initial;
}

.nav-card__button:before {
  background: linear-gradient(96deg,var(--color-sidebar-card-widget-background-start-hover) 0,var(--color-sidebar-card-widget-background-finish-hover) 30%);
  border-radius: calc(var(--sidebar-card-border-radius) - var(--sidebar-card-border-size));
  content: "";
  inset: 0;
  opacity: 0;
  position: absolute;
}

.nav-card__img {
  height: 40px;
  pointer-events: none;
  width: 40px;
}

.nav-card__title {
  flex: 1;
  font: var(--font-sidebar-card-text-s);
  font-variant-numeric: var(--font-variant-numeric);
  overflow: hidden;
}

.nav-card__title:after {
  bottom: 0;
  content: "";
  height: 100%;
  position: absolute;
  right: 0;
}

.nav-sidebar-card--wrapped .nav-card__button {
  background: none;
}

.nav-sidebar-card--wrapped .nav-card__button:before {
  background: var(--color-sidebar-card-mini-background-hover);
}

.nav-sidebar-expanded-cards {
  display: flex;
  flex-direction: column;
  margin: 0 0 12px 0;
  padding: 0;
  gap: 8px;
}

.nav-sidebar-expanded-support {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  flex-shrink: 0;
}

.nav-sidebar-expanded-support,.nav-sidebar-expanded-support-help {
  display: flex;
}

.nav-sidebar-item-icon {
  --ic-background: var(--color-sidebar-list-header-icon-container-background);
  --ic-border-color: var(--color-sidebar-list-header-icon-container-border);
  --ic-border-width: var(--sidebar-list-item-icon-container-border-size);
  --ic-size: var(--sidebar-list-item-icon-container-icon-size);
}

.nav-sidebar-item {
  --text-color--nested: var(--color-sidebar-list-row-text);
  --icon-color--nested: var(--color-sidebar-list-row-text);
  --text-color: var(--color-sidebar-list-header-text);
  --icon-color: var(--color-sidebar-list-header-text);
  align-items: center;
  color: var(--text-color);
  cursor: pointer;
  display: flex;
  font: var(--font-sidebar-list-text);
  font-variant-numeric: var(--font-variant-numeric);
}

.nav-sidebar-item__content {
  align-items: center;
  display: flex;
  gap: var(--spacing-xs);
  padding: var(--spacing-xs);
}

.nav-sidebar-item--main {
  background: var(--color-dark-grey-2);
  border-radius: 8px;
}

.nav-sidebar-items {
  --text-color: var(--color-sidebar-list-header-text);
  --icon-color: var(--text-color);
  display: flex;
  flex-direction: column;
}

.nav-sidebar-items-title {
  align-items: center;
  border-radius: var(--sidebar-list-item-border-radius,8px);
  color: var(--text-color);
  cursor: pointer;
  display: flex;
  font: var(--font-sidebar-list-header);
  font-variant-numeric: var(--font-variant-numeric);
  gap: var(--spacing-xs);
  padding: var(--spacing-xs);
  position: relative;
  transition: background .3s ease-in-out,margin .3s ease-in-out;
}

.nav-sidebar-items-title--light {
  background: var(--color-sidebar-list-header-background);
}

.nav-sidebar-expanded {
  bottom: 0;
  display: none;
  flex-direction: column;
  height: 100%;
  left: 0;
  padding-bottom: var(--tabbar-b-offset,0);
  position: fixed;
  top: var(--nav-height);
  width: 280px;
  overflow: hidden;
}

.nav-sidebar-expanded-items {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-sidebar-expanded-content {
  animation: slide-up-opacity .6s cubic-bezier(.4,0,.2,1) .3s forwards;
  display: flex;
  flex: 1;
  flex-direction: column;
  opacity: 0;
  overflow: hidden;
  height: 100%;
}

.nav-sidebar-expanded-scrollY {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden auto;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  max-height: 100%;
}

.nav-sidebar-expanded--gap {
  display: flex;
  flex-flow: column;
  gap: var(--spacing-m);
}

.nav-sidebar-icon {
  align-items: center;
  border: var(--sidebar-card-border-size) solid var(--color-sidebar-card-mini-border);
  cursor: pointer;
  display: flex;
  height: 48px;
  justify-content: center;
}

.nav-sidebar-icon svg {
  color: var(--color-sidebar-card-mini-icon);
  height: 24px;
  pointer-events: none;
}

.nav-sidebar-icon.active,.nav-sidebar-icon:hover {
  background: var(--color-sidebar-card-mini-background-hover);
  border: var(--sidebar-card-border-size) solid var(--color-sidebar-card-mini-border-hover);
}

.nav-sidebar-wrapped {
  width: 64px;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

.nav-sidebar-wrapped-content {
  animation: slide-up-opacity .6s cubic-bezier(.4,0,.2,1) .3s forwards;
  height: 100%;
  opacity: 0;
  overflow-y: auto;
  padding: var(--spacing-xs);
  width: 64px;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

.nav-sidebar-wrapped .divider-top {
  margin-top: 16px;
}

.nav-sidebar-wrapped .divider-top:before {
  background: var(--color-sidebar-divider-background);
  content: "";
  height: var(--line-size-s,1px);
  position: absolute;
  top: calc(var(--sidebar-body-spacing,8px)*-1);
}

.nav-sidebar-wrapped .divider-bottom {
  margin-bottom: 16px;
}

.nav-sidebar-wrapped .divider-bottom:after {
  background: var(--color-sidebar-divider-background);
  bottom: calc(var(--sidebar-body-spacing,8px)*-1);
  content: "";
  height: var(--line-size-s,1px);
  position: absolute;
}

.nav-sidebar-content {
  transition: all .5s ease;
}

.nav-sidebar-wrapped-content .divider-top {
  margin-top: auto;
  padding-top: 16px;
}

.nav-sidebar-support-wrapped {
  width: 48px;
  height: 48px;
  min-width: 48px;
  padding: 8px;
}

.nav-sidebar:not(.expanded) .nav-sidebar-wrapped {
  display: block;
}

.nav-sidebar.expanded .nav-sidebar-wrapped {
  display: none;
}

.nav-sidebar-items,.nav-sidebar-expanded-items {
  margin: 0;
  padding: 0;
}

.nav-sidebar-items-item {
  margin: 0 0 8px 0;
}

.nav-sidebar-items-item:last-child {
  margin-bottom: 0;
}

.nav-sidebar-expanded-scrollY.nav-sidebar-expanded--gap {
  display: block;
  flex-flow: unset;
  gap: 0;
  padding: 16px;
}

.nav-sidebar-expanded-content>.nav-sidebar-expanded-scrollY {
  flex: 1 1 auto;
  overflow-y: auto;
}

.nav-sidebar-expanded-content>.nav-sidebar-expanded-support {
  flex: 0 0 auto;
}

.nav-sidebar-expanded-scrollY::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.nav-sidebar:not(.expanded) .nav-sidebar-expanded {
  display: none;
}

.nav-sidebar.expanded .nav-sidebar-expanded {
  display: block;
}

.nav-sidebar-wrapped-content,.nav-sidebar-expanded-content {
  opacity: 1;
  visibility: visible;
}

.nav-sidebar.opened .nav-sidebar-wrapped-content,.nav-sidebar.opened.expanded .nav-sidebar-expanded-content {
  opacity: 1;
}

.hideScrollbar,.nav-sidebar-wrapped-content,.nav-sidebar-expanded-content {
  scrollbar-width: none;
}

.hideScrollbar::-webkit-scrollbar,.nav-sidebar-wrapped-content::-webkit-scrollbar,.nav-sidebar-expanded-content::-webkit-scrollbar {
  display: none;
  width: 0;
}

.nav-sidebar-cards-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.nav-sidebar-expanded-support-help {
  display: flex;
  gap: 8px;
  width: 100%;
}

.nav-sidebar-expanded-support-help .m-button {
  flex: 1;
  min-width: 0;
}

.nav-sidebar-support,.nav-sidebar-help-centre,.lang-switcher-btn {
  width: 100%;
  justify-content: center;
  font-size: 14px;
  padding: 10px 12px;
  height: auto;
}

.nav-sidebar-support .m-button-content,.nav-sidebar-help-centre .m-button-content,.lang-switcher-btn .m-button-content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.nav-sidebar-support svg,.nav-sidebar-help-centre svg {
  width: 20px;
  height: 20px;
}

body.sidebar-open {
  overflow: hidden;
}

.nav-sidebar-items,
.nav-sidebar-expanded-items {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-sidebar-expanded-content > .nav-sidebar-expanded-scrollY {
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
}

.nav-sidebar-expanded-content > .nav-sidebar-expanded-support {
  flex: 0 0 auto;
  margin-top: 0;
}

.nav-sidebar-wrapped-content,
.nav-sidebar-expanded-content {
  opacity: 1;
  visibility: visible;
  animation: none;
}

.nav-sidebar.opened .nav-sidebar-wrapped-content,
.nav-sidebar.opened.expanded .nav-sidebar-expanded-content {
  opacity: 1;
  visibility: visible;
}

.nav-sidebar,
.nav-sidebar-wrapped,
.nav-sidebar-expanded {
  transition: all 0.3s ease;
}

.hideScrollbar,
.nav-sidebar-wrapped-content,
.nav-sidebar-expanded-content {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.hideScrollbar::-webkit-scrollbar,
.nav-sidebar-wrapped-content::-webkit-scrollbar,
.nav-sidebar-expanded-content::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.nav-sidebar,
.nav-sidebar-content,
.nav-sidebar-wrapped,
.nav-sidebar-wrapped-content,
.nav-sidebar-expanded,
.nav-sidebar-expanded-content {
  overflow-x: hidden;
}

.nav-sidebar-support,
.nav-sidebar-help-centre,
.lang-switcher-btn {
  width: 100%;
  justify-content: center;
  font-size: 14px;
  padding: 10px 12px;
  height: auto;
  min-height: 44px;
}

.nav-sidebar-support .m-button-content,
.nav-sidebar-help-centre .m-button-content,
.lang-switcher-btn .m-button-content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.nav-sidebar-support svg,
.nav-sidebar-help-centre svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}


.app {
  margin-top: 0;
  min-height: 100vh;
  display: flex;
  flex-flow: row;
  max-width: 100%;
  overflow: visible;
  width: 100%;
}

.app #container {
  display: block;
  flex: 1;
  height: auto;
  overflow: visible;
}


.lobby-banners {
  width: 100%;
  padding: 0 16px;
  min-height: 250px;
  box-sizing: border-box;
  margin-top: 16px;
}

.lobby-banners__banner {
  padding: 0 4px;
  box-sizing: border-box;
}

.lobby-banner {
  position: relative;
  width: 100%;
  --gradient-color: #80462d;
  --gradient-color-2: #ffea81;
  height: 100%;
  overflow: hidden;
  border-radius: 16px;
  aspect-ratio: 2 / 1;
}

.lobby-banner-picture {
  display: block;
  width: 100%;
  height: 100%;
}

.lobby-banners .m-button--primary {
  position: relative;
  background: linear-gradient(90deg, #FFED00, #FFD700, #FFA500, #FFED00);
  background-size: 300% 100%;
  animation: border-spin 3s linear infinite;
  border: 2px solid transparent;
  box-shadow: 0 0 15px rgba(255, 237, 0, 0.4);
}

.lobby-banner-picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right;
}

.lobby-banner__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.lobby-banner__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: 12px;
  height: 100%;
  position: relative;
}

.lobby-banner__text {
  max-width: 50%;
}

.lobby-banner__text h4,
.lobby-banner__content h4 {
  color: #f8e150;
  font-size: 24px;
  font-weight: 800;
}

.lobby-banner__text p,
.lobby-banner__content p {
  color: #f8e150;
  font-weight: 600;
}

.lobby-banner__text>* {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
}

.lobby-banners .m-slider__scroll-box {
  --scroll-padding: var(--section-padding-l);
  scroll-padding: var(--scroll-padding);
  padding: 0 var(--scroll-padding);
}


.m-button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--m-button-padding);
  border: none;
  border-radius: var(--m-button-border-radius);
  cursor: pointer;
  transition: all 0.2s;
  --m-button-transition-duration: .15s;
  --m-button-background-disabled: var(--color-button-fill-secondary-background-disabled);
  --m-button-border-color-disabled: var(--color-button-fill-secondary-border-disabled);
  --m-button-text-color-disabled: var(--color-button-fill-secondary-text-disabled);
  --ic-color-disabled: var(--color-button-fill-secondary-icon-container-icon-disabled);
  --ic-background-disabled: var(--color-button-fill-secondary-icon-container-background-disabled);
  --ic-border-color-disabled: var(--color-button-fill-secondary-icon-container-border-disabled);
  background: var(--m-button-background);
  box-shadow: inset 0 0 0 var(--m-button-border-width) var(--m-button-border-color);
  color: var(--m-button-text-color);
  font: var(--m-button-font);
  font-variant-numeric: var(--font-variant-numeric);
  position: relative;
  text-decoration: none;
}

.m-button--primary:hover {
  animation-play-state: paused;
  transform: scale(1.08);
  transition: transform 0.2s ease;
}

.m-icon.m-game-heart {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  transform-origin: center;
  cursor: pointer;
  color: var(--color-light-grey-3);
  transition: color .25s ease-in-out;
  -webkit-user-select: none;
}

.m-card-badges>.m-badge .m-badge-text {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}

.action-buttons {
  align-items: flex-end;
  gap: var(--buttons-group-spacing-m,8px);
  margin: 0 var(--spacing-m,16px)var(--spacing-m,16px)0;
  flex-direction: column;
  align-self: flex-end;
}

.m-game-card__favorite.m-icon.m-game-heart {
  color: var(--color-game-card-like-icon);
}

.m-icon-container {
  align-items: center;
  background: var(--ic-background);
  border-radius: var(--ic-border-radius);
  box-shadow: inset 0 0 0 var(--ic-border-width) var(--ic-border-color);
  color: var(--ic-color);
  display: flex;
  justify-content: center;
  padding: var(--ic-padding);
}

.m-icon-container img,.m-icon-container svg {
  height: var(--ic-size);
}

.m-button>* {
  transition-duration: var(--m-button-transition-duration);
  transition-property: opacity,scale;
}

.m-button.m-gradient-border {
  --gradient-width: var(--m-button-border-width);
}

.m-button-content {
  align-items: center;
  display: flex;
  gap: var(--m-button-text-margin);
  justify-content: center;
  min-height: var(--m-button-content-height);
}

.m-button-content img,.m-button-content svg {
  color: var(--ic-color);
  height: var(--ic-size);
}

.m-button--primary {
  --m-button-background: var(--color-button-fill-primary-background);
  --m-button-text-color: var(--color-button-fill-primary-text);
  --m-button-border-color: var(--color-button-fill-primary-border);
  --m-button-border-color-hover: var(--color-button-fill-primary-border-hover);
  --m-button-border-color-pressed: var(--color-button-fill-primary-border-active);
  --m-button-background-hover: var(--color-button-fill-primary-background-hover);
  --m-button-text-color-hover: var(--color-button-fill-primary-text-hover);
  --m-button-background-pressed: var(--color-button-fill-primary-background-active);
  --m-button-text-color-pressed: var(--color-button-fill-primary-text-active);
  --ic-color: var(--color-button-fill-primary-icon-container-icon);
  --ic-color-hover: var(--color-button-fill-primary-icon-container-icon-hover);
  --ic-color-pressed: var(--color-button-fill-primary-icon-container-icon-active);
  --ic-background: var(--color-button-fill-primary-icon-container-background);
  --ic-background-hover: var(--color-button-fill-primary-icon-container-background-hover);
  --ic-background-pressed: var(--color-button-fill-primary-icon-container-background-active);
  --ic-border-color: var(--color-button-fill-primary-icon-container-border);
  --ic-border-color-hover: var(--color-button-fill-primary-icon-container-border-hover);
}

.m-button--primary.m-button--outline {
  --m-button-background: var(--color-button-outline-primary-background);
  --m-button-text-color: var(--color-button-outline-primary-text);
  --m-button-border-color: var(--color-button-outline-primary-border);
  --m-button-border-color-hover: var(--color-button-outline-primary-border-hover);
  --m-button-border-color-pressed: var(--color-button-outline-primary-border-active);
  --m-button-background-hover: var(--color-button-outline-primary-background-hover);
  --m-button-text-color-hover: var(--color-button-outline-primary-text-hover);
  --m-button-background-pressed: var(--color-button-outline-primary-background-active);
  --m-button-text-color-pressed: var(--color-button-outline-primary-text-active);
  --ic-color: var(--color-button-outline-primary-icon-container-icon);
  --ic-color-hover: var(--color-button-outline-primary-icon-container-icon-hover);
  --ic-color-pressed: var(--color-button-outline-primary-icon-container-icon-active);
  --ic-background: var(--color-button-outline-primary-icon-container-background);
  --ic-background-hover: var(--color-button-outline-primary-icon-container-background-hover);
  --ic-background-pressed: var(--color-button-outline-primary-icon-container-background-active);
  --ic-border-color: var(--color-button-outline-primary-icon-container-border);
  --ic-border-color-hover: var(--color-button-outline-primary-icon-container-border-hover);
}

.m-button--secondary {
  --m-button-background: var(--color-button-fill-secondary-background);
  --m-button-text-color: var(--color-button-fill-secondary-text);
  --m-button-border-color: var(--color-button-fill-secondary-border);
  --m-button-border-color-hover: var(--color-button-fill-secondary-border-hover);
  --m-button-border-color-pressed: var(--color-button-fill-secondary-border-active);
  --m-button-background-hover: var(--color-button-fill-secondary-background-hover);
  --m-button-text-color-hover: var(--color-button-fill-secondary-text-hover);
  --m-button-background-pressed: var(--color-button-fill-secondary-background-active);
  --m-button-text-color-pressed: var(--color-button-fill-secondary-text-active);
  --ic-color: var(--color-button-fill-secondary-icon-container-icon);
  --ic-color-hover: var(--color-button-fill-secondary-icon-container-icon-hover);
  --ic-color-pressed: var(--color-button-fill-secondary-icon-container-icon-active);
  --ic-background: var(--color-button-fill-secondary-icon-container-background);
  --ic-background-hover: var(--color-button-fill-secondary-icon-container-background-hover);
  --ic-background-pressed: var(--color-button-fill-secondary-icon-container-background-active);
  --ic-border-color: var(--color-button-fill-secondary-icon-container-border);
  --ic-border-color-hover: var(--color-button-fill-secondary-icon-container-border-hover);
}

.m-button--secondary.m-button--outline {
  --m-button-background: var(--color-button-outline-secondary-background);
  --m-button-text-color: var(--color-button-outline-secondary-text);
  --m-button-border-color: var(--color-button-outline-secondary-border);
  --m-button-border-color-hover: var(--color-button-outline-secondary-border-hover);
  --m-button-border-color-pressed: var(--color-button-outline-secondary-border-active);
  --m-button-background-hover: var(--color-button-outline-secondary-background-hover);
  --m-button-text-color-hover: var(--color-button-outline-secondary-text-hover);
  --m-button-background-pressed: var(--color-button-outline-secondary-background-active);
  --m-button-text-color-pressed: var(--color-button-outline-secondary-text-active);
  --ic-color: var(--color-button-outline-secondary-icon-container-icon);
  --ic-color-hover: var(--color-button-outline-secondary-icon-container-icon-hover);
  --ic-color-pressed: var(--color-button-outline-secondary-icon-container-icon-active);
  --ic-background: var(--color-button-outline-secondary-icon-container-background);
  --ic-background-hover: var(--color-button-outline-secondary-icon-container-background-hover);
  --ic-background-pressed: var(--color-button-outline-secondary-icon-container-background-active);
  --ic-border-color: var(--color-button-outline-secondary-icon-container-border);
  --ic-border-color-hover: var(--color-button-outline-secondary-icon-container-border-hover);
}

.m-button--info {
  --m-button-background: var(--color-button-fill-info-background);
  --m-button-text-color: var(--color-button-fill-info-text);
  --m-button-border-color: var(--color-button-fill-info-border);
  --m-button-border-color-hover: var(--color-button-fill-info-border-hover);
  --m-button-border-color-pressed: var(--color-button-fill-info-border-active);
  --m-button-background-hover: var(--color-button-fill-info-background-hover);
  --m-button-text-color-hover: var(--color-button-fill-info-text-hover);
  --m-button-background-pressed: var(--color-button-fill-info-background-active);
  --m-button-text-color-pressed: var(--color-button-fill-info-text-active);
  --ic-color: var(--color-button-fill-info-icon-container-icon);
  --ic-color-hover: var(--color-button-fill-info-icon-container-icon-hover);
  --ic-color-pressed: var(--color-button-fill-info-icon-container-icon-active);
  --ic-background: var(--color-button-fill-info-icon-container-background);
  --ic-background-hover: var(--color-button-fill-info-icon-container-background-hover);
  --ic-background-pressed: var(--color-button-fill-info-icon-container-background-active);
  --ic-border-color: var(--color-button-fill-info-icon-container-border);
  --ic-border-color-hover: var(--color-button-fill-info-icon-container-border-hover);
}

.m-button--info.m-button--outline {
  --m-button-background: var(--color-button-outline-info-background);
  --m-button-text-color: var(--color-button-outline-info-text);
  --m-button-border-color: var(--color-button-outline-info-border);
  --m-button-border-color-hover: var(--color-button-outline-info-border-hover);
  --m-button-border-color-pressed: var(--color-button-outline-info-border-active);
  --m-button-background-hover: var(--color-button-outline-info-background-hover);
  --m-button-text-color-hover: var(--color-button-outline-info-text-hover);
  --m-button-background-pressed: var(--color-button-outline-info-background-active);
  --m-button-text-color-pressed: var(--color-button-outline-info-text-active);
  --ic-color: var(--color-button-outline-info-icon-container-icon);
  --ic-color-hover: var(--color-button-outline-info-icon-container-icon-hover);
  --ic-color-pressed: var(--color-button-outline-info-icon-container-icon-active);
  --ic-background: var(--color-button-outline-info-icon-container-background);
  --ic-background-hover: var(--color-button-outline-info-icon-container-background-hover);
  --ic-background-pressed: var(--color-button-outline-info-icon-container-background-active);
  --ic-border-color: var(--color-button-outline-info-icon-container-border);
  --ic-border-color-hover: var(--color-button-outline-info-icon-container-border-hover);
}

.m-button--s {
  --m-button-padding: var(--button-expand-s,12px);
  --m-button-border-radius: var(--button-border-radius-s,22px);
  --m-button-border-width: var(--button-border-size-s,2px);
  --m-button-content-height: var(--button-content-height-s,20px);
  --m-button-font: var(--font-button-text-s);
  --m-button-text-margin: var(--button-text-container-expand-s,0 8px);
  --ic-padding: var(--button-icon-container-expand-s,0);
  --ic-size: var(--button-icon-container-icon-size-s,20px);
  --ic-border-width: var(--button-icon-container-border-size-s,0);
  --ic-border-radius: var(--button-icon-container-border-radius-s,0);
  letter-spacing: var(--font-button-text-s-ls,0);
}

.m-button--m {
  --m-button-padding: var(--button-expand-m,12px);
  --m-button-border-radius: var(--button-border-radius-m,22px);
  --m-button-border-width: var(--button-border-size-m,2px);
  --m-button-content-height: var(--button-content-height-m,20px);
  --m-button-font: var(--font-button-text-m);
  --m-button-text-margin: var(--button-text-container-expand-m,0 8px);
  --ic-padding: var(--button-icon-container-expand-m,0);
  --ic-size: var(--button-icon-container-icon-size-m,20px);
  --ic-border-width: var(--button-icon-container-border-size-m,0);
  --ic-border-radius: var(--button-icon-container-border-radius-m,0);
  letter-spacing: var(--font-button-text-m-ls,0);
}

.m-button--l {
  --m-button-padding: var(--button-expand-l,12px);
  --m-button-border-radius: var(--button-border-radius-l,22px);
  --m-button-border-width: var(--button-border-size-l,2px);
  --m-button-content-height: var(--button-content-height-l,20px);
  --m-button-font: var(--font-button-text-l);
  --m-button-text-margin: var(--button-text-container-expand-l,0 8px);
  --ic-padding: var(--button-icon-container-expand-l,0);
  --ic-size: var(--button-icon-container-icon-size-l,20px);
  --ic-border-width: var(--button-icon-container-border-size-l,0);
  --ic-border-radius: var(--button-icon-container-border-radius-l,0);
  letter-spacing: var(--font-button-text-l-ls,0);
}

.m-button:active {
  --m-button-background: var(--m-button-background-pressed);
  --m-button-border-color: var(--m-button-border-color-pressed);
  --m-button-text-color: var(--m-button-text-color-pressed);
  --ic-color: var(--ic-color-pressed);
  --ic-border-color: var(--ic-border-color-pressed);
}

.m-button--outline {
  --m-button-border-color-disabled: var(--color-button-outline-secondary-border-disabled);
  --m-button-background-disabled: var(--color-button-outline-secondary-background-disabled);
  --m-button-text-color-disabled: var(--color-button-outline-secondary-text-disabled);
  --ic-color-disabled: var(--color-button-outline-secondary-icon-container-icon-disabled);
  --ic-background-disabled: var(--color-button-outline-secondary-icon-container-background-disabled);
}

.m-button:disabled,.m-button[disabled=true] {
  --m-button-text-color: var(--m-button-text-color-disabled);
  --m-button-background: var(--m-button-background-disabled);
  --m-button-border-color: var(--m-button-border-color-disabled);
  --ic-color: var(--ic-color-disabled);
  --ic-border-color: var(--ic-border-color-disabled);
  --ic-background: var(--ic-background-disabled);
}

.m-tabs {
  --m-tabs-underline-border-radius: var(--tab-underline-line-border-radius);
  align-self: flex-start;
  border-bottom: var(--m-tabs-border-bottom-size) solid var(--m-tabs-border-bottom-color);
  display: flex;
  padding: var(--m-tabs-padding);
}

.m-tabs--autoscroll:after {
  background-color: var(--m-tabs-border-bottom-color);
  bottom: 0;
  content: "";
  height: var(--m-tabs-border-bottom-size);
  left: 0;
  position: absolute;
}

.m-tabs__container {
  display: inherit;
  overflow-x: auto;
  padding-bottom: var(--m-tabs-border-bottom-size);
  scrollbar-width: none;
}

.m-tabs-item {
  color: var(--m-tabs-tab-text-color);
  cursor: pointer;
  display: flex;
  font: var(--m-tabs-font);
  font-variant-numeric: var(--font-variant-numeric);
  justify-content: center;
  transition: all .15s ease-in-out;
}

.m-tabs-item:hover:not(.m-tabs-item.active) {
  --m-tabs-tab-text-color: var(--m-tabs-tab-text-color-hover);
}

.m-tabs-item--active {
  --m-tabs-tab-text-color: var(--m-tabs-tab-text-color-active);
}

.m-tabs-item--active .m-tabs-item-content:after {
  background: var(--m-tabs-underline-color);
  border-radius: var(--m-tabs-underline-border-radius);
  bottom: calc(var(--m-tabs-border-bottom-size)*-1);
  content: "";
  height: var(--m-tabs-underline-size);
  left: 0;
  position: absolute;
}

.m-tabs-item-content {
  align-items: center;
  display: flex;
  gap: var(--m-tabs-tab-text-padding);
  padding: var(--m-tabs-tab-padding);
}

.m-tabs--m {
  --m-tabs-padding: var(--tabs-group-underline-expand-m,0);
  --m-tabs-tab-padding: var(--tab-underline-expand-m,12px);
  --m-tabs-tab-text-padding: var(--tab-text-container-expand-m,0 8px);
  --m-tabs-font: var(--font-tab-text-m);
  --m-tabs-underline-size: var(--line-size-m,var(--line-size-m));
  --m-tabs-border-bottom-size: var(--tabs-group-underline-border-size-m,1px);
  --ic-size: var(--tab-icon-container-icon-size-m,20px);
  --ic-border-width: var(--tab-icon-container-icon-size-m,1px);
  --ic-padding: var(--tab-icon-container-expand-m,0);
}

.m-tabs--primary {
  --m-tabs-tab-text-color: var(--color-tab-underline-primary-text);
  --m-tabs-tab-text-color-hover: var(--color-tab-underline-primary-text-hover);
  --m-tabs-tab-text-color-active: var(--color-tab-underline-primary-text-active);
  --m-tabs-border-bottom-color: var(--color-tabs-group-underline-primary-border-bottom);
  --m-tabs-underline-color: var(--color-tab-underline-primary-underline-background);
  --ic-color: var(--color-tab-underline-primary-icon-container-icon);
  --ic-color-hover: var(--color-tab-underline-primary-icon-container-icon-hover);
}

.m-segment-control {
  border-radius: var(--m-segment-border-radius);
  box-shadow: inset 0 0 0 var(--m-segment-border-width) var(--m-segment-border-color);
  display: grid;
  grid-template-columns: repeat(var(--items-num),1fr);
  padding: var(--m-segment-padding);
}

.m-segment-control.m-gradient-border {
  --gradient-width: var(--m-segment-border-width);
}

.m-segment-control-item {
  align-items: center;
  border-radius: var(--m-segment-tab-border-radius);
  color: var(--m-segment-tab-text-color);
  cursor: pointer;
  display: flex;
  font: var(--m-segment-font);
  font-variant-numeric: var(--font-variant-numeric);
  justify-content: center;
  min-height: var(--m-segment-tab-content-height);
  padding: var(--m-segment-tab-padding);
  transition: all .15s ease-in-out;
}

.m-segment-control-item:hover:not(.m-segment-control-item--active) {
  --m-segment-tab-text-color: var(--m-segment-tab-text-color-hover);
}

.m-segment-control-item--active {
  --m-segment-tab-text-color: var(--m-segment-tab-text-color-active);
  --ic-color: var(--ic-color-active);
  background-color: rgb(85, 97, 144);
}

.m-segment-control--s {
  --m-segment-border-radius: var(--tabs-group-border-radius-s,22px);
  --m-segment-border-width: var(--tabs-group-border-size-s,2px);
  --m-segment-padding: var(--tabs-group-expand-s,0);
  --m-segment-tab-border-radius: var(--tab-border-radius-s,22px);
  --m-segment-tab-border-width: var(--tab-border-size-s,2px);
  --m-segment-tab-padding: var(--tab-expand-s,12px);
  --m-segment-tab-content-height: var(--tab-content-height-s,20px);
  --m-segment-font: var(--font-tab-text-s);
  --m-segment-text-padding: var(--tab-text-container-expand-s,0 8px);
  --ic-size: var(--tab-icon-container-icon-size-s,20px);
  --ic-border-width: var(--tab-icon-container-icon-size-s,1px);
  --ic-padding: var(--tab-icon-container-expand-s,0);
}

.m-segment-control--m {
  --m-segment-border-radius: var(--tabs-group-border-radius-m,22px);
  --m-segment-border-width: var(--tabs-group-border-size-m,2px);
  --m-segment-padding: var(--tabs-group-expand-m,0);
  --m-segment-tab-border-radius: var(--tab-border-radius-m,22px);
  --m-segment-tab-border-width: var(--tab-border-size-m,2px);
  --m-segment-tab-padding: var(--tab-expand-m,12px);
  --m-segment-tab-content-height: var(--tab-content-height-m,20px);
  --m-segment-font: var(--font-tab-text-m);
  --m-segment-text-padding: var(--tab-text-container-expand-m,0 8px);
  --ic-size: var(--tab-icon-container-icon-size-m,20px);
  --ic-border-width: var(--tab-icon-container-icon-size-m,1px);
  --ic-padding: var(--tab-icon-container-expand-m,0);
}

.m-segment-control--secondary {
  --m-segment-tab-background-active: var(--color-tab-secondary-background-active);
  --m-segment-tab-background-hover: var(--color-tab-secondary-background-active);
  --m-segment-tab-text-color: var(--color-tab-secondary-text);
  --m-segment-tab-text-color-active: var(--color-tab-secondary-text-active);
  --m-segment-tab-text-color-hover: var(--color-tab-secondary-text-hover);
  --m-segment-filled-background: var(--color-tabs-group-fill-secondary-background);
  --m-segment-border-color: var(--color-tabs-group-fill-secondary-border);
  --m-segment-outline-border-color: var(--color-tabs-group-outline-secondary-border);
  --m-segment-tab-border-color-active: var(--color-tab-primary-border-active);
  --ic-color: var(--color-tab-secondary-icon-container-icon);
  --ic-color-hover: var(--color-tab-secondary-icon-container-icon-hover);
}

.m-badge {
  background: var(--m-badge-background);
  border-radius: var(--m-badge-border-radius);
  box-shadow: inset 0 0 0 var(--m-badge-border-width,2px) var(--m-badge-border-color);
  color: var(--m-badge-text-color);
  display: inline-flex;
  font: var(--m-badge-font);
  font-variant-numeric: var(--font-variant-numeric);
}

.m-badge-content {
  align-items: center;
  display: flex;
  justify-content: center;
}

.m-badge.m-gradient-border {
  --gradient-color: var(--m-badge-border-color);
}

.m-badge-text {
  align-items: center;
  display: flex;
  gap: var(--m-badge-text-margin);
}

.m-badge img,.m-badge svg {
  height: var(--m-badge-icon-size);
}

.m-badge--secondary {
  --m-badge-background: var(--color-badge-secondary-background);
  --m-badge-border-color: var(--color-badge-secondary-border,#0000);
  --m-badge-text-color: var(--color-badge-secondary-text);
  --ic-color: var(--color-badge-secondary-icon-container-icon);
  --ic-background: var(--color-badge-secondary-icon-container-background);
}

.m-badge--info {
  --m-badge-background: var(--color-badge-info-background);
  --m-badge-border-color: var(--color-badge-info-border,#0000);
  --m-badge-text-color: var(--color-badge-info-text);
  --ic-color: var(--color-badge-info-icon-container-icon);
  --ic-background: var(--color-badge-info-icon-container-background);
}

.m-badge--m {
  --m-badge-padding: var(--badge-expand-m);
  --m-badge-border-width: var(--badge-border-size-m,2px);
  --m-badge-content-height: var(--badge-content-height-m);
  --m-badge-icon-size: var(--badge-icon-container-icon-size-m);
  --ic-padding: var(--badge-icon-container-expand-m);
  --ic-size: var(--m-badge-icon-size);
  --ic-border-width: var(--badge-icon-container-border-size-m);
  --ic-border-radius: var(--badge-icon-container-border-radius-m);
  --m-badge-font: var(--font-badge-text-m);
  --m-badge-text-margin: var(--badge-text-container-expand-m);
  --m-badge-border-radius: var(--badge-border-radius-m);
}

.m-counter {
  background: var(--m-counter-background);
  border-radius: var(--m-counter-border-radius);
  box-shadow: inset 0 0 0 var(--m-counter-border-width,2px) var(--m-counter-border-color);
  color: var(--m-counter-text-color);
  height: var(--m-counter-size);
  min-width: var(--m-counter-size);
}

.m-counter,.m-counter-content {
  align-items: center;
  display: inline-flex;
}

.m-counter--secondary {
  --m-counter-background: var(--color-counter-secondary-background);
  --m-counter-border-color: var(--color-counter-secondary-border,#0000);
}

.m-counter--l {
  --m-counter-padding: var(--counter-expand-l);
  --m-counter-border-width: var(--counter-border-size-l,2px);
  --m-counter-size: var(--counter-size-l);
  --m-counter-border-radius: var(--counter-border-radius-l);
  font: var(--font-counter-text-l);
  font-variant-numeric: var(--font-variant-numeric);
}

.m-prev-next-arrows {
  align-items: center;
  display: inline-flex;
}


.m-card-thumb-image.fadeIn {
  opacity: 1;
  visibility: visible;
  display: block;
}

.m-cdn-image.m-card-thumb-image {
  opacity: 1;
  visibility: visible;
}

.m-card-badges {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--game-card-header-vertical-spacing);
}

.m-game-card {
  --border-radius: var(--game-card-border-radius,12px);
  border-radius: var(--border-radius);
  aspect-ratio: .75;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition: transform .25s ease-out;
  cursor: pointer;
  position: relative;
}

.m-game-card:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border: var(--game-card-border-size) solid var(--color-game-card-border);
  border-radius: var(--border-radius);
}

.m-game-card__buttons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.m-game-card__game-info {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  padding: 20px 8px 8px;
  background: var(--game-footer-bg);
  gap: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.m-game-card__game-info .m-text {
  line-height: 110%;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  max-height: 28px;
  max-width: 100%;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
}

.m-game-card__provider-name {
  font-size: 8px !important;
}

.m-card-thumb {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-color: var(--color-dark-grey-2);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
}

.m-card-thumb:before {
  content: "";
  display: block;
}

.m-card-thumb-image {
  opacity: 0;
}

.m-card-thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.m-cdn-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.m-slider {
  --default-slides-to-show: 1;
  --default-slide-width: 100%;
  --slides-to-show: var(--default-slides-to-show);
  --slide-width: var(--default-slide-width);
}

.m-slider .m-slider__scroll-box {
  -ms-overflow-style: none;
  display: flex;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.m-slider .m-slider__slide {
  flex: 0 0 var(--slide-width);
  scroll-snap-align: start;
}


@media (min-width: 1921px) {
  .m-slider { --slide-width: var(--bp-xxxl-plus, var(--default-slide-width)); --slides-to-show: var(--slides-xxxl-plus, var(--default-slides-to-show)); }
}
@media (max-width: 1920px) {
  .m-slider { --slide-width: var(--bp-xxxl, var(--default-slide-width)); --slides-to-show: var(--slides-xxxl, var(--default-slides-to-show)); }
}
@media (max-width: 1600px) {
  .m-slider { --slide-width: var(--bp-xxl, var(--default-slide-width)); --slides-to-show: var(--slides-xxl, var(--default-slides-to-show)); }
}
@media (max-width: 1366px) {
  .m-slider { --slide-width: var(--bp-xl-2, var(--default-slide-width)); --slides-to-show: var(--slides-xl-2, var(--default-slides-to-show)); }
}
@media (max-width: 1248px) {
  .m-slider { --slide-width: var(--bp-xl, var(--default-slide-width)); --slides-to-show: var(--slides-xl, var(--default-slides-to-show)); }
}
@media (max-width: 960px) {
  .m-slider { --slide-width: var(--bp-l, var(--default-slide-width)); --slides-to-show: var(--slides-l, var(--default-slides-to-show)); }
}
@media (max-width: 768px) {
  .m-slider { --slide-width: var(--bp-m, var(--default-slide-width)); --slides-to-show: var(--slides-m, var(--default-slides-to-show)); }
}
@media (max-width: 590px) {
  .m-slider { --slide-width: var(--bp-s, var(--default-slide-width)); --slides-to-show: var(--slides-s, var(--default-slides-to-show)); }
}
@media (max-width: 460px) {
  .m-slider { --slide-width: var(--bp-xs, var(--default-slide-width)); --slides-to-show: var(--slides-xs, var(--default-slides-to-show)); }
}
@media (max-width: 320px) {
  .m-slider { --slide-width: var(--bp-xxs, var(--default-slide-width)); --slides-to-show: var(--slides-xxs, var(--default-slides-to-show)); }
}

.m-category-slider__wrapper {
  overflow: hidden;
}

.m-category-slider__content {
  grid-gap: 16px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}


.game-category {
  margin-bottom: 40px;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-m,16px);
}

.game-category__title {
  display: flex;
  align-items: center;
  gap: var(--title-block-content-spacing-desktop,8px);
  flex-grow: 1;
}

.game-category__icon {
  width: var(--title-block-icon-container-icon-size-desktop,32px);
  height: var(--title-block-icon-container-icon-size-desktop,32px);
}

.game-category__navigation--top {
  display: flex;
  align-items: center;
}

.provider-card {
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--color-dark-grey-1);
  box-shadow: 0 0 1px rgba(0,0,0,.32),0 40px 64px rgba(0,0,0,.24);
  border-radius: 12px;
  height: 68px;
}

.provider-card__img {
  max-width: 80%;
}

.bets-game {
  cursor: pointer;
  display: inline-grid;
  grid-template-columns: max-content auto;
  align-items: center;
  gap: var(--table-row-spacing);
  font: var(--font-table-text);
  overflow: hidden;
}

.bets-game__media {
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: var(--border-radius-xs);
}

.bets-game__media img,.bets-game__media video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.bets-game__content {
  display: grid;
  grid-template-rows: auto;
}

.bets-game__content-name {
  overflow: hidden;
  white-space: nowrap;
}

.bet-multiplier-cell__container {
  display: flex;
}

.bets-payout {
  font: var(--font-table-text);
}

.bets-payout-green {
  color: rgb(9, 228, 31);
}

.bets-player {
  display: flex;
  align-items: center;
  overflow: hidden;
}

.bets-player__name {
  overflow: hidden;
  white-space: nowrap;
}

.bet-stake-cell__container {
  display: flex;
}

.bets-table-row {
  --bet-row-background: var(--color-dark-grey-0);
  display: grid;
  grid-auto-flow: column;
  border-radius: var(--border-radius-m);
  background: var(--bet-row-background);
  cursor: pointer;
  width: 100%;
}

.bets-table-wrapper .bets-table-row,
.bets-table-wrapper .bets-table-header {
  grid-template-columns: 280px 200px repeat(auto-fit, minmax(90px, 1fr));
}

.bets-table-wrapper__small .bets-table-row,
.bets-table-wrapper__small .bets-table-header {
  grid-template-columns: minmax(60%, 1fr) minmax(110px, max-content);
}

.bets-table-cell {
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  color: var(--color-table-fill-row-text);
  padding: var(--table-row-expand);
}

.bets-table-live {
  --row-height: 42px;
  position: relative;
  width: 100%;
}

.bets-table-live__container {
  width: 100%;
  margin-top: calc(0px - var(--row-height));
  position: relative;
}

.bets-table-header {
  background: rgba(0,0,0,0);
  display: grid;
}

.bets-table-header .bets-table-cell {
  font: var(--font-table-header);
}

.bets-table {
  animation: fade .6s ease-in;
}

.bets-body {
  min-width: 100%;
  overflow-x: auto;
}


.recent-big-wins-section {
  min-height: 300px;
}

.recent-big-wins-card {
  display: flex;
  border-radius: var(--card-border-radius-m);
  height: 84px;
  background-color: var(--color-dark-grey-1);
  min-width: 0;
  opacity: 1;
  visibility: visible;
  position: relative;
  z-index: 1;
}

.recent-big-wins-card__info {
  padding: var(--spacing-xs);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.recent-big-wins-card__game-name {
  white-space: nowrap;
  overflow: hidden;
}

.recent-big-wins-card__player-info {
  display: flex;
  white-space: nowrap;
  align-items: center;
}

.recent-big-wins-card__player-nickname {
  overflow: hidden;
  text-overflow: ellipsis;
}

.recent-big-wins-card__win-amount {
  margin-top: auto;
  overflow: hidden;
}

.recent-big-wins-slider {
  position: relative;
  width: 100%;
  overflow: visible;
  z-index: 2;
}

.recent-big-wins-slider__cards {
  display: grid;
  grid-template-columns: repeat(var(--perRowDefault),1fr);
  grid-gap: 16px;
  margin-top: 0;
  gap: 12px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  width: 100%;
}

.recent-big-wins-slider__cards::-webkit-scrollbar {
  display: none;
}

.recent-big-wins-card__game-icon {
  width: 84px;
  min-height: 84px;
  border-radius: var(--card-border-radius-m);
  overflow: hidden;
  flex-shrink: 0;
}

.recent-big-wins-card__game-icon img {
  height: 100%;
  display: block;
  object-fit: cover;
}

.recent-big-wins-slider__cards + .recent-big-wins-slider__cards {
  margin-top: 20px;
}

.footer-icons {
  align-items: center;
}

.footer-container {
  position: relative;
}

.footer {
  padding-bottom: 100px;
  position: relative;
  z-index: 2;
}

.desktop .footer {
  padding-bottom: 54px;
  padding-top: 24px;
}

.footer-container:after {
  background: 0 100%/contain repeat-x;
  background-image: var(--wow-footer-bg-webp);
  content: "";
  height: 100%;
  inset: 0;
  position: absolute;
  width: 100%;
}

.footer-col,.footer-row {
  align-items: center;
}

.footer-row {
  margin-bottom: 17px;
}

.footer-col {
  gap: 24px;
}

.footer-copyright-text {
  color: var(--color-footer-text,var(--color-mid-grey-5));
  font: var(--font-footer-text,var(--font-body-regular-s));
  margin-top: 16px;
}

.footer-disclaimer__text {
  display: flex;
  flex-flow: column;
  gap: 17px;
  margin-top: 17px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.footer-links {
  align-items: start;
  display: grid;
  flex-grow: 1;
  gap: 12px 32px;
  grid-auto-flow: column;
  grid-template-rows: repeat(4, auto);
  padding: 0;
}

.footer-links>a {
  align-self: flex-start;
  break-inside: avoid;
  color: var(--color-footer-menu-text);
  display: block;
}

.footer-license {
  align-items: center;
  display: flex;
}

.footer-nav {
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 40px;
  padding: 32px 20px;
  background: var(--color-dark-grey-0, #000000);
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-nav__content {
  align-items: flex-start;
  display: flex;
  max-width: 1400px;
  margin: 0 auto;
  flex-direction: column;
  gap: 24px;
}

.footer-nav .nav-logo {
  display: block;
}

.lang-switcher-country {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.footer-nav__socials {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-nav__socials .nav-logo img {
  height: 28px;
  width: auto;
}

.footer-nav__lang {
  min-width: 180px;
}

.footer-links a {
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  transition: color 0.2s ease;
  font-size: 12px;
  line-height: 1.6;
  display: block;
  white-space: nowrap;
}

.footer-links a:hover {
  color: var(--color-pr500, #FFED00);
}

.footer-links[style] {
  display: grid;
}


.live-chat-button {
  transition: all .2s;
}

.bottom-overlays {
  z-index: 104;
  pointer-events: none;
  flex-direction: column;
  display: flex;
  position: fixed;
  bottom: 0;
  left: 0;
}

.notifications {
  display: flex;
  flex-direction: column-reverse;
  max-width: 408px;
  padding: 24px;
  position: fixed;
  right: 0;
  top: 0;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  width: 100%;
}

.hideScrollbar {
  -ms-overflow-style: none;
}

.m-thin-scrollbar {
  scrollbar-color: var(--color-scrollbar-background) #0000;
}

.m-thin-scrollbar::-webkit-scrollbar {
  background: var(--color-dark-grey-1);
  height: 5px;
}

.m-thin-scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--color-dark-grey-5);
}


.nav-logo img {
  max-height: 40px;
  width: auto;
  max-width: 150px;
}

.lobby {
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding-top: 16px;
}

.lobby > * {
  width: 100%;
  box-sizing: border-box;
}

.lobby-wrapper {
  overflow: visible;
}



@keyframes cta-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 237, 0, 0.7);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(255, 237, 0, 0);
  }
}

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

@keyframes slide-up-opacity {
  0% { opacity: 0; transform: translateY(3%); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fade {
  0% { opacity: 0; }
  to { opacity: 1; }
}




@media (max-width: 960px) {
  .header {
    display: grid;
    grid-template-columns: 44px auto 1fr;
    grid-template-rows: 44px 44px;
    padding: 12px 16px;
    height: auto;
    column-gap: 12px;
    row-gap: 0;
  }

  .header__content {
    display: contents;
  }

  .header-menu {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }

  .header__section-right {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    margin-top: 20px;
    gap: 12px;
  }

  .header-search {
    display: none;
  }

  .header-auth-buttons {
    flex: 1;
    gap: 12px;
  }

  .header-auth-buttons .m-button {
    flex: 1;
    height: 44px;
    padding: 12px 16px;
    justify-content: center;
  }

  .header-auth-buttons .m-button--secondary.m-button--outline {
    --m-button-text-color: #32D3DF;
    --m-button-border-color: #32D3DF;
  }
}


@media (min-width: 1600px) {
  .header {
    display: grid;
    grid-template-columns: 44px auto 1fr;
    grid-template-rows: 44px 44px;
    padding: 12px 16px;
    height: auto;
    column-gap: 12px;
    row-gap: 12px;
  }

  .header__content {
    display: contents;
  }

  .header-menu {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }

  .header__section-right {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    margin: 0;
    gap: 12px;
  }

  .header-search {
    display: none;
  }

  .header-auth-buttons {
    flex: 1;
    gap: 12px;
  }

  .header-auth-buttons .m-button {
    flex: 1;
    height: 44px;
    padding: 12px 16px;
    justify-content: center;
  }

  .header-auth-buttons .m-button--secondary.m-button--outline {
    --m-button-background: rgba(255, 237, 0, 0.1);
    --m-button-text-color: #32D3DF;
    --m-button-border-color: #32D3DF;
  }
}


@media (min-width: 1281px) {
  .nav-sidebar {
    width: 64px;
    transform: translateX(0);
  }

  .nav-sidebar.opened {
    transform: translateX(0);
    width: 64px;
  }

  .nav-sidebar.expanded {
    width: 280px;
  }

  .nav-sidebar.opened:not(.expanded) .nav-sidebar-content {
    width: 64px;
  }

  .nav-sidebar.opened.expanded .nav-sidebar-content {
    width: 280px;
  }

  .header {
    position: relative;
    z-index: 9999;
  }

  .app, #container, .lobby-wrapper {
    margin-left: 15px;
    transition: margin-left 0.3s ease;
  }

  .nav-sidebar.expanded ~ .app,
  .nav-sidebar.expanded ~ #container {
    margin-left: 15px;
  }

  .nav-sidebar-header.nav-sidebar-expanded__header .nav-logo {
    display: none;
  }
}


@media (max-width: 1280px) {
  .nav-sidebar {
    width: 100vw;
    max-width: 320px;
    transform: translateX(-100%);
    top: 0;
    height: 100vh;
  }

  .nav-sidebar.opened {
    transform: translateX(0);
  }

  .nav-sidebar-expanded {
    width: 100%;
  }

  .nav-sidebar-expanded-content {
    width: 100%;
    padding: 0;
  }

  .nav-sidebar-expanded-scrollY {
    padding: 16px;
  }

  .nav-sidebar-expanded-items,
  .nav-sidebar-items {
    width: 100%;
  }

  .nav-sidebar-items-title {
    width: 100%;
    box-sizing: border-box;
  }

  
  .recent-big-wins-header__title {
    font-size: 18px;
  }

  .recent-big-wins-card__game-name {
    font-size: 13px;
  }

  .recent-big-wins-card__player-nickname {
    font-size: 11px;
  }

  .recent-big-wins-card__win-amount {
    font-size: 14px;
  }

  .lobby {
    gap: 16px;
    padding-top: 6px;
  }

  
  h1, h2, h3, h4, h5, h6 {
    font-size: 0.9em;
  }

  .lobby-banners {
    min-height: auto;
    padding: 0;
  }

  .lobby-banners .m-slider__scroll-box {
    padding: 0 8px;
  }

  .lobby-banner__text h4,
  .lobby-banner__content h4 {
    font-size: 14px;
    line-height: 18px;
  }

  .lobby-banner__text p,
  .lobby-banner__content p {
    font-size: 12px;
    line-height: 16px;
  }

  .lobby-banner__content {
    padding: 8px;
  }

  .lobby-banner {
    min-height: 160px;
  }

  .lobby-banners .m-button--primary {
    font-size: 12px;
    padding: 6px 12px;
  }

  .bets-table-wrapper .bets-table-row,
  .bets-table-wrapper .bets-table-header {
    grid-template-columns: 150px 98px repeat(auto-fit, minmax(98px, 1fr));
  }
}


@media (max-width: 768px) {
  .nav-sidebar-expanded-support {
    padding: 12px;
    gap: 8px;
  }

  .nav-sidebar-expanded-support-help {
    flex-direction: column;
  }

  .nav-sidebar-expanded-support-help .m-button {
    width: 100%;
  }

  .recent-big-wins-slider__cards:nth-child(2) {
    display: none;
  }
}


@media (min-width: 768px) {
  .m-category-slider__content--cols1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .m-category-slider__content--cols2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .m-category-slider__content--cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .m-category-slider__content--cols4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .m-category-slider__content--cols5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .m-category-slider__content--cols6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .m-category-slider__content--cols7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .m-category-slider__content--cols8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .m-category-slider__content--cols9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }
}


@media (max-width: 1100px) {
  .recent-big-wins-slider__cards {
    grid-template-columns: repeat(var(--perRowMiddle), 1fr);
  }
}

@media (max-width: 960px) {
  .recent-big-wins-slider__cards {
    grid-template-columns: repeat(var(--perRowMin), 1fr);
  }
}

@media (min-width: 1200px) {
  .recent-big-wins-slider__cards--cols5 {
    grid-template-columns: repeat(5, 1fr);
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .recent-big-wins-slider__cards--cols5 {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 480px) and (max-width: 767px) {
  .recent-big-wins-slider__cards--cols5 {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 479px) {
  .recent-big-wins-slider__cards--cols5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 768px) {
  .recent-big-wins-slider__cards {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .recent-big-wins-slider__cards--cols5 {
    grid-template-columns: 1fr;
  }
  .recent-big-wins-card {
    width: 100%;
  }
}


.content-section {
  padding: 16px 0 24px;
}

.content-container {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 20px;
  font-weight: 400 !important;
  color: #706685;
  font-size: 15px;
  line-height: 1.75;
  letter-spacing: 0.01em;
}

.content-container * {
  font-weight: inherit;
}

.content-container h1 {
  font-size: 28px;
  font-weight: 700 !important;
  color: #fff;
  margin: 0 0 8px;
  line-height: 1.3;
}

.content-container h2 {
  font-size: 22px;
  font-weight: 600 !important;
  color: #F2EFFF;
  margin: 28px 0 12px;
  line-height: 1.35;
}

.content-container h3 {
  font-size: 18px;
  font-weight: 600 !important;
  color: #D7D6F9;
  margin: 28px 0 12px;
  line-height: 1.4;
}

.content-container h4 {
  font-size: 16px;
  font-weight: 600 !important;
  color: #B0B8DC;
  margin: 24px 0 10px;
  line-height: 1.4;
}

.content-container h5 {
  font-size: 15px;
  font-weight: 600 !important;
  color: #ABA5CD;
  margin: 20px 0 8px;
  line-height: 1.4;
}

.content-container h6 {
  font-size: 13px;
  font-weight: 600 !important;
  color: #8892B8;
  margin: 16px 0 8px;
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.content-container h1:first-child,
.content-container h2:first-child,
.content-container h3:first-child {
  margin-top: 0;
}

.content-container p {
  margin: 0 0 10px;
  font-weight: 400 !important;
  color: #706685;
}

.content-container p:last-child {
  margin-bottom: 0;
}

.content-container strong,
.content-container b {
  font-weight: 600 !important;
  color: #F2EFFF;
}

.content-container em,
.content-container i {
  font-style: italic;
  color: #ABA5CD;
}

.content-container a {
  color: #5BDCE5;
  text-decoration: none;
  transition: color 0.2s;
}

.content-container a:hover {
  color: #32D3DF;
  text-decoration: underline;
}

.content-container ul,
.content-container ol {
  margin: 0 0 16px;
  padding-left: 24px;
  color: #706685;
}

.content-container ul { list-style-type: disc; }
.content-container ol { list-style-type: decimal; }

.content-container li {
  margin-bottom: 6px;
  line-height: 1.65;
  font-weight: 400 !important;
}

.content-container li::marker {
  color: #5BDCE5;
}

.content-container table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 24px 0;
  font-size: 14px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(88, 92, 131, 0.3);
}

.content-container thead th {
  background: #19162C;
  color: #D7D6F9;
  font-weight: 600 !important;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  text-align: left;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(60, 255, 91, 0.2);
}

.content-container tbody td {
  padding: 10px 16px;
  border-bottom: 1px solid rgba(88, 92, 131, 0.2);
  color: #706685;
  font-weight: 400 !important;
}

.content-container tbody tr:nth-child(even) {
  background: rgba(45, 52, 76, 0.3);
}

.content-container tbody tr:hover {
  background: rgba(45, 52, 76, 0.6);
}

.content-container blockquote {
  margin: 24px 0;
  padding: 16px 20px;
  border-left: 3px solid #302958;
  background: rgba(45, 52, 76, 0.3);
  border-radius: 0 8px 8px 0;
  color: #ABA5CD;
  font-style: italic;
}

.content-container blockquote p {
  margin: 0 0 8px;
  color: #ABA5CD;
}

.content-container blockquote p:last-child {
  margin-bottom: 0;
}

.content-container code {
  background: #19162C;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 14px;
  color: #5BDCE5;
  font-family: monospace;
}

.content-container pre {
  background: #19162C;
  padding: 16px;
  border-radius: 8px;
  overflow-x: auto;
  margin: 24px 0;
}

.content-container pre code {
  background: none;
  padding: 0;
}

.content-container hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, rgba(88, 92, 131, 0.5) 0%, rgba(88, 92, 131, 0.1) 100%);
  margin: 32px 0;
}

.content-container img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 16px 0;
}

.content-container details {
  margin: 8px 0;
  background: rgba(45, 52, 76, 0.4);
  border-radius: 8px;
  border: 1px solid rgba(88, 92, 131, 0.25);
  overflow: hidden;
}

.content-container details summary {
  padding: 14px 20px;
  cursor: pointer;
  font-weight: 500 !important;
  color: #F2EFFF;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: background 0.2s;
}

.content-container details summary:hover {
  background: rgba(62, 72, 106, 0.5);
}

.content-container details summary::-webkit-details-marker {
  display: none;
}

.content-container details summary::after {
  content: "+";
  font-size: 18px;
  font-weight: 400 !important;
  color: #5BDCE5;
  flex-shrink: 0;
  margin-left: 12px;
}

.content-container details[open] summary::after {
  content: "\2212";
}

.content-container details[open] summary {
  border-bottom: 1px solid rgba(88, 92, 131, 0.2);
}

.content-container details > div,
.content-container details > p {
  padding: 14px 20px;
  color: #706685;
  font-weight: 400 !important;
}

.content-container dl { margin: 16px 0; }

.content-container dt {
  font-weight: 600 !important;
  color: #F2EFFF;
  margin-top: 16px;
  padding: 12px 16px;
  background: #19162C;
  border-radius: 8px 8px 0 0;
  border-left: 3px solid #5BDCE5;
}

.content-container dd {
  margin: 0;
  padding: 12px 16px;
  background: rgba(45, 52, 76, 0.3);
  border-radius: 0 0 8px 8px;
  border-left: 3px solid #302958;
  margin-bottom: 8px;
  font-weight: 400 !important;
  color: #706685;
}

.content-container mark {
  background: rgba(2, 252, 42, 0.15);
  color: #5BDCE5;
  padding: 1px 4px;
  border-radius: 3px;
}

.content-container figure { margin: 24px 0; }

.content-container figcaption {
  font-size: 13px;
  color: #706685;
  margin-top: 8px;
  text-align: center;
}

@media (max-width: 768px) {
  .content-container {
    font-size: 14px;
    padding: 0 16px;
  }
  .content-container h1 { font-size: 24px; }
  .content-container h2 { font-size: 20px; }
  .content-container h3 { font-size: 17px; }
  .content-container table {
    display: block;
    overflow-x: auto;
  }
  .content-container thead th,
  .content-container tbody td {
    padding: 8px 12px;
    white-space: nowrap;
  }
}


50% { transform: scale(1.08); }
}
50% { box-shadow: 0 4px 30px rgba(2, 252, 42, 0.5); }
}
@media (max-width: 480px) {
  }



.header__nav-group{display:flex;align-items:center;gap:10px;grid-column:3;grid-row:1}






.hero-title-section{position:relative;padding:28px 0 20px;overflow:hidden}
.hero-title-section::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:120px;height:3px;background:linear-gradient(90deg,transparent,#32D3DF,transparent);border-radius:2px}
.hero-title-container{max-width:900px;margin:0 auto;padding:0 20px;text-align:center}
.hero-title{font-size:32px;font-weight:800;color:#fff;margin:0 0 8px;line-height:1.25;letter-spacing:-0.02em;background:linear-gradient(135deg,#fff 0%,#D7D6F9 50%,#32D3DF 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-subtitle{font-size:15px;color:#706685;margin:0;line-height:1.6;max-width:680px;margin:0 auto}
@media(max-width:768px){.hero-title{font-size:24px}.hero-subtitle{font-size:14px}.hero-title-section{padding:20px 0 16px}}

/* ========== FOOTER MOBILE FIX ========== */
@media (max-width: 768px) {
  .footer-links {
    grid-auto-flow: row !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    gap: 8px !important;
  }

  .footer-links a {
    white-space: normal !important;
    word-wrap: break-word;
  }

  .footer-nav {
    padding: 20px 12px;
  }

  .footer-nav__content {
    flex-direction: column !important;
    gap: 16px;
  }

  .footer-nav__socials {
    flex-wrap: wrap;
    gap: 12px;
  }

  .footer-row {
    flex-direction: column;
    gap: 12px;
  }

  .footer-col {
    gap: 12px;
    flex-wrap: wrap;
  }

  .footer-icons {
    flex-wrap: wrap;
    gap: 8px;
  }

  .footer-container {
    flex-shrink: 0;
  }

  .trust-badges {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
}

@media (max-width: 480px) {
  .footer-links a {
    font-size: 13px;
    padding: 4px 0;
  }

  .footer-nav {
    padding: 16px 10px;
  }
}
    
/* ── TEMPLATE OVERRIDES ─────────────────────────────────── */

.header__logo { display: flex; align-items: center; gap: 8px; }
.header__logo-text { font-size: 1rem; font-weight: 900; color: #fff; letter-spacing: .06em; text-transform: uppercase; }


.seo-content { max-width: 860px; width: 100%; margin: 0 auto; }
.seo-content h3 { font-size: 1rem; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: .05em; cursor: pointer; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.1); transition: color .2s; display: block; margin: 0; }
.seo-content h3.faq-open { color: var(--color-pr500, #FFED00); }
.seo-content h3 + p { display: none; padding: 12px 0 4px; color: var(--color-mid-grey-5, #ABA5CD); line-height: 1.7; }
.seo-content h3.faq-open + p { display: block; }
.seo-content table { width: 100%; border-collapse: collapse; margin: 24px 0; font-size: .88rem; background: #000 !important; border: 1px solid rgba(255,255,255,.1); }
.seo-content th { background: rgba(255,255,255,.08) !important; color: #fff; padding: 10px 14px; text-align: left; font-weight: 700; }
.seo-content td { background: #000 !important; padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,.1); color: var(--color-mid-grey-5, #ABA5CD); }
.seo-content tr:nth-child(even) td { background: rgba(255,255,255,.04) !important; }
.content-section { padding: 32px 16px; max-width: 1400px; margin: 0 auto; }

/* Prevent collapsed sidebar from stealing trackpad wheel events */
.nav-sidebar-wrapped { overflow-y: hidden !important; }
.nav-sidebar-wrapped-content { overflow-y: hidden !important; }