/* The prize money on a small metal card lying straight, as an American
   Express is: the ProEliteClubs cube struck into the metal in its ink and the
   sum beside it on one centred row, so no corner stands empty (Johny, through
   Sergio, 29 September 2026). The Elite Cup record's first three hold gold,
   silver and bronze, as they stand on the home page's podium; every other
   player holds the floodlights' blue (Sergio, 29 September 2026). The home
   page's podium and the player's profile both draw it. */
.prize-card {
  --metal-hi: #f7e39c;
  --metal: #d9b552;
  --metal-lo: #a8822a;
  --ink: #3b2a06;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7%;
  aspect-ratio: 1.586;
  border-radius: 5px;
  color: var(--ink);
  background:
    repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px 3px),
    linear-gradient(135deg, var(--metal-hi) 0%, var(--metal) 48%, var(--metal-lo) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.45),
    0 4px 10px rgba(0, 0, 0, 0.35);
}

.prize-card--2 {
  --metal-hi: #f4f6fa;
  --metal: #c3ccd8;
  --metal-lo: #8e99a8;
  --ink: #1c2533;
}

.prize-card--3 {
  --metal-hi: #f2c9a3;
  --metal: #c98a55;
  --metal-lo: #8f5429;
  --ink: #3d1d08;
}

/* Below the three: the floodlights' blue, a card of the same make that
   claims no medal. */
.prize-card--plain {
  --metal-hi: #c9d7ff;
  --metal: #7d9bf0;
  --metal-lo: #3c5cc8;
  --ink: #0b1d6b;
}

/* The ProEliteClubs cube (img/pec-mark.png, the logo's letters) struck into
   the metal in the card's ink, before the sum as the centurion leads an Amex. */
.prize-card__mark {
  flex: none;
  height: 46%;
  aspect-ratio: 84 / 96;
  background: var(--ink);
  -webkit-mask: url(/img/pec-mark.png) center / contain no-repeat;
  mask: url(/img/pec-mark.png) center / contain no-repeat;
  opacity: 0.6;
}

.prize-card__value {
  font-size: 0.875rem;
  line-height: 1;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
}

/* Under the pointer a sheen crosses the metal. */
.prize-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.55) 50%, transparent 65%);
  transform: translateX(-110%);
}

@media (prefers-reduced-motion: no-preference) {
  .prize-card:hover::after {
    transform: translateX(110%);
    transition: transform 600ms var(--ease-out);
  }
}