/* latin-ext */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJuktqQ4E-a98bd92496.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJtEtq-836b5877f0.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJuktqQ4E-a98bd92496.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJtEtq-836b5877f0.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJuktqQ4E-a98bd92496.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJtEtq-836b5877f0.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJuktqQ4E-a98bd92496.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJtEtq-836b5877f0.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJuktqQ4E-a98bd92496.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face   {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/QGYvz_MVcBeNP4NJtEtq-836b5877f0.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root  {
  --bg:#202126;
  --panel:#1b1c20;
  --card:#24262b;
  --raised:#2e3137;
  --line:#313239;
  --text:#f7f7fa;
  --muted:#a4a5ac;
  --pink:#ff003d;
  --light:#ff3361;
  --sidebar:320px;
  --header:60px;
  color-scheme:dark;
  font-family:Outfit,Arial,sans-serif
}

*  {
  box-sizing:border-box
}

body  {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-size:14px
}

button,input,select  {
  font:inherit
}

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

button,a  {
  touch-action:manipulation
}

button  {
  cursor:pointer;
  color:inherit;
  border:0;
  background:none
}

a  {
  color:inherit;
  text-decoration:none
}

button:disabled  {
  cursor:not-allowed;
  opacity:.42
}

img  {
  display:block;
  max-width:100%
}

button:focus-visible,a:focus-visible  {
  outline:2px solid var(--light);
  outline-offset:3px
}

input:focus,select:focus  {
  outline:1px solid var(--pink);
  outline-offset:0
}

svg  {
  width:20px;
  height:20px;
  flex:none;
  vertical-align:middle;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}

button svg,a svg  {
  pointer-events:none
}

[hidden]  {
  display:none!important
}

h1,h2,h3,p  {
  margin:0
}

.muted  {
  color:var(--muted)
}

.pink  {
  color:var(--light)
}

.btn  {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:40px;
  padding:0 20px;
  background:var(--card);
  border-radius:8px;
  font-weight:650
}

.btn-primary  {
  background:var(--pink);
  color:white
}

.btn:hover  {
  filter:brightness(1.1)
}

.btn-wide  {
  width:100%
}

.icon-button  {
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:#15161b
}

.icon-button svg  {
  width:16px;
  height:16px
}

.topbar  {
  position:fixed;
  inset:0 0 auto;
  z-index:50;
  height:var(--header);
  display:flex;
  align-items:center;
  gap:12px;
  padding:8px 20px 8px 16px;
  border-bottom:1px solid var(--line);
  background:var(--panel)
}

.menu-toggle  {
  background:var(--card);
  border-radius:12px
}

.mode-switch  {
  display:flex;
  width:240px;
  background:var(--card);
  border-radius:12px;
  padding:4px;
  flex-shrink:0
}

.mode-switch a  {
  height:36px;
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:650;
  color:var(--muted);
  border-radius:9px
}

.mode-switch a.selected  {
  background:var(--raised);
  color:white
}

.mode-switch svg  {
  color:var(--light)
}

.brand  {
  margin-left:38px;
  width:150px;
  flex:none
}

.brand img  {
  width:150px
}

.header-search  {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--card);
  color:var(--muted);
  height:40px;
  max-width:360px;
  flex:1;
  padding:0 14px;
  border-radius:8px;
  text-align:left;
  font-size:13px
}

.header-search svg  {
  width:16px
}

.topbar .btn  {
  padding:0 15px
}

.topbar .btn svg  {
  width:16px
}

.sidebar  {
  position:fixed;
  left:0;
  top:var(--header);
  bottom:0;
  width:var(--sidebar);
  z-index:45;
  background:var(--panel);
  border-right:1px solid var(--line);
  display:flex;
  flex-direction:column;
  transition:transform .2s
}

.side-scroll  {
  overflow:auto;
  padding:14px 12px 20px;
  scrollbar-width:thin;
  scrollbar-color:var(--raised) transparent
}

.side-auth  {
  display:grid;
  gap:8px
}

.side-auth .btn  {
  min-height:48px;
  border-radius:11px
}

.nav-group  {
  margin-top:24px
}

.nav-title  {
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:1px;
  font-weight:600;
  color:#8e9098;
  padding:0 10px;
  margin-bottom:12px
}

.nav-link  {
  display:flex;
  align-items:center;
  gap:11px;
  min-height:52px;
  padding:0 10px;
  color:#bfc0c7;
  font-size:15px;
  border-radius:9px
}

.nav-link>img  {
  width:19px;
  height:20px;
  object-fit:contain
}

.nav-link>svg  {
  width:19px;
  color:var(--light)
}

.nav-link:hover,.nav-link.active  {
  background:var(--card);
  color:white
}

.nav-link.active  {
  font-weight:650
}

.nav-link .badge  {
  margin-left:auto;
  background:var(--pink);
  font-size:10px;
  font-weight:700;
  border-radius:12px;
  padding:4px 6px;
  color:#fff
}

.side-bottom  {
  margin-top:auto;
  padding:12px;
  display:flex;
  gap:8px;
  align-items:center;
  background:var(--panel);
  border-top:1px solid var(--line)
}

.language  {
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--card);
  border-radius:8px;
  padding:10px 12px;
  flex:1;
  font-size:13px;
  font-weight:650
}

.language svg  {
  margin-left:auto
}

.age-mark  {
  border:2px solid var(--light);
  color:var(--light);
  border-radius:50%;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:700
}

.page  {
  margin:var(--header) 0 0 var(--sidebar);
  padding:22px 20px 0;
  min-width:0;
  min-height:calc(100vh - var(--header))
}

.sidebar-collapsed  {
  --sidebar:0px
}

.sidebar-collapsed .sidebar  {
  transform:translateX(-100%);
  width:320px
}

.sidebar-backdrop  {
  display:none
}

.hero  {
  position:relative
}

.hero-viewport  {
  display:block;
  overflow:hidden;
  border-radius:12px;
  aspect-ratio:4/1;
  background:#18191d
}

