/* MCP Builder — Design tokens. Thème sombre par défaut. */ :root { --font: 'Inter', system-ui, sans-serif; --mono: 'JetBrains Mono', 'SF Mono', monospace; /* Typographie UI Ajuster `--ui-font-scale` fait evoluer toute l echelle legacy du site. */ --ui-font-scale: 1; --fz-base-3xs: 8px; --fz-base-3xs-plus: 8.5px; --fz-base-2xs: 9px; --fz-base-xs: 10px; --fz-base-xs-plus: 10.5px; --fz-base-sm: 11px; --fz-base-sm-plus: 11.5px; --fz-base-md: 12px; --fz-base-lg: 13px; --fz-base-xl: 14px; --fz-base-2xl: 16px; --fz-base-2xl-plus: 17px; --fz-base-hero: 18px; --fz-base-4xl: 20px; --fz-base-5xl: 24px; --fz-base-6xl: 32px; --fz-ui-3xs: calc(var(--fz-base-3xs) * var(--ui-font-scale)); --fz-ui-3xs-plus: calc(var(--fz-base-3xs-plus) * var(--ui-font-scale)); --fz-ui-2xs: calc(var(--fz-base-2xs) * var(--ui-font-scale)); --fz-ui-xs: calc(var(--fz-base-xs) * var(--ui-font-scale)); --fz-ui-xs-plus: calc(var(--fz-base-xs-plus) * var(--ui-font-scale)); --fz-ui-sm: calc(var(--fz-base-sm) * var(--ui-font-scale)); --fz-ui-sm-plus: calc(var(--fz-base-sm-plus) * var(--ui-font-scale)); --fz-ui-md: calc(var(--fz-base-md) * var(--ui-font-scale)); --fz-ui-lg: calc(var(--fz-base-lg) * var(--ui-font-scale)); --fz-ui-body: var(--fz-ui-lg); --fz-ui-xl: calc(var(--fz-base-xl) * var(--ui-font-scale)); --fz-ui-2xl: calc(var(--fz-base-2xl) * var(--ui-font-scale)); --fz-ui-2xl-plus: calc(var(--fz-base-2xl-plus) * var(--ui-font-scale)); --fz-ui-hero: calc(var(--fz-base-hero) * var(--ui-font-scale)); --fz-ui-4xl: calc(var(--fz-base-4xl) * var(--ui-font-scale)); --fz-ui-5xl: calc(var(--fz-base-5xl) * var(--ui-font-scale)); --fz-ui-6xl: calc(var(--fz-base-6xl) * var(--ui-font-scale)); /* Roles typo UI semantiques */ --fz-role-badge: var(--fz-ui-xs); --fz-role-caption: var(--fz-ui-xs); --fz-role-key: var(--fz-ui-xs); --fz-role-support: var(--fz-ui-sm); --fz-role-tab: var(--fz-ui-sm); --fz-role-meta: var(--fz-ui-md); --fz-role-label: var(--fz-ui-md); --fz-role-control: var(--fz-ui-md); --fz-role-copy: var(--fz-ui-md); --fz-role-section-title: var(--fz-ui-md); --fz-role-body: var(--fz-ui-lg); --fz-role-title: var(--fz-ui-xl); --fz-role-kpi: var(--fz-ui-2xl); --fz-role-display: var(--fz-ui-4xl); --fz-role-headline: var(--fz-ui-5xl); /* Compatibilite pages legacy */ --fz-page-label: var(--fz-role-caption); --fz-page-key: var(--fz-role-key); --fz-page-support: var(--fz-role-support); --fz-page-copy: var(--fz-role-copy); --fz-page-section-title: var(--fz-role-section-title); --fz-page-tab: var(--fz-role-tab); --fz-page-headline: var(--fz-role-headline); /* Surfaces & arrière-plans */ --bg: #0f0f0f; --bg2: #161616; --srf: #1a1a1a; --srf2: #222; --srf3: #2a2a2a; /* Bordures */ --brd: rgba(255, 255, 255, .06); --brdb: rgba(255, 255, 255, .10); /* Texte */ --tx: #e5e5e5; --tx2: #999; --tx3: #666; --tx-inverse: #fff; --panel-label: #f3f4f6; /* Accent (orange-rouge BL) */ --acc: #e07a5f; --acc-strong: #a0522d; --accbg: rgba(224, 122, 95, .08); --acch: rgba(224, 122, 95, .18); /* Vert (inclus / succès) */ --grn: #4ade80; --grn-ink: #34d399; --grnbg: rgba(74, 222, 128, .08); --grnstr: rgba(74, 222, 128, .18); /* Orange (à revoir / warning) */ --org: #fbbf24; --org-ink: #d97706; --org-strong: #eab308; --orgbg: rgba(251, 191, 36, .08); --orgstr: rgba(251, 191, 36, .18); /* Rouge (exclu / erreur) */ --red: #f87171; --redbg: rgba(248, 113, 113, .08); --redstr: rgba(248, 113, 113, .18); /* Violet (divers) */ --pur: #a78bfa; --purbg: rgba(167, 139, 250, .08); --custom: #e879f9; --custom-soft: rgba(232, 121, 249, .12); /* Bleu (info / lien) */ --blue: #60a5fa; --bluebg: rgba(96, 165, 250, .08); /* Accents workflow / assistance */ --workflow-accent: #ff9a72; --workflow-accent-hover: #ffb38b; --workflow-accent-bg: rgba(255, 138, 76, .08); --workflow-accent-bg-hover: rgba(255, 138, 76, .14); --workflow-accent-brd: rgba(255, 138, 76, .45); --assist-accent: #ffb08f; --assist-accent-soft: #ffd2bf; --assist-accent-bg: rgba(239, 127, 90, .08); --assist-accent-bg-hover: rgba(239, 127, 90, .14); --assist-accent-bg-busy: rgba(239, 127, 90, .12); --assist-accent-brd-soft: rgba(239, 127, 90, .18); --assist-accent-brd: rgba(239, 127, 90, .24); --assist-accent-glow: rgba(239, 127, 90, .34); /* Géométrie */ --r: 8px; --rl: 12px; /* Ombres */ --sh: 0 1px 2px rgba(0, 0, 0, .3); --shl: 0 4px 16px rgba(0, 0, 0, .4); } [data-theme="light"] { /* Surfaces & arrière-plans */ --bg: #faf9f6; --bg2: #f1efea; --srf: #fffefc; --srf2: #f4f2ed; --srf3: #e6e1d9; /* Bordures */ --brd: rgba(58, 52, 44, .12); --brdb: rgba(58, 52, 44, .20); /* Texte */ --tx: #2b2a27; --tx2: #5f5a52; --tx3: #918b82; --tx-inverse: #fff; --panel-label: #27221c; /* Accent */ --acc: #c96442; --acc-strong: #9f4f2f; --accbg: rgba(201, 100, 66, .06); --acch: rgba(201, 100, 66, .14); /* Vert */ --grn: #15803d; --grn-ink: #166534; --grnbg: rgba(22, 163, 74, .12); --grnstr: rgba(22, 163, 74, .28); /* Orange */ --org: #9a6700; --org-ink: #7c4d00; --org-strong: #ca8a04; --orgbg: rgba(217, 119, 6, .13); --orgstr: rgba(217, 119, 6, .30); /* Rouge */ --red: #b91c1c; --redbg: rgba(220, 38, 38, .10); --redstr: rgba(220, 38, 38, .26); /* Violet */ --pur: #6d28d9; --purbg: rgba(124, 58, 237, .10); --custom: #c026d3; --custom-soft: rgba(192, 38, 211, .08); /* Bleu */ --blue: #1f6fbf; --bluebg: rgba(31, 111, 191, .12); /* Accents workflow / assistance */ --workflow-accent: #dd6b42; --workflow-accent-hover: #c85a30; --workflow-accent-bg: rgba(201, 100, 66, .08); --workflow-accent-bg-hover: rgba(201, 100, 66, .14); --workflow-accent-brd: rgba(159, 79, 47, .32); --assist-accent: #d97757; --assist-accent-soft: #c96442; --assist-accent-bg: rgba(201, 100, 66, .08); --assist-accent-bg-hover: rgba(201, 100, 66, .14); --assist-accent-bg-busy: rgba(201, 100, 66, .12); --assist-accent-brd-soft: rgba(159, 79, 47, .18); --assist-accent-brd: rgba(159, 79, 47, .24); --assist-accent-glow: rgba(201, 100, 66, .28); /* Ombres */ --sh: 0 1px 2px rgba(0, 0, 0, .04); --shl: 0 4px 16px rgba(0, 0, 0, .06); }