/* Velyx Management — styles du module players (variables et classes du socle uniquement). */

/* Liste : personnages d'un compte. */
.pl-chars { display: grid; gap: 2px; font-size: 13px; }
.pl-chars small { font-size: 11.5px; }

/* Fiche : carte d'un personnage (photo d'identité + informations). */
.pl-char { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 18px; align-items: start; }
.pl-mug { width: 112px; aspect-ratio: 1; overflow: hidden; display: grid; place-items: center;
  background: var(--surface-2); border: 0; color: var(--faint); }
.pl-mug img { width: 100%; height: 100%; object-fit: cover; }
.pl-mug svg { width: 34px; height: 34px; }

/* Emploi : logo de l'entreprise + nom + grade. */
.pl-job { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pl-logo { width: 22px; height: 22px; overflow: hidden; display: inline-grid; place-items: center; background: var(--surface-3); flex: none; }
.pl-logo img { width: 100%; height: 100%; object-fit: cover; }
.pl-logo .kind-ic { width: 14px; height: 14px; }

@media (max-width: 720px) {
  .pl-char { grid-template-columns: 1fr; }
  .pl-mug { width: 96px; }
}

/* Liste : licence copiable (clic). */
.pl-license { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; margin-left: 8px; }
.pl-license svg { width: 11px; height: 11px; }
.pl-license:hover { color: var(--inv-ink); }

/* Tiroir d'aperçu. */
.pl-peek-head { display: flex; gap: 14px; align-items: center; }
.pl-peek-head .big-avatar { width: 64px; height: 64px; display: grid; place-items: center; overflow: hidden; flex: none; background: var(--inv-well); color: var(--inv-ink-3); }
.pl-peek-head .big-avatar img { width: 100%; height: 100%; object-fit: cover; }
.pl-peek-name { display: block; font-size: 17px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-copy { cursor: pointer; display: inline-flex; align-items: center; gap: 4px; overflow-wrap: anywhere; }
.pl-copy svg { width: 12px; height: 12px; opacity: .6; }
.pl-copy:hover svg { opacity: 1; }
.action-grid.compact { grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr)); }
.action-grid.compact .action-btn { padding: 6px; gap: 8px; }
.action-grid.compact .action-btn .ai { width: 30px; height: 30px; }
.action-grid.compact .action-btn b { font-size: 12px; }

/* Fiche : capacités et captures d'écran. */
.pl-abilities { padding: 6px 0 0; }
.pl-shots .ocard img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; background: var(--inv-well); }
.pl-shot-missing { aspect-ratio: 16 / 9; display: grid; place-items: center; background: var(--inv-well); color: var(--inv-ink-3); }
.pl-shot-missing svg { width: 28px; height: 28px; }