/* Fixed card-space geometry is shared by previews and proof capture. These
   nominal 300×420 / 420×300 canvases do not define a printer bleed profile. */
@font-face {
  font-family: "EveryMVP Card Inter";
  src: url("/fonts/inter-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
}

@font-face {
  font-family: "EveryMVP Card Inter";
  src: url("/fonts/inter-latin-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 100 900;
  font-display: block;
}

.emvp-card {
  position: relative;
  width: 300px;
  height: 420px;
  flex: none;
  overflow: hidden;
  background: var(--card-background);
  color: var(--card-text);
  font-family: "EveryMVP Card Inter", sans-serif;
  font-size: 10px;
  line-height: 1.5;
  text-align: left;
  isolation: isolate;
}

.emvp-card *, .emvp-card *::before, .emvp-card *::after { box-sizing: border-box; }
.emvp-card p, .emvp-card figure { margin: 0; }
.emvp-card img { display: block; max-width: none; }
.emvp-card__asset-preload { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.emvp-card__motif, .emvp-card__texture { position: absolute; mask-size: 100% 100%; mask-repeat: no-repeat; mask-position: center; -webkit-mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; pointer-events: none; }
.emvp-card__motif { left: 0; top: 75px; width: 330px; height: 220px; background: var(--card-motif-color); }
.emvp-card__photo { position: absolute; left: 23px; top: 81px; width: 254px; height: 208px; overflow: hidden; background: #1a1d22; }
.emvp-card__photo img { width: 100%; height: 100%; object-fit: cover; transform-origin: center; user-select: none; pointer-events: none; }
.emvp-card__border { position: absolute; }
.emvp-card__border--top, .emvp-card__border--bottom { left: 17px; width: 266px; height: 6px; background: linear-gradient(90deg, var(--card-frame-dark), var(--card-frame-light), var(--card-frame-dark)); }
.emvp-card__border--top { top: 75px; }
.emvp-card__border--bottom { top: 289px; }
.emvp-card__border--left, .emvp-card__border--right { top: 81px; width: 6px; height: 208px; background: linear-gradient(180deg, var(--card-frame-dark), var(--card-frame-light), var(--card-frame-dark)); }
.emvp-card__border--left { left: 17px; }
.emvp-card__border--right { left: 277px; }
.emvp-card__front-logo { position: absolute; left: 17px; top: 10px; width: 54px; height: 54px; }
.emvp-card__front-logo img, .emvp-card__placed-logo img { width: 100%; height: 100%; object-fit: contain; }
.emvp-card__fit { display: flex; align-items: center; overflow: hidden; }
.emvp-card__fit > span { display: block; flex: none; max-width: 100%; white-space: nowrap; line-height: 1; }
.emvp-card__team-name, .emvp-card__season { position: absolute; left: 81px; width: 196px; font-weight: 700; }
.emvp-card__team-name { top: 22px; height: 16px; letter-spacing: 0.06em; }
.emvp-card__season { top: 39px; height: 13px; letter-spacing: 0.14em; }
.emvp-card__identity { position: absolute; left: 23px; top: 306px; width: 254px; display: flex; flex-direction: column; align-items: flex-end; }
.emvp-card__identity .emvp-card__fit { width: 254px; justify-content: flex-end; text-align: right; }
.emvp-card__first-name { font-weight: 700; font-style: italic; letter-spacing: 0.08em; }
.emvp-card__last-name { margin-top: 4px; font-weight: 900; font-style: italic; letter-spacing: -0.01em; }
.emvp-card__position, .emvp-card__league { font-weight: 700; letter-spacing: 0.12em; }
.emvp-card__position, .emvp-card__position-space { margin-top: 5.5px; }
.emvp-card__position-space { width: 1px; height: 10px; }
.emvp-card__league { margin-top: 8px; }
.emvp-card--team_back, .emvp-card--player_back { background: var(--card-back-border); color: var(--card-back-ink); }
.emvp-card--player_back { width: 420px; height: 300px; }
.emvp-card__back-panel { position: absolute; inset: 12px; background: var(--card-back-background); }
.emvp-card__texture { inset: 12px; background: var(--card-back-tint); }
.emvp-card__placed-logo { position: absolute; }
.emvp-card__placed-logo--player img { object-position: left; }
.emvp-card__print-mark { position: absolute; left: 0; right: 0; bottom: 18px; display: flex; align-items: center; justify-content: center; z-index: 9; }
.emvp-card__print-mark span { display: block; padding: 3px 9px; border-radius: 999px; }
.emvp-card__print-mark img { height: 8px; width: auto; }
.emvp-card__back-content { position: absolute; inset: 12px; padding: 22px 26px; display: flex; gap: 24px; }
.emvp-card__back-identity { width: 148px; flex-shrink: 0; border-right: 1px solid color-mix(in srgb, var(--card-back-ink) 13.33%, transparent); padding-right: 20px; margin-bottom: 46px; box-sizing: content-box; }
.emvp-card__back-identity .emvp-card__fit { width: 148px; font-weight: 900; }
.emvp-card__back-identity .emvp-card__fit span { line-height: 1.04; }
.emvp-card__back-first-name { color: color-mix(in srgb, var(--card-back-ink) 80%, transparent); }
.emvp-card__back-position, .emvp-card__back-team { font-size: 9px; letter-spacing: 0.12em; color: color-mix(in srgb, var(--card-back-ink) 60%, transparent); overflow-wrap: anywhere; }
.emvp-card p.emvp-card__back-position { margin-top: 8px; }
.emvp-card p.emvp-card__back-team, .emvp-card p.emvp-card__back-league { margin-top: 2px; }
.emvp-card__back-league { font-size: 8.5px; letter-spacing: 0.1em; color: color-mix(in srgb, var(--card-back-ink) 44%, transparent); overflow-wrap: anywhere; }
.emvp-card__back-stats { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.emvp-card__stat { display: flex; justify-content: space-between; gap: 3px; border-bottom: 1px solid color-mix(in srgb, var(--card-back-ink) 13.33%, transparent); padding-bottom: 3px; font-size: 10px; }
.emvp-card__stat > span { color: color-mix(in srgb, var(--card-back-ink) 60%, transparent); }
.emvp-card__stat > strong { font-weight: 500; overflow-wrap: anywhere; text-align: right; }
.emvp-card__stat--empty { visibility: hidden; }
.emvp-card__stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 20px; }
.emvp-card__stat-grid--after-wide { margin-top: 6px; }
.emvp-card__bio-box { flex: 1; min-height: 0; margin-top: 14px; }
.emvp-card__bio { font-size: 9.5px; line-height: 1.5; color: color-mix(in srgb, var(--card-back-ink) 80%, transparent); overflow-wrap: anywhere; white-space: normal; }

/* Presentation only. Nothing below belongs inside the captured artwork. */
.emvp-card-stage { width: 100%; margin: 0; background: #0a0a0a; color: #fff; overflow: hidden; }
.emvp-card-stage__viewport { position: relative; min-height: 330px; height: 490px; width: 100%; isolation: isolate; }
.emvp-card-stage--compact .emvp-card-stage__viewport { min-height: 0; }
.emvp-card-stage__glow { position: absolute; inset: -8%; background: radial-gradient(circle at 50% 50%, #ffffffcc 0%, #ffffff66 26%, #ffffff22 46%, transparent 68%); filter: blur(28px); pointer-events: none; }
.emvp-card-stage__face { position: absolute; top: 24px; left: 50%; width: 300px; height: 420px; margin-left: -150px; box-shadow: 0 24px 60px #0009, 0 0 0 1px #ffffff24; transition: transform 140ms ease-out; }
.emvp-card-stage__face[hidden] { display: none; }
.emvp-card-stage__scale { width: max-content; transform-origin: top left; }
.emvp-card-stage__caption { position: relative; padding: 8px 20px; text-align: center; font-size: 13px; color: #b8b8b8; }
.emvp-card-stage__fit-error { display: block; padding-top: 8px; color: #fb7185; }
.emvp-card-stage__fit-error[hidden] { display: none; }
.emvp-card-stage__actions { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; padding: 12px 20px 24px; }
.emvp-card-stage__actions :is(button, a) { min-height: 44px; border: 1.5px solid #c084fc; border-radius: 999px; padding: 10px 18px; color: #c084fc; background: transparent; font: 600 14px/1.5 Inter, sans-serif; cursor: pointer; }
.emvp-card-stage__actions :is(button, a):focus-visible { outline: 2px solid #c084fc; outline-offset: 4px; }
.emvp-card-stage__actions :is(button, a):hover { background: #1c1233; }
@media (prefers-reduced-motion: reduce) { .emvp-card-stage__face { transition: none; transform: none !important; } }
@media print { .emvp-card-stage__actions, .emvp-card-stage__caption, .emvp-card-stage__glow { display: none; } }
