/* Poker fullscreen fit. Everything is scoped under html.pip-immersive (the shared shell's fullscreen flag),
 * so leaving fullscreen restores the normal page exactly. The JS sets a zoom on #poker-table so the table,
 * status, action buttons and deal/pause buttons fit one screen with no scroll. */
html.pip-immersive .p-play{display:flex;flex-direction:column;gap:.3rem;padding-left:.6rem;padding-right:.6rem;padding-bottom:.5rem;box-shadow:none;border-radius:0}
html.pip-immersive .p-play::before{display:none}
html.pip-immersive .p-play>*{order:9;flex:none;min-width:0}
html.pip-immersive .p-play>#poker-error{order:0}
html.pip-immersive .p-play>#poker-table{order:1}
html.pip-immersive .p-play>#poker-status{order:2;margin:.15rem 0;min-height:0;padding:.3rem .6rem}
html.pip-immersive .p-play>#poker-actions{order:3;margin:.15rem 0}
html.pip-immersive .p-play>#poker-paused{order:4;margin:0}
html.pip-immersive .p-play>.p-controls{order:4;margin:.15rem 0}
html.pip-immersive .p-play>#poker-setup-details{order:10;margin:.4rem 0 0}
html.pip-immersive .p-tablebar{margin-bottom:.35rem;padding:.35rem .6rem}
html.pip-immersive .p-board{margin:.35rem 0}
html.pip-immersive .p-cards{margin:.3rem 0}
/* The per-variant art sheets lock .p-seats to 1-2 columns with an id selector; out-rank them here. */
html.pip-immersive body #poker-table .p-seats{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.4rem}
html.pip-immersive .p-seat{padding:.4rem .5rem}
html.pip-immersive .p-empty{margin:1rem .25rem}
/* Compact setup form so a new table can be started without scrolling. */
html.pip-immersive #poker-setup-details{margin-bottom:0}
html.pip-immersive #poker-setup-details summary{min-height:40px}
html.pip-immersive #poker-setup-details .p-note,html.pip-immersive #poker-setup-details .p-art-picker{display:none}
html.pip-immersive #poker-setup-details .p-form{gap:.4rem}
html.pip-immersive .p-play>.p-panel,html.pip-immersive .p-play>#poker-depth-gameplay,html.pip-immersive .p-play>#poker-depth-replay{margin-bottom:0}
/* Nothing to study or review before the first deal. */
html.pip-immersive .p-play:has(.p-empty) :is(#poker-depth-gameplay,#poker-coach,#poker-depth-replay,#poker-result){display:none}
html.pip-immersive .p-actions{align-items:center;gap:.4rem}
html.pip-immersive .p-actions .p-button{min-height:44px;padding:.4rem .8rem}
html.pip-immersive .p-raise{order:5;grid-template-columns:auto minmax(0,1fr) auto;gap:.5rem;align-items:center}
html.pip-immersive .p-raise label{grid-column:auto;font-size:.82rem;white-space:nowrap}
html.pip-immersive .p-status{font-size:.95rem}
/* Wide screens (landscape phones, desktops): table on the left, status + buttons in a side column. */
@media (orientation:landscape) and (min-aspect-ratio:3/2){
  html.pip-immersive .p-play{display:grid;grid-template-columns:minmax(0,1fr) 15.5rem;grid-auto-rows:min-content;align-content:start;column-gap:.7rem}
  html.pip-immersive .p-play>*{grid-column:1/-1}
  html.pip-immersive .p-play>#poker-table{grid-column:1;grid-row:1/span 4}
  html.pip-immersive .p-play>#poker-error{grid-column:2;grid-row:1}
  html.pip-immersive .p-play>#poker-status{grid-column:2;grid-row:1}
  html.pip-immersive .p-play>#poker-actions{grid-column:2;grid-row:2}
  html.pip-immersive .p-play>#poker-paused{grid-column:2;grid-row:3}
  html.pip-immersive .p-play>.p-controls{grid-column:2;grid-row:3}
  html.pip-immersive .p-play>#poker-setup-details{grid-column:2;grid-row:4;margin:0}
  html.pip-immersive .p-raise{flex-basis:100%}
}
@media (orientation:landscape) and (max-height:520px){
  html.pip-immersive .p-play{padding-left:.4rem;padding-right:.4rem}
  html.pip-immersive body #poker-table .p-seats{grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr))}
}
/* Narrow portrait phones: the table is already at its smallest zoom, so the study/review panels below it set the
 * height. Tighten the stack gaps a little so the stage does not scroll. */
@media (orientation:portrait) and (max-width:430px){
  html.pip-immersive .p-play{gap:.12rem;padding-bottom:.3rem}
  html.pip-immersive .p-play>#poker-setup-details{margin-top:.15rem}
  html.pip-immersive .p-play>#poker-status,html.pip-immersive .p-play>#poker-actions,html.pip-immersive .p-play>.p-controls{margin-top:.05rem;margin-bottom:.05rem}
  html.pip-immersive body .p-play>:is(#poker-depth-gameplay,#poker-depth-replay,.p-panel){padding-top:.15rem;padding-bottom:.15rem}
  html.pip-immersive body .p-play>:is(#poker-depth-gameplay,#poker-depth-replay,.p-panel) summary{min-height:36px}
  html.pip-immersive body .p-play>#poker-coach{margin:0;padding:.25rem .5rem;font-size:.82rem;line-height:1.3}
  html.pip-immersive .p-actions{gap:.25rem}
  html.pip-immersive .p-actions .p-button{padding-top:.25rem;padding-bottom:.25rem}
  html.pip-immersive #poker-setup-details summary{min-height:34px}
  html.pip-immersive body .p-play>:is(#poker-depth-gameplay,#poker-depth-replay)>details{margin:0}
  html.pip-immersive body .p-play>:is(#poker-depth-gameplay,#poker-depth-replay)>details>summary{padding-top:.3rem;padding-bottom:.3rem}
  /* The per-variant art sheets stack the raise row (label / slider / button) into 2-3 rows; keep it on one line. */
  html.pip-immersive body #poker-actions .p-raise{grid-template-columns:auto minmax(0,1fr) auto;gap:.4rem;align-items:center}
  html.pip-immersive body #poker-actions .p-raise label{grid-column:auto;white-space:nowrap}
}