/* ROB 92 / 26 — tokens partagés. Direction : signalétique de fête 1992, formes Memphis, ombres pleines décalées. */
/* Polices servies en local : rien ne dépend d'internet le soir de la partie */
@font-face { font-family: 'Bungee'; src: url('/fonts/bungee-latin-400-normal.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Archivo'; src: url('/fonts/archivo-latin-400-normal.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Archivo'; src: url('/fonts/archivo-latin-600-normal.woff2') format('woff2'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Archivo'; src: url('/fonts/archivo-latin-800-normal.woff2') format('woff2'); font-weight: 800; font-display: swap; }
@font-face { font-family: 'Archivo'; src: url('/fonts/archivo-latin-900-normal.woff2') format('woff2'); font-weight: 900; font-display: swap; }

:root {
  --ink: #14114a;          /* nuit indigo */
  --ink-2: #221d6e;
  --ink-3: #2f2990;
  --sun: #ffc933;          /* jaune soleil */
  --pink: #ff3d8b;         /* rose néon */
  --lagoon: #16c8b4;       /* lagon */
  --tang: #ff7a1a;         /* mandarine */
  --paper: #ffffff;
  --red: #e62639;
  --blue: #2356ff;
  --ok: #22c55e;
  --ko: #ef4444;

  --slot-A: var(--sun);
  --slot-B: var(--pink);
  --slot-C: var(--lagoon);
  --slot-D: var(--tang);

  --display: 'Bungee', 'Impact', 'Arial Black', sans-serif;
  --body: 'Archivo', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --shadow: 6px 6px 0 var(--ink);
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--ink);
  color: var(--paper);
  font-family: var(--body);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
button { font: inherit; color: inherit; cursor: pointer; }
button:focus-visible, input:focus-visible { outline: 4px solid var(--sun); outline-offset: 3px; }

/* Fond : confettis géométriques très discrets */
.memphis {
  background-color: var(--ink);
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255, 201, 51, .10) 0 6px, transparent 7px),
    radial-gradient(circle at 82% 72%, rgba(22, 200, 180, .10) 0 8px, transparent 9px),
    linear-gradient(135deg, transparent 47%, rgba(255, 61, 139, .08) 47% 53%, transparent 53%);
  background-size: 180px 180px, 240px 240px, 90px 90px;
}

.logo {
  font-family: var(--display);
  line-height: .9;
  letter-spacing: .01em;
  color: var(--sun);
  text-shadow: .06em .06em 0 var(--pink), .12em .12em 0 var(--ink-3);
  white-space: nowrap;
}
.logo .slash { color: var(--lagoon); display: inline-block; transform: skewX(-12deg); margin: 0 .08em; }

.slot-A { --c: var(--slot-A); }
.slot-B { --c: var(--slot-B); }
.slot-C { --c: var(--slot-C); }
.slot-D { --c: var(--slot-D); }

.team-red { --team: var(--red); }
.team-blue { --team: var(--blue); }

.hidden-card {
  background-image: repeating-linear-gradient(45deg, rgba(20, 17, 74, .18) 0 12px, transparent 12px 24px) !important;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}