:root {
  color-scheme: dark;
}

body {
  background: #080c1d;
}

.page.user-route {
  --lobby-bg: #080c1d;
  --lobby-panel: #12182f;
  --lobby-panel-strong: #181f3c;
  --lobby-border: rgba(159, 170, 217, 0.12);
  --lobby-muted: #8e98ba;
  --lobby-green: var(--green, #20e39b);
  --lobby-gold: #f4bd49;
  min-height: 100vh;
  height: 100vh;
  padding-top: 0 !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 82% -15%, rgba(37, 211, 102, 0.12), transparent 28rem),
    radial-gradient(circle at 10% 10%, rgba(115, 79, 255, 0.09), transparent 28rem),
    var(--lobby-bg);
  color: var(--text, #fff);
  font-family: var(--font-family, Inter, Roboto, Arial, sans-serif);
}

.user-route .user-scroll-root {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow-x: clip;
  overflow-y: auto;
  overflow-anchor: none;
  overscroll-behavior-y: contain;
  scrollbar-color: #56617f transparent;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.user-route .user-scroll-root::-webkit-scrollbar {
  width: 5px;
}

.user-route .user-scroll-root::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #56617f;
}

.user-route .header {
  position: fixed;
  z-index: 90;
  top: 0;
  right: 0;
  left: 64px;
  height: 64px;
  border-bottom: 1px solid var(--lobby-border);
  background: rgba(10, 14, 31, 0.92);
  backdrop-filter: blur(18px);
}

.user-route .header__content.desktop {
  display: flex;
  max-width: 1480px;
  height: 64px;
  margin: 0 auto;
  padding: 0 28px;
  align-items: center;
  justify-content: space-between;
}

.user-route .header__nav {
  display: flex;
  height: 100%;
  align-items: center;
  gap: 4px;
}

.user-route .header__nav a {
  position: relative;
  display: inline-flex;
  height: 100%;
  padding: 0 14px;
  align-items: center;
  color: #a9b0cc;
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}

.user-route .header__nav a:hover,
.user-route .header__nav a.active {
  color: #fff;
}

.user-route .header__nav a.active::after {
  position: absolute;
  right: 14px;
  bottom: 0;
  left: 14px;
  height: 3px;
  border-radius: 4px 4px 0 0;
  background: var(--lobby-green);
  content: "";
}

.user-route .header__actions {
  display: flex;
  min-width: 0;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
}

.user-route .header__balance,
.user-route .header__user,
.user-route .notification-bell,
.user-route .menu-button--auth,
.user-route .menu-button--ghost {
  min-height: 40px;
  border: 1px solid var(--lobby-border);
  border-radius: 12px;
  background: var(--lobby-panel);
  color: #fff;
}

.user-route .header__balance {
  display: grid;
  width: auto;
  min-width: 144px;
  height: 44px;
  min-height: 44px;
  padding: 6px 12px;
  align-content: center;
  justify-items: start;
  gap: 1px;
}

.user-route .header__balance small {
  color: var(--lobby-muted);
  font-size: 9px;
  line-height: 11px;
  white-space: nowrap;
}

.user-route .header__balance .menu_balance {
  display: flex;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 0;
  gap: 5px;
  align-items: baseline;
  font-size: 13px;
  font-weight: 800;
  line-height: 17px;
  white-space: nowrap;
}

.user-route .header__balance .upd_symbol {
  color: var(--lobby-green);
  font-size: 10px;
}

.user-route .header__user {
  display: flex;
  width: auto;
  min-width: 92px;
  height: 44px;
  min-height: 44px;
  padding: 0 14px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 7px;
  text-decoration: none;
}

.user-route .header__user svg,
.user-route .notification-bell svg {
  width: 18px;
  height: 18px;
}

.user-route .header__user-label {
  font-size: 12px;
  font-weight: 700;
}

.user-route .header-player-status {
  width: 12px;
  height: 12px;
  margin-right: 0;
  flex: 0 0 12px;
}

.user-route .menu-button--auth,
.user-route .menu-button--ghost {
  padding: 0 17px;
  font-size: 12px;
  font-weight: 800;
}

.user-route .menu-button--auth {
  border-color: var(--lobby-green);
  background: var(--lobby-green);
  color: #06150f;
}

.user-route .menu-button--ghost {
  background: transparent;
}

.user-route .header__content.mobile {
  display: none;
}

.user-route .content,
.user-route .footer {
  margin-left: 64px;
}

.user-route .content {
  min-height: calc(100vh - 64px);
  padding: 64px 0 0;
  background: transparent;
}

.user-route .home-lobby,
.user-route .lobby-catalog-page,
.user-route .sportsbook-page,
.user-route .profile {
  width: min(100%, 1480px);
  margin: 0 auto;
  padding: 18px 28px 56px;
}

.user-route .lobby-rail {
  position: fixed;
  z-index: 100;
  top: 0;
  bottom: 0;
  left: 0;
  display: flex;
  width: 64px;
  overflow: visible;
  padding: 8px 8px 12px;
  border-right: 1px solid var(--lobby-border);
  background: #0e1328;
  flex-direction: column;
  justify-content: flex-start;
  transform: none;
}

.user-route .lobby-rail__logo {
  display: grid;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(244, 189, 73, 0.22);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(244, 189, 73, 0.12), rgba(244, 189, 73, 0.02));
  place-items: center;
}

.user-route .lobby-rail__logo img {
  width: 38px;
  height: 38px;
  object-fit: contain;
}

.user-route .lobby-rail nav {
  display: grid;
  gap: 6px;
}

.user-route .lobby-rail__launchers {
  margin-top: auto;
}

.user-route .lobby-rail__primary {
  margin-top: 6px;
}

.user-route .lobby-rail__secondary {
  margin-top: auto;
}

.user-route .lobby-rail nav a,
.user-route .lobby-rail nav button {
  position: relative;
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 13px;
  background: #171d38;
  color: #8f98bb;
  cursor: pointer;
  place-items: center;
}

.user-route .lobby-rail nav a:hover,
.user-route .lobby-rail nav button:hover,
.user-route .lobby-rail nav .active {
  border-color: rgba(32, 227, 155, 0.28);
  background: linear-gradient(145deg, rgba(32, 227, 155, 0.2), rgba(32, 227, 155, 0.06));
  color: var(--lobby-green);
}

.user-route .lobby-rail nav svg {
  width: 22px;
  height: 22px;
}

.user-route .lobby-rail__slots-icon {
  color: currentColor;
  font-size: 15px;
  font-style: italic;
  font-weight: 950;
  letter-spacing: -0.14em;
  transform: translateX(-1px);
}

.user-route .lobby-rail nav span {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 56px;
  display: none;
  min-width: max-content;
  padding: 8px 10px;
  border: 1px solid var(--lobby-border);
  border-radius: 9px;
  background: #161c35;
  color: #fff;
  font-size: 11px;
  font-weight: 750;
  transform: translateY(-50%);
}

.user-route .lobby-rail nav a:hover span,
.user-route .lobby-rail nav button:hover span {
  display: block;
}

