/* =========================================================================
   Oyuncu kartı (FIFA tarzı) — Karargâh, admin paneli ve Operatörler sayfası
   ========================================================================= */
:root {
  --t-bronz: #a88a5c; --t-gumus: #cfccc0; --t-altin: #d9c08a; --t-elit: #f0d999;
  --ok: #b9cf8f; --bad: #e8a46a;
}
.ovr { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 32px; padding: 0 6px; font-family: var(--f-disp); font-weight: 900; font-size: 20px; color: var(--bg); background: var(--t-bronz); clip-path: polygon(12% 0, 88% 0, 100% 50%, 88% 100%, 12% 100%, 0 50%); }
.ovr.t-gumus { background: var(--t-gumus); } .ovr.t-altin { background: var(--t-altin); } .ovr.t-elit { background: #12130c; color: var(--t-elit); box-shadow: inset 0 0 0 2px var(--t-elit); }

/* ===================================================================== FIFA TARZI OYUNCU KARTI */
.pcard-wrap { display: flex; justify-content: center; perspective: 1100px; padding: 6px 0; }
.pcard {
  --rx: 0deg; --ry: 0deg; --mx: 50%; --my: 30%;
  --pc: #3a3322; --tx: var(--bone); --ac: var(--sand); --edge: #a88a5c;
  position: relative; font-size: 10px; width: 29em; height: 42em; color: var(--tx);
  transform: rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d;
  transition: transform .45s var(--ease); animation: pc-in .9s var(--ease) both;
  filter: drop-shadow(0 22px 30px rgba(0, 0, 0, .55));
}
.pcard.hover { transition: transform .08s linear; }
@keyframes pc-in { from { transform: rotateY(-100deg) translateZ(-60px); opacity: 0; } }
.pcard-wrap.small .pcard { font-size: 7px; }
.pcard, .pc-bg, .pc-foil, .pc-lines, .pc-shine { clip-path: polygon(13% 0, 87% 0, 100% 7%, 100% 90%, 86% 96%, 50% 100%, 14% 96%, 0 90%, 0 7%); }
.pcard { background: var(--edge); }
.pc-bg { position: absolute; inset: .35em; background: radial-gradient(120% 70% at 70% 15%, rgba(255, 255, 255, .14), transparent 60%), linear-gradient(165deg, var(--pc1, #6b5a3c), var(--pc2, #3a3322) 55%, var(--pc3, #241f15)); }
.pc-lines { position: absolute; inset: .35em; opacity: .16; background: repeating-linear-gradient(125deg, transparent 0 1.2em, rgba(255, 255, 255, .5) 1.2em 1.3em), radial-gradient(circle at 80% 80%, transparent 30%, rgba(0, 0, 0, .3)); mix-blend-mode: overlay; }
.pc-foil { position: absolute; inset: .35em; opacity: 0; background: linear-gradient(115deg, transparent 25%, rgba(255, 255, 255, .55) 42%, rgba(217, 192, 138, .3) 50%, transparent 62%); background-size: 260% 100%; mix-blend-mode: overlay; animation: pc-sweep 4.5s linear infinite; }
@keyframes pc-sweep { from { background-position: 130% 0; } to { background-position: -130% 0; } }
.pc-shine { position: absolute; inset: 0; opacity: 0; background: radial-gradient(circle at var(--mx) var(--my), rgba(255, 255, 255, .45), transparent 45%); mix-blend-mode: soft-light; transition: opacity .3s; pointer-events: none; }
.pcard.hover .pc-shine { opacity: 1; }
.pc-top { position: absolute; left: 11%; top: 9%; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: .4em; transform: translateZ(30px); }
.pc-ovr { display: flex; flex-direction: column; align-items: center; }
.pc-ovr b { font-family: var(--f-disp); font-weight: 900; font-size: 6.4em; line-height: .82; letter-spacing: -.02em; }
.pc-ovr span { font-family: var(--f-disp); font-weight: 800; font-size: 2em; letter-spacing: .08em; line-height: 1; }
.pc-logo { width: 3.4em; height: 3.4em; margin-top: .4em; border-radius: 50%; box-shadow: 0 0 0 .15em rgba(0, 0, 0, .35); }
.pc-tier { margin-top: .3em; font-family: var(--f-mono); font-size: .95em; letter-spacing: .25em; opacity: .8; }
.pc-ph { position: absolute; right: 6%; top: 5%; width: 62%; height: 48%; z-index: 2; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; -webkit-mask-image: linear-gradient(to bottom, #000 72%, transparent); mask-image: linear-gradient(to bottom, #000 72%, transparent); transform: translateZ(20px); }
.pc-ph svg { width: 85%; height: auto; opacity: .55; }
.pc-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.pc-ph.has-ph svg { display: none; }
.pc-name { position: absolute; left: 8%; right: 8%; top: 52.5%; z-index: 3; padding-bottom: .3em; border-bottom: .1em solid var(--ac); text-align: center; font-family: var(--f-disp); font-weight: 900; font-size: 3em; letter-spacing: .04em; line-height: 1.05; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transform: translateZ(25px); }
.pc-attrs { position: absolute; left: 12%; right: 12%; top: 61.8%; z-index: 3; display: flex; justify-content: center; gap: 1.4em; transform: translateZ(25px); }
.pc-col { display: flex; flex-direction: column; gap: .1em; }
.pc-at { display: flex; align-items: baseline; gap: .5em; }
.pc-at b { min-width: 1.6em; font-family: var(--f-disp); font-weight: 900; font-size: 2.2em; line-height: 1.05; text-align: right; }
.pc-at span { font-family: var(--f-disp); font-weight: 700; font-size: 1.75em; letter-spacing: .06em; opacity: .9; }
.pc-div { width: .1em; background: var(--ac); opacity: .6; }
.pc-foot { position: absolute; left: 0; right: 0; bottom: 4.2%; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: .45em; transform: translateZ(20px); }
.pc-b { display: flex; gap: .45em; min-height: 2.4em; }
.pc-b i { display: inline-flex; align-items: center; justify-content: center; width: 2.4em; height: 2.4em; clip-path: polygon(25% 4%, 75% 4%, 100% 50%, 75% 96%, 25% 96%, 0 50%); background: rgba(0, 0, 0, .35); color: var(--ac); }
.pc-b i .ic { width: 1.4em; height: 1.4em; }
.pc-st { font-family: var(--f-mono); font-size: .95em; letter-spacing: .2em; opacity: .85; }
/* seviyeler */
.pcard.t-bronz { --pc1: #7a6442; --pc2: #4a3d27; --pc3: #2a2318; --edge: #a88a5c; --tx: #f0e6cf; --ac: #c9a874; }
.pcard.t-gumus { --pc1: #eeebe1; --pc2: #b5b2a6; --pc3: #6f6d64; --edge: #e4e1d7; --tx: #15160f; --ac: #3a3b29; }
.pcard.t-altin { --pc1: #f6e5b4; --pc2: #d9c08a; --pc3: #8a6e38; --edge: #f2dea6; --tx: #15160f; --ac: #434731; }
.pcard.t-altin .pc-foil { opacity: .7; }
.pcard.t-elit { --pc1: #2a2c1d; --pc2: #15160f; --pc3: #0a0b06; --edge: #d9c08a; --tx: #f0d999; --ac: #d9c08a; }
.pcard.t-elit .pc-bg { background: radial-gradient(90% 55% at 70% 18%, rgba(217, 192, 138, .28), transparent 60%), conic-gradient(from 210deg at 50% 60%, #15160f, #2a2c1d, #15160f, #434731, #15160f); }
.pcard.t-elit .pc-foil { opacity: 1; background: linear-gradient(115deg, transparent 25%, rgba(240, 217, 153, .5) 40%, rgba(255, 255, 255, .5) 47%, rgba(217, 192, 138, .35) 54%, transparent 66%); background-size: 260% 100%; mix-blend-mode: screen; opacity: .55; }
.pcard.t-elit .pc-lines { opacity: .35; background: repeating-linear-gradient(125deg, transparent 0 1.2em, rgba(217, 192, 138, .45) 1.2em 1.28em); }
.pcard.t-elit .pc-b i { background: rgba(217, 192, 138, .14); }


@media (max-width: 640px) { .pcard { font-size: 9.4px; } }
@media (prefers-reduced-motion: reduce) { .pcard, .pc-foil { animation: none !important; } }
