/* ============================================================
   TimeWitness — Design Tokens
   Source unique de vérité du style. Importer AVANT tout le reste.

   RÈGLE MAÎTRESSE : le SOMBRE est réservé à la MAP / globe (satellite).
   TOUTES les autres surfaces (galeries, fiches, forum, profil, blog…)
   sont en tons clairs « Apple ». Accent unique : l'OR.
   « Le monde mérite qu'on s'en souvienne. »
   ============================================================ */

:root{
  /* ---------- Couleurs — surfaces claires (UI par défaut) ---------- */
  --tw-bg:#fbfbfd;             /* fond de page off-white            */
  --tw-surface:#ffffff;        /* cartes, barres, panneaux          */
  --tw-surface-2:#f4f5f7;      /* surface secondaire / hover        */
  --tw-field:#f1f2f5;          /* fond des champs (recherche)       */
  --tw-line:rgba(20,30,50,.10);        /* séparateurs fins          */
  --tw-line-strong:rgba(20,30,50,.16);

  /* Texte */
  --tw-ink:#11151c;            /* texte principal                   */
  --tw-ink-soft:#6a7280;       /* texte secondaire                  */
  --tw-ink-faint:#9aa1ab;      /* tertiaire / placeholder           */
  --tw-on-dark:#ffffff;
  --tw-on-dark-soft:rgba(255,255,255,.62);

  /* Accent unique : OR */
  --tw-gold:#bd9742;           /* or de référence (sur clair)       */
  --tw-gold-deep:#a87f1e;      /* or lisible en TEXTE sur blanc     */
  --tw-gold-light:#e6c878;     /* or sur fond SOMBRE (globe)        */

  /* Sombre — RÉSERVÉ au globe / map */
  --tw-dark:#070b12;           /* ciel étoilé / fond carte          */
  --tw-dark-2:#0d1320;
  --tw-pin:#c8a24b;            /* points photo sur le globe         */

  /* Verre (UI flottante AU-DESSUS du globe sombre uniquement) */
  --tw-glass:rgba(255,255,255,.80);
  --tw-glass-strong:rgba(255,255,255,.92);
  --tw-glass-border:rgba(255,255,255,.55);
  --tw-blur:blur(26px) saturate(180%);

  /* Statuts / sémantique */
  --tw-success:#2e7d32;
  --tw-info:#2563c9;
  --tw-warn:#c2562a;
  --tw-danger:#c0392b;
  --tw-purple:#9333a8;

  /* Droits (visibilité ≠ réutilisation) */
  --tw-rights-a:#6a7280;       /* A — Consultation seule (© réservés)        */
  --tw-rights-b:#2e7d32;       /* B — Usage libre non commercial (≈ CC BY-NC) */

  /* ---------- Typographie ---------- */
  --tw-font:-apple-system,"SF Pro Display","Inter",system-ui,"Segoe UI",Roboto,sans-serif;
  --tw-font-serif:"New York","Iowan Old Style",Georgia,"Times New Roman",serif; /* récit / fiche photo */
  --tw-font-mono:ui-monospace,"SF Mono",Menlo,monospace;

  /* Échelle typographique (taille / interligne) */
  --tw-fz-display:46px;  --tw-lh-display:1.04;
  --tw-fz-h1:30px;       --tw-lh-h1:1.10;
  --tw-fz-h2:23px;       --tw-lh-h2:1.15;
  --tw-fz-h3:19px;       --tw-lh-h3:1.25;
  --tw-fz-body:14.5px;   --tw-lh-body:1.55;
  --tw-fz-sm:13px;
  --tw-fz-caption:12px;
  --tw-fz-micro:10.5px;

  --tw-fw-light:300; --tw-fw-regular:400; --tw-fw-medium:500;
  --tw-fw-semi:600;  --tw-fw-bold:700;
  --tw-track-brand:.16em;      /* lettrage du logotype TIMEWITNESS  */
  --tw-track-caps:.06em;

  /* ---------- Espacement (base 4) ---------- */
  --tw-1:4px;  --tw-2:8px;  --tw-3:12px; --tw-4:16px; --tw-5:20px;
  --tw-6:24px; --tw-7:32px; --tw-8:40px; --tw-9:48px; --tw-10:60px; --tw-12:80px;

  /* ---------- Rayons ---------- */
  --tw-r-xs:8px; --tw-r-sm:11px; --tw-r-md:14px;
  --tw-r-lg:18px; --tw-r-xl:24px; --tw-r-pill:999px;

  /* ---------- Ombres ---------- */
  --tw-shadow-sm:0 1px 4px rgba(0,0,0,.10);
  --tw-shadow:0 10px 30px rgba(25,35,60,.10);
  --tw-shadow-md:0 16px 40px rgba(25,35,60,.18);
  --tw-shadow-lg:0 22px 60px rgba(0,0,0,.34);   /* verre sur globe   */
  --tw-shadow-nav:0 2px 16px rgba(8,12,24,.08);

  /* ---------- Mouvement ---------- */
  --tw-ease:cubic-bezier(.22,.61,.36,1);
  --tw-t-fast:.15s; --tw-t:.2s; --tw-t-slow:.35s;

  /* ---------- Couches (z-index) ---------- */
  --tw-z-map:0; --tw-z-chrome:5; --tw-z-subnav:15; --tw-z-nav:20; --tw-z-modal:50;

  /* ---------- Points de rupture (responsive) ---------- */
  --tw-bp-mobile:760px; --tw-bp-tablet:1024px; --tw-bp-wide:1500px;
}

/* ------------------------------------------------------------
   Primitives réutilisables (facultatif : classes utilitaires)
   ------------------------------------------------------------ */
.tw-pill{border-radius:var(--tw-r-pill)}
.tw-card{background:var(--tw-surface);border:1px solid var(--tw-line);
  border-radius:var(--tw-r-xl);box-shadow:var(--tw-shadow)}
.tw-glass{background:var(--tw-glass);-webkit-backdrop-filter:var(--tw-blur);
  backdrop-filter:var(--tw-blur);border:1px solid var(--tw-glass-border)}

/* ============================================================
   ALIAS LEGACY — branche le prototype existant sur les tokens.
   Le <link tokens.css> est injecté APRÈS le <style> de chaque page :
   ces définitions GAGNENT donc la cascade et pilotent les pages
   (les :root locaux deviennent inertes). Source unique = ce fichier.
   NB : le globe (page sombre) n'utilise PAS --bg (fond en dégradé direct
   posé sur html,body) → --bg peut donc être centralisé ici sans risque.
   ============================================================ */
:root{
  --bg:var(--tw-bg);
  --card:var(--tw-surface);
  --surface:var(--tw-surface);
  --ink:var(--tw-ink);
  --soft:var(--tw-ink-soft);
  --ink-soft:var(--tw-ink-soft);
  --line:var(--tw-line);
  --line-strong:var(--tw-line-strong);
  --gold:var(--tw-gold);
  --gold-deep:var(--tw-gold-deep);
  --shadow:var(--tw-shadow);
  --shadow-sm:var(--tw-shadow-sm);
  --font:var(--tw-font);
  --serif:var(--tw-font-serif);
  --radius:var(--tw-r-xl);
  --glass:var(--tw-glass);
  --glass-strong:var(--tw-glass-strong);
}