/* 99/public/css/game.css — only what is specific to Ninety-Nine's table.
   Page chrome, seats, cards, hand tray, lobby and reveal rows all come
   from the shared kit stylesheets. */

/* Room reserved around the felt for the top bar, info strip and this
   game's tray (status row + 3 captioned cards + hint). */
.table-felt { --tbl-felt-chrome: 410px; }

#table-center { align-items: center; gap: 28px; }

.nn-pile { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.pile-label { font-size: 0.7rem; color: var(--tbl-text-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.pile-count { font-size: 0.68rem; color: var(--tbl-text-muted); }
.pile-slot { width: 68px; height: 96px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }

.nn-total {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 110px;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--tbl-text);
}
.nn-total-label { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--tbl-text-muted); }
.nn-total-value { font-family: var(--font-display); font-weight: 800; font-size: 2.6rem; line-height: 1.05; color: var(--tbl-accent); }
.nn-total.warm .nn-total-value { color: #ffb35c; }
.nn-total.danger .nn-total-value { color: var(--danger); animation: nn-pulse 0.9s ease-in-out infinite; }
@keyframes nn-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
.nn-direction { font-size: 1rem; color: var(--tbl-text-mid); }
.nn-last { font-size: 0.68rem; color: var(--tbl-text-mid); text-align: center; max-width: 140px; }

/* Card captions in the hand ("+7", "hold", "bust") */
#hand-area .pcard-slot { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.nn-cap { font-size: 0.68rem; font-weight: 700; color: var(--tbl-text-mid); }
.nn-cap.bad { color: var(--danger); }
#hand-area .pcard-slot.nn-illegal .pcard { opacity: 0.45; }

/* Standings under the round summary */
.nn-standings { width: 100%; max-width: 480px; display: flex; flex-direction: column; gap: 4px; }
.nn-standing {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 12px; border-radius: 8px;
  background: var(--tbl-panel-bg); border: 1px solid var(--tbl-panel-border);
  font-size: 0.85rem; font-weight: 600;
}
.nn-standing.out { opacity: 0.5; }

@media (max-width: 480px) {
  .pile-slot { width: 56px; height: 80px; }
  .nn-total { min-width: 92px; padding: 8px 10px; }
  .nn-total-value { font-size: 2.1rem; }
  #table-center { gap: 16px; }
}