.pick-card {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--pp-black);
  cursor: pointer;
  transform-style: preserve-3d;
}
.pick-card:focus-visible { outline: 3px solid var(--pp-blue); outline-offset: 4px; }
.pick-card__front {
  position: absolute;
  inset: 0;
  display: grid;
  gap: 8px;
  padding: 10px;
  overflow: hidden;
  border: 3px solid var(--pp-black);
  background: var(--pp-paper);
  box-shadow: 6px 6px 0 rgba(23, 20, 15, 0.85);
  font-family: var(--pp-text);
  text-align: left;
}
/* Sorts : titre / art / corps / niveau / action. Objets : rareté+niveau en
   tête / titre / art / corps / action. Même hauteur totale (520px de base). */
.pick-card--spell .pick-card__front { grid-template-rows: 42px calc(var(--pick-w, 256px) - 100px) minmax(0, 1fr) 30px 42px 44px; }
.pick-card--item .pick-card__front { grid-template-rows: 30px 42px calc(var(--pick-w, 256px) - 100px) minmax(0, 1fr) 42px 44px; }

/* Rangée de tête des objets : chip de rareté + niveau/cartes. */
.pick-card__top { display: flex; align-items: stretch; gap: 8px; margin: 0; min-width: 0; }
.pick-card__rarity {
  display: inline-flex;
  flex: none;
  align-items: center;
  padding: 0 9px;
  border: 2px solid var(--pp-black);
  background: var(--pp-grey);
  color: var(--pp-cream);
  font: 800 9px/1 var(--pp-text);
  font-style: normal;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.pick-card[data-item-rarity="rare"] .pick-card__rarity { background: var(--pp-blue); }
.pick-card[data-item-rarity="epic"] .pick-card__rarity { background: #713AA5; }
.pick-card[data-item-rarity="legendary"] .pick-card__rarity { background: var(--pp-yellow); color: var(--pp-black); }

/* Rareté lisible avant même le mouvement du foil Pokémon. */
.pick-card--item { --rarity-accent: #817D74; --rarity-halo: rgba(129, 125, 116, .28); }
.pick-card--item[data-item-rarity="rare"] { --rarity-accent: #2B47A8; --rarity-halo: rgba(43, 71, 168, .42); }
.pick-card--item[data-item-rarity="epic"] { --rarity-accent: #713AA5; --rarity-halo: rgba(113, 58, 165, .5); }
.pick-card--item[data-item-rarity="legendary"] { --rarity-accent: #F0C22C; --rarity-halo: rgba(240, 194, 44, .58); }
.pick-card--item .pick-card__front {
  border-color: var(--rarity-accent);
  box-shadow: 0 0 0 3px var(--pp-black), 0 0 20px var(--rarity-halo), 8px 8px 0 rgba(23, 20, 15, .9);
}
.pick-card--item .pick-card__head { box-shadow: inset 0 -4px 0 var(--rarity-accent); }

/* Niveau + progression en cartes (courbes canoniques de cardLevels). */
.pick-card__lvl { display: flex; align-items: center; gap: 7px; margin: 0; min-width: 0; }
.pick-card__lvl > b {
  flex: none;
  padding: 5px 9px;
  background: var(--pp-black);
  color: var(--pp-yellow);
  font: 800 15px/1 var(--pp-text);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.pick-card__lvlbar { position: relative; display: block; flex: 1; height: 16px; min-width: 20px; border: 2px solid var(--pp-black); background: var(--pp-cream); }
.pick-card__lvlbar i {
  position: absolute;
  inset: 0 auto 0 0;
  background: var(--pp-yellow);
  background-image: repeating-linear-gradient(-45deg, transparent 0 6px, rgba(23, 20, 15, 0.16) 6px 9px);
}
.pick-card__lvl > small { flex: none; font: 800 15px/1 var(--pp-text); font-variant-numeric: tabular-nums; letter-spacing: 0.04em; white-space: nowrap; }
.pick-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 8px;
  background: var(--pp-black);
}
.pick-card__head b {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--pp-cream);
  font: 800 15px/1.08 var(--pp-text);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.pick-card__cost {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 4px;
  color: var(--pp-cream);
  font: 800 14px/1 var(--pp-data);
  font-variant-numeric: tabular-nums;
}
.pick-card__cost img { width: 17px; height: 17px; object-fit: contain; }
.pick-card__art { display: block; overflow: hidden; border: 2px solid var(--pp-black); }
.pick-card__art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pick-card__body { display: grid; align-content: start; min-height: 0; }
/* Description agrandie et mise en forme : chiffres en gras, mentions
   raciales soulignées de jaune. */
.pick-card__effect { margin: 0; font: 500 14.5px/1.42 var(--pp-text); }
.pick-card__effect b { font-weight: 800; }
.pick-card__effect em {
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.04em;
  box-shadow: inset 0 -6px 0 rgba(240, 194, 44, 0.55);
}

/* Vue « statistiques » de la carte agrandie : une cellule colorée par stat,
   icône canonique sur pastille, valeur en Barlow. Bascule via .is-zoom. */
.pick-card__statsfull { display: none; gap: 7px; align-content: start; max-height: 100%; overflow-y: auto; scrollbar-width: thin; }
.pick-card.is-zoom .pick-card__effect { display: none; }
.pick-card.is-zoom .pick-card__statsfull { display: grid; }
.pick-card--item .pick-card__statsfull { display: grid; }
/* Au zoom, l'illustration cède de la hauteur à la fiche ; le niveau et le
   bouton d'amélioration restent visibles (en grille, l'art reste carré). */
.pick-card--spell.is-zoom .pick-card__front { grid-template-rows: 42px 175px minmax(0, 1fr) 30px 42px 44px; }

/* Fiche de statistiques : anatomie d'infobulle de jeu tactique — des LIGNES
   de texte aérées, jamais un encadré par statistique. Les caractéristiques
   se lisent « libellé valeur », les effets sont groupés sous bandeau. */
.pick-card__statsfull { padding: 2px 1px; }
.sheet__caracs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3px 12px;
  padding-bottom: 2px;
}
/* Colonnes fixes : les valeurs d'une même colonne s'alignent (PA/Recharge,
   Portée/Lancers). Seule l'icône porte la couleur de famille — les valeurs
   restent à l'encre, la couleur est réservée aux effets. */
.carac {
  display: grid;
  grid-template-columns: 17px 64px minmax(0, 1fr);
  align-items: center;
  gap: 5px;
  min-width: 0;
}
.carac > i { color: var(--sc, var(--pp-blue)); font-style: normal; line-height: 0; }
.carac > i svg { width: 17px; height: 17px; }
.carac small {
  overflow: hidden;
  font: 800 10.5px/1.2 var(--pp-text);
  letter-spacing: 0.02em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0.62;
}
.carac b {
  color: var(--pp-black);
  font: 800 17px/1.2 var(--pp-data);
  font-variant-numeric: tabular-nums;
  text-align: left;
  white-space: nowrap;
}

/* Bandeau de section : le tampon administratif qui ouvre chaque rubrique. */
.sheet__band {
  display: block;
  margin-top: 2px;
  padding: 2px 7px;
  background: var(--pp-black);
  color: var(--pp-cream);
  font: 800 11px/1.3 var(--pp-text);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.sheet__lines { display: grid; gap: 1px; padding: 2px 2px 0; }
.eline { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.eline > i { align-self: center; flex: none; color: var(--sc, var(--pp-blue)); font-style: normal; line-height: 0; }
.eline > i svg { width: 17px; height: 17px; }
.eline b {
  color: color-mix(in srgb, var(--sc, var(--pp-black)) 78%, var(--pp-black));
  font: 800 17px/1.25 var(--pp-data);
  font-variant-numeric: tabular-nums;
}
.eline small { overflow: hidden; font: 600 14px/1.3 var(--pp-text); text-overflow: ellipsis; white-space: nowrap; opacity: 0.75; }
/* Ce que fait l'état, sous sa ligne : discret, italique, jamais encombrant. */
.enote {
  margin: -2px 0 0;
  padding-left: 24px;
  font: italic 500 13px/1.2 var(--pp-text);
  opacity: 0.7;
}
.pick-card__actions { display: grid; }
.pick-card__actions button {
  min-width: 0;
  border: 3px solid var(--pp-black);
  background: var(--pp-action);
  color: var(--pp-cream);
  font: 700 13px/1 var(--pp-action-font, var(--pp-text));
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 4px 4px 0 var(--pp-black);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.pick-card__actions button:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--pp-black); }
.pick-card.is-on .pick-card__actions button { background: var(--pp-black); color: var(--pp-yellow); }
