/* ============================================================================
   TOKENS GONG — identité propre (drapeau guadeloupéen vert/blanc/rouge)
   Méthode OKI appliquée : thème sombre par défaut, clair opt-in WCAG AA,
   cadences gwoka. Le GONG garde SES couleurs (rouge d'action, vert drapeau).
   Un seul fichier de vérité — jamais de valeur recopiée à la main ailleurs.
   ============================================================================ */

:root {
	/* ── Noyau (thème sombre = défaut) ── */
	--noir: #0d0d0d; /* background */
	--noir-profond: #171210; /* surface (chaud, presque noir) */
	--creme: #faf6ef; /* foreground — blanc chaud */
	--line: rgba(255, 255, 255, 0.1); /* filets — jamais de gris plein */

	/* ── Drapeau GONG : rouge = agir/signaler · vert = valider/secondaire · blanc ── */
	--rouge-gong: #e11419; /* accent : couleur d'action principale */
	--rouge-vif: #ff2a30; /* survol du rouge */
	--vert-gong: #00a651; /* vert drapeau : validation, mémoire, second accent */
	--vert-vif: #12c766; /* survol du vert */
	--blanc-drapeau: #ffffff;

	/* ── Étendue (parcimonie : décorations, sémantique) ── */
	--jaune-sable: #f0c419; /* rappel, mise en exergue rare */
	--gris-sombre: #241c19;

	/* ── Sémantique dérivée ── */
	--muted: color-mix(in srgb, var(--creme) 68%, transparent);
	--muted-fort: color-mix(in srgb, var(--creme) 50%, transparent);
	--card-bg: rgba(255, 255, 255, 0.03);
	--card-bg-hover: rgba(255, 255, 255, 0.055);
	--accent: var(--rouge-gong);
	--accent-hover: var(--rouge-vif);
	--focus: var(--jaune-sable);

	/* ── Typographie ── */
	--font-display: 'Archivo', 'Arial Black', system-ui, sans-serif;
	--font-body: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

	/* ── Formes (angles nets, ≤ 6 px) ── */
	--radius-sm: 3px; /* boutons, tags, badges */
	--radius-md: 6px; /* cartes — jamais plus */
	--border-card: 1px solid var(--line);
	--border-btn: 2px solid var(--accent);

	/* ── Espacements ── */
	--space-1: 0.75rem;
	--space-2: 1rem;
	--space-3: 1.5rem;
	--space-4: 2rem;
	--space-5: 4rem;
	--space-6: 6rem;
	--container: 1200px;
	--container-lecture: 68ch; /* colonne de lecture (textes historiques longs) */

	/* ── Motion — cadences gwoka (rythme du ka) ── */
	--ease-ka: cubic-bezier(0.22, 1, 0.36, 1); /* temps fort : attaque franche, longue tenue */
	--ease-syncope: cubic-bezier(0.65, 0, 0.35, 1); /* contretemps : symétrique, urgent */
	--dur-tanbou: 120ms; /* double-croche — micro-interactions */
	--dur-mesure: 480ms; /* une mesure — entrées de section */
	--dur-phrase: 960ms; /* deux mesures — transitions de page */

	/* ── Divers ── */
	--nav-h: 4rem;
	--shadow-1: 0 2px 8px rgba(0, 0, 0, 0.35);
	--shadow-2: 0 8px 28px rgba(0, 0, 0, 0.45);
	color-scheme: dark;
}

/* ── Thème clair — opt-in, accents assombris pour WCAG AA ── */
html.light-theme {
	--noir: #faf6ef;
	--noir-profond: #f2ebdf;
	--creme: #14100e;
	--line: rgba(0, 0, 0, 0.12);
	--rouge-gong: #b3060c;
	--rouge-vif: #900409;
	--vert-gong: #007a3d;
	--vert-vif: #005e2f;
	--jaune-sable: #9a7b00;
	--gris-sombre: #e6dccb;
	--muted: color-mix(in srgb, var(--creme) 72%, transparent);
	--muted-fort: color-mix(in srgb, var(--creme) 55%, transparent);
	--card-bg: rgba(0, 0, 0, 0.03);
	--card-bg-hover: rgba(0, 0, 0, 0.055);
	--focus: #9a7b00;
	color-scheme: light;
}
