.slot-lobby-page[hidden] { display: none !important; }

body.slot-lobby-open .main > :not(.slot-lobby-page):not(#siteFooter) { display: none !important; }
body.slot-lobby-open .top-info-banners { display: none !important; }

.slot-lobby-page {
  --live-accent: #a6e652;
  padding-top: 4px;
}

.slot-lobby-hero {
  border-color: #78c844;
  background: radial-gradient(ellipse at 78% 46%, #82d54a35 0 19%, transparent 53%), linear-gradient(120deg, #10192b, #142b31 56%, #273d2a);
}

.slot-banner-slides { border-radius: inherit; }
.slot-banner-slide { background: radial-gradient(ellipse at 78% 54%, #a6df5060 0 12%, transparent 13% 23%, #8bca2740 24% 25%, transparent 26%), linear-gradient(125deg, #11192e, #1b3c35 54%, #5e5b25); }
.slot-banner-slide:nth-child(3n + 2) { background: radial-gradient(circle at 76% 48%, #f7cc574d 0 10%, transparent 11% 18%, #e6a33744 19% 20%, transparent 21%), linear-gradient(125deg, #1c1737, #522947 54%, #183d3b); }
.slot-banner-slide:nth-child(3n) { background: radial-gradient(ellipse at 78% 49%, #b35cf45c 0 13%, transparent 14% 21%, #85d14133 22% 23%, transparent 24%), linear-gradient(125deg, #15283a, #204952 54%, #604736); }
.slot-banner-slide.has-image { background: #101a2a; }
.slot-banner-slide .live-banner-shade { background: linear-gradient(90deg, #091321ed 0%, #101b2be0 37%, #111b2c60 69%, #111b2c1c 100%), linear-gradient(0deg, #07111d78 0%, transparent 54%); }
.slot-banner-slide .live-hero-eyebrow { color: #c9ed9d; }
.slot-banner-slide .live-hero-cta { border-color: #b2eb6c; }
.slot-banner-dots { gap: 7px; }
.slot-banner-action { cursor: pointer; }
.slot-banner-highlight { display: inline-flex; margin-top: 2px; color: #b3e86d; font-size: 11px; font-weight: 850; text-shadow: 0 2px 8px #000b; }
.slot-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; clip-path: inset(50%); }

.slot-category-rail { margin-top: 17px; margin-bottom: 13px; }
.slot-category-rail .live-category-chip { flex: 0 0 auto; }
.slot-category-rail .live-category-chip:first-child { border-color: #75bd43; background: linear-gradient(140deg, #334632, #283a36); }
.slot-category-rail .live-category-chip.is-active { border-color: #89cf49; box-shadow: inset 0 0 0 1px #a5e65224, 0 5px 15px #92ce3b19; }
.slot-category-rail .live-category-chip span { color: #c1e98c; }

.slot-game-tools { margin-bottom: 10px; }
.slot-random-button {
  display: flex;
  width: 100%;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 22px;
  padding: 11px 16px;
  border: 1px solid #465264;
  border-radius: 14px;
  background: linear-gradient(115deg, #2e3848, #35404f 48%, #2c3543);
  box-shadow: inset 0 1px #ffffff0b, 0 8px 20px #0d14205c;
  color: #f4f6f8;
  font-size: 13px;
  font-weight: 850;
  transition: border-color .18s ease, transform .18s ease, background .18s ease;
}
.slot-random-button:hover { transform: translateY(-1px); border-color: #88c94d; background: linear-gradient(115deg, #354334, #35404f 48%, #2c3d38); }
.slot-random-button > span { font-size: 19px; }
.slot-random-button b { color: #b8e77b; font-size: 18px; }
.slot-random-feedback { min-height: 14px; margin: -15px 2px 12px; color: #c5e89b; font-size: 10px; }
.slot-random-feedback[hidden] { display: none; }
.slot-results-head { scroll-margin-top: 84px; }

.slot-game-card { overflow: hidden; }
.slot-game-card[hidden] { display: none !important; }
.slot-game-art {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  isolation: isolate;
  overflow: hidden;
  background-color: #263645;
  text-align: center;
}
.slot-game-art::before { background: linear-gradient(0deg, #09101de8 0%, #10172644 38%, #07111d26 100%), radial-gradient(ellipse at 50% 42%, #ffffff13, transparent 58%); }
.slot-game-art::after { right: -40px; bottom: -91px; width: 210px; height: 145px; border-color: #ffffff2e; box-shadow: 0 0 0 11px #ffffff08, 0 0 0 23px #ffffff05; }
.slot-art-olympus { background: radial-gradient(ellipse at 52% 47%, #fff2ac 0 4%, #c89036 5% 7%, transparent 8%), radial-gradient(ellipse at 52% 49%, #a17a3b55 0 26%, transparent 27%), linear-gradient(145deg, #152347, #62502b 51%, #161c31); }
.slot-art-sweet { background: radial-gradient(circle at 76% 36%, #ffb9cc 0 7%, transparent 8%), radial-gradient(circle at 67% 55%, #8ce4ed 0 9%, transparent 10%), radial-gradient(circle at 83% 59%, #ffe26e 0 8%, transparent 9%), linear-gradient(145deg, #5b2373, #c63e78 50%, #3a2670); }
.slot-art-bass { background: radial-gradient(ellipse at 78% 48%, #b9f8b5 0 5%, #4aa0a3 6% 13%, transparent 14%), radial-gradient(ellipse at 78% 48%, #ffffff16 0 25%, transparent 26%), linear-gradient(145deg, #193d50, #3b7a67 48%, #1a3445); }
.slot-art-starlight { background: radial-gradient(circle at 77% 39%, #fff1a6 0 4%, #f5a4f4 5% 11%, transparent 12%), radial-gradient(circle at 72% 67%, #9de5ff 0 7%, transparent 8%), linear-gradient(145deg, #202960, #7b43a1 53%, #182b57); }
.slot-art-tiger { background: radial-gradient(ellipse at 77% 51%, #ffdf7e 0 7%, #e55c24 8% 15%, transparent 16%), radial-gradient(circle at 77% 51%, #ffcf6333 0 28%, transparent 29%), linear-gradient(145deg, #5c1c23, #b84924 47%, #351b30); }
.slot-art-deco { background: radial-gradient(circle at 76% 46%, #f9d27d 0 9%, #a74734 10% 14%, transparent 15%), linear-gradient(145deg, #263044, #895245 50%, #332b3b); }
.slot-art-wanted { background: radial-gradient(circle at 76% 49%, #e1b958 0 8%, #402e2b 9% 18%, transparent 19%), linear-gradient(145deg, #382b28, #8a4b28 54%, #21252f); }
.slot-art-sugar { background: radial-gradient(circle at 77% 40%, #ff9ac7 0 7%, transparent 8%), radial-gradient(circle at 69% 59%, #9ff2d5 0 9%, transparent 10%), radial-gradient(circle at 87% 65%, #ffe38c 0 7%, transparent 8%), linear-gradient(145deg, #4f2a7a, #bd347d 48%, #2a397a); }
.slot-art-book { background: radial-gradient(circle at 78% 48%, #ffc35f 0 9%, #a95025 10% 15%, transparent 16%), linear-gradient(145deg, #182e28, #826032 51%, #2b2631); }
.slot-art-mahjong { background: radial-gradient(circle at 78% 43%, #c4f7a0 0 8%, #40895a 9% 14%, transparent 15%), linear-gradient(145deg, #103d40, #328169 53%, #24334b); }
.slot-art-dog { background: radial-gradient(circle at 78% 47%, #eacb89 0 10%, #763b38 11% 17%, transparent 18%), linear-gradient(145deg, #592b46, #9a3f51 52%, #352d59); }
.slot-art-gold { background: radial-gradient(circle at 78% 47%, #fff0a5 0 7%, #d99d35 8% 15%, transparent 16%), linear-gradient(145deg, #253a32, #8a6b2e 51%, #253044); }
.slot-art-emblem { position: absolute; z-index: 1; top: 15%; right: 15%; color: #fff0c0; font-size: clamp(34px, 5vw, 58px); line-height: 1; filter: drop-shadow(0 4px 12px #0009); }
.slot-art-topline { position: absolute; z-index: 2; top: 12px; left: 12px; max-width: 50%; color: #d8efb5; font-size: 8px; font-weight: 950; letter-spacing: 1.2px; text-align: left; text-shadow: 0 2px 6px #000b; }
.slot-game-art > strong { position: absolute; z-index: 2; right: 12px; bottom: 27px; left: 12px; color: #fff4d8; font-size: clamp(17px, 2.5vw, 26px); font-weight: 1000; line-height: .94; letter-spacing: -.8px; text-align: left; text-shadow: 0 3px 10px #080b12; }
.slot-art-tag { position: absolute; z-index: 2; right: 10px; bottom: 10px; color: #c9e993; font-size: 7px; font-weight: 900; letter-spacing: 1px; text-shadow: 0 2px 5px #000; }
.slot-game-card.is-random-picked { border-color: #a6e652; box-shadow: 0 0 0 2px #a6e65255, 0 14px 32px #a6e65224; transform: translateY(-3px); }
.slot-game-card.is-random-picked .slot-game-art { filter: saturate(1.2) brightness(1.12); }

@media (max-width: 760px) {
  .slot-lobby-page { padding: 0 0 26px; }
  .slot-lobby-hero { height: clamp(195px, 57vw, 238px); border-radius: 17px; }
  .slot-banner-slide .live-hero-copy { padding-bottom: 27px; }
  .slot-banner-slide .live-hero-cta { min-height: 31px; padding-inline: 10px; font-size: 9px; }
  .slot-banner-slide .live-hero-eyebrow { margin-bottom: 8px; font-size: 8px; letter-spacing: 1px; }
  .slot-banner-slide h1 { max-width: 70%; font-size: clamp(21px, 6.5vw, 29px); letter-spacing: -.8px; }
  .slot-banner-slide p { max-width: 68%; margin: 7px 0 10px; font-size: 10px; line-height: 1.35; }
  .slot-banner-highlight { max-width: 70%; font-size: 9px; }
  .slot-category-rail { gap: 8px; margin: 14px -12px 12px; padding: 1px 12px 4px; }
  .slot-category-rail .live-category-chip { min-height: 42px; padding: 0 13px; font-size: 10px; }
  .slot-game-tools { grid-template-columns: minmax(0, 1fr) minmax(0, .98fr); gap: 8px; margin-bottom: 10px; }
  .slot-random-button { min-height: 50px; margin-bottom: 20px; border-radius: 13px; font-size: 12px; }
  .slot-game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .slot-game-card { border-radius: 12px; }
  .slot-game-art { height: clamp(118px, 36vw, 158px); }
  .slot-art-topline { top: 9px; left: 9px; font-size: 6px; letter-spacing: .8px; }
  .slot-art-emblem { top: 17%; right: 12%; font-size: clamp(31px, 9vw, 43px); }
  .slot-game-art > strong { right: 9px; bottom: 24px; left: 9px; font-size: clamp(15px, 4.1vw, 20px); }
  .slot-art-tag { right: 8px; bottom: 8px; font-size: 6px; letter-spacing: .6px; }
}

@media (max-width: 380px) {
  .slot-lobby-hero { height: 190px; }
  .slot-banner-slide .live-hero-copy { padding-inline: 13px; }
  .slot-banner-slide h1 { max-width: 72%; font-size: 21px; }
  .slot-banner-slide p { max-width: 70%; font-size: 9px; }
  .slot-category-rail .live-category-chip { padding-inline: 10px; }
  .slot-game-tools { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 6px; }
  .slot-game-art { height: 112px; }
  .slot-game-art > strong { font-size: 14px; }
  .slot-art-topline { font-size: 5px; }
  .slot-game-copy { padding: 8px 8px 9px; }
  .slot-game-copy strong { font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .slot-random-button,.slot-game-card { transition: none; }
}
