/* =====================================================================
   RB-PRO CASINO THEME — original dark navy / gold redesign
   Notes: inspired by modern Thai casino lobby patterns, not a 1:1 copy.
   ===================================================================== */
:root{
  --rb-bg:#030712;
  --rb-deep:#050b18;
  --rb-navy:#071834;
  --rb-navy2:#0a2752;
  --rb-card:#0b1f42;
  --rb-card2:#123363;
  --rb-gold:#ffe58d;
  --rb-gold2:#d3962d;
  --rb-gold3:#8a5511;
  --rb-cyan:#13eaff;
  --rb-blue:#1675ff;
  --rb-line:rgba(255,229,141,.22);
  --rb-line-blue:rgba(70,155,255,.28);
  --rb-text:#ffffff;
  --rb-muted:#adc0df;
  --rb-shadow:0 18px 42px rgba(0,0,0,.42);
  --rb-radius:22px;
}
html,body{background:var(--rb-bg)!important;color:var(--rb-text)}
body:before{background:
  radial-gradient(circle at 50% -10%,rgba(23,117,255,.28),transparent 34%),
  radial-gradient(circle at 8% 16%,rgba(255,229,141,.12),transparent 24%),
  radial-gradient(circle at 92% 32%,rgba(19,234,255,.10),transparent 24%),
  linear-gradient(180deg,#030712 0%,#06142b 34%,#020610 100%)!important}
body:after{background:
  linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
  linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px)!important;background-size:38px 38px!important;opacity:.75}

/* Top install / header */
.app-install{height:54px;background:linear-gradient(180deg,#111827,#050914)!important;border-bottom:1px solid var(--rb-line);box-shadow:0 10px 26px rgba(0,0,0,.35)}
.install-btn{border-radius:999px;background:linear-gradient(180deg,var(--rb-gold),var(--rb-gold2))!important;color:#231300!important;box-shadow:0 8px 22px rgba(211,150,45,.28)}
.topbar{top:54px!important;background:rgba(5,11,24,.88)!important;backdrop-filter:blur(14px);border-bottom:1px solid var(--rb-line)!important;box-shadow:0 14px 34px rgba(0,0,0,.35)}
.topbar-inner{max-width:1440px!important;height:78px!important}
.brand-logo{height:48px!important;min-width:154px!important;border-radius:999px!important;border:1.5px solid rgba(255,229,141,.72)!important;background:linear-gradient(180deg,#31200b,#07070c 54%,#1e1336)!important;color:#ffeaa6!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 0 24px rgba(255,201,64,.22)!important;font-size:25px!important}
.brand-logo:before,.brand-logo:after{border-color:rgba(255,229,141,.72)!important;background:#07070c!important}
.icon-btn,.desktop-search-btn{background:rgba(255,255,255,.06)!important;border:1px solid var(--rb-line-blue)!important;color:#dcecff!important;box-shadow:none!important}
.desktop-promo-btn{height:48px!important;border-radius:999px!important;background:linear-gradient(180deg,#163e76,#071a38)!important;border:1px solid var(--rb-line)!important;color:#fff!important;box-shadow:0 10px 24px rgba(0,0,0,.24)}
.desktop-auth .btn-login,.desktop-auth .btn-register{height:50px!important;border-radius:999px!important;min-width:132px;font-size:15px!important}
.desktop-auth .btn-login{background:linear-gradient(180deg,#ffe994,#ca8322)!important;color:#1b1000!important;box-shadow:0 10px 22px rgba(202,131,34,.28)}
.desktop-auth .btn-register{background:linear-gradient(180deg,#102a55,#07152e)!important;border:1px solid rgba(255,229,141,.7)!important;color:#ffedb4!important}
.top-user-card,.top-balance-card{height:50px!important;border-radius:999px!important;background:linear-gradient(180deg,#112c5a,#07162e)!important;border:1px solid var(--rb-line-blue)!important;box-shadow:0 10px 22px rgba(0,0,0,.22)}
.top-action,.top-logout{height:48px!important;border-radius:999px!important}

/* Category bar */
.cat-tabs{background:rgba(3,7,18,.82)!important;backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,229,141,.14)!important}
.cat-tabs{top:132px!important}
.cat-tabs-inner{max-width:1440px!important;gap:10px!important;padding:10px 22px!important}
.cat-tab{height:52px!important;border-radius:16px!important;border:1px solid transparent!important;padding:0 18px!important;color:#c9d7f1!important;background:transparent!important}
.cat-tab i{color:var(--rb-gold)!important}
.cat-tab.active{background:linear-gradient(180deg,#143a70,#081a37)!important;border-color:rgba(19,234,255,.48)!important;color:#fff!important;box-shadow:0 0 0 1px rgba(19,234,255,.08),0 12px 26px rgba(0,0,0,.24)}
.cat-tab.active i{color:var(--rb-cyan)!important}

/* Layout */
.app{max-width:1440px!important;gap:18px!important;padding-top:18px!important}
@media (min-width:1024px){.app{grid-template-columns:244px minmax(0,1fr) 326px!important}.desktop-side,.right-sidebar{top:204px!important}}
.main{min-width:0}.panel{border-radius:var(--rb-radius)!important;background:linear-gradient(180deg,rgba(13,35,74,.94),rgba(4,11,26,.96))!important;border:1px solid var(--rb-line-blue)!important;box-shadow:var(--rb-shadow)!important;padding:18px!important}.notice{height:46px!important;border-radius:16px!important;background:linear-gradient(180deg,rgba(10,30,64,.94),rgba(4,11,25,.96))!important;border:1px solid rgba(255,229,141,.18)!important;box-shadow:0 12px 28px rgba(0,0,0,.22)!important}.notice i{color:var(--rb-gold)!important}

/* Side rail */
.rail-account,.rail-link{border-radius:20px!important;border:1px solid var(--rb-line-blue)!important;background:linear-gradient(180deg,#0f2d5c,#06142a)!important;box-shadow:0 12px 28px rgba(0,0,0,.24)!important}.rail-link{height:72px!important}.rail-link .ricon{background:linear-gradient(180deg,rgba(255,229,141,.22),rgba(255,229,141,.05))!important;color:var(--rb-gold)!important}.rail-link.active{background:linear-gradient(180deg,#f8fbff,#d8e6ff)!important;color:#071428!important}.rail-link.active .ricon{color:#0a56a4!important}

/* Hero */
.hero-slider{border-radius:26px!important;border:1px solid rgba(255,229,141,.22)!important;background:linear-gradient(135deg,#07152d,#102f64)!important;box-shadow:0 22px 58px rgba(0,0,0,.45)!important;min-height:300px!important}.hero-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,5,15,.52),transparent 48%,rgba(1,5,15,.18));pointer-events:none;z-index:2}.hero-slide picture img{width:100%!important;height:100%!important;object-fit:cover!important}.hero-slide .blur-bg{display:none!important}.hero-fallback{background:
  radial-gradient(circle at 80% 40%,rgba(255,229,141,.24),transparent 28%),
  linear-gradient(105deg,#071326,#112f62 58%,#1a102d)!important}.hero-fallback h1{color:#ffe99b!important;text-shadow:0 3px 0 #5b3300,0 0 24px rgba(255,229,141,.3)!important}.hero-arrow{background:rgba(3,8,18,.72)!important;border:1px solid rgba(255,229,141,.26)!important}.hero-dot.active{background:linear-gradient(180deg,var(--rb-gold),var(--rb-gold2))!important}

/* Auth quick */
.auth-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;margin:14px 0!important}.auth-row button{height:58px!important;border-radius:18px!important;font-size:18px!important;font-weight:1000!important;box-shadow:0 16px 32px rgba(0,0,0,.32)!important}.auth-row .register{background:linear-gradient(180deg,#ffe994,#bc781b)!important;color:#1d1000!important;border:0!important}.auth-row .login{background:linear-gradient(180deg,#143b73,#07172f)!important;color:#fff!important;border:1px solid rgba(255,229,141,.5)!important}

/* Quick lobby icons */
.rb-quick-menu{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:14px 0}.rb-quick-item{height:96px;border:1px solid var(--rb-line-blue);border-radius:22px;background:linear-gradient(180deg,#123563,#07172f);box-shadow:0 14px 30px rgba(0,0,0,.28);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-weight:1000;color:#fff;cursor:pointer;transition:.18s}.rb-quick-item:hover{transform:translateY(-3px);border-color:rgba(255,229,141,.45)}.rb-quick-item span{width:44px;height:44px;border-radius:16px;background:linear-gradient(180deg,#ffe58d,#bd781c);color:#241400;display:grid;place-items:center;font-size:19px;box-shadow:0 9px 22px rgba(211,150,45,.22)}.rb-quick-item small{font-size:12px;color:var(--rb-muted);font-weight:800}.rb-quick-title{display:flex;align-items:center;gap:10px;margin:16px 0 10px;font-size:18px;font-weight:1000}.rb-quick-title i{color:var(--rb-gold)}

/* Titles / tabs */
.tab-row{background:linear-gradient(180deg,rgba(9,31,67,.82),rgba(4,12,27,.86))!important;border:1px solid rgba(255,229,141,.15)!important;border-radius:20px!important;padding:8px!important;box-shadow:0 14px 30px rgba(0,0,0,.22)!important}.tab-pill{border-radius:14px!important;color:#cbdaf4!important}.tab-pill.active{background:linear-gradient(180deg,#ffe78d,#b8751a)!important;color:#1c1000!important;box-shadow:0 12px 24px rgba(184,117,26,.22)!important}.bar-title{height:50px!important;border-radius:18px!important;background:linear-gradient(90deg,#102d59,#071426)!important;border:1px solid rgba(255,229,141,.18)!important;box-shadow:0 14px 30px rgba(0,0,0,.24)!important;color:#fff!important}.bar-title i{color:var(--rb-gold)!important}.bar-title .extra{color:#cbdaf4!important}

/* Game cards — full image, no blurry blank area */
.game-grid{gap:16px!important}.game-card{border-radius:22px!important;background:linear-gradient(180deg,#112f5d,#050d1e)!important;border:1px solid rgba(87,155,255,.34)!important;box-shadow:0 17px 38px rgba(0,0,0,.34)!important;overflow:hidden!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important}.game-card:hover{transform:translateY(-5px)!important;border-color:rgba(255,229,141,.46)!important;box-shadow:0 22px 50px rgba(0,0,0,.46)!important}.game-thumb{aspect-ratio:3/4!important;background:#071426!important}.game-thumb .blur-bg{display:none!important}.game-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transition:transform .22s ease,filter .22s ease}.game-card:hover .game-thumb img{transform:scale(1.055);filter:saturate(1.08) contrast(1.03)}.game-info{min-height:72px!important;padding:12px 12px 13px!important;background:linear-gradient(180deg,rgba(7,20,42,.97),rgba(3,8,20,.99))!important;border-top:1px solid rgba(255,255,255,.07)!important}.game-info b{font-size:15px!important;line-height:1.25!important}.game-info span{font-size:11px!important;color:#aebee0!important}.game-badge{top:10px!important;right:10px!important;border-radius:999px!important;padding:5px 10px!important;background:linear-gradient(180deg,#ff9b39,#e94317)!important;box-shadow:0 8px 18px rgba(233,67,23,.35)!important}.game-badge.new{background:linear-gradient(180deg,#30e477,#0f9d42)!important}.game-card.launching::after{content:'กำลังเข้าเกม...'!important;inset:10px!important;border-radius:18px!important;background:rgba(1,7,18,.76)!important;backdrop-filter:blur(10px)!important;border:1px solid rgba(255,229,141,.35)!important;color:#fff!important;font-weight:1000!important}

/* Providers */
.provider-grid{gap:16px!important}.provider-card{border-radius:22px!important;min-height:158px!important;background:radial-gradient(circle at 82% 0,rgba(255,229,141,.12),transparent 35%),linear-gradient(180deg,#123665,#061327)!important;border:1px solid rgba(87,155,255,.34)!important;box-shadow:0 17px 38px rgba(0,0,0,.32)!important;transition:.18s!important}.provider-card:hover{transform:translateY(-5px)!important;border-color:rgba(255,229,141,.48)!important}.provider-badge{border-radius:999px!important;background:linear-gradient(180deg,#13eaff,#0677d9)!important}.provider-logo{height:76px!important}.provider-logo img{max-height:66px!important;max-width:132px!important}.provider-meta b{font-size:15px!important}.provider-meta span{font-size:11px!important;color:#adc0df!important}

/* Inputs & buttons */
.toolbar{display:grid!important;grid-template-columns:minmax(230px,1fr) 200px auto!important;gap:12px!important}.input{height:54px!important;border-radius:18px!important;background:rgba(2,8,20,.78)!important;border:1px solid rgba(137,178,236,.28)!important;color:#fff!important}.input:focus{border-color:rgba(255,229,141,.55)!important;box-shadow:0 0 0 4px rgba(255,229,141,.08)!important}.btn-main,.btn-dark,.games-back{height:52px!important;border-radius:18px!important;font-weight:1000!important}.btn-main{background:linear-gradient(180deg,#13eaff,#0677d9)!important}.btn-dark,.games-back{background:linear-gradient(180deg,#143a70,#071832)!important;border:1px solid rgba(255,229,141,.25)!important;color:#fff!important}

/* Cards */
.jackpot-card,.lb-card,.minigame-card,.shortcut-card,.guide-row,.online-box,.live-card{border-radius:22px!important;border:1px solid rgba(87,155,255,.32)!important;background:linear-gradient(180deg,#112f5d,#050f24)!important;box-shadow:0 16px 36px rgba(0,0,0,.28)!important}.jp-img{border-radius:18px!important;background:radial-gradient(circle at 50% 40%,rgba(255,229,141,.22),transparent 35%),linear-gradient(135deg,#351300,#5d2500)!important;border:1px solid rgba(255,229,141,.18)!important}.lb-row{border-radius:16px!important;background:rgba(255,255,255,.045)!important}.online-img{border-radius:20px!important}.footer{background:linear-gradient(180deg,#050b18,#02050b)!important;border-top:1px solid rgba(255,229,141,.16)!important}.bank-logo,.partner-pill,.cert{border-radius:999px!important;background:linear-gradient(180deg,#102c58,#06142c)!important;border:1px solid rgba(255,229,141,.18)!important}

/* Modals */
.modal-card{border-radius:26px!important;background:linear-gradient(180deg,#0d244a,#040c1d)!important;border:1px solid rgba(255,229,141,.22)!important;box-shadow:0 28px 80px rgba(0,0,0,.62)!important}.auth-tab.active{background:linear-gradient(180deg,#ffe994,#bd781c)!important;color:#1b1000!important}.auth-tab{background:#07172f!important;color:#d9e5ff!important}.close-btn{border-radius:14px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.1)!important}

/* Bottom nav */
.bottom-nav{background:transparent!important}.bottom-nav-inner{left:10px!important;right:10px!important;bottom:8px!important;width:auto!important;border-radius:24px!important;background:rgba(5,11,24,.92)!important;backdrop-filter:blur(14px);border:1px solid rgba(255,229,141,.22)!important;box-shadow:0 18px 44px rgba(0,0,0,.48)!important;height:70px!important}.nav-item.active .nav-icon{background:linear-gradient(180deg,#ffe994,#bd781c)!important;color:#1b1000!important}.nav-icon{border-radius:16px!important}.cs-float{background:linear-gradient(180deg,#13eaff,#0677d9)!important;border:1px solid rgba(255,255,255,.2)!important;box-shadow:0 16px 36px rgba(0,0,0,.35)!important}

/* Mobile / tablet */
@media (max-width:1023px){
  .app-install{display:none!important}.topbar{top:0!important}.topbar-inner{height:64px!important}.cat-tabs{display:none!important}.app{display:block!important;max-width:760px!important;padding:10px 10px calc(var(--bottom) + 22px)!important}.desktop-side{display:none!important}.right-sidebar{display:none!important}.main{width:100%!important}.drawer{background:linear-gradient(180deg,#0d244a,#040c1d)!important}.hero-slider{min-height:220px!important;border-radius:22px!important}.rb-quick-menu{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.rb-quick-item{height:82px;border-radius:18px}.rb-quick-item span{width:40px;height:40px;border-radius:14px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}.provider-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}.toolbar{grid-template-columns:1fr!important}.footer{padding-bottom:calc(var(--bottom) + 24px)!important}.topbar .logo{gap:9px!important}.topbar .logo .brand-logo{min-width:124px!important;height:42px!important;font-size:20px!important}.flag-btn{width:38px!important;height:38px!important}.icon-btn{width:42px!important;height:42px!important}.game-info{min-height:58px!important;padding:8px 7px!important}.game-info b{font-size:12px!important}.game-info span{font-size:9.5px!important}.game-thumb{aspect-ratio:3/4!important}.provider-card{min-height:112px!important;padding:9px 5px!important;border-radius:16px!important}.provider-logo{height:46px!important;margin-top:14px!important}.provider-logo img{max-width:66px!important;max-height:40px!important}.provider-meta b{font-size:10.5px!important}.provider-meta span{font-size:8.8px!important}.provider-badge{font-size:8.5px!important;padding:3px 6px!important}.auth-row button{height:52px!important;font-size:16px!important}.panel{padding:12px!important;border-radius:20px!important}.section-head{gap:8px!important}.section-head h2{font-size:18px!important}.bar-title{height:44px!important;font-size:15px!important}.tab-row{overflow:auto!important;scrollbar-width:none}.tab-row::-webkit-scrollbar{display:none}.tab-pill{min-width:142px!important}.modal{padding:10px!important}.modal-card{width:96vw!important;border-radius:22px!important}.cs-float{right:14px!important;bottom:calc(var(--bottom) + 16px)!important;width:54px!important;height:54px!important}
}
@media (max-width:520px){
  :root{--bottom:78px}.topbar-inner{grid-template-columns:auto 1fr auto!important;padding:0 10px!important}.topbar .logo{justify-self:center!important}.desktop-search-btn,.desktop-promo-btn,.topbar .logo .flag-btn{display:none!important}.top-right-block{min-width:42px}.rb-quick-menu{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.rb-quick-item{height:72px;border-radius:15px;font-size:11px}.rb-quick-item small{display:none}.rb-quick-item span{width:34px;height:34px;border-radius:12px;font-size:15px}.hero-slider{min-height:168px!important;border-radius:18px!important}.hero-fallback h1{font-size:24px!important}.hero-fallback p{font-size:12px!important}.notice{height:40px!important;border-radius:14px!important;font-size:12px!important}.auth-row{gap:8px!important}.auth-row button{height:48px!important;border-radius:15px!important;font-size:15px!important}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}.game-card{border-radius:15px!important}.game-info{min-height:52px!important}.game-info b{font-size:10.8px!important}.game-info span{font-size:8.8px!important}.game-badge{top:6px!important;right:6px!important;font-size:8.5px!important;padding:3px 7px!important}.provider-grid{gap:7px!important}.provider-card{min-height:102px!important}.footer-grid{grid-template-columns:1fr!important}.bottom-nav-inner{height:66px!important;border-radius:20px!important}.nav-item{font-size:9.5px!important}.nav-icon{width:30px!important;height:30px!important}.brand-logo{min-width:112px!important;font-size:18px!important}.brand-logo:before,.brand-logo:after{width:14px;height:11px}.promo-preview-img{width:100%!important}
}
@media (max-width:370px){.game-grid,.provider-grid{gap:6px!important}.game-info b{font-size:10px!important}.game-info span{font-size:8px!important}.provider-card{min-height:96px!important}.provider-logo img{max-width:58px!important;max-height:36px!important}.rb-quick-item{height:68px}.bottom-nav-inner{left:6px!important;right:6px!important}.nav-item{font-size:8.8px!important}}
