@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,700;0,800;0,900;1,800&family=DM+Sans:wght@500;600;700;800&display=swap');

/* BlockBet modal redesign — intentionally much more visual than the old flat UI */

/* ---------- DAILY SPIN ---------- */
body.lobby-app .daily-spin-dialog{
  width:min(880px,calc(100vw - 28px))!important;
  max-width:880px!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #4d5a73!important;
  border-radius:12px!important;
  background:#0c1018!important;
  color:#fff!important;
  box-shadow:0 42px 130px rgba(0,0,0,.86),0 0 0 1px rgba(137,99,255,.12)!important;
}
body.lobby-app .daily-spin-dialog::backdrop{
  background:rgba(2,4,8,.90)!important;
  backdrop-filter:blur(12px) saturate(.7)!important;
  -webkit-backdrop-filter:blur(12px) saturate(.7)!important;
}
body.lobby-app .daily-spin-dialog::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  z-index:0!important;
  background:
    radial-gradient(circle at 84% 4%,rgba(123,66,255,.38),transparent 28%),
    radial-gradient(circle at 13% 10%,rgba(39,220,140,.26),transparent 24%),
    linear-gradient(125deg,transparent 0 54%,rgba(255,255,255,.025) 54% 55%,transparent 55% 100%)!important;
}
body.lobby-app .daily-spin-dialog>*{position:relative!important;z-index:1!important}

