/* Style de boîte « NES Black Box » : boîte noire façon années 80 (illustration en haut, titre bleu,
   écusson de série, sceau doré). S'appuie sur css/gamebox-nes.css (carton épais, coins usés).
   Aucun logo, sceau ou mention officiels de Nintendo. */
.gbox--blackbox {
  --bb-blue: #43A6F2; --bb-blue-dark: #0C2240;
  --bb-black: linear-gradient(165deg, #1C1B21, #0A0A0D 55%, #111015);
}

/* Carton noir brillant, sans quadrillage. */
.gbox--blackbox .gbox-front,
.gbox--blackbox .gbox-back,
.gbox--blackbox .gbox-spine,
.gbox--blackbox .gbox-right,
.gbox--blackbox .gbox-cap { background: var(--bb-black); }
.gbox--blackbox .gbox-front { display: flex; flex-direction: column; padding: 6cqw 5cqw 4.4cqw; }
.gbox--blackbox[data-rarity="mythique"] .gbox-front { background: var(--bb-black); }
/* Pas de bandeau coloré sur cette boîte. */
.gbox--blackbox .gbox-spine::after, .gbox--blackbox .gbox-right::after { display: none; }
.gbox--blackbox .gb-gloss { opacity: .55; mix-blend-mode: screen;
  background: linear-gradient(120deg, rgba(255, 255, 255, .1) 0 10%, transparent 22% 70%, rgba(255, 255, 255, .06) 78%, transparent 86%),
    radial-gradient(circle at var(--mx, 25%) var(--my, 15%), rgba(255, 255, 255, .18), transparent 40%); }

/* Illustration encadrée en haut. */
.bb-art { flex: none; height: 54%; border-radius: .5cqw; overflow: hidden; background: #222; box-shadow: 0 0 0 .4cqw rgba(255, 255, 255, .08); }
.bb-art img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; filter: saturate(1.05) contrast(1.04); }
.bb-art img.banner { object-fit: contain; }

/* Titre : capitales condensées bleues à contour sombre, petit mot au-dessus, « ™ ». */
.bb-title-block { margin-top: 4cqw; }
.bb-lead, .bb-title { font-family: 'Anton', var(--font-display); font-weight: 400; text-transform: uppercase; color: var(--bb-blue);
  -webkit-text-stroke: .45cqw var(--bb-blue-dark); paint-order: stroke fill; text-shadow: .7cqw .7cqw 0 var(--bb-blue-dark); }
.bb-lead { display: block; font-size: 4.6cqw; line-height: 1; margin-bottom: .6cqw; }
.bb-title { font-size: 12cqw; line-height: .95; letter-spacing: .01em; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bb-title.long { font-size: 9.4cqw; }
.bb-title.xlong { font-size: 7.2cqw; }
/* Titre japonais (exemplaire d'import, js/gamebox.js) : police japonaise du système, en gras comme les titres latins. */
.bb-title:lang(ja) { font-family: 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'Meiryo', 'Noto Sans JP', sans-serif; font-weight: 900; letter-spacing: 0; }
.bb-title sup { font-family: var(--font-body); font-size: 2.6cqw; color: #fff; -webkit-text-stroke: 0; text-shadow: none; vertical-align: top; margin-left: .6cqw; }
.bb-brand { display: flex; align-items: center; gap: 3cqw; margin-top: 2.4cqw; }
.bb-pill { font: italic 800 3.6cqw var(--font-body); color: #fff; background: #E0282E; padding: .5cqw 2.8cqw .7cqw; border-radius: 99px;
  box-shadow: inset 0 0 0 .45cqw #fff, 0 0 0 .35cqw #E0282E; }
.bb-system { white-space: pre-line; font-family: 'Anton', var(--font-display); font-size: 3.6cqw; line-height: .98; text-transform: uppercase;
  font-style: italic; color: #F7A21B; background: linear-gradient(180deg, #FFD34A, #F28B12); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* Bas de boîte. */
.bb-bottom { margin-top: auto; display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 2.6cqw; }
.bb-series { width: 16cqw; display: flex; flex-direction: column; align-items: stretch; border: .5cqw solid #D9D9E2; border-radius: .4cqw; background: #0B0B0E; transform: skewX(-4deg); }
.bb-series svg { display: block; width: 100%; aspect-ratio: 1; padding: 2.2cqw; fill: #F9C80E; stroke: #E07A10; stroke-width: .6; stroke-linejoin: round; }
.bb-series span { font: 800 1.85cqw/1.15 var(--font-body); text-transform: uppercase; color: #F9C80E; text-align: center; padding: .6cqw .3cqw .9cqw; }
.gbox--blackbox[data-rarity="legendaire"] .bb-series { border-color: #E9C45A; }
.gbox--blackbox[data-rarity="mythique"] .bb-series { border-image: linear-gradient(135deg, #F5B8D2, #FFF0A8, #B8F0D6, #B8D6FF, #DCC2FF) 1; }
.bb-lines { display: flex; flex-direction: column; gap: .6cqw; font: 800 3cqw/1.15 var(--font-body); text-transform: uppercase; color: #F2F2F6; padding-bottom: .6cqw; }
.bb-rarity { display: inline-flex; align-items: center; gap: 1.6cqw; color: var(--r); }
.bb-rarity .pips { gap: .8cqw; }
.bb-rarity .pips i { width: 2cqw; height: 2cqw; box-shadow: inset 0 0 0 .4cqw var(--r); }
.bb-rarity .pips i.on { background: var(--r); }

/* Écusson de rareté : même cadre que l'écusson de série, gemme en pixel art à la
   couleur de la rareté, nom de la rareté dessous. */
.bb-rarity-badge .bb-gem { display: block; width: 100%; aspect-ratio: 12 / 10; padding: 2.4cqw 2cqw 1.6cqw; stroke: none; }
.bb-gem .px { fill: var(--r); } .bb-gem .px-hi { fill: #fff; } .bb-gem .px-lo { fill: var(--r-edge); } .bb-gem .px-dk { fill: #1A1A20; stroke: none; }
.bb-rarity-badge span { color: var(--r); font-size: 1.75cqw; letter-spacing: .02em; white-space: nowrap; }
.bb-rarity-badge .pips { display: flex; justify-content: center; gap: .55cqw; padding: 0 .6cqw .2cqw; }
.bb-rarity-badge .pips i { width: 1.5cqw; height: 1.5cqw; box-shadow: inset 0 0 0 .35cqw var(--r); }
.bb-rarity-badge .pips i.on { background: var(--r); }
.gbox--blackbox[data-rarity="commune"] .bb-rarity-badge .pips i { box-shadow: inset 0 0 0 .35cqw #E6DED6; }
.gbox--blackbox[data-rarity="commune"] .bb-rarity-badge .pips i.on { background: #E6DED6; }
.gbox--blackbox[data-rarity="commune"] .bb-rarity-badge span { color: #E6DED6; }
.gbox--blackbox[data-rarity="mythique"] .bb-gem .px { fill: #F5B8D2; } /* gemme irisée : trois couleurs en alternance */
.gbox--blackbox[data-rarity="mythique"] .bb-gem .px:nth-child(3n) { fill: #B8F0D6; }
.gbox--blackbox[data-rarity="mythique"] .bb-gem .px:nth-child(3n+1) { fill: #B8D6FF; }
/* Lignes du milieu : petite manette en pixel art devant « Version NES », « Édition Unboxd » en dessous. */
.bb-version { display: inline-flex; align-items: center; gap: 1.4cqw; }
.bb-pad { width: 6cqw; height: auto; flex: none; }
.bb-pad .px { fill: #C9C9D2; } .bb-pad .px-dk { fill: #1A1A20; } .bb-pad .px-hi { fill: #1A1A20; } .bb-pad .px-lo { fill: #E0282E; }
.bb-edition { color: #F7A21B; font-style: italic; }

/* Sceau doré dentelé : numéro de la boîte dans la collection (version 'rarity') ou % d'avis positifs ('series'). */
.bb-seal { position: relative; width: 19cqw; aspect-ratio: 1; }
.bb-seal svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.bb-seal svg path { fill: #D9B550; }
.bb-seal svg circle { fill: #F4E4A6; stroke: #B38A2A; stroke-width: 2; }
.bb-seal-text { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  color: #6B4E12; font: italic 700 1.7cqw/1.1 var(--font-body); }
.bb-seal-pill { font-style: italic; font-weight: 800; font-size: 1.8cqw; color: #fff; background: #E0282E; padding: .2cqw 1.2cqw; border-radius: 99px; margin: .4cqw 0; }
.bb-seal-text strong { font-family: var(--font-display); font-weight: 400; font-style: normal; font-size: 3.6cqw; color: #4A360C; }

/* Tranche : titre bleu condensé. */
.gbox--blackbox .gbox-spine { box-shadow: inset 0 0 0 .5cqw var(--board-edge); }
.gbox--blackbox .gbox-spine span { font-family: 'Anton', var(--font-display); font-style: normal; text-transform: uppercase; font-size: 9cqw;
  color: var(--bb-blue); -webkit-text-stroke: .4cqw var(--bb-blue-dark); paint-order: stroke fill; margin: auto 0; padding: 4cqw 0; }