/* CARTÕES (scene 'card') — the player-card layout with a flat referee's card; no glow, glint, rings or loops */
.scene-card { --cd-yellow: #FFD200; --cd-red: #E3202C; }
.scene-card .cd-layer { overflow: hidden; }

/* text column: card(s) · name · number, centred like the X1 INICIAL cards */
.scene-card .cd-col { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.scene-card .cd-mk { display: flex; justify-content: center; margin-bottom: 46px; }
/* the referee's card: a plain flat card, small radius like the real thing */
.scene-card .cd-card { flex: none; width: 112px; height: 157px; border-radius: 8px; }
.scene-card .cd-yellow { background: var(--cd-yellow); }
.scene-card .cd-red { background: var(--cd-red); }
.scene-card .cd-mk.two .cd-card + .cd-card { margin-left: 22px; }

/* name / number rising from masks; line box 1.24em keeps accents inside, visual pitch 1em */
.scene-card .cd-mask { overflow: hidden; flex: none; line-height: 1.24; margin: -.12em 0; }
.scene-card .cd-mask > div { white-space: nowrap; color: #fff; }
.scene-card .cd-name { letter-spacing: .005em; }
.scene-card .cd-nmask { line-height: 1; margin: .04em 0 -.08em; }
.scene-card .cd-nmask.solo { margin-top: 0; }
.scene-card .cd-num { letter-spacing: -.01em; }

/* photo region of the card (box x 880–1920): soft left edge ∩ (x ≥ 1100 ∪ y ≥ 600) — hides the card's own lettering */
.scene-card .cd-photo { will-change: transform, opacity;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 130px), linear-gradient(90deg, transparent 220px, #000 330px), linear-gradient(180deg, transparent 545px, #000 650px);
  -webkit-mask-composite: source-in, source-over, source-over;
  mask-image: linear-gradient(90deg, transparent 0, #000 130px), linear-gradient(90deg, transparent 220px, #000 330px), linear-gradient(180deg, transparent 545px, #000 650px);
  mask-composite: intersect, add, add; }
.scene-card .cd-bigcrest { object-fit: contain; }

/* fundo próprio deste ecrã (⚙ PREPARAR JOGO → ECRÃS): aparece inteiro, sem escurecer */
#bg.has-ecra[data-ecra="card"] .bg-img { opacity: 1; }