/* Desktop table fitting is presentation-only: reserve controls, then scale the felt. */
@media(min-width:800px){
 body.table-screen{height:100dvh;display:flex;flex-direction:column}
 .table-screen header{height:44px;min-height:44px;width:100%;max-width:1600px;padding:0 16px}
 .table-screen header button{padding:5px 10px}
 .table-screen .brand{font-size:13px}
 .table-screen main{width:100%;max-width:1600px;flex:1;min-height:0;padding:6px 16px 8px;display:flex;flex-direction:column;gap:6px}
 .table-screen .heading{flex:none;min-height:30px;margin:0;align-items:center}
 .table-screen .heading .eyebrow{display:none}
 .table-screen .heading h1{font-size:22px;margin:0}
 .table-screen .table-info{max-width:none;font-size:12px}
 .table-screen .table-workspace{flex:1;min-height:0;grid-template-columns:minmax(0,1fr) 220px;gap:14px;align-items:stretch}
 .table-screen .game-column,.table-screen #play{min-height:0;display:flex;flex-direction:column;gap:6px}
 .table-screen #play{flex:1}
 .table-screen .player-controls{flex:none;padding:0;min-height:30px;font-size:12px;flex-wrap:nowrap}
 .table-screen .player-controls button{padding:5px 8px;font-size:12px}
 .table-screen .play-top{flex:none;margin:0;font-size:12px;min-height:17px}
 .table-screen .table-fit-frame{position:relative;flex:1;min-height:0}
 .table-screen .game{position:absolute;width:1000px;height:510px!important;top:0;left:50%;margin:0;padding:0;transform-origin:top center;transform:translateX(-50%) scale(var(--table-scale,1));}
 .table-screen .game .table{inset:80px 50px 60px;border-radius:50%;min-height:0}
 .table-screen .game .opponents .seat{width:120px;padding:6px;max-width:none}
 .table-screen .game .cards{gap:4px;min-height:38px}
 .table-screen .game .card{width:28px;height:38px;font-size:14px;padding:3px}
 .table-screen .game .card .suit{font-size:16px}
 .table-screen .game .card.private{margin-left:2px;outline-offset:1px}
 .table-screen .game .seat-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:28px;max-height:28px;line-height:14px;font-size:12px;margin:4px 0 0;padding:0}
 .table-screen .game .stack{display:block;font-size:13px;line-height:15px;margin:2px 0 0}
 .table-screen .game .seat-status{font-size:11px;line-height:12px;height:24px;min-height:24px;margin:2px 0 0;overflow:hidden}
 .table-screen .game .hero{width:150px;min-width:150px;max-width:150px;bottom:6px;padding:6px 8px}
 .table-screen .game .hero .seat{min-width:0}
 .table-screen .game .casino-dealer{width:26px;height:26px;font-size:14px;top:-29px;right:2px}
 .table-screen .game .blind-marker{top:-27px;left:2px}
 .table-screen .game .seat-bet{bottom:-23px;font-size:11px;padding:2px 7px}
 .table-screen .game .hero .seat-bet{bottom:auto;top:-27px}
 .table-screen .game .board-zone{top:50%;width:280px;max-width:280px}
 .table-screen .game .board .card{width:42px;height:58px;font-size:19px}
 .table-screen .game .board .card .suit{font-size:21px}
 .table-screen .game .board{margin:8px 0;gap:6px}
 .table-screen .game .felt-brand{font-size:14px;letter-spacing:2px;margin-bottom:6px}
 .table-screen .game .felt-brand span{display:none}
 .table-screen .game .river-note{display:none}
 .table-screen .game .opponents :is(.seat-position-1,.seat-position-d1){left:25%;top:360px}
 .table-screen .game .opponents :is(.seat-position-2,.seat-position-d4){left:25%;top:32px}
 .table-screen .game .opponents :is(.seat-position-3,.seat-position-d5){left:50%;top:32px}
 .table-screen .game .opponents :is(.seat-position-4,.seat-position-d6){left:75%;top:32px}
 .table-screen .game .opponents :is(.seat-position-5,.seat-position-d9){left:75%;top:360px}
 .table-screen .game .opponents .seat-position-d2{left:7%;top:320px}
 .table-screen .game .opponents .seat-position-d3{left:7%;top:160px}
 .table-screen .game .opponents .seat-position-d7{left:93%;top:160px}
 .table-screen .game .opponents .seat-position-d8{left:93%;top:320px}
 .table-screen .action-panel{flex:none;min-height:88px;margin:0;padding:8px 10px;border-radius:10px}
 .table-screen .action-panel .status p{font-size:13px;line-height:1.3;margin:3px 0 6px}
 .table-screen #controls{gap:6px}
 .table-screen #controls button{font-size:13px;padding:7px 10px}
 .table-screen .raise-controls input{width:68px;font-size:13px;padding:6px}
 .table-screen .bottom{flex:none;margin:0;height:32px;overflow:auto}
 .table-screen .history{display:flex;align-items:baseline;gap:10px}
 .table-screen .history .eyebrow{font-size:10px;white-space:nowrap}
 .table-screen .history ol{font-size:12px;margin:0;line-height:1.5}
 .table-screen .session-note{display:none}
 .table-screen #notice{flex:none;margin:0;padding:6px 10px;font-size:12px}
 .table-screen .table-workspace .table-chat{position:static;height:100%;min-height:0;max-height:none;padding:12px}
 .table-screen .chat-heading{display:block;padding-bottom:8px}
 .table-screen .chat-heading h2{font-size:20px}
 .table-screen .chat-heading>span{font-size:11px}
 .table-screen .chat-messages{min-height:0}
 .table-screen .chat-compose input{font-size:13px}
 .table-screen .practice-setup{flex:none;margin:0;gap:8px;font-size:12px}
 .table-screen .practice-setup select,.table-screen .practice-setup button{font-size:12px;padding:4px 8px}
 .table-screen .practice-setup span{font-size:11px}
}



