/* game-multi-pay.css — Override multi-hand inline styles to match single-hand visual identity */

/* ── Body & Game Background ── */
body{background:#002D8A!important}
#game{background:radial-gradient(ellipse at 50% 40%,rgba(20,50,140,.3) 0%,rgba(10,30,100,.1) 50%,transparent 80%)!important}

/* ── Site Header ── */
.site-header{background:rgba(0,20,80,.95)!important;border-bottom-color:rgba(255,215,0,.2)!important}

/* ── Game Title Bar ── */
.game-title-bar{background:linear-gradient(180deg,#002266 0%,#002D8A 100%)!important;border-bottom-color:rgba(255,215,0,.15)!important}

/* ── Layout Order (match single-hand: coach → cards → credits) ── */
.paybtn{order:1}
#coach-bar{order:2!important}
#coach-meta{order:3!important}
#hands-area{order:4!important}
#cbar{order:5!important}
#msg{order:6!important;display:none!important}
#btns{order:7!important}

/* ── AI Coach ── */
#coach-meta{display:none!important}
#coach-advice{font-size:1rem!important;line-height:1.4!important}
#coach-advice .ev{font-size:1.15rem!important;font-weight:900!important;color:#4cff7c!important;text-shadow:0 0 8px rgba(76,255,124,.4)}

/* ── Credits Bar ── */
#cbar{background:transparent!important;border:none!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;padding:10px 0 6px!important}
.ci:nth-child(1){order:4}.ci:nth-child(2){order:2}.ci:nth-child(3){order:3}.ci:nth-child(4){order:1}
.ci+.ci{border-left:none!important}
.cl{font-size:.7rem!important;color:#FFD700!important;text-transform:uppercase!important;letter-spacing:2px!important;font-family:'Arial Black',Arial,sans-serif!important;font-weight:900!important}
.cv{font-size:1.6rem!important;font-weight:900!important;color:#fff!important;font-family:'Arial Black',Arial,sans-serif!important;text-shadow:0 0 8px rgba(255,255,255,.2)!important}
#wv{font-size:1.8rem!important;font-weight:900!important;font-family:'Arial Black',Arial,sans-serif!important}
#wv.active{color:#4cff7c!important;text-shadow:0 0 16px rgba(76,255,124,.5)!important}

/* ── Buttons — gold machine style ── */
.btn{border-radius:8px!important;height:50px!important;font-family:'Arial Black',Arial,sans-serif!important;font-size:.85rem!important;letter-spacing:1px!important;font-weight:900!important;background:linear-gradient(180deg,#FFE44D 0%,#F0C800 35%,#D4A800 65%,#B89000 100%)!important;color:#111!important;border:3px solid #A07800!important;box-shadow:0 4px 0 #705000,inset 0 2px 0 rgba(255,255,255,.35)!important;text-shadow:0 1px 0 rgba(255,255,255,.15)!important}
.btn:active{transform:translateY(4px)!important;box-shadow:0 0 0 #705000,inset 0 2px 4px rgba(0,0,0,.3)!important;filter:brightness(.85)!important}
.btn:disabled{opacity:.3!important;filter:grayscale(.6) brightness(.5)!important;box-shadow:none!important;cursor:not-allowed!important;transform:none!important}
.btn:hover:not(:disabled){background:linear-gradient(180deg,#FFEA66 0%,#F8D400 35%,#DDBB00 65%,#C49800 100%)!important;box-shadow:0 4px 0 #705000,inset 0 2px 0 rgba(255,255,255,.4),0 0 12px rgba(255,215,0,.3)!important}

/* ── PAY TABLE Button ── */
.paybtn{background:linear-gradient(180deg,#0a1e4a 0%,#071640 100%)!important;border-color:rgba(255,215,0,.3)!important}
.paybtn:hover{background:linear-gradient(180deg,#122a5e 0%,#0e2050 100%)!important;border-color:rgba(255,215,0,.45)!important}

/* ── Card face-down ── */
.card.fd{background:repeating-linear-gradient(45deg,transparent,transparent 7px,rgba(255,215,0,.1) 7px,rgba(255,215,0,.1) 8px),repeating-linear-gradient(-45deg,transparent,transparent 7px,rgba(255,215,0,.1) 7px,rgba(255,215,0,.1) 8px),linear-gradient(180deg,#001C6E 0%,#001450 50%,#000D3A 100%)!important;border-color:#FFD700!important}

/* ── Hands Area Panel ── */
[data-hands="3"] #hands-area,
[data-hands="5"] #hands-area,
[data-hands="10"] #hands-area,
[data-hands="50"] #hands-area,
[data-hands="100"] #hands-area{border-color:rgba(255,215,0,.15)!important;background:linear-gradient(180deg,rgba(0,20,80,.35) 0%,rgba(0,15,60,.15) 100%)!important}

/* ── PAY TABLE Modal ── */
.pay-modal{background:#002570!important;border:2px solid #FFD700!important;border-radius:6px!important}
.pay-modal-head{border-bottom:1px solid rgba(255,215,0,.25)!important;background:rgba(0,20,80,.4)}
.pay-modal-head span{color:#FFD700!important}
.pay-modal-close{color:rgba(255,215,0,.5)!important}
.pay-modal-close:hover{color:#FFD700!important}

#payout-table{display:grid!important;grid-template-columns:auto repeat(5,1fr);overflow-y:auto;max-height:calc(85vh - 50px)}
.pr{display:contents!important}
.pr .hn,.pr .pv{border-bottom:1px solid rgba(255,215,0,.15)}
.pr:last-child .hn,.pr:last-child .pv{border-bottom:none}
.pr:nth-child(even){background:transparent!important}
.pr .hn{white-space:nowrap;padding:2px 12px!important;color:#FFD700!important;text-transform:uppercase;letter-spacing:.3px;font-size:.78rem;font-weight:700!important;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.2;display:flex!important;align-items:center;width:auto!important;text-align:left}
.pr .pv{position:relative;transition:all 0.25s ease-in-out;padding:1px 6px!important;color:#FFD700!important;font-weight:600;font-size:.78rem;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1;display:flex!important;align-items:center;justify-content:flex-end!important;text-align:right;flex:none!important}
.pr .pv::before{content:''!important;position:absolute;left:0;top:0!important;bottom:0!important;width:1px;background:rgba(255,215,0,.35)!important}
.pr .ch{background:#E03030!important;color:#FFD700!important;font-weight:900;text-shadow:none!important;border-bottom-color:#E03030!important}
.pr .ch::before{background:#E03030!important}
.pr:last-child .ch{border-bottom:none!important}
.pr.win .hn,.pr.win .pv{background:linear-gradient(90deg,rgba(255,215,0,.25),rgba(255,215,0,.12))!important;animation:wp .4s ease}
.pr.win .hn{color:#fff!important;font-weight:900;text-shadow:0 0 8px rgba(255,215,0,.6)}
.pr.win .pv{color:#ffd700!important}
.pr.win .ch{background:#CC0000!important;color:#fff!important;border-bottom-color:#CC0000!important}

/* ── Mobile ── */
@media(max-width:768px){
  .cl{font-size:.6rem!important;letter-spacing:1.5px!important}
  .cv,#wv{font-size:1.4rem!important}
  .btn{height:44px!important;font-size:.72rem!important;letter-spacing:.5px!important;border-radius:6px!important}
}
@media(max-width:430px){
  .cl{font-size:.55rem!important}
  .cv,#wv{font-size:1.3rem!important}
  .btn{height:40px!important;font-size:.64rem!important}
}