.casino-notice { margin:4px 0; padding:6px 10px; border:1px solid #d9ae60; border-radius:8px; background:#fff3d7; color:#412819; font-size:12px; line-height:1.3; }
.casino-notice a { color:#552c65; text-decoration:underline; white-space:nowrap; }
.casino-age-check { display:flex; gap:10px; align-items:start; }
.casino-age-check input { width:20px; flex:0 0 20px; }
body #tableView[data-game="poker"], body #tableView[data-game="blackjack"] { display:flex; flex-direction:column; }
body #tableView:is([data-game="poker"],[data-game="blackjack"])[data-status="running"] > .players-row { display:none; }
body #tableView:is([data-game="poker"],[data-game="blackjack"]) > .casino-notice { flex-shrink:0; }
body #tableView:is([data-game="poker"],[data-game="blackjack"]) .playmat { display:block; padding:6px; min-height:0; flex:1; overflow:hidden; }
body .melds-area.casino-surface { display:block; height:100%; padding:0; overflow:visible; }
.casino-table { height:100%; min-height:0; display:flex; flex-direction:column; gap:8px; color:#fff4dc; }
.casino-center { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; text-align:center; }
.casino-center > .casino-cards { flex-basis:100%; justify-content:center; }
.casino-players { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; flex:1; min-height:0; overflow:auto; }
.casino-player { border:1px solid #ffffff40; border-radius:10px; padding:7px; background:#172e26c9; display:flex; flex-direction:column; justify-content:center; gap:4px; min-width:0; font-size:12px; }
.casino-player > strong { overflow-wrap:anywhere; }
.casino-player.is-active { outline:2px solid #edc476; }
.casino-player.is-own > strong { color:#ffe2a0; }
.casino-cards { display:flex; gap:4px; flex-wrap:wrap; }
.casino-card { background:#fffdf7; color:#162329; border-radius:5px; box-shadow:0 2px 3px #0005; display:flex; justify-content:center; align-items:center; width:42px; height:54px; font:bold 21px Georgia,serif; flex-shrink:0; }
.casino-card.is-red { color:#a52037; }
.casino-card.is-back { background:repeating-linear-gradient(45deg,#562c46,#562c46 4px,#75415f 4px,#75415f 6px); color:#ead6a5; border:2px solid #eee0c5; }
.casino-box { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.casino-box.is-current { border-left:3px solid #e9bd6d; padding-left:4px; }
.casino-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; padding:5px 0; flex-shrink:0; }
.casino-action { display:flex; gap:3px; }
.casino-action input { width:90px; min-width:0; color:#211821; background:#fffaf0; border:1px solid #cba66c; border-radius:6px; padding:6px; }
.casino-action button { min-height:38px; padding:6px 12px; font-size:13px; }
body .game-library:has(.game-poker:not(.control-hidden)) { grid-template-rows:repeat(4,minmax(0,1fr)); }
body #rulesDialog:has(.casino-rules)[open] { display:flex; flex-direction:column; max-height:calc(100dvh - 24px); }
body #rulesDialog:has(.casino-rules) .dialog-body { overflow:auto; min-height:0; }
body .casino-rules { display:block; }
@media(max-width:600px) {
  .casino-players { grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
  .casino-player { padding:5px; font-size:11px; }
  .casino-card { width:32px; height:42px; font-size:17px; }
  .casino-notice { font-size:10px; padding:4px 6px; }
  .casino-table { gap:5px; }
  body .game-library:has(.game-poker:not(.control-hidden)) { grid-template-rows:repeat(7,minmax(0,1fr)); gap:4px; }
  body .game-library:has(.game-poker:not(.control-hidden)) .game-art { display:none; }
}
@media(max-height:450px) and (min-width:501px) {
  .casino-table { min-height:0; }
  .casino-players { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .casino-center > .casino-cards { flex-basis:auto; }
  .casino-card { width:28px; height:34px; font-size:15px; }
  .casino-player { padding:3px; font-size:10px; gap:1px; }
  .casino-card { height:28px; }
  .casino-actions { gap:4px; padding:2px; }
  .casino-action button { min-height:30px; padding:4px 7px; font-size:12px; }
  body .game-library:has(.game-poker:not(.control-hidden)) { grid-template-rows:repeat(4,minmax(0,1fr)); }
}
@media(max-width:380px) {
  .casino-player { font-size:10px; padding:4px; gap:2px; }
  .casino-player > strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .casino-card { width:27px; height:33px; font-size:15px; }
}

/* Blackjack: the viewer's hand and dealer share the table's centre line. */
.bj-table { container-type:size; --bj-card-width:clamp(48px,min(18cqw,14cqh),110px); gap:6px; }
.bj-stage { flex:1; min-height:0; display:grid; grid-template-rows:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.bj-zone { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; min-height:0; gap:5px; text-align:center; }
.bj-zone > strong { font-size:clamp(13px,2cqw,18px); }
.bj-zone .casino-cards { justify-content:center; flex-wrap:nowrap; max-width:100%; }
.bj-zone .casino-card { width:var(--bj-card-width); height:calc(var(--bj-card-width) * 1.35); font-size:clamp(18px,calc(var(--bj-card-width) * .36),40px); flex-shrink:1; min-width:22px; border-radius:8px; }
.bj-hands { display:flex; justify-content:center; align-items:center; gap:16px; width:100%; min-width:0; }
.bj-hand { display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0; max-width:calc(100% - 8px); padding:4px 8px; border:2px solid transparent; border-radius:10px; }
.bj-hands:has(> :nth-child(2)) .bj-hand { width:calc(50% - 8px); }
.bj-hand.is-current { border-color:#edc476; background:#edc4760b; }
.bj-score { font-size:clamp(13px,2cqw,18px); font-weight:700; color:#ffe2a0; }
.bj-stake { font-size:12px; color:#e4d5c3; }
.bj-table .bj-opponents { display:grid; grid-template-columns:repeat(auto-fit,minmax(90px,1fr)); flex:0 0 auto; max-height:90px; gap:6px; overflow:auto; }
.bj-opponent { min-width:0; padding:4px 7px; border:1px solid #ffffff35; border-radius:7px; font-size:10px; }
.bj-opponent.is-current { border-color:#edc476; }
.bj-opponent > strong { display:block; overflow-wrap:anywhere; }
.bj-other-hand { display:flex; align-items:center; gap:5px; }
.bj-other-hand .casino-cards { gap:2px; }
.bj-other-hand .casino-card { width:23px; height:29px; font-size:13px; }
@media(max-width:600px) {
  .bj-table { --bj-card-width:clamp(48px,min(19cqw,14cqh),90px); }
  .bj-hands { gap:4px; }
  .bj-hand { padding:3px; }
  .bj-table .bj-opponents { max-height:72px; }
  .bj-other-hand .casino-cards { display:none; }
  .bj-stake { font-size:11px; }
}
@media(max-height:450px) {
  .bj-table { --bj-card-width:clamp(38px,17cqh,70px); gap:3px; }
  .bj-stage { gap:2px; }
  .bj-zone { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-content:center; gap:2px 7px; }
  .bj-zone > strong { grid-column:1/-1; font-size:12px; }
  .bj-dealer > .casino-cards { grid-column:2; }
  .bj-dealer > .bj-score { grid-column:3; text-align:left; }
  .bj-hands { grid-column:1/-1; }
  .bj-hand { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); width:100%; gap:1px 7px; padding:2px; }
  .bj-hand .casino-cards { grid-column:2; grid-row:1/3; }
  .bj-hand > :is(.bj-score,.bj-stake) { grid-column:3; text-align:left; }
  .bj-score { font-size:12px; }
  .bj-stake { font-size:10px; }
  .bj-table .bj-opponents { max-height:30px; grid-template-columns:repeat(auto-fit,minmax(90px,1fr)); }
  .bj-opponent { padding:2px 5px; }
  .bj-other-hand .casino-cards { display:none; }
}