/* ---- 🃏 Blackjack ---- */
#bjScreen{position:fixed; inset:0; z-index:8900; display:none;
  flex-direction:column; overflow:hidden;
  padding:8px 8px 0;
  background:radial-gradient(120% 70% at 50% 0%,#0f4128,#061a10 75%)}
#bjScreen.on{display:flex}

.bjtop{display:flex; align-items:center; gap:8px; margin-bottom:6px;
  flex-shrink:0}
.bjback{white-space:nowrap; flex-shrink:0;
  background:linear-gradient(180deg,#1d5c39,#0f3a23); color:#ffe9a8;
  border:1px solid rgba(255,215,120,.5); border-radius:11px;
  padding:8px 13px; font-size:14px; font-weight:700; cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.bjic{width:38px; height:36px; flex-shrink:0; border-radius:11px;
  background:linear-gradient(180deg,#1d5c39,#0f3a23); color:#ffe9a8;
  border:1px solid rgba(255,215,120,.5); font-size:16px; font-weight:800;
  cursor:pointer}
.bjback:active,.bjic:active{transform:scale(.94)}
.bjic.off{color:#8fa79a}
/* kassa lövhəsi: balans + depozit/çıxarış tək qızıl haşiyəli panelde */
.bjwallet{margin-left:auto; display:flex; align-items:stretch; min-width:0;
  border-radius:12px; overflow:hidden;
  border:1px solid rgba(214,170,74,.75);
  background:linear-gradient(180deg,#123c27 0%,#0a2517 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 4px 12px rgba(0,0,0,.45)}
.bjbal{display:flex; flex-direction:column; justify-content:center;
  padding:4px 10px 5px; min-width:0}
.bjbal small{font-size:8px; letter-spacing:1.4px; color:#8fb8a0;
  font-weight:800; line-height:1}
.bjbal b{font-size:15px; font-weight:900; color:#ffd867; line-height:1.15;
  white-space:nowrap; text-shadow:0 1px 2px rgba(0,0,0,.6)}
.bjwb{display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:2px; width:52px; padding:4px 2px 5px;
  cursor:pointer; border:0; border-left:1px solid rgba(214,170,74,.45);
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.18))}
.bjwb svg{width:17px; height:17px; fill:none; stroke:currentColor;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.bjwb i{font-style:normal; font-size:7.5px; font-weight:900;
  letter-spacing:.5px; line-height:1}
.bjwb.dep{color:#ffd867}
.bjwb.wd{color:#cfe6d8}
.bjwb:active{background:rgba(255,216,103,.18)}

/* masa: şəklin öz nisbəti saxlanılır (941x1672 = 0.5629), hündürlük
   ekrana sığmayanda en avtomatik kiçilir - qutular şəkillə birlikdə
   sürüşür, ona görə koordinatlar həmişə yerində qalır. */
/* masa mümkün qədər böyük: eni ekranı doldurur, alt tərəfi (taxta kənar)
   düymə paneli ilə örtülür. Hündürlük yetməyəndə en avtomatik kiçilir ki,
   mərc dairələri və məbləğlər panelin altında qalmasın. */
.bjtable{position:relative; margin:0 auto; flex-shrink:0;
  width:min(100%, calc((100vh - 205px) / 1.305));
  width:min(100%, calc((100dvh - 205px) / 1.305))}
.bjbg{width:100%; height:auto; display:block; border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.55)}

.bjdealer{position:absolute; left:50%; top:29%; transform:translate(-50%,-50%);
  display:flex; flex-direction:column; align-items:center; gap:4px}
#bjScreen{--bjcw:clamp(32px,10.5vw,50px)}      /* oyunçu kartının eni */
.bjdealer{--bjcw:clamp(36px,12vw,56px)}
.bjhand.sp{--bjcw:clamp(24px,8vw,40px)}        /* split: 2 əl yan-yana */
.bjcards{display:flex; align-items:flex-end; justify-content:center}
.bjcards .bjc{width:var(--cw,var(--bjcw)); height:auto; display:block;
  margin-left:calc(var(--cw,var(--bjcw)) * -.45); border-radius:5px;
  box-shadow:0 4px 10px rgba(0,0,0,.55)}
.bjcards .bjc:first-child{margin-left:0}
/* kart sağdan (payla yerindən) sürüşüb gəlir - hər kart öz növbəsində */
.bjc.new{animation:bjDeal .34s cubic-bezier(.15,.85,.3,1) both}
@keyframes bjDeal{
  from{opacity:0; transform:translate(58vw,-16vh) rotate(24deg) scale(.92)}
  60%{opacity:1}
  to{opacity:1; transform:none}}

.bjsum{min-width:30px; height:23px; padding:0 7px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:900; color:#0d1a12;
  background:linear-gradient(180deg,#ffe9a8,#e0b74a);
  box-shadow:0 2px 6px rgba(0,0,0,.45)}
.bjsum:empty{display:none}
@keyframes bjFade{from{opacity:0; transform:scale(.7)} to{opacity:1}}

/* ---- mərc qutuları ---- */
.bjspot{position:absolute; transform:translate(-50%,-50%); cursor:pointer;
  border-radius:50%; -webkit-tap-highlight-color:transparent}
.bjspot:active{transform:translate(-50%,-50%) scale(.96)}
.bjspot.on{box-shadow:0 0 0 3px rgba(255,216,103,.9),
  0 0 26px rgba(255,216,103,.5)}
.bjspot .bjstack{position:absolute; inset:0}
.bjsc{position:absolute; left:50%; transform:translateX(-50%);
  width:56%; display:block;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.6));
  animation:bjChip .18s cubic-bezier(.2,1.2,.4,1) both}
.bjsc img,.bjsc canvas{width:100%; height:auto; display:block}
.bjsc b{position:absolute; left:0; right:0; top:31%; text-align:center;
  font-size:clamp(8px,2.2vw,12px); font-weight:900; color:#16202b;
  letter-spacing:-.2px}
@keyframes bjChip{from{opacity:0; transform:translate(-50%,-22px) scale(.8)}
  to{opacity:1; transform:translateX(-50%) scale(1)}}
.bjscn{position:absolute; right:2%; bottom:6%; font-style:normal;
  font-size:10px; font-weight:900; color:#ffe9a8}
.bjamt{position:absolute; left:50%; top:100%; transform:translateX(-50%);
  margin-top:2px; white-space:nowrap; font-size:12px; font-weight:900;
  color:#ffd867; text-shadow:0 1px 3px #000; letter-spacing:.3px}
.bjamt:empty{display:none}

.bjspot .bjhands{position:absolute; left:50%; bottom:100%;
  transform:translateX(-50%); margin-bottom:4px; display:flex; gap:5px}
.bjhand{display:flex; flex-direction:column; align-items:center; gap:3px}
.bjhand.on .bjsum{background:linear-gradient(180deg,#fff6d0,#ffcf3a);
  box-shadow:0 0 12px rgba(255,216,103,.8)}
.bjres{font-style:normal; font-size:10px; font-weight:900; padding:2px 7px;
  border-radius:8px; letter-spacing:.3px; white-space:nowrap}
.bjres.win,.bjres.bj{background:#1f8a4c; color:#eafff2}
.bjres.push{background:#4b5563; color:#e8eaed}
.bjres.lose,.bjres.bust{background:#a3242c; color:#ffe6e6}

.bjmsg{display:table; margin:0 auto 2px;
  padding:6px 14px; border-radius:12px; max-width:92%;
  font-size:13px; font-weight:800; color:#ffe9a8; text-align:center;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,215,120,.35)}
.bjmsg.win{color:#8ff0b5; border-color:rgba(76,195,138,.55)}
.bjmsg.lose{color:#ff9297; border-color:rgba(229,72,77,.5)}
.bjmsg.err{color:#ff9297}

/* ---- alt panel ---- */
.bjbottom{position:absolute; left:0; right:0; bottom:0; z-index:3;
  padding:4px 8px calc(8px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(180deg, rgba(4,16,10,0) 0%,
    rgba(4,16,10,.72) 26%, rgba(3,12,8,.94) 60%)}
.bjchips{display:flex; gap:6px; justify-content:center; margin-top:8px}
.bjchip{position:relative; width:clamp(38px,11vw,50px); padding:0;
  background:none; border:0; cursor:pointer; opacity:.75;
  transition:transform .12s, opacity .12s}
.bjchip img,.bjchip canvas{width:100%; height:auto; display:block;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.5))}
.bjchip b{position:absolute; left:0; right:0; top:30%; text-align:center;
  font-size:clamp(9px,2.6vw,13px); font-weight:900; color:#16202b;
  letter-spacing:-.2px}
.bjchip.sel{opacity:1; transform:translateY(-4px) scale(1.08);
  filter:drop-shadow(0 0 8px rgba(255,216,103,.75))}
.bjchip:active{transform:scale(.92)}

.bjacts{display:flex; gap:8px; justify-content:center; margin-top:9px;
  flex-wrap:wrap}
/* masa düymələri: tünd yaşıl mahud + qızıl haşiyə, üstdə gümüş ikon */
.bjbtn{position:relative; display:flex; flex-direction:column; align-items:center;
  gap:2px; min-width:74px; padding:7px 10px 6px; border-radius:14px;
  cursor:pointer; border:1px solid rgba(214,170,74,.75);
  background:linear-gradient(180deg,#1c6b41 0%,#0f4a2c 55%,#0a3520 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -10px 18px rgba(0,0,0,.35), 0 4px 12px rgba(0,0,0,.45)}
.bjbtn img,.bjbtn canvas{width:34px; height:auto; display:block;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.55))}
.bjbtn span{display:block; font-size:11px; font-weight:900; color:#ffe6a8;
  letter-spacing:.6px; line-height:1.15;
  text-shadow:0 1px 2px rgba(0,0,0,.7)}
.bjbtn span i{display:block; font-style:normal; font-size:12px;
  font-weight:900; color:#fff3cf; letter-spacing:0}
.bjbtn.go{border-color:#f3d27a; min-width:112px;
  background:linear-gradient(180deg,#f3c53f 0%,#dc9c15 55%,#b6790a 100%)}
.bjbtn.go span{color:#2a1a00; text-shadow:0 1px 0 rgba(255,255,255,.35)}
.bjbtn.go span i{color:#3a2400}
.bjbtn.go img,.bjbtn.go canvas{filter:drop-shadow(0 1px 2px rgba(0,0,0,.45)) brightness(.35)}
.bjbtn.no{border-color:rgba(230,120,120,.7);
  background:linear-gradient(180deg,#8f2229,#5c1015)}
.bjbtn.clr,.bjbtn.rebet{min-width:66px;
  background:linear-gradient(180deg,#25493a,#12271e)}
.bjbtn.clr img,.bjbtn.rebet img,.bjbtn.clr canvas,.bjbtn.rebet canvas{width:28px}
.bjbtn.dis{opacity:.4; pointer-events:none}
.bjbtn:active{transform:translateY(1px) scale(.97)}

#bjiOv.bjov{z-index:9400}
.bjimodal{background:linear-gradient(180deg,#123c27,#0a2417);
  border:1px solid rgba(214,170,74,.55);
  box-shadow:0 18px 50px rgba(0,0,0,.6)}
.bjih{text-align:center; padding-bottom:8px; margin-bottom:6px;
  border-bottom:1px solid rgba(214,170,74,.3)}
.bjih b{display:block; font-size:22px; font-weight:900; letter-spacing:2px;
  color:#ffd867; text-shadow:0 2px 6px rgba(0,0,0,.6)}
.bjih small{font-size:10px; letter-spacing:3px; color:#9fd8b6}
.bjrulesbody{font-size:12.5px; color:#dfe6e2; line-height:1.7;
  text-align:left}
.bjrulesbody h4{margin:12px 0 4px; font-size:11px; letter-spacing:1.4px;
  text-transform:uppercase; color:#ffd867; font-weight:900}
.bjrulesbody b{color:#f2b722}
.bjpay{width:100%; border-collapse:collapse; margin-top:4px}
.bjpay td{padding:4px 0; border-bottom:1px dashed rgba(255,255,255,.12)}
.bjpay td:last-child{text-align:right; color:#ffd867; font-weight:900;
  white-space:nowrap}

@media (max-width: 380px){
  .bjback{padding:8px 10px; font-size:13px}
  .bjic{width:34px}
  .bjwb{width:46px}
  .bjbal{padding:4px 8px 5px}
  .bjbal b{font-size:14px}
}
@media (max-height: 700px){
  .bjchips{margin-top:5px}
  .bjacts{margin-top:6px}
  .bjbtn{padding:9px 12px}
}

/* menyu: yarımçıq blackjack əli olanda düymədə nişan */
#gselBJ.bjresume::before{content:"DAVAM EDİR"; position:absolute; z-index:3;
  left:50%; bottom:6%; transform:translateX(-50%);
  font-size:10px; font-weight:900; letter-spacing:.8px; color:#0b2015;
  padding:3px 10px; border-radius:999px; white-space:nowrap;
  background:linear-gradient(180deg,#ffd76a,#d59b12);
  box-shadow:0 2px 8px rgba(0,0,0,.5); animation:bjResume 1.6s infinite}
@keyframes bjResume{0%,100%{opacity:1} 50%{opacity:.55}}