.hero-viewport img  {
  width:100%;
  height:100%;
  object-fit:cover
}

.hero-dots  {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  height:56px
}

.hero-dot  {
  padding:0;
  width:6px;
  height:6px;
  border-radius:5px;
  background:#303139
}

.hero-dot.active  {
  width:18px;
  background:var(--light)
}

.home-tiles  {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:118px 247px;
  gap:10px;
  margin:4px 0 30px
}

.home-tile  {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:12px;
  background:#777;
  min-width:0
}

.home-tile.slot  {
  grid-row:span 2
}

.home-tile.livecasino  {
  grid-column:4;
  grid-row:1/span 2
}

.home-tile.sports  {
  grid-column:2;
  grid-row:2
}

.home-tile.livebet  {
  grid-column:3;
  grid-row:2
}

.tile-bg  {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-3
}

.tile-character  {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-2
}

.tile-extra  {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-1
}

.home-tile:after  {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(15deg,rgba(20,21,24,.7) 15%,transparent 68%)
}

.tile-copy  {
  position:absolute;
  bottom:18px;
  left:16px;
  right:12px
}

.tile-copy h3  {
  font-size:24px;
  line-height:1.3
}

.tile-copy h3 span  {
  display:block
}

.tile-copy p  {
  font-size:12px;
  margin-top:4px;
  line-height:1.5
}

.slot .tile-copy h3,.matches .tile-copy h3,.tv .tile-copy h3  {
  font-size:18px
}

.tile-copy .accent  {
  color:var(--accent)
}

.tile-bubble  {
  position:absolute;
  top:12px;
  left:12px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:#24262bdd;
  color:var(--accent);
  display:grid;
  place-items:center
}

.tile-tag  {
  position:absolute;
  top:12px;
  right:12px;
  background:#25262b;
  border-radius:16px;
  font-size:10px;
  color:#ffc13c;
  padding:5px 8px;
  font-weight:700
}

.section  {
  margin:0 0 28px
}

.section-heading  {
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  font-size:18px;
  font-weight:700
}

.section-heading .section-icon  {
  color:var(--light);
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  background:#ff003d12;
  border-radius:6px
}

.section-heading .more  {
  margin-left:auto;
  color:var(--light);
  font-size:13px;
  font-weight:500
}

.section-heading .arrows  {
  margin-left:auto;
  display:flex;
  gap:6px
}

.arrows button  {
  width:27px;
  height:27px;
  background:var(--card);
  border-radius:6px
}

.arrows svg  {
  width:15px
}

.sports-placeholder  {
  background:var(--panel);
  min-height:118px;
  border-radius:7px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted)
}

.tabs  {
  display:flex;
  gap:6px;
  overflow:auto;
  scrollbar-width:none
}

.tab  {
  padding:12px 22px;
  white-space:nowrap;
  background:var(--raised);
  border-radius:8px;
  font-weight:650
}

.tab.active  {
  background:var(--pink)
}

.bonus-toolbar  {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin:8px 0 24px
}

.promo-form  {
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--line);
  border-radius:8px;
  padding:4px 7px 4px 12px;
  max-width:300px;
  min-width:0;
  height:42px
}

.promo-form svg  {
  width:16px;
  color:var(--muted)
}

.promo-form input  {
  min-width:0;
  width:160px;
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  color:white;
  font-size:12px
}

.promo-form button  {
  min-height:32px;
  padding:0 23px
}

.bonus-grid  {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px
}

.bonus-card  {
  display:block;
  overflow:hidden;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:13px;
  text-align:left;
  padding:0;
  transition:transform .16s,border-color .16s
}

.bonus-card:hover  {
  transform:translateY(-3px);
  border-color:var(--light)
}

.bonus-card img  {
  aspect-ratio:16/9;
  width:100%;
  object-fit:cover
}

.bonus-card h3  {
  font-size:13px;
  line-height:1.35;
  font-weight:650;
  padding:14px;
  min-height:63px
}

.bonus-empty  {
  text-align:center;
  padding:60px 20px;
  background:var(--panel);
  border-radius:12px;
  color:var(--muted)
}

.jackpots  {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-bottom:30px
}