/* Dynamic hand content must not change the space allocated to the table. */
@media(min-width:800px){
 .table-screen .heading{height:30px;min-height:30px}
 .table-screen .player-controls{height:32px;min-height:32px}
 .table-screen #seatStatus{min-width:0;overflow:auto;max-height:32px}
 .table-screen .player-controls button{flex-shrink:0;white-space:nowrap}
 .table-screen .play-top{height:17px;min-height:17px;white-space:nowrap}
 .table-screen .action-panel{height:148px;min-height:148px;max-height:148px;display:grid;grid-template-rows:48px 74px;gap:8px;overflow:hidden}
 .table-screen .action-panel .status{min-height:0;overflow:auto;scrollbar-gutter:stable}
 .table-screen .action-panel .status p{margin:3px 0 0}
 .table-screen #controls{min-height:0;align-content:start;align-items:center;overflow:auto;scrollbar-gutter:stable}
 .table-screen #controls button{white-space:nowrap}
 .table-screen .auto-deal-note{margin:0;font-size:13px;line-height:18px}
 /* Hidden notices retain their own line instead of shrinking the game on errors. */
 .table-screen #notice{display:block!important;height:30px;min-height:30px;max-height:30px;padding:4px 10px;overflow:auto;line-height:20px}
 .table-screen #notice[hidden]{visibility:hidden}
 /* Three fixed slots prevent the first two cards from shifting on private river. */
 .table-screen .game :is(.opponents,.hero) .cards{display:grid;grid-template-columns:repeat(3,28px);grid-template-rows:38px;justify-content:center;height:38px;min-height:38px}
 .table-screen .game :is(.opponents,.hero) .card.private{margin-left:0}
 .table-screen .game .seat-reserved{grid-column:1 / -1}
 .table-screen .game .board-zone{height:144px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}
 .table-screen .game .board-zone>.eyebrow{height:15px;min-height:15px;line-height:15px;white-space:nowrap}
 .table-screen .game .board{height:58px;min-height:58px;flex-shrink:0}
 .table-screen .game .pot{height:36px;min-height:36px;max-width:100%;white-space:nowrap;flex-shrink:0}
 .table-screen .game .felt-brand{height:17px;min-height:17px;line-height:17px;margin-bottom:2px;white-space:nowrap}
 .table-screen .game .stack{white-space:nowrap;font-variant-numeric:tabular-nums}
}

/* Reclaim vertical space without allowing hand state to change panel dimensions. */
@media(min-width:800px){
 .table-screen .action-panel{height:106px;min-height:106px;max-height:106px;grid-template-rows:40px 40px}
 .table-screen #notice{position:absolute;top:44px;left:30%;right:25%;z-index:10;margin:0;background:#302c1d}
 /* Heads-up needs width, not a scaled ten-seat canvas. Keep all text full size. */
 .table-screen .game[data-seats="2"]{width:100%;height:100%!important;left:0;top:0!important;transform:none}
 .table-screen .game[data-seats="2"] .table{inset:28px 5%;border-radius:50%}
 .table-screen .game[data-seats="2"] .opponents .seat{left:16%;top:50%;transform:translate(-50%,-50%);width:160px;padding:10px}
 .table-screen .game[data-seats="2"] .hero{left:84%;top:50%;bottom:auto;transform:translate(-50%,-50%);width:170px;min-width:170px;max-width:170px;padding:10px}
 .table-screen .game[data-seats="2"] :is(.opponents,.hero) .cards{grid-template-columns:repeat(3,36px);grid-template-rows:50px;height:50px;min-height:50px}
 .table-screen .game[data-seats="2"] .card{width:36px;height:50px;font-size:19px}
 .table-screen .game[data-seats="2"] .card .suit{font-size:21px}
 .table-screen .game[data-seats="2"] .seat-name{font-size:15px;line-height:18px;min-height:36px;max-height:36px}
 .table-screen .game[data-seats="2"] .stack{font-size:16px;line-height:20px}
 .table-screen .game[data-seats="2"] .seat-status{font-size:13px;line-height:15px;height:30px;min-height:30px}
 .table-screen .game[data-seats="2"] .board-zone{height:164px;width:270px}
 .table-screen .game[data-seats="2"] .board{height:74px;min-height:74px}
 .table-screen .game[data-seats="2"] .board .card{width:50px;height:74px;font-size:24px}
 .table-screen .game[data-seats="2"] .board .card .suit{font-size:27px}
 .table-screen .game[data-seats="2"] .pot{font-size:12px}
 .table-screen .game[data-seats="2"] .pot strong{font-size:26px}
}
@media(min-width:800px) and (max-width:1100px){
 .table-screen .action-panel{height:140px;min-height:140px;max-height:140px;grid-template-rows:40px 74px}
 .table-screen .table-workspace{grid-template-columns:minmax(0,1fr) 180px;gap:10px}
 .table-screen .game[data-seats="2"] .opponents .seat{left:13%;width:126px;padding:6px}
 .table-screen .game[data-seats="2"] .hero{left:87%;width:130px;min-width:130px;max-width:130px;padding:6px}
 .table-screen .game[data-seats="2"] :is(.opponents,.hero) .cards{grid-template-columns:repeat(3,30px)}
 .table-screen .game[data-seats="2"] :is(.opponents,.hero) .card{width:30px}
 .table-screen .game[data-seats="2"] .board-zone{width:210px}
 .table-screen .game[data-seats="2"] .board .card{width:42px;height:64px;font-size:21px}
}
