/* Jetons du Design System Piconyme (« Carnet dessiné »), d'après tokens.json.
   Tailles de texte et espacements en rem (1rem = 16 px par défaut, suit le réglage de taille du navigateur).
   Aucun texte sous 0,9375rem (15 px). Pas de mode sombre : la page reste claire. */

/* Polices hébergées par l'application (licence OFL : voir fonts/OFL.txt). font-display: swap : le texte s'affiche
   tout de suite avec la police de secours, puis la police du carnet la remplace dès qu'elle est chargée. */
@font-face {
  font-family: "Kalam";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/kalam-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Quicksand";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/quicksand-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Quicksand";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/quicksand-latin-700-normal.woff2") format("woff2");
}

:root {
  color-scheme: light;

  /* Couleurs. ink sert au texte, aux traits et aux bordures ; les pastels servent de remplissage, jamais de texte. */
  --ground: #fffbf0;
  --ink: #3a3355;
  --peach: #ffb68a;
  --pink: #ffc4d6;
  --mint: #8fd3c8;
  --sky: #cfe8ff;
  --cream: #fff1d6;
  --paper: #ffffff;
  --banner: #000000;
  --banner-text: #ffffff;
  --banner-muted: #d0d0d0;

  /* Familles */
  --font-title: "Kalam", "Segoe Print", cursive;
  --font-body: "Quicksand", system-ui, sans-serif;

  /* Tailles de texte */
  --text-display: 2.25rem;
  --text-title-lg: 2.5rem;
  --text-title: 1.625rem;
  --text-title-sm: 1.5rem;
  --text-logo: 1.75rem;
  --text-body: 1.125rem;
  --text-body-sm: 0.9375rem; /* minimum absolu du produit (15 px) */
  --text-label: 1rem;
  --text-place-name: 1.125rem;
  --text-button: 1.1875rem;
  --text-button-sm: 1.125rem;
  --text-input: 1.0625rem;

  /* Espacements */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.75rem;
  --space-7: 3rem;

  /* Rayons */
  --radius-photo: 6px;
  --radius-field: 8px;
  --radius-pill: 999px;
  /* Bouton dessiné à la main : coins irréguliers. */
  --radius-hand: 255px 18px 225px 18px / 18px 225px 18px 255px;

  /* Ombres dures, sans flou */
  --shadow-button: 4px 5px 0 var(--ink);
  --shadow-photo: 5px 6px 0 var(--sky);
  --shadow-inset: inset 0 2px 0 rgba(58, 51, 85, 0.08);

  /* Traits */
  --border-regular: 2.5px;
  --border-strong: 3px;
}