/* Dos des boîtes assortis à leur face (classe .back-v2).
   Même mise en page pour tous les styles, comme un vrai dos de boîte : bandeau de la console, trois captures,
   quelques lignes de texte, puis l'éditeur et le code-barres. Les couleurs viennent de chaque style :
     --back-pad       épaisseur du plastique / carton autour de la jaquette arrière
     --back-case      couleur du boîtier autour
     --back-bg        fond de la jaquette arrière
     --back-ink       couleur des textes
     --back-band-bg / --back-band-ink   bandeau du haut (le même que sur la face)
   Indices sur le jeu : l'éditeur, et des captures très floues tirées de la jaquette (--cover, posé par gamebox.js).
   Le dos ne dit rien de la rareté (sauf la lueur des boîtes épiques et plus, déjà existante). */

/* Classique (et valeurs par défaut) */
.gbox { --back-pad: 3cqw; --back-case: var(--lilac); --back-bg: var(--surface); --back-ink: var(--ink);
  --back-band-bg: var(--ink); --back-band-ink: var(--butter); }

.gbox .gbox-back.back-v2 { display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; gap: 3.2cqw;
  padding: calc(var(--back-pad) + 0cqw); color: var(--back-ink); background: var(--back-case);
  box-shadow: inset 0 0 0 .45cqw rgba(0, 0, 0, .28); }
.gbox .gbox-back.back-v2::before { content: ''; position: absolute; inset: var(--back-pad); border-radius: .9cqw; background: var(--back-bg); z-index: 0; }
.gbox .gbox-back.back-v2 > * { position: relative; z-index: 1; }
.gbox .gbox-back.back-v2 > .gb-back-band { margin: 0; }

/* Bandeau : le même que sur la face (nom de la console), le petit logo Unboxd à droite. */
.gb-back-band { display: flex; align-items: center; justify-content: space-between; gap: 2cqw; padding: 1.8cqw 2.6cqw;
  background: var(--back-band-bg); color: var(--back-band-ink); border-radius: .9cqw .9cqw 0 0; line-height: 1; }
