/* The game lobby. Rules are scoped so the individual games retain their layout. */
#gallery { --gallery-gold: #e8c17b; padding-top: 14px; }
#gallery .gallery-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin:12px 0 28px; }
#gallery .gallery-heading .eyebrow { font-size:10px; color:#b6a18b; letter-spacing:.2em; margin-bottom:12px; }
#gallery .gallery-heading h2 { margin:0; font-size:clamp(27px,4vw,42px); line-height:1.15; letter-spacing:-.055em; font-weight:750; }
#gallery .gallery-heading h2 span { color:var(--gallery-gold); }
#gallery .gallery-heading p:not(.eyebrow) { margin:12px 0 0; color:#aca59c; font-size:13px; line-height:1.6; }
#gallery .gallery-count { display:flex; align-items:center; gap:10px; color:#c3b8aa; font-size:11px; white-space:nowrap; }
#gallery .gallery-count i { font-style:normal; font-size:22px; color:var(--gallery-gold); }
#gallery .gallery-adventure { position:relative; display:grid; grid-template-columns:1fr 1fr; min-height:275px; overflow:hidden; border:1px solid #34463a; border-radius:20px; color:#f5f1df; text-decoration:none; background:#14251c; margin-bottom:42px; isolation:isolate; transition:border-color .2s; }
#gallery .gallery-adventure:hover { border-color:#84a780; }
#gallery .gallery-adventure-copy { position:relative; z-index:2; padding:32px 36px; background:linear-gradient(90deg,#14251c 75%,transparent); }
#gallery .gallery-feature-label { color:#b5d09c; font-size:9px; font-weight:800; letter-spacing:.18em; }
#gallery .gallery-adventure h3 { font-size:clamp(32px,4vw,44px); letter-spacing:-.045em; line-height:1.08; margin:13px 0 12px; }
#gallery .gallery-adventure p { max-width:330px; color:#b8c6b5; font-size:12px; line-height:1.7; margin:0 0 20px; }
#gallery .gallery-adventure-action { display:inline-flex; align-items:center; gap:30px; background:#d6e4b5; color:#233c2b; border-radius:7px; padding:12px 16px; font-size:10px; letter-spacing:.07em; font-weight:900; }
#gallery .gallery-adventure-action b { font-size:18px; line-height:1; }
#gallery .gallery-adventure .nut-hunt-art { border:0; min-height:100%; background:radial-gradient(ellipse at 50% 65%,#58805033,transparent 65%),linear-gradient(145deg,#1e3829,#0b1914); mask-image:linear-gradient(90deg,transparent,#000 20%); }
#gallery .gallery-adventure .forest-moon { width:110px; height:110px; top:26px; right:19%; background:#c4d8a8; box-shadow:0 0 65px #b9dda922; }
#gallery .gallery-adventure .forest-squirrel { font-size:85px; bottom:45px; right:23%; animation:none; }
#gallery .gallery-adventure .forest-nut { font-size:39px; bottom:48px; left:22%; }
#gallery .gallery-adventure-caption { position:absolute; z-index:2; bottom:20px; right:28px; display:grid; gap:4px; text-align:right; font-size:10px; letter-spacing:.14em; color:#d5dfca; }
#gallery .gallery-adventure-caption i { font-size:9px; color:#94a18f; letter-spacing:0; font-style:normal; }
#gallery .category { margin:0 0 38px; }
#gallery .gallery-section-head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:17px; }
#gallery .gallery-section-head>div { display:flex; align-items:center; gap:10px; }
#gallery .gallery-section-head h2 { font-size:21px; letter-spacing:-.035em; margin:0; }
#gallery .gallery-section-icon { font-size:23px; color:var(--gallery-gold); }
#gallery .gallery-section-count { color:#998c7e; border:1px solid #ffffff18; border-radius:5px; padding:3px 6px; font-size:10px; }
#gallery .gallery-section-head>p { color:#9d968e; font-size:11px; margin:0; }
#gallery .game-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
#gallery .live-game-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
#gallery .game-card { --accent:#e8c17b; --art:#403022; display:flex; flex-direction:column; border:1px solid #ffffff13; background:#1b1919; border-radius:14px; box-shadow:none; transition:transform .2s,border-color .2s,box-shadow .2s; }
#gallery .game-card:hover { transform:translateY(-5px); border-color:var(--accent); box-shadow:0 14px 28px #0003; }
#gallery .game-card:focus-visible,#gallery .gallery-adventure:focus-visible { outline:3px solid #f8cf83; outline-offset:5px; }
#gallery .game-card-nutfall { --accent:#a7c79d; --art:#244231; }
#gallery .game-card-reactor { --accent:#97c6db; --art:#203d4e; }
#gallery .game-card-war { --accent:#c4b3e6; --art:#352c50; }
#gallery .game-card-blackjack { --accent:#dc9d91; --art:#472c2a; }
#gallery .game-card-roulette { --accent:#98c8b1; --art:#24463a; }
#gallery .game-card-poker { --accent:#d2b58a; --art:#3e3229; }
#gallery .card-art { height:200px; flex-shrink:0; border:0; background:radial-gradient(ellipse at 50% 60%,var(--art),#151416 95%); }
#gallery .card-art::before { inset:15px; border:1px solid #ffffff06; border-radius:50%; box-shadow:none; }
#gallery .card-art::after { content:''; position:absolute; width:75%; height:1px; bottom:0; background:linear-gradient(90deg,transparent,var(--accent),transparent); opacity:.3; }
#gallery .card-glow { opacity:.22; }
#gallery .gallery-badge { position:absolute; top:13px; left:13px; z-index:4; padding:6px 9px; border-radius:5px; background:#ead5ac; color:#392d22; font-size:9px; font-weight:800; letter-spacing:.04em; }
#gallery .game-card-war .gallery-badge { background:#d5c5ef; color:#322346; }
#gallery .card-body { display:flex; flex:1; flex-direction:column; padding:20px; min-height:0; }
#gallery .card-kicker { margin:0 0 7px; color:var(--accent); font-size:9px; letter-spacing:.13em; font-weight:750; line-height:1.4; }
#gallery .card-body h3 { margin:0 0 10px; font-size:23px; line-height:1.15; letter-spacing:-.04em; }
#gallery .gallery-description { font-size:12px; line-height:1.7; color:#b7afa5; margin:0; }
#gallery .card-foot { gap:0; margin:17px 0 20px; }
#gallery .card-foot span { padding:0; border:0; border-radius:0; color:#a0988f; font-size:10px; }
#gallery .card-foot span+span::before { content:'·'; padding:0 8px; color:#6f665f; }
#gallery .gallery-card-action { display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:14px; border-top:1px solid #ffffff0e; color:var(--accent); font-size:9px; font-weight:800; letter-spacing:.09em; }
#gallery .gallery-card-action b { display:grid; place-items:center; width:26px; height:26px; border:1px solid #ffffff1a; border-radius:50%; font-size:16px; transition:background .2s,color .2s; }
#gallery .game-card:hover .gallery-card-action b { background:var(--accent); color:#201a19; }
#gallery .mini-slot-machine { width:72%; max-width:230px; height:108px; padding-top:19px; transform:translate(-50%,-50%) rotate(-5deg); }
#gallery .mini-slot-reels { height:68px; }
#gallery .mini-slot-reels b { background:linear-gradient(#f9ead0,#cfba95); font-size:27px; }
#gallery .mini-forest { width:62%; height:132px; transform:translate(-50%,-50%) rotate(5deg); }
#gallery .mini-reactor { width:130px; height:130px; }
#gallery .live-game-grid .card-art { height:170px; }
#gallery .live-game-grid .card-body { padding:17px; }
#gallery .live-game-grid .card-body h3 { font-size:20px; }
#gallery .war-preview { gap:12px; }
#gallery .war-preview>span { position:relative; z-index:2; font-size:26px; padding:20px 10px; }
#gallery .war-preview>b { font-size:25px; }
#gallery .gallery-footer { display:flex; justify-content:space-between; gap:16px; border-top:1px solid #ffffff12; padding:20px 0 12px; color:#90877e; font-size:10px; line-height:1.6; }
@media(min-width:651px) { body:has(#gallery:not([hidden])) .welcome { margin-top:38px; align-items:center; } body:has(#gallery:not([hidden])) .welcome h1 { font-size:32px; margin-bottom:5px; } body:has(#gallery:not([hidden])) .welcome>div>p:not(.eyebrow) { margin:7px 0 0; font-size:12px; } body:has(#gallery:not([hidden])) .stats article { padding:15px 20px; } body:has(#gallery:not([hidden])) .stats strong { font-size:23px; } }
@media(max-width:850px) { #gallery .live-game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; } #gallery .gallery-section-head>p { display:none; } #gallery .card-body { padding:16px; } #gallery .card-body h3 { font-size:21px; } #gallery .gallery-adventure-copy { padding:26px; } }
@media(max-width:620px) { #gallery .gallery-heading { margin-top:4px; } #gallery .gallery-count { display:none; } #gallery .gallery-adventure { grid-template-columns:1fr; min-height:335px; margin-bottom:30px; } #gallery .gallery-adventure-copy { max-width:85%; padding:25px; background:none; } #gallery .gallery-adventure p { max-width:240px; text-shadow:0 1px 5px #14251c; } #gallery .gallery-adventure .nut-hunt-art { position:absolute; inset:0 0 0 25%; z-index:-1; opacity:.5; mask-image:linear-gradient(90deg,transparent,#000); } #gallery .gallery-adventure .forest-squirrel { right:8%; } #gallery .gallery-adventure-caption { display:none; } #gallery .game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } #gallery .gallery-slots .game-card:first-child { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; } #gallery .gallery-slots .game-card:first-child .card-art { height:100%; min-height:235px; } #gallery .card-art,#gallery .live-game-grid .card-art { height:155px; } #gallery .card-body,#gallery .live-game-grid .card-body { padding:14px; } #gallery .card-body h3,#gallery .live-game-grid .card-body h3 { font-size:19px; } #gallery .gallery-description { font-size:11px; } #gallery .card-foot { row-gap:5px; } #gallery .card-foot span { font-size:9px; } #gallery .card-kicker { font-size:8px; } #gallery .mini-forest { width:78%; height:110px; } #gallery .mini-reactor { width:102px; height:102px; } #gallery .mini-slot-machine { width:85%; padding-inline:7px; } #gallery .mini-slot-reels b { font-size:22px; } #gallery .war-preview { gap:7px; } #gallery .war-preview>span { font-size:22px; padding:17px 7px; } #gallery .war-preview>b { font-size:20px; } #gallery .gallery-footer { flex-direction:column; gap:5px; } }
@media(max-width:360px) { #gallery .game-grid,#gallery .live-game-grid { grid-template-columns:1fr; } #gallery .gallery-slots .game-card:first-child { display:flex; } #gallery .gallery-slots .game-card:first-child .card-art { min-height:180px; } }
@media(prefers-reduced-motion:reduce) { #gallery *,#gallery *::before,#gallery *::after { animation:none!important; transition:none!important; } }
/* A small fan of cards makes poker recognizable even at phone widths. */
#gallery .mini-poker-table { position:relative; display:flex; align-items:center; justify-content:center; width:85%; height:120px; border-radius:50%; background:radial-gradient(ellipse,#53624655,transparent 70%); }
#gallery .mini-poker-card { display:grid; place-items:center; flex:0 0 39px; height:60px; margin:0 -5px; border:1px solid #eadcc3; border-radius:6px; background:#f6edda; color:#242b27; font-size:17px; font-weight:800; box-shadow:0 7px 10px #0004; transform:rotate(-18deg) translateY(7px); }
#gallery .mini-poker-card:nth-child(2) { transform:rotate(-8deg); }
#gallery .mini-poker-card:nth-child(4) { transform:rotate(8deg); }
#gallery .mini-poker-card:nth-child(5) { transform:rotate(18deg) translateY(7px); }
#gallery .mini-poker-card.mini-red { color:#a6383d; }
#gallery .mini-poker-card.mini-center { position:absolute; z-index:3; bottom:9px; width:36px; height:36px; border:4px dashed #e5d2a1; border-radius:50%; background:#9d6e35; transform:none; font-size:16px; }
body:has(#gallery:not([hidden])) .welcome { margin-top:32px; gap:20px; }
body:has(#gallery:not([hidden])) .jackpot { padding:14px 18px; }
@media(max-width:650px) {
  body:has(#gallery:not([hidden])) .welcome { flex-direction:row; align-items:center; margin:28px 0 18px; gap:12px; }
  body:has(#gallery:not([hidden])) .welcome h1 { font-size:25px; margin-bottom:5px; }
  body:has(#gallery:not([hidden])) .welcome>div>p:not(.eyebrow) { display:none; }
  body:has(#gallery:not([hidden])) .welcome .eyebrow { font-size:8px; }
  body:has(#gallery:not([hidden])) .jackpot { max-width:46%; padding:10px; text-align:right; }
  body:has(#gallery:not([hidden])) .jackpot span { font-size:8px; }
  body:has(#gallery:not([hidden])) .jackpot strong { font-size:20px; }
  body:has(#gallery:not([hidden])) .jackpot small { font-size:9px; }
  body:has(#gallery:not([hidden])) .stats { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  body:has(#gallery:not([hidden])) .stats article { padding:12px 9px; border-radius:10px; }
  body:has(#gallery:not([hidden])) .stats span { font-size:8px; letter-spacing:.03em; }
  body:has(#gallery:not([hidden])) .stats strong { font-size:20px; margin:6px 0; }
  body:has(#gallery:not([hidden])) .stats small { font-size:9px; }
  #gallery .mini-bj-dealer { left:12px; }
  #gallery .mini-bj-dealer span { display:none; }
}

#gallery .gallery-activity { color:#aaa397; font-size:10px; line-height:1.5; margin:0 0 15px; }
#gallery .gallery-activity::before { content:''; display:inline-block; width:6px; height:6px; margin-right:7px; border-radius:50%; background:#716b62; }
#gallery .gallery-activity[data-live="true"]::before { background:#9bd4ad; box-shadow:0 0 7px #9bd4ad44; }
#gallery .gallery-resume:not([hidden]) { display:grid; gap:10px; margin-bottom:22px; }
#gallery .gallery-resume a { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:17px 20px; border:1px solid #967647; border-radius:12px; background:#30271c; color:#efd3a0; text-decoration:none; }
#gallery .gallery-resume strong { font-size:13px; }
#gallery .gallery-resume span { font-size:11px; color:#c1b29b; }
#gallery .gallery-resume a:hover { background:#3b3021; }
#gallery .gallery-resume a:focus-visible { outline:3px solid #f8cf83; outline-offset:3px; }
@media(max-width:620px) { #gallery .gallery-resume a { align-items:flex-start; flex-direction:column; } }
