/* ================= « Nouvelle partie » : écran coupé en deux et encarts des cortèges (ui/camp.js) =================
   Même grammaire que ui/menu.css : unité var(--u), Silk (titres), Pixelify (texte), aplats, pas d'arrondi. */
#sc-camp { --mid: 50vw; overflow: hidden; background: #141018; }
#camp-cv { position: absolute; left: 0; top: 0; image-rendering: pixelated; cursor: pointer; }
#sc-camp[data-mode="cards"] #camp-cv { cursor: default; }

/* étiquettes des deux camps : centrées sur chaque moitié, suivent la ligne */
.camp-lbl { position: absolute; top: 34%; transform: translate(-50%, -50%); text-align: center; cursor: pointer; pointer-events: auto;
  transition: opacity .25s steps(4), transform .25s steps(4); white-space: nowrap; }
.camp-lbl.l { left: calc(var(--mid) / 2); }
.camp-lbl.r { left: calc((var(--mid) + 100vw) / 2); }
.camp-lbl b { display: block; font: calc(var(--u) * 13)/1 'Silk', monospace; text-transform: uppercase; color: var(--paper);
  text-shadow: var(--u) var(--u) 0 var(--ink), calc(var(--u) * 2) calc(var(--u) * 2) 0 var(--ink), calc(var(--u) * 3) calc(var(--u) * 3) 0 #96202a; }
.camp-lbl.r b { text-shadow: var(--u) var(--u) 0 var(--ink), calc(var(--u) * 2) calc(var(--u) * 2) 0 var(--ink), calc(var(--u) * 3) calc(var(--u) * 3) 0 #1d3d8a; }
.camp-lbl span { display: inline-block; margin-top: calc(var(--u) * 3); font: calc(var(--u) * 4.6)/1.2 'Pixelify', monospace; color: var(--paper);
  background: rgba(20, 16, 24, .72); padding: var(--u) calc(var(--u) * 3); box-shadow: 0 var(--u) 0 var(--ink); }
.camp-lbl em { display: block; margin-top: calc(var(--u) * 4); font: normal calc(var(--u) * 4)/1 'Silk', monospace; color: var(--sun); opacity: 0;
  text-shadow: var(--u) var(--u) 0 var(--ink); }
#sc-camp[data-side="manif"] .camp-lbl.l b, #sc-camp[data-side="crs"] .camp-lbl.r b { color: var(--sun); }
#sc-camp[data-side="manif"] .camp-lbl.l, #sc-camp[data-side="crs"] .camp-lbl.r { transform: translate(-50%, -50%) scale(1.12); }
#sc-camp[data-side="manif"] .camp-lbl.l em, #sc-camp[data-side="crs"] .camp-lbl.r em { opacity: 1; animation: nudge .6s steps(2) infinite; }
#sc-camp[data-side="manif"] .camp-lbl.r, #sc-camp[data-side="crs"] .camp-lbl.l { opacity: .45; }
#sc-camp[data-mode="cards"] .camp-lbl { opacity: 0; pointer-events: none; }

/* bouton retour (souris) */
.camp-back { position: absolute; left: calc(var(--u) * 5); top: calc(var(--u) * 5); font: calc(var(--u) * 4.2)/1 'Silk', monospace; color: var(--paper);
  padding: calc(var(--u) * 2) calc(var(--u) * 4); border: 0; cursor: pointer; }
.camp-back:hover { background: var(--sun); color: var(--ink); }

/* aides : une par mode */
#sc-camp .hints { bottom: calc(var(--u) * 4); }
#sc-camp[data-mode="cards"] .camp-hint-split, #sc-camp:not([data-mode="cards"]) .camp-hint-cards { display: none; }

/* encarts des cortèges */
#camp-cards { position: absolute; inset: 0; display: none; flex-direction: column; align-items: center; justify-content: center; gap: calc(var(--u) * 5);
  padding-bottom: calc(var(--u) * 10);
  background-image: repeating-conic-gradient(rgba(20, 16, 24, .62) 0 25%, rgba(20, 16, 24, .3) 0 50%); background-size: calc(var(--u) * 2) calc(var(--u) * 2); }
#sc-camp[data-mode="cards"] #camp-cards { display: flex; }
#camp-cards h2 { text-align: center; }
.camp-row { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(var(--u) * 4); max-width: calc(100vw - var(--u) * 16); }
.ccard { width: calc(64px * var(--cs, 2) + var(--u) * 6); padding: calc(var(--u) * 3); background: var(--bg); color: var(--paper); text-align: left; cursor: pointer; position: relative;
  border: 0; font: inherit; display: flex; flex-direction: column; gap: calc(var(--u) * 1.5);
  box-shadow: inset 0 0 0 var(--u) var(--ink), inset 0 calc(var(--u) * 2) 0 var(--hi), 0 calc(var(--u) * 1.5) 0 var(--ink); }
.ccard:hover { background: var(--bg); }
.ccard canvas { display: block; image-rendering: pixelated; box-shadow: 0 0 0 var(--u) var(--ink); margin-bottom: calc(var(--u) * 1.5); }
.ccard b { font: calc(var(--u) * 4.2)/1.15 'Silk', monospace; color: var(--paper); min-height: calc(var(--u) * 9.6); }
.ccard .pitch { font: calc(var(--u) * 3.9)/1.25 'Pixelify', monospace; color: var(--paper); min-height: calc(var(--u) * 10); }
.ccard .meta { font: calc(var(--u) * 3.4)/1 'Silk', monospace; color: var(--dim); }
.ccard.sel { transform: translateY(calc(var(--u) * -3)); background: #3d3456;
  box-shadow: inset 0 0 0 var(--u) var(--sun), inset 0 calc(var(--u) * 2) 0 var(--hi), 0 calc(var(--u) * 1.5) 0 var(--ink); }
.ccard.sel b { color: var(--sun); }
.ccard.lock { opacity: .7; }
#camp-detail { position: relative; width: min(calc(var(--u) * 260), calc(100vw - var(--u) * 16)); display: grid; grid-template-columns: 1fr auto; gap: calc(var(--u) * 2) calc(var(--u) * 8);
  padding: calc(var(--u) * 4) calc(var(--u) * 6); box-sizing: border-box; }
#camp-detail .acc { font-size: calc(var(--u) * 4.4); margin-top: calc(var(--u) * 1.5); }
#camp-detail .meta { font-size: calc(var(--u) * 3.8); color: var(--dim); margin-top: calc(var(--u) * 1.5); }
#camp-detail .meta b { color: var(--paper); font-weight: 400; }
#camp-detail .scen-go { align-self: end; display: flex; flex-direction: column; gap: calc(var(--u) * 2); }
#camp-detail .scen-go .mi { margin: 0; white-space: nowrap; }
#camp-detail .scen-go .quick small { margin-left: calc(var(--u) * 3); }
.camp-lbl em { display: table; margin-left: auto; margin-right: auto; background: rgba(20, 16, 24, .8); padding: var(--u) calc(var(--u) * 3) var(--u) var(--u); }
.camp-lbl em kbd { text-shadow: none; }
