/* Style de boîte « PC » : boîtier DVD noir comme les vraies boîtes de jeux PC (d'après des photos de Mafia III,
   Fallout 4, Moonlighter 2). Jaquette pleine sous le film plastique, sans plaque de titre (le titre fait partie de
   l'illustration), onglet blanc « PC » en haut à gauche, pastille de note façon logo d'âge en bas à gauche,
   studio en bas à droite, tranche noire avec « PC » et le titre. Aucun logo officiel (PEGI, éditeurs…).
   S'ajoute à css/gamebox.css ; l'ancien style pastel reste disponible sous le nom « Classique ». */
.gbox--pc { --depth: 10cqw; --case: #0E0E11; --case-edge: #2A2A31; --rim: 1.3cqw; }
.gbox--pc .gbox-face { border-radius: 1.3cqw; }

/* Façade : cadre de plastique noir très fin autour de la jaquette. */
.gbox--pc .gbox-front, .gbox--pc[data-rarity="mythique"] .gbox-front { padding: 0; background: var(--case);
  box-shadow: inset 0 0 0 .35cqw var(--case-edge), inset 0 0 0 var(--rim) var(--case); }
.gbox--pc .gbox-front::before { display: none; }
.gbox--pc .gb-art { position: absolute; inset: var(--rim); border-radius: .5cqw; overflow: hidden; background: #1A1A1F; }
.gbox--pc .gb-art img { filter: saturate(1.02) contrast(1.03); }
.gbox--pc .gb-art::after { opacity: .12; } /* trame d'impression à peine visible */
.gbox--pc .gb-sticker, .gbox--pc .gb-series, .gbox--pc .gb-num { display: none; }

/* Haut : onglet blanc « PC » à gauche, pastille de rareté à droite. */
.gbox--pc .gb-band { position: absolute; z-index: 3; left: var(--rim); right: var(--rim); top: var(--rim); padding: 0; gap: 0;
  align-items: flex-start; background: none; border: 0; color: #fff; }
.gbox--pc .gb-platform { font-family: 'Anton', var(--font-display); font-weight: 400; font-size: 7.4cqw; line-height: 1; letter-spacing: .01em;
  color: #0B0B0D; background: #FFFFFF; padding: 1.5cqw 3.4cqw 1.3cqw 2.6cqw; border-radius: .5cqw 0 3.2cqw 0;
  box-shadow: .4cqw .5cqw 0 rgba(0, 0, 0, .28); }
.gbox--pc .gb-rarity, .gbox--pc .gb-band .pips { height: 5.4cqw; margin-top: 1.8cqw; display: inline-flex; align-items: center;
  background: rgba(10, 10, 14, .74); -webkit-backdrop-filter: blur(1cqw); backdrop-filter: blur(1cqw); }
.gbox--pc .gb-rarity { margin-left: auto; padding: 0 1.2cqw 0 2.2cqw; border-radius: 99px 0 0 99px; font-size: 2.7cqw; font-weight: 800; color: #F4F4F8; }
.gbox--pc .gb-band .pips { margin-right: 1.8cqw; padding: 0 2cqw 0 .2cqw; border-radius: 0 99px 99px 0; gap: .7cqw; }
.gbox--pc .gb-band .pips i { width: 1.8cqw; height: 1.8cqw; box-shadow: inset 0 0 0 .4cqw #F4F4F8; }
.gbox--pc .gb-band .pips i.on { background: #F4F4F8; }
/* Raretés hautes : pastille argentée, dorée ou holographique. */
.gbox--pc[data-rarity="epique"] :is(.gb-rarity, .gb-band .pips) { background: linear-gradient(90deg, #C9CBD6, #F2F3F8 50%, #A9ADBD); }
.gbox--pc[data-rarity="legendaire"] :is(.gb-rarity, .gb-band .pips) { background: linear-gradient(90deg, #C9A640, #F7E7A6 50%, #B58C22); }
.gbox--pc[data-rarity="mythique"] :is(.gb-rarity, .gb-band .pips) { background: linear-gradient(90deg, #F5B8D2, #FFF0A8 30%, #B8F0D6 55%, #B8D6FF 80%, #DCC2FF); }
.gbox--pc:is([data-rarity="epique"], [data-rarity="legendaire"], [data-rarity="mythique"]) .gb-rarity { color: #1A1A20; }
.gbox--pc:is([data-rarity="epique"], [data-rarity="legendaire"], [data-rarity="mythique"]) .gb-band .pips i { box-shadow: inset 0 0 0 .4cqw #1A1A20; }
.gbox--pc:is([data-rarity="epique"], [data-rarity="legendaire"], [data-rarity="mythique"]) .gb-band .pips i.on { background: #1A1A20; }

/* Bas : pastille de note (façon logo d'âge) à gauche, studio à droite, sur un léger dégradé sombre. */
.gbox--pc .gb-plate, .gbox--pc[data-rarity="mythique"] .gb-plate { position: absolute; z-index: 2; left: var(--rim); right: var(--rim); bottom: var(--rim);
  display: flex; align-items: flex-end; justify-content: space-between; gap: 3cqw; padding: 10cqw 2.4cqw 2.4cqw; border: 0;
  border-radius: 0 0 .5cqw .5cqw;
  /* Légère vignette : un voile sombre dans le coin bas droit (sous le studio) et en bas, pour que le texte blanc
     reste lisible même sur une jaquette claire. */
  background:
    radial-gradient(ellipse 75% 95% at 100% 100%, rgba(0, 0, 0, .62), rgba(0, 0, 0, .25) 55%, transparent 80%),
    linear-gradient(180deg, transparent 20%, rgba(0, 0, 0, .42)); }
.gbox--pc .gb-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* déjà sur la jaquette */
.gbox--pc .gb-rating { display: flex; flex-direction: column; align-items: stretch; flex: none; width: 12.5cqw; overflow: hidden;
  border-radius: .6cqw; background: #fff; box-shadow: 0 0 0 .45cqw #fff, .4cqw .6cqw 0 rgba(0, 0, 0, .35); line-height: 1; text-align: center; }
.gbox--pc .gb-rating strong { font-family: 'Anton', var(--font-display); font-weight: 400; font-size: 7.4cqw; padding: 1.2cqw 0 .8cqw;
  color: #1A1A20; background: var(--r); }
.gbox--pc .gb-rating span { font-size: 1.7cqw; font-weight: 800; padding: .7cqw 0 .5cqw; color: #1A1A20; text-transform: uppercase; letter-spacing: .02em; }
.gbox--pc .gb-meta { margin: 0; padding: 0; max-width: 55%; text-align: right; white-space: normal; overflow: hidden; display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 2.5cqw; line-height: 1.2; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: #fff; text-shadow: 0 .2cqw .4cqw rgba(0, 0, 0, .85), 0 0 1.4cqw rgba(0, 0, 0, .6); }

/* Rareté (2026-09-29) : plus de pastille en haut à droite ; la pastille du bas (façon logo d'âge) montre la
   rareté — ses points sur la couleur de la rareté, et son nom dans la bande blanche. La note est dans la fiche.
   (Avant : pastille de rareté en haut à droite + note dans la pastille du bas, règles ci-dessus conservées.) */
.gbox--pc .gb-band .gb-rarity, .gbox--pc .gb-band .pips { display: none; }
/* Carré : initiales de la rareté sur sa couleur. Bande blanche : les six points de rareté. */
.gbox--pc .gb-rating--rarity { width: 13cqw; }
.gbox--pc .gb-rating--rarity strong { font-size: 7cqw; letter-spacing: -.01em; padding: 1.4cqw 0 1cqw; }
.gbox--pc .gb-rating--rarity .pips { display: flex; justify-content: center; gap: .55cqw; padding: .9cqw .4cqw .8cqw; background: #fff; }
.gbox--pc .gb-rating--rarity .pips i { width: 1.45cqw; height: 1.45cqw; box-shadow: inset 0 0 0 .35cqw #1A1A20; }
.gbox--pc .gb-rating--rarity .pips i.on { background: #1A1A20; }
.gbox--pc[data-rarity="epique"] .gb-rating--rarity strong { background: linear-gradient(135deg, #C9CBD6, #F2F3F8 50%, #A9ADBD); }
.gbox--pc[data-rarity="legendaire"] .gb-rating--rarity strong { background: linear-gradient(135deg, #C9A640, #F7E7A6 50%, #B58C22); }
.gbox--pc[data-rarity="mythique"] .gb-rating--rarity strong { background: linear-gradient(135deg, #F5B8D2, #FFF0A8 30%, #B8F0D6 55%, #B8D6FF 80%, #DCC2FF); }

/* Film plastique : reflet franc en diagonale, comme sur les photos de boîtes neuves. */
.gbox--pc .gb-gloss { mix-blend-mode: screen; opacity: .5;
  background:
    radial-gradient(circle at var(--mx, 25%) var(--my, 15%), rgba(255, 255, 255, .35), transparent 35%),
    linear-gradient(120deg, rgba(255, 255, 255, .22) 0 7%, transparent 18% 66%, rgba(255, 255, 255, .1) 72%, transparent 80%); }
.gbox--pc[data-rarity="mythique"] .gb-gloss { mix-blend-mode: overlay; opacity: .85; }

/* Cadrage des jaquettes : l'onglet PC et la pastille de note cachent un peu le haut et le bas. */
.gbox--pc .gb-art { --safe-top: .08; --safe-bottom: .12; }

/* Tranche : plastique noir, « PC » dans un bloc blanc en haut, titre en capitales qui se lit de haut en bas. */
.gbox--pc .gbox-spine { flex-direction: column; align-items: stretch; justify-content: flex-start;
  background: linear-gradient(90deg, #0A0A0D, #16161B 50%, #0A0A0D); box-shadow: inset 0 0 0 .35cqw var(--case-edge); }
.gbox--pc .gbox-spine::before { content: 'PC'; flex: none; margin: 1.2cqw 1.2cqw 0; padding: 1.3cqw 0 1.1cqw; border-radius: .4cqw;
  font-family: 'Anton', var(--font-display); font-size: 3.6cqw; line-height: 1; text-align: center; color: #0B0B0D; background: #fff; }
.gbox--pc .gbox-spine span { transform: none; align-self: center; margin: 0; padding: 3cqw 0; max-height: 110cqw;
  font-family: 'Anton', var(--font-display); font-size: 5cqw; letter-spacing: .04em; text-transform: uppercase; color: #fff; }
.gbox--pc:is([data-rarity="legendaire"], [data-rarity="mythique"]) .gbox-spine span { color: #F7E7A6; }

/* Côtés, dessus, dessous : plastique noir ; côté ouvrant avec jointure et encoche. */
.gbox--pc .gbox-right, .gbox--pc .gbox-cap { background: linear-gradient(90deg, #0B0B0E, #1C1C22 50%, #0B0B0E); box-shadow: inset 0 0 0 .3cqw var(--case-edge); }
.gbox--pc .gb-seam { background: rgba(255, 255, 255, .1); }
.gbox--pc .gb-notch { background: radial-gradient(ellipse at 40% 50%, rgba(0, 0, 0, .8), rgba(0, 0, 0, .3) 70%); }
.gbox--pc .gbox-right::after { content: ''; position: absolute; top: 1.5cqw; bottom: 1.5cqw; left: 16%; width: .4cqw; background: rgba(240, 240, 245, .55); } /* bord de la jaquette */

/* Dos : boîtier noir, jaquette arrière sombre. */
.gbox--pc .gbox-back { background: var(--case); padding: 6cqw 6cqw 5cqw; box-shadow: inset 0 0 0 .35cqw var(--case-edge), inset 0 0 0 var(--rim) var(--case); }
.gbox--pc .gbox-back::before { content: ''; position: absolute; inset: var(--rim); border-radius: .5cqw; background: linear-gradient(180deg, #24242B, #17171C); }
.gbox--pc .gbox-back > * { position: relative; }
.gbox--pc .gb-back-lines i { background: rgba(255, 255, 255, .2); }