.jackpot-card  {
  position:relative;
  overflow:hidden;
  min-height:203px;
  border:1px solid #744310;
  border-radius:12px;
  background:radial-gradient(at 80% 40%,#492206,#1b1410)
}

.jackpot-card img  {
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover
}

.jackpot-copy  {
  position:relative;
  padding:22px 16px;
  z-index:1;
  text-shadow:0 1px 8px #000
}

.jackpot-copy small  {
  font-size:12px;
  font-weight:700;
  color:#ffcc4d;
  letter-spacing:1px
}

.jackpot-copy strong  {
  display:block;
  font-size:23px;
  margin-top:7px
}

.jackpot-copy .btn  {
  margin-top:34px;
  font-size:12px;
  min-height:32px;
  background:#e8af32;
  color:#21180b
}

.game-row  {
  display:flex;
  gap:10px;
  overflow:auto;
  scrollbar-width:none;
  padding-bottom:3px
}

.game-row>.game-card  {
  flex:0 0 calc((100% - 70px)/8);
  min-width:0
}

.game-grid  {
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:20px 10px
}

.game-card  {
  position:relative;
  min-width:0
}

.game-image  {
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  border-radius:9px;
  background:var(--card)
}

.game-image>img  {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .2s
}

.game-image:hover>img  {
  transform:scale(1.05)
}

.game-play  {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  opacity:0;
  background:#090a0eb3;
  transition:opacity .15s
}

.game-image:hover .game-play,.game-image:focus-within .game-play  {
  opacity:1
}

.game-play .play-circle  {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  background:var(--pink);
  border-radius:50%
}

.favorite  {
  position:absolute;
  z-index:2;
  right:6px;
  top:6px;
  width:24px;
  height:24px;
  background:#0c0d109e;
  color:#fff8;
  border-radius:50%;
  display:grid;
  place-items:center;
  padding:0
}

.favorite svg  {
  width:14px;
  height:14px
}

.favorite.selected  {
  color:var(--light)
}

.favorite.selected svg  {
  fill:var(--light)
}

.game-name  {
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:650;
  margin-top:7px
}

.game-provider  {
  font-size:11px;
  line-height:1.5;
  color:#7e818a
}

.catalog-tools  {
  background:#24262b66;
  border:1px solid var(--line);
  border-radius:10px;
  padding:14px;
  margin:24px 0
}

.category-search  {
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid var(--line);
  padding-bottom:13px
}

.categories  {
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  overflow:auto;
  scrollbar-width:none
}

.category  {
  white-space:nowrap;
  color:var(--muted);
  padding:9px 13px;
  border-radius:8px;
  font-size:13px
}

.category.active  {
  background:var(--pink);
  color:white
}

.game-search  {
  display:flex;
  align-items:center;
  gap:8px;
  width:220px;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:7px
}

.game-search svg  {
  color:var(--muted);
  width:17px
}

.game-search input  {
  background:none;
  border:0;
  outline:none;
  color:white;
  width:100%;
  min-width:0;
  font-size:12px
}

.provider-row  {
  display:flex;
  align-items:center;
  gap:12px;
  padding-top:14px
}

.provider-toggle  {
  display:flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  border-radius:8px;
  background:#ff003d0d;
  color:var(--light);
  padding:0 14px;
  font-size:13px;
  font-weight:650
}

.provider-toggle svg:last-child  {
  width:14px
}

.favorites-toggle  {
  margin-left:auto;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px
}

.switch  {
  display:inline-block;
  width:30px;
  height:17px;
  background:#464950;
  border-radius:12px;
  position:relative
}

.switch:after  {
  content:'';
  position:absolute;
  width:13px;
  height:13px;
  background:#aaa;
  left:2px;
  top:2px;
  border-radius:50%;
  transition:left .15s
}

.favorites-toggle[aria-pressed=true] .switch  {
  background:var(--pink)
}

.favorites-toggle[aria-pressed=true] .switch:after  {
  left:15px;
  background:#fff
}

.catalog-status  {
  text-align:center;
  color:var(--muted);
  padding:30px 10px 10px;
  font-size:12px
}

.load-more  {
  display:block;
  margin:16px auto 40px;
  min-width:190px
}

.site-footer  {
  margin-top:50px;
  padding:30px 0;
  color:var(--muted);
  border-top:1px solid var(--line)
}

.payments  {
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:28px;
  padding:0 10px 30px;
  border-bottom:1px solid var(--line)
}

.payments img  {
  max-width:75px;
  max-height:28px;
  object-fit:contain;
  filter:grayscale(1);
  opacity:.7
}

.footer-grid  {
  display:grid;
  grid-template-columns:1.5fr repeat(3,1fr);
  gap:30px;
  padding:32px 0
}

.footer-brand img  {
  width:150px;
  margin-bottom:18px
}

.footer-brand p  {
  font-size:12px;
  line-height:1.6
}

.footer-col h3  {
  font-size:13px;
  color:white;
  margin-bottom:15px
}

.footer-col a  {
  display:block;
  font-size:12px;
  margin:11px 0
}

.footer-col a:hover  {
  color:var(--light)
}

.footer-bottom  {
  border-top:1px solid var(--line);
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  font-size:12px;
  gap:12px
}

.chat-button  {
  position:fixed;
  bottom:27px;
  right:24px;
  width:52px;
  height:52px;
  border-radius:50%;
  background:#c9003b;
  color:white;
  z-index:65;
  box-shadow:0 6px 20px #0004;
  display:grid;
  place-items:center
}

.chat-button svg  {
  width:25px;
  height:25px;
  stroke-width:3
}

.to-top  {
  position:fixed;
  bottom:94px;
  right:30px;
  z-index:42;
  background:var(--pink);
  width:40px;
  height:40px;
  border-radius:50%
}

.mobile-nav  {
  display:none
}

.modal-layer  {
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:#000b;
  backdrop-filter:blur(9px);
  overflow:auto
}

.modal-card  {
  position:relative;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  box-shadow:0 24px 80px #0008;
  max-height:calc(100dvh - 48px);
  width:100%;
  overflow:auto
}

.modal-close  {
  position:absolute;
  right:14px;
  top:14px;
  z-index:4
}

.auth-card  {
  max-width:920px;
  display:grid;
  grid-template-columns:292px minmax(0,1fr);
  overflow:hidden
}

.auth-side  {
  background:#202126;
  border-right:1px solid var(--line)
}

.auth-side img  {
  width:100%;
  height:520px;
  object-fit:cover
}

.auth-side-nav button  {
  width:100%;
  display:flex;
  gap:12px;
  align-items:center;
  text-align:left;
  border-bottom:1px solid var(--line);
  height:49px;
  padding:0 20px;
  font-weight:600;
  font-size:13px;
  position:relative
}

.auth-side-nav button.active  {
  background:var(--card)
}

.auth-side-nav button.active:before  {
  content:'';
  position:absolute;
  left:0;
  top:3px;
  bottom:3px;
  width:3px;
  background:var(--light)
}

.auth-side-nav button.active svg  {
  color:var(--light)
}

.auth-content  {
  padding:26px 28px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--raised) transparent
}

.auth-content.login-content  {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:714px
}

.auth-content h1  {
  font-size:23px;
  letter-spacing:-.35px;
  line-height:1.3
}

.auth-subtitle  {
  font-size:13px;
  color:var(--muted);
  font-weight:400;
  margin:3px 0 18px
}

.field  {
  display:flex;
  flex-direction:column;
  gap:5px;
  margin:12px 0;
  font-size:12px;
  font-weight:550;
  min-width:0
}

.field-label  {
  display:flex;
  align-items:center;
  gap:7px
}

.required  {
  color:var(--light);
  font-size:16px
}

.input-wrap  {
  display:flex;
  align-items:center;
  background:var(--card);
  border-radius:9px;
  height:43px;
  padding:0 14px;
  gap:10px;
  border:1px solid transparent
}

