/* Independent card stock and print. Only the material/gesture shell is shared. */
.pc-card { --pc-u:calc(100cqw / 252); aspect-ratio:63/88; border-radius:1.98413% / 1.42045%; color:#202222; }
.pc-card .pc-print { background:#bfc2bc; box-shadow:0 1px 1px #000c,0 5px 9px #0006,inset 0 0 0 1px #ededdf; }
.pc-card .pc-stock { position:absolute; z-index:1; inset:calc(8 * var(--pc-u)); display:block; background:radial-gradient(#252e2510 .5px,transparent .5px),linear-gradient(118deg,#e2e4d8,#c6c9bd 48%,#e9e9de); background-size:3px 3px,100% 100%; }
.pc-card .pc-portrait { margin:0; }
.pc-card .pc-photo { position:absolute; z-index:3; display:block; overflow:hidden; background:#252727; }
.pc-card .pc-photo img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:none; }
.pc-card .pc-photo::after { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at var(--hc-px) var(--hc-py),#ffffff40,#fff0 65%); opacity:calc(.025 + var(--hc-light) * .10); }
.pc-card .pc-name { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; min-width:0; overflow:hidden; overflow-wrap:anywhere; letter-spacing:-.04em; }
.pc-card .pc-subtitle { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; line-clamp:1; overflow:hidden; overflow-wrap:anywhere; }
.pc-card .pc-license { display:block; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font:800 calc(9 * var(--pc-u))/1.25 var(--sans); letter-spacing:.07em; }
.pc-card .pc-emblem-bed { position:absolute; display:grid; place-items:center; box-sizing:border-box; }
.pc-card .pc-emblem { display:block; width:100%; height:100%; object-fit:contain; filter:none; }
.pc-card :is(.pc-caption,.pc-domain) { position:absolute; z-index:7; display:block; width:calc(104 * var(--pc-u)); margin:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font:500 calc(9.5 * var(--pc-u))/1.1 var(--mono); letter-spacing:-.015em; }
.pc-card .pc-keylines { position:absolute; inset:0; z-index:8; display:block; width:100%; height:100%; pointer-events:none; stroke:#252b27; stroke-width:.65; }
.pc-card .pc-engraving { position:absolute; inset:0; z-index:2; display:block; width:100%; height:100%; pointer-events:none; stroke:#344139; stroke-width:.35; opacity:.12; }
.pc-card :is(.hc-foil,.hc-specular) { z-index:5; border-radius:inherit; mask-image:none; clip-path:polygon(evenodd,0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,5.5556% 18.1818%,5.5556% 81.8182%,94.4444% 81.8182%,94.4444% 18.1818%,5.5556% 18.1818%); }
.pc-card .hc-rim { z-index:0; border-radius:inherit; background:linear-gradient(calc(115deg + var(--hc-spectrum)),#e2e6df,#737a78 22%,#d9ddd5 37%,#b9beb5 54%,#e8e6d8 75%,#939c99); box-shadow:inset 0 0 0 1px #f1eee08c,inset 0 0 0 calc(5 * var(--pc-u)) #ffffff10; }
.pc-card [hidden] { display:none!important; }

/* The physical cover shares the front's dimensions. Its 3D orientation is
   controlled by the material shell; these layers only supply printed stock. */
.pc-card .pc-back { position:absolute; inset:0; display:block; overflow:hidden; border-radius:inherit; isolation:isolate; background:#ffe576; box-shadow:0 1px 1px #000c,0 5px 9px #0006,inset 0 0 0 1px #ffed9c; pointer-events:none; }
.pc-card .pc-cover { display:block; width:100%; height:100%; border-radius:inherit; }
.pc-card :is(.pc-back-foil,.pc-back-specular) { position:absolute; inset:0; display:block; border-radius:inherit; pointer-events:none; }
.pc-card .pc-back-foil { opacity:calc(.035 + var(--hc-light) * .22); mix-blend-mode:soft-light; background:repeating-linear-gradient(108deg,#fff0 0px,#edfffa44 .5px,#fff0 1px,#fff0 4px),linear-gradient(calc(120deg + var(--hc-spectrum)),#f5df9d,#9ec6dd 25%,#ead9e7 43%,#f5edbb 60%,#b9d6ce 78%,#ead4c2); background-size:100% 100%,260% 220%; background-position:center,var(--hc-bx) var(--hc-by); }
.pc-card .pc-back-specular { opacity:calc(.025 + var(--hc-light) * .27); mix-blend-mode:screen; background:radial-gradient(ellipse 50% 37% at var(--hc-px) var(--hc-py),#fff8ddc0,#fff0 72%),linear-gradient(112deg,#fff0 32%,#dff9ff00 38%,#ffffff65 41%,#e2fff900 45%,#fff0 52%); background-size:100% 100%,230% 180%; background-position:center,var(--hc-bx) var(--hc-by); }

/* One continuous plate: title, square image and register share x14 / w224. */
.pc-trainer .pc-stock { clip-path:polygon(0 0,calc(100% - 10 * var(--pc-u)) 0,100% calc(10 * var(--pc-u)),100% 100%,0 100%); }
.pc-trainer .pc-t-header { position:absolute; z-index:7; isolation:isolate; left:calc(14 * var(--pc-u)); top:calc(12 * var(--pc-u)); width:calc(224 * var(--pc-u)); height:calc(52 * var(--pc-u)); box-sizing:border-box; padding:calc(5 * var(--pc-u)) calc(6 * var(--pc-u)); }
.pc-trainer .pc-t-header::before { content:''; position:absolute; z-index:-1; left:0; right:0; top:0; height:calc(19 * var(--pc-u)); border-bottom:1px solid #58615c; background:linear-gradient(158deg,#f0f0e5,#aeb7b0 40%,#e8e9da 48%,#bbc4bd); clip-path:polygon(0 0,95% 0,100% 100%,0 100%); }
.pc-trainer .pc-license { width:calc(178 * var(--pc-u)); }
.pc-trainer .pc-name { width:calc(174 * var(--pc-u)); height:calc(34 * var(--pc-u)); margin-top:calc(1.5 * var(--pc-u)); font:850 calc(28 * var(--pc-u))/1.05 var(--sans); }
.pc-trainer.pc-long-name .pc-name { font-size:calc(15 * var(--pc-u)); letter-spacing:-.025em; }
.pc-trainer.pc-very-long-name .pc-name { font-size:calc(13 * var(--pc-u)); }
/* The insignia is printed within the name band, clear of the y31 divider. */
.pc-trainer .pc-emblem-bed { right:calc(6 * var(--pc-u)); top:calc(23 * var(--pc-u)); width:calc(30 * var(--pc-u)); height:calc(24 * var(--pc-u)); padding:calc(3 * var(--pc-u)) calc(1 * var(--pc-u)); }
.pc-trainer .pc-photo { left:calc(14 * var(--pc-u)); top:calc(64 * var(--pc-u)); width:calc(224 * var(--pc-u)); height:calc(224 * var(--pc-u)); }
.pc-trainer .pc-t-register { position:absolute; z-index:7; left:calc(14 * var(--pc-u)); top:calc(288 * var(--pc-u)); width:calc(224 * var(--pc-u)); height:calc(50 * var(--pc-u)); }
.pc-trainer .pc-subtitle { margin:calc(7 * var(--pc-u)) calc(6 * var(--pc-u)) 0; max-height:1.25em; color:#262c29; font:italic 500 calc(14 * var(--pc-u))/1.25 var(--serif); }
.pc-trainer .pc-caption { left:calc(20 * var(--pc-u)); top:calc(323 * var(--pc-u)); }
.pc-trainer .pc-domain { right:calc(6 * var(--pc-u)); top:calc(35 * var(--pc-u)); text-align:right; }
.pc-trainer .hc-specular { opacity:calc(.10 + var(--hc-light) * .30); }

/* Narrow upper imprint, wider photograph, then a heavy die-cut Scarlet plate. */
.pc-vmax { color:#f4f0df; }
.pc-vmax .pc-print { background:#111416; box-shadow:0 1px 1px #000,0 5px 10px #0008,inset 0 0 0 1px #c7cece; }
.pc-vmax .pc-stock { background:linear-gradient(145deg,#171d20,#292e31 55%,#141719); }
.pc-vmax .pc-v-license { position:absolute; z-index:7; left:calc(8 * var(--pc-u)); top:calc(8 * var(--pc-u)); width:calc(236 * var(--pc-u)); height:calc(28 * var(--pc-u)); box-sizing:border-box; padding:calc(9 * var(--pc-u)) calc(7 * var(--pc-u)); background:#171c1f; }
.pc-vmax .pc-license { width:calc(176 * var(--pc-u)); font-size:calc(9.2 * var(--pc-u)); }
/* A silver print bed preserves the black / Scarlet mark. Its right edge
   stays inside the clipped stock corner and its bottom above the y36 seam. */
.pc-vmax .pc-emblem-bed { right:calc(17 * var(--pc-u)); top:calc(5 * var(--pc-u)); width:calc(26 * var(--pc-u)); height:calc(19 * var(--pc-u)); padding:calc(3 * var(--pc-u)) calc(2 * var(--pc-u)); background:linear-gradient(135deg,#f4f2e4,#bec8c3 51%,#e7ebe1); box-shadow:inset 0 0 0 calc(.6 * var(--pc-u)) #edf2eaa6; clip-path:polygon(calc(3 * var(--pc-u)) 0,100% 0,100% calc(100% - 3 * var(--pc-u)),calc(100% - 3 * var(--pc-u)) 100%,0 100%,0 calc(3 * var(--pc-u))); }
.pc-vmax .pc-v-photo-frame { position:absolute; z-index:2; left:calc(8 * var(--pc-u)); top:calc(36 * var(--pc-u)); width:calc(236 * var(--pc-u)); height:calc(248 * var(--pc-u)); background:linear-gradient(120deg,#e8efeb,#747b81 35%,#c8d1cf 53%,#f0eee1 80%,#87969a); clip-path:polygon(0 0,94% 0,100% 6%,100% 100%,5% 100%,0 95%); }
.pc-vmax .pc-photo { left:calc(10 * var(--pc-u)); top:calc(40 * var(--pc-u)); width:calc(232 * var(--pc-u)); height:calc(232 * var(--pc-u)); }
.pc-vmax .pc-v-plaque { position:absolute; z-index:4; left:calc(8 * var(--pc-u)); top:calc(272 * var(--pc-u)); width:calc(236 * var(--pc-u)); height:calc(60 * var(--pc-u)); box-sizing:border-box; display:grid; grid-template-rows:minmax(0,1fr) auto; padding:calc(2 * var(--pc-u)) calc(11 * var(--pc-u)) calc(3 * var(--pc-u)); background:linear-gradient(108deg,#d10a22,#b4071b 55%,#ed142c); clip-path:polygon(5% 0,100% 0,100% 84%,96% 100%,0 100%,0 19%); }
.pc-vmax .pc-name { z-index:7; align-self:center; max-height:100%; font:italic 900 calc(35 * var(--pc-u))/1.12 var(--sans); color:#fff9e9; text-shadow:calc(1 * var(--pc-u)) calc(1 * var(--pc-u)) #650313; }
.pc-vmax.pc-long-name .pc-name { font-size:calc(17 * var(--pc-u)); line-height:1.05; }
.pc-vmax.pc-very-long-name .pc-name { font-size:calc(14 * var(--pc-u)); }
.pc-vmax .pc-subtitle { z-index:7; max-height:1.15em; font:500 calc(13 * var(--pc-u))/1.15 var(--sans); color:#fff7e7; }
.pc-vmax .pc-caption { left:calc(16 * var(--pc-u)); top:calc(334 * var(--pc-u)); font-size:calc(8.3 * var(--pc-u)); }
.pc-vmax .pc-domain { right:calc(16 * var(--pc-u)); top:calc(334 * var(--pc-u)); text-align:right; font-size:calc(8.3 * var(--pc-u)); }
.pc-vmax .pc-keylines { stroke:#d0d6d0; stroke-width:.6; }
.pc-vmax .pc-engraving { z-index:6; stroke:#f0afbc; opacity:.20; }
.pc-vmax :is(.hc-foil,.hc-specular) { clip-path:polygon(evenodd,0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,3.9683% 11.3636%,3.9683% 77.2727%,96.0317% 77.2727%,96.0317% 11.3636%,3.9683% 11.3636%); }
.pc-vmax .hc-foil { mix-blend-mode:soft-light; opacity:calc(.24 + var(--hc-light) * .28); }
.pc-vmax .hc-specular { opacity:calc(.12 + var(--hc-light) * .38); }
.pc-vmax .hc-rim { background:linear-gradient(calc(145deg + var(--hc-spectrum)),#e2e7e2,#636b71 20%,#c8d2cc 40%,#e7e5d9 60%,#858e94 82%,#dbe1d9); }

@media(prefers-reduced-motion:reduce) {
  .pc-card .pc-photo::after { opacity:.025; }
  .pc-card .hc-foil { opacity:.18; }
  .pc-card .hc-specular { opacity:.08; }
  .pc-card .pc-back-foil { opacity:.035; }
  .pc-card .pc-back-specular { opacity:.025; }
}
