/* Push — push-your-luck card game styles. */

.game-head { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.head-btns { display: flex; gap: 6px; }

.ph-scoreboard { padding: var(--space-3) var(--space-4); margin-bottom: var(--space-3); }

.ph-deck {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 8px; margin-bottom: var(--space-3);
}
.ph-card {
  width: 46px; height: 62px;
  border-radius: 8px;
  display: grid; place-items: center;
  font: 700 0.95rem/1 var(--font);
  border: 1px solid var(--border);
  background: var(--bg-elev-2);
  color: var(--text);
  flex: 0 0 auto;
  padding: 0;
  cursor: default;
  -webkit-tap-highlight-color: transparent;
}
.ph-card .ph-card-face { pointer-events: none; }

.ph-card.back { color: var(--text-faint); opacity: 0.55; }
.ph-card.current {
  cursor: pointer;
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  background: color-mix(in srgb, var(--accent) 14%, var(--bg-elev-2));
  color: var(--accent-text);
  font-size: 1.1rem;
  animation: pulseGlow 1.5s ease-in-out infinite;
}
.ph-card.current:hover { filter: brightness(1.08); }
.ph-card.current:active { transform: scale(0.96); }

.ph-card.revealed.value {
  border-color: color-mix(in srgb, var(--good) 45%, transparent);
  background: color-mix(in srgb, var(--good) 14%, var(--bg-elev-2));
  color: var(--good);
  font-size: 0.85rem;
}
.ph-card.revealed.skull {
  border-color: color-mix(in srgb, var(--bad) 50%, transparent);
  background: color-mix(in srgb, var(--bad) 14%, var(--bg-elev-2));
  font-size: 1.3rem;
}

.ph-marker { font-size: 1rem; flex: 0 0 auto; }

@keyframes phFlipIn {
  0% { transform: rotateY(90deg) scale(0.85); opacity: 0.4; }
  100% { transform: rotateY(0deg) scale(1); opacity: 1; }
}
.ph-flip-in { animation: phFlipIn 200ms var(--ease); }

@keyframes phShake {
  10%, 90% { transform: translateX(-1px); }
  20%, 80% { transform: translateX(2px); }
  30%, 50%, 70% { transform: translateX(-4px); }
  40%, 60% { transform: translateX(4px); }
}
.ph-card.ph-shake { animation: phShake 320ms var(--ease); }

.ph-controls { margin: var(--space-3) 0; }
.ph-bank { font-size: 1.05rem; }

.endgame { margin-top: var(--space-4); }
.end-emoji { font-size: 3rem; }
.ph-reveal-stats { margin: var(--space-3) 0; }

/* ---- Greed profile bar (stats modal) ---- */
.ph-greed-wrap { margin-top: var(--space-4); }
.ph-greed-head {
  display: flex; justify-content: space-between;
  font-size: 0.78rem; font-weight: 700; color: var(--text-dim);
  text-transform: uppercase; letter-spacing: 0.06em;
  margin-bottom: 8px;
}
.ph-greed-bar {
  position: relative; height: 10px; border-radius: 5px;
  background: linear-gradient(90deg, #38bdf8, var(--surface) 50%, var(--bad));
}
.ph-greed-marker {
  position: absolute; top: 50%; width: 16px; height: 16px;
  border-radius: 50%; background: var(--text);
  border: 2px solid var(--bg-elev);
  transform: translate(-50%, -50%);
  box-shadow: var(--shadow);
}

@media (max-width: 420px) {
  .ph-card { width: 40px; height: 54px; font-size: 0.85rem; }
  .ph-card.revealed.value { font-size: 0.75rem; }
}