.blackjack-shell { width: min(100%, 52rem); height: var(--game-visible-height, 100dvh); min-height: 0; grid-template-rows: auto auto minmax(0,1fr) auto; overflow: hidden; }
.blackjack-stage { min-height: 0; height: 100%; overflow: hidden; }
.blackjack-table { position: relative; width: 100%; height: 100%; min-height: 0; padding: clamp(.65rem,2vw,1.1rem); display: grid; grid-template-rows: minmax(0,1fr) auto auto minmax(0,1fr); place-items: center; overflow: hidden; border: 2px solid #17324d; border-radius: 1rem; background: radial-gradient(circle at 50% 45%,#368775,#196252 72%); box-shadow: inset 0 0 0 4px rgba(255,255,255,.09),5px 5px 0 rgba(23,50,77,.13); }
.table-hand { width: 100%; min-height: 0; display: grid; align-content: center; justify-items: center; gap: .3rem; }
.hand-label { display: flex; align-items: center; gap: .5rem; color: #fffdf8; font-size: .82rem; }
.hand-label span { min-width: 2rem; padding: .15rem .45rem; border-radius: 999px; background: rgba(8,29,35,.42); text-align: center; font-weight: 900; }
.card-hand { min-height: 5.7rem; display: flex; justify-content: center; align-items: center; }
.card-hand .playing-card { width: clamp(3.8rem,11vw,5.6rem); font-size: clamp(.74rem,2.4vw,1.1rem); margin-left: clamp(-1rem,-2vw,-.35rem); }
.card-hand .playing-card:first-child { margin-left: 0; }
.central-deck { width: clamp(2.8rem,8vw,4rem); position: absolute; z-index: 1; right: clamp(.8rem,5vw,3rem); top: clamp(3rem,19%,5rem); opacity: .78; }
.central-deck::before,
.central-deck::after { content: ''; position: absolute; inset: 0; z-index: -1; border: inherit; border-radius: inherit; background: inherit; box-shadow: inherit; }
.central-deck::before { transform: translate(-3px,-3px); }
.central-deck::after { transform: translate(3px,3px); }
.central-deck.shuffling { animation: blackjack-shuffle-stack .8s cubic-bezier(.2,.8,.2,1); }
.central-deck.shuffling::before { animation: blackjack-shuffle-left .8s ease-in-out; }
.central-deck.shuffling::after { animation: blackjack-shuffle-right .8s ease-in-out; }
.table-message { z-index: 2; margin: 0; padding: .35rem .8rem; border-radius: 999px; background: #f5f0e6; color: #17324d; font-size: .75rem; font-weight: 850; text-align: center; box-shadow: 0 2px 8px rgba(8,29,35,.22); }
.player-area { width: 100%; min-height: 0; display: flex; align-items: center; justify-content: center; gap: .45rem; }
.player-hand { min-width: 0; flex: 1; display: grid; justify-items: center; align-content: center; gap: .25rem; padding: .3rem; border: 2px solid transparent; border-radius: .8rem; }
.player-hand.active { border-color: #ffd65a; background: rgba(255,214,90,.1); }
.player-hand .card-hand .playing-card { width: clamp(3.4rem,10vw,5.2rem); }
.hand-result { min-height: 1rem; color: #ffd65a; font-size: .72rem; font-weight: 950; text-transform: uppercase; }
.chip-stack { min-height: 1.2rem; display: flex; align-items: center; justify-content: center; padding-left: .35rem; }
.blackjack-chip { width: 2.1rem; height: 2.1rem; display: inline-grid; place-items: center; margin-left: -.35rem; border: 3px dashed #f8f0d6; border-radius: 50%; background: #d96955; color: #fffdf8; box-shadow: 0 2px 4px rgba(8,29,35,.35),inset 0 0 0 2px #9d3f35; font-size: .6rem; font-weight: 950; line-height: 1; }
.chip-stack .blackjack-chip:first-child { margin-left: 0; }
.chip-flight { position: fixed; z-index: 10001; margin: 0; pointer-events: none; will-change: transform,opacity; }
.dealer-flip-cover { position: fixed!important; z-index: 10001!important; margin: 0; pointer-events: none; transform-origin: center; }
.blackjack-mode-picker .message-card { max-width: 25rem; }
.mode-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin-top: 1rem; }
.mode-actions .action-button { width: 100%; }
.multiplayer-toggle { min-width: 5.7rem; padding-inline: .5rem; font-size: .72rem; }
.player-area:has(.multiplayer-seat) { align-items: stretch; overflow-x: auto; justify-content: center; scrollbar-width: none; }
.player-area:has(.multiplayer-seat)::-webkit-scrollbar { display: none; }
.multiplayer-seat { min-width: min(9.5rem,40vw); }
.multiplayer-seat.is-you { background: rgba(255,255,255,.13); box-shadow: inset 0 0 0 2px rgba(255,255,255,.45); }
.multiplayer-label { max-width: 100%; }
.multiplayer-label img { width: 1.45rem; height: 1.45rem; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; object-fit: cover; }
.multiplayer-seat.active .seat-avatar { animation: active-seat-pulse 1.1s ease-in-out infinite; }
.multiplayer-label strong { max-width: 6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.seat-position { color: #ffd65a; font-size: .62rem; font-weight: 900; letter-spacing: .03em; text-transform: uppercase; }
.multiplayer-hands { width: 100%; display: flex; align-items: center; justify-content: center; gap: .2rem; }
.multiplayer-hand { min-width: 0; display: grid; justify-items: center; }
.multiplayer-hand.active { border-radius: .5rem; box-shadow: 0 0 0 2px #ffd65a; }
.multiplayer-seat .card-hand { min-height: 4.8rem; }
.multiplayer-seat .card-hand .playing-card { width: clamp(2.7rem,7.5vw,4rem); margin-left: clamp(-1.5rem,-3vw,-.75rem); }
.waiting-next-round { align-self: center; color: #fffdf8; font-size: .7rem; font-weight: 800; }
.blackjack-actions { grid-template-columns: repeat(4,minmax(0,1fr)); }
.blackjack-actions .action-button { width: 100%; min-width: 0; padding-inline: .55rem; }
.blackjack-actions button:disabled { opacity: .42; cursor: default; transform: none; }
@media (max-width:560px) {
  .blackjack-shell { padding-inline: .4rem; gap: .5rem; }
  .blackjack-table { border-radius: .7rem; padding: .4rem; }
  .card-hand { min-height: 4.9rem; }
  .blackjack-actions { gap: .25rem; }
  .blackjack-actions .action-button { padding: .55rem .25rem; font-size: .72rem; }
  .multiplayer-toggle { min-width: 4.7rem; font-size: .62rem; }
  .scorebar { padding: .5rem .65rem; }
  .metric-value { font-size: 1rem; }
  .mode-actions { gap: .4rem; }
  .mode-actions .action-button { padding-inline: .35rem; font-size: .8rem; }
}
@media (prefers-reduced-motion:reduce) { .deal-flight,.chip-flight,.dealer-flip-cover { display:none; } .multiplayer-seat.active .seat-avatar, .central-deck.shuffling, .central-deck.shuffling::before, .central-deck.shuffling::after { animation:none; } }
@keyframes active-seat-pulse { 50% { transform: scale(1.14); box-shadow: 0 0 0 4px rgba(255,214,90,.3); } }
@keyframes blackjack-shuffle-stack { 20% { transform: rotate(-5deg) scale(1.05); } 48% { transform: rotate(6deg) scale(1.1); } 75% { transform: rotate(-3deg) scale(1.04); } }
@keyframes blackjack-shuffle-left { 25% { transform: translate(-85%,-8%) rotate(-16deg); } 55% { transform: translate(35%,4%) rotate(8deg); } }
@keyframes blackjack-shuffle-right { 25% { transform: translate(85%,8%) rotate(16deg); } 55% { transform: translate(-35%,-4%) rotate(-8deg); } }
