/* Shared card face: the art is shown whole (the card ratio equals the image ratio, so nothing is cut off) with rounded
   corners. Sizes follow --u (= card width / 100), so the name plate scales with the card. */
.cardface { --u: 1px; position: relative; overflow: hidden; border-radius: calc(var(--u) * 4.5); background: #0d0f1e; }
.cardface img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* Name engraved on the empty plate at the bottom of the art. Position is in % of the card. */
.plate { position: absolute; display: flex; align-items: center; justify-content: center; white-space: nowrap;
         transform: translate(-50%, -50%); pointer-events: none;
         font-family: "Gowun Batang", "Batang", "AppleMyungjo", serif; font-weight: 700; color: #d9a441;
         font-size: calc(var(--u) * var(--fs, 7)); letter-spacing: .03em; line-height: 1;
         text-shadow: 0 -1px 0 rgba(0, 0, 0, .7), 0 1px 0 rgba(255, 224, 150, .25), 0 0 calc(var(--u) * 3) rgba(217, 164, 65, .45); }
.plate .ch { display: inline-block; }