/* The shared page shell is copied unchanged; only game objects belong here. */
.casino-table{position:relative;isolation:isolate;border:0;border-radius:24px;background:#071d40 url('assets/table.webp?v=20261018-blackjack-stable-28') center/100% 100%;padding:24px 16px 20px;box-shadow:none;min-height:330px;touch-action:manipulation;overflow:hidden}
.table-crest{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);color:#eed79230;font:600 clamp(42px,17cqw,82px) Georgia,serif;letter-spacing:-.08em;pointer-events:none}
.seat{position:relative;z-index:1;padding:7px 0 10px;min-width:0}
.seat+.seat{margin-top:8px;border-top:1px solid #e2c77b36}
.seat-heading{display:flex;align-items:center;justify-content:center;gap:9px;min-height:27px;margin:0 0 6px;color:#fff0c8;font-size:14px;font-weight:600;letter-spacing:.05em}
.seat-value{display:inline-grid;place-items:center;min-width:32px;height:27px;border:1px solid #d8bd77a0;border-radius:20px;padding:0 8px;background:#071a19bf;font-variant-numeric:tabular-nums;color:#fff8dc}
.seat.active .seat-heading:before{content:'▸';color:#a9f5cc}
.seat.active .seat-value{box-shadow:0 0 14px #c8ec9b40;border-color:#fff1b7}
.card-fan{--card-width:clamp(56px,19cqw,86px);--step:min(calc(var(--card-width) + 7px),calc((100% - var(--card-width))/max(1,var(--count) - 1)));position:relative;height:calc(var(--card-width)*10/7 + 8px);width:100%;margin:auto;max-width:100%}
.playing-card{position:absolute;left:calc((100% - var(--card-width) - (var(--count) - 1)*var(--step))/2 + var(--index)*var(--step));top:3px;z-index:var(--index);width:var(--card-width);aspect-ratio:7/10;border-radius:7px;background:#fffdf7 url('assets/deck-refined.webp?v=20261018-blackjack-stable-28');background-size:1300% 400%;box-shadow:0 3px 7px #0008;overflow:hidden;transform-origin:50% 90%;backface-visibility:hidden}
.playing-card.facedown{background:#112520 url('assets/back-premium.webp?v=20261018-blackjack-stable-28') center/100% 100%}
.playing-card.slot{background:#001d1d40;border:1px dashed #e6cd7945;box-shadow:inset 0 0 12px #0004}
.playing-card.is-pending{visibility:hidden}
.playing-card.dealt{animation:card-deal .9s cubic-bezier(.12,.8,.22,1) both}
.playing-card.flipped{animation:card-flip .3s ease-out}
.seat.outcome-win .seat-value,.seat.outcome-blackjack .seat-value{color:#bff7d3;border-color:#a2e8bd;background:#123326}
.seat.outcome-lose .seat-value,.seat.outcome-bust .seat-value{color:#ffb4ad;border-color:#d6877e}
.player-hands{display:grid;gap:2px}
.player-hands.multi .card-fan{--card-width:clamp(46px,15cqw,66px)}
.table-stamp{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;gap:6px;padding:6px 0;color:#f1ddac8c;font:12px Georgia,serif;letter-spacing:.18em}
.table-stamp:before,.table-stamp:after{content:'';width:36px;height:1px;background:linear-gradient(90deg,transparent,#d5b87980,transparent)}
.wager-panel{margin:9px 0 0;padding:0;border:0;background:none}
.wager-total{display:flex;justify-content:space-between;margin:7px 0 0;color:#c8bdab;font-size:13px}.wager-total strong{color:#f4e0b0;font-variant-numeric:tabular-nums}
.chip-choices{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:clamp(4px,calc(20% - 65.4px),8px);align-items:center;margin:8px 0 0;width:100%}
.chip-choice{flex:0 0 44px;position:relative;width:44px;height:44px;border:0;background:none;padding:0;cursor:pointer;touch-action:manipulation}
.chip-choice img{display:block;width:40px;height:40px;margin:auto;pointer-events:none;filter:drop-shadow(0 2px 3px #0009)}
.chip-choice span{position:absolute;inset:0;display:grid;place-items:center;font:bold 12px Arial;color:#161c1c;pointer-events:none}
.chip-choice:nth-of-type(2) img{filter:hue-rotate(100deg) drop-shadow(0 2px 3px #0009)}
.chip-choice:nth-of-type(3) img{filter:hue-rotate(210deg) drop-shadow(0 2px 3px #0009)}
.wager-shortcut{flex:0 0 44px;width:44px;min-height:44px;min-width:44px;padding:4px;border:1px solid #8c764d;border-radius:8px;background:#101515;color:#f5dfab;font-size:12px;touch-action:manipulation;cursor:pointer}
.table-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:8px 0}
.table-actions .primary-button,.table-actions .secondary-button{min-height:46px;min-width:0;padding:10px 7px;margin:0;font-size:14px;touch-action:manipulation}
.table-actions>.wide{grid-column:1/-1}
.table-feedback{margin:10px 0;padding:11px 14px;border:1px solid #a9925a66;border-radius:12px;background:#11171b;text-align:center;color:#fff0c3;font-size:15px;line-height:1.5}
.table-feedback strong{display:block;font-size:22px;color:#e7ce89;font-variant-numeric:tabular-nums}
.table-feedback.positive strong{color:#b7edc9}
.table-feedback.negative strong{color:#efb0a3}
.insurance-panel{padding:10px 12px;margin:10px 0;border:1px solid #b0965c;border-radius:12px;background:#151d22}
.insurance-panel p{margin:0 0 9px;color:#fff0c4;font-size:14px;text-align:center}
.chip-choice:focus-visible,.wager-shortcut:focus-visible,.bet-zone:focus-visible{outline:3px solid #ffe5a0;outline-offset:3px}
.game-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.casino-table.baccarat{background-color:#071d40;padding-top:26px;padding-bottom:24px}
.baccarat .seat-heading{color:#e4eaff}
.baccarat .seat-value{background:#0b1734cc}
.baccarat .card-fan{--card-width:clamp(58px,20cqw,88px)}
.bet-zones{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:12px}
.bet-zone{min-width:0;min-height:74px;border:1px solid #9b8d6d;border-radius:13px;background:#081b35c4;color:#f1eadb;padding:8px 3px;cursor:pointer;touch-action:manipulation}
.bet-zone b{display:block;font-size:13px}
.bet-zone small{display:block;color:#c7cfdf;font-size:11px;margin:4px 0}
.bet-zone strong{display:block;min-height:18px;font-size:14px;color:#fff0be;font-variant-numeric:tabular-nums}
.bet-zone[aria-pressed=true]{background:#172941e0;border-color:#ffe3a1;box-shadow:inset 0 0 0 1px #f8d995,0 0 16px #c8a7622b}
.bet-zone.winner{border-color:#9de7c1;background:#123535dd}
.pair-zones{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:7px}
.pair-zones .bet-zone{min-height:58px}
.road-history{border:1px solid #68583c;border-radius:10px;padding:9px 11px;margin:10px 0;background:#0c121a;color:#dacba6;font-size:13px}
.road-history summary{cursor:pointer;min-height:26px}
.bead-road{display:grid;grid-auto-flow:column;grid-template-rows:repeat(6,19px);grid-template-columns:repeat(9,minmax(0,1fr));gap:3px;padding-top:8px}
.road-bead{display:grid;place-items:center;min-width:0;border:1px solid #65758a66;border-radius:50%;background:#0b111c;color:#b8c8de;font:bold 11px Arial}
.road-bead.player{background:#173f75;border-color:#6696ce;color:#e2efff}
.road-bead.banker{background:#6c283d;border-color:#cc7991;color:#ffe6ee}
.road-bead.tie{background:#1b594b;border-color:#7cb49e;color:#d4ffef}
.demo-finger{position:fixed;z-index:10010;font-size:42px;pointer-events:none;line-height:1;filter:drop-shadow(0 3px 4px #0009)}
@keyframes card-deal{from{opacity:.1;transform:translate(var(--flight-x,100px),var(--flight-y,-120px)) rotate(calc(-60deg - var(--index)*12deg)) scale(.82)}to{opacity:1;transform:translate(0,0) rotate(0deg) scale(1)}}
@keyframes card-flip{from{transform:perspective(500px) rotateY(90deg) scale(.95)}to{transform:none}}
@media(prefers-reduced-motion:reduce){.casino-table *{animation:none!important;transition:none!important}}
body.reduced-motion .casino-table *{animation:none!important;transition:none!important}
@media(min-width:600px) and (orientation:portrait) and (pointer:coarse){.casino-table{padding:34px 24px;min-height:440px}.card-fan{--card-width:clamp(90px,17cqw,128px)}.baccarat .card-fan{--card-width:clamp(100px,18cqw,136px)}.player-hands.multi .card-fan{--card-width:90px}.seat-heading{font-size:18px;margin-bottom:12px}.bet-zone{min-height:92px}.bet-zone b{font-size:17px}}

.bank-speech-slot{position:absolute;z-index:20;top:0;left:12px;right:12px;transform:translateY(-50%);pointer-events:none}
.bank-speech{position:relative;display:block;width:100%;min-height:102px;margin:0;padding:13px 34px 11px 14px;border:1px solid #b99555b0;border-radius:18px;background:#000;box-shadow:0 6px 18px #0007;color:#fff2cf;text-align:left;font-size:17px;font-weight:500;line-height:1.3;pointer-events:auto}
.bank-speech:after{content:'';position:absolute;bottom:-8px;left:calc(28% - 7px);width:14px;height:14px;transform:rotate(45deg);border-right:1px solid #b99555b0;border-bottom:1px solid #b99555b0;background:#000;pointer-events:none}
.bank-speech strong{font-weight:600;flex:0 0 auto;margin:0;white-space:nowrap;font-size:clamp(18px,4.6cqw,22px);color:#fff2cf;font-variant-numeric:tabular-nums}
.bank-speech small{flex:0 0 100%;font-size:13px;font-weight:600}
.bank-speech small:empty{display:none}
.bank-speech p{flex:0 0 100%;margin:0;font-size:15px;font-weight:500;line-height:1.4;color:#f1e7d3}
.bank-speech.positive strong{color:#a6f3c0}
.bank-speech.negative strong{color:#ffaaa1}
.chip-choice.guide-target{border-radius:50%;outline:2px solid #ffe19a;outline-offset:-2px}
.go-button.guide-target{box-shadow:0 0 0 2px #ffe19a,0 0 14px #e1bd6538}

.chip-choices .go-button{flex:0 0 48px;min-width:48px;width:48px;min-height:44px;margin:0 0 0 auto;padding:8px 4px;font-size:15px;line-height:1.2;touch-action:manipulation}
.speech-close{position:absolute;z-index:2;top:-2px;right:-2px;width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;background:transparent;color:#fff2cf;font-size:19px;cursor:pointer;touch-action:manipulation}
.speech-close:before{content:'';position:absolute;inset:9px;border:1px solid #b9955570;border-radius:50%;background:transparent}
.speech-close:focus-visible{outline:3px solid #ffe5a0;outline-offset:-5px;border-radius:12px}


#hand-outcome{max-width:100%;font-size:clamp(14px,3.8cqw,17px);overflow-wrap:anywhere}

.guide-actions{display:flex;flex:0 0 auto;align-items:center;gap:14px;margin-left:auto}
.guide-toggle{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;margin:0;padding:0;border:1px solid #cbb376;border-radius:10px;background:#101515;color:#ffe5a0;cursor:pointer;touch-action:manipulation}
.guide-toggle[aria-expanded=true]{background:#302918;border-color:#ffe5a0;box-shadow:inset 0 0 0 1px #ffe5a040}
.guide-toggle svg{pointer-events:none}
.guide-toggle:focus-visible{outline:3px solid #ffe5a0;outline-offset:2px}

.bank-speech.is-closing{animation:guide-fade-out .26s ease-out both;pointer-events:none}
@keyframes guide-fade-out{from{opacity:1}to{opacity:0}}


/* Same overlay as Baccarat, with clearance above the dealer's cards. */
.casino-table{overflow:visible;margin-top:4px}
#dealer-seat{padding-top:52px}
.table-actions .guide-target{box-shadow:0 0 0 2px #ffe19a}

/* The outer table stays the same height throughout every hand and split. */
.casino-table{--blackjack-card-width:clamp(56px,19cqw,86px);--blackjack-card-height:calc(var(--blackjack-card-width)*10/7);--blackjack-top-padding:24px;--blackjack-table-height:calc(var(--blackjack-card-height)*2 + var(--blackjack-top-padding) + 181px);height:var(--blackjack-table-height);min-height:var(--blackjack-table-height);max-height:var(--blackjack-table-height);box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:calc(85px + var(--blackjack-card-height)) 26px calc(40px + var(--blackjack-card-height));padding-top:var(--blackjack-top-padding);padding-bottom:30px}
#player-hands{min-height:0;overflow:auto;overscroll-behavior:contain;align-content:start;grid-auto-rows:max-content;scrollbar-width:thin;scrollbar-color:#b99555 #071d40}
#player-hands.multi{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#player-hands.multi .seat{margin:0;padding:7px 0 10px;border:0}
#player-hands.multi .card-fan{--card-width:clamp(40px,10cqw,48px)}
#player-hands.multi .seat-heading{min-height:27px;gap:4px;margin-bottom:6px;font-size:12px;letter-spacing:0}
#player-hands.multi .seat-value{height:27px;min-width:26px;padding:0 5px}
#table-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
#table-actions>.secondary-button{padding:10px 3px;font-size:clamp(11px,3cqw,14px);overflow-wrap:anywhere}
@media(min-width:600px) and (orientation:portrait) and (pointer:coarse){.casino-table{--blackjack-card-width:clamp(90px,17cqw,128px);--blackjack-top-padding:34px}#player-hands.multi .card-fan{--card-width:clamp(60px,10cqw,80px)}}

/* Equal heading slots keep the top edge of every card hand steady. */
#player-hands>.seat{display:grid;grid-template-rows:33px auto}
.bank-speech{overflow:visible}
.speech-content{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:baseline;gap:5px 10px;max-height:148px;overflow:auto;scrollbar-width:thin;scrollbar-color:#8c754e transparent}
.speech-close svg{position:relative;z-index:1;color:#e2d0a8;pointer-events:none}
.speech-close:hover svg{color:#fff2cf}

/* Exactly 30 px beneath the normal player's cards, independent of play state. */
#dealer-seat{padding:52px 0 0}
#dealer-seat .seat-heading,#player-hands .seat-heading,#player-hands.multi .seat-heading{height:33px;min-height:33px;margin:0}
#player-hands>.seat,#player-hands.multi>.seat{padding:7px 0 0}
.casino-table .card-fan{--card-width:var(--blackjack-card-width);height:calc(var(--card-width)*10/7)}
.casino-table .playing-card{top:0}
.casino-table .table-stamp{height:26px;min-height:26px;padding:0}

#player-hands.multi .card-fan{--card-width:var(--blackjack-card-width)}

/* One overlay flight avoids clipping inside the fixed split-hand area. */
.playing-card.in-flight{visibility:hidden}
.card-flight-layer{position:absolute;inset:0;z-index:12;contain:strict;overflow:hidden;pointer-events:none}
.card-flight-layer>.card-flight{position:absolute;z-index:1;margin:0;pointer-events:none}