.gb-back-platform { font-family: var(--font-display); font-size: 3.6cqw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb-back-mark { font-family: var(--font-display); font-size: 2.8cqw; opacity: .75; }

/* Captures : la jaquette très floutée, cadrée à trois endroits différents (on devine l'ambiance, pas le jeu). */
.gb-back-shots { display: grid; grid-template-columns: 1.5fr 1fr; grid-template-rows: 1fr 1fr; gap: 1.6cqw; height: 34%; margin: 0 2.6cqw; }
.gb-back-shots i { position: relative; border-radius: .6cqw; overflow: hidden; background: #555;
  box-shadow: 0 0 0 .4cqw rgba(255, 255, 255, .15); }
/* Le flou est posé sur un calque intérieur (le cadre de la capture reste net) : assez fort pour ne pas lire le titre. */
.gb-back-shots i::before { content: ''; position: absolute; inset: -30%; background: var(--cover) no-repeat; background-size: 420% auto;
  background-position: inherit; filter: blur(3.6cqw) saturate(1.3); }
.gb-back-shots i:nth-child(1) { grid-row: 1 / span 2; background-position: 30% 35%; }
.gb-back-shots i:nth-child(2) { background-position: 80% 60%; }
.gb-back-shots i:nth-child(3) { background-position: 45% 85%; }

/* Les anciennes fausses captures pastel des dos PS2 et NES (première version) ne s'affichent pas ici. */
.gbox .back-v2 .gb-back-lines::before { display: none; }
/* Texte de présentation (illisible, comme vu de loin). */
.gbox .back-v2 .gb-back-lines { width: auto; margin: 0 2.6cqw; display: flex; flex-direction: column; gap: 1.6cqw; }
.gbox .back-v2 .gb-back-lines i { height: 1.5cqw; border-radius: 99px; background: currentColor; opacity: .22; }
.gbox .back-v2 .gb-back-lines i:nth-child(2) { width: 92%; } .gbox .back-v2 .gb-back-lines i:nth-child(4) { width: 85%; }
.gbox .back-v2 .gb-back-lines i:nth-child(5) { width: 55%; }

/* Bas : l'éditeur (indice) et le code-barres. */
.gb-back-foot { margin: auto 2.6cqw 2.6cqw; display: flex; align-items: flex-end; justify-content: space-between; gap: 3cqw; }
.gb-back-publisher { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.gb-back-publisher small { font-size: 2.3cqw; font-weight: 700; opacity: .7; }
.gb-back-publisher strong { font-size: 3.2cqw; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gbox .back-v2 .gb-barcode { position: static; flex: none; margin: 0; width: 20cqw; height: 9cqw; align-self: flex-end; }

/* ---- Finition « réelle » (classe .back-real, boîtiers en plastique) ----------------------
   Moins plat : relief du boîtier, jaquette arrière teintée par l'illustration de la façade (très floue : c'est la même
   boîte, on n'y lit rien), captures bordées de blanc, titre du texte de présentation, reflet du film qui suit la souris.
   Réglages par style : --back-art-op (opacité de l'illustration), --back-art-light (luminosité). */
.gbox .gbox-back.back-v2.back-real { box-shadow: inset 0 0 0 .45cqw rgba(0, 0, 0, .28), inset .8cqw .8cqw 1.4cqw rgba(255, 255, 255, .16),
  inset -.8cqw -.8cqw 1.4cqw rgba(0, 0, 0, .22); }
.gbox .gbox-back.back-v2 > .gb-back-art { position: absolute; z-index: 0; inset: var(--back-pad); border-radius: .9cqw; overflow: hidden;
  opacity: var(--back-art-op, .6); pointer-events: none; }
.gb-back-art::before { content: ''; position: absolute; inset: -20%; background: var(--cover) center / cover no-repeat;
  filter: blur(4.5cqw) saturate(1.3) brightness(var(--back-art-light, .5)); }
/* Assombrit le bas (zone du texte et des mentions), comme sur les vraies jaquettes arrière. */
.gb-back-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, var(--back-art-fade, rgba(8, 8, 12, .55))); }
.gbox .gbox-back.back-v2 > .gb-back-gloss { position: absolute; z-index: 4; inset: 0; border-radius: inherit; }
.back-real .gb-back-shots i { box-shadow: 0 0 0 .35cqw rgba(255, 255, 255, .85), 0 .6cqw 1.4cqw rgba(0, 0, 0, .45); }
.gbox .back-real .gb-back-lines i:first-child { height: 2.4cqw; width: 62%; opacity: .55; margin-bottom: .6cqw; }
/* Jaquettes arrière claires : illustration à peine visible. */
.gbox:is(.gbox--x360, .gbox--wii, .gbox--ds, .gbox--sms) { --back-art-op: .2; --back-art-light: 1.15; --back-art-fade: rgba(255, 255, 255, .5); }
.gbox:is(.gbox--x360, .gbox--wii, .gbox--ds, .gbox--sms) .back-real .gb-back-shots i { box-shadow: 0 0 0 .35cqw #fff, 0 .4cqw 1cqw rgba(0, 0, 0, .18); }

/* PS3 « PAL » : même boîtier transparent que la façade (marge haute de l'en-tête, charnière à
   droite vue de dos), même bandeau noir « PS3 » à filet rouge, pictogrammes blancs, bande claire des mentions légales. */
.gbox.ps3-pal { --back-case: var(--case); --back-bg: #101014; --back-band-ink: #fff;
  --back-band-bg: linear-gradient(90deg, #050506 0 38%, #2A2A2F 62%, #6E6F76 84%, #A9AAB0); }
.gbox.ps3-pal .gbox-back.back-v2 { padding: 9.6cqw 3.6cqw 2cqw 1.8cqw; gap: 2.8cqw;
  background: linear-gradient(100deg, rgba(255, 255, 255, .3), transparent 25% 70%, rgba(255, 255, 255, .15)),
    linear-gradient(180deg, var(--case-light), var(--case) 20%, var(--case-dark)); }
.gbox.ps3-pal .gbox-back.back-v2::before, .gbox.ps3-pal .gbox-back.back-v2 > .gb-back-art { inset: 9.6cqw 3.6cqw 2cqw 1.8cqw; border-radius: 0; }
.gbox.ps3-pal .gb-back-band { border-radius: 0; padding: 2.3cqw 2.6cqw 1.9cqw; border-bottom: .45cqw solid #C41E2A; }
.gbox.ps3-pal .gb-back-platform { overflow: visible; }
.gbox.ps3-pal .gb-back-platform .ps3-logo { font: 400 5cqw/1 'Michroma', var(--font-body); letter-spacing: .04em; }
.gbox.ps3-pal .gb-back-shots { height: 30%; }
/* Pictogrammes et bande des mentions légales (PS3 et Wii « PAL »). */
.back-icons { display: flex; gap: 1.4cqw; margin: 0 2.6cqw; }
.back-icons span { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 9cqw; height: 8cqw;
  border-radius: .5cqw; background: #F4F4F6; color: #111; line-height: 1; box-shadow: 0 .3cqw .6cqw rgba(0, 0, 0, .35); }
.back-icons b { font: 800 3cqw/1 var(--font-body); }
.back-icons small { font: 700 1.6cqw/1 var(--font-body); margin-top: .5cqw; text-transform: uppercase; letter-spacing: .02em; }
.gbox .gb-back-foot.back-legal { margin: auto 0 0; padding: 2cqw 2.6cqw 2.2cqw; background: linear-gradient(180deg, #EDEDEF, #DADADF);
  color: #222; align-items: center; }
.back-legal .gb-back-publisher small { opacity: .6; }
.gbox .back-v2 .back-legal .gb-barcode { width: 17cqw; height: 7.5cqw; }

/* Wii « PAL » : dos blanc comme la façade, « Wii » gris en haut, filet gris, pictogrammes des
   manettes cerclés de gris, bande grise des mentions légales. */
.gbox.wii-pal { --back-bg: #FFFFFF; --back-ink: #3A3D46; --back-band-bg: #FFFFFF; --back-band-ink: #9A9CA4;
  --back-art-op: .14; --back-art-light: 1.25; --back-art-fade: rgba(255, 255, 255, .6); }
.gbox.wii-pal .gbox-back.back-v2 { gap: 2.8cqw; }
.gbox.wii-pal .gbox-back.back-v2::before, .gbox.wii-pal .gbox-back.back-v2 > .gb-back-art { border-radius: .6cqw; }
.gbox.wii-pal .gb-back-band { border-radius: .6cqw .6cqw 0 0; padding: 2.4cqw 3cqw 2cqw; box-shadow: inset 0 -.35cqw 0 #D4D6DC; }
.gbox.wii-pal .gb-back-platform { font: 800 6cqw/1 var(--font-body); letter-spacing: .03em; color: #9A9CA4; }
.gbox.wii-pal .gb-back-mark { color: #B4B6BD; }
.gbox.wii-pal .back-icons span { background: #fff; color: #5A5E6A; box-shadow: inset 0 0 0 .35cqw #B9BCC6; }
.gbox.wii-pal .gb-back-foot.back-legal { background: linear-gradient(180deg, #F1F2F4, #E1E3E8); border-radius: 0 0 .6cqw .6cqw; }

/* ---- Couleurs par style -------------------------------------------------------------------------- */
/* PC : boîtier DVD noir, jaquette arrière sombre, onglet « PC » blanc comme sur la face. */
.gbox--pc { --back-pad: 1.3cqw; --back-case: #0E0E11; --back-bg: linear-gradient(180deg, #25252C, #16161B); --back-ink: #F2F2F6;
  --back-band-bg: transparent; --back-band-ink: #fff; }
.gbox--pc .gb-back-band { padding: 0; }
.gbox--pc .gb-back-platform { font-family: 'Anton', var(--font-display); font-size: 5.6cqw; color: #0B0B0D; background: #fff;
  padding: 1.2cqw 2.8cqw 1cqw 2.2cqw; border-radius: .5cqw 0 2.6cqw 0; }
.gbox--pc .gb-back-mark { margin-right: 2.4cqw; }

/* Boîtiers DVD (PS2 et consoles qui en dérivent) : bandeau de la console, jaquette arrière sombre par défaut. */
.gbox--ps2 { --back-pad: 2.4cqw; --back-case: var(--case); --back-bg: #16151D; --back-ink: #F4F4F8;
  --back-band-bg: var(--sleeve); --back-band-ink: #fff; }
.gbox--ps2 .gb-back-platform { font-style: italic; }
/* PS2 « PAL » plus fidèle : même logo que la façade, bandeau noir plus haut. */
.gbox.ps2-pal2 .gb-back-band { padding: 2.6cqw 2.8cqw; background: linear-gradient(180deg, #17171C, #050507 55%, #000); }
.gbox.ps2-pal2 .gb-back-platform { font: 500 4.2cqw/1 var(--font-body); font-style: normal; letter-spacing: .015em; }
.gbox.ps2-pal2 .gb-back-platform i { font-style: normal; font-weight: 700; font-size: 1.2em; margin-left: .9cqw; }
.gbox--gc   { --back-bg: #1C1A36; }
.gbox--xbox { --back-bg: #141714; --back-band-ink: #8BD45A; }
.gbox--xbox .gb-back-band { box-shadow: inset 0 -.7cqw 0 #5CB82C; }
.gbox--ps3  { --back-bg: #121216; --back-band-bg: linear-gradient(180deg, #2A2A30, #0E0E12); --back-band-ink: #E6E8EE; }
.gbox--psp  { --back-bg: #121217; }
.gbox--md   { --back-bg: #111113; --back-band-bg: repeating-linear-gradient(90deg, rgba(226, 50, 50, .55) 0 .3cqw, transparent .3cqw 3.2cqw), #0B0B0D; }
.gbox--md .gb-back-band { box-shadow: inset 0 -.7cqw 0 #D73A3A; }
/* Consoles à jaquette claire : dos clair, texte foncé. */
.gbox--x360 { --back-bg: #F2F5EF; --back-ink: #1D2418; --back-band-bg: linear-gradient(180deg, #FFFFFF, #E4ECDD); --back-band-ink: #3F8A1E; }
.gbox--wii  { --back-bg: #FBFBFC; --back-ink: #3A3D46; --back-band-bg: #FFFFFF; --back-band-ink: #8A8F9C; }
.gbox--wii .gb-back-band { box-shadow: inset 0 -.5cqw 0 #B9BCC6; }
.gbox--ds   { --back-bg: #F6F6F8; --back-ink: #3A3D46; --back-band-bg: linear-gradient(180deg, #FFFFFF, #DCDDE3); --back-band-ink: #6D7280; }
.gbox--sms  { --back-bg: #F7F7F4; --back-ink: #26262C; --back-band-ink: #D73A3A;
  --back-band-bg: repeating-linear-gradient(90deg, rgba(20, 20, 24, .3) 0 .3cqw, transparent .3cqw 3.2cqw), #F7F7F4; }
.gbox--sms .gb-back-band { box-shadow: inset 0 -.7cqw 0 #D73A3A; }
.gbox:is(.gbox--x360, .gbox--wii, .gbox--ds, .gbox--sms) .gb-back-shots i { box-shadow: 0 0 0 .4cqw rgba(0, 0, 0, .12); }

/* Boîtiers CD (PS1, Saturn, Dreamcast) : jaquette arrière avec ses deux languettes latérales repliées. */
.gbox--ps1 { --back-pad: 1.8cqw; --back-case: #E7E3EC; --back-ink: #F4F4F8; --back-band-bg: var(--sleeve); --back-band-ink: #fff;
  --back-bg: linear-gradient(90deg, var(--sleeve) 0 5cqw, #24222C 5cqw calc(100% - 5cqw), var(--sleeve) 0); }
.gbox--ps1 .gbox-back.back-v2 { gap: 2.2cqw; padding-left: 6.8cqw; padding-right: 6.8cqw; }
.gbox--ps1 .gb-back-shots { height: 38%; }
.gbox--ps1 .gb-back-lines i:nth-child(n+4) { display: none; }
.gbox--ps1 .gb-back-foot { margin-bottom: 2cqw; }
.gbox--saturn .gb-back-band { box-shadow: inset 0 -.7cqw 0 #2E5FD9; }
.gbox--dc .gb-back-band { box-shadow: inset 0 -.7cqw 0 #F28C28; }

/* Boîtes en carton (NES, Black Box, SNES, N64, Game Boy…) : pas de boîtier, le dos est le carton lui-même. */
.gbox--nes { --back-pad: 0cqw; --back-case: transparent; --back-bg: transparent; --back-ink: #F1F0F6;
  --back-band-bg: #2B2A31; --back-band-ink: #fff; }
.gbox--nes .gbox-back.back-v2 { background: repeating-linear-gradient(0deg, var(--grid) 0 .25cqw, transparent .25cqw 4cqw),
  repeating-linear-gradient(90deg, var(--grid) 0 .25cqw, transparent .25cqw 4cqw), var(--board); padding: 5.5cqw; gap: 3.4cqw; }
.gbox--nes .gb-back-band { border-radius: .4cqw; }
.gbox--nes .gb-back-shots { margin: 0; } .gbox--nes .back-v2 .gb-back-lines { margin: 0; } .gbox--nes .gb-back-foot { margin: auto 0 0; }
.gbox--nes .gb-back-shots i { border-radius: .2cqw; box-shadow: 0 0 0 .5cqw #3A3944; }
.gbox--blackbox { --back-band-bg: #0B0B0E; --back-band-ink: #3D9BFF; }
.gbox--blackbox .gb-back-band { box-shadow: inset 0 0 0 .4cqw rgba(255, 255, 255, .1); }
.gbox--snes { --back-ink: #3A2C40; --back-band-bg: #57555F; }
.gbox--snes .gb-back-band { box-shadow: inset 0 -1.2cqw 0 -.1cqw transparent; border-bottom: 1.2cqw solid transparent;
  border-image: linear-gradient(90deg, #D8403A 0 25%, #F2C230 25% 50%, #3FA34D 50% 75%, #3C63C9 75%) 1; }
.gbox--gb   { --back-ink: #3A2C40; --back-band-bg: #6E6C75; }
.gbox--gbc  { --back-ink: #3A2C40; --back-band-bg: linear-gradient(90deg, #E2463F, #F2A531 20%, #E0C21F 40%, #4DB35A 60%, #3E7BD6 80%, #8A4FC4); }
.gbox--gba  { --back-ink: #3A2C40; --back-band-bg: linear-gradient(90deg, #3B2F92, #5A48C0); }
.gbox--n64 .gb-back-band::after { content: ''; width: 4.6cqw; aspect-ratio: 1; border-radius: .4cqw; transform: rotate(45deg);
  background: conic-gradient(#3C63C9 0 25%, #3FA34D 0 50%, #D8403A 0 75%, #F2C230 0); }
.gbox--n64 .gb-back-mark { margin-left: auto; margin-right: 2cqw; }