.input-wrap:focus-within  {
  border-color:var(--pink)
}

.input-wrap>svg  {
  width:18px;
  color:var(--muted)
}

.input-wrap input,.input-wrap select  {
  background:transparent;
  border:0;
  outline:0;
  min-width:0;
  width:100%;
  height:100%;
  color:#fff;
  font-size:12px
}

.input-wrap input::placeholder  {
  color:#9a9da6
}

.input-wrap select option  {
  background:var(--card)
}

.input-wrap .password-eye  {
  color:var(--muted);
  padding:0;
  display:flex
}

.input-wrap .password-eye svg  {
  width:17px
}

.field-row  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px
}

.remember-row  {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:11px 0 24px;
  font-size:12px;
  color:var(--muted)
}

.check-label  {
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:12px;
  color:var(--muted);
  line-height:1.5
}

.check-label input  {
  accent-color:var(--pink);
  width:18px;
  height:18px;
  margin:0;
  flex:none
}

.text-link  {
  padding:0;
  font-size:inherit;
  color:var(--muted)
}

.text-link:hover  {
  color:var(--light)
}

.auth-submit  {
  min-height:44px;
  margin-top:0
}

.auth-switch  {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:var(--muted);
  font-size:13px;
  margin-top:10px
}

.auth-switch button  {
  color:var(--light);
  font-weight:650;
  padding:0
}

.trust-row  {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  color:var(--muted);
  font-size:12px;
  margin-top:13px
}

.trust-row span  {
  display:flex;
  gap:5px;
  align-items:center
}

.trust-row svg  {
  width:14px;
  height:14px
}

.account-types  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:15px 0 38px
}

.account-type  {
  text-align:left;
  background:var(--card);
  border:1px solid transparent;
  border-radius:13px;
  padding:13px;
  display:flex;
  flex-direction:column;
  gap:6px
}

.account-type.active  {
  border-color:var(--light);
  background:#69142a
}

.account-type.active svg  {
  color:var(--light)
}

.account-type strong  {
  font-size:13px
}

.account-type small  {
  font-size:10px;
  line-height:1.5
}

.form-section-title  {
  font-size:13px;
  display:flex;
  align-items:center;
  gap:10px;
  margin:23px 0 8px
}

.form-section-title:before  {
  content:'';
  width:14px;
  height:2px;
  background:var(--light)
}

.register-content .auth-subtitle  {
  margin-bottom:0
}

.register-content .field  {
  margin:10px 0
}

.register-content .field-row .field  {
  margin:0
}

.terms-row  {
  margin:22px 0 18px
}

.terms-row button  {
  padding:0;
  text-decoration:underline;
  color:var(--light);
  font-size:inherit
}

.private-note  {
  font-size:12px;
  line-height:1.6;
  color:var(--muted);
  padding:15px;
  background:var(--card);
  border-radius:9px;
  margin:15px 0
}

.form-message  {
  font-size:13px;
  line-height:1.5;
  color:#ffc875;
  margin-top:12px
}

.bonus-detail-card  {
  max-width:1200px;
  display:grid;
  grid-template-columns:320px minmax(0,1fr);
  min-height:600px
}

.detail-art  {
  border-right:1px solid var(--line)
}

.detail-art img  {
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover
}

.detail-content  {
  padding:23px;
  min-width:0
}

.detail-eyebrow  {
  font-size:10px;
  display:inline-flex;
  gap:5px;
  color:var(--light);
  padding:5px 9px;
  border-radius:12px;
  background:#ff003d13;
  font-weight:650
}

.detail-eyebrow svg  {
  width:13px;
  height:13px
}

.detail-content h2  {
  font-size:21px;
  margin:8px 30px 8px 0;
  line-height:1.35
}

.detail-tags  {
  display:flex;
  gap:7px;
  flex-wrap:wrap
}

.detail-tags span  {
  padding:5px 11px;
  background:var(--card);
  font-size:10px;
  border-radius:14px
}

.detail-tags span:nth-child(2)  {
  color:#be93ff;
  background:#a053ff15
}

.detail-tags span:nth-child(3)  {
  color:#ff60a9;
  background:#fa337922
}

.detail-tags span:nth-child(4)  {
  color:#ffca53;
  background:#b882191e
}

.detail-stats  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:16px 0
}

.detail-stats>div  {
  padding:14px 20px;
  background:var(--card);
  border-radius:9px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px
}

.detail-stats small  {
  font-size:10px;
  color:#bbb
}

.detail-stats strong  {
  font-size:13px
}

.detail-content h3  {
  font-size:14px;
  margin:18px 0
}

.detail-terms  {
  font-family:Arial,sans-serif;
  color:#afb0b4;
  font-size:16px;
  line-height:1.18
}

.detail-terms p  {
  margin:16px 0
}

.detail-terms h4  {
  font:600 13px Outfit,Arial,sans-serif;
  margin:16px 0 8px
}

.detail-actions  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  border-top:1px solid var(--line);
  padding-top:16px;
  margin-top:30px
}

