/* ═════════════════ БЛЭКДЖЕК ═════════════════ */

#screen-blackjack { padding:4px 12px 12px; }
.game-card.blackjack { background:linear-gradient(120deg, #3ec28f 0%, #158a63 55%, #0b5541 100%); }

.bj-table {
  --card-w:clamp(48px,16vw,66px); --card-h:calc(var(--card-w) * 1.4);
  position:relative; border:1px solid #314451; border-radius:22px; overflow:hidden;
  contain:layout paint; isolation:isolate;
  display:grid; gap:9px; padding:12px;
  background:
    radial-gradient(ellipse at 50% 53%, #153b46, transparent 75%),
    linear-gradient(155deg,#15212c,#0b1019 82%);
  box-shadow:inset 0 1px #a1e7ef12, 0 8px 22px #0004;
}

.bj-dealer { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; }
.bj-brand { display:flex; align-items:center; gap:7px; font-size:clamp(15px,4.5vw,20px); font-weight:900; }
.bj-emblem {
  display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:10px;
  border:1px solid #46929b7d; background:#19434b; color:#99f1ec; font-size:22px; line-height:1;
}
.bj-emblem.thinking { color:#fff0b9; }
.bj-emblem.happy { color:#7de5a9; }
.bj-emblem.sad { color:#ffacb1; }
.bj-say {
  min-width:0; padding:5px 8px; border:1px solid #8ab4c431; border-radius:9px; text-align:right;
  color:#c6dce7; background:#0d1822; font-size:11px; font-weight:800; line-height:1.2;
  transition:opacity .2s ease, translate .2s ease;
}
.bj-say.swap { opacity:0; translate:-4px 0; }

/* ── Колода (шуз) ── */
.bj-shoe { position:absolute; right:24px; top:82px; width:24px; height:34px; z-index:2; pointer-events:none; }
.bj-shoe i { position:absolute; inset:0; border-radius:5px; background:var(--bj-back); box-shadow:0 2px 6px #0006; border:1px solid #86bdc7; }
.bj-shoe i:nth-child(1) { rotate:8deg; translate:4px 3px; opacity:.7; }
.bj-shoe i:nth-child(2) { rotate:4deg; translate:2px 1px; opacity:.85; }
.bj-table { --bj-back:
  repeating-linear-gradient(45deg, #246677 0 5px, #194455 5px 10px); }

/* ── Руки ── */
.bj-hand-wrap {
  position:relative; z-index:1; min-width:0; padding:6px 8px 8px; border:1px solid #84bdc12b; border-radius:14px;
  background:#08151b47;
}
.bj-hand-wrap.player { border-color:#71d9d03d; background:linear-gradient(160deg,#123139a6,#0b192350); }
.bj-hand-head {
  display:flex; justify-content:space-between; align-items:center; min-height:23px;
  color:#aac5ce; font-size:10px; font-weight:900; letter-spacing:.09em; text-transform:uppercase;
}
.player .bj-hand-head { color:#9de1d7; }
.bj-hand { display:flex; justify-content:center; min-height:var(--card-h); padding:0 2px; }
.bj-hand:empty { gap:7px; }
.bj-hand:empty::before, .bj-hand:empty::after {
  content:"♠"; width:var(--card-w); height:var(--card-h); display:grid; place-items:center;
  border:1px dashed #9ed4d54d; border-radius:9px; color:#9ed4d556; font-size:24px; background:#a5e4e707;
}
.bj-hand:empty::after { content:"♦"; }
.bj-total { min-width:34px; padding:2px 7px; border-radius:999px; font-size:13px; font-weight:900; text-align:center; color:#fff;
  background:#163641; box-shadow:inset 0 0 0 1px #8dd9da50; font-variant-numeric:tabular-nums; }
.bj-total small { opacity:.7; font-weight:800; font-size:12px; margin-right:3px; }
.bj-total.bust { background:#c8364fdd; }
.bj-total.good { background:#1fa56edd; }
.bj-total.bj { background:linear-gradient(#ffe48a, #f2b636); color:#5a3a00; box-shadow:0 0 0 1px #fff5}

/* ── Карта ── */
.bj-card { width:var(--card-w); height:var(--card-h); perspective:600px; flex:none; position:relative; }
.bj-card + .bj-card { margin-left:calc(var(--card-w) * -.42); }
.bj-hand:has(.bj-card:nth-child(7)) .bj-card + .bj-card { margin-left:calc(var(--card-w) * -.72); }
.bj-card .in { position:absolute; inset:0; transform-style:preserve-3d; transition:transform .6s cubic-bezier(.45,.05,.25,1); }
.bj-card.down .in { transform:rotateY(180deg); }
.bj-card .face, .bj-card .back { position:absolute; inset:0; border-radius:9px; backface-visibility:hidden; -webkit-backface-visibility:hidden;
  box-shadow:0 3px 8px #00000059, 0 1px 0 #0002; }
.bj-card .face { background:linear-gradient(160deg, #ffffff, #eef3f9); color:#1b2433; overflow:hidden; }
.bj-card.red .face { color:#d6304a; }
.bj-card .back { transform:rotateY(180deg); background:var(--bj-back); border:3px solid #fff; display:grid; place-items:center; }
.bj-card .back::after { content:"D"; font-weight:900; font-size:22px; color:#ffffffcc; width:30px; height:30px; display:grid; place-items:center;
  border-radius:50%; border:2px solid #ffffff99; }
.bj-card .cr { position:absolute; display:flex; flex-direction:column; align-items:center; line-height:.95; font-weight:900; }
.bj-card .cr b { font-size:17px; letter-spacing:-1px; }
.bj-card .cr i { font-style:normal; font-size:13px; }
.bj-card .cr.tl { left:5px; top:4px; }
.bj-card .cr.br { right:5px; bottom:4px; rotate:180deg; }
.bj-card .pip { position:absolute; left:50%; top:52%; translate:-50% -50%; font-size:34px; line-height:1; }
.bj-card .pip.face-card { font-size:30px; font-weight:900; letter-spacing:-1px; }
.bj-card.win .face { box-shadow:0 0 0 2px #ffd85a, 0 3px 10px #0006; }

/* ── Надпись на сукне ── */
.bj-felt { display:grid; justify-items:center; gap:2px; padding:1px 4px; text-align:center; }
.bj-felt strong { color:#ead39c; font-size:11px; font-weight:900; letter-spacing:.11em; }
.bj-felt small { color:#a6bdc8; font-size:10px; line-height:1.2; }

/* ── Фишки ставки ── */
.bj-stack { position:absolute; left:24px; bottom:27px; z-index:2; width:38px; height:60px; transition:opacity .4s ease; pointer-events:none; }
.bj-stack:empty { opacity:0; }
.bj-chip { position:absolute; left:3px; width:32px; height:32px; border-radius:50%;
  background:conic-gradient(from 0deg, var(--c) 0 30deg, #fff 30deg 45deg, var(--c) 45deg 75deg, #fff 75deg 90deg,
    var(--c) 90deg 120deg, #fff 120deg 135deg, var(--c) 135deg 165deg, #fff 165deg 180deg, var(--c) 180deg 210deg, #fff 210deg 225deg,
    var(--c) 225deg 255deg, #fff 255deg 270deg, var(--c) 270deg 300deg, #fff 300deg 315deg, var(--c) 315deg 345deg, #fff 345deg 360deg);
  box-shadow:0 3px 0 #0005, 0 4px 8px #0005; }
.bj-chip::after { content:""; position:absolute; inset:7px; border-radius:50%; background:var(--c); box-shadow:inset 0 0 0 2px #ffffff88; }
.bj-stack .bj-amt { position:absolute; left:50%; bottom:-14px; translate:-50% 0; white-space:nowrap; font-size:11px; font-weight:900; color:#fff;
  text-shadow:0 1px 2px #000a; }

/* ── Итог раздачи ── */
.bj-result { position:absolute; left:50%; top:53%; z-index:5; translate:-50% -50%; text-align:center; pointer-events:none;
  padding:12px 22px; border-radius:20px; background:#06213de6; box-shadow:0 10px 30px #0008, inset 0 0 0 1px #ffffff30;
  color:#fff; font-weight:900; font-size:22px; line-height:1.15; white-space:nowrap; }
.bj-result small { display:block; font-size:13px; font-weight:800; opacity:.75; margin-top:3px; }
.bj-result.win { background:linear-gradient(#1fb57bf0, #0e7e55f0); }
.bj-result.bj { background:linear-gradient(#ffd96bf2, #e6a12af2); color:#4d3000; }
.bj-result.lose { background:linear-gradient(#d0475ff0, #8f2337f0); }
.bj-result.push { background:linear-gradient(#5d7ea3f0, #34506ff0); }

/* ── Кнопки действий ── */
.bj-actions { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
.bj-actions[hidden] { display:none; }
.bj-act { height:54px; border-radius:14px; border:1px solid #ffffff55; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1px; color:#fff; font-family:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:transform .18s cubic-bezier(.22,.61,.36,1), opacity .3s ease, filter .3s ease; }
.bj-act b { font-size:17px; font-weight:900; line-height:1; }
.bj-act small { font-size:11px; font-weight:800; opacity:.8; }
.bj-act:active:not(:disabled) { transform:translateY(2px); }
.bj-act:disabled { opacity:.42; filter:saturate(.5); cursor:default; }
.bj-act.hit { background:linear-gradient(#7fd0ff, #2f9ae8 60%, #1d7fcf); color:#062a47; box-shadow:inset 0 2px #e6f5ffaa, 0 3px #0f63a8; }
.bj-act.stand { background:linear-gradient(#ffd27a, #f5a524 60%, #db8a12); color:#4a2c00; box-shadow:inset 0 2px #fff3d0aa, 0 3px #a8630a; }
.bj-act.dbl { background:linear-gradient(#c49bff, #8b5cf0 60%, #6c3fd6); box-shadow:inset 0 2px #efe4ffaa, 0 3px #4b2aa0; }

.bj-panel #bjBetRow { transition:opacity .35s ease; }
.bj-panel.playing #bjBetRow { opacity:.45; pointer-events:none; }

#screen-blackjack .bj-panel {
  padding:10px; border-color:#314451 !important;
  background:linear-gradient(155deg,#182630,#111620 85%) !important;
}
#screen-blackjack #bjBetRow {
  display:grid; grid-template-columns:auto minmax(49px,.9fr) minmax(0,2.5fr); gap:6px;
}
#screen-blackjack #bjBet { width:100%; min-width:0; text-align:center; font-variant-numeric:tabular-nums; }
#screen-blackjack #bjBetChips { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; }
#screen-blackjack #bjBetChips button { min-width:0; padding-inline:2px; }
#screen-blackjack .bj-act.stand, #screen-blackjack .bj-act.dbl {
  background:var(--control-fill) !important; border-color:var(--field-border) !important; color:var(--text) !important;
}
@media (prefers-reduced-motion:reduce) {
  .bj-card .in { transition:none; }
}