/* Gold home screen — matched to reference screenshot */
body.reference-home{background:#232323!important}
.reference-home .gold-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 10px;padding:14px 4px 6px}
.gold-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1.14/1;border-radius:14px;text-decoration:none;
 background:linear-gradient(135deg,#fff0bd 0%,#f4d991 48%,#e8c575 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 2px 6px rgba(0,0,0,.35);overflow:hidden;padding:6px 2px}
.gold-tile:active{transform:scale(.97)}
.gold-tile-art{width:72%;display:block}
.gold-tile-art img{width:100%;height:auto;display:block;-webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 50%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 72% 70% at 50% 50%,#000 62%,transparent 100%)}
.gold-tile b{margin-top:6px;color:#25140d;font:800 13px/1.1 system-ui,Roboto,Arial,sans-serif;letter-spacing:1.2px;white-space:nowrap;text-align:center}
.gold-heading{margin:16px 2px 6px;padding-left:10px;border-left:3px solid #f0d27a;color:#f0d27a;font:800 16px/1.2 system-ui,Roboto,Arial,sans-serif;background:none}
.gold-bottom{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);align-items:end;height:68px;padding:0 4px 6px;
 background:#333331;border-radius:16px 16px 0 0;box-shadow:0 -2px 10px rgba(0,0,0,.4);max-width:520px;margin:0 auto}
.gold-bottom a{display:flex;flex-direction:column;align-items:center;gap:3px;color:#9a9a96;text-decoration:none}
.gold-bottom a svg{width:26px;height:26px}
.gold-bottom small{font:500 12px/1 system-ui,Roboto,Arial,sans-serif}
.gold-bottom a.active{color:#f0d27a}
.gold-bottom .gold-reward span{width:64px;height:64px;margin-top:-34px;border-radius:50%;display:grid;place-items:center;color:#fff;
 background:radial-gradient(circle at 40% 35%,#f4dc9a,#e3be6c 60%,#cfa04c);border:3px solid #f5d978;box-shadow:0 0 0 2px #333331,0 3px 10px rgba(0,0,0,.5)}
.gold-bottom .gold-reward span svg{width:30px;height:30px}
.gold-bottom .gold-reward small{color:#f0d27a;font-weight:800;font-size:11px}
.reference-bottom{display:none!important}
body{padding-bottom:80px}
@media(max-width:380px){.gold-tile b{font-size:11px;letter-spacing:.6px}}
.wingo-live{display:flex;flex-direction:column;gap:8px;margin:6px 2px 10px}
.wingo-live-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#2a2824;border:1px solid #3a3528;color:#fff;text-decoration:none}
.wl-no{flex:0 0 26px;height:26px;border-radius:50%;display:grid;place-items:center;font:800 13px system-ui,Arial;color:#2a1c00;background:linear-gradient(135deg,#ffe9a0,#f2cc69)}
.wl-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 3px #ef444433;animation:wlpulse 1.2s infinite}
@keyframes wlpulse{50%{opacity:.35}}
.wl-name{flex:1;display:flex;flex-direction:column;min-width:0}.wl-name b{font-size:14px}.wl-name small{font-size:11px;color:#9a9a96;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl-res{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;background:#555}
.wl-res.wl-green{background:#16a34a}.wl-res.wl-red{background:#dc2626}.wl-res.wl-violet{background:#8b5cf6}
.wl-play{padding:6px 12px;border-radius:20px;font-weight:800;font-size:12px;color:#2a1c00;background:linear-gradient(90deg,#ffe9a0,#f2cc69)}


/* v19.5: default home lobby aligned to the supplied BDG WORLD screenshot. */
.reference-home .home-hero-slider{margin:0 -12px 0;padding:0;background:#232323;overflow:hidden}
.reference-home .home-hero-banners{display:flex;gap:0;height:202px;overflow:hidden;background:#232323}
.reference-home .home-hero-banner{flex:0 0 100%;height:202px;min-height:202px;border-radius:0;background:#232323;display:block;position:relative;overflow:hidden}
.reference-home .home-hero-banner img{display:block;width:100%;height:202px;aspect-ratio:auto;object-fit:cover;background:#232323;color:#ddd;font-size:16px}
.reference-home .home-hero-dots{height:22px;display:flex;align-items:center;justify-content:center;gap:7px;background:#232323}
.reference-home .home-hero-dots button{width:7px;height:7px;padding:0;border:0;border-radius:99px;background:#929292}
.reference-home .home-hero-dots button.active{width:20px;background:#ffd33e}
.reference-home .gold-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 10px;padding:4px 3px 88px}
.reference-home .gold-tile{aspect-ratio:1.14/1;border-radius:14px;padding:7px 2px;background:linear-gradient(135deg,#f5dfa0 0%,#e9c77e 48%,#d9b165 100%)}
.reference-home .gold-tile-art{width:76%;flex:0 0 auto}
.reference-home .gold-tile-art img{-webkit-mask-image:radial-gradient(ellipse 78% 75% at 50% 50%,#000 65%,transparent 100%);mask-image:radial-gradient(ellipse 78% 75% at 50% 50%,#000 65%,transparent 100%)}
.reference-home .gold-tile b{margin-top:6px;font-size:13px;letter-spacing:1.1px;line-height:1.1}
.reference-home .gold-heading,.reference-home .wingo-live{margin-left:4px;margin-right:4px}
.reference-home .gold-bottom{height:72px;padding-bottom:max(6px,env(safe-area-inset-bottom));border-radius:16px 16px 0 0;max-width:720px}
.reference-home .gold-bottom a svg{width:27px;height:27px}
.reference-home .gold-bottom small{font-size:12px}
.reference-home .gold-bottom .gold-reward span{width:66px;height:66px;margin-top:-34px}
@media(max-width:380px){
 .reference-home .home-hero-banners,.reference-home .home-hero-banner,.reference-home .home-hero-banner img{height:190px;min-height:190px}
 .reference-home .gold-grid{gap:10px 8px;padding-left:2px;padding-right:2px}
 .reference-home .gold-tile b{font-size:11px;letter-spacing:.55px}
}

/* v24.5 — final bottom-navigation geometry from the supplied reference. */
.reference-home { padding-bottom:104px!important; }
.reference-home .gold-bottom {
  position:fixed!important; left:50%!important; right:auto!important; bottom:0!important;
  transform:translateX(-50%)!important; width:min(100vw,533px)!important; max-width:533px!important;
  height:102px!important; margin:0!important; padding:0 4px 26px!important;
  align-items:end!important; border-radius:26px 26px 0 0!important;
  background:#30302f!important; box-shadow:0 -2px 10px rgba(0,0,0,.38)!important;
}
.reference-home .gold-bottom a { position:relative!important; gap:10px!important; color:#a0a09d!important; }
.reference-home .gold-bottom a svg { width:28px!important; height:28px!important; }
.reference-home .gold-bottom small { font-size:13px!important; }
.reference-home .gold-bottom a.active { color:#f1cf69!important; }
.reference-home .gold-bottom .gold-reward { color:#f2cc5b!important; }
.reference-home .gold-bottom .gold-reward .reward-wheel {
  position:relative!important; display:grid!important; place-items:center!important;
  width:88px!important; height:88px!important; margin-top:-48px!important;
  border:4px solid #dfb449!important; border-radius:50%!important;
  background:repeating-conic-gradient(#ffe27a 0deg 39deg,#e6ae32 40deg 43deg,#ffce47 44deg 84deg)!important;
  box-shadow:0 0 0 2px #41351e,0 3px 9px rgba(0,0,0,.55)!important;
}
.reference-home .gold-bottom .gold-reward .reward-wheel:before {
  content:""!important; position:absolute!important; inset:13px!important;
  border:2px solid #fff0ac!important; border-radius:50%!important;
  background:radial-gradient(circle at 35% 30%,#fff5ae,#ebbd43 75%)!important;
}
.reference-home .gold-bottom .gold-reward .reward-wheel b {
  position:relative!important; z-index:1!important; display:grid!important; place-items:center!important;
  width:27px!important; height:27px!important; border:2px solid #fff2bb!important;
  border-radius:50%!important; background:#dc2f23!important; color:#fff7db!important;
  font-size:10px!important; line-height:1!important; box-shadow:0 1px 4px #633!important;
}
.reference-home .gold-bottom .gold-reward small { color:#f2cc5b!important; font-size:13px!important; font-weight:800!important; }
.reference-home .gold-bottom .gold-reward span { width:88px!important; height:88px!important; }
.reference-home .gold-bottom .gold-reward span svg { display:none!important; }
.reference-home .gold-bottom .gold-activity-dot {
  position:absolute!important; top:0!important; right:calc(50% - 18px)!important;
  width:9px!important; height:9px!important; border-radius:50%!important;
  background:#e7464e!important; box-shadow:0 0 0 2px #30302f!important;
}
@media(max-width:380px) {
  .reference-home .gold-bottom { height:96px!important; padding-bottom:22px!important; }
  .reference-home .gold-bottom .gold-reward .reward-wheel,
  .reference-home .gold-bottom .gold-reward span { width:79px!important; height:79px!important; margin-top:-42px!important; }
}

/* v22.7: reference screenshot tuning — neutral charcoal, softer gold, proportional banner. */
body.reference-home{background:#252525!important;color:#ededed}
body.reference-home .topbar{background:#333331!important;border-bottom:1px solid #3b3934!important}
.reference-home .home-hero-slider{background:#252525!important}
.reference-home .home-hero-banners{height:auto!important;aspect-ratio:2.18/1;min-height:0!important}
.reference-home .home-hero-banner{height:100%!important;min-height:0!important}
.reference-home .home-hero-banner img{height:100%!important;min-height:0!important;object-fit:cover;object-position:center}
.reference-home .home-hero-dots{background:#252525!important}
@media(max-width:380px){.reference-home .home-hero-banners{aspect-ratio:2.12/1}}