.user-route .mobile-category-panel,
.user-route .casino-menu {
  border: 1px solid var(--lobby-border);
  background: linear-gradient(180deg, #11172e 0%, #0c1125 100%);
  color: #fff;
  box-shadow: 18px 0 48px rgba(0, 0, 0, 0.36);
}

.user-route .mobile-category-panel {
  width: min(310px, calc(100vw - 42px));
  padding: 10px 0 24px;
  border-width: 0 1px 0 0;
  border-radius: 0 18px 18px 0;
}

.user-route .mobile-category-panel__close,
.user-route .casino-menu__section-toggle {
  display: flex;
  width: 100%;
  border: 0;
  background: transparent;
  color: #fff;
  align-items: center;
  justify-content: space-between;
  text-align: left;
}

.user-route .mobile-category-panel__close {
  min-height: 46px;
  margin-bottom: 7px;
  padding: 0 18px;
  border-bottom: 1px solid var(--lobby-border);
  color: #dce3f8;
  font-size: 11px;
  font-weight: 800;
}

.user-route .mobile-category-panel__close svg {
  width: 15px;
  height: 15px;
  transform: rotate(90deg);
}

.user-route .casino-menu__section-toggle {
  min-height: 38px;
  padding: 0 18px;
  color: #aab4d1;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.05em;
}

.user-route .casino-menu__section-toggle.providers {
  margin-top: 8px;
  border-top: 1px solid rgba(159, 170, 217, 0.08);
}

.user-route .casino-menu__section-toggle svg {
  width: 13px;
  height: 13px;
  transition: transform 160ms ease;
}

.user-route .casino-menu__section-toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

.user-route .mobile-category-panel .menu-row,
.user-route .casino-menu .menu-row {
  min-height: 42px;
  color: #e7ebf8;
}

.user-route .mobile-category-panel .menu-row:hover,
.user-route .mobile-category-panel .menu-row.active,
.user-route .casino-menu .menu-row:hover,
.user-route .casino-menu .menu-row.active {
  background: rgba(32, 227, 155, 0.09);
  color: #fff;
}

.user-route .lobby-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(260px, 0.75fr);
  gap: 12px;
}

.user-route .lobby-hero__main {
  position: relative;
  min-height: 310px;
  overflow: hidden;
  border: 1px solid var(--lobby-border);
  border-radius: 18px;
  background: var(--lobby-panel);
  isolation: isolate;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28), 0 0 0 rgba(32, 227, 155, 0);
  animation: lobby-banner-frame-glow 3.4s ease-in-out infinite alternate;
}

.user-route .lobby-banner-media {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
}

.user-route .lobby-banner-media > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  filter: saturate(1.08) contrast(1.04);
  transform: translate3d(var(--banner-shift-x, 0), var(--banner-shift-y, 0), 0) scale(1.055);
  transition: opacity 900ms ease, filter 350ms ease;
  will-change: opacity, transform;
}

.user-route .lobby-banner-media > img.is-active {
  opacity: 1;
  animation: lobby-banner-kenburns 7.2s ease-in-out infinite alternate;
}

.user-route .lobby-hero__main::before {
  position: absolute;
  z-index: 1;
  inset: -35% -20%;
  background: radial-gradient(circle at 65% 50%, rgba(75, 255, 205, 0.24), transparent 24%), radial-gradient(circle at 82% 22%, rgba(71, 153, 255, 0.24), transparent 20%);
  content: "";
  mix-blend-mode: screen;
  pointer-events: none;
  animation: lobby-banner-aurora 5.4s ease-in-out infinite alternate;
}

.user-route .lobby-hero__main::after {
  position: absolute;
  z-index: 3;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.8) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(32, 227, 155, 0.75) 0 1px, transparent 1.8px),
    linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.14) 49%, transparent 63%);
  background-position: 5% 70%, 86% 20%, -130% 0;
  background-size: 73px 73px, 109px 109px, 45% 100%;
  content: "";
  opacity: 0.32;
  mix-blend-mode: screen;
  pointer-events: none;
  animation: lobby-banner-sparkles 8s linear infinite;
}

.user-route .lobby-hero__veil {
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(90deg, rgba(5, 9, 24, 0.98) 0%, rgba(5, 9, 24, 0.78) 42%, rgba(5, 9, 24, 0.18) 76%, rgba(5, 9, 24, 0.28) 100%);
}

