/* Blitz Blackjack — sits inside .blitz-game-frame (felt) */
.blitz-bj { --felt:#0B4A36; --felt-hi:#11604A; --rail:#082E23; --gold:#FFD23F; --ink:#0F1420; --card:#FBF8F1; --red:#C8102E; color:#fff; font-family:var(--blitz-font, Rubik, system-ui, sans-serif); padding:16px; display:flex; flex-direction:column; gap:14px; outline:none; }
.blitz-bj:focus-visible { box-shadow:0 0 0 3px var(--gold); border-radius:18px; }
.bj-top { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; font-size:14px; }
.bj-coins { font-weight:800; color:var(--gold); font-size:18px; font-variant-numeric:tabular-nums; display:inline-flex; align-items:center; gap:6px; }
.bj-coins::before { content:""; width:16px; height:16px; border-radius:50%; background:radial-gradient(circle at 35% 35%,#FFE9A3,#D9A514); box-shadow:inset 0 0 0 2px #B98A0B; }
.bj-stats { color:#CFE7DC; flex:1; min-width:0; font-variant-numeric:tabular-nums; }
.bj-stats b { color:#fff; }
.bj-dim { color:#8FBFAA; }
.bj-toggle { background:rgba(0,0,0,.28); color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:99px; padding:8px 14px; font-weight:600;font-size:14px;font-family:inherit; cursor:pointer; min-height:40px; }
.bj-toggle[aria-pressed="true"] { background:var(--gold); color:var(--ink); border-color:var(--gold); }

.bj-table { background:radial-gradient(ellipse at 50% 0%, var(--felt-hi), var(--felt) 70%); border-radius:120px 120px 18px 18px / 60px 60px 18px 18px; padding:22px 14px 18px; display:flex; flex-direction:column; gap:14px; align-items:center; min-height:330px; box-shadow:inset 0 0 0 2px rgba(255,210,63,.25); }
.bj-zone { display:flex; flex-direction:column; align-items:center; gap:8px; width:100%; }
.bj-label { font-size:14px; color:#CFE7DC; text-align:center; }
.bj-label b { color:#fff; }
.bj-res { font-style:normal; font-weight:800; margin-left:4px; }
.bj-cards { display:flex; justify-content:center; min-height:104px; }
.bj-cards .bj-card + .bj-card { margin-left:-26px; }
.bj-card { width:72px; height:102px; border-radius:8px; background:var(--card); color:#141414; box-shadow:0 4px 10px rgba(0,0,0,.35); position:relative; font-weight:700; flex:none; }
.bj-card.bj-red { color:var(--red); }
.bj-c1 { position:absolute; top:5px; left:7px; font-size:20px; line-height:1; display:flex; flex-direction:column; align-items:center; }
.bj-c1 i { font-style:normal; font-size:16px; }
.bj-c2 { position:absolute; right:8px; bottom:4px; font-size:34px; line-height:1; }
.bj-back { background:repeating-linear-gradient(45deg,#1B2440 0 6px,#2A3657 6px 12px); border:4px solid var(--card); box-sizing:border-box; }
.bj-new { animation:bj-in .28s ease-out; }
@keyframes bj-in { from { transform:translateY(-24px) rotate(-4deg); opacity:0; } to { transform:none; opacity:1; } }
.bj-hands { display:flex; flex-wrap:wrap; justify-content:center; gap:14px 24px; }
.bj-hand { display:flex; flex-direction:column; align-items:center; gap:8px; padding:8px; border-radius:12px; border:2px solid transparent; }
.bj-hand.bj-active { border-color:var(--gold); background:rgba(0,0,0,.15); }
.bj-r-win .bj-res, .bj-r-bj .bj-res { color:#7CF0A9; }
.bj-r-lose .bj-res, .bj-r-bust .bj-res { color:#FF9AAA; }
.bj-r-push .bj-res, .bj-r-surrender .bj-res { color:#FFE07A; }
.bj-empty { color:#8FBFAA; font-size:15px; padding:36px 0; }
.bj-msg { font-weight:700; font-size:16px; text-align:center; min-height:24px; }

.bj-coachbox { display:flex; flex-direction:column; gap:8px; }
.bj-fb { margin:0; padding:10px 14px; border-radius:10px; font-size:15px; line-height:1.45; color:#fff; }
.bj-ok { background:rgba(74,222,128,.18); border:1px solid rgba(74,222,128,.55); }
.bj-no { background:rgba(255,77,109,.16); border:1px solid rgba(255,77,109,.6); }
.bj-tip { background:rgba(255,210,63,.14); border:1px solid rgba(255,210,63,.6); }

.bj-controls { display:flex; flex-direction:column; gap:10px; }
.bj-row { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center; }
.bj-btn { flex:1 1 92px; max-width:150px; min-height:48px; border:0; border-radius:10px; background:#fff; color:var(--ink); font-weight:800;font-size:16px;font-family:inherit; cursor:pointer; }
.bj-btn u { text-decoration:none; border-bottom:2px solid currentColor; }
.bj-btn:disabled { opacity:.35; cursor:not-allowed; }
.bj-btn:not(:disabled):hover { background:var(--gold); }
.bj-btn.bj-hinted { background:var(--gold); box-shadow:0 0 0 3px #fff, 0 0 18px rgba(255,210,63,.9); }
.bj-show { background:transparent; color:var(--gold); border:1px dashed rgba(255,210,63,.7); border-radius:10px; padding:10px 16px; font-weight:600;font-size:15px;font-family:inherit; cursor:pointer; min-height:44px; }
.bj-show:hover { background:rgba(255,210,63,.12); }
.bj-betrow { gap:12px; }
.bj-chips { display:flex; gap:8px; }
.bj-chip { width:52px; height:52px; border-radius:50%; border:4px dashed rgba(255,255,255,.85); color:#fff; font-weight:800;font-size:14px;font-family:inherit; cursor:pointer; box-shadow:0 3px 8px rgba(0,0,0,.35); }
.bj-chip-10 { background:#2563EB; } .bj-chip-25 { background:#0E8A5F; } .bj-chip-100 { background:#141414; } .bj-chip-500 { background:#5B3DF5; }
.bj-chip:disabled { opacity:.35; cursor:not-allowed; }
.bj-chip:not(:disabled):hover { transform:translateY(-2px); }
.bj-bet { font-size:16px; color:#CFE7DC; font-variant-numeric:tabular-nums; }
.bj-bet b { color:#fff; font-size:20px; }
.bj-clear { background:transparent; color:#CFE7DC; border:1px solid rgba(255,255,255,.3); border-radius:10px; padding:10px 14px; font-weight:600;font-size:14px;font-family:inherit; cursor:pointer; min-height:44px; }
.bj-deal { background:var(--gold); color:var(--ink); border:0; border-radius:10px; padding:12px 28px; font-weight:800;font-size:17px;font-family:inherit; cursor:pointer; min-height:48px; }
.bj-deal:hover { background:#FFE07A; }
.bj-small { font-size:13px; }
.bj-link { background:none; border:0; color:#8FBFAA; text-decoration:underline; cursor:pointer; font:inherit; padding:6px; }
.bj-rules { margin:0; text-align:center; font-size:12.5px; color:#8FBFAA; }
.blitz-bj button:focus-visible { outline:3px solid #fff; outline-offset:2px; }

@media (max-width:520px) {
	.blitz-bj { padding:12px 8px; }
	.bj-card { width:58px; height:84px; }
	.bj-c2 { font-size:26px; }
	.bj-c1 { font-size:17px; }
	.bj-cards { min-height:86px; }
	.bj-cards .bj-card + .bj-card { margin-left:-22px; }
	.bj-table { border-radius:60px 60px 14px 14px / 34px 34px 14px 14px; min-height:290px; }
	.bj-btn { flex:1 1 30%; font-size:15px; }
	.bj-chip { width:46px; height:46px; font-size:13px; }
}
@media (prefers-reduced-motion:reduce) { .bj-new { animation:none; } }

/* Betting spots (bet phase) */
.bj-spots { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
.bj-spot { width:104px; height:104px; border-radius:50%; border:3px dashed rgba(255,255,255,.45); background:rgba(0,0,0,.18); color:#CFE7DC; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; cursor:pointer; font-family:inherit; }
.bj-spot-n { font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.bj-spot-b { font-size:18px; font-weight:800; color:#fff; font-variant-numeric:tabular-nums; }
.bj-spot-on { border-style:solid; border-color:rgba(255,255,255,.8); }
.bj-spot-sel { border-color:var(--gold); box-shadow:0 0 0 3px rgba(255,210,63,.35); background:rgba(255,210,63,.12); }
.bj-spot:hover { border-color:var(--gold); }
.bj-controls .bj-spots .bj-spot { width:84px; height:84px; }
.bj-controls .bj-spot-b { font-size:15px; }

/* Seats (play phase) */
.bj-seats { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; width:100%; align-items:start; }
.bj-seat { display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
.bj-seat-n { font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:#8FBFAA; }
.bj-seat .bj-hand { padding:6px; }
.bj-seat .bj-label { font-size:13px; }

@media (max-width:520px) {
	.bj-spot { width:84px; height:84px; }
	.bj-controls .bj-spots .bj-spot { width:70px; height:70px; }
	.bj-seats { gap:4px; }
	.bj-seat .bj-card { width:46px; height:66px; }
	.bj-seat .bj-c1 { font-size:14px; top:3px; left:4px; }
	.bj-seat .bj-c1 i { font-size:12px; }
	.bj-seat .bj-c2 { font-size:20px; right:4px; }
	.bj-seat .bj-cards { min-height:68px; }
	.bj-seat .bj-cards .bj-card + .bj-card { margin-left:-28px; }
	.bj-seat .bj-label { font-size:11.5px; }
}
