/* ==========================================================================
   Design tokens — seule source des couleurs, tailles, rayons et durées.
   ========================================================================== */

@font-face {
  font-family: "Plex";
  src: url("../assets/fonts/ibm-plex-sans-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Plex";
  src: url("../assets/fonts/ibm-plex-sans-500.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Plex";
  src: url("../assets/fonts/ibm-plex-sans-600.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}

:root {
  /* Surfaces : du plus profond au plus clair */
  --bg: #141517;
  --surface-1: #1b1c1f;
  --surface-2: #232528;
  --surface-3: #2c2e32;
  --line: #2a2c30;
  --line-strong: #3a3d42;

  /* Texte */
  --text: #ece9e2;
  --text-2: #a09e98;
  --text-3: #858380; /* contraste 4,8:1 sur le fond (minimum recommandé : 4,5:1) */

  /* Accent de l'application (remplacé par la teinte du jeu dans un jeu) */
  --accent: #d6a24e;
  --accent-ink: #1a1409;

  /* États */
  --danger: #d4664f;
  --success: #8db37c;

  /* Teintes des jeux : sourdes, utilisées pour l'identité, jamais en aplat massif */
  --tint-imposteur: #c9633f;
  --tint-espion: #6e97bd;
  --tint-jamais: #b47ea5;
  --tint-association: #8eab78;
  --tint-devine: #c3b088;
  --tint-regle: #5fa89c;
  --tint-leplus: #d68a7e;

  /* Rayons volontairement différenciés */
  --r-input: 2px;
  --r-btn: 4px;
  --r-card: 6px;
  --r-sheet: 10px;

  /* Espacements (grille de 4 px) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;
  --gutter: 20px;

  /* Typographie */
  --font: "Plex", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-sm: 13px;
  --fs-base: 15px;
  --fs-md: 16px;
  --fs-lg: 18px;
  --fs-xl: 22px;
  --fs-2xl: 28px;
  --fs-3xl: 36px;

  /* Mouvement */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 120ms;
  --t-med: 200ms;

  --app-width: 520px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  color-scheme: dark;
}

/* Identité de chaque jeu : l'accent devient la teinte du jeu */
[data-game="imposteur"] { --accent: var(--tint-imposteur); }
[data-game="espion"] { --accent: var(--tint-espion); }
[data-game="jamais"] { --accent: var(--tint-jamais); }
[data-game="association"] { --accent: var(--tint-association); }
[data-game="devine"] { --accent: var(--tint-devine); }
[data-game="regle"] { --accent: var(--tint-regle); }
[data-game="leplus"] { --accent: var(--tint-leplus); }