.btn-gold  {
  background:linear-gradient(#ffcd51,#f29c00);
  color:#101114
}

.provider-modal  {
  max-width:900px;
  padding:28px
}

.provider-modal h2,.search-modal h2,.message-modal h2  {
  font-size:22px;
  margin-bottom:20px
}

.provider-search  {
  display:flex;
  gap:8px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px;
  margin-bottom:20px
}

.provider-search input  {
  background:none;
  border:0;
  outline:0;
  color:#fff;
  width:100%;
  min-width:0
}

.providers-grid  {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  max-height:45vh;
  overflow:auto
}

.provider-option  {
  padding:12px;
  background:var(--card);
  border-radius:8px;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px
}

.provider-option input  {
  accent-color:var(--pink)
}

.provider-actions  {
  display:flex;
  justify-content:flex-end;
  gap:10px;
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:22px
}

.search-modal  {
  max-width:720px;
  padding:28px
}

.search-results  {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
  max-height:55vh;
  overflow:auto
}

.search-links  {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:20px
}

.message-modal  {
  max-width:450px;
  padding:30px
}

.message-modal p  {
  color:var(--muted);
  line-height:1.7
}

.message-modal .btn  {
  margin-top:20px
}

.toast  {
  position:fixed;
  bottom:30px;
  left:50%;
  transform:translateX(-50%);
  z-index:200;
  background:#31343c;
  border:1px solid #555;
  padding:14px 22px;
  border-radius:10px;
  box-shadow:0 8px 30px #0006;
  max-width:calc(100vw - 30px);
  color:white;
  text-align:center
}

.modal-open  {
  overflow:hidden
}

@media(min-width:1700px)  {
  .game-grid  {
    grid-template-columns:repeat(10,minmax(0,1fr))
  }

  .game-row>.game-card  {
    flex-basis:calc((100% - 90px)/10)
  }

  .bonus-grid  {
    grid-template-columns:repeat(5,minmax(0,1fr))
  }

  .hero-viewport  {
    max-height:420px
  }

  .home-tiles  {
    grid-template-rows:150px 280px
  }

}

@media(max-width:1199px)  {
  :root  {
    --sidebar:260px
  }

  .brand  {
    margin-left:6px;
    width:140px
  }

  .brand img  {
    width:140px
  }

  .mode-switch  {
    width:186px
  }

  .header-search  {
    max-width:260px
  }

  .header-search span  {
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis
  }

  .game-grid  {
    grid-template-columns:repeat(6,minmax(0,1fr))
  }

  .game-row>.game-card  {
    flex-basis:calc((100% - 50px)/6)
  }

  .bonus-grid  {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

  .home-tiles  {
    grid-template-rows:100px 220px
  }

  .tile-copy h3  {
    font-size:20px
  }

  .tile-copy  {
    left:12px;
    bottom:14px
  }

  .tile-tag  {
    font-size:9px
  }

  .footer-grid  {
    gap:20px
  }

  .jackpot-copy strong  {
    font-size:18px
  }

  .category-search  {
    flex-wrap:wrap
  }

  .game-search  {
    width:100%
  }

}

@media(max-width:991px)  {
  :root  {
    --sidebar:0px
  }

  .sidebar  {
    width:300px;
    transform:translateX(-100%)
  }

  .sidebar-collapsed .sidebar  {
    width:300px
  }

  .sidebar-open .sidebar  {
    transform:translateX(0)
  }

  .sidebar-open .sidebar-backdrop  {
    display:block;
    position:fixed;
    inset:60px 0 0;
    background:#0008;
    z-index:44
  }

  .brand  {
    margin-left:8px
  }

  .mode-switch  {
    width:190px
  }

  .header-search  {
    max-width:none
  }

  .game-grid  {
    grid-template-columns:repeat(7,minmax(0,1fr))
  }

  .game-row>.game-card  {
    flex-basis:calc((100% - 60px)/7)
  }

  .bonus-grid  {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

  .bonus-detail-card  {
    grid-template-columns:260px minmax(0,1fr)
  }

  .auth-card  {
    max-width:850px;
    grid-template-columns:260px minmax(0,1fr)
  }

  .auth-side img  {
    height:464px
  }

  .auth-content.login-content  {
    min-height:660px
  }

  .detail-content  {
    padding:22px
  }

  .detail-terms  {
    font-size:14px
  }

  .detail-stats>div  {
    padding:12px
  }

  .home-tiles  {
    grid-template-rows:118px 247px
  }

}

@media(max-width:767px)  {
  :root  {
    --header:58px
  }

  .topbar  {
    padding:8px 12px;
    gap:8px
  }

  .mode-switch  {
    display:none
  }

  .brand  {
    width:126px;
    margin:0
  }

  .brand img  {
    width:126px
  }

  .menu-toggle  {
    width:30px;
    height:32px;
    flex:none
  }

  .header-search  {
    margin-left:auto;
    flex:0 0 29px;
    background:none;
    padding:0;
    height:32px
  }

  .header-search span  {
    display:none
  }

  .header-search svg  {
    width:20px;
    height:20px
  }

  .topbar>.btn  {
    min-height:34px;
    padding:0 10px;
    font-size:11px;
    white-space:nowrap;
    gap:4px
  }

  .topbar>.btn svg  {
    display:none
  }

  .page  {
    padding:12px 12px 0;
    margin-top:var(--header);
    padding-bottom:68px
  }

  .hero-viewport  {
    aspect-ratio:2.05/1;
    border-radius:10px
  }

  .hero-viewport img  {
    object-fit:cover;
    object-position:center
  }

  .hero-dots  {
    height:35px;
    gap:5px
  }

  .hero-dot  {
    width:5px;
    height:5px
  }

  .hero-dot.active  {
    width:17px
  }

  .home-tiles  {
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:130px 130px;
    gap:8px;
    margin:4px 0 24px
  }

  .home-tile.slot,.home-tile.livecasino,.home-tile.sports,.home-tile.livebet  {
    grid-row:auto;
    grid-column:auto
  }

  .home-tile.livecasino  {
    order:4
  }

  .home-tile.sports  {
    order:5
  }

  .home-tile.livebet  {
    order:6
  }

  .tile-copy  {
    left:10px;
    bottom:9px;
    right:7px
  }

  .tile-copy h3,.slot .tile-copy h3,.matches .tile-copy h3,.tv .tile-copy h3  {
    font-size:16px;
    line-height:1.12
  }

  .tile-copy p  {
    font-size:9px;
    line-height:1.25;
    max-width:110px
  }

  .tile-bubble  {
    top:8px;
    left:8px;
    width:24px;
    height:24px
  }

  .tile-bubble svg  {
    width:14px;
    height:14px
  }

  .tile-tag  {
    display:none
  }

  .home-tile:after  {
    background:linear-gradient(0deg,#121318dc,transparent 85%)
  }

  .section-heading  {
    font-size:16px;
    margin-bottom:12px;
    gap:8px
  }

  .section  {
    margin-bottom:24px
  }

  .section-heading .more  {
    font-size:11px
  }

  .bonus-toolbar  {
    flex-direction:column;
    align-items:stretch;
    gap:14px;
    margin:0 0 16px
  }

  .tabs  {
    gap:5px
  }

  .tab  {
    padding:11px 15px;
    font-size:12px;
    flex:1
  }

  .promo-form  {
    max-width:none;
    width:100%
  }

  .bonus-grid  {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
  }

  .bonus-card  {
    border-radius:10px
  }

  .bonus-card h3  {
    font-size:12px;
    min-height:65px;
    padding:11px;
    line-height:1.4
  }

  .game-grid  {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:15px 9px
  }

  .game-row>.game-card  {
    flex-basis:calc((100% - 18px)/3)
  }

  .game-name  {
    font-size:12px
  }

  .game-provider  {
    font-size:10px
  }

  .jackpots  {
    display:flex;
    overflow:auto;
    scrollbar-width:none;
    gap:10px;
    margin-bottom:24px
  }

  .jackpot-card  {
    min-width:265px;
    min-height:174px
  }

  .jackpot-copy  {
    padding:18px 13px
  }

  .jackpot-copy .btn  {
    margin-top:24px
  }

  .jackpot-copy strong  {
    font-size:22px
  }

  .catalog-tools  {
    padding:10px;
    margin:20px 0
  }

  .category-search  {
    gap:12px;
    flex-direction:column;
    align-items:stretch
  }

  .categories  {
    width:100%;
    gap:5px
  }

  .category  {
    font-size:12px;
    padding:9px 12px
  }

  .game-search  {
    width:100%
  }

  .provider-row  {
    gap:8px;
    padding-top:10px
  }

  .provider-toggle  {
    padding:0 10px;
    font-size:12px;
    min-height:36px
  }

  .provider-toggle svg  {
    width:15px
  }

  .favorites-toggle  {
    font-size:11px;
    gap:5px
  }

  .favorites-toggle>svg  {
    display:none
  }

  .footer-grid  {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:25px
  }

  .footer-brand  {
    grid-column:span 2
  }

  .site-footer  {
    margin-top:35px;
    padding-top:24px
  }

  .payments  {
    gap:20px
  }

  .payments img  {
    max-width:58px;
    max-height:23px
  }

  .footer-bottom  {
    flex-direction:column;
    text-align:center;
    font-size:10px
  }

  .mobile-nav  {
    position:fixed;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    bottom:0;
    left:0;
    right:0;
    min-height:62px;
    padding:6px 5px max(7px,env(safe-area-inset-bottom));
    z-index:60;
    background:#1b1c20f5;
    border-top:1px solid var(--line);
    backdrop-filter:blur(12px)
  }

  .mobile-nav a,.mobile-nav button  {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    font-size:10px;
    color:#92959e
  }

  .mobile-nav .active  {
    color:var(--light)
  }

  .mobile-nav svg  {
    width:21px;
    height:21px
  }

  .mobile-nav .center-item  {
    color:#fff
  }

  .mobile-nav .center-icon  {
    display:grid;
    place-items:center;
    background:var(--pink);
    border-radius:12px;
    width:35px;
    height:30px
  }

  .chat-button  {
    width:43px;
    height:43px;
    right:14px;
    bottom:78px
  }

  .chat-button svg  {
    width:22px;
    height:22px
  }

  .to-top  {
    right:17px;
    bottom:133px;
    width:35px;
    height:35px
  }

  .modal-layer  {
    padding:12px;
    align-items:center;
    backdrop-filter:blur(6px)
  }

  .modal-card  {
    max-height:calc(100dvh - 24px);
    border-radius:12px
  }

  .auth-card  {
    display:block;
    width:100%;
    max-width:480px
  }

  .auth-side  {
    display:none
  }

  .auth-content  {
    padding:27px 20px;
    max-height:calc(100dvh - 26px);
    overflow:auto
  }

  .auth-content.login-content  {
    min-height:440px
  }

  .auth-content h1  {
    font-size:23px;
    padding-right:18px
  }

  .auth-subtitle  {
    font-size:12px;
    margin-bottom:20px
  }

  .auth-content .field  {
    font-size:12px
  }

  .input-wrap  {
    height:46px;
    padding:0 12px
  }

  .input-wrap input,.input-wrap select  {
    font-size:13px
  }

  .remember-row  {
    font-size:10px
  }

  .check-label  {
    font-size:11px;
    gap:7px
  }

  .trust-row  {
    font-size:11px;
    gap:15px
  }

  .account-types  {
    margin-bottom:25px;
    gap:8px
  }

  .account-type  {
    padding:11px
  }

  .account-type strong  {
    font-size:12px
  }

  .account-type small  {
    font-size:9px
  }

  .field-row  {
    gap:9px
  }

  .register-content .field-row .field  {
    margin:5px 0
  }

  .form-section-title  {
    margin-top:20px
  }

  .bonus-detail-card  {
    display:block;
    max-width:540px;
    min-height:0
  }

  .detail-art  {
    border:0
  }

  .detail-art img  {
    width:100%;
    aspect-ratio:16/9;
    max-height:255px;
    object-fit:cover
  }

  .detail-content  {
    padding:18px
  }

  .detail-content h2  {
    font-size:19px;
    margin-right:0
  }

  .detail-stats  {
    grid-template-columns:1fr
  }

  .detail-stats>div  {
    padding:12px 14px
  }

  .detail-terms  {
    font-size:14px;
    line-height:1.5
  }

  .detail-actions  {
    grid-template-columns:1fr;
    gap:8px;
    margin-top:24px
  }

  .detail-actions .btn  {
    min-height:44px
  }

  .detail-tags  {
    gap:5px
  }

  .detail-tags span  {
    padding:5px 8px;
    font-size:9px
  }

  .provider-modal,.search-modal  {
    padding:23px 16px
  }

  .providers-grid  {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    max-height:50vh
  }

  .provider-option  {
    font-size:11px;
    padding:10px 7px;
    gap:6px
  }

  .provider-actions  {
    gap:7px
  }

  .provider-actions .btn  {
    font-size:12px;
    padding:0 13px
  }

  .search-results  {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px
  }

  .toast  {
    bottom:80px;
    font-size:12px
  }

  .sidebar-open .sidebar-backdrop  {
    top:58px
  }

  .sidebar  {
    padding-bottom:64px
  }

  .side-bottom  {
    padding:10px
  }

}

@media(max-width:374px)  {
  .brand,.brand img  {
    width:100px
  }

  .topbar  {
    gap:6px;
    padding:8px
  }

  .topbar>.btn  {
    padding:0 8px
  }

  .header-search  {
    flex-basis:22px
  }

  .home-tiles  {
    grid-template-rows:116px 116px
  }

  .tile-copy h3,.slot .tile-copy h3,.matches .tile-copy h3,.tv .tile-copy h3  {
    font-size:14px
  }

  .tile-copy p  {
    font-size:8px
  }

  .auth-content  {
    padding:25px 15px
  }

  .field-row  {
    grid-template-columns:1fr
  }

  .provider-toggle  {
    font-size:11px
  }

  .tab  {
    padding:11px 9px
  }

}

.catalog-tools  {
  background:none;
  border:0;
  padding:0;
  margin:26px 0 28px
}

.category-search  {
  border:0;
  padding:0
}

.categories  {
  flex-wrap:wrap;
  gap:7px
}

.category  {
  border-radius:24px;
  background:#24262b;
  padding:9px 14px;
  display:flex;
  align-items:center;
  gap:8px
}

.category svg  {
  width:17px;
  height:17px
}

.provider-row  {
  padding-top:12px;
  gap:10px
}

.provider-toggle  {
  flex:1;
  justify-content:flex-start;
  background:var(--card);
  color:#fff;
  height:45px
}

.provider-toggle .provider-caption  {
  margin-left:auto;
  color:var(--light)
}

.favorites-toggle  {
  background:#411d29;
  color:#a72649;
  margin:0;
  padding:13px 18px;
  border-radius:8px;
  font-weight:600
}

.favorites-toggle>svg  {
  fill:currentColor;
  display:block
}

.favorites-toggle[aria-pressed=true]  {
  color:var(--light)
}

.random-game  {
  height:45px;
  background:var(--card);
  color:var(--muted);
  padding:0 16px;
  border-radius:8px;
  display:flex;
  gap:8px;
  align-items:center;
  font-size:13px
}

.empty-games  {
  grid-column:1/-1;
  text-align:center;
  color:var(--muted);
  padding:48px 10px
}

.jackpot-card  {
  background:#211408;
  min-height:203px;
  border:1px solid #634725
}

.jackpot-top  {
  padding:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  background:radial-gradient(at right,#78501555,transparent)
}

.jackpot-top strong  {
  color:#ffc758;
  font-size:18px
}

.jackpot-top small  {
  display:block;
  font-size:11px;
  color:#b4a079;
  margin-bottom:6px
}

.jackpot-mini  {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  padding:10px
}

.jackpot-mini img  {
  position:static;
  aspect-ratio:1;
  object-fit:cover;
  border-radius:6px;
  width:100%;
  height:auto
}

.jackpot-mini small  {
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#ccc;
  font-size:9px;
  margin-top:5px
}

.jackpot-mini button  {
  padding:0;
  text-align:left;
  min-width:0
}

@media(max-width:991px)  {
  .bonus-detail-card  {
    grid-template-columns:260px minmax(0,1fr)
  }

}

@media(max-width:767px)  {
  .categories  {
    flex-wrap:nowrap
  }

  .provider-row  {
    display:grid;
    grid-template-columns:1fr 1fr
  }

  .provider-toggle  {
    grid-column:span 2
  }

  .favorites-toggle,.random-game  {
    justify-content:center;
    font-size:12px;
    padding:10px;
    height:39px
  }

  .category  {
    font-size:12px;
    gap:6px;
    padding:8px 13px
  }

  .category svg  {
    width:15px
  }

  .bonus-detail-card  {
    display:block
  }

  .jackpot-card  {
    min-width:285px
  }

  .jackpot-top  {
    padding:14px
  }

  .catalog-tools  {
    margin:22px 0
  }

  .jackpot-mini  {
    padding-top:4px
  }

  .jackpot-top strong  {
    font-size:19px
  }

}

.catalog-page>.hero  {
  margin-bottom:32px
}

.to-top svg  {
  transform:rotate(180deg)
}

.home-categories  {
  margin-bottom:16px
}

.tile-art  {
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:100%;
  transform:translate(-50%,-50%);
  z-index:-2;
  overflow:visible
}

.tile-art img  {
  max-width:none
}

.slot .tile-character  {
  left:10.61%;
  top:2.71%;
  width:100%;
  height:107.79%
}

.matches .tile-character  {
  left:45.08%;
  top:-14.6%;
  width:48.84%;
  height:133.47%
}

.tv .tile-character  {
  left:40.39%;
  top:-1.58%;
  width:40%;
  height:auto
}

.livecasino .tile-character  {
  left:16.25%;
  top:4.15%;
  width:88.77%;
  height:95.8%
}

.sports .tile-character  {
  left:-69.48%;
  top:0;
  width:228.48%;
  height:100%
}

.sports .tile-extra  {
  left:24.66%;
  top:.07%;
  width:95.2%;
  height:100%
}

.livebet .tile-bg  {
  left:-63.95%;
  top:.02%;
  width:228.48%;
  height:100%
}

.livebet .tile-character  {
  left:17.47%;
  top:-3.54%;
  width:91.77%;
  height:150.57%
}

.jackpot-card  {
  background:var(--card);
  border-color:var(--line);
  min-height:203px
}

.jackpot-top  {
  background:none;
  justify-content:flex-start;
  padding:12px 12px 8px
}

.jackpot-top .jackpot-logo  {
  position:static;
  width:44px;
  height:36px;
  object-fit:contain
}

.jackpot-top small  {
  color:#c6c7cc;
  margin-bottom:4px;
  font-size:11px
}

.jackpot-top strong  {
  color:#fff;
  font-size:18px
}

.jackpot-live  {
  margin-left:auto;
  color:#38d69c;
  font-size:10px;
  white-space:nowrap
}

.jackpot-tiers  {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
  padding:0 10px 5px
}

.jackpot-tiers span  {
  display:block;
  background:#2e3137;
  border-radius:5px;
  padding:5px;
  color:#afb0b5;
  font-size:8px
}

.jackpot-tiers b  {
  display:block;
  white-space:nowrap;
  font-size:10px;
  color:#e5e5e9;
  margin-top:3px;
  font-weight:500
}

.jackpot-mini  {
  padding:7px 10px 10px
}

.provider-logos  {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px
}

.provider-logos button  {
  background:var(--card);
  border-radius:10px;
  min-height:78px;
  display:grid;
  place-items:center;
  padding:16px
}

.provider-logos img  {
  width:100px;
  height:35px;
  object-fit:contain
}

.game-grid  {
  grid-template-columns:repeat(3,minmax(0,1fr))
}

.game-row>.game-card  {
  flex-basis:calc((100% - 20px)/3)
}

@media(min-width:768px)  {
  .game-row>.game-card  {
    flex-basis:calc((100% - 40px)/5)
  }

}

@media(min-width:1024px)  {
  .game-grid  {
    grid-template-columns:repeat(6,minmax(0,1fr))
  }

  .game-row>.game-card  {
    flex-basis:calc((100% - 50px)/6)
  }

}

@media(min-width:1280px)  {
  .game-grid  {
    grid-template-columns:repeat(8,minmax(0,1fr))
  }

  .game-row>.game-card  {
    flex-basis:calc((100% - 70px)/8)
  }

}

@media(max-width:1023px)  {
  .home-tiles  {
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:176px 185px 185px 176px;
    gap:13px 10px
  }

  .home-tile.sports  {
    grid-column:1/-1;
    grid-row:1;
    order:0
  }

  .home-tile.livebet  {
    grid-column:1;
    grid-row:2;
    order:0
  }

  .home-tile.slot  {
    grid-column:2;
    grid-row:2;
    order:0
  }

  .home-tile.matches  {
    grid-column:1;
    grid-row:3;
    order:0
  }

  .home-tile.tv  {
    grid-column:2;
    grid-row:3;
    order:0
  }

  .home-tile.livecasino  {
    grid-column:1/-1;
    grid-row:4;
    order:0
  }

  .home-tile  {
    border-radius:16px
  }

  .tile-art  {
    top:0;
    transform:translateX(-50%)
  }

  .slot .tile-character  {
    left:20%
  }

  .matches .tile-character  {
    left:38%;
    top:4%;
    width:36%;
    height:auto;
    aspect-ratio:1122/1402;
    object-fit:contain
  }

  .tv .tile-character  {
    left:42%;
    top:3%;
    width:32%;
    height:auto;
    aspect-ratio:1122/1402;
    object-fit:contain
  }

  .livecasino .tile-bg  {
    object-position:right
  }

  .livecasino .tile-character  {
    left:43%;
    top:-6%;
    width:60%;
    height:auto;
    aspect-ratio:1122/1402;
    object-fit:contain
  }

  .sports .tile-extra  {
    left:44%;
    top:0;
    width:56%;
    height:auto;
    aspect-ratio:1200/960;
    object-fit:contain
  }

  .livebet .tile-character  {
    left:29%;
    top:7%;
    width:67%;
    height:auto;
    aspect-ratio:1122/1402;
    object-fit:contain
  }

  .tile-copy  {
    bottom:15px;
    left:14px
  }

  .tile-copy h3,.slot .tile-copy h3,.matches .tile-copy h3,.tv .tile-copy h3  {
    font-size:22px
  }

  .tile-copy p  {
    font-size:11px;
    max-width:200px
  }

  .tile-bubble  {
    top:12px;
    left:12px
  }

  .sports .tile-copy h3,.livecasino .tile-copy h3  {
    font-size:26px
  }

  .tile-tag  {
    display:block;
    font-size:9px;
    top:12px;
    right:10px
  }

  .home-tile.livebet .tile-tag  {
    display:none
  }

  .catalog-page>.hero  {
    margin-bottom:24px
  }

  .jackpots  {
    overflow:auto;
    display:flex
  }

  .jackpot-card  {
    flex:0 0 calc((100% - 28px)/3)
  }

}

@media(max-width:767px)  {
  .jackpot-card  {
    flex:0 0 88%;
    min-width:275px
  }

  .jackpot-top strong  {
    font-size:19px
  }

  .provider-logos  {
    grid-template-columns:repeat(2,1fr)
  }

  .home-tiles  {
    margin-bottom:25px
  }

  .hero-viewport  {
    aspect-ratio:4/1
  }

  .tile-copy h3,.slot .tile-copy h3,.matches .tile-copy h3,.tv .tile-copy h3  {
    font-size:20px
  }

}

.tile-art  {
  width:auto;
  height:auto;
  min-width:100%;
  min-height:100%;
  aspect-ratio:323/246
}

.slot .tile-art,.livecasino .tile-art  {
  aspect-ratio:323/374
}

.matches .tile-art,.tv .tile-art  {
  aspect-ratio:323/118
}

.game-image  {
  isolation:isolate
}

.page>.hero:first-child  {
  isolation:isolate
}

@media(prefers-reduced-motion:reduce)  {
  *  {
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important
  }

}

@media(min-width:768px)  {
  .login-content  {
    padding-bottom:74px
  }

}

.hero-viewport  {
  aspect-ratio:1024/253
}

@media(max-width:767px)  {
  .hero-viewport  {
    aspect-ratio:16/9
  }

}