/* Design tokens : couleurs, rayons, ombres, typographie. Thème clair par défaut. */
:root {
  --canvas: #eff1f5;
  --carte: #ffffff;
  --encre: #15181f;
  --gris: #656c7a;
  --gris-clair: #949ba8;
  --pin: #1e3a6e;
  --pin-vif: #2a4e8c;
  --pin-pale: #e2e9f5;
  --sur-pin: #ffffff;
  --ambre: #b0621f;
  --ambre-pale: #fbeee1;
  --vert: #2f7a4d;
  --trait: rgba(21, 24, 31, 0.09);
  --trait-fort: rgba(21, 24, 31, 0.17);
  --anneau: rgba(30, 58, 110, 0.13);
  --r-s: 8px;
  --r-m: 12px;
  --r-l: 18px;
  --r-xl: 24px;
  --ombre: 0 1px 2px rgba(21, 24, 31, 0.04), 0 10px 30px -18px rgba(21, 24, 31, 0.35);
  --ombre-h: 0 1px 2px rgba(21, 24, 31, 0.05), 0 18px 40px -22px rgba(21, 24, 31, 0.45);
  --ombre-flot: 0 30px 70px -20px rgba(21, 24, 31, 0.35);
  --barre-fond: rgba(239, 241, 245, 0.84);
  --t: 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  --serif: Georgia, "Iowan Old Style", "Times New Roman", serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --h-barre: 64px;
  --h-onglets: 0px;
  color-scheme: light;
}

html[data-theme="sombre"] {
  --canvas: #0e1117;
  --carte: #171b23;
  --encre: #e4e8ef;
  --gris: #949cac;
  --gris-clair: #6a7280;
  --pin: #7fa8e8;
  --pin-vif: #9cbdf0;
  --pin-pale: #1b2536;
  --sur-pin: #0b1018;
  --ambre: #e0a05a;
  --ambre-pale: #2b2117;
  --vert: #6fc48f;
  --trait: rgba(255, 255, 255, 0.09);
  --trait-fort: rgba(255, 255, 255, 0.19);
  --anneau: rgba(127, 168, 232, 0.18);
  --ombre: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 30px -18px rgba(0, 0, 0, 0.8);
  --ombre-h: 0 1px 2px rgba(0, 0, 0, 0.5), 0 18px 40px -22px rgba(0, 0, 0, 0.9);
  --ombre-flot: 0 30px 70px -20px rgba(0, 0, 0, 0.9);
  --barre-fond: rgba(14, 17, 23, 0.86);
  color-scheme: dark;
}