.user-route .lobby-hero__copy {
  position: relative;
  z-index: 4;
  display: flex;
  width: min(570px, 70%);
  min-height: 310px;
  padding: 34px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.user-route .lobby-hero__copy > span,
.user-route .lobby-mini-promo small,
.user-route .demo-winners__head span {
  color: var(--lobby-green);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.14em;
}

.user-route .lobby-hero__copy h1 {
  max-width: 520px;
  margin: 9px 0 10px;
  color: #fff;
  font-size: clamp(26px, 3vw, 43px);
  line-height: 1.04;
}

.user-route .lobby-hero__copy p {
  max-width: 510px;
  margin: 0 0 20px;
  color: #a8b0cd;
  font-size: 13px;
  line-height: 1.55;
}

.user-route .lobby-hero__copy > div {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.user-route .lobby-cta {
  display: inline-flex;
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid var(--lobby-border);
  border-radius: 11px;
  background: rgba(23, 29, 56, 0.86);
  color: #fff;
  align-items: center;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  transition: border-color 180ms ease, box-shadow 180ms ease, filter 180ms ease, transform 180ms ease;
}

.user-route .lobby-cta:hover,
.user-route .lobby-cta:focus-visible {
  border-color: rgba(255, 255, 255, 0.36);
  filter: brightness(1.12);
  transform: translateY(-2px);
}

.user-route .lobby-cta--primary {
  border-color: var(--lobby-green);
  background: var(--lobby-green);
  color: #06150f;
  box-shadow: 0 0 0 rgba(32, 227, 155, 0);
  animation: lobby-primary-cta-pulse 1.9s ease-in-out infinite alternate;
}

.user-route .lobby-hero__promos {
  display: grid;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.user-route .lobby-mini-promo {
  position: relative;
  display: flex;
  min-height: 149px;
  overflow: hidden;
  padding: 18px;
  border: 1px solid var(--lobby-border);
  border-radius: 18px;
  background: var(--lobby-panel);
  color: #fff;
  cursor: pointer;
  align-items: flex-end;
  text-align: left;
  text-decoration: none;
  isolation: isolate;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.25), 0 0 0 rgba(32, 227, 155, 0);
  transition: border-color 220ms ease, box-shadow 220ms ease, filter 220ms ease, transform 220ms ease;
  animation: lobby-mini-frame-glow 2.8s ease-in-out infinite alternate;
}

.user-route .lobby-mini-promo::before {
  position: absolute;
  z-index: 3;
  top: -45%;
  bottom: -45%;
  left: -65%;
  width: 32%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: skewX(-18deg);
  animation: lobby-banner-shine 3.6s ease-in-out infinite;
}

.user-route .lobby-mini-promo:hover,
.user-route .lobby-mini-promo:focus-visible {
  border-color: rgba(32, 227, 155, 0.48);
  filter: brightness(1.1) saturate(1.08);
  transform: translateY(-3px) scale(1.012);
}

.user-route .lobby-mini-promo::after {
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(0deg, rgba(7, 11, 28, 0.96), rgba(7, 11, 28, 0.18) 80%);
  content: "";
}

.user-route .lobby-mini-promo span {
  position: relative;
  z-index: 4;
  display: grid;
  gap: 3px;
}

.user-route .lobby-mini-promo strong {
  font-size: 16px;
}

.user-route .lobby-mini-promo em {
  overflow: hidden;
  color: var(--lobby-muted);
  font-size: 10px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-route .lobby-hero__promos > :nth-child(2) .lobby-banner-media > img.is-active {
  animation-direction: alternate-reverse;
}

@keyframes lobby-banner-kenburns {
  from { transform: translate3d(var(--banner-shift-x, 0), var(--banner-shift-y, 0), 0) scale(1.055); }
  to { transform: translate3d(calc(var(--banner-shift-x, 0px) - 1.4%), calc(var(--banner-shift-y, 0px) - 0.8%), 0) scale(1.135); }
}

@keyframes lobby-banner-aurora {
  from { opacity: 0.44; transform: translate3d(-3%, 2%, 0) rotate(-3deg) scale(0.96); }
  to { opacity: 0.86; transform: translate3d(5%, -3%, 0) rotate(4deg) scale(1.07); }
}

@keyframes lobby-banner-sparkles {
  0% { background-position: 5% 70%, 86% 20%, -130% 0; opacity: 0.22; }
  45% { opacity: 0.42; }
  100% { background-position: 15% 48%, 75% 38%, 230% 0; opacity: 0.26; }
}

@keyframes lobby-banner-shine {
  0%, 18% { opacity: 0; transform: skewX(-18deg) translateX(0); }
  35% { opacity: 0.58; }
  58%, 100% { opacity: 0; transform: skewX(-18deg) translateX(560%); }
}

@keyframes lobby-banner-frame-glow {
  from { box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28), 0 0 0 rgba(32, 227, 155, 0); }
  to { box-shadow: 0 20px 48px rgba(0, 0, 0, 0.38), 0 0 24px rgba(32, 227, 155, 0.13); }
}

@keyframes lobby-mini-frame-glow {
  from { box-shadow: 0 14px 30px rgba(0, 0, 0, 0.24), 0 0 10px rgba(32, 227, 155, 0.04); }
  to { box-shadow: 0 16px 36px rgba(0, 0, 0, 0.34), 0 0 18px rgba(32, 227, 155, 0.14); }
}

@keyframes lobby-primary-cta-pulse {
  from { box-shadow: 0 0 7px rgba(32, 227, 155, 0.18); }
  to { box-shadow: 0 0 22px rgba(32, 227, 155, 0.5); }
}

.user-route .lobby-quick-links {
  display: grid;
  margin: 12px 0 26px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.user-route .lobby-quick-links a {
  display: grid;
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--lobby-border);
  border-radius: 14px;
  background: linear-gradient(145deg, #171e39, #11162c);
  color: #fff;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 10px;
  text-decoration: none;
}

.user-route .lobby-quick-links a > span {
  display: grid;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: rgba(32, 227, 155, 0.1);
  color: var(--lobby-green);
  grid-row: 1 / 3;
  place-items: center;
}

.user-route .lobby-quick-links svg {
  width: 21px;
  height: 21px;
}

.user-route .lobby-quick-links strong {
  overflow: hidden;
  align-self: end;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-route .lobby-quick-links small {
  overflow: hidden;
  color: var(--lobby-muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-route .home-feature,
.user-route .casino-games-container,
.user-route .demo-winners {
  margin: 0 0 28px;
}

.user-route .casino-games-container__head,
.user-route .home-feature__head,
.user-route .demo-winners__head {
  display: flex;
  min-height: 42px;
  margin-bottom: 9px;
  align-items: center;
  justify-content: space-between;
}

.user-route .casino-games-container__title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.user-route .casino-games-container__title img {
  width: 21px;
  height: 21px;
  object-fit: contain;
  filter: saturate(0.7);
}

.user-route .casino-games-container__title span,
.user-route .home-feature__head h2,
.user-route .demo-winners__head h2 {
  margin: 0;
  color: #f7f9ff;
  font-size: 17px;
  font-weight: 800;
}

.user-route .casino-games-container__title small,
.user-route .demo-winners__head small {
  color: var(--lobby-muted);
  font-size: 9px;
}

.user-route .casino-games-container__more,
.user-route .home-feature__head > a {
  display: inline-flex;
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid var(--lobby-border);
  border-radius: 9px;
  background: var(--lobby-panel);
  color: #fff;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
}

.user-route .casino-games-container__more svg {
  width: 11px;
}

.user-route .casino-games-container__list {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 9px;
}

.user-route .casino-game {
  --card-tilt-x: 0deg;
  --card-tilt-y: 0deg;
  position: relative;
  aspect-ratio: 3 / 4;
  min-width: 0;
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  background: transparent;
  box-shadow: 0 5px 16px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  isolation: isolate;
  transform-style: preserve-3d;
  will-change: transform, filter;
  transition: transform 190ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 190ms ease, box-shadow 190ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .user-route .casino-game:hover {
    z-index: 4;
    filter: brightness(1.14) saturate(1.16);
    transform: perspective(720px) translateY(-5px) scale(1.035) rotateX(var(--card-tilt-x)) rotateY(var(--card-tilt-y));
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42), 0 0 22px rgba(32, 227, 155, 0.23);
  }

  .user-route .casino-game:hover .casino-game__art {
    transform: scale(1.045);
  }

  .user-route .casino-game:hover .casino-game__content::after {
    animation: casino-card-shine 760ms cubic-bezier(0.2, 0.8, 0.2, 1);
  }
}

.user-route .casino-game:focus-visible {
  z-index: 4;
  outline: 2px solid var(--lobby-green);
  outline-offset: 3px;
  filter: brightness(1.14) saturate(1.16);
  transform: translateY(-4px) scale(1.025);
}

.user-route .casino-game__content {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: inherit;
  background:
    radial-gradient(circle at 50% 34%, rgba(57, 77, 126, 0.44), transparent 58%),
    linear-gradient(155deg, #17213b, #090d1b 72%);
  transform: translateZ(0);
}

.user-route .casino-game__content::after {
  position: absolute;
  z-index: 2;
  top: -25%;
  bottom: -25%;
  left: -70%;
  width: 42%;
  background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.08) 24%, rgba(255, 255, 255, 0.48) 50%, rgba(124, 255, 211, 0.16) 72%, transparent 100%);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: skewX(-18deg) translateX(0);
}

.user-route .casino-game__art {
  position: absolute;
  z-index: 1;
  inset: 0 0 43px;
  width: 100%;
  height: calc(100% - 43px);
  object-fit: contain;
  object-position: center;
  transform: scale(1.001);
  will-change: transform;
  transition: transform 440ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 190ms ease;
}

.user-route .casino-game__fallback {
  position: absolute;
  z-index: 0;
  inset: 0 0 43px;
  display: grid;
  padding: 12px;
  color: rgba(255, 255, 255, 0.74);
  place-content: center;
  gap: 7px;
  text-align: center;
}

.user-route .casino-game__fallback b {
  color: rgba(255, 211, 93, 0.92);
  font-size: clamp(25px, 3vw, 42px);
  letter-spacing: 0.04em;
}

.user-route .casino-game__fallback small {
  display: -webkit-box;
  overflow: hidden;
  font-size: 10px;
  line-height: 1.2;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.user-route .casino-game__meta {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  height: 43px;
  min-width: 0;
  padding: 6px 8px 7px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(17, 24, 45, 0.96), rgba(7, 11, 23, 0.99));
  gap: 1px;
  pointer-events: none;
}

.user-route .casino-game__meta small,
.user-route .casino-game__meta strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-route .casino-game__meta small {
  color: #8fa0c5;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.user-route .casino-game__meta strong {
  color: #f8faff;
  font-size: 10px;
  line-height: 1.25;
}

.user-route .casino-game__content.is-image-missing .casino-game__fallback {
  z-index: 2;
}

.user-route .casino-games-container__title em {
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(255, 92, 35, 0.14);
  color: #ff9e51;
  font-size: 7px;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0.09em;
}

.user-route .casino-games-container--live .casino-games-container__title em {
  background: rgba(214, 85, 255, 0.14);
  color: #f0adff;
}

.user-route .casino-games-container__list--crash,
.user-route .casino-games-container__list--live {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.user-route .casino-game--crash,
.user-route .casino-game--live {
  aspect-ratio: 16 / 10;
  overflow: visible;
  border-radius: 15px;
  background: #130b0b;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.42), 0 0 17px rgba(255, 91, 25, 0.3);
  animation: provider-feature-pulse 1.55s ease-in-out infinite alternate;
}

.user-route .casino-game--live {
  background: #170a20;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.42), 0 0 17px rgba(213, 83, 255, 0.28);
}

.user-route .casino-game--crash::before,
.user-route .casino-game--live::before {
  position: absolute;
  z-index: -1;
  inset: -4px;
  border-radius: 19px;
  background: linear-gradient(120deg, #ff3d00, #ffd64f 28%, #ff6a00 55%, #ff2d00 78%, #ffe276);
  content: "";
  opacity: 0.58;
  filter: blur(8px);
  animation: most-played-fire-aura 1.05s ease-in-out infinite alternate;
}

.user-route .casino-game--live::before {
  background: linear-gradient(120deg, #ffd76b, #ff7648 27%, #d44dff 54%, #6c5cff 78%, #fff0b0);
}

.user-route .casino-game--crash .casino-game__content,
.user-route .casino-game--live .casino-game__content {
  height: 100%;
  aspect-ratio: 16 / 10;
  border: 1px solid rgba(255, 181, 73, 0.74);
  border-radius: inherit;
}

.user-route .casino-game--live .casino-game__content {
  border-color: rgba(245, 180, 255, 0.7);
}

.user-route .casino-game--crash .casino-game__content::before,
.user-route .casino-game--live .casino-game__content::before {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  height: 62%;
  background: linear-gradient(180deg, transparent, rgba(12, 3, 3, 0.9));
  content: "";
  pointer-events: none;
}

.user-route .casino-game--live .casino-game__content::before {
  background: linear-gradient(180deg, transparent, rgba(17, 4, 27, 0.92));
}

.user-route .casino-game--crash .casino-game__content::after,
.user-route .casino-game--live .casino-game__content::after {
  opacity: 0;
  animation: provider-feature-shine 2.9s ease-in-out infinite;
}

.user-route .casino-game--crash .casino-game__art,
.user-route .casino-game--live .casino-game__art {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1.06);
  animation: provider-feature-image 5.8s ease-in-out infinite alternate;
}

.user-route .casino-game--crash .casino-game__fallback,
.user-route .casino-game--live .casino-game__fallback {
  inset: 0;
}

.user-route .provider-feature-card__badge {
  position: absolute;
  z-index: 4;
  top: 9px;
  left: 9px;
  min-width: 38px;
  padding: 6px 8px;
  border: 1px solid rgba(255, 238, 176, 0.8);
  border-radius: 9px;
  background: linear-gradient(145deg, #ffd64d, #ff4c00);
  color: #280900;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-align: center;
  box-shadow: 0 0 16px rgba(255, 102, 0, 0.62);
}

.user-route .casino-game--live .provider-feature-card__badge {
  background: linear-gradient(145deg, #ffe685, #cc4dff);
  color: #210622;
  box-shadow: 0 0 16px rgba(222, 88, 255, 0.58);
}

.user-route .provider-feature-card__copy {
  position: absolute;
  z-index: 4;
  right: 11px;
  bottom: 10px;
  left: 11px;
  display: grid;
  min-width: 0;
  gap: 2px;
  text-shadow: 0 2px 7px #000;
}

.user-route .provider-feature-card__copy small {
  color: #ffbd6d;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.user-route .casino-game--live .provider-feature-card__copy small {
  color: #f0b4ff;
}

.user-route .provider-feature-card__copy strong {
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@keyframes provider-feature-pulse {
  from { filter: brightness(1); }
  to { filter: brightness(1.08) saturate(1.1); }
}

@keyframes provider-feature-shine {
  0%, 14% { opacity: 0; transform: skewX(-18deg) translateX(0); }
  31% { opacity: 0.72; }
  55%, 100% { opacity: 0; transform: skewX(-18deg) translateX(430%); }
}

@keyframes provider-feature-image {
  from { transform: scale(1.06) translate3d(-1%, 0, 0); }
  to { transform: scale(1.13) translate3d(1%, -1%, 0); }
}

@keyframes casino-card-shine {
  0% {
    opacity: 0;
    transform: skewX(-18deg) translateX(0);
  }
  18% { opacity: 0.75; }
  72% { opacity: 0.38; }
  100% {
    opacity: 0;
    transform: skewX(-18deg) translateX(430%);
  }
}

@media (hover: none), (pointer: coarse) {
  .user-route .casino-game:active {
    filter: brightness(1.1) saturate(1.12);
    transform: scale(1.025);
  }

  .user-route .casino-game:active .casino-game__art {
    transform: scale(1.06);
  }
}

@media (prefers-reduced-motion: reduce) {
  .user-route .casino-game,
  .user-route .casino-game__art,
  .user-route .casino-game--crash,
  .user-route .casino-game--live,
  .user-route .casino-game--crash::before,
  .user-route .casino-game--live::before,
  .user-route .casino-game--crash .casino-game__content::after,
  .user-route .casino-game--live .casino-game__content::after {
    animation: none;
    transition-duration: 0.01ms;
  }

  .user-route .casino-game:hover,
  .user-route .casino-game:focus-visible,
  .user-route .casino-game:active {
    transform: none;
  }

  .user-route .casino-game:hover .casino-game__art,
  .user-route .casino-game:active .casino-game__art {
    transform: none;
  }

  .user-route .casino-game__content::after {
    display: none;
  }
}

.user-route .most-played {
  margin: 0 0 30px;
}

.user-route .most-played__head {
  display: flex;
  min-height: 48px;
  margin-bottom: 12px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.user-route .most-played__head > div {
  display: grid;
  gap: 3px;
}

.user-route .most-played__head span {
  color: #ff9d38;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.user-route .most-played__head h2 {
  margin: 0;
  color: #fff;
  font-size: 21px;
  line-height: 1.1;
  text-transform: uppercase;
}

.user-route .most-played__head > small {
  max-width: 280px;
  color: var(--lobby-muted);
  font-size: 9px;
  line-height: 1.4;
  text-align: right;
}

.user-route .crash-feature {
  position: relative;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(77, 239, 255, 0.24);
  border-radius: 18px;
  background:
    radial-gradient(circle at 8% 0%, rgba(55, 225, 255, 0.18), transparent 38%),
    radial-gradient(circle at 92% 110%, rgba(104, 67, 255, 0.2), transparent 42%),
    linear-gradient(145deg, rgba(12, 20, 45, 0.96), rgba(9, 13, 31, 0.96));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.04), 0 16px 42px rgba(0, 0, 0, 0.25);
}

.user-route .crash-feature::before {
  position: absolute;
  top: -90%;
  bottom: -90%;
  left: -25%;
  width: 16%;
  background: linear-gradient(100deg, transparent, rgba(91, 242, 255, 0.18), rgba(255, 255, 255, 0.34), transparent);
  content: "";
  pointer-events: none;
  transform: skewX(-18deg);
  animation: crash-feature-scan 4.6s ease-in-out infinite;
}

.user-route .crash-feature__head {
  position: relative;
  z-index: 2;
}

.user-route .crash-feature__head span {
  color: #58efff;
}

.user-route .crash-feature__head > a {
  display: inline-flex;
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid rgba(88, 239, 255, 0.38);
  border-radius: 10px;
  background: rgba(88, 239, 255, 0.1);
  color: #bffaff;
  align-items: center;
  font-size: 10px;
  font-weight: 850;
  text-decoration: none;
}

.user-route .crash-feature__track {
  position: relative;
  z-index: 1;
}

.user-route .casino-game.crash-feature-card {
  background: #071826;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.44), 0 0 20px rgba(42, 218, 255, 0.34);
}

.user-route .crash-feature-card::before {
  background: linear-gradient(115deg, #21d9ff, #7c5cff 28%, #00f0b5 52%, #22a7ff 75%, #b6fbff);
}

.user-route .crash-feature-card .most-played-card__media {
  border-color: rgba(90, 237, 255, 0.72);
  background: #061522;
}

.user-route .crash-feature-card .most-played-card__rank {
  min-width: 48px;
  padding: 0 7px;
  border-color: rgba(198, 252, 255, 0.82);
  background: linear-gradient(145deg, #69f3ff, #6e5cff);
  color: #071123;
  font-size: 9px;
  letter-spacing: 0.05em;
  box-shadow: 0 0 18px rgba(72, 229, 255, 0.68);
}

.user-route .crash-feature-card .most-played-card__copy small {
  color: #79f3ff;
}

.user-route .crash-feature-card .most-played-card__copy span {
  color: #d8fbff;
}

@keyframes crash-feature-scan {
  0%, 18% { opacity: 0; transform: skewX(-18deg) translateX(0); }
  36% { opacity: 0.85; }
  64%, 100% { opacity: 0; transform: skewX(-18deg) translateX(850%); }
}

.user-route .most-played__track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
}

.user-route .casino-game.most-played-card {
  aspect-ratio: 16 / 9;
  overflow: visible;
  border-radius: 15px;
  background: #190d0b;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.4), 0 0 18px rgba(255, 99, 23, 0.3);
  animation: most-played-card-pulse 1.65s ease-in-out infinite alternate;
}

.user-route .most-played-card::before {
  position: absolute;
  z-index: -1;
  inset: -5px;
  border-radius: 19px;
  background: linear-gradient(115deg, #ff3d00, #ffd54a 24%, #ff6a00 48%, #ff2d00 72%, #ffd54a);
  content: "";
  opacity: 0.62;
  filter: blur(8px);
  animation: most-played-fire-aura 1.1s ease-in-out infinite alternate;
}

.user-route .most-played-card__media {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(255, 178, 63, 0.8);
  border-radius: inherit;
  background: #140b0a;
  transform: translateZ(0);
}

.user-route .most-played-card__media::before {
  position: absolute;
  z-index: 2;
  right: -5%;
  bottom: -18%;
  left: -5%;
  height: 58%;
  background:
    radial-gradient(ellipse at 8% 100%, rgba(255, 239, 111, 0.95) 0 4%, rgba(255, 92, 0, 0.88) 12%, transparent 27%),
    radial-gradient(ellipse at 27% 100%, rgba(255, 223, 78, 0.92) 0 5%, rgba(255, 60, 0, 0.84) 13%, transparent 30%),
    radial-gradient(ellipse at 50% 100%, rgba(255, 245, 147, 0.94) 0 4%, rgba(255, 106, 0, 0.9) 14%, transparent 31%),
    radial-gradient(ellipse at 73% 100%, rgba(255, 223, 78, 0.92) 0 5%, rgba(255, 52, 0, 0.84) 13%, transparent 29%),
    radial-gradient(ellipse at 93% 100%, rgba(255, 239, 111, 0.95) 0 4%, rgba(255, 92, 0, 0.88) 12%, transparent 27%);
  content: "";
  opacity: 0.88;
  mix-blend-mode: screen;
  pointer-events: none;
  transform-origin: center bottom;
  animation: most-played-flames 860ms ease-in-out infinite alternate;
}

.user-route .most-played-card__media::after {
  position: absolute;
  z-index: 4;
  top: -35%;
  bottom: -35%;
  left: -70%;
  width: 34%;
  background: linear-gradient(100deg, transparent, rgba(255, 245, 198, 0.5), rgba(255, 255, 255, 0.82), transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: skewX(-19deg);
  animation: most-played-shine 2.8s ease-in-out infinite;
}

.user-route .most-played-card__media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.08);
  animation: most-played-image-drift 6s ease-in-out infinite alternate;
}

.user-route .most-played-card__shade {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 6, 14, 0.02) 20%, rgba(9, 5, 9, 0.88) 100%);
}

.user-route .most-played-card__rank {
  position: absolute;
  z-index: 5;
  top: 10px;
  left: 10px;
  display: grid;
  min-width: 35px;
  height: 35px;
  border: 1px solid rgba(255, 218, 116, 0.8);
  border-radius: 11px;
  background: linear-gradient(145deg, #ffb536, #ff4d00);
  color: #270b00;
  font-size: 13px;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(255, 104, 0, 0.65);
  place-items: center;
}

.user-route .most-played-card__copy {
  position: absolute;
  z-index: 5;
  right: 13px;
  bottom: 11px;
  left: 13px;
  display: grid;
  gap: 2px;
}

.user-route .most-played-card__copy small {
  overflow: hidden;
  color: #ffbc69;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.user-route .most-played-card__copy strong {
  overflow: hidden;
  color: #fff;
  font-size: 15px;
  line-height: 1.15;
  text-overflow: ellipsis;
  text-shadow: 0 2px 8px #000;
  white-space: nowrap;
}

.user-route .most-played-card__copy span {
  color: #ffe1b5;
  font-size: 9px;
  font-weight: 750;
}

@keyframes most-played-card-pulse {
  from { box-shadow: 0 10px 24px rgba(0, 0, 0, 0.42), 0 0 12px rgba(255, 78, 0, 0.34); }
  to { box-shadow: 0 12px 30px rgba(0, 0, 0, 0.48), 0 0 28px rgba(255, 136, 26, 0.64); }
}

@keyframes most-played-fire-aura {
  from { opacity: 0.48; filter: blur(8px); transform: scale(0.99); }
  to { opacity: 0.78; filter: blur(11px); transform: scale(1.015); }
}

@keyframes most-played-flames {
  from { opacity: 0.72; transform: translateY(5%) scaleX(0.98) scaleY(0.9); }
  to { opacity: 0.98; transform: translateY(-7%) scaleX(1.03) scaleY(1.12); }
}

@keyframes most-played-shine {
  0%, 16% { opacity: 0; transform: skewX(-19deg) translateX(0); }
  32% { opacity: 0.72; }
  55%, 100% { opacity: 0; transform: skewX(-19deg) translateX(520%); }
}

@keyframes most-played-image-drift {
  from { transform: scale(1.08) translate3d(-1.2%, 0, 0); filter: saturate(1.05); }
  to { transform: scale(1.15) translate3d(1.4%, -1%, 0); filter: saturate(1.2); }
}

@media (prefers-reduced-motion: reduce) {
  .user-route .casino-game.most-played-card,
  .user-route .most-played-card::before,
  .user-route .most-played-card__media::before,
  .user-route .most-played-card__media::after,
  .user-route .most-played-card__media > img {
    animation: none;
  }

  .user-route .most-played-card__media > img {
    transform: scale(1.08);
  }
}

@media (max-width: 1100px) and (min-width: 821px) {
  .user-route .most-played__track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.user-route .casino_favorite_play {
  position: absolute;
  z-index: 3;
  top: 7px;
  right: 7px;
  display: grid;
  width: 29px;
  height: 29px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9px;
  background: rgba(7, 11, 28, 0.74);
  color: #fff;
  place-items: center;
}

.user-route .casino-game__provider,
.user-route .casino-game__name {
  overflow: hidden;
  padding: 0 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-route .casino-game__provider {
  padding-top: 8px;
  color: var(--lobby-muted);
  font-size: 8px;
  text-transform: uppercase;
}

.user-route .casino-game__provider .provider-mark {
  display: none;
}

.user-route .casino-game__name {
  padding-top: 3px;
  padding-bottom: 10px;
  color: #fff;
  font-size: 11px;
  font-weight: 750;
}

.user-route .home-crash__track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.user-route .home-crash-card {
  min-height: 150px;
  border: 1px solid var(--lobby-border);
  border-radius: 14px;
}

.user-route .demo-winners {
  overflow: hidden;
  padding: 0;
}

.user-route .demo-winners__head {
  min-height: 30px;
  margin: 0 0 8px;
}

.user-route .demo-winners__head h2 {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 15px;
}

.user-route .demo-winners__head h2 > i {
  width: 10px;
  height: 10px;
  border: 3px solid rgba(32, 227, 155, 0.2);
  border-radius: 50%;
  background: var(--lobby-green);
  box-shadow: 0 0 12px rgba(32, 227, 155, 0.75);
}

.user-route .demo-winners__ticker {
  overflow: hidden;
  margin: 0;
  padding: 8px 7px;
  border-radius: 11px;
  background: rgba(14, 19, 40, 0.72);
}

.user-route .demo-winners__ticker > div {
  display: flex;
  width: max-content;
  gap: 8px;
  animation: lobby-winners-ticker 34s linear infinite;
}

.user-route .demo-winner {
  display: grid;
  width: 58px;
  flex: 0 0 58px;
  gap: 4px;
  border-radius: 9px;
  cursor: pointer;
  transition: filter 160ms ease, transform 160ms ease;
}

.user-route .demo-winner:hover,
.user-route .demo-winner:focus-visible {
  outline: none;
  filter: brightness(1.18) saturate(1.12);
  transform: translateY(-2px) scale(1.035);
}

.user-route .demo-winner > img {
  width: 58px;
  height: 77px;
  border-radius: 8px;
  object-fit: cover;
}

.user-route .demo-winner > span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.user-route .demo-winner small,
.user-route .demo-winner strong {
  overflow: hidden;
  max-width: 58px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-route .demo-winner small {
  color: #e4e8f6;
  font-size: 8px;
  font-weight: 750;
}

.user-route .player-status {
  position: relative;
  display: inline-grid;
  width: 9px;
  height: 9px;
  margin-right: 3px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 50%;
  font-style: normal;
  vertical-align: -1px;
  box-shadow: 0 0 5px currentColor;
  place-items: center;
}

.user-route .player-status::after {
  color: rgba(14, 19, 40, 0.78);
  content: "◆";
  font-size: 5px;
  line-height: 1;
}

.user-route .player-status--silver {
  background: linear-gradient(145deg, #f4f7fb, #8d99a8);
  color: #cbd3dd;
}

.user-route .player-status--copper {
  background: linear-gradient(145deg, #efb077, #91451e);
  color: #c77843;
}

.user-route .player-status--gold {
  background: linear-gradient(145deg, #fff0a1, #d29a16);
  color: #f1c449;
}

.user-route .player-status--platinum {
  background: linear-gradient(145deg, #e5ffff, #65aeb7);
  color: #9de6e9;
}

.user-route .player-status--diamond {
  border-radius: 3px;
  background: linear-gradient(145deg, #f0deff, #9b58e5);
  color: #c58cff;
  transform: rotate(45deg) scale(0.82);
}

.user-route .player-status--diamond::after {
  transform: rotate(-45deg);
}

.user-route .demo-winner strong {
  color: var(--lobby-green);
  font-size: 8px;
  font-weight: 850;
}

@keyframes lobby-winners-ticker {
  to { transform: translateX(-50%); }
}

.user-route .banners {
  --banner-height: clamp(155px, 18vw, 235px);
  position: relative;
  height: calc(var(--banner-height) + 34px);
  margin-bottom: 16px;
  overflow: hidden;
  border: 1px solid rgba(32, 227, 155, 0.14);
  border-radius: 17px;
  isolation: isolate;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.28), 0 0 16px rgba(32, 227, 155, 0.07);
  animation: lobby-banner-frame-glow 3.4s ease-in-out infinite alternate;
}

.user-route .banners::before {
  position: absolute;
  z-index: 3;
  top: -30%;
  bottom: calc(34px - 30%);
  left: -45%;
  width: 24%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.34), rgba(32, 227, 155, 0.18), transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: skewX(-17deg);
  animation: lobby-banner-shine 4.2s ease-in-out infinite;
}

.user-route .banners::after {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  height: var(--banner-height);
  border-radius: 17px;
  background: radial-gradient(circle at 80% 20%, rgba(32, 227, 155, 0.14), transparent 28%), linear-gradient(110deg, transparent 42%, rgba(255, 255, 255, 0.1) 50%, transparent 58%);
  background-size: auto, 220% 100%;
  content: "";
  opacity: 0.55;
  mix-blend-mode: screen;
  pointer-events: none;
  animation: lobby-banner-sparkles 8s linear infinite;
}

.user-route .banner,
.user-route .banner img {
  height: var(--banner-height);
  border-radius: 17px;
}

.user-route .banner img {
  width: 100%;
  object-fit: cover;
  filter: saturate(1.08) contrast(1.03);
  transform: translate3d(var(--banner-shift-x, 0), var(--banner-shift-y, 0), 0) scale(1.045);
  transition: filter 260ms ease;
  will-change: transform;
}

.user-route .banner img[data-banner-active] {
  animation: lobby-banner-kenburns 7.2s ease-in-out infinite alternate;
}

.user-route .banners:hover .banner img[data-banner-active] {
  filter: brightness(1.08) saturate(1.16) contrast(1.04);
}

.user-route .banner-arrow {
  z-index: 5;
  border-color: var(--lobby-border);
  background: rgba(10, 14, 31, 0.72);
}

.user-route .banner-dots {
  z-index: 5;
  top: auto;
  bottom: 9px;
  padding: 1px 0;
}

.user-route .live-feature {
  position: relative;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(255, 205, 103, 0.26);
  border-radius: 18px;
  background:
    radial-gradient(circle at 12% -10%, rgba(255, 196, 70, 0.18), transparent 38%),
    radial-gradient(circle at 92% 110%, rgba(181, 33, 255, 0.18), transparent 43%),
    linear-gradient(145deg, rgba(29, 14, 39, 0.97), rgba(11, 13, 31, 0.97));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 16px 42px rgba(0, 0, 0, 0.28);
}

.user-route .live-feature::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: repeating-linear-gradient(115deg, transparent 0 42px, rgba(255, 221, 140, 0.025) 42px 44px);
  content: "";
  pointer-events: none;
  animation: live-feature-grid 8s linear infinite;
}

.user-route .live-feature__head,
.user-route .live-feature__track {
  position: relative;
  z-index: 1;
}

.user-route .live-feature__head span {
  color: #ffd166;
}

.user-route .live-feature__head > a {
  display: inline-flex;
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid rgba(255, 209, 102, 0.38);
  border-radius: 10px;
  background: rgba(255, 209, 102, 0.1);
  color: #ffe7ac;
  align-items: center;
  font-size: 10px;
  font-weight: 850;
  text-decoration: none;
}

.user-route .casino-game.live-feature-card {
  background: #1c0c24;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.44), 0 0 20px rgba(218, 83, 255, 0.3);
}

.user-route .live-feature-card::before {
  background: linear-gradient(115deg, #ffd166, #ff7a45 28%, #d94dff 52%, #6d5cff 76%, #fff0b5);
}

.user-route .live-feature-card .most-played-card__media {
  border-color: rgba(255, 211, 110, 0.72);
  background: #170b20;
}

.user-route .live-feature-card .most-played-card__rank {
  min-width: 48px;
  padding: 0 7px;
  border-color: rgba(255, 239, 183, 0.85);
  background: linear-gradient(145deg, #ffe585, #c34cff);
  color: #23091e;
  font-size: 9px;
  letter-spacing: 0.05em;
  box-shadow: 0 0 18px rgba(230, 106, 255, 0.62);
}

.user-route .live-feature-card .most-played-card__copy small {
  color: #ffd983;
}

.user-route .live-feature-card .most-played-card__copy span {
  color: #f9ddff;
}

@keyframes live-feature-grid {
  to { background-position: 180px 0; }
}

.user-route .lobby-catalog-tools {
  display: grid;
  margin-bottom: 24px;
  gap: 10px;
}

.user-route .standalone-provider-page {
  width: 100%;
}

.user-route .standalone-provider-search {
  margin: 16px 0 24px;
}

.user-route .standalone-provider-search .casino-menu__search-row,
.user-route .standalone-provider-search .casino-menu__search {
  width: 100%;
}

.user-route .lobby-search .casino-menu__search-row,
.user-route .lobby-search .casino-menu__search {
  width: 100%;
}

.user-route .lobby-search .casino-menu__search {
  height: 46px;
  border: 1px solid var(--lobby-border);
  border-radius: 13px;
  background: var(--lobby-panel);
}

.user-route .lobby-search input {
  color: #fff;
}

.user-route .lobby-filter-track,
.user-route .lobby-provider-track {
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.user-route .lobby-provider-track.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}

.user-route .lobby-provider-track.is-dragging .lobby-provider {
  pointer-events: none;
}

.user-route .lobby-provider-track {
  display: flex;
  overflow-x: auto;
  padding: 1px 1px 4px;
  gap: 7px;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.user-route .lobby-provider-carousel {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.user-route .lobby-provider-arrow {
  display: grid;
  width: 34px;
  height: 36px;
  padding: 0;
  border: 1px solid rgba(45, 224, 175, 0.28);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(24, 52, 78, 0.96), rgba(15, 22, 48, 0.98));
  color: var(--lobby-green);
  place-items: center;
  cursor: pointer;
  box-shadow: 0 5px 16px rgba(0, 0, 0, 0.22);
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.user-route .lobby-provider-arrow:hover {
  border-color: rgba(45, 224, 175, 0.7);
  background: linear-gradient(145deg, rgba(26, 82, 91, 0.98), rgba(18, 31, 62, 0.98));
  transform: scale(1.04);
}

.user-route .lobby-provider-arrow svg {
  width: 15px;
  height: 15px;
}

.user-route .lobby-provider-arrow--prev svg {
  transform: rotate(90deg);
}

.user-route .lobby-provider-arrow--next svg {
  transform: rotate(-90deg);
}

.user-route .lobby-filter-track::-webkit-scrollbar,
.user-route .lobby-provider-track::-webkit-scrollbar {
  display: none;
}

@media (max-width: 700px) {
  .user-route .lobby-provider-carousel {
    display: block;
  }

  .user-route .lobby-provider-arrow {
    display: none;
  }
}

.user-route .lobby-filter-group {
  display: grid;
  min-width: 0;
  gap: 6px;
}

.user-route .lobby-filter-group__label {
  display: flex;
  min-height: 18px;
  padding: 0 2px;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.user-route .lobby-filter-group__label strong {
  color: #f5f7ff;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.user-route .lobby-filter-group__label small {
  color: var(--lobby-muted);
  font-size: 8px;
}

.user-route .lobby-filter,
.user-route .lobby-provider,
.user-route .lobby-provider-trigger {
  display: inline-flex;
  min-width: max-content;
  min-height: 36px;
  padding: 0 11px;
  border: 1px solid var(--lobby-border);
  border-radius: 10px;
  background: var(--lobby-panel);
  color: #aeb6d0;
  align-items: center;
  gap: 7px;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
  scroll-snap-align: start;
}

.user-route .lobby-filter small,
.user-route .lobby-provider small {
  color: #687394;
  font-size: 8px;
}

.user-route .lobby-filter.active,
.user-route .lobby-provider.active,
.user-route .lobby-provider-trigger.active {
  border-color: rgba(32, 227, 155, 0.34);
  background: rgba(32, 227, 155, 0.1);
  color: var(--lobby-green);
}

.user-route .lobby-provider-trigger svg {
  width: 12px;
  height: 12px;
  transition: transform 160ms ease;
}

.user-route .lobby-provider-trigger[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

.user-route .lobby-provider-menu {
  overflow: hidden;
  border: 1px solid var(--lobby-border);
  border-radius: 13px;
  padding: 12px;
  background: linear-gradient(145deg, #12182f, #0e1429);
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.22);
}

.user-route .lobby-provider-menu__head {
  display: flex;
  margin-bottom: 10px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.user-route .lobby-provider-menu__head strong {
  color: #fff;
  font-size: 11px;
}

.user-route .lobby-provider-menu__head small {
  color: var(--lobby-muted);
  font-size: 9px;
}

.user-route .lobby-provider-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
  gap: 7px;
}

.user-route .lobby-provider-grid .lobby-provider {
  min-width: 0;
  justify-content: space-between;
}

.user-route .lobby-footer {
  display: grid;
  max-width: none;
  padding: 32px max(28px, calc((100vw - 68px - 1424px) / 2));
  border-top: 1px solid var(--lobby-border);
  background: #0b1023;
  grid-template-columns: minmax(220px, 1.2fr) 1fr minmax(220px, 1fr);
  gap: 24px;
  color: var(--lobby-muted);
  text-align: left;
}

.user-route .lobby-footer__brand img {
  width: min(260px, 100%);
  height: 62px;
  object-fit: contain;
  object-position: left center;
}

.user-route .lobby-footer__brand p,
.user-route .lobby-footer__support span {
  max-width: 330px;
  margin: 8px 0 0;
  font-size: 10px;
  line-height: 1.55;
}

.user-route .footer__links {
  display: grid;
  align-content: start;
  gap: 8px;
}

.user-route .footer__links a {
  color: #dce1f2;
  font-size: 11px;
  text-decoration: none;
}

.user-route .lobby-footer__support {
  display: grid;
  align-content: start;
  gap: 8px;
}

.user-route .lobby-footer__support strong {
  color: #fff;
  font-size: 13px;
}

.user-route .lobby-footer__support a,
.user-route .lobby-footer__support button {
  display: inline-flex;
  width: max-content;
  min-height: 36px;
  padding: 0 13px;
  border: 0;
  border-radius: 10px;
  background: var(--lobby-green);
  color: #06150f;
  align-items: center;
  gap: 7px;
  font-size: 10px;
  font-weight: 850;
  text-decoration: none;
}

.user-route .lobby-footer__support svg {
  width: 16px;
  height: 16px;
}

.user-route .footer-social {
  display: flex;
  grid-column: 1 / 3;
  gap: 8px;
}

.user-route .lobby-footer__legal {
  align-self: center;
  font-size: 9px;
  text-align: right;
}

.user-route .whatsapp {
  right: 20px;
  bottom: 20px;
  display: grid;
  width: 54px;
  height: 54px;
  border: 4px solid rgba(255, 255, 255, 0.08);
  background: var(--lobby-green);
  color: #06150f;
  place-items: center;
}

.user-route .mobile-bottom {
  display: none;
}

.user-route .modal-overlay {
  background: rgba(3, 6, 18, 0.78);
  backdrop-filter: blur(8px);
}

.user-route .modal {
  border: 1px solid var(--lobby-border);
  border-radius: 18px;
  background: #141a32;
  color: #fff;
}

.user-route .modal input,
.user-route .modal select,
.user-route .modal textarea {
  border-color: var(--lobby-border);
  background: #0d1227;
  color: #fff;
}

.user-route .modal__submit {
  border-radius: 11px;
  background: var(--lobby-green);
  color: #06150f;
}

@media (max-width: 1180px) {
  .user-route .casino-games-container__list {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .user-route .lobby-hero {
    grid-template-columns: minmax(0, 1.45fr) minmax(240px, 0.7fr);
  }
}

@media (max-width: 820px) {
  .user-route .header {
    left: 0;
    height: 72px;
  }

  .user-route .header__content.desktop,
  .user-route .lobby-rail {
    display: none;
  }

  .user-route .header__content.mobile {
    display: flex;
    height: 72px;
    padding: 7px 10px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .user-route .header__content.mobile .logo {
    display: flex;
    width: clamp(148px, 42vw, 178px);
    height: 52px;
    align-items: center;
  }

  .user-route .header__content.mobile .logo img {
    width: 100%;
    max-height: 52px;
    object-fit: contain;
    object-position: left center;
  }

  .user-route .header__mobile-profile {
    position: relative;
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border: 1px solid var(--lobby-border);
    border-radius: 13px;
    background: var(--lobby-panel);
    color: #fff;
    place-items: center;
  }

  .user-route .header__mobile-profile .header-player-status {
    position: absolute;
    top: -2px;
    right: -2px;
  }

  .user-route .header__mobile-profile svg {
    width: 18px;
  }

  .user-route .header__balance {
    display: flex;
    width: auto;
    min-width: 112px;
    height: 44px;
    min-height: 44px;
    padding: 0 11px;
    align-items: center;
    justify-content: center;
  }

  .user-route .header__balance .menu_balance {
    gap: 6px;
    font-size: 13px;
  }

  .user-route .header__actions .notification-bell {
    width: 38px;
    height: 38px;
  }

  .user-route .header__actions .menu-button--auth {
    min-height: 38px;
    padding: 0 12px;
    transform: translateY(-3px);
  }

  .user-route .content,
  .user-route .footer {
    margin-left: 0;
  }

  .user-route .content {
    padding-top: 72px;
    padding-bottom: 74px;
  }

  .user-route .home-lobby,
  .user-route .lobby-catalog-page,
  .user-route .sportsbook-page,
  .user-route .profile {
    padding: 10px 10px 34px;
  }

  .user-route .lobby-hero {
    display: block;
  }

  .user-route .lobby-hero__main {
    min-height: 350px;
  }

  .user-route .lobby-hero__main .lobby-banner-media > img {
    object-position: center;
  }

  .user-route .lobby-hero__veil {
    background: linear-gradient(0deg, rgba(5, 9, 24, 0.98) 0%, rgba(5, 9, 24, 0.82) 42%, rgba(5, 9, 24, 0.12) 100%);
  }

  .user-route .lobby-hero__copy {
    width: 100%;
    min-height: 350px;
    padding: 22px;
    justify-content: flex-end;
  }

  .user-route .lobby-hero__copy h1 {
    font-size: 28px;
  }

  .user-route .lobby-hero__promos {
    margin-top: 9px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 8px;
  }

  .user-route .lobby-mini-promo {
    min-height: 135px;
    padding: 12px;
  }

  .user-route .lobby-mini-promo strong {
    font-size: 12px;
  }

  .user-route .lobby-mini-promo em {
    display: none;
  }

  .user-route .lobby-quick-links {
    overflow-x: auto;
    margin-bottom: 22px;
    padding-bottom: 3px;
    grid-template-columns: repeat(4, 145px);
    scrollbar-width: none;
  }

  .user-route .lobby-quick-links::-webkit-scrollbar {
    display: none;
  }

  .user-route .most-played {
    margin: 2px -10px 27px;
    content-visibility: auto;
    contain-intrinsic-size: auto 250px;
  }

  .user-route .most-played__head {
    min-height: 0;
    margin: 0 10px 10px;
    align-items: flex-end;
    gap: 10px;
  }

  .user-route .most-played__head h2 {
    font-size: 18px;
  }

  .user-route .most-played__head > small {
    max-width: 148px;
    font-size: 8px;
  }

  .user-route .most-played__track {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 10px 10px 14px;
    gap: 12px;
    scroll-behavior: auto;
    scroll-padding-inline: 10px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    touch-action: pan-x pan-y pinch-zoom;
    -webkit-overflow-scrolling: touch;
  }

  .user-route .most-played__track::-webkit-scrollbar {
    display: none;
  }

  .user-route .most-played__track:focus-visible {
    outline: 2px solid var(--lobby-green);
    outline-offset: -2px;
  }

  .user-route .casino-game.most-played-card {
    width: min(82vw, 340px);
    min-width: min(82vw, 340px);
    flex: 0 0 min(82vw, 340px);
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  /* En mobile conservamos el fuego, color y brillo como capas estaticas. Las
     animaciones de blur, filtros y sombras por tarjeta son las que bloqueaban
     el compositor al desplazar varias secciones destacadas consecutivas. */
  .user-route .casino-game.most-played-card,
  .user-route .most-played-card::before,
  .user-route .most-played-card__media::before,
  .user-route .most-played-card__media::after,
  .user-route .most-played-card__media > img,
  .user-route .casino-game--crash,
  .user-route .casino-game--live,
  .user-route .casino-game--crash::before,
  .user-route .casino-game--live::before,
  .user-route .casino-game--crash .casino-game__content::after,
  .user-route .casino-game--live .casino-game__content::after,
  .user-route .casino-game--crash .casino-game__art,
  .user-route .casino-game--live .casino-game__art,
  .user-route .crash-feature::before,
  .user-route .live-feature::before {
    animation: none !important;
  }

  .user-route .casino-game.most-played-card,
  .user-route .casino-game--crash,
  .user-route .casino-game--live {
    contain: layout paint;
    will-change: auto;
  }

  .user-route .most-played-card::before,
  .user-route .casino-game--crash::before,
  .user-route .casino-game--live::before {
    inset: -2px;
    opacity: 0.72;
    filter: none;
  }

  .user-route .most-played-card__media::before {
    opacity: 0.82;
    transform: translateY(-2%) scaleY(1.04);
  }

  .user-route .most-played-card__media > img,
  .user-route .casino-game--crash .casino-game__art,
  .user-route .casino-game--live .casino-game__art {
    transform: scale(1.08);
    filter: saturate(1.08) contrast(1.03);
  }

  .user-route .most-played.is-motion-active .most-played-card:first-child .most-played-card__media::after {
    animation: most-played-shine 5.4s ease-in-out infinite !important;
  }

  .user-route .most-played-card__copy strong {
    font-size: 14px;
  }

  .user-route .casino-games-container__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  .user-route .casino-games-container__list--crash,
  .user-route .casino-games-container__list--live {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .user-route .provider-feature-card__copy strong {
    font-size: 11px;
  }

  .user-route .casino-game__name {
    font-size: 10px;
  }

  .user-route .casino-game__provider {
    font-size: 7px;
  }

  .user-route .home-crash__track {
    overflow-x: auto;
    grid-template-columns: repeat(4, 210px);
  }

  .user-route .demo-winners {
    padding: 0;
  }

  .user-route .demo-winners__head {
    align-items: flex-start;
    gap: 8px;
  }

  .user-route .demo-winners__head h2 {
    font-size: 15px;
  }

  .user-route .demo-winners__head > small {
    max-width: 120px;
    text-align: right;
  }

  .user-route .banners {
    --banner-height: clamp(122px, 34vw, 164px);
  }

  .user-route .mobile-bottom {
    position: fixed;
    z-index: 110;
    right: 8px;
    bottom: 8px;
    left: 8px;
    display: grid;
    height: 64px;
    padding: 5px;
    border: 1px solid var(--lobby-border);
    border-radius: 17px;
    background: rgba(20, 26, 50, 0.96);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(18px);
    grid-template-columns: repeat(var(--mobile-bottom-items, 5), minmax(0, 1fr));
  }

  .user-route .bottom-item {
    display: flex;
    min-width: 0;
    height: 54px;
    padding: 4px 2px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #7f89aa;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    text-decoration: none;
  }

  .user-route .bottom-item.active {
    background: rgba(32, 227, 155, 0.1);
    color: var(--lobby-green);
  }

  .user-route .bottom-icon,
  .user-route .bottom-icon svg {
    width: 20px;
    height: 20px;
  }

  .user-route .bottom-label {
    overflow: hidden;
    max-width: 100%;
    font-size: 8px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .user-route .bottom-item--deposit {
    background: var(--lobby-green);
    color: #06150f;
  }

  .user-route .lobby-footer {
    display: grid;
    padding: 26px 16px 98px;
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .user-route .footer-social,
  .user-route .lobby-footer__legal {
    grid-column: auto;
    text-align: left;
  }

  .user-route .whatsapp {
    right: 16px;
    bottom: 86px;
    width: 48px;
    height: 48px;
  }
}

@media (max-width: 390px) {
  .user-route .header__content.mobile .logo {
    width: 138px;
  }

  .user-route .header__actions {
    gap: 5px;
  }

  .user-route .header__actions .notification-bell {
    display: none;
  }

  .user-route .casino-games-container__title small {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .user-route .lobby-hero__main,
  .user-route .lobby-mini-promo,
  .user-route .lobby-banner-media > img.is-active,
  .user-route .lobby-hero__main::before,
  .user-route .lobby-hero__main::after,
  .user-route .lobby-mini-promo::before,
  .user-route .lobby-cta--primary,
  .user-route .banners,
  .user-route .banners::before,
  .user-route .banners::after,
  .user-route .banner img[data-banner-active] {
    animation: none;
  }

  .user-route .lobby-banner-media > img,
  .user-route .banner img {
    transform: none;
    transition-duration: 0.01ms;
  }

  .user-route .demo-winners__ticker > div {
    animation: none;
  }
}