/* Permanent claim, pile and revelation anchors; only the last claim is public. */
body[data-screen="game"]:has(.game-bluff) .topbar { height: 56px; flex: 0 0 56px; }
.table-game .bluff-table {
  --bluff-card: clamp(90px, min(21cqw, 29cqh), 135px);
  --stock-card: var(--bluff-card);
  display: grid; grid-template-columns: var(--bluff-card) minmax(0, 310px);
  grid-template-rows: 74px calc(var(--bluff-card) * 156 / 110 + 56px);
  justify-content: center; align-content: center; gap: 12px 30px; padding: 0; height: 100%; width: 100%;
}
.bluff-claim { grid-column: 1 / -1; display: grid; grid-template-columns: auto 100px; justify-content: center; align-content: start; align-items: center; gap: 3px 8px; color: var(--pop-paper); }
.bluff-claim select { margin: 0; width: 100px; min-height: 44px; padding: 3px 8px; }
.bluff-declaration { grid-column: 1 / -1; margin: 0; text-align: center; font-size: 17px; }
.bluff-pile { position: relative; display: grid; grid-template-rows: 1fr 24px 28px; justify-items: center; align-items: center; padding: 0; border: 0; background: none; box-shadow: none; color: var(--pop-paper); border-radius: 7px; }
.bluff-pile:disabled { opacity: 1; }
.table-game .bluff-pile .stock-pile { margin: 0; }
.bluff-pile .stock-pile[data-empty="true"] { border: 1px dashed #fff4d666; border-radius: 7px; }
.bluff-pile-label { font-size: 16px; }
.bluff-deposit { font-size: 17px; border-bottom: 1px solid currentColor; }
.bluff-pile:focus-visible { outline: 2px solid var(--pop-paper); outline-offset: -3px; }
.bluff-reveal { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) var(--bluff-card); grid-template-rows: calc(var(--bluff-card) * 156 / 110) 56px; align-content: center; }
.bluff-card { display: block; width: var(--bluff-card); aspect-ratio: 110 / 156; }
.bluff-verdict { grid-column: 1 / -1; grid-row: 2; text-align: center; color: var(--pop-paper); font-size: 15px; line-height: 1.2; margin: 6px 0 0; }
@media (max-width: 700px) {
  body[data-screen="game"]:has(.game-bluff) .topbar { flex-wrap: wrap; height: 84px; flex-basis: 84px; min-height: 84px; align-content: space-between; }
  body[data-screen="game"]:has(.game-bluff) .top-actions { width: 100%; justify-content: flex-end; }
  .table-game .bluff-table { gap: 8px 20px; grid-template-columns: var(--bluff-card) minmax(0, 170px); }
}
@media (max-height: 650px) {
  .table-game .bluff-table { --bluff-card: 90px; gap: 5px 16px; grid-template-rows: 70px 170px; }
}