body.lobby-app .spin-heading{
  min-height:105px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:23px 26px!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:
    linear-gradient(90deg,rgba(38,220,139,.13),transparent 43%),
    linear-gradient(180deg,rgba(255,255,255,.025),transparent)!important;
}
body.lobby-app .spin-heading .eyebrow{
  display:inline-flex!important;
  align-items:center!important;
  min-height:24px!important;
  padding:0 9px!important;
  border:1px solid rgba(89,235,164,.42)!important;
  border-radius:4px!important;
  background:#163a2a!important;
  color:#7ff2b8!important;
  font:800 8px/1 'DM Sans',sans-serif!important;
  letter-spacing:.16em!important;
}
body.lobby-app .spin-heading h2{
  margin:9px 0 0!important;
  color:#fff!important;
  font:900 36px/.88 'Barlow Condensed',sans-serif!important;
  letter-spacing:-.025em!important;
  text-transform:uppercase!important;
  text-shadow:0 4px 16px rgba(0,0,0,.55)!important;
}
body.lobby-app .spin-close{
  width:44px!important;
  height:44px!important;
  border:1px solid #465062!important;
  border-bottom:3px solid #272e3a!important;
  border-radius:7px!important;
  background:linear-gradient(#202838,#161d29)!important;
  color:#b7c0cf!important;
  font-size:22px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
body.lobby-app .spin-close:hover{color:#fff!important;filter:brightness(1.13)!important}

body.lobby-app .spin-intro{
  margin:0!important;
  padding:16px 26px 6px!important;
  color:#8994a7!important;
  font:600 10px/1.55 'DM Sans',sans-serif!important;
}

body.lobby-app .spin-window{
  position:relative!important;
  overflow:hidden!important;
  min-height:164px!important;
  margin:10px 26px 0!important;
  padding:19px 15px!important;
  border:1px solid #384257!important;
  border-radius:9px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 22%),
    #090e16!important;
  box-shadow:inset 0 18px 28px rgba(0,0,0,.23),inset 0 -18px 30px rgba(0,0,0,.34)!important;
}
body.lobby-app .spin-window::before,
body.lobby-app .spin-window::after{
  content:""!important;
  position:absolute!important;
  z-index:5!important;
  top:0!important;
  bottom:0!important;
  width:60px!important;
  pointer-events:none!important;
}
body.lobby-app .spin-window::before{left:0!important;background:linear-gradient(90deg,#090e16 15%,transparent)!important}
body.lobby-app .spin-window::after{right:0!important;background:linear-gradient(270deg,#090e16 15%,transparent)!important}

body.lobby-app .spin-marker{
  z-index:10!important;
  top:0!important;
  border-left:12px solid transparent!important;
  border-right:12px solid transparent!important;
  border-top:18px solid #58efa7!important;
  filter:drop-shadow(0 0 9px rgba(69,239,162,.9))!important;
}
body.lobby-app .spin-marker::after{
  content:""!important;
  position:absolute!important;
  top:-18px!important;
  left:-2px!important;
  width:4px!important;
  height:151px!important;
  background:linear-gradient(#58efa7,rgba(88,239,167,.20) 62%,transparent)!important;
  box-shadow:0 0 16px rgba(88,239,167,.42)!important;
}

body.lobby-app .spin-reel{
  display:flex!important;
  align-items:stretch!important;
  gap:10px!important;
  min-width:max-content!important;
  width:max-content!important;
  padding:0 20px!important;
}
body.lobby-app .spin-tile{
  position:relative!important;
  flex:0 0 116px!important;
  width:116px!important;
  height:124px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:5px!important;
  padding:13px 8px 12px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-bottom-width:3px!important;
  border-radius:8px!important;
  color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 10px 20px rgba(0,0,0,.28)!important;
}
body.lobby-app .spin-tile:nth-child(10n+1){background:radial-gradient(circle at 50% 35%,rgba(81,255,168,.38),transparent 36%),linear-gradient(150deg,#173f2f,#11251e)!important;border-color:#2f7656!important}
body.lobby-app .spin-tile:nth-child(10n+2){background:radial-gradient(circle at 50% 35%,rgba(224,233,239,.34),transparent 36%),linear-gradient(150deg,#39434c,#1a2229)!important;border-color:#56626c!important}
body.lobby-app .spin-tile:nth-child(10n+3){background:radial-gradient(circle at 50% 35%,rgba(255,185,40,.45),transparent 36%),linear-gradient(150deg,#5a3614,#281c12)!important;border-color:#8c5620!important}
body.lobby-app .spin-tile:nth-child(10n+4){background:radial-gradient(circle at 50% 35%,rgba(190,107,255,.45),transparent 36%),linear-gradient(150deg,#432563,#20162e)!important;border-color:#693d8f!important}
body.lobby-app .spin-tile:nth-child(10n+5){background:radial-gradient(circle at 50% 35%,rgba(67,234,255,.46),transparent 36%),linear-gradient(150deg,#155463,#102830)!important;border-color:#237a8b!important}
body.lobby-app .spin-tile:nth-child(10n+6){background:radial-gradient(circle at 50% 35%,rgba(255,236,119,.45),transparent 36%),linear-gradient(150deg,#574c22,#282315)!important;border-color:#7e7133!important}
body.lobby-app .spin-tile:nth-child(10n+7){background:radial-gradient(circle at 50% 35%,rgba(160,180,195,.36),transparent 36%),linear-gradient(150deg,#35434b,#192228)!important;border-color:#51606a!important}
body.lobby-app .spin-tile:nth-child(10n+8){background:radial-gradient(circle at 50% 35%,rgba(255,219,95,.42),transparent 36%),linear-gradient(150deg,#55401f,#251d12)!important;border-color:#81632a!important}
body.lobby-app .spin-tile:nth-child(10n+9){background:radial-gradient(circle at 50% 35%,rgba(255,100,79,.42),transparent 36%),linear-gradient(150deg,#59281e,#281613)!important;border-color:#8d3c2c!important}
body.lobby-app .spin-tile:nth-child(10n){background:radial-gradient(circle at 50% 35%,rgba(255,225,79,.52),transparent 36%),linear-gradient(150deg,#5d4914,#251e10)!important;border-color:#9c7a20!important}

body.lobby-app .spin-tile::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.10),transparent 26%),
    linear-gradient(180deg,transparent 52%,rgba(0,0,0,.28) 100%)!important;
}
body.lobby-app .spin-tile img{
  position:relative!important;
  z-index:2!important;
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
  image-rendering:pixelated!important;
  filter:drop-shadow(0 8px 9px rgba(0,0,0,.48))!important;
}
body.lobby-app .spin-tile b{
  position:relative!important;
  z-index:2!important;
  color:#fff!important;
  font:900 11px/1 'DM Sans',sans-serif!important;
  text-shadow:0 2px 5px rgba(0,0,0,.55)!important;
}
body.lobby-app .spin-tile.winner{
  border-color:#65ffb9!important;
  box-shadow:0 0 0 2px rgba(101,255,185,.32),0 0 36px rgba(72,234,158,.38)!important;
}

body.lobby-app .spin-prize-list{display:none!important}

body.lobby-app .spin-status{
  margin:14px 26px 9px!important;
  min-height:42px!important;
  display:flex!important;
  align-items:center!important;
  padding:0 13px!important;
  border:1px solid #315443!important;
  border-left:3px solid #49dc96!important;
  border-radius:6px!important;
  background:linear-gradient(90deg,#10281e,#10191b)!important;
  color:#7beab1!important;
  font:700 10px/1.45 'DM Sans',sans-serif!important;
}
body.lobby-app .spin-button{
  width:calc(100% - 52px)!important;
  min-height:52px!important;
  margin:0 26px!important;
  border:1px solid #6df0ad!important;
  border-bottom:4px solid #1e7d54!important;
  border-radius:6px!important;
  background:
    linear-gradient(180deg,#51e49b 0%,#32c67e 100%)!important;
  color:#052719!important;
  font:900 12px/1 'DM Sans',sans-serif!important;
  letter-spacing:.10em!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 11px 26px rgba(35,192,120,.16)!important;
}
body.lobby-app .spin-button:hover{transform:translateY(-1px)!important;filter:brightness(1.06)!important}
body.lobby-app .spin-note{
  display:block!important;
  padding:11px 26px 18px!important;
  color:#5e6c7b!important;
  font:600 7px/1.3 'DM Sans',sans-serif!important;
  text-align:center!important;
}

/* ---------- PAYMENT / DEPOSIT / WITHDRAW ---------- */
#bbPaymentDialog{
  width:min(600px,calc(100vw - 28px))!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #4b5870!important;
  border-radius:11px!important;
  background:
    radial-gradient(circle at 86% 0%,rgba(118,76,255,.30),transparent 31%),
    radial-gradient(circle at 0 0%,rgba(45,218,139,.22),transparent 26%),
    #0b1118!important;
  color:#fff!important;
  box-shadow:0 42px 120px rgba(0,0,0,.84)!important;
}
#bbPaymentDialog::backdrop{
  background:rgba(2,4,8,.90)!important;
  backdrop-filter:blur(12px)!important;
}
.bb-pay-head{
  min-height:92px!important;
  padding:18px 20px!important;
  border-bottom:1px solid #344052!important;
  background:linear-gradient(90deg,rgba(50,220,140,.11),transparent 50%)!important;
}
.bb-pay-head-icon{
  width:52px!important;height:52px!important;
  border:1px solid #4b8066!important;
  border-bottom:3px solid #285640!important;
  border-radius:7px!important;
  background:radial-gradient(circle,#245a40,#10271d)!important;
  box-shadow:0 10px 22px rgba(0,0,0,.30)!important;
}
.bb-pay-head-icon img{width:35px!important;height:35px!important}
.bb-pay-title small{color:#79eab0!important;font-size:8px!important;letter-spacing:.16em!important}
.bb-pay-title strong{margin-top:5px!important;font:900 30px/.9 'Barlow Condensed',sans-serif!important;text-transform:uppercase!important}
.bb-pay-close{width:40px!important;height:40px!important;border-radius:6px!important;background:#171f2b!important;border-color:#445064!important}
.bb-pay-tabs{gap:4px!important;padding:6px!important;background:#0a1017!important;border-bottom:1px solid #303c4d!important}
.bb-pay-tab{
  height:42px!important;
  border:1px solid #303b4c!important;
  border-radius:5px!important;
  background:#121925!important;
  color:#7f8b9d!important;
}
.bb-pay-tab[aria-selected="true"]{
  border-color:#3e8060!important;
  background:linear-gradient(#1d3a2d,#182d25)!important;
  color:#7aefb2!important;
  box-shadow:inset 0 -3px 0 #43d994!important;
}
.bb-pay-body{padding:18px 20px 20px!important}
.bb-pay-account-card,.bb-pay-verify,.bb-pay-command{
  border:1px solid #344357!important;
  border-radius:7px!important;
  background:linear-gradient(145deg,#121b26,#0d141b)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.bb-pay-form input{
  height:50px!important;
  border:1px solid #415066!important;
  border-radius:6px!important;
  background:#080f16!important;
  color:#fff!important;
}
.bb-pay-action,.bb-pay-form button,.bb-pay-command-actions button{
  min-height:44px!important;
  border:1px solid #46546a!important;
  border-bottom:3px solid #283244!important;
  border-radius:6px!important;
  background:linear-gradient(#1d2734,#151d27)!important;
}
.bb-pay-action.primary,.bb-pay-form button.primary,.bb-pay-success button{
  border-color:#65e8a8!important;
  border-bottom:4px solid #1f7e55!important;
  background:linear-gradient(#4cdd96,#34c37f)!important;
  color:#062719!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28)!important;
}
.bb-pay-command code{
  border-radius:5px!important;
  background:#050a0e!important;
  color:#7ceab2!important;
  border-color:#2d4038!important;
}
.bb-pay-success-icon{
  width:104px!important;height:104px!important;
  border-color:#5be5a2!important;
  background:radial-gradient(circle,#2b7350,#10291d 68%)!important;
  box-shadow:0 0 42px rgba(70,222,148,.18)!important;
}

@media(max-width:650px){
  body.lobby-app .daily-spin-dialog{width:calc(100vw - 10px)!important}
  body.lobby-app .spin-heading{min-height:88px!important;padding:18px 16px!important}
  body.lobby-app .spin-heading h2{font-size:30px!important}
  body.lobby-app .spin-intro{padding:13px 16px 5px!important}
  body.lobby-app .spin-window{margin:8px 16px 0!important;padding:14px 8px!important}
  body.lobby-app .spin-status{margin:12px 16px 8px!important}
  body.lobby-app .spin-button{width:calc(100% - 32px)!important;margin:0 16px!important}
  body.lobby-app .spin-note{padding:10px 16px 14px!important}
  body.lobby-app .spin-tile{flex-basis:100px!important;width:100px!important;height:112px!important}
  body.lobby-app .spin-tile img{width:50px!important;height:50px!important}
}