/* Shared stock convention. Its footprint stays fixed while the paper stack thins. */
.table-game .stock-pile {
  position: relative; isolation: isolate; flex: 0 0 auto;
  width: var(--stock-card, var(--table-card)); aspect-ratio: 110 / 156;
  margin: 26px 10px 18px;
}
.table-game .stock-layer {
  position: absolute; inset: 0; display: block; width: 100%; height: 100%; margin: 0;
  border: 1px solid #766c50; border-radius: 5px;
  box-shadow: 1px 1px 0 #253e3166;
  transform: translate(calc(var(--stock-lift) * -.22), calc(var(--stock-lift) * -1));
}
.table-game .stock-layer:not(.card-back) { background: var(--pop-paper); }
.table-game .stock-layer.card-back { border: 0; box-shadow: 1px 1px 0 #253e3166; }
.table-game .stock-pile[data-empty="true"] { border: 1px solid #fff4d633; border-radius: 5px; }
/* The exposed card crosses the stock at mid-height and projects to the right. */
.table-game .stock-face { position: absolute; inset: 0; transform: translate(65%, calc(var(--stock-depth, 0px) * -1)) rotate(90deg); }
.table-game .stock-face > [data-visual-card] { width: 100%; height: auto; }
.table-game .stock-pile[data-face-slot="true"] {
  margin-right: calc(var(--stock-card, var(--table-card)) * .9 + 10px);
}
.table-game:has([data-stock]) .deal-origin { visibility: hidden; }
.table-game .stock-action {
  position: absolute; z-index: 2; inset: calc(-1 * var(--stock-depth, 0px)) 0 0;
  min-width: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 6px;
  background: transparent; box-shadow: none; opacity: 1; touch-action: manipulation;
}
.table-game .stock-action:not(:disabled) { cursor: pointer; }
.table-game .stock-action:focus-visible { outline: 2px solid var(--pop-paper); outline-offset: -3px; }
.table-game .stock-pile[data-exposed-only="true"] .stock-action { transform: translate(65%, 0) rotate(90deg); }