/* Jeu Mandat : raccord de css/mandat.css (interface de jeu) sur la charte v4 */
.wp .mandat {
  --ink: var(--wp-ink);
  --ink-soft: rgba(27, 26, 23, .72);
  --paper: var(--wp-paper);
  --bg: var(--wp-bg);
  --card: var(--wp-paper);
  --clay: var(--wp-acc-2);
  --heat: var(--wp-acc);
  --muted: var(--wp-muted);
  --soft: var(--wp-ink-2);
  --fog: var(--wp-faint);
  --pin: var(--wp-acc);
  --gold: var(--wp-acc);
  --line: var(--wp-line);
  --green: var(--wp-ok);
  --green-dark: var(--wp-dark);
  --blue: #3F6A80;
  --pad-x: 24px;
  --font-ui: var(--wp-sans);
  --font-serif: var(--wp-sans);
  --font-mono: var(--wp-mono);
  --mandat-seal: var(--wp-acc);
  font-family: var(--wp-sans);
  color: var(--wp-ink);
}
.wp .mandat .serif { font-family: var(--wp-sans); }
.wp .mandat .mono { font-family: var(--wp-sans); font-weight: 800; letter-spacing: -.01em; }
.wp .mandat .kick { font: 500 10.5px/1.3 var(--wp-mono); letter-spacing: .12em; text-transform: uppercase; }
.wp .mandat .t-gold { color: var(--wp-acc-2); }
.wp .mandat .t-clay { color: var(--wp-acc-2); }

.wp .mandat .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 18px; border: 1px solid transparent; border-radius: 999px; background: transparent; color: inherit; font: 700 13.5px/1.2 var(--wp-sans); text-align: center; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.wp .mandat .btn:hover { opacity: 1; }
.wp .mandat .btn--dark { background: var(--wp-ink); color: var(--wp-paper); }
.wp .mandat .btn--dark:hover { background: var(--wp-dark); }
.wp .mandat .btn--gold { background: var(--wp-acc); color: var(--wp-ink); }
.wp .mandat .btn--gold:hover { background: var(--wp-acc-2); color: var(--wp-paper); }
.wp .mandat .btn--outline { border-color: var(--wp-ink); color: var(--wp-ink); }
.wp .mandat .btn--outline:hover { background: var(--wp-ink); color: var(--wp-paper); }
.wp .mandat .btn:disabled { opacity: .45; cursor: not-allowed; }

.wp .mandat-play { max-width: var(--wp-wrap); margin: 0 auto; padding: 0 var(--wp-gut) 48px; }
.wp .mandat-play > .wp-crumbs { padding: 18px 0 14px; }
.wp .mandat .mp-cockpit { border-radius: var(--wp-r-xl); overflow: hidden; }
.wp .mandat .mp-map { border: 0; border-radius: var(--wp-r-lg); }
.wp .mandat .mp-gmap__mode { border: 1px solid var(--wp-line-2); border-radius: 999px; background: var(--wp-paper); color: var(--wp-ink-2); font: 700 12px var(--wp-sans); letter-spacing: 0; text-transform: none; padding: 8px 14px; }
.wp .mandat .mp-gmap__mode.is-active { background: var(--wp-ink); border-color: var(--wp-ink); color: var(--wp-paper); }
.wp .mandat .mp-gmap__legend { font: 500 11px var(--wp-mono); color: var(--wp-muted); }

@media (max-width: 760px) {
  .wp .mandat { --pad-x: 16px; }
  .wp .mandat-play { padding: 0 0 32px; }
  .wp .mandat-play > .wp-crumbs { padding: 12px var(--wp-gut); }
  .wp .mandat .mp-cockpit { border-radius: 0; }
}