/* FutureBet: the CeluApuestas room layout with the FutureBet galactic palette.
   Only colors, glow and the hero composition change; controls and flows are shared. */
:root{--bg:#030611;--panel:#070b1d;--panel2:#0d1330;--line:#1d2a55;--pink:#7c3aed;--pink2:#22d3ee;--text:#f8fbff;--muted:#9ca3af;
  --fb-cyan:#22d3ee;--fb-blue:#2563eb;--fb-violet:#7c3aed;--fb-magenta:#d946ef;--fb-gold:#f7d66b;
  --fb-gradient:linear-gradient(100deg,#7c3aed,#2563eb 55%,#22d3ee);--fb-glow:0 0 22px #22d3ee40,0 0 38px #7c3aed33}
html,body{background:#030611}
body{background:
  radial-gradient(1100px 560px at 85% -8%,#7c3aed30,transparent 62%),
  radial-gradient(900px 520px at -12% 18%,#22d3ee1c,transparent 60%),
  radial-gradient(1px 1px at 12% 22%,#ffffffb0 50%,transparent 51%),
  radial-gradient(1px 1px at 72% 12%,#ffffff90 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 38% 68%,#22d3eea0 50%,transparent 51%),
  radial-gradient(1px 1px at 88% 58%,#d946ef90 50%,transparent 51%),
  #030611;background-attachment:fixed;color:var(--text)}
.site-header{background:#030611e8;border-bottom:1px solid #22d3ee2e;box-shadow:0 8px 30px #0008;backdrop-filter:blur(10px)}
.site-header .brand img{filter:drop-shadow(0 0 10px #7c3aed66)}
.desktop-nav button.active,.desktop-nav button:hover{color:var(--fb-cyan);text-shadow:0 0 12px #22d3ee80}
.login-button,.balance-button{border-color:var(--fb-cyan);color:var(--fb-cyan);box-shadow:inset 0 0 12px #22d3ee22}
.site-header .celu-register-button,.primary-submit,.game-shell-actions #gameClose,.marketing-consent #consentAccept{background:var(--fb-gradient);border-color:transparent;color:#fff;box-shadow:var(--fb-glow)}
.carousel-dots button.active{background:var(--fb-gradient)}
.new-provider-section h2>span,.pink-bar{background:linear-gradient(180deg,#22d3ee,#7c3aed)!important;box-shadow:0 0 10px #22d3ee88}
.category-rail button{background:#070b1dcc;border-color:#1d2a55}
.category-rail button.active,.category-rail button:hover{border-color:var(--fb-cyan);box-shadow:0 0 18px #22d3ee33}
.category-rail button img{filter:drop-shadow(0 0 6px #22d3ee66)}
.provider-tab.active .provider-logo,.provider-tab:hover .provider-logo{border-color:var(--fb-cyan);box-shadow:0 0 14px #22d3ee4d}
.category-chip.active,.category-chip:hover{border-color:var(--fb-cyan);background:#0c1a3a}
.package-card.active{border-color:var(--fb-cyan);background:#0c1a3a}
.game-card{border-color:#22d3ee24;background:#070b1d}
.game-card:hover{border-color:var(--fb-cyan);box-shadow:0 0 0 1px #22d3ee55,0 10px 26px #7c3aed44}
.play-overlay{background:linear-gradient(160deg,#7c3aedb0,#2563eba8)}
.play-overlay:after{color:var(--fb-violet)}
.load-more,.mobile-account button{border-color:var(--fb-cyan);color:var(--fb-cyan)}
.mobile-bottom-nav{background:#030611f2;border-top:1px solid #22d3ee2e}
.mobile-bottom-nav button.active{color:var(--fb-cyan)}
.modal{background:#070b1d;border:1px solid #22d3ee3d;box-shadow:0 24px 70px #000c,0 0 34px #7c3aed33}
.modal-kicker,.auth-switch button{color:var(--fb-cyan)}
.game-shell{background:#030611}
.game-shell-bar{background:#050819;border-bottom:1px solid #22d3ee33}
.game-shell-bar>img{filter:drop-shadow(0 0 8px #7c3aed66)}
.game-loading:after{border-top-color:var(--fb-cyan)}
footer{border-top:1px solid #22d3ee22}
footer .footer-logo img{height:44px;width:auto}

/* Galactic hero composed in HTML: crisp text at every width, decorative art on the side. */
.fb-hero{background:#050819;box-shadow:0 0 0 1px #22d3ee33,0 18px 44px #0009}
.fb-hero .hero-slide.fb-slide{overflow:hidden;text-align:left;color:#fff;background:
  radial-gradient(520px 260px at 78% 50%,#7c3aed55,transparent 70%),
  radial-gradient(420px 220px at 95% 90%,#22d3ee33,transparent 70%),
  radial-gradient(1px 1px at 18% 30%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 44% 76%,#fff 50%,transparent 51%),
  radial-gradient(1.5px 1.5px at 60% 18%,#22d3ee 50%,transparent 51%),radial-gradient(1px 1px at 8% 82%,#d946ef 50%,transparent 51%),
  linear-gradient(120deg,#030611 0%,#081030 55%,#120a2e 100%)}
.fb-hero .fb-slide .fb-copy{position:absolute;left:5%;top:50%;z-index:2;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:56%}
.fb-hero .fb-slide small{font:800 12px/1.2 Inter,system-ui,sans-serif;letter-spacing:.18em;color:var(--fb-cyan);text-shadow:0 0 10px #22d3ee88}
.fb-hero .fb-slide strong{font:900 clamp(20px,3.2vw,40px)/1.08 Inter,system-ui,sans-serif;letter-spacing:-.01em;background:linear-gradient(90deg,#fff,#c7d2fe 55%,#67e8f9);-webkit-background-clip:text;background-clip:text;color:transparent}
.fb-hero .fb-slide em{font:500 clamp(12px,1.4vw,16px)/1.3 Inter,system-ui,sans-serif;font-style:normal;color:#c9d2ea}
.fb-hero .fb-slide b{margin-top:6px;padding:9px 16px;border-radius:999px;background:var(--fb-gradient);box-shadow:var(--fb-glow);font:900 13px/1 Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.fb-hero .hero-slide.fb-slide img.fb-art{position:absolute;right:3%;top:50%;z-index:1;width:auto;height:118%;max-width:48%;transform:translateY(-50%);object-fit:contain;filter:drop-shadow(0 0 26px #7c3aed88)}
@media(prefers-reduced-motion:no-preference){.fb-hero .hero-slide.fb-slide.active img.fb-art{animation:fb-float 7s ease-in-out infinite}}
@keyframes fb-float{0%,100%{transform:translateY(-50%)}50%{transform:translateY(-54%)}}
@media(max-width:820px){
  .fb-hero .fb-slide .fb-copy{max-width:62%;gap:4px}
  .fb-hero .fb-slide small{font-size:9px;letter-spacing:.14em}
  .fb-hero .fb-slide b{padding:7px 12px;font-size:11px}
  .fb-hero .hero-slide.fb-slide img.fb-art{height:104%;max-width:44%;right:1%}
}
/* The shared room layout keeps every banner at 5:1 (client request); the copy adapts to that strip. */
@media(max-width:520px){
  .fb-hero .fb-slide .fb-copy{left:4%;max-width:64%;gap:4px}
  .fb-hero .fb-slide small,.fb-hero .fb-slide em{display:none}
  .fb-hero .fb-slide strong{font-size:14px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .fb-hero .fb-slide b{margin-top:2px;padding:4px 9px;font-size:9px}
  .fb-hero .hero-slide.fb-slide img.fb-art{height:132%;max-width:34%}
}
