/* The lobby scales with its column, like the mobile layout on desktop. */
.lobby-page {
  --lobby-width: min(100vw, 56.222vh);
  --unit: calc(var(--lobby-width) / 750);
  --lobby-bg: #1a2c38;
  --lobby-panel: #0f212e;
  --lobby-muted: #b1bad3;
  --lobby-blue: #1475e1;
  background: #2a3f4d;
  padding-bottom: calc(130 * var(--unit) + env(safe-area-inset-bottom));
}
@media (max-width: 767px) { .lobby-page { --lobby-width: 100vw; } }
.homepage-main { margin: 0; padding: 0; }
.lobby-page.lobby-modal-open { overflow: hidden; }
.lobby-shell, .bottom-tabs, .browse-dialog, .welcome-dialog {
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
  font-size: calc(24 * var(--unit));
  line-height: 1.3;
  color-scheme: dark;
}
.lobby-shell { width: var(--lobby-width); margin: 0 auto; min-height: 100svh; background: var(--lobby-bg); }
.lobby-shell [hidden], .browse-dialog [hidden], .welcome-dialog [hidden] { display: none !important; }
.lobby-shell button, .bottom-tabs button, .browse-dialog button, .welcome-dialog button {
  font: inherit; color: inherit; border: 0; padding: 0; cursor: pointer; background: none;
  -webkit-tap-highlight-color: transparent;
}
.lobby-shell a, .lobby-shell a:visited, .bottom-tabs a, .bottom-tabs a:visited,
.browse-dialog a, .browse-dialog a:visited { color: inherit; text-decoration: none; }
.lobby-shell p, .lobby-shell h2 { margin: 0; }
.lobby-shell img, .bottom-tabs img { display: block; }
.lobby-shell :focus-visible, .bottom-tabs :focus-visible, dialog :focus-visible { outline: 2px solid #58b6ff; outline-offset: 2px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lobby-header { position: sticky; top: 0; z-index: 20; background: var(--lobby-bg); box-shadow: 0 calc(5 * var(--unit)) calc(6 * var(--unit)) #0000003b; }
.download-strip { height: calc(60 * var(--unit)); display: flex; align-items: center; gap: 0; padding-right: calc(10 * var(--unit)); }
.lobby-shell .strip-close { color: #0766ff; width: calc(60 * var(--unit)); height: 100%; flex: 0 0 calc(60 * var(--unit)); font-size: calc(36 * var(--unit)); font-weight: 200; }
.download-strip > img { width: calc(380 * var(--unit)); height: auto; }
.download-link { display: grid; place-content: center; width: calc(120 * var(--unit)); height: calc(40 * var(--unit)); margin-left: auto; border-radius: calc(10 * var(--unit)); background: #0766ff; text-align: center; font-size: calc(16 * var(--unit)); line-height: 1.05; }
.lobby-toolbar { height: calc(114 * var(--unit)); padding: calc(20 * var(--unit)); display: flex; align-items: center; justify-content: space-between; }
.lobby-shell .logo-home { width: calc(244.2 * var(--unit)); flex-shrink: 0; }
.logo-home img { width: 100%; height: auto; }
.lobby-auth { display: flex; align-items: center; gap: calc(20 * var(--unit)); }
.login-link, .register-link { display: flex; align-items: center; justify-content: center; position: relative; width: calc(120 * var(--unit)); min-height: calc(70 * var(--unit)); border-radius: calc(10 * var(--unit)); font-size: calc(26 * var(--unit)); }
.login-link { background: #334553; }
.register-link { background: var(--lobby-blue); box-shadow: 0 0 0 calc(6 * var(--unit)) #1475e130; }
.reward-badge { position: absolute; right: calc(6 * var(--unit)); top: calc(-19 * var(--unit)); padding: calc(2 * var(--unit)) calc(7 * var(--unit)); border-radius: calc(20 * var(--unit)); color: #fff; background: #00c949; font-size: calc(18 * var(--unit)); font-weight: 400; line-height: 1.2; white-space: nowrap; }
.lobby-shell .lobby-disclosure { padding: 5px 7px; font-size: max(10px, calc(17 * var(--unit))); line-height: 1.4; color: #c2cede; background: #152632; text-align: center; }
.lobby-content { padding: calc(20 * var(--unit)) calc(20 * var(--unit)) calc(32 * var(--unit)); }
.banner-carousel { position: relative; aspect-ratio: 1020 / 300; overflow: hidden; border-radius: calc(18 * var(--unit)); background: #f3f4f3; touch-action: pan-y; }
.banner-panel, .banner-link, .banner-link img { display: block; width: 100%; height: 100%; }
.banner-link img { object-fit: cover; }
.banner-controls { position: absolute; inset: auto 0 0; display: flex; justify-content: center; pointer-events: none; }
.banner-controls button { pointer-events: auto; }
.banner-dots { display: flex; align-items: center; }
.banner-dots button { display: grid; place-items: center; width: calc(24 * var(--unit)); height: max(24px, calc(28 * var(--unit))); }
.banner-dots span { display: block; width: calc(9 * var(--unit)); height: calc(9 * var(--unit)); border-radius: 20px; background: #ffffff80; box-shadow: 0 0 1px #54616b70; }
.banner-dots [aria-pressed="true"] span { width: calc(22 * var(--unit)); background: #fff; border: 1px solid #c5c5c5; }
.lobby-shell .banner-pause { position: absolute; left: calc(8 * var(--unit)); bottom: calc(6 * var(--unit)); width: 24px; height: 22px; border-radius: 4px; color: #fff; background: #0f212e80; font-size: 12px; }
.quick-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(19 * var(--unit)); margin-top: calc(20 * var(--unit)); }
.quick-tile { display: block; overflow: hidden; border-radius: calc(10 * var(--unit)); }
.quick-tile img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 672 / 402; }
.announcement-row { display: flex; align-items: center; gap: calc(10 * var(--unit)); height: calc(50 * var(--unit)); margin: calc(20 * var(--unit)) 0; color: var(--lobby-muted); }
.announcement-row > img { width: calc(40 * var(--unit)); flex-shrink: 0; }
.lobby-shell .announcement-text { overflow: hidden; text-align: left; white-space: nowrap; text-overflow: clip; flex: 1; height: 100%; font-size: calc(24 * var(--unit)); }
.message-button { position: relative; width: calc(44 * var(--unit)); flex-shrink: 0; }
.message-button img { width: 100%; }
.message-button span { position: absolute; top: calc(-15 * var(--unit)); right: calc(-9 * var(--unit)); min-width: calc(28 * var(--unit)); padding: 1px 3px; border-radius: 20px; background: #ff2a4e; font-size: calc(18 * var(--unit)); color: #fff; }
.category-tabs { display: flex; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; border-radius: calc(20 * var(--unit)); background: var(--lobby-panel); }
.category-tabs::-webkit-scrollbar { display: none; }
.category-tabs button { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 0 0 calc(129 * var(--unit)); min-height: calc(114 * var(--unit)); gap: calc(14 * var(--unit)); padding: calc(12 * var(--unit)) calc(10 * var(--unit)); white-space: nowrap; }
.category-tabs button:first-child { position: sticky; left: 0; z-index: 2; flex-basis: calc(109 * var(--unit)); background: var(--lobby-panel); box-shadow: 5px 0 8px #0f212e; }
.category-tabs button:nth-child(2), .category-tabs button:nth-child(3) { margin-left: calc(20 * var(--unit)); }
.category-tabs img { width: calc(52 * var(--unit)); height: calc(39.52 * var(--unit)); object-fit: contain; }
.category-tabs span { font-size: calc(24 * var(--unit)); line-height: 1; }
.category-tabs button:not(:first-child)[aria-pressed="true"] { background: #1c4562; box-shadow: inset 0 -2px var(--lobby-blue); }
.provider-tabs { display: flex; gap: calc(8 * var(--unit)); margin-top: calc(14 * var(--unit)); overflow-x: auto; scrollbar-width: none; }
.provider-tabs button { flex: 1 0 auto; padding: calc(12 * var(--unit)); border: 1px solid #334b5c; border-radius: calc(8 * var(--unit)); color: var(--lobby-muted); font-weight: 600; }
.provider-tabs [aria-pressed="true"] { color: #fff; background: var(--lobby-blue); border-color: var(--lobby-blue); }
.game-section { margin-top: calc(20 * var(--unit)); scroll-margin-top: calc(220 * var(--unit)); }
.game-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(14 * var(--unit)); min-height: calc(58 * var(--unit)); }
.lobby-shell .game-toolbar h2 { display: flex; align-items: center; gap: calc(8 * var(--unit)); font-size: calc(36 * var(--unit)); line-height: 1.2; font-weight: 600; }
.game-toolbar h2 img { width: calc(50 * var(--unit)); height: calc(38 * var(--unit)); object-fit: contain; }
.game-arrows { display: flex; border: 1px solid #2a3f4d; border-radius: calc(34 * var(--unit)); overflow: hidden; }
.lobby-shell .game-arrows button { width: calc(90 * var(--unit)); height: calc(58 * var(--unit)); color: var(--lobby-muted); font-size: calc(36 * var(--unit)); line-height: 1; }
.game-arrows button + button { border-left: 1px solid #2a3f4d; }
.game-arrows button:disabled { opacity: .3; cursor: default; }
.game-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(10 * var(--unit)) calc(14 * var(--unit)); }
.game-card { position: relative; min-width: 0; aspect-ratio: 3 / 4; border-radius: calc(12 * var(--unit)); scroll-margin-top: calc(225 * var(--unit)); }
.game-link { display: block; height: 100%; position: relative; border-radius: inherit; overflow: hidden; }
.game-link > img { width: 100%; height: 100%; object-fit: cover; transition: filter .15s; }
.game-link:hover > img { filter: brightness(1.1); }
.game-name { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; min-height: calc(74 * var(--unit)); padding: 0 calc(8.5 * var(--unit)) calc(8.5 * var(--unit)); color: #fff; font-size: calc(25.54 * var(--unit)); line-height: 1.25; font-weight: 600; text-align: center; text-shadow: 0 1px 3px #0009; }
.game-card > img { position: absolute; top: 0; left: 0; width: 31.9%; height: auto; border-top-left-radius: calc(12 * var(--unit)); pointer-events: none; }
.lobby-shell .favorite-button { position: absolute; top: calc(5 * var(--unit)); right: calc(5 * var(--unit)); display: grid; place-items: center; width: calc(44 * var(--unit)); height: calc(44 * var(--unit)); border-radius: 50%; }
.favorite-button img { width: calc(34 * var(--unit)); height: auto; }
.favorite-button[aria-pressed="true"] { background: #ffd55b; box-shadow: 0 0 7px #ffc70080; }
.favorite-button[aria-pressed="true"] img { filter: brightness(.55) sepia(1) saturate(3); }
.game-empty { display: grid; place-items: center; gap: 18px; min-height: calc(400 * var(--unit)); padding: 24px 16px; text-align: center; color: var(--lobby-muted); background: var(--lobby-panel); border-radius: calc(12 * var(--unit)); }
.catalog-link, .lobby-actions a { background: var(--lobby-blue); border-radius: calc(10 * var(--unit)); padding: calc(18 * var(--unit)) calc(30 * var(--unit)); color: #fff !important; }
.lobby-actions { display: flex; gap: calc(16 * var(--unit)); margin-top: calc(28 * var(--unit)); }
.lobby-actions a { flex: 1; text-align: center; font-weight: 600; }
.lobby-actions .deposit-link { background: #334553; }
.bottom-tabs { position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 40; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); width: var(--lobby-width); padding-bottom: env(safe-area-inset-bottom); background: var(--lobby-panel); }
.bottom-tabs > button, .bottom-tabs > a { position: relative; display: flex; flex-direction: column; align-items: center; padding-top: calc(17 * var(--unit)); gap: calc(3 * var(--unit)); min-height: calc(130 * var(--unit)); color: var(--lobby-muted); font-size: calc(24 * var(--unit)); text-align: center; }
.bottom-tabs img { height: calc(50 * var(--unit)); width: calc(50 * var(--unit)); }
.bottom-tabs .casino-tab { color: #fff; }
.casino-tab img { filter: brightness(0) invert(1); }
.bottom-tabs .reward-badge { top: calc(4 * var(--unit)); right: calc(5 * var(--unit)); font-size: calc(17 * var(--unit)); }
.bottom-tabs a:visited { color: var(--lobby-muted); }
.guide-region { background: var(--bg); color: var(--text); padding-bottom: 1px; }
.guide-region .site-footer { margin-bottom: 0; }
.lobby-page .skip { z-index: 100; }
.lobby-page .skip:focus { position: fixed; }
.welcome-dialog, .browse-dialog { border: 0; padding: 0; }
.welcome-dialog::backdrop, .browse-dialog::backdrop { background: linear-gradient(#0009, #0009) center / var(--lobby-width) 100% no-repeat; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.welcome-dialog { width: calc(690 * var(--unit)); max-width: calc(100vw - 24px); max-height: calc(100svh - 24px); overflow-y: auto; margin: auto; background: transparent; }
.welcome-dialog:focus { outline: none; }
.welcome-art { display: block; border-radius: calc(20 * var(--unit)); overflow: hidden; }
.welcome-art img { display: block; width: 100%; height: auto; }
.welcome-dialog .welcome-close { display: flex; align-items: center; justify-content: center; width: calc(60 * var(--unit)); height: calc(60 * var(--unit)); margin: calc(30 * var(--unit)) auto 0; border: calc(4 * var(--unit)) solid #fff; border-radius: 50%; color: #fff; font: 300 calc(58 * var(--unit)) / 1 Arial, sans-serif; }
.browse-dialog { width: calc(690 * var(--unit)); max-width: calc(100vw - 24px); max-height: calc(100svh - 48px); overflow-y: auto; padding: calc(30 * var(--unit)); margin: auto; border-radius: calc(20 * var(--unit)); background: var(--lobby-panel); }
.browse-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(24 * var(--unit)); }
.browse-heading h2 { margin: 0; font-size: calc(34 * var(--unit)); }
.browse-dialog .dialog-close { width: 40px; height: 40px; font-size: 30px; }
.browse-categories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(12 * var(--unit)); }
.browse-categories button { display: flex; align-items: center; justify-content: center; flex-direction: column; padding: calc(14 * var(--unit)) 0; gap: calc(8 * var(--unit)); border-radius: calc(10 * var(--unit)); background: var(--lobby-bg); }
.browse-categories img { width: calc(58 * var(--unit)); height: calc(44 * var(--unit)); object-fit: contain; }
.browse-dialog .browse-label { margin: calc(24 * var(--unit)) 0 calc(12 * var(--unit)); color: var(--lobby-muted); }
.browse-providers { display: flex; gap: calc(10 * var(--unit)); }
.browse-providers button { flex: 1; min-height: 40px; background: #1c4562; border-radius: calc(8 * var(--unit)); }
.browse-account { display: flex; gap: calc(20 * var(--unit)); margin: calc(26 * var(--unit)) 0; }
.browse-account a { width: auto; flex: 1; }
.browse-guide { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(10 * var(--unit)); }
.browse-guide a { display: flex; align-items: center; min-height: 40px; color: #9dcfff !important; }
.browse-dialog .browse-disclosure { margin: calc(22 * var(--unit)) 0 0; color: var(--lobby-muted); font-size: max(10px, calc(19 * var(--unit))); }
@media (prefers-reduced-motion: reduce) { .game-link > img { transition: none; } }
@media print { .lobby-shell, .bottom-tabs, dialog { display: none !important; } .lobby-page { padding-bottom: 0; } }

/* Lobby-only pages: dark document edges, privacy policy and recovery panel. */
html { background: #2a3f4d; color-scheme: dark; }
body { background: #2a3f4d; }
.lobby-privacy, .lobby-not-found {
  box-sizing: border-box;
  width: min(calc(100% - 32px), 486px);
  margin: 24px auto;
  padding: 20px;
  border: 1px solid #9dcfff55;
  border-radius: 12px;
  background: #0f212e;
  color: #edf2f7;
  font: 14px/1.6 Arial, sans-serif;
  overflow-wrap: anywhere;
  color-scheme: dark;
}
.lobby-privacy :where(.hero, .wrap, .card, .facts, .note, .page-head) {
  width: auto; max-width: none; margin: 0; padding: 0;
  background: transparent; border: 0; border-radius: 0; color: inherit;
}
.lobby-privacy :where(section, .card, .note) { margin: 18px 0 0; }
.lobby-privacy h1, .lobby-not-found h1 { margin: 0 0 12px; color: #fff; font: 700 24px/1.25 Arial, sans-serif; letter-spacing: normal; }
.lobby-privacy h2 { margin: 20px 0 8px; padding: 0; border: 0; color: #fff; font: 700 18px/1.35 Arial, sans-serif; }
.lobby-privacy h3 { margin: 16px 0 8px; color: #fff; font: 700 16px/1.4 Arial, sans-serif; }
.lobby-privacy p, .lobby-not-found p { margin: 0 0 12px; color: inherit; font-size: inherit; }
.lobby-privacy :where(ul, ol) { margin: 8px 0 12px; padding-left: 20px; }
.lobby-privacy li { margin: 4px 0; }
.lobby-privacy :where(a, a:visited), .lobby-not-found :where(a, a:visited) { color: #9dcfff; text-decoration: underline; }
.lobby-privacy :where(code, th, td) { background: transparent; color: inherit; border-color: #9dcfff55; }
.lobby-privacy :where(.lead, .lede, .standfirst, .byline, .eyebrow) { color: inherit; font-size: inherit; }
.lobby-error { min-height: 100vh; padding-bottom: 0; }
.lobby-error .lobby-shell { min-height: 100vh; }
.lobby-error .lobby-not-found { margin-top: 32px; }