/* ════════════════════════════════════════════════════════════════════
   COPSkin · LA MINI TARJETA Y LA SKIN SUELTA, FUERA DE LOS RANKINGS
   (09/10/2026). La de las filas de ranking vive en cop-tarjeta-ranking.css
   con el mismo dibujo; ésta es la de cualquier otro lugar.
   Tamaño: `--mini-w` (el alto sale solo: 54 × 68).
   ════════════════════════════════════════════════════════════════════ */
/* 16/10/2026 · doble clase: `.rk-mini` (cop-tarjeta-ranking.css, que varias
   páginas cargan DESPUÉS) le borraba el fondo y el borde. */
.cop-mini{--mini-w:54px}
.cop-mini.cop-mini{
  position:relative;display:block;flex:0 0 auto;overflow:hidden;
  width:var(--mini-w);aspect-ratio:54/68;border-radius:calc(var(--mini-w) * .17);
  background:radial-gradient(120% 90% at 50% 0%, rgba(var(--mc-rgb,12,149,235),.38), rgba(var(--mc-rgb,12,149,235),.08) 60%, transparent 100%), #0a1328;
  box-shadow:0 0 0 calc(var(--mini-w) * .03 + 1px) rgba(var(--mc-rgb,12,149,235),.95),
             0 0 calc(var(--mini-w) * .22) rgba(var(--mc-rgb,12,149,235),.25), 0 6px 14px rgba(0,0,0,.5);
}
.cop-mini .mc-skin{ position:absolute;left:0;bottom:0;width:100%;height:100%;object-fit:contain;object-position:50% 100% }
.cop-mini[data-sk="camiseta"] .mc-skin{ inset:6% 4% 2%;width:92%;height:92%;object-position:50% 50% }
.cop-mini::after{ content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.16) 50%,transparent 60%) }

/* la skin suelta sin borde (va grande: duelo, presentación, perfil) */
.cop-sk{ display:block;max-width:100%;height:auto;object-fit:contain }

/* la skin de un usuario donde antes iba su camiseta sorteada (`COPKit.deUsuario`):
   con el borde de SU mini tarjeta, para que en toda la app se vea igual */
img.cop-sk-mini{ box-sizing:border-box;object-fit:contain;object-position:50% 100%;border-radius:22%;
  background:radial-gradient(120% 90% at 50% 0%, rgba(var(--mc-rgb,12,149,235),.38), rgba(var(--mc-rgb,12,149,235),.08) 60%, transparent 100%), #0a1328;
  box-shadow:0 0 0 1.5px rgba(var(--mc-rgb,12,149,235),.95), 0 0 10px rgba(var(--mc-rgb,12,149,235),.22) }
img.cop-sk-mini[data-sk="camiseta"]{ object-position:50% 50%;padding:6% }

/* ══ T4 (17/10/2026) · SIN EL ARO CELESTE GRUESO ═════════════════════
   Franco: sacar el borde celeste grueso alrededor de las skins en toda la
   app. El aro (y el tinte del fondo) quedan SÓLO para un borde comprado
   (`data-borde`, que pone cop-skin.js): el de arranque va limpio, con el
   fondo oscuro neutro. Selectores dobles: ganan a cop-tarjeta-ranking.css
   y a cop-presentacion-picks.css aunque se carguen después. */
.cop-mini.cop-mini:not([data-borde]),
.rk-card.rk-card .rk-mini--carta:not([data-borde]),
.cpa-mini.cpa-mini .rk-mini--carta:not([data-borde]),
img.cop-sk-mini.cop-sk-mini:not([data-borde]){
  background:radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,.10), rgba(255,255,255,.03) 60%, transparent 100%), #0d1220;
  box-shadow:0 6px 14px rgba(0,0,0,.45) }
/* el borde comprado: fino, del color de su rareza */
.cop-mini.cop-mini[data-borde], .rk-card.rk-card .rk-mini--carta[data-borde],
.cpa-mini.cpa-mini .rk-mini--carta[data-borde], img.cop-sk-mini.cop-sk-mini[data-borde]{
  box-shadow:0 0 0 1px rgba(var(--mc-rgb,12,149,235),.9), 0 0 10px rgba(var(--mc-rgb,12,149,235),.22), 0 6px 14px rgba(0,0,0,.45) }

/* ══ T6 (18/10/2026) · EN LOS RANKINGS VA SÓLO LA SKIN ════════════════
   Franco: «Las tarjetas de los rankings en los grupos de amigos, en equipos
   competitivos etc no tienen que tener borde celeste (…) van solo las
   skins». En toda fila de ranking la mini tarjeta pierde la caja: sin
   fondo, sin aro (aunque haya borde comprado), sin brillo. Queda la skin
   apoyada sobre la fila. Fuera de los rankings la mini tarjeta no cambia. */
.rk-card.rk-card .rk-mini--carta.rk-mini--carta.rk-mini--carta,
.rk-card.rk-card img.cop-sk-mini.cop-sk-mini.cop-sk-mini{
  background:none; box-shadow:none; border-radius:0; overflow:visible }
.rk-card.rk-card .rk-mini--carta.rk-mini--carta::after{ content:none }
.rk-card.rk-card .rk-mini--carta .mc-skin{ filter:drop-shadow(0 6px 10px rgba(0,0,0,.45)) }
