/* tokens/colors.css */
:root{
/* --- Base : neige froide, atelier en plein jour --- */
--surface-0:#F7F9FA;
--surface-1:#FFFFFF;
--surface-2:#EDF1F2;
--surface-3:#E0E6E8;
--surface-4:#CFD8DA;
--line-1:rgba(31,58,63,0.12);
--line-2:rgba(31,58,63,0.2);
--line-strong:rgba(31,58,63,0.34);

/* --- Encre : bandes profondes, alternance avec la neige --- */
--ink-900:#0F1F22;
--ink-800:#1F3A3F;
--ink-700:#2A4B51;
--ink-600:#3A6068;
--ink-400:#5E858B;
--ink-300:#93B3B6;
--surface-ink:var(--ink-800);
--line-on-ink:rgba(247,249,250,0.16);
--line-on-ink-strong:rgba(247,249,250,0.3);

/* --- Brun foncé : la matière, en contrepoint de l'encre --- */
--brown-900:#1E0E06;
--brown-800:#33180B;
--brown-700:#4A2210;
--brown-600:#6B2D12;

/* --- Texte --- */
--text-primary:#12262A;
--text-secondary:#4C6B70;
--text-tertiary:#77949A;
--text-disabled:#A6BBBF;
--text-on-accent:#FBFCFC;
--text-on-ink:#F4F8F8;
--text-on-ink-soft:rgba(244,248,248,0.7);

/* --- Cuivre / or, prélevés sur l'emblème Waynholl --- */
--copper-800:#4A2210;
--copper-700:#6B2D12;
--copper-600:#8C3D16;
--copper-500:#A64C1D;
--copper-400:#B4552A;
--copper-300:#DE9C57;
--gold-500:#9A7220;
--gold-400:#C4922E;
--gold-300:#EFC873;

--accent:var(--copper-500);
--accent-strong:var(--copper-600);
--accent-soft:#F6E7DA;
--accent-glint:var(--copper-300);

/* --- Dégradés : dynamiser sans jamais salir --- */
--grad-ink:linear-gradient(168deg,#24444A 0%,#1F3A3F 46%,#122529 100%); /* @kind other */
--grad-ink-radial:radial-gradient(120% 130% at 12% 0%,#2A4B51 0%,#1F3A3F 48%,#0F1F22 100%); /* @kind other */
--grad-earth:linear-gradient(112deg,#33180B 0%,#4A2210 38%,#1F3A3F 100%); /* @kind other */
--grad-snow:linear-gradient(180deg,#FFFFFF 0%,#F7F9FA 58%,#EDF1F2 100%); /* @kind other */
--grad-hairline:linear-gradient(90deg,transparent,var(--line-2) 12%,var(--line-2) 88%,transparent); /* @kind other */

/* --- Verre : uniquement sur la nav et les éléments flottants --- */
--glass-light:rgba(247,249,250,0.13);
--glass-light-line:rgba(247,249,250,0.26);
--glass-snow:rgba(247,249,250,0.78);
--glass-ink:rgba(18,38,42,0.6);
--glass-ink-line:rgba(31,58,63,0.14);
--glass-blur:blur(24px) saturate(1.6); /* @kind other */

/* --- Sémantique --- */
--success:#2F6144;
--warning:var(--gold-500);
--danger:#A63A26;
--focus-ring:var(--copper-500);

/* --- Papeterie (impression, exports) --- */
--paper:#F7F9FA;
--paper-ink:#12262A;
}

/* tokens/typography.css */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Expanded:wght@500;600;700&family=Archivo:wght@400;500;600;700&family=Geist:wght@300;400;500;600&family=Geist+Mono:wght@400;500&display=swap');
:root{
--font-display:'Archivo Expanded','Archivo',sans-serif;
--font-sans:'Archivo',system-ui,sans-serif;
--font-body:'Geist',system-ui,sans-serif;
--font-mono:'Geist Mono',ui-monospace,'SF Mono',monospace;

--text-xs:0.6875rem;
--text-sm:0.8125rem;
--text-base:1rem;
--text-lg:1.1875rem;
--text-xl:1.5rem;
--text-2xl:2.125rem;
--text-3xl:3rem;
--text-4xl:4rem;
--text-5xl:5.5rem;

--lh-tight:1.0; /* @kind other */
--lh-snug:1.2; /* @kind other */
--lh-body:1.62; /* @kind other */

--ls-tight:-0.03em;
--ls-label:0.14em;
--ls-wide:0.22em;
}

/* tokens/spacing.css */
:root{
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:24px;
--space-6:32px;
--space-7:48px;
--space-8:64px;
--space-9:96px;
--space-10:128px;

/* Arêtes fines : rien n'est arrondi au-delà de 4px, sauf les repères circulaires */
--radius-none:0px;
--radius-sm:2px;
--radius-md:3px;
--radius-lg:4px;
--radius-dot:999px;

--container-max:1320px;
--border-hairline:1px solid var(--line-1);
--border-visible:1px solid var(--line-2);

--ease-precise:cubic-bezier(0.4,0,0.2,1); /* @kind other */
--duration-fast:130ms; /* @kind other */
--duration-base:220ms; /* @kind other */
}

/* tokens/base.css */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
img{display:block}
body{background:var(--surface-0);color:var(--text-primary);font-family:var(--font-body);font-weight:400;font-size:var(--text-base);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;letter-spacing:var(--ls-tight);line-height:var(--lh-tight);margin:0;color:var(--text-primary)}
p{margin:0}
a{color:var(--copper-500);text-decoration:none}
a:hover{color:var(--copper-600)}
.ws-label{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-tertiary)}
.ws-card{background:var(--surface-1);border:var(--border-hairline);border-radius:var(--radius-sm)}
.ws-card-ink{background:var(--grad-ink);border:1px solid var(--line-on-ink);border-radius:var(--radius-sm);color:var(--text-on-ink)}
.ws-glass{background:var(--glass-light);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-light-line);border-radius:var(--radius-sm)}
.ws-glass-snow{background:var(--glass-snow);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--line-1)}

/* styles.css */
@import url('tokens/colors.css');
@import url('tokens/typography.css');
@import url('tokens/spacing.css');
@import url('tokens/base.css');

