/* MMD CARD — composant unique. Taille : --w (largeur). Tout le reste en découle. */
.mc{--w:250px;--u:calc(var(--w)/250);--px:50%;--py:50%;--rx:0deg;--ry:0deg;--pip:#fff;--g:255,255,255;
 position:relative;box-sizing:border-box;flex:none;width:var(--w);height:calc(394*var(--u));border-radius:calc(20*var(--u));
 background:linear-gradient(140deg,rgba(var(--g),.55),rgba(var(--g),.2) 45%,rgba(var(--g),.42));
 box-shadow:inset 0 0 0 max(1px,calc(1*var(--u))) rgba(255,255,255,.42),inset 0 1px 0 rgba(255,255,255,.75),inset 0 calc(-3*var(--u)) calc(8*var(--u)) rgba(0,0,0,.35),0 calc(18*var(--u)) calc(28*var(--u)) calc(-14*var(--u)) rgba(0,0,0,.9);
 font-family:'Inter',sans-serif}
.mc.r-commune{--pip:#cdf2e1;--g:140,220,185}
.mc.r-peu_commune{--pip:#b7d1f2;--g:130,175,240}
.mc.r-rare{--pip:#cfb7f1;--g:175,135,240}
.mc.r-ultra_rare{--pip:#f294bb;--g:240,120,170}
.mc.r-legendaire{--pip:#f6dc8f;--g:245,190,85}
.mc.r-exclusive{--pip:#efe0ff;background:conic-gradient(from 210deg at 50% 50%,rgba(255,106,130,.78),rgba(255,209,102,.72),rgba(123,216,143,.72),rgba(106,169,255,.78),rgba(197,139,255,.82),rgba(255,106,130,.78))}
.mc .poster{position:absolute;left:calc(19*var(--u));top:calc(18*var(--u));width:calc(212*var(--u));height:calc(318*var(--u));border-radius:calc(8*var(--u));overflow:hidden;background:#15131a;box-shadow:0 0 0 1px rgba(0,0,0,.65),inset 0 0 0 1px rgba(255,255,255,.08)}
.mc .poster img{width:100%;height:100%;object-fit:cover;display:block}
.mc .plate{position:absolute;left:calc(19*var(--u));top:calc(344*var(--u));width:calc(212*var(--u));height:calc(32*var(--u));border-radius:calc(8*var(--u));display:grid;grid-template-columns:calc(46*var(--u)) 1fr 1fr;color:var(--pip);background:linear-gradient(rgba(6,6,10,.62),rgba(6,6,10,.4));box-shadow:0 0 0 1px rgba(0,0,0,.55),inset 0 1px 3px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.28)}
.mc .plate{overflow:hidden}
.mc .plate>div{min-width:0;white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:calc(6*var(--u));height:100%}
.mc .plate>div+div{border-left:1px solid rgba(255,255,255,.16)}
.mc .plate svg{width:calc(23*var(--u));height:calc(23*var(--u));stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mc .plate i{font-size:calc(8.5*var(--u));font-weight:700;letter-spacing:.14em;color:inherit;opacity:.72;font-style:normal}
.mc .plate b{font-family:'Space Grotesk',sans-serif;font-size:calc(14*var(--u));font-weight:700;color:inherit;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.55)}
/* holo exclusive */
.mc.r-exclusive .poster::after{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle at var(--px) var(--py),rgba(255,255,255,.5),rgba(255,255,255,0) 50%),linear-gradient(115deg,rgba(255,0,150,0) 10%,rgba(255,0,150,.85) 28%,rgba(255,230,0,.85) 38%,rgba(0,255,200,.85) 48%,rgba(0,140,255,.85) 58%,rgba(160,0,255,.8) 68%,rgba(160,0,255,0) 86%);background-size:100% 100%,300% 300%;background-position:0 0,var(--px) var(--py);mix-blend-mode:screen;filter:brightness(.85) contrast(1.35) saturate(1.1);opacity:.4;transition:opacity .25s}
.mc.r-exclusive.drag .poster::after{opacity:.85}
/* inclinaison au glisser (uniquement si .tiltable) */
.mc.tiltable{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .4s ease;will-change:transform}
.mc.tiltable.drag{cursor:grabbing;transition:transform .06s linear}
/* dos de carte (identique pour toutes les raretés : ne révèle rien) */
.mcb{--w:250px;--u:calc(var(--w)/250);position:relative;box-sizing:border-box;flex:none;width:var(--w);height:calc(394*var(--u));border-radius:calc(20*var(--u));border:1px solid rgba(255,255,255,.22);background:linear-gradient(155deg,#2a2a31 0%,#0e0e12 46%,#1d1d23 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 calc(18*var(--u)) calc(28*var(--u)) calc(-14*var(--u)) rgba(0,0,0,.9);overflow:hidden}
.mcb:before{content:'';position:absolute;inset:calc(12*var(--u));border-radius:calc(11*var(--u));border:1px solid rgba(224,36,60,.55);background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 2px,transparent 2px 9px),radial-gradient(circle at 50% 50%,rgba(224,36,60,.30),rgba(0,0,0,0) 62%)}
.mcb:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.10) 42%,rgba(255,255,255,0) 54%)}
.mcb svg{position:absolute;left:50%;top:46%;width:calc(150*var(--u));height:calc(150*var(--u));margin:calc(-75*var(--u)) 0 0 calc(-75*var(--u));stroke:#e0243c;fill:none;stroke-width:2.2;z-index:1}
.mcb b{position:absolute;left:0;right:0;bottom:calc(34*var(--u));text-align:center;z-index:1;font:700 max(6px,calc(12*var(--u))) 'Space Mono',monospace;letter-spacing:.34em;color:rgba(255,255,255,.7)}

/* petite taille (plateau, listes) : plus de texte, juste la barre teintée */
.mc.xs .plate{background:rgba(var(--g),.55);box-shadow:0 0 0 1px rgba(0,0,0,.45)}
.mc.xs .plate>div{display:none}
.mc.xs .poster{border-radius:calc(10*var(--u))}
/* dos de carte image (si shared/back.png existe) */
html.mcb-img .mcb{background:var(--back-img) center/cover no-repeat,#0b090d}
html.mcb-img .mcb:before,html.mcb-img .mcb:after,html.mcb-img .mcb svg,html.mcb-img .mcb b{display:none}

/* fragment de Gold Ticket : le poster est une tranche (5 x 2) du grand ticket dore */
.mc.r-fragment{--pip:#ffe49a;--g:240,196,88}
.mc .poster.fr{background:url(ticket.webp) no-repeat,#d9a43a url(ticket.svg) no-repeat;background-size:500% 200%}
