/* Cockpit design tokens — serif-only artisan system. Loaded BEFORE cockpit.css. Exposes OKLCH color + spacing + type scales. Dark theme (Studrix brand lock). Neutrals tinted gold (H≈85). */ :root { /* --- Surface & ink --- */ --bg: oklch(12% 0.014 65); /* encre sombre chaude, jamais #000 */ --surface: oklch(18% 0.016 68); /* card raised */ --surface-2: oklch(23% 0.016 68); /* card hover / nested */ --border: oklch(30% 0.018 70); /* hairline */ --border-soft: oklch(24% 0.015 70); --text: oklch(93% 0.020 85); /* papier ivoire */ --text-muted: oklch(80% 0.022 80); /* 8.8:1 sur surface — lisible plein soleil */ --text-dim: oklch(70% 0.020 75); /* 6.2:1 — labels/tabs AA meme en fs-xs */ --text-faint: oklch(60% 0.018 75); /* 4.78:1 sur --bg UNIQUEMENT — echoue AA sur surface (4.17:1) et surface-2 (3.72:1). Jamais sur card. */ /* --- Accents --- */ --accent: oklch(80% 0.148 86); /* LB-Elec gold (eclair #E6B432) */ --accent-ink: oklch(70% 0.150 85); /* deeper gold for text-on-surface AA */ --accent-soft: oklch(35% 0.070 86); /* glow-less tint for hover/bg */ /* --- Category dots (activité métier) — small punchy colors on dark canvas --- */ --cat-electricite: oklch(70% 0.195 250); /* bleu électrique franc, haute chroma */ --cat-plaquo: oklch(92% 0.060 90); /* ivoire doré, suffisamment saturé pour ressortir */ --cat-menuiserie: oklch(68% 0.150 48); /* marron-orange cognac, chaleureux */ --cat-autre: oklch(68% 0.080 220); /* gris bleu visible, pas terne */ /* --- Feedback states --- */ --ok: oklch(62% 0.110 145); /* vert sapin sourd */ --warn: oklch(70% 0.150 70); /* ocre */ --danger: oklch(55% 0.170 28); /* rouge terre */ --danger-ink: oklch(70% 0.160 28); /* rouge texte AA sur surface — fonds/bordures restent --danger */ /* --- Spacing (4pt) --- */ --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px; --space-xl: 32px; --space-2xl: 48px; --space-3xl: 72px; /* --- Type scale (fixed rem, ratio 1.25) --- */ --fs-xs: 0.75rem; /* 12 */ --fs-sm: 0.875rem; /* 14 */ --fs-md: 1rem; /* 16 */ --fs-lg: 1.25rem; /* 20 */ --fs-xl: 1.563rem; /* 25 */ --fs-2xl: 1.953rem; /* 31 */ --fs-3xl: 2.441rem; /* 39 */ /* --- Typography stacks (serif-only, no Inter/Playfair/Plex) --- */ --font-display: "Rozha One", "Iowan Old Style", Georgia, "Times New Roman", serif; --font-body: "Literata", "Iowan Old Style", Charter, Georgia, serif; --font-mono: ui-monospace, "Departure Mono", "SF Mono", Consolas, monospace; /* --- Radius (ledger corners, 2 options only) --- */ --radius-sm: 4px; --radius-0: 0; /* --- Motion --- */ --ease-out: cubic-bezier(0.2, 0.7, 0.3, 1); --dur-instant: 120ms; --dur-settle: 180ms; --dur-page: 320ms; /* --- Elevation (discrete, no AI slop shadows) --- */ --shadow-raise: 0 1px 0 oklch(10% 0 0 / 0.6); --shadow-deep: 0 4px 12px oklch(8% 0 0 / 0.4); /* --- Touch target (gloves minimum) --- */ --touch: 48px; /* --- Layout --- */ --sidebar-w: 256px; --topbar-h: 56px; --content-max: 960px; } /* Light theme (bright sun on site) -- slate light + bronze gold. Active only on (explicit choice; default stays dark). */ :root[data-theme="light"] { --bg: oklch(93% 0.012 250); --surface: oklch(98% 0.006 250); --surface-2: oklch(95% 0.011 250); --border: oklch(85% 0.016 250); --border-soft: oklch(89% 0.012 250); --text: oklch(32% 0.020 250); --text-muted: oklch(45% 0.020 250); --text-dim: oklch(52% 0.018 250); --text-faint: oklch(50% 0.016 250); /* AA on --bg (4.9:1); tuned from 56% which failed 4.5 */ --accent: oklch(60% 0.140 78); --accent-ink: oklch(50% 0.130 74); --accent-soft: oklch(90% 0.050 85); /* Category dots re-tuned for light canvas (originals 70-92% L wash out on 98% surface). */ --cat-electricite: oklch(55% 0.190 250); --cat-plaquo: oklch(60% 0.140 85); --cat-menuiserie: oklch(55% 0.150 48); --cat-autre: oklch(55% 0.070 235); /* Feedback inks darkened for AA text on light surface (badge / btn-danger). */ --ok: oklch(50% 0.120 145); --warn: oklch(55% 0.150 70); --danger: oklch(52% 0.180 28); --danger-ink: oklch(50% 0.180 28); } @media (prefers-reduced-motion: reduce) { :root { --dur-instant: 1ms; --dur-settle: 1ms; --dur-page: 1ms; } }