/* GalaxyBet production finish — shared visual language, loaded after legacy styles. */
:root {
  --gb-bg: #060b09;
  --gb-surface: #0d1712;
  --gb-surface-raised: #122018;
  --gb-surface-hover: #17281e;
  --gb-text: #f4f8f5;
  --gb-muted: #9baaa0;
  --gb-subtle: #718076;
  --gb-green: #65ff35;
  --gb-green-bright: #92ff72;
  --gb-green-ink: #071108;
  --gb-line: rgba(235, 255, 240, .09);
  --gb-line-active: rgba(101, 255, 53, .36);
  --gb-radius-control: 12px;
  --gb-radius-card: 18px;
  --gb-radius-panel: 22px;
  --gb-shadow-card: 0 12px 30px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .035);
  --gb-shadow-raised: 0 18px 38px rgba(0, 0, 0, .32), 0 0 0 1px rgba(101, 255, 53, .08);
  --gb-transition: 180ms cubic-bezier(.2, .8, .2, 1);
}

html { background: var(--gb-bg); scroll-behavior: smooth; }
body { min-width: 320px; background: radial-gradient(900px 600px at 12% -15%, rgba(101,255,53,.09), transparent 60%), linear-gradient(180deg, #08100c 0%, var(--gb-bg) 52%) !important; color: var(--gb-text); font-family: "Plus Jakarta Sans", Inter, Arial, sans-serif !important; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
button, input, select, textarea { font-family: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--gb-green) !important; outline-offset: 3px; }

/* Shared button and input geometry. */
#app :is(.btn, .gb-primary-btn, .gb-secondary-btn, .campaign-cta, .section-see-all, .mobile-game-play, .gb-result-open, .gb-hero-action, .gb-setting-action, .gb-wallet-actions button) {
  min-height: 42px; border-radius: var(--gb-radius-control) !important; font-weight: 800 !important; letter-spacing: -.01em; transition: transform var(--gb-transition), box-shadow var(--gb-transition), border-color var(--gb-transition), background var(--gb-transition), color var(--gb-transition) !important;
}
#app :is(.btn.primary, .gb-primary-btn, .campaign-cta, .mobile-game-play, .gb-result-open) { border: 1px solid rgba(189,255,171,.45) !important; background: linear-gradient(135deg, var(--gb-green-bright), var(--gb-green) 55%, #41d85d) !important; color: var(--gb-green-ink) !important; box-shadow: 0 8px 19px rgba(101,255,53,.16), inset 0 1px 0 rgba(255,255,255,.5) !important; }
#app :is(.btn:not(.primary), .gb-secondary-btn, .section-see-all, .gb-hero-action, .gb-setting-action) { border: 1px solid var(--gb-line) !important; background: rgba(255,255,255,.035) !important; color: var(--gb-text) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.035); }
@media (hover:hover) { #app :is(.btn, .gb-primary-btn, .gb-secondary-btn, .campaign-cta, .section-see-all, .mobile-game-play, .gb-result-open, .gb-hero-action, .gb-setting-action):hover { transform: translateY(-1px); border-color: var(--gb-line-active) !important; box-shadow: var(--gb-shadow-raised) !important; } }
#app :is(.btn, .gb-primary-btn, .gb-secondary-btn, .campaign-cta, .section-see-all, .mobile-game-play, .gb-result-open, .gb-hero-action, .gb-setting-action):active { transform: translateY(0) scale(.98) !important; }

#app :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { min-height: 42px; border: 1px solid var(--gb-line) !important; border-radius: var(--gb-radius-control) !important; background: rgba(7, 13, 10, .78) !important; color: var(--gb-text) !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.2); transition: border-color var(--gb-transition), box-shadow var(--gb-transition), background var(--gb-transition); }
#app :is(input, select, textarea):focus { border-color: var(--gb-line-active) !important; background: #0c1711 !important; box-shadow: 0 0 0 3px rgba(101,255,53,.11), inset 0 1px 2px rgba(0,0,0,.16) !important; }
#app :is(input, textarea)::placeholder { color: var(--gb-subtle); opacity: 1; }

/* Unified card depth with a deliberate, limited radius scale. */
#app :is(.card, .mobile-home-section, .gb-home-section, .gb-section-card, .gb-settings-card, .gb-library-section, .slot-lobby-card, .coupon-shell, .support-card, .support-widget, .gb-account-panel, .gb-profile-card, .mobile-coupon-page, .campaign-card) { border: 1px solid var(--gb-line) !important; border-radius: var(--gb-radius-card) !important; box-shadow: var(--gb-shadow-card) !important; }
#app :is(.hero-banner, .hero, .mobile-hero-slider, .jackpot-card, .page-hero) { border: 1px solid rgba(235,255,240,.11) !important; border-radius: var(--gb-radius-panel) !important; overflow: hidden; box-shadow: 0 20px 42px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.05) !important; }
#app :is(.card-head, .gb-home-section > header, .gb-section-card > header, .gb-settings-card > header, .gb-library-section > header, .section-header) { border-color: var(--gb-line) !important; }
#app :is(.card-head h3, .section-title, .gb-section-card h2, .gb-settings-card h2, .gb-library-section h2, h1, h2, h3) { color: var(--gb-text); letter-spacing: -.03em; }
#app :is(.card-head h3, .section-title) { font-size: clamp(16px, 1.25vw, 20px); }

/* Interactive tiles gain only a subtle lift, preserving dense casino layouts. */
#app :is(.game, .mobile-game-card, .premium-game-card, .bb-catalog-game-card, .bb-real-game-card, .bb-public-game-card-final, .hpf-game-card, .rapid-final-card, .rf-game-card, .gamblehub-game-card, .promo, .mobile-promo-card, .campaign-card, .provider-card) { border: 1px solid transparent; border-radius: var(--gb-radius-card) !important; overflow: hidden; transition: transform var(--gb-transition), box-shadow var(--gb-transition), border-color var(--gb-transition), background var(--gb-transition) !important; }
@media (hover:hover) { #app :is(.game, .mobile-game-card, .premium-game-card, .bb-catalog-game-card, .bb-real-game-card, .bb-public-game-card-final, .hpf-game-card, .rapid-final-card, .rf-game-card, .gamblehub-game-card, .promo, .mobile-promo-card, .campaign-card, .provider-card):hover { transform: translateY(-3px); border-color: rgba(101,255,53,.2); box-shadow: var(--gb-shadow-raised) !important; } }
#app :is(.game img, .mobile-game-card img, .premium-game-card img, .bb-catalog-game-card img, .bb-real-game-card img, .bb-public-game-card-final img, .hpf-game-card img, .rapid-final-card img, .rf-game-card img, .gamblehub-game-card img, .promo img, .mobile-promo-card img, .campaign-card img) { display: block; width: 100%; object-fit: cover; }

/* Navigation and selectable controls share a consistent active affordance. */
.topbar { border-bottom-color: var(--gb-line) !important; background: rgba(7, 13, 10, .86); backdrop-filter: blur(18px) saturate(135%); }
.nav a { position: relative; color: var(--gb-muted) !important; font-weight: 700; transition: color var(--gb-transition); }
.nav a::after { content: ""; position: absolute; right: 10px; bottom: -13px; left: 10px; height: 2px; border-radius: 999px; background: var(--gb-green); box-shadow: 0 0 12px rgba(101,255,53,.75); transform: scaleX(0); transition: transform var(--gb-transition); }
.nav a:hover, .nav a.active, .nav a[aria-current="page"] { color: var(--gb-text) !important; }
.nav a.active::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.topbar .mobile-header-actions .gb-mobile-auth-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px; min-width: 104px !important; min-height: 42px !important; padding: 0 13px !important; border-radius: var(--gb-radius-control) !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1; }
.topbar .mobile-header-actions .gb-mobile-auth-btn .gb-mobile-auth-icon { display: block !important; width: 16px !important; height: 16px !important; flex: 0 0 16px !important; fill: none !important; stroke: currentColor !important; stroke-width: 2 !important; }
.topbar .mobile-header-actions .gb-mobile-login-btn { border: 1px solid var(--gb-line-active) !important; background: rgba(255,255,255,.035) !important; color: var(--gb-text) !important; }
.topbar .mobile-header-actions .gb-mobile-register-btn { border: 1px solid rgba(189,255,171,.45) !important; background: linear-gradient(135deg, var(--gb-green-bright), var(--gb-green)) !important; color: var(--gb-green-ink) !important; box-shadow: 0 8px 19px rgba(101,255,53,.16), inset 0 1px 0 rgba(255,255,255,.5) !important; }
#app :is(.tabs button, .casino-tabs button, .mobile-coupon-tabs button, .gb-filter-tabs button, .bet-provider-tabs button, .bb-games-provider-tabs button, .rf-provider-tabs button, .provider-button-grid button, .mobile-provider-card, .bb-public-provider-row button) { border: 1px solid var(--gb-line) !important; border-radius: 999px !important; background: rgba(255,255,255,.03) !important; color: var(--gb-muted) !important; font-weight: 750 !important; transition: border-color var(--gb-transition), color var(--gb-transition), background var(--gb-transition), box-shadow var(--gb-transition) !important; }
#app :is(.tabs button.active, .casino-tabs button.active, .mobile-coupon-tabs button.active, .gb-filter-tabs button.active, .bet-provider-tabs button.active, .bb-games-provider-tabs button.active, .rf-provider-tabs button.active, .provider-button-grid button.active, .mobile-provider-card.active) { border-color: var(--gb-line-active) !important; background: rgba(101,255,53,.12) !important; color: var(--gb-green) !important; box-shadow: inset 0 0 0 1px rgba(101,255,53,.05); }
.odd { border-radius: 10px !important; border-color: var(--gb-line) !important; transition: transform var(--gb-transition), border-color var(--gb-transition), background var(--gb-transition), box-shadow var(--gb-transition) !important; }
.odd.selected, .odd:hover { border-color: var(--gb-line-active) !important; box-shadow: 0 0 0 2px rgba(101,255,53,.09); }

/* Stable image and loading presentation. */
.loading-screen { background: radial-gradient(circle at 50% 46%, rgba(101,255,53,.10), transparent 28%), #060b09 !important; }
.loading-screen::after { content: ""; position: absolute; width: 124px; height: 3px; margin-top: 112px; border-radius: 999px; background: linear-gradient(90deg, transparent, var(--gb-green), transparent); background-size: 200% 100%; animation: gb-polish-shimmer 1.15s linear infinite; }
.loading-screen > img { transform: none !important; }
#app :is(.gb-route-skeleton, .gb-home-skeleton) { background: var(--gb-bg) !important; }
#app :is(.gb-route-skeleton i, .gb-route-skeleton b, .gb-route-skeleton span, .gb-home-skeleton i, .gb-home-skeleton .gb-sk-bar, .gb-home-skeleton .gb-sk-hero) { background: linear-gradient(90deg, #0e1812 10%, #1a291e 45%, #0e1812 80%) !important; background-size: 220% 100% !important; animation: gb-polish-shimmer 1.35s linear infinite !important; }
@keyframes gb-polish-shimmer { to { background-position: -220% 0; } }

/* Route transitions never cause horizontal overflow or change their occupied geometry. */
#app, #app > *, .wrap { min-width: 0; }
img { max-width: 100%; }

@media (max-width: 800px) {
  body { background: radial-gradient(500px 380px at 50% -12%, rgba(101,255,53,.10), transparent 62%), var(--gb-bg) !important; }
  .wrap { padding-inline: 14px !important; }
  .topbar.mobile-header { border-bottom-color: var(--gb-line) !important; background: rgba(7,13,10,.94) !important; }
  .topbar.mobile-header .topbar-inner { padding-inline: max(10px, env(safe-area-inset-left)) max(10px, env(safe-area-inset-right)) !important; }
  .topbar .mobile-header-actions .gb-mobile-auth-btn { min-width: 84px !important; min-height: 44px !important; font-size: 10px !important; }
  .bb-bottom-nav-real { border: 1px solid var(--gb-line) !important; border-radius: 18px 18px 0 0 !important; background: linear-gradient(180deg, rgba(18,31,23,.98), rgba(6,11,8,.99)) !important; box-shadow: 0 -12px 30px rgba(0,0,0,.24) !important; }
  .bb-bottom-nav-real > button { color: var(--gb-subtle) !important; transition: color var(--gb-transition), transform var(--gb-transition) !important; }
  .bb-bottom-nav-real > button.active { color: var(--gb-green) !important; }
  #app :is(.card, .mobile-home-section, .gb-home-section, .gb-section-card, .gb-settings-card, .gb-library-section, .slot-lobby-card, .coupon-shell, .support-card, .support-widget, .gb-account-panel, .gb-profile-card, .mobile-coupon-page, .campaign-card) { border-radius: 16px !important; }
  #app :is(.hero-banner, .hero, .mobile-hero-slider, .jackpot-card, .page-hero) { border-radius: 18px !important; }
  #app :is(.btn, .gb-primary-btn, .gb-secondary-btn, .campaign-cta, .section-see-all, .mobile-game-play, .gb-result-open, .gb-hero-action, .gb-setting-action, .gb-wallet-actions button) { min-height: 40px; border-radius: 11px !important; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }