@cyrilld/zestds 0.1.0 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/styles/theme.css","../src/styles/fonts.css","../src/styles/typography.css","../src/styles/base.css"],"sourcesContent":["/* Zest Design System — design tokens.\n *\n * Ported from the Figma \"❖ Design System V2.0\" (via the zest-design-system /\n * @zest/ui delivery). Colors are layered — a component should only ever\n * reference the LAST layer, never a raw ramp or a utility palette directly:\n *\n * 1. RAMPS sourced from Figma, numbered 50 -> 950 --zds-color-brand-600\n * 2. UTILITY categorization only (badges, chart series) --zds-color-utility-lime-500\n * 3. ROLES meaning, not hue — what components cite --zds-color-text-primary\n *\n * Zest's Figma numbers ramps 10 -> 600 (pivot at 100); this scale renumbers\n * them 50 -> 950 (pivot/action at 600):\n *\n * 20 -> 50 30 -> 100 40 -> 200 50 -> 300 60 -> 400\n * 100 -> 500 200 -> 600 300 -> 700 400 -> 800 500 -> 900 600 -> 950\n *\n * The `navy` ramp is the one exception: it keeps Zest's own 9-step scale\n * (10 -> 100, lightest to darkest) because there's no equivalent step to\n * align it to on the renumbered scale.\n */\n\n:root {\n /* ============================================================\n * LAYER 1 — RAMPS\n * ============================================================ */\n\n --zds-color-white: #ffffff;\n --zds-color-black: #000000;\n\n /* A named transparent, so a component can write \"no fill\" without falling\n back to a literal. The reference theme also exposes `alpha-white` and\n `alpha-black`, which are `white` and `black` under a second name — not\n ported: two names for one value drift apart. */\n --zds-color-transparent: rgb(0 0 0 / 0);\n\n /* Brand mark — logo and gradients only. 1.83:1 on white: cannot carry text. */\n --zds-color-mark: #00d85d;\n\n /* Figma \"Couleurs/Bleu (Primaire)\". 600 is the action hue — it matches\n Blue/200 in Figma, not the Blue/100 pivot, which only holds 3.60:1 under\n white text. The pivot lands on 500 instead. */\n --zds-color-brand-50: #e6f0ff;\n --zds-color-brand-100: #d2e3ff;\n --zds-color-brand-200: #c7d9ff;\n --zds-color-brand-300: #afc7ff;\n --zds-color-brand-400: #7da3ff;\n --zds-color-brand-500: #4481ff;\n --zds-color-brand-600: #2e6ef2;\n --zds-color-brand-700: #225ad1;\n --zds-color-brand-800: #1a46a6;\n --zds-color-brand-900: #163c8c;\n --zds-color-brand-950: #123066;\n\n /* Figma \"Couleurs/Gris\" — backgrounds and icons. */\n --zds-color-gray-50: #fafafa;\n --zds-color-gray-100: #f5f5f5;\n --zds-color-gray-200: #e9eaeb;\n --zds-color-gray-300: #d5d7da;\n --zds-color-gray-400: #a4a7ae;\n --zds-color-gray-500: #717680;\n --zds-color-gray-600: #535862;\n --zds-color-gray-700: #414651;\n --zds-color-gray-800: #252b37;\n --zds-color-gray-900: #181d27;\n --zds-color-gray-950: #0a0d12;\n\n /* Figma \"Couleurs/Bleu marine\" — text and neutral borders. Keeps Zest's own\n 10 -> 100 numbering (9 steps, 100 is darkest): no equivalent step exists\n on the renumbered scale to align it to. */\n --zds-color-navy-10: #f9fafb;\n --zds-color-navy-20: #f1f3f5;\n --zds-color-navy-30: #e4e7eb;\n --zds-color-navy-40: #d3d7de;\n --zds-color-navy-50: #c1c6cf;\n --zds-color-navy-60: #a6acb8;\n --zds-color-navy-70: #7e8694;\n --zds-color-navy-80: #4d5971;\n --zds-color-navy-100: #21304e;\n\n /* Figma \"Couleurs/Rouge (Erreur)\" */\n --zds-color-error-50: #fef3f2;\n --zds-color-error-100: #fee4e2;\n --zds-color-error-200: #fecdca;\n --zds-color-error-300: #fda29b;\n --zds-color-error-400: #f97066;\n --zds-color-error-500: #f04438;\n --zds-color-error-600: #d92d20;\n --zds-color-error-700: #b42318;\n --zds-color-error-800: #912018;\n --zds-color-error-900: #7a271a;\n --zds-color-error-950: #55160c;\n\n /* Figma \"Couleurs/Orange (Avertissement)\" */\n --zds-color-warning-50: #fffaeb;\n --zds-color-warning-100: #fef0c7;\n --zds-color-warning-200: #fedf89;\n --zds-color-warning-300: #fec84b;\n --zds-color-warning-400: #fdb022;\n --zds-color-warning-500: #f79009;\n --zds-color-warning-600: #dc6803;\n --zds-color-warning-700: #b54708;\n --zds-color-warning-800: #93370d;\n --zds-color-warning-900: #7a2e0e;\n --zds-color-warning-950: #4e1d09;\n\n /* Figma \"Couleurs/Vert (Succès)\" */\n --zds-color-success-50: #e3fceb;\n --zds-color-success-100: #d1f6dd;\n --zds-color-success-200: #b6edca;\n --zds-color-success-300: #96e1b4;\n --zds-color-success-400: #69d49a;\n --zds-color-success-500: #1ebb71;\n --zds-color-success-600: #119b57;\n --zds-color-success-700: #0b7f45;\n --zds-color-success-800: #076738;\n --zds-color-success-900: #05522d;\n --zds-color-success-950: #033d22;\n\n /* Gradients — Figma \"Dégradés\". Names describe a product usage, not a hue:\n don't translate them, don't invent new ones. */\n --zds-gradient-marque-90: linear-gradient(90deg, #00d85d 0%, #30d2e0 100%);\n --zds-gradient-marque-45: linear-gradient(45deg, #00d85d 0%, #30d2e0 100%);\n --zds-gradient-marque-26: linear-gradient(26.5deg, #00d85d 0%, #30d2e0 100%);\n\n --zds-gradient-ecouter-90: linear-gradient(90deg, #00d85d 0%, #c5e439 100%);\n --zds-gradient-ecouter-45: linear-gradient(45deg, #00d85d 0%, #c5e439 100%);\n --zds-gradient-ecouter-26: linear-gradient(26.5deg, #00d85d 0%, #c5e439 100%);\n\n --zds-gradient-reussir-90: linear-gradient(90deg, #4481ff 0%, #30d2e0 100%);\n --zds-gradient-reussir-45: linear-gradient(45deg, #4481ff 0%, #30d2e0 100%);\n --zds-gradient-reussir-26: linear-gradient(26.5deg, #4481ff 0%, #30d2e0 100%);\n\n --zds-gradient-partager-90: linear-gradient(90deg, #875bf7 0%, #c86dd7 100%);\n --zds-gradient-partager-45: linear-gradient(45deg, #875bf7 0%, #c86dd7 100%);\n --zds-gradient-partager-26: linear-gradient(26.5deg, #875bf7 0%, #c86dd7 100%);\n\n --zds-gradient-changelog-90: linear-gradient(90deg, #f79009 0%, #ee46bc 100%);\n --zds-gradient-changelog-45: linear-gradient(45deg, #f79009 0%, #ee46bc 100%);\n --zds-gradient-changelog-26: linear-gradient(26.5deg, #f79009 0%, #ee46bc 100%);\n\n --zds-gradient-alerte-90: linear-gradient(90deg, #f04438 0%, #f79009 100%);\n --zds-gradient-alerte-45: linear-gradient(45deg, #f04438 0%, #f79009 100%);\n --zds-gradient-alerte-26: linear-gradient(26.5deg, #f04438 0%, #f79009 100%);\n\n --zds-gradient-myzest-90: linear-gradient(90deg, #f79009 0%, #f4d431 100%);\n --zds-gradient-myzest-45: linear-gradient(45deg, #f79009 0%, #f4d431 100%);\n --zds-gradient-myzest-26: linear-gradient(26.5deg, #f79009 0%, #f4d431 100%);\n\n --zds-gradient-piloter-90: linear-gradient(90deg, #4a5b86 0%, #909bb9 100%);\n --zds-gradient-piloter-45: linear-gradient(45deg, #4a5b86 0%, #909bb9 100%);\n --zds-gradient-piloter-26: linear-gradient(26.5deg, #4a5b86 0%, #909bb9 100%);\n\n /* ============================================================\n * LAYER 2 — UTILITY PALETTES\n * For categorization (badges, tags, chart series) — not for meaning.\n * \"error\" or \"success\" belong to layer 3 instead.\n * ============================================================ */\n --zds-color-utility-brand-50: var(--zds-color-brand-50);\n --zds-color-utility-brand-100: var(--zds-color-brand-100);\n --zds-color-utility-brand-200: var(--zds-color-brand-200);\n --zds-color-utility-brand-300: var(--zds-color-brand-300);\n --zds-color-utility-brand-400: var(--zds-color-brand-400);\n --zds-color-utility-brand-500: var(--zds-color-brand-500);\n --zds-color-utility-brand-600: var(--zds-color-brand-600);\n --zds-color-utility-brand-700: var(--zds-color-brand-700);\n --zds-color-utility-brand-800: var(--zds-color-brand-800);\n --zds-color-utility-brand-900: var(--zds-color-brand-900);\n --zds-color-utility-brand-950: var(--zds-color-brand-950);\n\n --zds-color-utility-gray-50: var(--zds-color-gray-50);\n --zds-color-utility-gray-100: var(--zds-color-gray-100);\n --zds-color-utility-gray-200: var(--zds-color-gray-200);\n --zds-color-utility-gray-300: var(--zds-color-gray-300);\n --zds-color-utility-gray-400: var(--zds-color-gray-400);\n --zds-color-utility-gray-500: var(--zds-color-gray-500);\n --zds-color-utility-gray-600: var(--zds-color-gray-600);\n --zds-color-utility-gray-700: var(--zds-color-gray-700);\n --zds-color-utility-gray-800: var(--zds-color-gray-800);\n --zds-color-utility-gray-900: var(--zds-color-gray-900);\n --zds-color-utility-gray-950: var(--zds-color-gray-950);\n\n /* Figma \"Couleurs/Bleu horizon\" */\n --zds-color-utility-horizon-50: #e8ecf3;\n --zds-color-utility-horizon-100: #d6dce8;\n --zds-color-utility-horizon-200: #c1c8da;\n --zds-color-utility-horizon-300: #aab3cb;\n --zds-color-utility-horizon-400: #909bb9;\n --zds-color-utility-horizon-500: #5c73a3;\n --zds-color-utility-horizon-600: #4a5b86;\n --zds-color-utility-horizon-700: #39456a;\n --zds-color-utility-horizon-800: #29344e;\n --zds-color-utility-horizon-900: #1b2435;\n --zds-color-utility-horizon-950: #111622;\n\n /* Figma \"Couleurs/Vert tilleul\" */\n --zds-color-utility-lime-50: #f2f5e6;\n --zds-color-utility-lime-100: #e8eecd;\n --zds-color-utility-lime-200: #e0ebad;\n --zds-color-utility-lime-300: #d7ea86;\n --zds-color-utility-lime-400: #d1eb5c;\n --zds-color-utility-lime-500: #c5e439;\n --zds-color-utility-lime-600: #b9dc18;\n --zds-color-utility-lime-700: #91ac15;\n --zds-color-utility-lime-800: #6c7f15;\n --zds-color-utility-lime-900: #4c5813;\n --zds-color-utility-lime-950: #353d0f;\n\n /* Figma \"Couleurs/Turquoise\" */\n --zds-color-utility-turquoise-50: #e6f7f9;\n --zds-color-utility-turquoise-100: #d1f0f4;\n --zds-color-utility-turquoise-200: #b7e9ee;\n --zds-color-utility-turquoise-300: #94e2e8;\n --zds-color-utility-turquoise-400: #6fd9e1;\n --zds-color-utility-turquoise-500: #30d2e0;\n --zds-color-utility-turquoise-600: #15aab6;\n --zds-color-utility-turquoise-700: #138996;\n --zds-color-utility-turquoise-800: #116a76;\n --zds-color-utility-turquoise-900: #0e4950;\n --zds-color-utility-turquoise-950: #0b3136;\n\n /* Figma \"Couleurs/Violet\" */\n --zds-color-utility-violet-50: #f5f3ff;\n --zds-color-utility-violet-100: #ece9fe;\n --zds-color-utility-violet-200: #ddd6fe;\n --zds-color-utility-violet-300: #c3b5fd;\n --zds-color-utility-violet-400: #a48afb;\n --zds-color-utility-violet-500: #875bf7;\n --zds-color-utility-violet-600: #7839ee;\n --zds-color-utility-violet-700: #6927da;\n --zds-color-utility-violet-800: #5720b7;\n --zds-color-utility-violet-900: #491c96;\n --zds-color-utility-violet-950: #2e125e;\n\n /* Figma \"Couleurs/Fuschia\". That's Zest's own spelling, not a typo to fix. */\n --zds-color-utility-fuschia-50: #f8e2fb;\n --zds-color-utility-fuschia-100: #f2c9f7;\n --zds-color-utility-fuschia-200: #eaaef1;\n --zds-color-utility-fuschia-300: #e291eb;\n --zds-color-utility-fuschia-400: #d879e2;\n --zds-color-utility-fuschia-500: #c86dd7;\n --zds-color-utility-fuschia-600: #a957bb;\n --zds-color-utility-fuschia-700: #863f96;\n --zds-color-utility-fuschia-800: #632c70;\n --zds-color-utility-fuschia-900: #43204d;\n --zds-color-utility-fuschia-950: #2b1531;\n\n /* Figma \"Couleurs/Rose\" */\n --zds-color-utility-rose-50: #fdf2fa;\n --zds-color-utility-rose-100: #fce7f6;\n --zds-color-utility-rose-200: #fcceee;\n --zds-color-utility-rose-300: #faa7e0;\n --zds-color-utility-rose-400: #f670c7;\n --zds-color-utility-rose-500: #ee46bc;\n --zds-color-utility-rose-600: #dd2590;\n --zds-color-utility-rose-700: #c11574;\n --zds-color-utility-rose-800: #9e165f;\n --zds-color-utility-rose-900: #851651;\n --zds-color-utility-rose-950: #3b1224;\n\n /* Figma \"Couleurs/Jaune\" */\n --zds-color-utility-yellow-50: #fff9e0;\n --zds-color-utility-yellow-100: #fef2c9;\n --zds-color-utility-yellow-200: #fde8a7;\n --zds-color-utility-yellow-300: #fcdc83;\n --zds-color-utility-yellow-400: #f6d35d;\n --zds-color-utility-yellow-500: #f4d431;\n --zds-color-utility-yellow-600: #d8b920;\n --zds-color-utility-yellow-700: #b49716;\n --zds-color-utility-yellow-800: #8c7310;\n --zds-color-utility-yellow-900: #604f0a;\n --zds-color-utility-yellow-950: #3f3406;\n\n /* ============================================================\n * LAYER 3 — ROLES\n * Meaning, not hue: this is the layer components should cite.\n * A `_hover` suffix is the hovered state of the same role; `_on-brand` is\n * the same role sat on a solid brand fill.\n * ============================================================ */\n\n /* TEXT — the scale sits on `navy` and doesn't decrease evenly (`tertiary`\n is darker than `secondary`, `quaternary` shares `secondary`'s value):\n that's a deliberate product call, not a gap to smooth over. */\n --zds-color-text-primary: var(--zds-color-navy-100);\n --zds-color-text-secondary: var(--zds-color-navy-70);\n --zds-color-text-secondary-hover: var(--zds-color-navy-80);\n --zds-color-text-tertiary: var(--zds-color-navy-80);\n --zds-color-text-tertiary-hover: var(--zds-color-navy-100);\n --zds-color-text-quaternary: var(--zds-color-navy-70);\n --zds-color-text-white: var(--zds-color-white);\n\n /* Same value, two roles: an empty field and a disabled field look alike,\n not in the model. */\n --zds-color-text-placeholder: var(--zds-color-navy-60);\n --zds-color-text-disabled: var(--zds-color-navy-60);\n\n --zds-color-text-brand-primary: var(--zds-color-brand-900);\n --zds-color-text-brand-secondary: var(--zds-color-brand-700);\n --zds-color-text-brand-secondary-hover: var(--zds-color-brand-800);\n --zds-color-text-brand-tertiary: var(--zds-color-brand-600);\n\n /* Status text sits on 700 (Zest/300), the only step that holds AA for all\n three. `fg-*` and `bg-*-solid` stay on 600. */\n --zds-color-text-error-primary: var(--zds-color-error-700);\n --zds-color-text-error-primary-hover: var(--zds-color-error-800);\n --zds-color-text-warning-primary: var(--zds-color-warning-700);\n --zds-color-text-success-primary: var(--zds-color-success-700);\n\n --zds-color-text-primary-on-brand: var(--zds-color-white);\n --zds-color-text-secondary-on-brand: var(--zds-color-brand-200);\n --zds-color-text-tertiary-on-brand: var(--zds-color-brand-200);\n --zds-color-text-quaternary-on-brand: var(--zds-color-brand-300);\n\n /* BORDER — the three neutrals sit on `navy`, the rest on their own ramp. */\n --zds-color-border-primary: var(--zds-color-navy-40);\n --zds-color-border-secondary: var(--zds-color-navy-30);\n /* Translucent: the border takes on the color of whatever it sits on\n instead of cutting across it — needed over an image or a gradient. */\n --zds-color-border-secondary-alt: rgb(0 0 0 / 0.1);\n --zds-color-border-tertiary: var(--zds-color-navy-20);\n --zds-color-border-brand: var(--zds-color-brand-500);\n --zds-color-border-brand-alt: var(--zds-color-brand-600);\n --zds-color-border-error: var(--zds-color-error-500);\n --zds-color-border-error-subtle: var(--zds-color-error-300);\n\n /* FOREGROUND — what draws on a background without being text: icons,\n bullets, strokes, handles. */\n --zds-color-fg-primary: var(--zds-color-gray-900);\n --zds-color-fg-secondary: var(--zds-color-gray-700);\n --zds-color-fg-secondary-hover: var(--zds-color-gray-800);\n --zds-color-fg-tertiary: var(--zds-color-gray-600);\n --zds-color-fg-tertiary-hover: var(--zds-color-gray-700);\n --zds-color-fg-quaternary: var(--zds-color-gray-400);\n --zds-color-fg-quaternary-hover: var(--zds-color-gray-500);\n --zds-color-fg-white: var(--zds-color-white);\n\n --zds-color-fg-brand-primary: var(--zds-color-brand-600);\n --zds-color-fg-brand-secondary: var(--zds-color-brand-500);\n --zds-color-fg-brand-secondary-hover: var(--zds-color-brand-600);\n\n --zds-color-fg-error-primary: var(--zds-color-error-600);\n --zds-color-fg-error-secondary: var(--zds-color-error-500);\n --zds-color-fg-warning-primary: var(--zds-color-warning-600);\n --zds-color-fg-warning-secondary: var(--zds-color-warning-500);\n --zds-color-fg-success-primary: var(--zds-color-success-600);\n --zds-color-fg-success-secondary: var(--zds-color-success-500);\n\n /* BACKGROUND — `*-primary` is a SOFT fill (ramp 50) under text that stays\n dark; `*-solid` is a saturated fill (ramp 600) under white text. */\n --zds-color-bg-primary: var(--zds-color-white);\n --zds-color-bg-primary-hover: var(--zds-color-gray-50);\n --zds-color-bg-secondary: var(--zds-color-gray-50);\n --zds-color-bg-secondary-hover: var(--zds-color-gray-100);\n --zds-color-bg-tertiary: var(--zds-color-gray-100);\n --zds-color-bg-quaternary: var(--zds-color-gray-200);\n\n --zds-color-bg-primary-solid: var(--zds-color-gray-950);\n --zds-color-bg-secondary-solid: var(--zds-color-gray-600);\n\n --zds-color-bg-brand-primary: var(--zds-color-brand-50);\n --zds-color-bg-brand-secondary: var(--zds-color-brand-100);\n --zds-color-bg-brand-solid: var(--zds-color-brand-600);\n --zds-color-bg-brand-solid-hover: var(--zds-color-brand-700);\n --zds-color-bg-brand-section: var(--zds-color-brand-800);\n --zds-color-bg-brand-section-subtle: var(--zds-color-brand-700);\n\n --zds-color-bg-error-primary: var(--zds-color-error-50);\n --zds-color-bg-error-secondary: var(--zds-color-error-100);\n --zds-color-bg-error-solid: var(--zds-color-error-600);\n --zds-color-bg-error-solid-hover: var(--zds-color-error-700);\n --zds-color-bg-warning-primary: var(--zds-color-warning-50);\n --zds-color-bg-warning-secondary: var(--zds-color-warning-100);\n --zds-color-bg-warning-solid: var(--zds-color-warning-600);\n --zds-color-bg-success-primary: var(--zds-color-success-50);\n --zds-color-bg-success-secondary: var(--zds-color-success-100);\n --zds-color-bg-success-solid: var(--zds-color-success-600);\n\n /* Only the hue lives here: components write the opacity at the call site\n (e.g. `color-mix(in srgb, var(--zds-color-bg-overlay) 70%, transparent)`). */\n --zds-color-bg-overlay: var(--zds-color-gray-950);\n\n /* COMPONENT — last resort, when a piece of UI needs a color the roles\n above can't name.\n\n The focus ring is OPAQUE, and that is a requirement rather than a taste:\n WCAG 1.4.11 asks 3:1 of anything that identifies a component's state, and\n a translucent ring is measured on what the eye sees — after compositing.\n Brand at 24% over white lands at 1.32:1. Any ring token added here has to\n be measured composited, not at its source hue. See the README. */\n --zds-color-focus-ring: var(--zds-color-brand-500);\n --zds-color-focus-ring-error: var(--zds-color-error-500);\n\n --zds-color-icon-fg-brand: var(--zds-color-brand-600);\n --zds-color-icon-fg-brand-on-brand: var(--zds-color-brand-200);\n\n --zds-color-featured-icon-fg-brand: var(--zds-color-brand-600);\n --zds-color-featured-icon-fg-gray: var(--zds-color-gray-500);\n --zds-color-featured-icon-fg-error: var(--zds-color-error-600);\n --zds-color-featured-icon-fg-warning: var(--zds-color-warning-600);\n --zds-color-featured-icon-fg-success: var(--zds-color-success-600);\n\n /* Component tokens for pieces this package will ship. Sourced from the\n reference theme, kept because a toggle, a tooltip and a slider are all\n on the roadmap and their borders can't be named by a role. */\n --zds-color-toggle-border: var(--zds-color-gray-300);\n --zds-color-toggle-slim-border-pressed: var(--zds-color-bg-brand-solid);\n --zds-color-toggle-slim-border-pressed-hover: var(--zds-color-bg-brand-solid-hover);\n --zds-color-tooltip-supporting-text: var(--zds-color-gray-300);\n --zds-color-slider-handle-bg: var(--zds-color-white);\n --zds-color-slider-handle-border: var(--zds-color-brand-600);\n\n /* NOT ported, and deliberately: the reference theme also carries\n `app-store-badge-border`, `screen-mockup-border`, `footer-button-fg`\n (+ `_hover`) and `text-editor-icon-fg` (+ `_active`). They name parts of\n ITS marketing-site components, not of any Zest component — importing them\n would grow the vocabulary with words nothing here will ever say. */\n\n /* ============================================================\n * TYPOGRAPHY\n * ============================================================ */\n --zds-font-family-body: \"Averta\", -apple-system, \"Segoe UI\", Roboto, Arial, sans-serif;\n --zds-font-family-display: \"Averta\", -apple-system, \"Segoe UI\", Roboto, Arial, sans-serif;\n\n /* Averta has no Medium: nothing sits between Regular and Semibold. Use\n `--zds-font-weight-semibold` for emphasis instead of inventing a 500. */\n --zds-font-weight-normal: 400;\n --zds-font-weight-semibold: 600;\n --zds-font-weight-bold: 700;\n\n /* Sizes follow Zest's own names — caption, body, heading, display — not a\n generic sm/md/lg scale. Negative tracking on large titles is -2% of the\n size; it comes from Figma up to `display-lg`, and the same rule is\n extended beyond it. */\n --zds-text-caption-sm: 8px;\n --zds-text-caption-sm-line-height: 12px;\n\n --zds-text-caption-md: 12px;\n --zds-text-caption-md-line-height: 18px;\n\n --zds-text-body-sm: 14px;\n --zds-text-body-sm-line-height: 20px;\n\n --zds-text-body-md: 16px;\n --zds-text-body-md-line-height: 24px;\n\n --zds-text-heading-sm: 18px;\n --zds-text-heading-sm-line-height: 28px;\n\n --zds-text-heading-md: 20px;\n --zds-text-heading-md-line-height: 30px;\n\n --zds-text-heading-lg: 22px;\n --zds-text-heading-lg-line-height: 32px;\n\n --zds-text-display-xs: 24px; /* outside Figma */\n --zds-text-display-xs-line-height: 32px;\n\n --zds-text-display-sm: 30px;\n --zds-text-display-sm-line-height: 38px;\n\n --zds-text-display-md: 36px;\n --zds-text-display-md-line-height: 44px;\n --zds-text-display-md-letter-spacing: -0.72px;\n\n --zds-text-display-lg: 48px;\n --zds-text-display-lg-line-height: 60px;\n --zds-text-display-lg-letter-spacing: -0.96px;\n\n --zds-text-display-xl: 60px; /* outside Figma */\n --zds-text-display-xl-line-height: 72px;\n --zds-text-display-xl-letter-spacing: -1.2px;\n\n --zds-text-display-2xl: 72px; /* outside Figma */\n --zds-text-display-2xl-line-height: 90px;\n --zds-text-display-2xl-letter-spacing: -1.44px;\n\n /* ============================================================\n * SPACING — Zest's named scale, exposed numerically.\n * ============================================================ */\n --zds-space-none: 0px;\n --zds-space-xxs: 2px;\n --zds-space-xs: 4px;\n --zds-space-sm: 6px;\n --zds-space-md: 8px;\n --zds-space-lg: 12px;\n --zds-space-xl: 16px;\n --zds-space-2xl: 20px;\n --zds-space-3xl: 24px;\n --zds-space-4xl: 32px;\n --zds-space-5xl: 40px;\n --zds-space-6xl: 48px;\n --zds-space-7xl: 64px;\n --zds-space-8xl: 80px;\n --zds-space-9xl: 96px;\n --zds-space-10xl: 128px;\n --zds-space-11xl: 160px;\n\n /* ============================================================\n * WIDTHS — a width BOUNDS a block (a text column, a panel, a modal);\n * spacing separates two things. Different job, different scale.\n *\n * These 13 steps come from the reference delivery's code, not from Figma:\n * Figma carries a `width-*` scale offset by two steps, and the 2026-09-07\n * product call is that for widths the code decides. Same rule for the\n * names: where Figma and the code disagree on a suffix, the code wins.\n *\n * The reference delivery gets these from its CSS engine and can't declare\n * them as tokens — a `--spacing-2xl` there would hijack `max-w-2xl` and\n * collapse an article to 48px. This package has no such collision: the\n * `--zds-` prefix keeps the two scales apart, so both are named.\n * ============================================================ */\n --zds-width-3xs: 256px;\n --zds-width-2xs: 288px;\n --zds-width-xs: 320px;\n --zds-width-sm: 384px;\n --zds-width-md: 448px;\n --zds-width-lg: 512px;\n --zds-width-xl: 576px;\n --zds-width-2xl: 672px;\n --zds-width-3xl: 768px;\n --zds-width-4xl: 896px;\n --zds-width-5xl: 1024px;\n --zds-width-6xl: 1152px;\n --zds-width-7xl: 1280px;\n\n /* The frame of a page rather than of a block: its two gutters and its cap. */\n --zds-container-padding-mobile: 16px;\n --zds-container-padding-desktop: 32px;\n --zds-container-max-width-desktop: 1280px;\n\n /* Kept apart from the widths on purpose: a text column isn't set by the\n room available but by a comfortable line length. Past it, the eye loses\n the next line on the way back to the margin. Figma's\n `paragraph-max-width`, and what `.prose` already caps itself at. */\n --zds-paragraph-max-width: 720px;\n\n /* ============================================================\n * RADIUS\n * ============================================================ */\n --zds-radius-none: 0px;\n --zds-radius-xxs: 2px;\n --zds-radius-xs: 4px;\n --zds-radius-sm: 6px;\n --zds-radius-md: 8px;\n --zds-radius-lg: 10px;\n --zds-radius-xl: 12px;\n --zds-radius-2xl: 16px;\n --zds-radius-3xl: 20px;\n --zds-radius-4xl: 24px;\n --zds-radius-full: 9999px;\n\n /* ============================================================\n * SHADOW\n * ============================================================ */\n --zds-shadow-xs: 0px 1px 2px rgba(0, 0, 0, 0.05);\n --zds-shadow-sm: 0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px -1px rgba(0, 0, 0, 0.1);\n --zds-shadow-md: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.06);\n --zds-shadow-lg: 0px 12px 16px -4px rgba(0, 0, 0, 0.08), 0px 4px 6px -2px rgba(0, 0, 0, 0.03),\n 0px 2px 2px -1px rgba(0, 0, 0, 0.04);\n --zds-shadow-xl: 0px 20px 24px -4px rgba(0, 0, 0, 0.08), 0px 8px 8px -4px rgba(0, 0, 0, 0.03),\n 0px 3px 3px -1.5px rgba(0, 0, 0, 0.04);\n --zds-shadow-2xl: 0px 24px 48px -12px rgba(0, 0, 0, 0.18), 0px 4px 4px -2px rgba(0, 0, 0, 0.04);\n --zds-shadow-3xl: 0px 32px 64px -12px rgba(0, 0, 0, 0.14), 0px 5px 5px -2.5px rgba(0, 0, 0, 0.04);\n\n /* Two inset shadows: relief, not depth. */\n --zds-shadow-skeuomorphic: 0px 0px 0px 1px rgba(0, 0, 0, 0.18) inset, 0px -2px 0px 0px rgba(0, 0, 0, 0.05) inset;\n --zds-shadow-xs-skeuomorphic: var(--zds-shadow-skeuomorphic), var(--zds-shadow-xs);\n\n /* ============================================================\n * MOTION — not part of the Figma source; kept for component transitions.\n * ============================================================ */\n --zds-transition-fast: 0.15s ease;\n}\n","/* Zest Design System — Averta, the brand typeface.\n *\n * Under a commercial license: its files live in this package and this\n * design system is what declares them, not the consuming app. Importing the\n * package root is enough to get the font, with nothing to wire up on the\n * consumer side.\n *\n * Six files — 400 Regular, 600 Semibold, 700 Bold, each with its italic. The\n * full family has eight weights; serving the rest would make every visitor\n * download drawings nothing uses. No Medium (500): Averta doesn't have one,\n * and `--zds-font-weight-medium` doesn't exist in tokens.css for that reason.\n *\n * The italics are real drawings, not a browser-synthesized slant: without\n * the file, the browser fakes one by slanting the upright letterforms, and\n * curves like the `a` keep their upright shape — no longer what the\n * typeface's italic actually draws.\n */\n\n@font-face {\n font-family: \"Averta\";\n font-style: normal;\n font-weight: 400;\n font-display: swap;\n src: url(\"../fonts/averta-400.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: italic;\n font-weight: 400;\n font-display: swap;\n src: url(\"../fonts/averta-400-italic.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: normal;\n font-weight: 600;\n font-display: swap;\n src: url(\"../fonts/averta-600.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: italic;\n font-weight: 600;\n font-display: swap;\n src: url(\"../fonts/averta-600-italic.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: url(\"../fonts/averta-700.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: italic;\n font-weight: 700;\n font-display: swap;\n src: url(\"../fonts/averta-700-italic.woff2\") format(\"woff2\");\n}\n","/* Zest Design System — prose.\n *\n * Styles a block of AUTHORED text whose tags weren't hand-written one by\n * one: docs, a changelog, a legal page, an article pulled from Markdown or\n * an editor. The text arrives as bare HTML with no classes, so it can't be\n * dressed element by element.\n *\n * <article class=\"prose\"> … </article>\n *\n * The rest of the interface doesn't need this: a button label or a column\n * header carries its own classes, and that's better.\n *\n * ---------------------------------------------------------------------------\n * Hierarchy is carried as much by COLOR as by size: headings sit on\n * `--zds-color-text-primary`, body text one step lighter. That's what lets a\n * heading stand out without having to grow disproportionately large.\n *\n * Every selector is wrapped in `:where()`, so it carries zero specificity —\n * a utility class placed on an element always wins. This sheet offers a\n * layout, it doesn't lock it in.\n */\n\n.prose {\n /* 720px — Zest's Figma measure (`paragraph-max-width`), already the width\n of the docs site's text column. Cited as a token rather than repeated:\n the value was written twice and the two copies could drift. */\n max-width: var(--zds-paragraph-max-width);\n\n font-size: var(--zds-text-body-md);\n line-height: var(--zds-text-body-md-line-height);\n color: var(--zds-color-text-tertiary);\n\n /* `pretty` keeps a paragraph from ending on a single orphaned word. */\n text-wrap: pretty;\n}\n\n/* --- HEADINGS ------------------------------------------------------------ */\n/* The space above a heading is three times the space to its own text: a\n heading belongs to what FOLLOWS it, and the whitespace should say so. */\n.prose :where(h1) {\n margin-block: 0 1.5rem;\n font-size: var(--zds-text-display-sm);\n line-height: var(--zds-text-display-sm-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n.prose :where(h2) {\n margin-block: 3rem 1rem;\n font-size: var(--zds-text-heading-lg);\n line-height: var(--zds-text-heading-lg-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n.prose :where(h3) {\n margin-block: 2rem 0.5rem;\n font-size: var(--zds-text-heading-md);\n line-height: var(--zds-text-heading-md-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n.prose :where(h4) {\n margin-block: 1.5rem 0.5rem;\n font-size: var(--zds-text-heading-sm);\n line-height: var(--zds-text-heading-sm-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n/* --- BODY TEXT ------------------------------------------------------------ */\n.prose :where(p) {\n margin-block: 0 1.25rem;\n}\n\n/* Averta has no Medium: emphasis is 600. 700 stays reserved for headings —\n a bold run of body text shouts more than it emphasizes. */\n.prose :where(strong, b) {\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n}\n\n.prose :where(a) {\n color: var(--zds-color-text-brand-tertiary);\n text-decoration: underline;\n}\n\n.prose :where(a):hover {\n color: var(--zds-color-text-brand-secondary);\n}\n\n/* --- LISTS ----------------------------------------------------------------- */\n.prose :where(ul, ol) {\n margin-block: 0 1.25rem;\n padding-inline-start: 1.25rem;\n}\n\n.prose :where(ul) {\n list-style-type: disc;\n}\n\n.prose :where(ol) {\n list-style-type: decimal;\n}\n\n.prose :where(li) {\n margin-block: 0.5rem;\n}\n\n/* A nested list tightens up: it's a detail of its parent, not a new list. */\n.prose :where(li > ul, li > ol) {\n margin-block: 0.5rem 0;\n}\n\n.prose :where(li)::marker {\n color: var(--zds-color-text-quaternary);\n}\n\n/* --- QUOTE ------------------------------------------------------------------ */\n/* A rule rather than a fill: the quote stays in the flow of the text instead\n of becoming a boxed-off callout.\n\n It keeps the body text's color. Lightening it would drop to 3.67:1 —\n under the AA threshold — while a quote is text meant to be read, often\n several lines. The rule and the indent already set it apart. */\n.prose :where(blockquote) {\n margin-block: 2rem;\n padding-inline-start: 1.25rem;\n border-inline-start: 2px solid var(--zds-color-border-primary);\n}\n\n.prose :where(blockquote p:last-child) {\n margin-block-end: 0;\n}\n\n/* --- CODE -------------------------------------------------------------------- */\n/* This design system doesn't ship a monospace family. A code fragment is set\n off with a pill — a soft fill, a radius, a little padding — rather than a\n font change. */\n.prose :where(code) {\n padding: 0.125rem 0.375rem;\n border-radius: var(--zds-radius-xs);\n background-color: var(--zds-color-bg-secondary);\n color: var(--zds-color-text-primary);\n font-size: 0.9375em;\n}\n\n.prose :where(pre) {\n margin-block: 0 1.5rem;\n padding: 1rem;\n border-radius: var(--zds-radius-lg);\n background-color: var(--zds-color-bg-secondary);\n /* A code block overflows rather than wraps: a folded line in the middle\n of a command makes it wrong to copy. */\n overflow-x: auto;\n}\n\n/* Inside a block, the pill no longer applies: the block itself is the\n delimiter. */\n.prose :where(pre code) {\n padding: 0;\n border-radius: 0;\n background-color: transparent;\n font-size: inherit;\n}\n\n/* --- IMAGES ------------------------------------------------------------------ */\n.prose :where(figure) {\n margin-block: 2rem;\n}\n\n.prose :where(img) {\n border-radius: var(--zds-radius-lg);\n}\n\n/* The caption is set apart by SIZE, not by paleness: a lighter gray would\n fall under the contrast threshold, and a caption is still text meant to\n be read. */\n.prose :where(figcaption) {\n margin-block-start: 0.75rem;\n font-size: var(--zds-text-body-sm);\n line-height: var(--zds-text-body-sm-line-height);\n}\n\n/* --- TABLE -------------------------------------------------------------------- */\n.prose :where(table) {\n width: 100%;\n margin-block: 0 1.5rem;\n border-collapse: collapse;\n font-size: var(--zds-text-body-sm);\n line-height: var(--zds-text-body-sm-line-height);\n text-wrap: initial;\n}\n\n.prose :where(th) {\n padding: 0.75rem 1rem 0.75rem 0;\n border-block-end: 1px solid var(--zds-color-border-primary);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-align: start;\n}\n\n.prose :where(td) {\n padding: 0.75rem 1rem 0.75rem 0;\n border-block-end: 1px solid var(--zds-color-border-secondary);\n vertical-align: baseline;\n}\n\n.prose :where(th:last-child, td:last-child) {\n padding-inline-end: 0;\n}\n\n/* --- DIVIDER ------------------------------------------------------------------ */\n/* It separates two subjects, so it carries more weight than a gap between\n sections. */\n.prose :where(hr) {\n margin-block: 3rem;\n border: 0;\n border-block-start: 1px solid var(--zds-color-border-secondary);\n}\n\n/* --- BLOCK EDGES ---------------------------------------------------------------- */\n/* Without this, the first heading pushes the block down and the last\n paragraph leaves whitespace nobody asked for. The container owns its own\n margins, not its content. */\n.prose > :where(:first-child) {\n margin-block-start: 0;\n}\n\n.prose > :where(:last-child) {\n margin-block-end: 0;\n}\n","/* Zest Design System — base resets.\n *\n * The least specific rules the package ships: any application rule overrides\n * these without needing `!important`. A design system proposes, it doesn't\n * impose.\n */\n\nhtml,\nbody {\n font-family: var(--zds-font-family-body);\n\n /* Without smoothing, Averta consistently renders bolder than in Figma. */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Settings Averta ships with that browsers don't enable on their own. */\n -webkit-font-variant-ligatures: contextual;\n font-variant-ligatures: contextual;\n -webkit-font-kerning: normal;\n font-kerning: normal;\n}\n\n/* The default underline (`auto`) cuts through the descenders of p, g and y —\n the word reads as struck through. Set in `em` so the offset scales with\n the text size, and on the universal selector rather than `body`: an `em`\n on an inherited property resolves against the element that DECLARES it,\n so the absolute length is what gets inherited. On `body`, the 0.18em\n value was a fixed 2.88px across every size from 8px to 72px. */\n*,\n::before,\n::after {\n text-underline-offset: 0.18em;\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/styles/theme.css","../src/styles/fonts.css","../src/styles/typography.css","../src/styles/base.css","../src/components/base/Spinner/Spinner.css","../src/components/base/Button/Button.css","../src/components/base/CloseButton/CloseButton.css","../src/components/base/UtilityButton/UtilityButton.css","../src/components/base/Badge/Badge.css","../src/components/base/Tooltip/Tooltip.css","../src/components/base/Avatar/Avatar.css","../src/components/base/Checkbox/Checkbox.css","../src/components/base/Toggle/Toggle.css"],"sourcesContent":["/* Zest Design System — design tokens.\n *\n * Ported from the Figma \"❖ Design System V2.0\" (via the zest-design-system /\n * @zest/ui delivery). Colors are layered — a component should only ever\n * reference the LAST layer, never a raw ramp or a utility palette directly:\n *\n * 1. RAMPS sourced from Figma, numbered 50 -> 950 --zds-color-brand-600\n * 2. UTILITY categorization only (badges, chart series) --zds-color-utility-lime-500\n * 3. ROLES meaning, not hue — what components cite --zds-color-text-primary\n *\n * Zest's Figma numbers ramps 10 -> 600 (pivot at 100); this scale renumbers\n * them 50 -> 950 (pivot/action at 600):\n *\n * 20 -> 50 30 -> 100 40 -> 200 50 -> 300 60 -> 400\n * 100 -> 500 200 -> 600 300 -> 700 400 -> 800 500 -> 900 600 -> 950\n *\n * The `navy` ramp is the one exception: it keeps Zest's own 9-step scale\n * (10 -> 100, lightest to darkest) because there's no equivalent step to\n * align it to on the renumbered scale.\n */\n\n:root {\n /* ============================================================\n * LAYER 1 — RAMPS\n * ============================================================ */\n\n --zds-color-white: #ffffff;\n --zds-color-black: #000000;\n\n /* A named transparent, so a component can write \"no fill\" without falling\n back to a literal. The reference theme also exposes `alpha-white` and\n `alpha-black`, which are `white` and `black` under a second name — not\n ported: two names for one value drift apart. */\n --zds-color-transparent: rgb(0 0 0 / 0);\n\n /* Brand mark — logo and gradients only. 1.83:1 on white: cannot carry text. */\n --zds-color-mark: #00d85d;\n\n /* Figma \"Couleurs/Bleu (Primaire)\". 600 is the action hue — it matches\n Blue/200 in Figma, not the Blue/100 pivot, which only holds 3.60:1 under\n white text. The pivot lands on 500 instead. */\n --zds-color-brand-50: #e6f0ff;\n --zds-color-brand-100: #d2e3ff;\n --zds-color-brand-200: #c7d9ff;\n --zds-color-brand-300: #afc7ff;\n --zds-color-brand-400: #7da3ff;\n --zds-color-brand-500: #4481ff;\n --zds-color-brand-600: #2e6ef2;\n --zds-color-brand-700: #225ad1;\n --zds-color-brand-800: #1a46a6;\n --zds-color-brand-900: #163c8c;\n --zds-color-brand-950: #123066;\n\n /* Figma \"Couleurs/Gris\" — backgrounds and icons. */\n --zds-color-gray-50: #fafafa;\n --zds-color-gray-100: #f5f5f5;\n --zds-color-gray-200: #e9eaeb;\n --zds-color-gray-300: #d5d7da;\n --zds-color-gray-400: #a4a7ae;\n --zds-color-gray-500: #717680;\n --zds-color-gray-600: #535862;\n --zds-color-gray-700: #414651;\n --zds-color-gray-800: #252b37;\n --zds-color-gray-900: #181d27;\n --zds-color-gray-950: #0a0d12;\n\n /* Figma \"Couleurs/Bleu marine\" — text and neutral borders. Keeps Zest's own\n 10 -> 100 numbering (9 steps, 100 is darkest): no equivalent step exists\n on the renumbered scale to align it to. */\n --zds-color-navy-10: #f9fafb;\n --zds-color-navy-20: #f1f3f5;\n --zds-color-navy-30: #e4e7eb;\n --zds-color-navy-40: #d3d7de;\n --zds-color-navy-50: #c1c6cf;\n --zds-color-navy-60: #a6acb8;\n --zds-color-navy-70: #7e8694;\n --zds-color-navy-80: #4d5971;\n --zds-color-navy-100: #21304e;\n\n /* Figma \"Couleurs/Rouge (Erreur)\" */\n --zds-color-error-50: #fef3f2;\n --zds-color-error-100: #fee4e2;\n --zds-color-error-200: #fecdca;\n --zds-color-error-300: #fda29b;\n --zds-color-error-400: #f97066;\n --zds-color-error-500: #f04438;\n --zds-color-error-600: #d92d20;\n --zds-color-error-700: #b42318;\n --zds-color-error-800: #912018;\n --zds-color-error-900: #7a271a;\n --zds-color-error-950: #55160c;\n\n /* Figma \"Couleurs/Orange (Avertissement)\" */\n --zds-color-warning-50: #fffaeb;\n --zds-color-warning-100: #fef0c7;\n --zds-color-warning-200: #fedf89;\n --zds-color-warning-300: #fec84b;\n --zds-color-warning-400: #fdb022;\n --zds-color-warning-500: #f79009;\n --zds-color-warning-600: #dc6803;\n --zds-color-warning-700: #b54708;\n --zds-color-warning-800: #93370d;\n --zds-color-warning-900: #7a2e0e;\n --zds-color-warning-950: #4e1d09;\n\n /* Figma \"Couleurs/Vert (Succès)\" */\n --zds-color-success-50: #e3fceb;\n --zds-color-success-100: #d1f6dd;\n --zds-color-success-200: #b6edca;\n --zds-color-success-300: #96e1b4;\n --zds-color-success-400: #69d49a;\n --zds-color-success-500: #1ebb71;\n --zds-color-success-600: #119b57;\n --zds-color-success-700: #0b7f45;\n --zds-color-success-800: #076738;\n --zds-color-success-900: #05522d;\n --zds-color-success-950: #033d22;\n\n /* Gradients — Figma \"Dégradés\". Names describe a product usage, not a hue:\n don't translate them, don't invent new ones. */\n --zds-gradient-marque-90: linear-gradient(90deg, #00d85d 0%, #30d2e0 100%);\n --zds-gradient-marque-45: linear-gradient(45deg, #00d85d 0%, #30d2e0 100%);\n --zds-gradient-marque-26: linear-gradient(26.5deg, #00d85d 0%, #30d2e0 100%);\n\n --zds-gradient-ecouter-90: linear-gradient(90deg, #00d85d 0%, #c5e439 100%);\n --zds-gradient-ecouter-45: linear-gradient(45deg, #00d85d 0%, #c5e439 100%);\n --zds-gradient-ecouter-26: linear-gradient(26.5deg, #00d85d 0%, #c5e439 100%);\n\n --zds-gradient-reussir-90: linear-gradient(90deg, #4481ff 0%, #30d2e0 100%);\n --zds-gradient-reussir-45: linear-gradient(45deg, #4481ff 0%, #30d2e0 100%);\n --zds-gradient-reussir-26: linear-gradient(26.5deg, #4481ff 0%, #30d2e0 100%);\n\n --zds-gradient-partager-90: linear-gradient(90deg, #875bf7 0%, #c86dd7 100%);\n --zds-gradient-partager-45: linear-gradient(45deg, #875bf7 0%, #c86dd7 100%);\n --zds-gradient-partager-26: linear-gradient(26.5deg, #875bf7 0%, #c86dd7 100%);\n\n --zds-gradient-changelog-90: linear-gradient(90deg, #f79009 0%, #ee46bc 100%);\n --zds-gradient-changelog-45: linear-gradient(45deg, #f79009 0%, #ee46bc 100%);\n --zds-gradient-changelog-26: linear-gradient(26.5deg, #f79009 0%, #ee46bc 100%);\n\n --zds-gradient-alerte-90: linear-gradient(90deg, #f04438 0%, #f79009 100%);\n --zds-gradient-alerte-45: linear-gradient(45deg, #f04438 0%, #f79009 100%);\n --zds-gradient-alerte-26: linear-gradient(26.5deg, #f04438 0%, #f79009 100%);\n\n --zds-gradient-myzest-90: linear-gradient(90deg, #f79009 0%, #f4d431 100%);\n --zds-gradient-myzest-45: linear-gradient(45deg, #f79009 0%, #f4d431 100%);\n --zds-gradient-myzest-26: linear-gradient(26.5deg, #f79009 0%, #f4d431 100%);\n\n --zds-gradient-piloter-90: linear-gradient(90deg, #4a5b86 0%, #909bb9 100%);\n --zds-gradient-piloter-45: linear-gradient(45deg, #4a5b86 0%, #909bb9 100%);\n --zds-gradient-piloter-26: linear-gradient(26.5deg, #4a5b86 0%, #909bb9 100%);\n\n /* ============================================================\n * LAYER 2 — UTILITY PALETTES\n * For categorization (badges, tags, chart series) — not for meaning.\n * \"error\" or \"success\" belong to layer 3 instead.\n * ============================================================ */\n --zds-color-utility-brand-50: var(--zds-color-brand-50);\n --zds-color-utility-brand-100: var(--zds-color-brand-100);\n --zds-color-utility-brand-200: var(--zds-color-brand-200);\n --zds-color-utility-brand-300: var(--zds-color-brand-300);\n --zds-color-utility-brand-400: var(--zds-color-brand-400);\n --zds-color-utility-brand-500: var(--zds-color-brand-500);\n --zds-color-utility-brand-600: var(--zds-color-brand-600);\n --zds-color-utility-brand-700: var(--zds-color-brand-700);\n --zds-color-utility-brand-800: var(--zds-color-brand-800);\n --zds-color-utility-brand-900: var(--zds-color-brand-900);\n --zds-color-utility-brand-950: var(--zds-color-brand-950);\n\n --zds-color-utility-gray-50: var(--zds-color-gray-50);\n --zds-color-utility-gray-100: var(--zds-color-gray-100);\n --zds-color-utility-gray-200: var(--zds-color-gray-200);\n --zds-color-utility-gray-300: var(--zds-color-gray-300);\n --zds-color-utility-gray-400: var(--zds-color-gray-400);\n --zds-color-utility-gray-500: var(--zds-color-gray-500);\n --zds-color-utility-gray-600: var(--zds-color-gray-600);\n --zds-color-utility-gray-700: var(--zds-color-gray-700);\n --zds-color-utility-gray-800: var(--zds-color-gray-800);\n --zds-color-utility-gray-900: var(--zds-color-gray-900);\n --zds-color-utility-gray-950: var(--zds-color-gray-950);\n\n /* Figma \"Couleurs/Bleu horizon\" */\n --zds-color-utility-horizon-50: #e8ecf3;\n --zds-color-utility-horizon-100: #d6dce8;\n --zds-color-utility-horizon-200: #c1c8da;\n --zds-color-utility-horizon-300: #aab3cb;\n --zds-color-utility-horizon-400: #909bb9;\n --zds-color-utility-horizon-500: #5c73a3;\n --zds-color-utility-horizon-600: #4a5b86;\n --zds-color-utility-horizon-700: #39456a;\n --zds-color-utility-horizon-800: #29344e;\n --zds-color-utility-horizon-900: #1b2435;\n --zds-color-utility-horizon-950: #111622;\n\n /* Figma \"Couleurs/Vert tilleul\" */\n --zds-color-utility-lime-50: #f2f5e6;\n --zds-color-utility-lime-100: #e8eecd;\n --zds-color-utility-lime-200: #e0ebad;\n --zds-color-utility-lime-300: #d7ea86;\n --zds-color-utility-lime-400: #d1eb5c;\n --zds-color-utility-lime-500: #c5e439;\n --zds-color-utility-lime-600: #b9dc18;\n --zds-color-utility-lime-700: #91ac15;\n --zds-color-utility-lime-800: #6c7f15;\n --zds-color-utility-lime-900: #4c5813;\n --zds-color-utility-lime-950: #353d0f;\n\n /* Figma \"Couleurs/Turquoise\" */\n --zds-color-utility-turquoise-50: #e6f7f9;\n --zds-color-utility-turquoise-100: #d1f0f4;\n --zds-color-utility-turquoise-200: #b7e9ee;\n --zds-color-utility-turquoise-300: #94e2e8;\n --zds-color-utility-turquoise-400: #6fd9e1;\n --zds-color-utility-turquoise-500: #30d2e0;\n --zds-color-utility-turquoise-600: #15aab6;\n --zds-color-utility-turquoise-700: #138996;\n --zds-color-utility-turquoise-800: #116a76;\n --zds-color-utility-turquoise-900: #0e4950;\n --zds-color-utility-turquoise-950: #0b3136;\n\n /* Figma \"Couleurs/Violet\" */\n --zds-color-utility-violet-50: #f5f3ff;\n --zds-color-utility-violet-100: #ece9fe;\n --zds-color-utility-violet-200: #ddd6fe;\n --zds-color-utility-violet-300: #c3b5fd;\n --zds-color-utility-violet-400: #a48afb;\n --zds-color-utility-violet-500: #875bf7;\n --zds-color-utility-violet-600: #7839ee;\n --zds-color-utility-violet-700: #6927da;\n --zds-color-utility-violet-800: #5720b7;\n --zds-color-utility-violet-900: #491c96;\n --zds-color-utility-violet-950: #2e125e;\n\n /* Figma \"Couleurs/Fuschia\". That's Zest's own spelling, not a typo to fix. */\n --zds-color-utility-fuschia-50: #f8e2fb;\n --zds-color-utility-fuschia-100: #f2c9f7;\n --zds-color-utility-fuschia-200: #eaaef1;\n --zds-color-utility-fuschia-300: #e291eb;\n --zds-color-utility-fuschia-400: #d879e2;\n --zds-color-utility-fuschia-500: #c86dd7;\n --zds-color-utility-fuschia-600: #a957bb;\n --zds-color-utility-fuschia-700: #863f96;\n --zds-color-utility-fuschia-800: #632c70;\n --zds-color-utility-fuschia-900: #43204d;\n --zds-color-utility-fuschia-950: #2b1531;\n\n /* Figma \"Couleurs/Rose\" */\n --zds-color-utility-rose-50: #fdf2fa;\n --zds-color-utility-rose-100: #fce7f6;\n --zds-color-utility-rose-200: #fcceee;\n --zds-color-utility-rose-300: #faa7e0;\n --zds-color-utility-rose-400: #f670c7;\n --zds-color-utility-rose-500: #ee46bc;\n --zds-color-utility-rose-600: #dd2590;\n --zds-color-utility-rose-700: #c11574;\n --zds-color-utility-rose-800: #9e165f;\n --zds-color-utility-rose-900: #851651;\n --zds-color-utility-rose-950: #3b1224;\n\n /* Figma \"Couleurs/Jaune\" */\n --zds-color-utility-yellow-50: #fff9e0;\n --zds-color-utility-yellow-100: #fef2c9;\n --zds-color-utility-yellow-200: #fde8a7;\n --zds-color-utility-yellow-300: #fcdc83;\n --zds-color-utility-yellow-400: #f6d35d;\n --zds-color-utility-yellow-500: #f4d431;\n --zds-color-utility-yellow-600: #d8b920;\n --zds-color-utility-yellow-700: #b49716;\n --zds-color-utility-yellow-800: #8c7310;\n --zds-color-utility-yellow-900: #604f0a;\n --zds-color-utility-yellow-950: #3f3406;\n\n /* ============================================================\n * LAYER 3 — ROLES\n * Meaning, not hue: this is the layer components should cite.\n * A `_hover` suffix is the hovered state of the same role; `_on-brand` is\n * the same role sat on a solid brand fill.\n * ============================================================ */\n\n /* TEXT — the scale sits on `navy` and doesn't decrease evenly (`tertiary`\n is darker than `secondary`, `quaternary` shares `secondary`'s value):\n that's a deliberate product call, not a gap to smooth over. */\n --zds-color-text-primary: var(--zds-color-navy-100);\n --zds-color-text-secondary: var(--zds-color-navy-70);\n --zds-color-text-secondary-hover: var(--zds-color-navy-80);\n --zds-color-text-tertiary: var(--zds-color-navy-80);\n --zds-color-text-tertiary-hover: var(--zds-color-navy-100);\n --zds-color-text-quaternary: var(--zds-color-navy-70);\n --zds-color-text-white: var(--zds-color-white);\n\n /* Same value, two roles: an empty field and a disabled field look alike,\n not in the model. */\n --zds-color-text-placeholder: var(--zds-color-navy-60);\n --zds-color-text-disabled: var(--zds-color-navy-60);\n\n --zds-color-text-brand-primary: var(--zds-color-brand-900);\n --zds-color-text-brand-secondary: var(--zds-color-brand-700);\n --zds-color-text-brand-secondary-hover: var(--zds-color-brand-800);\n --zds-color-text-brand-tertiary: var(--zds-color-brand-600);\n\n /* Status text sits on 700 (Zest/300), the only step that holds AA for all\n three. `fg-*` and `bg-*-solid` stay on 600. */\n --zds-color-text-error-primary: var(--zds-color-error-700);\n --zds-color-text-error-primary-hover: var(--zds-color-error-800);\n --zds-color-text-warning-primary: var(--zds-color-warning-700);\n --zds-color-text-success-primary: var(--zds-color-success-700);\n\n --zds-color-text-primary-on-brand: var(--zds-color-white);\n --zds-color-text-secondary-on-brand: var(--zds-color-brand-200);\n --zds-color-text-tertiary-on-brand: var(--zds-color-brand-200);\n --zds-color-text-quaternary-on-brand: var(--zds-color-brand-300);\n\n /* BORDER — the three neutrals sit on `navy`, the rest on their own ramp. */\n --zds-color-border-primary: var(--zds-color-navy-40);\n --zds-color-border-secondary: var(--zds-color-navy-30);\n /* Translucent: the border takes on the color of whatever it sits on\n instead of cutting across it — needed over an image or a gradient. */\n --zds-color-border-secondary-alt: rgb(0 0 0 / 0.1);\n --zds-color-border-tertiary: var(--zds-color-navy-20);\n --zds-color-border-brand: var(--zds-color-brand-500);\n --zds-color-border-brand-alt: var(--zds-color-brand-600);\n --zds-color-border-error: var(--zds-color-error-500);\n --zds-color-border-error-subtle: var(--zds-color-error-300);\n\n /* FOREGROUND — what draws on a background without being text: icons,\n bullets, strokes, handles. */\n --zds-color-fg-primary: var(--zds-color-gray-900);\n --zds-color-fg-secondary: var(--zds-color-gray-700);\n --zds-color-fg-secondary-hover: var(--zds-color-gray-800);\n --zds-color-fg-tertiary: var(--zds-color-gray-600);\n --zds-color-fg-tertiary-hover: var(--zds-color-gray-700);\n --zds-color-fg-quaternary: var(--zds-color-gray-400);\n --zds-color-fg-quaternary-hover: var(--zds-color-gray-500);\n --zds-color-fg-white: var(--zds-color-white);\n\n --zds-color-fg-brand-primary: var(--zds-color-brand-600);\n --zds-color-fg-brand-secondary: var(--zds-color-brand-500);\n --zds-color-fg-brand-secondary-hover: var(--zds-color-brand-600);\n\n --zds-color-fg-error-primary: var(--zds-color-error-600);\n --zds-color-fg-error-secondary: var(--zds-color-error-500);\n --zds-color-fg-warning-primary: var(--zds-color-warning-600);\n --zds-color-fg-warning-secondary: var(--zds-color-warning-500);\n --zds-color-fg-success-primary: var(--zds-color-success-600);\n --zds-color-fg-success-secondary: var(--zds-color-success-500);\n\n /* BACKGROUND — `*-primary` is a SOFT fill (ramp 50) under text that stays\n dark; `*-solid` is a saturated fill (ramp 600) under white text. */\n --zds-color-bg-primary: var(--zds-color-white);\n --zds-color-bg-primary-hover: var(--zds-color-gray-50);\n --zds-color-bg-secondary: var(--zds-color-gray-50);\n --zds-color-bg-secondary-hover: var(--zds-color-gray-100);\n --zds-color-bg-tertiary: var(--zds-color-gray-100);\n --zds-color-bg-quaternary: var(--zds-color-gray-200);\n\n --zds-color-bg-primary-solid: var(--zds-color-gray-950);\n --zds-color-bg-secondary-solid: var(--zds-color-gray-600);\n\n --zds-color-bg-brand-primary: var(--zds-color-brand-50);\n --zds-color-bg-brand-secondary: var(--zds-color-brand-100);\n --zds-color-bg-brand-solid: var(--zds-color-brand-600);\n --zds-color-bg-brand-solid-hover: var(--zds-color-brand-700);\n --zds-color-bg-brand-section: var(--zds-color-brand-800);\n --zds-color-bg-brand-section-subtle: var(--zds-color-brand-700);\n\n --zds-color-bg-error-primary: var(--zds-color-error-50);\n --zds-color-bg-error-secondary: var(--zds-color-error-100);\n --zds-color-bg-error-solid: var(--zds-color-error-600);\n --zds-color-bg-error-solid-hover: var(--zds-color-error-700);\n --zds-color-bg-warning-primary: var(--zds-color-warning-50);\n --zds-color-bg-warning-secondary: var(--zds-color-warning-100);\n --zds-color-bg-warning-solid: var(--zds-color-warning-600);\n --zds-color-bg-success-primary: var(--zds-color-success-50);\n --zds-color-bg-success-secondary: var(--zds-color-success-100);\n --zds-color-bg-success-solid: var(--zds-color-success-600);\n\n /* Only the hue lives here: components write the opacity at the call site\n (e.g. `color-mix(in srgb, var(--zds-color-bg-overlay) 70%, transparent)`). */\n --zds-color-bg-overlay: var(--zds-color-gray-950);\n\n /* COMPONENT — last resort, when a piece of UI needs a color the roles\n above can't name.\n\n The focus ring is OPAQUE, and that is a requirement rather than a taste:\n WCAG 1.4.11 asks 3:1 of anything that identifies a component's state, and\n a translucent ring is measured on what the eye sees — after compositing.\n Brand at 24% over white lands at 1.32:1. Any ring token added here has to\n be measured composited, not at its source hue. See the README. */\n --zds-color-focus-ring: var(--zds-color-brand-500);\n --zds-color-focus-ring-error: var(--zds-color-error-500);\n\n --zds-color-icon-fg-brand: var(--zds-color-brand-600);\n --zds-color-icon-fg-brand-on-brand: var(--zds-color-brand-200);\n\n --zds-color-featured-icon-fg-brand: var(--zds-color-brand-600);\n --zds-color-featured-icon-fg-gray: var(--zds-color-gray-500);\n --zds-color-featured-icon-fg-error: var(--zds-color-error-600);\n --zds-color-featured-icon-fg-warning: var(--zds-color-warning-600);\n --zds-color-featured-icon-fg-success: var(--zds-color-success-600);\n\n /* ---- INTERRUPTEUR -----------------------------------------------------\n Relevé sur `_Toggle base` (3896:1480, 32 symboles) et `Toggle`\n (3896:1553, 64 symboles), le 2026-09-11.\n\n ⚠️ LES TROIS JETONS PORTÉS ICI ÉTAIENT FAUX, TOUS LES TROIS, et le relevé\n l'a dit d'un coup. `--zds-color-toggle-border` valait `gray-300`, la rampe\n grise que ce design system n'emploie pas, quand le Figma peint la piste\n éteinte avec `border-primary` (navy-40). Le NOM était juste, la valeur non :\n ce jeton existe de nouveau, plus bas, et il vaut navy-70 depuis l'arbitrage\n du 2026-09-11.\n Les deux autres peignaient la bordure du bouton fin en `bg-brand-solid`\n (brand-600) et son survol en `bg-brand-solid-hover` ; le Figma dit\n brand-500 et brand-700. Trois ports, trois écarts — exactement le sort de\n `--zds-color-tooltip-supporting-text`, et pour la même raison : rien ne les\n citait, donc aucun contrôle ne les lisait.\n\n ⚠️ LE FOND ALLUMÉ RESTE SUR brand-500, COMME LA CASE À COCHER. Le bouton\n plein est descendu à brand-600 parce que du texte blanc sur brand-500 tient\n 3,60 pour un seuil AA de 4,50 ; ici le bouton blanc n'est pas du texte,\n c'est un objet graphique, dont la WCAG 1.4.11 demande 3:1. Aucun rôle de\n FOND ne porte brand-500 — `bg-brand-solid` est le 600 — d'où ce jeton.\n\n Le survol allumé, lui, descend sur un cran qui EST un rôle :\n `bg-brand-solid-hover` vaut brand-700, la valeur que le Figma écrit. Il est\n cité tel quel dans la feuille. */\n --zds-color-toggle-bg: var(--zds-color-navy-20);\n --zds-color-toggle-bg-pressed: var(--zds-color-brand-500);\n\n /* ⚠️ LA BORDURE EST FONCÉE PAR RAPPORT AU FIGMA, ET C'EST LE MÊME ARBITRAGE\n QUE LA CASE À COCHER — rendu le 2026-09-11, après mesure. Le cadre peint la\n limite du contrôle `border-primary` (navy-40), qui tient 1,44 sur du blanc\n pour un seuil de 3:1, sur un fond navy-20 qui tient 1,11.\n\n Ce dépôt tranche ce cas sur UNE question : y a-t-il autre chose, DANS le\n contrôle, qui le rende identifiable à 3:1 ? Le bouton a son libellé à 11,82,\n donc sa bordure est restée au Figma à 2,17. La case à cocher n'a rien, donc\n elle est montée à navy-70. L'interrupteur éteint, mesuré : son bouton blanc\n tient 1,11 contre sa piste, et la bordure de ce bouton en type `slim` tient\n 1,30. Rien n'atteint 3 — il est dans le cas de la case, pas dans celui du\n bouton.\n\n navy-70 tient 3,67, le palier le plus CLAIR de nos neutres qui passe le\n seuil. C'est la TROISIÈME fois que cet arbitrage est rendu à partir de\n navy-40 — la case à cocher, le point « hors ligne » de l'avatar, et lui :\n ce n'est plus une exception, c'est la règle du dépôt. À remonter dans le\n Figma.\n\n ⚠️ ET IL PEINT AUSSI LA BORDURE DU BOUTON DU TYPE `slim`, pas seulement la\n piste. En `slim` le bouton remplit la piste : sa bordure est la SEULE chose\n qui l'en sépare, et la position du bouton EST l'état. La foncer d'un côté et\n pas de l'autre donnerait un anneau extérieur net autour d'un bouton\n invisible — 3,30 contre la piste au lieu de 1,30.\n\n ⚠️ AUCUN RÔLE DE BORDURE NE PORTE navy-70. Les rôles vont de navy-40 à\n navy-20, plus les teintes de marque et d'erreur ; navy-70 est porté par\n `text-secondary`, un rôle de TEXTE. S'en servir pour peindre une BORDURE\n serait la confusion que la seconde vérification de `verify:tokens` existe\n pour empêcher. D'où ce jeton — dont le NOM est celui du jeton porté qui\n vivait ici avant le relevé. Son nom était juste, sa valeur était fausse. */\n --zds-color-toggle-border: var(--zds-color-navy-70);\n\n /* ⚠️ LE SURVOL DE L'ÉTAT ÉTEINT EST UN AJOUT, PAS UN RELEVÉ, et c'est le même\n ajout que sur la case à cocher. Les seize symboles `Pressed=False,\n State=Hover` sont identiques, propriété par propriété, à leurs\n `State=Default` : le Figma ne dessine rien. Un contrôle qui applique son\n effet AU CLIC et qui ne répond pas au survol paraît inerte.\n\n La piste descend d'un cran de sa rampe, comme l'allumée descend de la\n sienne : navy-20 → navy-30. Une seule règle pour les deux états — « au\n survol, la piste descend d'un cran ».\n\n ⚠️ ET CE CRAN EST DISCRET, MESURÉ : 1,12 contre la piste au repos. C'est\n assumé. Un survol n'est pas un état qu'on lit, c'est une confirmation que le\n contrôle est vivant ; le rendre spectaculaire le ferait concurrencer l'état\n allumé, qui lui porte l'information. Le palier suivant, navy-40, tiendrait\n 1,30 — et ce n'est plus un cran. À remonter dans le Figma. */\n --zds-color-toggle-bg-hover: var(--zds-color-navy-30);\n\n /* La bordure du bouton du type Slim suit la piste : brand-500 au repos —\n c'est `border-brand`, un rôle de la bonne catégorie, cité tel quel — et\n brand-700 au survol, qu'aucun rôle de BORDURE ne porte. D'où ce seul\n jeton : `bg-brand-solid-hover` porte bien brand-700, mais c'est un rôle de\n FOND, et s'en servir pour peindre une bordure est la confusion que la\n seconde vérification de `verify:tokens` existe pour empêcher. */\n --zds-color-toggle-border-pressed-hover: var(--zds-color-brand-700);\n\n /* ⚠️ L'OMBRE DU BOUTON N'EST AUCUNE DE NOS SEPT, ET IL S'EN FAUT D'UN\n SPREAD. Le Figma pose `ombre-md` sur le bouton du type Default —\n `0 4px 6px 0` puis `0 2px 4px -2px` — quand notre `--zds-shadow-md` écrit\n `0 4px 6px -1px` sur sa première couche. Une couche sur deux diverge, donc\n le jeton ne se réemploie pas. Le type Slim, lui, porte `ombre-sm`, dont la\n géométrie est celle de `--zds-shadow-xs` au chiffre près : il cite le jeton\n des fondations, sans rien redéclarer.\n\n ⚠️ ET LA TEINTE EST SUBSTITUÉE, COMME CELLE DE L'INFO-BULLE. La collection\n `Couleurs/Effets/Ombres` de Zest est lue ici pour la première fois : elle\n est teintée #0a0d12 — `shadow-xs` à 5 %, `shadow-md_01` à 10 %,\n `shadow-md_02` à 6 %. Toute notre rampe d'ombres est en noir pur, et\n l'écart à 10 % sur du blanc ne dépasse pas trois niveaux sur 255. La\n cohérence du thème l'emporte, comme elle l'a emporté pour l'info-bulle. La\n question des sept ombres reste ouverte dans le README ; on ne la tranche\n pas depuis un composant. */\n --zds-shadow-toggle-knob:\n 0 4px 6px 0 rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.06);\n\n /* ⚠️ `--zds-color-tooltip-supporting-text` VIVAIT ICI, ET IL ÉTAIT FAUX.\n Porté du thème de référence, il valait `gray-300` ; relevé sur le Figma de\n Zest le 2026-09-10, il vaut `navy-20` — deux teintes différentes, et la\n première est dans la rampe grise que le design system n'emploie pas. Il est\n désormais dans le bloc INFO-BULLE, avec sa mesure.\n\n ⚠️ ET PERSONNE NE L'AVAIT VU, parce que rien ne le CITAIT. `verify:tokens`\n résout les jetons qu'un composant emploie ; un jeton déclaré et jamais cité\n échappe à tous les contrôles. Les deux voisins ci-dessous sont dans le même\n cas : ce sont des ports, pas des relevés, et ils sont à vérifier au moment\n où le curseur sera codé. Les trois de l'interrupteur, eux, viennent d'y\n passer : les trois étaient faux. */\n --zds-color-slider-handle-bg: var(--zds-color-white);\n --zds-color-slider-handle-border: var(--zds-color-brand-600);\n\n /* ---- Button (phase 2) --------------------------------------------------\n ⚠️ The `bg-*` roles above are on the NEUTRAL gray ramp — `bg-secondary`\n is gray-50, #fafafa — while the Figma paints every button grey from the\n NAVY ramp: navy-20, #f1f3f5. Measured on 2026-09-09, not assumed. Text\n and border roles were moved onto Zest's navy on 2026-09-07; `bg-*` and\n `fg-*` never were, and the Button is the first component to sit on the\n seam. Re-pointing `bg-secondary` would move every surface in the package,\n so these are component tokens instead — see the README's \"En attente\". */\n /* La bordure des boutons encadrés : `border-primary`, comme le Figma.\n\n ⚠️ ARBITRÉ LE 2026-09-09, ET C'EST UN COMPROMIS ASSUMÉ. Mesuré, navy-40\n (#D3D7DE) tient 1,44:1 sur du blanc, sous les 3:1 que la WCAG 1.4.11\n demande à ce qui délimite une commande — et l'aplat ne rattrape rien,\n navy-20 sur blanc faisant 1,11:1. Composé sous le contour du relief, le\n trait peint monte à #ADB0B6, soit 2,17:1 : mieux, toujours sous le seuil.\n\n navy-70 tenait le seuil tout seul (3,67:1) et avait été employé un temps,\n mais il alourdissait le dessin. La FIDÉLITÉ AU FIGMA a été préférée par\n l'équipe produit. Le libellé, lui, tient 11,82:1 : le bouton reste\n identifiable, c'est sa LIMITE qui ne l'est pas.\n\n La page « Boutons » continue de le mesurer et de l'afficher en rouge : un\n compromis assumé se documente, il ne se cache pas. Voir le README. */\n --zds-color-button-secondary-border: var(--zds-color-border-primary);\n\n --zds-color-button-secondary-bg: var(--zds-color-navy-20);\n --zds-color-button-secondary-bg-hover: var(--zds-color-navy-30);\n --zds-color-button-secondary-white-bg-hover: var(--zds-color-navy-20);\n --zds-color-button-tertiary-bg-hover: var(--zds-color-navy-20);\n\n /* ⚠️ CE QUI N'EST PAS ICI, ET POURQUOI. Le survol d'un tertiaire coloré, le\n soulignement d'un lien et la croix de fermeture avaient chacun leur jeton\n de composant, sur une rampe brute. Ils n'en ont plus : un RÔLE portait déjà\n exactement leur valeur — `text-brand-secondary` (brand-700),\n `fg-brand-secondary` (brand-500), `fg-error-secondary` (error-500),\n `text-secondary` (navy-70) et `text-white`. Les composants les citent\n directement. `yarn verify:tokens` échoue désormais si un jeton de composant\n redouble un rôle existant.\n\n Les quatre jetons de FOND ci-dessus restent, eux, et ce n'est pas un oubli :\n la collection sémantique du Figma — « 1. Usage des couleurs » — couvre\n `Couleurs/Texte/`, `Couleurs/Bordure/` et `Couleurs/Effets/Ombres/`, mais\n PAS les fonds. Relevé le 2026-09-09 sur la page « Couleurs » (4:8067) : le\n Figma peint lui-même le fond du Secondary gray avec\n `Couleurs/Bleu marine/20`, une rampe brute. Il n'y a donc aucun rôle à\n citer, et les rôles `bg-*` du thème sont restés sur la rampe `gray-*`,\n celle que Zest n'emploie pas pour son interface. Voir le README,\n « En attente ». */\n\n /* Le survol d'un bouton de fermeture posé sur une image ou un aplat sombre.\n Un voile blanc translucide, et non un gris : il doit s'éclaircir sur ce\n qui est dessous, quoi que ce soit. Aucune rampe ne peut faire ça, donc\n aucun rôle ne le nomme — d'où ce jeton de composant. */\n --zds-color-button-close-on-dark-bg-hover: rgb(255 255 255 / 0.2);\n\n /* ---- BADGE ------------------------------------------------------------\n Relevé sur `Badge` (3869:2612), `_Dot` (3874:1192) et `_Badge close X`\n (3869:4461) le 2026-09-10. Treize couleurs, quatre valeurs chacune :\n le fond, la bordure, la PIÈCE et le libellé.\n\n ⚠️ UNE SEULE VALEUR POUR LES QUATRE PIÈCES. Le point, l'icône de tête,\n l'icône de fin et la croix sont tous peints au palier 600 de la couleur —\n `Zest/200` dans la maquette — et seul le libellé descend au 700. C'est\n pour ça que ces jetons s'appellent `-piece` et non `-dot` : les nommer\n d'après un seul de leurs quatre emplois aurait menti au prochain lecteur.\n\n CE QUI N'EST PAS ICI EST CITÉ COMME RÔLE, et c'est `verify:tokens` qui\n l'a établi plutôt qu'une relecture : le contrôle ÉCHOUE si un jeton de\n composant porte la valeur qu'un rôle de la même catégorie porte déjà. Il\n a trouvé cinq fonds dans ce cas, en plus des textes et des points :\n\n brand fond `bg-brand-primary` texte `text-brand-secondary` pièce `fg-brand-primary`\n error fond `bg-error-primary` texte `text-error-primary` pièce `fg-error-primary`\n warning fond `bg-warning-primary` texte `text-warning-primary` pièce `fg-warning-primary`\n success fond `bg-success-primary` texte `text-success-primary` pièce `fg-success-primary`\n navy texte `text-primary` bordure `border-primary`\n modern fond `bg-primary`\n\n Les `fg-*-primary` tombent pile : ce sont les paliers 600, donc exactement\n la valeur que les quatre pièces prennent. Un rôle d'AVANT-PLAN pour une\n icône, c'est le mot juste, pas une coïncidence de valeur.\n\n Les rôles `bg-*-primary` sont exactement les paliers 50 des rampes, donc\n exactement le fond doux que le badge peint : il y avait bien un mot pour\n ça au calque 3, et le premier jet l'avait manqué. Les fonds ne sont pas\n dispensés du contrôle malgré ce que son message laisse entendre — la\n dispense ne vaut que là où AUCUN rôle ne nomme la valeur, ce qui est le\n cas des huit couleurs utilitaires.\n\n ⚠️ QUATRE FONDS S'ÉCARTENT DU FIGMA, ET C'EST MESURÉ, PAS SUBI. Le Figma\n peint le fond de `brand`, `success`, `horizon` et `fuschia` avec le palier\n `Zest/10`, celui que notre échelle 50 → 950 laisse dehors — douze valeurs\n Zest pour onze emplacements. Les quatre prennent donc le palier `-50`, qui\n est le `Zest/20` (par le rôle pour les deux premiers, par un jeton de\n composant pour les deux autres) :\n\n brand #f4f8ff attendu, #e6f0ff rendu, ΔE 5,46\n success #f0fff6 attendu, #e3fceb rendu, ΔE 5,79\n horizon #f5f7fa attendu, #e8ecf3 rendu, ΔE 4,45\n fuschia #fcf1fd attendu, #f8e2fb rendu, ΔE 8,79\n\n Les quatre restent au-dessus de l'AA sous leur libellé (4,69 à 7,94), donc\n l'écart coûte une nuance, pas une lisibilité. Récupérer `Zest/10`\n demanderait un palier `25` sur les rampes : c'est une décision de design\n system, pas de composant. Voir « En attente » dans le README.\n\n ⚠️ LE FOND DU BADGE NAVY EST UNE VARIABLE ÉTRANGÈRE DANS LE FIGMA.\n Il est peint par `Component colors/Utility/Slate/utility-slate-50`\n (#f8fafc), qui appartient à une collection TIERCE et non à celle de\n Zest — le même défaut que sur les icônes de fichier. Notre `navy-10`\n (#f9fafb) en est à ΔE 0,61, invisible à l'œil et mesurable. Substitué sans\n hésitation, mais le Figma reste à repointer. */\n --zds-color-badge-brand-border: var(--zds-color-brand-200);\n\n --zds-color-badge-error-border: var(--zds-color-error-200);\n\n --zds-color-badge-warning-border: var(--zds-color-warning-200);\n\n --zds-color-badge-success-border: var(--zds-color-success-200);\n\n --zds-color-badge-navy-bg: var(--zds-color-navy-10);\n --zds-color-badge-navy-piece: var(--zds-color-navy-80);\n\n /* Les huit couleurs utilitaires n'ont aucun rôle : le calque 2 existe pour\n la catégorisation — « badges, chart series », dit l'en-tête du thème — et\n le badge est le premier composant à s'en servir. Les quatre valeurs sont\n donc des jetons de composant, sans exception à justifier. */\n --zds-color-badge-gray-bg: var(--zds-color-utility-gray-50);\n --zds-color-badge-gray-border: var(--zds-color-utility-gray-200);\n --zds-color-badge-gray-piece: var(--zds-color-utility-gray-600);\n --zds-color-badge-gray-text: var(--zds-color-utility-gray-700);\n\n --zds-color-badge-horizon-bg: var(--zds-color-utility-horizon-50);\n --zds-color-badge-horizon-border: var(--zds-color-utility-horizon-100);\n --zds-color-badge-horizon-piece: var(--zds-color-utility-horizon-600);\n --zds-color-badge-horizon-text: var(--zds-color-utility-horizon-700);\n\n --zds-color-badge-turquoise-bg: var(--zds-color-utility-turquoise-50);\n --zds-color-badge-turquoise-border: var(--zds-color-utility-turquoise-200);\n /* Deux crans plus bas que les dix autres — voir « LES TROIS TEINTES\n CLAIRES » plus bas. */\n --zds-color-badge-turquoise-piece: var(--zds-color-utility-turquoise-700);\n --zds-color-badge-turquoise-text: var(--zds-color-utility-turquoise-800);\n\n --zds-color-badge-violet-bg: var(--zds-color-utility-violet-50);\n --zds-color-badge-violet-border: var(--zds-color-utility-violet-200);\n --zds-color-badge-violet-piece: var(--zds-color-utility-violet-600);\n --zds-color-badge-violet-text: var(--zds-color-utility-violet-700);\n\n --zds-color-badge-fuschia-bg: var(--zds-color-utility-fuschia-50);\n --zds-color-badge-fuschia-border: var(--zds-color-utility-fuschia-100);\n --zds-color-badge-fuschia-piece: var(--zds-color-utility-fuschia-600);\n --zds-color-badge-fuschia-text: var(--zds-color-utility-fuschia-700);\n\n --zds-color-badge-rose-bg: var(--zds-color-utility-rose-50);\n --zds-color-badge-rose-border: var(--zds-color-utility-rose-200);\n --zds-color-badge-rose-piece: var(--zds-color-utility-rose-600);\n --zds-color-badge-rose-text: var(--zds-color-utility-rose-700);\n\n /* ---- LES TROIS TEINTES CLAIRES DESCENDENT DE DEUX CRANS ---------------\n Arbitré le 2026-09-10, sur mesure.\n\n Turquoise, tilleul et jaune sont les trois teintes CLAIRES de la palette.\n Le Figma les avait déjà décalées d'un cran pour deux d'entre elles —\n bordure `Zest/50`, pièce `Zest/300`, texte `Zest/400` — et ça ne suffisait\n pas : leur libellé tenait 3,77 / 4,05 / 4,35 pour un seuil de 4,50, et\n leur PIÈCE 2,55 / 2,34 / 2,69 pour un seuil de 3,00. Un cran de plus sur\n la pièce et sur le texte les fait passer toutes les six mesures :\n\n turquoise pièce 600 -> 700 (2,55 -> 3,77) texte 700 -> 800 (3,77 -> 5,69)\n tilleul pièce 700 -> 800 (2,34 -> 4,05) texte 800 -> 900 (4,05 -> 7,00)\n jaune pièce 700 -> 800 (2,69 -> 4,35) texte 800 -> 900 (4,35 -> 7,59)\n\n ⚠️ LE RAPPORT PIÈCE/TEXTE EST PRÉSERVÉ, et c'est ce qui rend l'arbitrage\n propre : la nouvelle valeur de pièce est l'ANCIENNE valeur de texte. Les\n treize couleurs partagent donc la même règle — la pièce est un cran plus\n claire que le libellé — et ces trois-là sont simplement assises deux crans\n plus bas que les dix autres. Ce ne sont plus des exceptions.\n\n ⚠️ ON NE TOUCHE QUE CE QUI BLOQUE. Les dix autres couleurs tiennent leurs\n deux seuils (libellé 4,69 à 12,58 ; pièce 3,31 à 6,84) et gardent leurs\n paliers. Aligner les treize « par cohérence » aurait assombri dix couleurs\n justes pour rien.\n\n ⚠️ ET LA TEINTE SURVIT, contrairement à ce qu'un premier avis annonçait.\n L'objection « un tilleul au 900 n'est plus du tilleul » portait sur un\n APLAT saturé sous du texte blanc, où c'est le fond qui porte l'identité de\n la couleur. Ici le fond reste au palier 50 : seuls le texte et la pièce\n foncent, et un olive foncé sur un tilleul pâle se lit toujours comme du\n tilleul. La bordure ne bouge pas non plus — elle est décorative, un badge\n n'étant pas une commande. */\n\n --zds-color-badge-lime-bg: var(--zds-color-utility-lime-50);\n --zds-color-badge-lime-border: var(--zds-color-utility-lime-300);\n --zds-color-badge-lime-piece: var(--zds-color-utility-lime-800);\n --zds-color-badge-lime-text: var(--zds-color-utility-lime-900);\n\n --zds-color-badge-yellow-bg: var(--zds-color-utility-yellow-50);\n --zds-color-badge-yellow-border: var(--zds-color-utility-yellow-300);\n --zds-color-badge-yellow-piece: var(--zds-color-utility-yellow-800);\n --zds-color-badge-yellow-text: var(--zds-color-utility-yellow-900);\n\n /* ---- LE SURVOL DE LA CROIX DE FERMETURE -------------------------------\n Le palier 100 de la couleur, relevé sur l'état `Hover` du cadre\n `_Badge close X` (3869:4461). Son icône, elle, passe au palier du\n libellé : c'est le bloc de couleur du composant qui s'en charge.\n\n ⚠️ CES NEUF JETONS RÉPARENT UN MANQUEMENT À LA RÈGLE DES CALQUES.\n `Badge.css` citait ces valeurs en RAMPES BRUTES — `var(--zds-color-brand-100)`,\n `var(--zds-color-utility-violet-100)` — alors qu'un composant ne doit citer\n que le calque des rôles ou celui des jetons de composant. Treize citations\n en faute, toutes dans le badge ; un audit des cinq feuilles les a trouvées,\n et `verify:tokens` refuse désormais ce genre de citation.\n\n Quatre des treize n'ont pas eu besoin d'un jeton : `bg-brand-secondary`,\n `bg-error-secondary`, `bg-warning-secondary` et `bg-success-secondary`\n portaient déjà exactement le palier 100 de leur rampe. Le composant les\n cite directement.\n\n ⚠️ LE NAVY N'EN A PAS, LUI, ET C'EST UN PIÈGE ÉVITÉ. Le seul rôle qui\n porte `navy-30` est `border-secondary` — un rôle de BORDURE. L'employer\n pour peindre un APLAT serait exactement la confusion que la seconde\n vérification de `verify:tokens` existe pour empêcher : deux jetons qui\n partagent une valeur ne partagent pas un sens. */\n --zds-color-badge-navy-close-hover-bg: var(--zds-color-navy-30);\n --zds-color-badge-gray-close-hover-bg: var(--zds-color-utility-gray-100);\n --zds-color-badge-horizon-close-hover-bg: var(--zds-color-utility-horizon-100);\n --zds-color-badge-turquoise-close-hover-bg: var(--zds-color-utility-turquoise-100);\n --zds-color-badge-violet-close-hover-bg: var(--zds-color-utility-violet-100);\n --zds-color-badge-fuschia-close-hover-bg: var(--zds-color-utility-fuschia-100);\n --zds-color-badge-rose-close-hover-bg: var(--zds-color-utility-rose-100);\n --zds-color-badge-lime-close-hover-bg: var(--zds-color-utility-lime-100);\n --zds-color-badge-yellow-close-hover-bg: var(--zds-color-utility-yellow-100);\n\n /* ---- AVATAR -----------------------------------------------------------\n Relevé sur `Avatar` (3881:5036, 48 symboles), `Status icon` (3881:5020),\n `Avatar group` (3881:4989), `_Avatar add button` (3881:4946) et\n `Avatar label group` (3881:4930) le 2026-09-10.\n\n CE QUI EST CITÉ COMME RÔLE, et n'a donc pas de jeton ici : le libellé des\n initiales et le picto sont `text-tertiary` (navy-80) ; la bordure de la\n pastille est `border-primary` (navy-40) ; le fond du bouton d'ajout est\n `bg-primary` ; son anneau de focus est `focus-ring` ; le point en ligne est\n `fg-success-primary` (success-600). Cinq valeurs relevées, cinq rôles qui\n les portaient déjà.\n\n ⚠️ LES TROIS POINTS DE STATUT TIENNENT LES 3:1, ET DEUX D'ENTRE EUX ONT\n ÉTÉ FONCÉS POUR ÇA (2026-09-10, sur décision produit). La WCAG 1.4.11\n demande 3:1 à un objet graphique porteur d'information ; le disque d'un\n point de statut en est un, puisque sa couleur EST le message.\n\n en ligne `fg-success-primary` 3,59 inchangé\n hors ligne `navy-70` 3,67 était `navy-40`, à 1,44\n sensible `error-500` 3,76 était `error-200`, à 1,42\n\n Les trois tombent entre 3,59 et 3,76, ce qui leur donne le même poids\n visuel — une propriété qu'on n'a pas cherchée mais qu'on garde.\n\n ⚠️ LE GRIS VENAIT D'UNE COLLECTION TIERCE. Le Figma peint « hors ligne »\n avec `Component colors/Utility/Neutral/utility-neutral-300` (#d4d4d4). Le\n plus proche chez Zest était `gray-300` (ΔE 1,99), écarté parce qu'il est\n dans la rampe grise interdite ; le plus proche de ses propres neutres,\n `navy-40` (ΔE 4,03), a servi un temps — puis a été abandonné faute de\n contraste. `navy-70` est le palier le plus CLAIR des neutres de Zest qui\n tienne 3:1, donc le plus proche de l'intention du dessin.\n\n ⚠️ ET UNE OBJECTION QUE J'AVAIS FAITE ÉTAIT TROP LARGE. J'avais écrit que\n foncer ce gris ferait lire « hors ligne » comme un état ACTIF. C'est vrai\n d'un navy-80 ou d'un navy-100 ; ce n'est pas vrai de `navy-70`, un gris\n moyen qui se lit toujours comme une absence de couleur à côté du vert.\n L'objection valait pour l'ampleur du geste, pas pour le geste.\n\n ⚠️ LE DISQUE SENSIBLE ET SON PICTO NE POUVAIENT PAS TENIR ENSEMBLE. Le\n Figma peint un disque `Rouge/40` sous un picto `Rouge/200` : le picto tient\n bien 3,40 sur son disque, mais le disque ne tient que 1,42 sur du blanc. Et\n un disque assez foncé pour tenir 3:1 ne laisse plus passer aucun rouge en\n picto — au palier 500, un `error-600` tombe à 1,29. Les deux exigences\n s'excluent sur la même teinte. Le disque monte donc au 500 et le picto\n devient BLANC, à 3,76 : c'est la forme conventionnelle d'une alerte, et\n elle aligne ce point sur les deux autres — un disque saturé, un anneau\n blanc.\n\n ⚠️ L'ANNEAU DES AVATARS ET CELUI DU GROUPE SONT DEUX BLANCS DISTINCTS, et\n ce n'est pas un doublon. Le filet intérieur d'une photo sépare l'image de\n son propre contour ; l'anneau du groupe sépare deux avatars qui se\n chevauchent. Les deux valent blanc aujourd'hui et n'ont aucune raison de\n bouger ensemble : un fond de page sombre déplacerait le second, pas le\n premier. */\n --zds-color-avatar-bg: var(--zds-color-navy-20);\n --zds-color-avatar-mask: var(--zds-color-navy-100);\n\n /* Le filet qui empêche une photo claire de se fondre dans la page. Aucune\n rampe ne peut le porter : c'est du noir translucide, donc il s'assombrit\n sur ce qui est dessous quoi que ce soit — exactement le raisonnement du\n survol de la croix de fermeture posée sur une image. */\n --zds-color-avatar-photo-ring: rgb(0 0 0 / 0.16);\n --zds-color-avatar-inner-ring: var(--zds-color-white);\n --zds-color-avatar-group-ring: var(--zds-color-white);\n\n --zds-color-avatar-status-offline: var(--zds-color-navy-70);\n --zds-color-avatar-status-sensitive-bg: var(--zds-color-error-500);\n\n /* Le survol du bouton d'ajout, et son tireté. Le tireté n'est pas une\n couleur mais il n'a pas d'autre endroit : `border-primary` en trait\n discontinu de 1 px, relevé sur les quatre états. */\n --zds-color-avatar-add-bg-hover: var(--zds-color-navy-20);\n\n /* ---- CASE À COCHER ET BOUTON RADIO ------------------------------------\n Relevés sur `_Checkbox base` (3891:11902, 40 symboles) et `Checkbox`\n (3891:11629, 74 symboles), le 2026-09-10. Les deux formes partagent un\n seul atome : le Figma en fait un axe `Type`, pas deux composants.\n\n ⚠️ LA BORDURE DE L'ÉTAT DÉCOCHÉ A ÉTÉ FONCÉE, ET C'EST UN ARBITRAGE.\n Le Figma la peint `border-primary` (navy-40), qui tient **1,44** sur du\n blanc pour un seuil de 3:1 — le plus bas rencontré sur ce design system.\n Et c'est plus grave que sur le bouton, où le même compromis a été accepté à\n 2,17 : un bouton garde son libellé à 11,82, donc il reste identifiable,\n tandis qu'ici **la boîte EST le contrôle**. Une case décochée à 1,44 est\n presque invisible.\n\n navy-70 tient 3,67 : c'est le palier le plus CLAIR de nos neutres qui passe\n le seuil, donc le plus proche de l'intention du dessin. Exactement\n l'arbitrage rendu pour le point de statut « hors ligne » de l'avatar, qui\n partait lui aussi de navy-40. À remonter dans le Figma.\n\n ⚠️ ET AUCUN RÔLE DE BORDURE NE PORTE navy-70. Les rôles de bordure vont de\n navy-40 à navy-20, plus les teintes de marque et d'erreur. navy-70 est\n porté par `text-secondary` — un rôle de TEXTE : s'en servir pour peindre\n une BORDURE serait la confusion que la seconde vérification de\n `verify:tokens` existe pour empêcher. D'où un jeton de composant. */\n --zds-color-checkbox-border: var(--zds-color-navy-70);\n\n /* Le fond coché : `Bleu/100`, notre brand-500.\n\n ⚠️ ET CE N'EST PAS LE MÊME PALIER QUE LE BOUTON PLEIN, POUR UNE RAISON\n MESURÉE. Le bouton est descendu à brand-600 parce que du texte blanc sur\n brand-500 tient 3,60 là où l'AA en demande 4,50. Ici la marque blanche\n n'est pas du texte : c'est un objet graphique, dont la WCAG 1.4.11 demande\n 3:1. Les 3,60 passent. Le fond reste donc au palier que le Figma dessine —\n descendre d'un cran « par cohérence » foncerait un contrôle qui n'en a pas\n besoin.\n\n Aucun rôle de FOND ne porte brand-500 : `bg-brand-solid` est le 600, et\n `border-brand` porte bien le 500 mais c'est une BORDURE. */\n --zds-color-checkbox-bg-checked: var(--zds-color-brand-500);\n\n /* ⚠️ LE SURVOL EST UN AJOUT, PAS UN RELEVÉ, ET IL EST À REMONTER DANS LE\n FIGMA. Les quarante symboles de `_Checkbox base` portent bien un état\n `Hover`, mais il est identique au PIXEL à l'état `Default` — vérifié en\n échantillonnant la capture du cadre, sur les décochés, les cochés, les\n indéterminés et les radios. La variante existe donc, l'intention y était,\n et elle ne dessine rien. Décision produit du 2026-09-10 : on en dessine un.\n\n Décoché, le fond passe à navy-20 ; coché, il descend d'un cran. Ce cran-là\n n'a pas besoin de jeton : `bg-brand-solid` EST brand-600, c'est un rôle,\n de la bonne catégorie, et il est cité tel quel dans la feuille. */\n --zds-color-checkbox-bg-hover: var(--zds-color-navy-20);\n\n /* Le désactivé : un fond navy-20 ET `opacity: 0.5`, les deux à la fois.\n\n ⚠️ DEUX CHANGEMENTS, PAS UN, ET C'EST LE RELEVÉ QUI LE DIT. On aurait pu\n croire à une simple opacité posée sur l'état par défaut : les pixels\n disaient le contraire. Un blanc à 50 % sur du blanc reste blanc, et la\n bordure aurait donné #e9ebef, alors que la case désactivée mesure #f8f9fa —\n soit exactement navy-20 à 50 %. Le symbole confirme : fond navy-20, bordure\n conservée, opacité 0,5.\n\n L'opacité est le même mécanisme que le bouton désactivé, et c'est ce qui\n explique la marque : elle reste blanche parce que l'opacité s'applique au\n GROUPE, pas à chaque couche. */\n --zds-color-checkbox-bg-disabled: var(--zds-color-navy-20);\n\n /* ---- INFO-BULLE -------------------------------------------------------\n Relevé sur `Tooltip` (3266:935, 14 symboles) et `Help icon` (3266:1096,\n 28 symboles), le 2026-09-10.\n\n ⚠️ LE FOND EST `Bleu marine/100`, ET LE RÔLE QUI EN AURAIT L'AIR NE LE\n PORTE PAS. `--zds-color-bg-primary-solid` aboutit sur `gray-950`\n (#0a0d12), pas sur notre navy-100 (#21304e) — deux noirs différents, et le\n premier est dans la rampe grise que le design system n'emploie pas. La\n bulle provisoire de la documentation citait justement ce rôle, donc elle\n peignait un presque-noir là où la maquette peint un bleu marine ; c'est\n l'un des écarts que ce composant répare.\n\n Aucun rôle de FOND ne porte navy-100, et le Figma n'a pas de collection\n `Couleurs/Fond/` — c'est le cas où un jeton de composant est la bonne\n réponse, exactement comme pour les fonds du badge.\n\n ⚠️ LE TEXTE DE SOUTIEN, LUI, N'A PAS DE RÔLE NON PLUS. navy-20 est porté\n par `border-tertiary` (une BORDURE) et par trois fonds de bouton (des\n FONDS) : s'en servir pour du TEXTE serait la confusion que la seconde\n vérification de `verify:tokens` existe pour empêcher — deux jetons qui\n partagent une valeur ne partagent pas un sens.\n\n ⚠️ L'ICÔNE D'AIDE, EN REVANCHE, N'A BESOIN DE RIEN. Le Figma la trace en\n `Bleu marine/80` au repos et en `Bleu marine/100` quand la bulle est\n ouverte — ce qui EST, à la valeur près, la paire `text-tertiary` /\n `text-tertiary-hover`. Deux rôles trouvés, aucun jeton déclaré : c'est la\n méthode que la réparation des treize sauts de couche du badge a apprise,\n chercher un rôle qui porte déjà la valeur avant d'en écrire un. */\n --zds-color-tooltip-bg: var(--zds-color-navy-100);\n --zds-color-tooltip-supporting-text: var(--zds-color-navy-20);\n\n /* ⚠️ L'OMBRE DE L'INFO-BULLE EST UN `filter`, PAS UN `box-shadow`, ET LE\n NOM LE DIT POUR QU'ON NE SE TROMPE PAS DE PROPRIÉTÉ. La raison est la\n flèche : un `box-shadow` dessine le rectangle de la boîte, donc il\n ombrerait un rectangle autour de la bulle ET de sa flèche, en laissant la\n flèche elle-même plate. Un `drop-shadow` suit la SILHOUETTE peinte, donc\n la flèche projette son ombre comme le reste — c'est ce que rend la\n maquette, et c'est la forme demandée par l'équipe produit le 2026-09-10.\n\n ⚠️ AUCUN DE NOS JETONS D'OMBRE N'EST EXPRIMABLE AINSI. `--zds-shadow-lg`\n porte trois couches à ÉTALEMENT NÉGATIF (`-4px`, `-2px`, `-1px`), et\n `drop-shadow()` n'a pas de paramètre d'étalement — les recopier sans leur\n étalement les élargirait. Les deux couches ci-dessous sont donc le relevé\n du Figma, pas une citation.\n\n ⚠️ ET LA TEINTE A ÉTÉ SUBSTITUÉE, DÉLIBÉRÉMENT. Le Figma pose ces ombres\n en `rgba(16, 24, 40, …)` — un #101828 qui appartient à une collection\n TIERCE, étrangère à celle de Zest, comme le `utility-slate-50` du badge.\n Toute notre rampe d'ombres est en noir. À 8 % d'opacité l'écart se mesure :\n sur du blanc, #101828 donne 236,9 de rouge et le noir 234,6 — 2,3 niveaux\n sur 255. La cohérence du thème vaut plus que ces 2,3 niveaux. */\n --zds-shadow-tooltip-filter: drop-shadow(0px 12px 8px rgb(0 0 0 / 0.08))\n drop-shadow(0px 4px 3px rgb(0 0 0 / 0.03));\n\n /* Le `Badge modern` : un fond blanc, la bordure neutre et l'ombre de la\n page — la couleur n'y vit QUE dans le point ou l'icône de tête. Son\n libellé est `Bleu marine/80` quelle que soit la couleur choisie, ce qui\n est notre `text-tertiary` : c'est un rôle, il est cité tel quel et n'a\n pas de jeton ici. */\n\n /* Le fond du survol de la croix de fermeture, au palier 100 de la couleur.\n Treize valeurs pour un seul rôle : le composant les compose lui-même\n depuis `--zds-badge-close-hover-bg`, rempli par le modificateur de\n couleur. Rien à déclarer ici. */\n\n /* NOT ported, and deliberately: the reference theme also carries\n `app-store-badge-border`, `screen-mockup-border`, `footer-button-fg`\n (+ `_hover`) and `text-editor-icon-fg` (+ `_active`). They name parts of\n ITS marketing-site components, not of any Zest component — importing them\n would grow the vocabulary with words nothing here will ever say. */\n\n /* ============================================================\n * TYPOGRAPHY\n * ============================================================ */\n --zds-font-family-body: \"Averta\", -apple-system, \"Segoe UI\", Roboto, Arial, sans-serif;\n --zds-font-family-display: \"Averta\", -apple-system, \"Segoe UI\", Roboto, Arial, sans-serif;\n\n /* Averta has no Medium: nothing sits between Regular and Semibold. Use\n `--zds-font-weight-semibold` for emphasis instead of inventing a 500. */\n --zds-font-weight-normal: 400;\n --zds-font-weight-semibold: 600;\n --zds-font-weight-bold: 700;\n\n /* Sizes follow Zest's own names — caption, body, heading, display — not a\n generic sm/md/lg scale. Negative tracking on large titles is -2% of the\n size; it comes from Figma up to `display-lg`, and the same rule is\n extended beyond it. */\n --zds-text-caption-sm: 8px;\n --zds-text-caption-sm-line-height: 12px;\n\n --zds-text-caption-md: 12px;\n --zds-text-caption-md-line-height: 18px;\n\n --zds-text-body-sm: 14px;\n --zds-text-body-sm-line-height: 20px;\n\n --zds-text-body-md: 16px;\n --zds-text-body-md-line-height: 24px;\n\n --zds-text-heading-sm: 18px;\n --zds-text-heading-sm-line-height: 28px;\n\n --zds-text-heading-md: 20px;\n --zds-text-heading-md-line-height: 30px;\n\n --zds-text-heading-lg: 22px;\n --zds-text-heading-lg-line-height: 32px;\n\n --zds-text-display-xs: 24px; /* outside Figma */\n --zds-text-display-xs-line-height: 32px;\n\n --zds-text-display-sm: 30px;\n --zds-text-display-sm-line-height: 38px;\n\n --zds-text-display-md: 36px;\n --zds-text-display-md-line-height: 44px;\n --zds-text-display-md-letter-spacing: -0.72px;\n\n --zds-text-display-lg: 48px;\n --zds-text-display-lg-line-height: 60px;\n --zds-text-display-lg-letter-spacing: -0.96px;\n\n --zds-text-display-xl: 60px; /* outside Figma */\n --zds-text-display-xl-line-height: 72px;\n --zds-text-display-xl-letter-spacing: -1.2px;\n\n --zds-text-display-2xl: 72px; /* outside Figma */\n --zds-text-display-2xl-line-height: 90px;\n --zds-text-display-2xl-letter-spacing: -1.44px;\n\n /* ============================================================\n * SPACING — Zest's named scale, exposed numerically.\n * ============================================================ */\n --zds-space-none: 0px;\n --zds-space-xxs: 2px;\n --zds-space-xs: 4px;\n --zds-space-sm: 6px;\n --zds-space-md: 8px;\n --zds-space-lg: 12px;\n --zds-space-xl: 16px;\n --zds-space-2xl: 20px;\n --zds-space-3xl: 24px;\n --zds-space-4xl: 32px;\n --zds-space-5xl: 40px;\n --zds-space-6xl: 48px;\n --zds-space-7xl: 64px;\n --zds-space-8xl: 80px;\n --zds-space-9xl: 96px;\n --zds-space-10xl: 128px;\n --zds-space-11xl: 160px;\n\n /* ============================================================\n * WIDTHS — a width BOUNDS a block (a text column, a panel, a modal);\n * spacing separates two things. Different job, different scale.\n *\n * These 13 steps come from the reference delivery's code, not from Figma:\n * Figma carries a `width-*` scale offset by two steps, and the 2026-09-07\n * product call is that for widths the code decides. Same rule for the\n * names: where Figma and the code disagree on a suffix, the code wins.\n *\n * The reference delivery gets these from its CSS engine and can't declare\n * them as tokens — a `--spacing-2xl` there would hijack `max-w-2xl` and\n * collapse an article to 48px. This package has no such collision: the\n * `--zds-` prefix keeps the two scales apart, so both are named.\n * ============================================================ */\n --zds-width-3xs: 256px;\n --zds-width-2xs: 288px;\n --zds-width-xs: 320px;\n --zds-width-sm: 384px;\n --zds-width-md: 448px;\n --zds-width-lg: 512px;\n --zds-width-xl: 576px;\n --zds-width-2xl: 672px;\n --zds-width-3xl: 768px;\n --zds-width-4xl: 896px;\n --zds-width-5xl: 1024px;\n --zds-width-6xl: 1152px;\n --zds-width-7xl: 1280px;\n\n /* The frame of a page rather than of a block: its two gutters and its cap. */\n --zds-container-padding-mobile: 16px;\n --zds-container-padding-desktop: 32px;\n --zds-container-max-width-desktop: 1280px;\n\n /* Kept apart from the widths on purpose: a text column isn't set by the\n room available but by a comfortable line length. Past it, the eye loses\n the next line on the way back to the margin. Figma's\n `paragraph-max-width`, and what `.prose` already caps itself at. */\n --zds-paragraph-max-width: 720px;\n\n /* ============================================================\n * RADIUS\n * ============================================================ */\n --zds-radius-none: 0px;\n --zds-radius-xxs: 2px;\n --zds-radius-xs: 4px;\n --zds-radius-sm: 6px;\n --zds-radius-md: 8px;\n --zds-radius-lg: 10px;\n --zds-radius-xl: 12px;\n --zds-radius-2xl: 16px;\n --zds-radius-3xl: 20px;\n --zds-radius-4xl: 24px;\n --zds-radius-full: 9999px;\n\n /* ============================================================\n * SHADOW\n * ============================================================ */\n --zds-shadow-xs: 0px 1px 2px rgba(0, 0, 0, 0.05);\n --zds-shadow-sm: 0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px -1px rgba(0, 0, 0, 0.1);\n --zds-shadow-md: 0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.06);\n --zds-shadow-lg: 0px 12px 16px -4px rgba(0, 0, 0, 0.08), 0px 4px 6px -2px rgba(0, 0, 0, 0.03),\n 0px 2px 2px -1px rgba(0, 0, 0, 0.04);\n --zds-shadow-xl: 0px 20px 24px -4px rgba(0, 0, 0, 0.08), 0px 8px 8px -4px rgba(0, 0, 0, 0.03),\n 0px 3px 3px -1.5px rgba(0, 0, 0, 0.04);\n --zds-shadow-2xl: 0px 24px 48px -12px rgba(0, 0, 0, 0.18), 0px 4px 4px -2px rgba(0, 0, 0, 0.04);\n --zds-shadow-3xl: 0px 32px 64px -12px rgba(0, 0, 0, 0.14), 0px 5px 5px -2.5px rgba(0, 0, 0, 0.04);\n\n /* Two inset shadows: relief, not depth.\n\n The two inks are NAMED rather than inlined, because a component sometimes\n needs one without the other. A bordered button wants the bottom highlight\n and NOT the 1px outline — that outline sits on the same pixel as the\n button's own border, and painting both means the border token is not what\n you see. Measured 2026-09-09: navy-40 under the 18% ink reads #ADB0B6,\n while the token says #D3D7DE. Naming the parts is what makes the\n difference expressible.\n\n Their values come from the Figma's `Colors/Effects/Shadows/` collection —\n English-named, so a residual one predating Zest's semantic layer — but a\n neutral black ink is not a brand colour, and both values are Zest's own\n Figma as measured. */\n --zds-color-shadow-skeuomorphic-outline: rgb(0 0 0 / 0.18);\n --zds-color-shadow-skeuomorphic-bottom: rgb(0 0 0 / 0.05);\n\n --zds-shadow-skeuomorphic: 0px 0px 0px 1px var(--zds-color-shadow-skeuomorphic-outline) inset,\n 0px -2px 0px 0px var(--zds-color-shadow-skeuomorphic-bottom) inset;\n --zds-shadow-xs-skeuomorphic: var(--zds-shadow-skeuomorphic), var(--zds-shadow-xs);\n\n /* ---- LE BISEAU SKÉUOMORPHIQUE ------------------------------------------\n Le liseré clair des boutons pleins n'est pas uniforme : il s'allume en\n haut et s'éteint en bas, ce qui simule une lumière venant du dessus. C'est\n la moitié du relief — l'autre étant les deux ombres intérieures.\n\n ⚠️ LES DEUX BORNES SONT À CONFIRMER. Le MCP Figma rapporte ce contour\n comme PLAT (`rgba(255,255,255,0.12)`) sur deux lectures, `forceCode`\n compris, et `get_metadata` ne montre aucun calque de dégradé : l'outil\n l'aplatit, ou il l'est. La borne haute vient donc de cette valeur relevée,\n et l'extinction complète en bas est la recette standard. Si le Figma\n s'arrête ailleurs qu'à zéro, c'est la seule valeur à corriger ici. */\n --zds-color-button-bevel-from: rgb(255 255 255 / 0.12);\n --zds-color-button-bevel-to: rgb(255 255 255 / 0);\n --zds-gradient-button-bevel: linear-gradient(\n 180deg,\n var(--zds-color-button-bevel-from) 0%,\n var(--zds-color-button-bevel-to) 100%\n );\n\n /* ============================================================\n * MOTION — not part of the Figma source; kept for component transitions.\n * ============================================================ */\n --zds-transition-fast: 0.15s ease;\n}\n","/* Zest Design System — Averta, the brand typeface.\n *\n * Under a commercial license: its files live in this package and this\n * design system is what declares them, not the consuming app. Importing the\n * package root is enough to get the font, with nothing to wire up on the\n * consumer side.\n *\n * Six files — 400 Regular, 600 Semibold, 700 Bold, each with its italic. The\n * full family has eight weights; serving the rest would make every visitor\n * download drawings nothing uses. No Medium (500): Averta doesn't have one,\n * and `--zds-font-weight-medium` doesn't exist in tokens.css for that reason.\n *\n * The italics are real drawings, not a browser-synthesized slant: without\n * the file, the browser fakes one by slanting the upright letterforms, and\n * curves like the `a` keep their upright shape — no longer what the\n * typeface's italic actually draws.\n */\n\n@font-face {\n font-family: \"Averta\";\n font-style: normal;\n font-weight: 400;\n font-display: swap;\n src: url(\"../fonts/averta-400.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: italic;\n font-weight: 400;\n font-display: swap;\n src: url(\"../fonts/averta-400-italic.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: normal;\n font-weight: 600;\n font-display: swap;\n src: url(\"../fonts/averta-600.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: italic;\n font-weight: 600;\n font-display: swap;\n src: url(\"../fonts/averta-600-italic.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: url(\"../fonts/averta-700.woff2\") format(\"woff2\");\n}\n\n@font-face {\n font-family: \"Averta\";\n font-style: italic;\n font-weight: 700;\n font-display: swap;\n src: url(\"../fonts/averta-700-italic.woff2\") format(\"woff2\");\n}\n","/* Zest Design System — prose.\n *\n * Styles a block of AUTHORED text whose tags weren't hand-written one by\n * one: docs, a changelog, a legal page, an article pulled from Markdown or\n * an editor. The text arrives as bare HTML with no classes, so it can't be\n * dressed element by element.\n *\n * <article class=\"prose\"> … </article>\n *\n * The rest of the interface doesn't need this: a button label or a column\n * header carries its own classes, and that's better.\n *\n * ---------------------------------------------------------------------------\n * Hierarchy is carried as much by COLOR as by size: headings sit on\n * `--zds-color-text-primary`, body text one step lighter. That's what lets a\n * heading stand out without having to grow disproportionately large.\n *\n * Every selector is wrapped in `:where()`, so it carries zero specificity —\n * a utility class placed on an element always wins. This sheet offers a\n * layout, it doesn't lock it in.\n */\n\n.prose {\n /* 720px — Zest's Figma measure (`paragraph-max-width`), already the width\n of the docs site's text column. Cited as a token rather than repeated:\n the value was written twice and the two copies could drift. */\n max-width: var(--zds-paragraph-max-width);\n\n font-size: var(--zds-text-body-md);\n line-height: var(--zds-text-body-md-line-height);\n color: var(--zds-color-text-tertiary);\n\n /* `pretty` keeps a paragraph from ending on a single orphaned word. */\n text-wrap: pretty;\n}\n\n/* --- HEADINGS ------------------------------------------------------------ */\n/* The space above a heading is three times the space to its own text: a\n heading belongs to what FOLLOWS it, and the whitespace should say so. */\n.prose :where(h1) {\n margin-block: 0 1.5rem;\n font-size: var(--zds-text-display-sm);\n line-height: var(--zds-text-display-sm-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n.prose :where(h2) {\n margin-block: 3rem 1rem;\n font-size: var(--zds-text-heading-lg);\n line-height: var(--zds-text-heading-lg-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n.prose :where(h3) {\n margin-block: 2rem 0.5rem;\n font-size: var(--zds-text-heading-md);\n line-height: var(--zds-text-heading-md-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n.prose :where(h4) {\n margin-block: 1.5rem 0.5rem;\n font-size: var(--zds-text-heading-sm);\n line-height: var(--zds-text-heading-sm-line-height);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-wrap: balance;\n}\n\n/* --- BODY TEXT ------------------------------------------------------------ */\n.prose :where(p) {\n margin-block: 0 1.25rem;\n}\n\n/* Averta has no Medium: emphasis is 600. 700 stays reserved for headings —\n a bold run of body text shouts more than it emphasizes. */\n.prose :where(strong, b) {\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n}\n\n.prose :where(a) {\n color: var(--zds-color-text-brand-tertiary);\n text-decoration: underline;\n}\n\n.prose :where(a):hover {\n color: var(--zds-color-text-brand-secondary);\n}\n\n/* --- LISTS ----------------------------------------------------------------- */\n.prose :where(ul, ol) {\n margin-block: 0 1.25rem;\n padding-inline-start: 1.25rem;\n}\n\n.prose :where(ul) {\n list-style-type: disc;\n}\n\n.prose :where(ol) {\n list-style-type: decimal;\n}\n\n.prose :where(li) {\n margin-block: 0.5rem;\n}\n\n/* A nested list tightens up: it's a detail of its parent, not a new list. */\n.prose :where(li > ul, li > ol) {\n margin-block: 0.5rem 0;\n}\n\n.prose :where(li)::marker {\n color: var(--zds-color-text-quaternary);\n}\n\n/* --- QUOTE ------------------------------------------------------------------ */\n/* A rule rather than a fill: the quote stays in the flow of the text instead\n of becoming a boxed-off callout.\n\n It keeps the body text's color. Lightening it would drop to 3.67:1 —\n under the AA threshold — while a quote is text meant to be read, often\n several lines. The rule and the indent already set it apart. */\n.prose :where(blockquote) {\n margin-block: 2rem;\n padding-inline-start: 1.25rem;\n border-inline-start: 2px solid var(--zds-color-border-primary);\n}\n\n.prose :where(blockquote p:last-child) {\n margin-block-end: 0;\n}\n\n/* --- CODE -------------------------------------------------------------------- */\n/* This design system doesn't ship a monospace family. A code fragment is set\n off with a pill — a soft fill, a radius, a little padding — rather than a\n font change. */\n.prose :where(code) {\n padding: 0.125rem 0.375rem;\n border-radius: var(--zds-radius-xs);\n background-color: var(--zds-color-bg-secondary);\n color: var(--zds-color-text-primary);\n font-size: 0.9375em;\n}\n\n.prose :where(pre) {\n margin-block: 0 1.5rem;\n padding: 1rem;\n border-radius: var(--zds-radius-lg);\n background-color: var(--zds-color-bg-secondary);\n /* A code block overflows rather than wraps: a folded line in the middle\n of a command makes it wrong to copy. */\n overflow-x: auto;\n}\n\n/* Inside a block, the pill no longer applies: the block itself is the\n delimiter. */\n.prose :where(pre code) {\n padding: 0;\n border-radius: 0;\n background-color: transparent;\n font-size: inherit;\n}\n\n/* --- IMAGES ------------------------------------------------------------------ */\n.prose :where(figure) {\n margin-block: 2rem;\n}\n\n.prose :where(img) {\n border-radius: var(--zds-radius-lg);\n}\n\n/* The caption is set apart by SIZE, not by paleness: a lighter gray would\n fall under the contrast threshold, and a caption is still text meant to\n be read. */\n.prose :where(figcaption) {\n margin-block-start: 0.75rem;\n font-size: var(--zds-text-body-sm);\n line-height: var(--zds-text-body-sm-line-height);\n}\n\n/* --- TABLE -------------------------------------------------------------------- */\n.prose :where(table) {\n width: 100%;\n margin-block: 0 1.5rem;\n border-collapse: collapse;\n font-size: var(--zds-text-body-sm);\n line-height: var(--zds-text-body-sm-line-height);\n text-wrap: initial;\n}\n\n.prose :where(th) {\n padding: 0.75rem 1rem 0.75rem 0;\n border-block-end: 1px solid var(--zds-color-border-primary);\n font-weight: var(--zds-font-weight-semibold);\n color: var(--zds-color-text-primary);\n text-align: start;\n}\n\n.prose :where(td) {\n padding: 0.75rem 1rem 0.75rem 0;\n border-block-end: 1px solid var(--zds-color-border-secondary);\n vertical-align: baseline;\n}\n\n.prose :where(th:last-child, td:last-child) {\n padding-inline-end: 0;\n}\n\n/* --- DIVIDER ------------------------------------------------------------------ */\n/* It separates two subjects, so it carries more weight than a gap between\n sections. */\n.prose :where(hr) {\n margin-block: 3rem;\n border: 0;\n border-block-start: 1px solid var(--zds-color-border-secondary);\n}\n\n/* --- BLOCK EDGES ---------------------------------------------------------------- */\n/* Without this, the first heading pushes the block down and the last\n paragraph leaves whitespace nobody asked for. The container owns its own\n margins, not its content. */\n.prose > :where(:first-child) {\n margin-block-start: 0;\n}\n\n.prose > :where(:last-child) {\n margin-block-end: 0;\n}\n","/* Zest Design System — base resets.\n *\n * The least specific rules the package ships: any application rule overrides\n * these without needing `!important`. A design system proposes, it doesn't\n * impose.\n */\n\nhtml,\nbody {\n font-family: var(--zds-font-family-body);\n\n /* Without smoothing, Averta consistently renders bolder than in Figma. */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Settings Averta ships with that browsers don't enable on their own. */\n -webkit-font-variant-ligatures: contextual;\n font-variant-ligatures: contextual;\n -webkit-font-kerning: normal;\n font-kerning: normal;\n}\n\n/* The default underline (`auto`) cuts through the descenders of p, g and y —\n the word reads as struck through. Set in `em` so the offset scales with\n the text size, and on the universal selector rather than `body`: an `em`\n on an inherited property resolves against the element that DECLARES it,\n so the absolute length is what gets inherited. On `body`, the 0.18em\n value was a fixed 2.88px across every size from 8px to 72px. */\n*,\n::before,\n::after {\n text-underline-offset: 0.18em;\n}\n","/**\n * L'indicateur de chargement.\n *\n * ⚠️ LA SEULE PIÈCE DE CETTE LIVRAISON QUI NE VIENT PAS DU DESSIN FIGMA.\n * Le cadre `Buttons/Button loading icon` (3861:2509) existe et donne deux\n * tailles — 20 et 24 px — mais son tracé n'a pas pu être lu : l'export SVG de\n * Figma passe par une URL que cette machine n'a pas le droit d'appeler. Le\n * relevé s'arrête donc aux deux tailles et aux deux couleurs que ses variables\n * déclarent (`Bleu marine/80` et `Blanc`).\n *\n * Le reste est une CONSTRUCTION, à valider : un anneau dont la piste est le\n * `currentColor` à 30 % et dont la tête fait un quart de tour. C'est la forme\n * conventionnelle, et elle a l'avantage de suivre la couleur du texte — donc\n * de fonctionner en blanc sur un Primary comme en rouge sur un destructif,\n * sans qu'on ait à exporter une image par hiérarchie.\n *\n * Et de toute façon un cadre statique ne peut pas décrire une rotation : la\n * durée, le sens et la courbe d'accélération n'existent nulle part dans le\n * Figma. Elles sont posées ici, pas relevées.\n */\n\n.zds-spinner {\n display: inline-flex;\n flex: none;\n width: var(--zds-spinner-size, 20px);\n height: var(--zds-spinner-size, 20px);\n color: inherit;\n}\n\n.zds-spinner--sm {\n --zds-spinner-size: 20px;\n}\n\n.zds-spinner--md {\n --zds-spinner-size: 24px;\n}\n\n.zds-spinner__svg {\n display: block;\n width: 100%;\n height: 100%;\n animation: zds-spinner-rotation 0.7s linear infinite;\n}\n\n/* La piste et la tête sont le MÊME `currentColor`, la piste à 30 %. Deux\n couleurs distinctes obligeraient à choisir un gris, et ce gris serait faux\n sur un aplat bleu comme sur un aplat rouge. */\n.zds-spinner__track {\n opacity: 0.3;\n}\n\n/* Le libellé pour les lecteurs d'écran : retiré de l'affichage, PAS du\n document. Un `display: none` ou un `visibility: hidden` le retirerait aussi\n de l'arbre d'accessibilité, et il ne serait plus annoncé — le défaut serait\n invisible à la relecture, puisque la page se rend exactement pareil.\n\n La règle est volontairement PORTÉE PAR LE COMPOSANT et non par une classe\n utilitaire partagée : ce paquet publie des variables, pas de moteur CSS, et\n annoncer une `.zds-visually-hidden` serait un premier utilitaire glissé en\n contrebande. À trancher une fois pour toutes quand un deuxième composant en\n aura besoin. */\n.zds-spinner__label {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n border: 0;\n}\n\n@keyframes zds-spinner-rotation {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n}\n\n/* Ralenti, pas arrêté. Un indicateur figé ne dit plus « en cours » mais\n « bloqué » : c'est l'information même qui disparaît. La recommandation vise\n les mouvements amples et répétés qui déclenchent des malaises vestibulaires,\n et un anneau de 20 px qui tourne lentement n'en fait pas partie. */\n@media (prefers-reduced-motion: reduce) {\n .zds-spinner__svg {\n animation-duration: 2s;\n }\n}\n","/**\n * Le bouton — relevé sur le Figma « ❖ Design System V2.0 », cadres\n * `Buttons/Button` (3861:1124) et `Buttons/Button destructive` (3861:1862).\n *\n * ------------------------------------------------------------------------\n * UN SEUL ÉCART AU FIGMA, ET IL EST ARBITRÉ\n * ------------------------------------------------------------------------\n * Le Figma peint le Primary au repos en `Bleu/100` (#4481FF, notre brand-500).\n * Mesuré, du blanc dessus tient 3,60:1, sous le seuil AA de 4,5:1 — et son\n * survol, en `Bleu/200`, tient 4,54. Le bouton était donc PLUS lisible au\n * survol qu'au repos. Arbitré le 2026-09-09 : chaque état descend d'un palier,\n * repos sur `bg-brand-solid` (600) et survol sur `bg-brand-solid-hover` (700).\n *\n * Ce n'est pas qu'une correction d'accessibilité : le destructif était DÉJÀ sur\n * le palier 600 au repos. Le Figma était incohérent entre ses deux familles, et\n * le décalage les aligne. À répercuter dans le Figma.\n *\n * ------------------------------------------------------------------------\n * CE QUI EST REPRODUIT TEL QUEL, MÊME QUAND ÇA SURPREND\n * ------------------------------------------------------------------------\n * · l'état inactif est un `opacity: 0.5` posé sur l'état par défaut, pas une\n * palette. C'est le mécanisme du Figma, et il vaut pour les onze\n * hiérarchies — d'où une seule règle ici ;\n * · le survol d'un lien AJOUTE un soulignement, peint plus clair que le\n * libellé (libellé au palier 700, trait au 500). La variante grise est la\n * seule à ne pas suivre ce motif : son trait suit son texte. Relevé, pas\n * harmonisé ;\n * · le relief « skéuomorphique » est un CHOIX de Zest, pas une fatalité : le\n * biseau et les deux ombres intérieures sont isolés dans leurs jetons, donc\n * un thème plat se règle sans toucher au composant.\n *\n * DEUX INCOHÉRENCES DU FIGMA QUI NE SONT PAS REPRODUITES. Sur\n * `Secondary gray` et sur le bouton de fermeture, l'état FOCUS repeint le fond\n * en blanc alors que l'état par défaut ne l'est pas. Un focus déplace l'anneau,\n * il ne redessine pas le bouton — sans quoi le fond saute au moment où on\n * atteint la pièce au clavier. Les deux ont vraisemblablement été construits\n * depuis `Secondary white`. Signalé dans la page, pas recopié.\n */\n\n.zds-button {\n /* ---- Fentes de géométrie, remplies par le modificateur de taille ------\n Les cinq tailles ne diffèrent que par ces sept valeurs. Les écrire en\n propriétés personnalisées évite que les onze hiérarchies redéclarent\n chacune sa géométrie : une hiérarchie ne parle que de couleur. */\n --zds-button-height: 40px;\n --zds-button-padding-y: 10px;\n --zds-button-padding-x: 14px;\n --zds-button-gap: var(--zds-space-xs);\n --zds-button-icon: 20px;\n --zds-button-font: var(--zds-text-body-sm);\n --zds-button-line: var(--zds-text-body-sm-line-height);\n\n /* Le rayon du Figma s'appelle `radius-sm` et vaut 8 px, soit notre\n `--zds-radius-md` — notre `radius-sm` vaut 6. Mappé par valeur mesurée,\n jamais par nom : c'est la règle du dépôt, et elle s'applique ici. */\n --zds-button-radius: var(--zds-radius-md);\n\n /* ---- Fentes d'ombre --------------------------------------------------\n `box-shadow` est UNE propriété : l'anneau de focus et le relief doivent\n donc cohabiter dans une seule liste. Chacun a sa fente, tenue à une\n valeur transparente mais VALIDE quand il ne sert pas — un `none` glissé\n dans une liste rendrait toute la déclaration invalide, et le bouton\n perdrait son relief sans rien signaler. */\n --zds-button-ring: 0 0 0 0 transparent, 0 0 0 0 transparent;\n --zds-button-relief: 0 0 0 0 transparent;\n\n box-shadow: var(--zds-button-ring), var(--zds-button-relief);\n\n /* `relative` pour que le biseau des aplats se cadre sur le bouton — voir\n plus bas. Sans lui, le pseudo-élément se positionnerait sur le premier\n ancêtre positionné, qui peut être n'importe où dans la page. */\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--zds-button-gap);\n\n /* La hauteur est POSÉE, pas déduite du contenu. En chargement, le spinner\n fait 20 px alors que la ligne de texte de `lg` en fait 24 : sans cette\n hauteur minimale, le bouton passerait de 44 à 40 px au moment de l'envoi.\n Le Figma pose la même contrainte sur ses états de chargement `lg` et `xl`. */\n box-sizing: border-box;\n min-height: var(--zds-button-height);\n padding: var(--zds-button-padding-y) var(--zds-button-padding-x);\n\n border: 0;\n border-radius: var(--zds-button-radius);\n background: transparent;\n\n font-family: inherit;\n font-size: var(--zds-button-font);\n line-height: var(--zds-button-line);\n font-weight: var(--zds-font-weight-semibold);\n text-align: center;\n text-decoration: none;\n white-space: nowrap;\n\n cursor: pointer;\n transition:\n background-color var(--zds-transition-fast),\n color var(--zds-transition-fast),\n box-shadow var(--zds-transition-fast);\n}\n\n/* ---- LE BISEAU DES APLATS -------------------------------------------\n Le liseré clair d'un bouton plein s'allume en haut et s'éteint en bas : il\n simule une lumière venant du dessus. Un `border` CSS ne sait pas porter de\n dégradé, et une vraie bordure de 2 px ferait grandir la boîte de 4 px — un\n `md` passerait de 40 à 44. D'où un pseudo-élément, qui ne touche pas à la\n mise en page.\n\n La technique : le pseudo-élément est rempli du dégradé, puis MASQUÉ de façon\n à ne garder que son anneau de 2 px. Les deux masques se composent en\n `exclude` — le premier couvre la boîte de contenu, le second toute la boîte,\n et la différence est exactement l'anneau. `-webkit-mask` d'abord, pour les\n Safari qui ne connaissent pas encore la propriété non préfixée.\n\n `inset: 0` et `border-radius: inherit` : l'anneau suit le rayon du bouton,\n donc aussi celui des liens (4 px) — sauf qu'ils n'ont pas de biseau.\n\n ⚠️ Il est `pointer-events: none` : posé par-dessus le contenu, il\n intercepterait sinon les clics au centre du bouton. */\n.zds-button--primary::before,\n.zds-button--primary-destructive::before {\n content: \"\";\n position: absolute;\n inset: 0;\n padding: 2px;\n border-radius: inherit;\n background: var(--zds-gradient-button-bevel);\n pointer-events: none;\n\n -webkit-mask:\n linear-gradient(#000 0 0) content-box,\n linear-gradient(#000 0 0);\n mask:\n linear-gradient(#000 0 0) content-box,\n linear-gradient(#000 0 0);\n -webkit-mask-composite: xor;\n mask-composite: exclude;\n}\n\n/* Le libellé porte 2 px de marge horizontale, et le bouton a perdu ces 2 px\n sur son propre padding. C'est l'équilibre optique documenté par les\n guidelines : une icône est dessinée dans un cadre qui lui laisse 1 à 2 px de\n jeu, si bien qu'un bouton à icône paraît trop espacé à gauche. Déplacer ces\n 2 px du bouton vers le texte recentre l'ensemble, avec ou sans icône. */\n.zds-button__label {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding-inline: var(--zds-space-xxs);\n}\n\n/* Les icônes du paquet ne portent PAS leur taille : leur en-tête renvoie aux\n classes utilitaires, qui n'existent pas ici — ce paquet publie des variables,\n pas de moteur CSS. Sans cette enveloppe, un `<svg>` sans dimensions se rend\n à la taille par défaut du remplacement et déforme le bouton. */\n.zds-button__icon {\n display: inline-flex;\n flex: none;\n width: var(--zds-button-icon);\n height: var(--zds-button-icon);\n}\n\n/* ⚠️ EN CHARGEMENT, L EMPLACEMENT VAUT 20 px A TOUTES LES TAILLES, y compris\n `xs` dont l icone ordinaire n en fait que 16. Le spinner mesure 20 px partout\n — c est le releve du Figma, verifie sur les quatre etats de chargement. Sans\n cette regle il debordait de son emplacement sur `xs` : le dessin restait a\n 20 px, la boite reservee a 16, et le bouton se retrouvait 4 px trop etroit.\n Le compte tombe juste — 6 + 20 + 6 font bien les 32 px de `xs`. */\n.zds-button--loading .zds-button__icon {\n width: 20px;\n height: 20px;\n}\n\n.zds-button__icon > svg,\n.zds-button__icon > img {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n/* `:focus-visible` et non `:focus` : le second s'allume aussi au clic, ce qui\n met un anneau autour de chaque bouton pressé à la souris. Les utilisateurs\n finissent par demander de le retirer, et le retirer casse la navigation au\n clavier. Même raisonnement que la page « Anneau de focus ».\n\n L'anneau est un `box-shadow` et non un `outline` : 2 px de la couleur de\n fond puis 2 px de couleur, ce qui détache l'anneau du bouton même sur un\n aplat de la même teinte. Un `outline` ne sait pas faire ces deux couches. */\n/* ⚠️ `[data-zds-demo=\"focus\"]` EST UN CROCHET DE DOCUMENTATION, ET IL EST\n LIVRÉ EXPRÈS. Un anneau de focus ne s'affiche que sous `:focus-visible`,\n donc jamais sur une planche statique ni sur une capture de relecture — et un\n état qu'on ne peut pas montrer est un état qu'on ne relit jamais. Le Figma,\n lui, en dessine bien une variante `State=Focused`.\n\n Les deux sélecteurs partagent UNE déclaration : la démonstration ne peut\n donc pas dériver de l'anneau réel, ce qui serait le seul vrai danger. */\n.zds-button:focus-visible,\n.zds-button[data-zds-demo=\"focus\"] {\n outline: none;\n --zds-button-ring: 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n/* L'inactif du Figma : la même peinture, à 50 %. Le curseur ne devient pas\n `not-allowed` — un curseur d'interdiction sur une commande désactivée\n annonce une erreur là où il n'y a qu'une étape pas encore atteinte. */\n.zds-button:disabled,\n.zds-button[aria-disabled=\"true\"] {\n opacity: 0.5;\n cursor: default;\n}\n\n/* Le chargement N'EST PAS l'inactif, et le Figma les distingue : il garde sa\n pleine opacité. Sans ce retour à 1, l'`aria-disabled` du bouton en cours\n d'envoi le ferait pâlir. */\n.zds-button--loading[aria-disabled=\"true\"]:not(:disabled) {\n opacity: 1;\n}\n\n/* ============================================================\n * TAILLES — cinq paliers, deux corps de texte\n * ============================================================\n * Les cinq hauteurs retombent exactement sur la somme de leur padding et de\n * leur interligne : 6+20+6=32, 8+20+8=36, 10+20+10=40, 10+24+10=44,\n * 12+24+12=48. Rien n'est arrondi ici.\n *\n * Seuls deux corps de texte servent — 14/20 et 16/24 — et ce sont exactement\n * les deux pas que l'échelle du thème possède. L'ancien `Button` retiré\n * dimensionnait son `sm` à 13 px, un pas absent de l'échelle : c'est\n * précisément ce que ce relevé évite.\n */\n.zds-button--xs {\n --zds-button-height: 32px;\n --zds-button-padding-y: var(--zds-space-sm);\n --zds-button-padding-x: 10px;\n --zds-button-icon: 16px;\n}\n\n.zds-button--sm {\n --zds-button-height: 36px;\n --zds-button-padding-y: var(--zds-space-md);\n --zds-button-padding-x: var(--zds-space-lg);\n}\n\n.zds-button--md {\n --zds-button-height: 40px;\n --zds-button-padding-y: 10px;\n --zds-button-padding-x: 14px;\n}\n\n.zds-button--lg {\n --zds-button-height: 44px;\n --zds-button-padding-y: 10px;\n --zds-button-padding-x: var(--zds-space-xl);\n --zds-button-gap: var(--zds-space-sm);\n --zds-button-font: var(--zds-text-body-md);\n --zds-button-line: var(--zds-text-body-md-line-height);\n}\n\n.zds-button--xl {\n --zds-button-height: 48px;\n --zds-button-padding-y: var(--zds-space-lg);\n --zds-button-padding-x: 18px;\n --zds-button-gap: var(--zds-space-sm);\n --zds-button-font: var(--zds-text-body-md);\n --zds-button-line: var(--zds-text-body-md-line-height);\n}\n\n/* Icône seule : un CARRÉ, et le padding en découle au lieu d'être déclaré.\n Le Figma ne dérive pas ses cinq boîtes du padding du bouton étiqueté — un\n `lg` à icône seule fait 44 px avec une icône de 20, donc 12 px de marge, là\n où son padding vertical vaut 10. Poser le carré donne les cinq tailles\n justes sans avoir à énumérer cinq paddings de plus. */\n.zds-button--icon-only {\n width: var(--zds-button-height);\n min-width: var(--zds-button-height);\n padding: 0;\n}\n\n/* ============================================================\n * HIÉRARCHIES — sept, plus quatre destructives\n * ============================================================\n * « Destructif » n'est pas une hiérarchie mais une famille parallèle, et elle\n * ne reprend que quatre des sept : ni `secondary-white`, ni `tertiary-gray`.\n * D'où une liste plate de onze valeurs plutôt qu'un drapeau `destructive`,\n * qui rendrait exprimables quatre combinaisons que le Figma ne dessine pas.\n */\n\n/* ---- Primary ---------------------------------------------------------\n Le liseré blanc à 12 % est une ombre INTÉRIEURE, pas une bordure. Dans le\n Figma le contour est tracé à l'intérieur ; une vraie bordure CSS de 2 px\n ajouterait 4 px à la boîte et ferait un bouton de 44 px là où il en faut 40. */\n.zds-button--primary {\n background: var(--zds-color-bg-brand-solid);\n color: var(--zds-color-text-primary-on-brand);\n --zds-button-relief: var(--zds-shadow-xs-skeuomorphic);\n}\n\n.zds-button--primary:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-bg-brand-solid-hover);\n}\n\n/* ---- Secondary gray --------------------------------------------------\n La bordure est une ombre intérieure et non un `border` : le Figma la trace à\n l'intérieur, et une bordure CSS ferait grandir la boîte.\n\n Le relief est COMPLET, contour de 1 px compris, et il est listé en premier\n donc peint PAR-DESSUS la bordure — c'est ce que fait le Figma, qui pose son\n style d'effet sur un calque au-dessus du cadre. La bordure peinte est donc\n navy-40 assombri de 18 % de noir, soit `#ADB0B6`. La planche de contraste de\n la page mesure cette composition et non le jeton. */\n.zds-button--secondary-gray {\n background: var(--zds-color-button-secondary-bg);\n color: var(--zds-color-text-primary);\n --zds-button-relief: var(--zds-shadow-skeuomorphic),\n inset 0 0 0 1px var(--zds-color-button-secondary-border),\n var(--zds-shadow-xs);\n}\n\n.zds-button--secondary-gray:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-button-secondary-bg-hover);\n}\n\n/* ---- Secondary white ------------------------------------------------- */\n.zds-button--secondary-white {\n background: var(--zds-color-bg-primary);\n color: var(--zds-color-text-primary);\n --zds-button-relief: var(--zds-shadow-skeuomorphic),\n inset 0 0 0 1px var(--zds-color-button-secondary-border),\n var(--zds-shadow-xs);\n}\n\n.zds-button--secondary-white:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-button-secondary-white-bg-hover);\n}\n\n/* ---- Tertiary color -------------------------------------------------- */\n.zds-button--tertiary-color {\n color: var(--zds-color-fg-brand-primary);\n}\n\n.zds-button--tertiary-color:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-bg-brand-primary);\n color: var(--zds-color-text-brand-secondary);\n}\n\n/* ---- Tertiary gray --------------------------------------------------- */\n.zds-button--tertiary-gray {\n color: var(--zds-color-text-primary);\n}\n\n.zds-button--tertiary-gray:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-button-tertiary-bg-hover);\n}\n\n/* ---- Les liens -------------------------------------------------------\n Un bouton-lien n'a AUCUN padding : sa hauteur est celle de sa ligne de\n texte, 20 px en `md`. Et son anneau de focus porte un rayon de 4 px, pas de\n 8 — le Figma le dessine ainsi, parce qu'un anneau à 8 px autour d'un texte\n sans fond laisse voir ses coins vides. */\n.zds-button--link-color,\n.zds-button--link-gray,\n.zds-button--link-destructive {\n --zds-button-radius: var(--zds-radius-xs);\n min-height: 0;\n padding: 0;\n}\n\n/* Le libellé d'un lien n'a pas l'enveloppe à 2 px : sans padding à reprendre\n au bouton, la déplacer ne recentrerait rien — elle décalerait le texte. */\n.zds-button--link-color .zds-button__label,\n.zds-button--link-gray .zds-button__label,\n.zds-button--link-destructive .zds-button__label {\n padding-inline: 0;\n}\n\n.zds-button--link-color {\n color: var(--zds-color-fg-brand-primary);\n}\n\n.zds-button--link-color:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n color: var(--zds-color-text-brand-secondary);\n text-decoration: underline;\n text-decoration-color: var(--zds-color-fg-brand-secondary);\n}\n\n.zds-button--link-gray {\n color: var(--zds-color-text-primary);\n}\n\n/* La variante grise ne suit pas le motif : son trait suit son texte au lieu\n d'être peint plus clair. Relevé sur 3861:1210, pas harmonisé. */\n.zds-button--link-gray:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n text-decoration: underline;\n text-decoration-color: currentColor;\n}\n\n/* ---- Primary destructif ---------------------------------------------- */\n.zds-button--primary-destructive {\n background: var(--zds-color-bg-error-solid);\n color: var(--zds-color-text-primary-on-brand);\n --zds-button-relief: var(--zds-shadow-xs-skeuomorphic);\n}\n\n.zds-button--primary-destructive:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-bg-error-solid-hover);\n}\n\n/* ---- Secondary destructif -------------------------------------------- */\n/* `border-error-subtle`, comme le Figma — même arbitrage que la bordure\n neutre : mesuré, error-300 (#FDA29B) tient 1,94:1 sur du blanc, sous les 3:1\n exigés du contour d'une commande, et la fidélité a été préférée. Le rôle\n `border-error` (error-500) tenait le seuil à 3,76:1 si on revenait dessus. */\n.zds-button--secondary-destructive {\n background: var(--zds-color-bg-primary);\n color: var(--zds-color-fg-error-primary);\n --zds-button-relief: var(--zds-shadow-skeuomorphic),\n inset 0 0 0 1px var(--zds-color-border-error-subtle),\n var(--zds-shadow-xs);\n}\n\n.zds-button--secondary-destructive:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-bg-error-primary);\n color: var(--zds-color-text-error-primary);\n}\n\n/* ---- Tertiary destructif --------------------------------------------- */\n.zds-button--tertiary-destructive {\n color: var(--zds-color-fg-error-primary);\n}\n\n.zds-button--tertiary-destructive:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n background: var(--zds-color-bg-error-primary);\n color: var(--zds-color-text-error-primary);\n}\n\n/* ---- Link destructif ------------------------------------------------- */\n.zds-button--link-destructive {\n color: var(--zds-color-fg-error-primary);\n}\n\n.zds-button--link-destructive:hover:not(:disabled):not([aria-disabled=\"true\"]) {\n color: var(--zds-color-text-error-primary);\n text-decoration: underline;\n text-decoration-color: var(--zds-color-fg-error-secondary);\n}\n\n/* ---- Le chargement, sur les deux aplats ------------------------------\n Le Figma peint le fond d'un Primary en chargement au palier de son SURVOL.\n Avec le décalage arbitré, le repos est déjà sur ce palier : les deux états\n coïncident donc, et la règle est écrite quand même — pour que le jour où\n quelqu'un remonte le repos, le chargement ne suive pas en silence. */\n.zds-button--primary.zds-button--loading {\n background: var(--zds-color-bg-brand-solid-hover);\n}\n\n.zds-button--primary-destructive.zds-button--loading {\n background: var(--zds-color-bg-error-solid-hover);\n}\n\n/* L'anneau des quatre destructives est rouge. Il vient du rôle du thème\n (`focus-ring-error`, notre error-500) et non de l'effet brut du Figma, qui\n porte #EF4444 — un rouge de Tailwind absent des rampes de Zest. Mesurés,\n les deux tiennent 3,76:1 sur du blanc, donc l'écart ne coûte rien en\n lisibilité ; c'est le vocabulaire qui est en jeu, pas le rendu. */\n.zds-button--primary-destructive:focus-visible,\n.zds-button--secondary-destructive:focus-visible,\n.zds-button--tertiary-destructive:focus-visible,\n.zds-button--link-destructive:focus-visible,\n.zds-button--primary-destructive[data-zds-demo=\"focus\"],\n.zds-button--secondary-destructive[data-zds-demo=\"focus\"],\n.zds-button--tertiary-destructive[data-zds-demo=\"focus\"],\n.zds-button--link-destructive[data-zds-demo=\"focus\"] {\n --zds-button-ring: 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring-error);\n}\n","/**\n * Le bouton de fermeture — relevé sur `Buttons/Button close X` (3861:1825).\n *\n * Trois tailles, et un axe que le reste de la famille n'a pas : « fond\n * sombre ». Une croix posée sur une photo ou sur un aplat de marque ne peut\n * pas être navy — d'où une variante peinte en blanc, avec un voile blanc\n * translucide au survol au lieu du gris habituel.\n *\n * ⚠️ IL N'A PAS D'ÉTAT INACTIF, et ce n'est pas un oubli du relevé : le Figma\n * n'en dessine aucun (Default, Hover, Focused, et c'est tout). Ça se tient —\n * une croix de fermeture désactivée enferme l'utilisateur dans ce qu'il essaie\n * de quitter. Le composant n'expose donc pas de `disabled` propre ; il reste\n * atteignable par l'attribut HTML si quelqu'un y tient, mais rien ici ne\n * l'habille.\n *\n * ⚠️ L'ÉTAT FOCUS DU FIGMA N'EST PAS REPRODUIT TEL QUEL. Il repeint le fond en\n * blanc alors que l'état par défaut est transparent (3861:1834) : le bouton\n * s'allumerait en blanc au moment où on l'atteint au clavier, et sur un fond\n * sombre il deviendrait un carré blanc. Le focus pose l'anneau, il ne repeint\n * pas. Même correction que sur `Secondary gray` — les deux ont l'air d'avoir\n * été construits depuis une variante blanche.\n */\n\n.zds-close-button {\n --zds-close-button-size: 40px;\n --zds-close-button-icon: 20px;\n --zds-close-button-ring: 0 0 0 0 transparent, 0 0 0 0 transparent;\n\n box-shadow: var(--zds-close-button-ring);\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n /* Un carré posé, comme pour le bouton à icône seule : le Figma force ses\n trois boîtes à 36, 40 et 44 px sans que ça découle de son padding — un\n `lg` de 44 px contient une icône de 24, donc 10 px de marge, là où le\n padding déclaré vaut 8. Centrer dans un carré donne les trois tailles\n justes sans énumérer trois paddings de plus. */\n box-sizing: border-box;\n width: var(--zds-close-button-size);\n height: var(--zds-close-button-size);\n padding: 0;\n\n border: 0;\n border-radius: var(--zds-radius-md);\n background: transparent;\n /* `text-secondary` : c'est le nom que la collection sémantique du Figma donne\n à ce navy-70 — `Couleurs/Texte/text-secondary (700)`. Le cadre de la croix\n cite la rampe brute (`Couleurs/Bleu marine/70`), mais le rôle existe et\n c'est lui qu'un composant doit citer. */\n color: var(--zds-color-text-secondary);\n\n cursor: pointer;\n transition:\n background-color var(--zds-transition-fast),\n box-shadow var(--zds-transition-fast);\n}\n\n.zds-close-button__icon {\n display: inline-flex;\n flex: none;\n width: var(--zds-close-button-icon);\n height: var(--zds-close-button-icon);\n}\n\n.zds-close-button__icon > svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n.zds-close-button:hover {\n background: var(--zds-color-button-tertiary-bg-hover);\n}\n\n.zds-close-button:focus-visible {\n outline: none;\n --zds-close-button-ring: 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n/* ---- Tailles ---------------------------------------------------------\n `lg` porte une icône de 24 px : c'est la SEULE icône de 24 de toute la\n famille des boutons, tout le reste tient en 16 ou 20. Relevé sur 3861:1826,\n pas déduit de la progression des boîtes. */\n.zds-close-button--sm {\n --zds-close-button-size: 36px;\n --zds-close-button-icon: 20px;\n}\n\n.zds-close-button--md {\n --zds-close-button-size: 40px;\n --zds-close-button-icon: 20px;\n}\n\n.zds-close-button--lg {\n --zds-close-button-size: 44px;\n --zds-close-button-icon: 24px;\n}\n\n/* ---- Sur fond sombre -------------------------------------------------\n L'anneau de focus garde ses 2 px de `bg-primary` — donc de blanc — au lieu\n de prendre la couleur du fond réel, qu'un composant ne peut pas connaître.\n Sur un fond sombre ce liseré blanc se lit comme une bordure : c'est\n volontaire, il détache l'anneau de la croix. */\n.zds-close-button--on-dark {\n color: var(--zds-color-text-white);\n}\n\n.zds-close-button--on-dark:hover {\n background: var(--zds-color-button-close-on-dark-bg-hover);\n}\n","/**\n * Le bouton utilitaire — relevé sur `Buttons/Button utility` (3861:2468).\n *\n * Le plus petit de la famille : deux tailles, 28 et 32 px, deux hiérarchies,\n * toujours une icône seule. Sa place, ce sont les barres d'outils et les\n * en-têtes de tableau, là où un `Button` en `xs` (32 px, mais avec un libellé\n * et 10 px de padding) serait encore trop bavard.\n *\n * ⚠️ LE 28 PX N'EXISTE NULLE PART AILLEURS dans le design system. Le `Button`\n * s'arrête à 32, le `CloseButton` à 36. C'est le seul palier de cette valeur,\n * et il vient du Figma — pas d'une interpolation.\n *\n * ⚠️ ET C'EST ICI QUE LE FIGMA SE TROMPE DE COLLECTION. Sa bordure est peinte\n * `#D4D4D4` : en dur dans l'état par défaut, et liée à `Colors/Border/` — une\n * collection anglaise résiduelle, antérieure au calque sémantique de Zest — au\n * survol et à l'inactif. La bordure de Zest, c'est\n * `Couleurs/Bordure/border-primary`, soit `#D3D7DE`, et c'est bien celle que le\n * `Button` principal emploie. Deux composants qui dessinent la même bordure ne\n * peuvent pas être sur deux collections.\n *\n * Le code cite donc `--zds-color-border-primary` (#D3D7DE) et pas le #D4D4D4\n * du Figma. Mesuré, l'écart est de 1,48:1 contre 1,44:1 sur du blanc : l'œil\n * ne le voit pas, c'est le VOCABULAIRE qui est en jeu. À corriger dans le\n * Figma, pas ici. Même piège que les icônes de fichier.\n *\n * ⚠️ DEUX DÉCORS DU FIGMA NE SONT PAS DU COMPOSANT. Les états de survol\n * contiennent un curseur de souris et une info-bulle « Tooltip » posés à\n * l'intérieur de l'instance (3863:4730, 3863:4718). C'est l'habillage de la\n * planche de documentation, pas des pièces du bouton. Ils ne sont pas codés.\n */\n\n.zds-utility-button {\n --zds-utility-button-size: 32px;\n --zds-utility-button-icon: 20px;\n --zds-utility-button-ring: 0 0 0 0 transparent, 0 0 0 0 transparent;\n --zds-utility-button-relief: 0 0 0 0 transparent;\n\n box-shadow: var(--zds-utility-button-ring), var(--zds-utility-button-relief);\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n box-sizing: border-box;\n width: var(--zds-utility-button-size);\n height: var(--zds-utility-button-size);\n padding: 0;\n\n border: 0;\n\n /* Le rayon du Figma s'appelle `radius-xs` et vaut 6 px, soit notre\n `--zds-radius-sm`. Décalage d'un cran par rapport à nos noms, comme\n partout ailleurs dans ce relevé : mappé par valeur, pas par nom. */\n border-radius: var(--zds-radius-sm);\n background: transparent;\n color: var(--zds-color-text-primary);\n\n cursor: pointer;\n transition:\n background-color var(--zds-transition-fast),\n box-shadow var(--zds-transition-fast);\n}\n\n.zds-utility-button__icon {\n display: inline-flex;\n flex: none;\n width: var(--zds-utility-button-icon);\n height: var(--zds-utility-button-icon);\n}\n\n.zds-utility-button__icon > svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n.zds-utility-button:focus-visible {\n outline: none;\n --zds-utility-button-ring: 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n/* Le même `opacity: 0.5` que le `Button` : c'est le mécanisme d'inactif du\n Figma, et il est cohérent d'un composant à l'autre. */\n.zds-utility-button:disabled {\n opacity: 0.5;\n cursor: default;\n}\n\n/* ---- Tailles --------------------------------------------------------- */\n.zds-utility-button--xs {\n --zds-utility-button-size: 28px;\n --zds-utility-button-icon: 16px;\n}\n\n.zds-utility-button--sm {\n --zds-utility-button-size: 32px;\n --zds-utility-button-icon: 20px;\n}\n\n/* ---- Hiérarchies ----------------------------------------------------- */\n.zds-utility-button--secondary {\n background: var(--zds-color-bg-primary);\n --zds-utility-button-relief: var(--zds-shadow-skeuomorphic),\n inset 0 0 0 1px var(--zds-color-button-secondary-border),\n var(--zds-shadow-xs);\n}\n\n.zds-utility-button--secondary:hover:not(:disabled) {\n background: var(--zds-color-button-secondary-white-bg-hover);\n}\n\n.zds-utility-button--tertiary:hover:not(:disabled) {\n background: var(--zds-color-button-tertiary-bg-hover);\n}\n","/*\n * Le badge de Zest — relevé sur `Badge` (3869:2612) le 2026-09-10.\n *\n * ------------------------------------------------------------------------\n * TROIS HABILLAGES, ET AUCUN N'EST UN APLAT\n * ------------------------------------------------------------------------\n * Le cadre Figma dessine `Pill color`, `Badge color` et `Badge modern` : deux\n * fonds DOUX qui ne diffèrent que par leur rayon, et un fond BLANC bordé. Il\n * n'y a pas de badge en aplat saturé dans le design system de Zest, et c'est\n * la réponse à la question qui « bloquait » les badges depuis le 2026-09-09 :\n * `bg-success-solid` et `bg-warning-solid`, sous l'AA, ne sont employés par\n * aucun des trois. Voir le README.\n *\n * ------------------------------------------------------------------------\n * LA GÉOMÉTRIE EST UNE TABLE, PAS UNE FORMULE\n * ------------------------------------------------------------------------\n * Les 477 symboles du cadre ont été relevés, puis un modèle de géométrie a été\n * écrit et confronté à CHACUN d'eux : les 477 tombent juste, largeur et\n * hauteur, au pixel. Le modèle tient en quatre règles :\n *\n * 1. la hauteur est `line-height + 2 × padding vertical` — 22, 24, 28 ;\n * 2. le côté du LIBELLÉ porte le padding de base du type et de la taille ;\n * 3. le côté d'une PIÈCE le perd de 2 px sur le pill, le garde sur le badge\n * et le modern — sauf l'icône, qui le perd sur les deux ;\n * 4. la croix de fermeture ne suit pas l'échelle : 3, 4 puis 6 px.\n *\n * ⚠️ UNE ANOMALIE DU FIGMA EST REPRODUITE TELLE QUELLE, EN `sm`. Un\n * `Badge color` ou un `Badge modern` de taille `sm` portant une icône gagne\n * 2 px du côté du LIBELLÉ (8 au lieu de 6) : sa largeur tombe alors à 60 px,\n * exactement celle du `Pill color`, alors que les deux types ne se distinguent\n * QUE par leur padding. Les autres tailles ne le font pas. Vraisemblablement\n * des variantes recopiées depuis le pill sans réajuster le padding. Reproduit\n * plutôt que corrigé — les maquettes font foi — et signalé dans la page.\n *\n * ⚠️ LA HAUTEUR EST FIXE, comme sur le bouton. Le Figma compose ses badges\n * sans retour à la ligne : la boîte ne diffère de la ligne de texte que par son\n * padding vertical, et la bordure d'1 px est absorbée par la hauteur au lieu\n * de la faire grandir. C'est la géométrie du Figma, où le contour est INTÉRIEUR\n * et ne compte pas dans la taille du cadre.\n *\n * ------------------------------------------------------------------------\n * LES PIÈCES PORTENT LEUR ÉCART, LE CONTENEUR N'A PAS DE `gap`\n * ------------------------------------------------------------------------\n * Les quatre pièces n'ont pas le même écart au libellé — 4 ou 6 px pour le\n * point, 2 ou 4 pour une icône, 2 pour la croix. Un `gap` de conteneur est\n * UNIQUE : il ne saurait pas servir un badge qui porterait un point ET une\n * croix. Chaque pièce déclare donc sa propre marge. Le Figma ne dessine jamais\n * deux pièces à la fois ; le composant ne l'interdit pas, parce que ce sont\n * des EMPLACEMENTS distincts et non les valeurs d'un même axe — voir le\n * commentaire de `BadgeProps`.\n */\n\n.zds-badge {\n /* ---- Fentes de géométrie, remplies par le modificateur de taille ---- */\n --zds-badge-height: 24px;\n --zds-badge-font: var(--zds-text-body-sm);\n --zds-badge-line: var(--zds-text-body-sm-line-height);\n\n /* Les quatre paddings horizontaux : celui du libellé, et un par pièce.\n Le modificateur de TYPE les remplit, parce que c'est lui qui décide du\n padding de base — le pill est plus large de 2 px que le badge. */\n --zds-badge-pad-label: 8px;\n --zds-badge-pad-dot: 8px;\n --zds-badge-pad-icon: 6px;\n --zds-badge-pad-close: 4px;\n\n /* Les écarts, par pièce. */\n --zds-badge-gap-dot: var(--zds-space-sm);\n --zds-badge-gap-icon: var(--zds-space-xs);\n --zds-badge-gap-close: var(--zds-space-xxs);\n\n /* Le rayon du Figma s'appelle `radius-xs` et vaut 6 px, soit notre\n `--zds-radius-sm` — notre `radius-xs` vaut 4. Décalage d'un cran entre les\n deux échelles, déjà relevé sur les boutons : on mappe par VALEUR MESURÉE,\n jamais par nom. */\n --zds-badge-radius: var(--zds-radius-sm);\n\n /* ---- Fentes de couleur, remplies par le modificateur de couleur ----- */\n --zds-badge-bg: transparent;\n --zds-badge-border: transparent;\n --zds-badge-text: inherit;\n /* UNE SEULE VALEUR POUR LES QUATRE PIÈCES, et c'est un relevé. Le point,\n l'icône de tête, l'icône de fin et la croix sont tous peints au palier\n 600 de la couleur ; seul le LIBELLÉ est au 700 — 800 pour le tilleul et\n le jaune. Vérifié sur quatre symboles de trois habillages différents :\n chacun cite deux valeurs, `Zest/200` pour sa pièce et `Zest/300` pour son\n libellé. Un premier jet mettait les pièces en `currentColor`, donc à la\n couleur du libellé : elles sortaient un cran trop sombre partout, et sur\n un `modern` elles sortaient navy — treize badges identiques là où la\n maquette en dessine treize colorés. C'est la planche des treize couleurs\n qui l'a rendu visible ; aucun test ne le voyait. */\n --zds-badge-piece: currentColor;\n --zds-badge-close-hover-bg: transparent;\n --zds-badge-close-hover-fg: currentColor;\n\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n height: var(--zds-badge-height);\n padding-block: 0;\n padding-inline: var(--zds-badge-pad-label);\n border: 1px solid var(--zds-badge-border);\n border-radius: var(--zds-badge-radius);\n background: var(--zds-badge-bg);\n color: var(--zds-badge-text);\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-badge-font);\n font-weight: var(--zds-font-weight-semibold);\n line-height: var(--zds-badge-line);\n white-space: nowrap;\n vertical-align: middle;\n}\n\n/* ---- Les trois tailles -----------------------------------------------\n `sm` est la seule à quitter `body-sm` pour `caption-md` : 12 px sur 18 au\n lieu de 14 sur 20. `md` et `lg` partagent leur texte et ne diffèrent que\n par leur padding. */\n.zds-badge--sm {\n --zds-badge-height: 22px;\n --zds-badge-font: var(--zds-text-caption-md);\n --zds-badge-line: var(--zds-text-caption-md-line-height);\n --zds-badge-gap-dot: var(--zds-space-xs);\n --zds-badge-gap-icon: var(--zds-space-xxs);\n --zds-badge-pad-close: 3px; /* hors échelle : le Figma l'écrit en dur */\n}\n\n.zds-badge--md {\n --zds-badge-height: 24px;\n --zds-badge-pad-close: var(--zds-space-xs);\n}\n\n.zds-badge--lg {\n --zds-badge-height: 28px;\n --zds-badge-pad-close: var(--zds-space-sm);\n}\n\n/* ---- Les trois habillages -------------------------------------------\n Le TYPE porte le padding de base et le rayon ; la COULEUR porte les quatre\n teintes. Les deux axes sont indépendants, sauf sur le modern — voir plus\n bas, où il reprend la main sur trois des quatre. */\n\n.zds-badge--pill {\n --zds-badge-radius: var(--zds-radius-full);\n --zds-badge-pad-label: var(--zds-space-md);\n --zds-badge-pad-dot: var(--zds-space-sm);\n --zds-badge-pad-icon: var(--zds-space-sm);\n}\n.zds-badge--pill.zds-badge--md {\n --zds-badge-pad-label: 10px; /* hors échelle : entre `space-md` 8 et `space-lg` 12 */\n --zds-badge-pad-dot: var(--zds-space-md);\n --zds-badge-pad-icon: var(--zds-space-md);\n}\n.zds-badge--pill.zds-badge--lg {\n --zds-badge-pad-label: var(--zds-space-lg);\n --zds-badge-pad-dot: 10px; /* hors échelle */\n --zds-badge-pad-icon: 10px; /* hors échelle */\n}\n\n.zds-badge--badge,\n.zds-badge--modern {\n --zds-badge-radius: var(--zds-radius-sm);\n --zds-badge-pad-label: var(--zds-space-sm);\n --zds-badge-pad-dot: var(--zds-space-sm);\n --zds-badge-pad-icon: var(--zds-space-sm);\n}\n.zds-badge--badge.zds-badge--md,\n.zds-badge--modern.zds-badge--md {\n --zds-badge-pad-label: var(--zds-space-md);\n --zds-badge-pad-dot: var(--zds-space-md);\n --zds-badge-pad-icon: var(--zds-space-sm);\n}\n.zds-badge--badge.zds-badge--lg,\n.zds-badge--modern.zds-badge--lg {\n /* Le rayon passe au `radius-sm` du Figma, qui vaut 8 : notre `radius-md`. */\n --zds-badge-radius: var(--zds-radius-md);\n --zds-badge-pad-label: 10px; /* hors échelle */\n --zds-badge-pad-dot: 10px; /* hors échelle */\n --zds-badge-pad-icon: var(--zds-space-md);\n}\n\n/* ---- Où le padding s'applique ---------------------------------------\n Par défaut les deux côtés portent le padding du libellé. Une pièce\n remplace celui de SON côté. */\n.zds-badge--lead-dot {\n padding-inline-start: var(--zds-badge-pad-dot);\n}\n.zds-badge--lead-icon {\n padding-inline-start: var(--zds-badge-pad-icon);\n}\n.zds-badge--trail-icon {\n padding-inline-end: var(--zds-badge-pad-icon);\n}\n.zds-badge--trail-close {\n padding-inline-end: var(--zds-badge-pad-close);\n}\n\n/* ⚠️ L'ANOMALIE DU `sm`, reproduite. Voir l'en-tête : en taille `sm`, un\n `Badge color` et un `Badge modern` portant une icône gagnent 2 px du côté\n OPPOSÉ à l'icône. Le pill ne le fait pas, les autres tailles non plus. */\n.zds-badge--badge.zds-badge--sm.zds-badge--lead-icon,\n.zds-badge--modern.zds-badge--sm.zds-badge--lead-icon {\n padding-inline-end: var(--zds-space-md);\n}\n.zds-badge--badge.zds-badge--sm.zds-badge--trail-icon,\n.zds-badge--modern.zds-badge--sm.zds-badge--trail-icon {\n padding-inline-start: var(--zds-space-md);\n}\n\n/* ---- Les pièces ------------------------------------------------------ */\n\n/* Le point ne change JAMAIS de taille : 8 px de boîte pour un disque de 6, en\n `sm` comme en `lg`. Relevé sur les trois tailles des trois types. Le\n composant `_Dot` du Figma (3874:1192) en offre pourtant trois — 8, 10 et\n 12 — et propose un halo (`Outline=True`) : le badge n'emploie ni les deux\n grandes tailles, ni le halo. */\n.zds-badge__dot {\n flex: none;\n box-sizing: border-box;\n width: 8px;\n height: 8px;\n margin-inline-end: var(--zds-badge-gap-dot);\n border-radius: var(--zds-radius-full);\n /* Un disque de 6 px centré dans une boîte de 8 : c'est le tracé du Figma,\n `<circle r=\"3\">` dans un `viewBox` de 8. Une bordure transparente d'1 px\n le rend sans second élément et sans toucher à la boîte. */\n border: 1px solid transparent;\n background: var(--zds-badge-piece);\n background-clip: content-box;\n}\n\n.zds-badge__icon {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n width: 12px;\n height: 12px;\n color: var(--zds-badge-piece);\n}\n.zds-badge__icon--leading {\n margin-inline-end: var(--zds-badge-gap-icon);\n}\n.zds-badge__icon--trailing {\n margin-inline-start: var(--zds-badge-gap-icon);\n}\n/* Les icônes du catalogue se dessinent dans une boîte de 24 et suivent la\n taille qu'on leur donne ; celles du badge font 12. Elles peignent en\n `currentColor`, que l'enveloppe ci-dessus a mis à `--zds-badge-piece` : donc\n au palier 600 de la couleur, comme le point — et non à la couleur du\n libellé. Voir la fente. */\n.zds-badge__icon > svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n/* La croix de fermeture — `_Badge close X` (3869:4461). Une boîte de 16 qui\n porte 2 px de padding autour d'une icône de 12.\n\n ⚠️ SON RAYON SUIT LE BADGE, ET C'EST UN AXE DU FIGMA. Le composant a une\n propriété `Type` à deux valeurs : `Square` (rayon 3 px, hors échelle) et\n `Rounded` (rayon plein). Le pill prend `Rounded`, le badge et le modern\n prennent `Square`.\n\n ⚠️ LE FIGMA NE DESSINE PAS D'ÉTAT DE FOCUS, et il en faut un. Une commande\n qu'on ne voit pas quand on l'atteint au clavier est une commande qu'on ne\n peut pas employer sans souris. L'anneau reprend exactement la recette du\n `CloseButton` : 2 px de blanc puis 2 px de `focus-ring`. Ajout déclaré, pas\n un relevé. */\n.zds-badge__close {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 16px;\n height: 16px;\n margin-inline-start: var(--zds-badge-gap-close);\n padding: var(--zds-space-xxs);\n border: 0;\n border-radius: 3px;\n background: transparent;\n color: var(--zds-badge-piece);\n cursor: pointer;\n transition:\n background-color 0.1s ease-in-out,\n color 0.1s ease-in-out;\n}\n.zds-badge--pill .zds-badge__close {\n border-radius: var(--zds-radius-full);\n}\n.zds-badge__close > svg {\n display: block;\n width: 12px;\n height: 12px;\n}\n.zds-badge__close:hover {\n background: var(--zds-badge-close-hover-bg);\n color: var(--zds-badge-close-hover-fg);\n}\n.zds-badge__close:focus-visible {\n outline: none;\n box-shadow:\n 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n@media (prefers-reduced-motion: reduce) {\n .zds-badge__close {\n transition: none;\n }\n}\n\n/* ---- Les treize couleurs --------------------------------------------\n Quatre valeurs chacune : le fond, la bordure, le point, le libellé. Cinq\n couleurs ont déjà leur vocabulaire au calque des rôles et le citent au lieu\n de le redoubler — voir le bloc BADGE de `theme.css`, et `verify:tokens`,\n qui échoue si un jeton de composant redit ce qu'un rôle dit déjà.\n\n Le survol de la croix est le palier 100 de la couleur, et son icône passe\n du palier 600 au 700 : deux valeurs de plus par couleur, relevées sur\n `State=Hover`. */\n\n.zds-badge--brand {\n --zds-badge-bg: var(--zds-color-bg-brand-primary);\n --zds-badge-border: var(--zds-color-badge-brand-border);\n --zds-badge-piece: var(--zds-color-fg-brand-primary);\n --zds-badge-text: var(--zds-color-text-brand-secondary);\n --zds-badge-close-hover-bg: var(--zds-color-bg-brand-secondary);\n --zds-badge-close-hover-fg: var(--zds-color-text-brand-secondary);\n}\n\n.zds-badge--error {\n --zds-badge-bg: var(--zds-color-bg-error-primary);\n --zds-badge-border: var(--zds-color-badge-error-border);\n --zds-badge-piece: var(--zds-color-fg-error-primary);\n --zds-badge-text: var(--zds-color-text-error-primary);\n --zds-badge-close-hover-bg: var(--zds-color-bg-error-secondary);\n --zds-badge-close-hover-fg: var(--zds-color-text-error-primary);\n}\n\n.zds-badge--warning {\n --zds-badge-bg: var(--zds-color-bg-warning-primary);\n --zds-badge-border: var(--zds-color-badge-warning-border);\n --zds-badge-piece: var(--zds-color-fg-warning-primary);\n --zds-badge-text: var(--zds-color-text-warning-primary);\n --zds-badge-close-hover-bg: var(--zds-color-bg-warning-secondary);\n --zds-badge-close-hover-fg: var(--zds-color-text-warning-primary);\n}\n\n.zds-badge--success {\n --zds-badge-bg: var(--zds-color-bg-success-primary);\n --zds-badge-border: var(--zds-color-badge-success-border);\n --zds-badge-piece: var(--zds-color-fg-success-primary);\n --zds-badge-text: var(--zds-color-text-success-primary);\n --zds-badge-close-hover-bg: var(--zds-color-bg-success-secondary);\n --zds-badge-close-hover-fg: var(--zds-color-text-success-primary);\n}\n\n/* Le navy est le neutre de Zest. Sa bordure et son libellé sont des RÔLES —\n `border-primary` et `text-primary` — parce que ce sont exactement les\n valeurs que le Figma peint. */\n.zds-badge--navy {\n --zds-badge-bg: var(--zds-color-badge-navy-bg);\n --zds-badge-border: var(--zds-color-border-primary);\n --zds-badge-piece: var(--zds-color-badge-navy-piece);\n --zds-badge-text: var(--zds-color-text-primary);\n --zds-badge-close-hover-bg: var(--zds-color-badge-navy-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-text-primary);\n}\n\n.zds-badge--gray {\n --zds-badge-bg: var(--zds-color-badge-gray-bg);\n --zds-badge-border: var(--zds-color-badge-gray-border);\n --zds-badge-piece: var(--zds-color-badge-gray-piece);\n --zds-badge-text: var(--zds-color-badge-gray-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-gray-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-gray-text);\n}\n\n.zds-badge--horizon {\n --zds-badge-bg: var(--zds-color-badge-horizon-bg);\n --zds-badge-border: var(--zds-color-badge-horizon-border);\n --zds-badge-piece: var(--zds-color-badge-horizon-piece);\n --zds-badge-text: var(--zds-color-badge-horizon-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-horizon-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-horizon-text);\n}\n\n.zds-badge--turquoise {\n --zds-badge-bg: var(--zds-color-badge-turquoise-bg);\n --zds-badge-border: var(--zds-color-badge-turquoise-border);\n --zds-badge-piece: var(--zds-color-badge-turquoise-piece);\n --zds-badge-text: var(--zds-color-badge-turquoise-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-turquoise-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-turquoise-text);\n}\n\n.zds-badge--violet {\n --zds-badge-bg: var(--zds-color-badge-violet-bg);\n --zds-badge-border: var(--zds-color-badge-violet-border);\n --zds-badge-piece: var(--zds-color-badge-violet-piece);\n --zds-badge-text: var(--zds-color-badge-violet-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-violet-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-violet-text);\n}\n\n.zds-badge--fuschia {\n --zds-badge-bg: var(--zds-color-badge-fuschia-bg);\n --zds-badge-border: var(--zds-color-badge-fuschia-border);\n --zds-badge-piece: var(--zds-color-badge-fuschia-piece);\n --zds-badge-text: var(--zds-color-badge-fuschia-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-fuschia-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-fuschia-text);\n}\n\n.zds-badge--rose {\n --zds-badge-bg: var(--zds-color-badge-rose-bg);\n --zds-badge-border: var(--zds-color-badge-rose-border);\n --zds-badge-piece: var(--zds-color-badge-rose-piece);\n --zds-badge-text: var(--zds-color-badge-rose-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-rose-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-rose-text);\n}\n\n/* Tilleul et jaune sont décalés d'un cran, et c'est le Figma qui les a\n décalés : bordure au 300, point au 700, libellé au 800. Ce sont les deux\n seules teintes de la palette dont le palier courant est trop clair pour\n porter du texte. Ne pas les « harmoniser » sur les onze autres. */\n.zds-badge--lime {\n --zds-badge-bg: var(--zds-color-badge-lime-bg);\n --zds-badge-border: var(--zds-color-badge-lime-border);\n --zds-badge-piece: var(--zds-color-badge-lime-piece);\n --zds-badge-text: var(--zds-color-badge-lime-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-lime-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-lime-text);\n}\n\n.zds-badge--yellow {\n --zds-badge-bg: var(--zds-color-badge-yellow-bg);\n --zds-badge-border: var(--zds-color-badge-yellow-border);\n --zds-badge-piece: var(--zds-color-badge-yellow-piece);\n --zds-badge-text: var(--zds-color-badge-yellow-text);\n --zds-badge-close-hover-bg: var(--zds-color-badge-yellow-close-hover-bg);\n --zds-badge-close-hover-fg: var(--zds-color-badge-yellow-text);\n}\n\n/* ---- `Badge modern` --------------------------------------------------\n Il vient APRÈS les treize couleurs, et l'ordre est le mécanisme : il\n reprend la main sur le fond, la bordure et le libellé, et laisse les PIÈCES\n à la couleur choisie. C'est l'anatomie du Figma.\n\n ⚠️ ELLE N'EXPLIQUE QU'UN TIERS DES 108 SYMBOLES ABSENTS DU CADRE, et un\n premier jet de ce commentaire prétendait les expliquer tous. Sur les 108\n manquants — tous des `Badge modern` dans les douze couleurs autres que Gray\n — les 36 de la variante SANS PIÈCE sont légitimes : il n'y a rien à\n colorer, les douze auraient été identiques. Les 72 autres, `X close` et\n `Icon trailing`, sont un TROU de la maquette : leur unique spécimen Gray\n peint bien sa pièce en `Couleurs/Gris/200`, donc la pièce prend la couleur\n et les douze variantes auraient différé. À dessiner dans le Figma.\n\n Son libellé est `Bleu marine/80`, qui est notre rôle `text-tertiary`. */\n.zds-badge--modern {\n --zds-badge-bg: var(--zds-color-bg-primary);\n --zds-badge-border: var(--zds-color-border-primary);\n --zds-badge-text: var(--zds-color-text-tertiary);\n\n /* ⚠️ IL NE SURCHARGE PAS LE SURVOL DE LA CROIX, et un premier jet le\n faisait — en navy, pour toutes les couleurs. La croix est un composant à\n part dans la maquette (`_Badge close X`), dont l'axe `Type` suit\n l'habillage et l'axe `Color` suit la COULEUR du badge : sur un modern\n violet, son survol est violet. Les trois valeurs restent donc celles que\n le bloc de couleur a posées. */\n\n /* `Ombres/ombre-sm` du Figma : une ombre portée de 0 1 2 sur `shadow-xs`\n (#0a0d120d). C'est exactement notre `--zds-shadow-xs`, à ceci près que le\n thème l'écrit en `rgba(0, 0, 0, 0.05)` là où le Figma le compose sur\n #0a0d12 — écart négligeable sur une ombre à 5 % d'opacité. */\n box-shadow: var(--zds-shadow-xs);\n}\n","/**\n * L'info-bulle — relevée sur `Tooltip` (3266:935) et `Help icon` (3266:1096).\n *\n * ⚠️ LE PLACEMENT EST ENTIÈREMENT EN CSS, ET IL N'Y A AUCUNE BASCULE. Arbitrage\n * du lead dev front, le 2026-09-10 : pas de bibliothèque de positionnement. Une\n * info-bulle près du bord de l'écran en sortira, et c'est à l'appelant de\n * choisir le bon placement.\n *\n * ⚠️ DEUX ANATOMIES, RELEVÉES SÉPARÉMENT, PAS INTERPOLÉES. Sans texte de\n * soutien la bulle se colle à son libellé : padding `8px 12px`, une seule ligne\n * qui ne se coupe pas. Avec, elle se cale à 320 px de large, passe à `12px` de\n * padding sur les quatre côtés et laisse 4 px entre ses deux textes. Les deux\n * ont été mesurées sur leurs symboles : la version courte fait 34 px de haut\n * (8 + 18 + 8) et la longue 100 (12 + 18 + 4 + 54 + 12).\n *\n * ⚠️ L'OMBRE EST UN `filter`, ET C'EST LA FLÈCHE QUI L'IMPOSE. Un `box-shadow`\n * ombre la BOÎTE : posé ici, il dessinerait un rectangle qui englobe la bulle et\n * sa flèche, en laissant la flèche plate. `drop-shadow()` suit la silhouette\n * PEINTE, donc la flèche projette la sienne. Le prix est qu'aucun de nos jetons\n * `--zds-shadow-*` n'est réutilisable : ils ont un étalement négatif, que\n * `drop-shadow()` ne sait pas exprimer. D'où `--zds-shadow-tooltip-filter`.\n *\n * ⚠️ LE FIGMA NOMME UNE FAMILLE `font-family-caption` QUI N'EXISTE PAS CHEZ\n * NOUS, et ce n'est pas un oubli : notre thème n'a que `body` et `display`,\n * toutes deux en Averta. La variable Figma désigne Averta ; elle se traduit donc\n * en `--zds-font-family-body`. De même sa graisse « Regular » est notre\n * `--zds-font-weight-normal` — le thème n'a pas de `regular`.\n */\n\n/* ---- L'ancre ----------------------------------------------------------\n Le SEUL élément que le composant ajoute. Elle sert de repère de position à la\n bulle, et rien d'autre.\n\n ⚠️ `inline-flex` PLUTÔT QUE `inline-block` : l'ancre fait alors exactement la\n taille de son déclencheur. En `inline-block` elle suit la ligne de base du\n texte et ajoute quelques pixels sous un bouton — un décalage qui ne se voit\n qu'à côté d'un autre bouton non enveloppé.\n\n ⚠️ ELLE N'ENTRE PAS DANS L'ORDRE DE TABULATION. C'est un `<span>` sans\n `tabIndex` : le focus va au déclencheur, jamais à l'ancre. */\n.zds-tooltip-ancre {\n position: relative;\n display: inline-flex;\n}\n\n/* ---- La bulle --------------------------------------------------------- */\n.zds-tooltip {\n /* L'écart entre la pointe de la flèche et le déclencheur : relevé à 4 px sur\n le composite, qui ancre sa bulle à `bottom: 20px` dans une icône de 16. */\n --zds-tooltip-ecart: 4px;\n /* Ce qui DÉPASSE de la bulle. Le dessin fait 8,51471 de haut. */\n --zds-tooltip-debord: 6px;\n /* L'écart total à réserver entre la bulle et le déclencheur. */\n --zds-tooltip-marge: calc(var(--zds-tooltip-ecart) + var(--zds-tooltip-debord));\n /* Le retrait de la flèche sur les placements décalés, relevé sur\n `Arrow=Bottom left` (3266:1055) : 12 px, soit le padding horizontal. La\n flèche s'aligne sur le bord du texte. */\n --zds-tooltip-retrait: 12px;\n /* Le centre de la flèche depuis le bord de la bulle : 12 + 8. */\n --zds-tooltip-centre-fleche: calc(var(--zds-tooltip-retrait) + 8px);\n\n position: absolute;\n z-index: 60;\n width: max-content;\n filter: var(--zds-shadow-tooltip-filter);\n /* Une bulle ne se sélectionne pas et n'intercepte pas les clics : elle\n recouvre ce qui l'entoure, et un clic doit atteindre ce qui est dessous. */\n pointer-events: none;\n user-select: none;\n}\n\n/* ⚠️ LE RAYON EST NOTRE `radius-md`, PAS NOTRE `radius-sm`. Le Figma nomme\n `radius-sm` la valeur 8 px ; chez nous 8 px est `--zds-radius-md`, et notre\n `radius-sm` vaut 6. Les échelles se croisent d'un cran sur les rayons, alors\n qu'elles s'alignent sur les espacements — d'où la règle : on mappe par la\n VALEUR mesurée, jamais par le nom.\n\n ⚠️ ET `border-box` EST PORTEUR ICI. Le Figma cale la bulle à texte de soutien\n sur 320 px TOTAL. En `content-box` — le défaut de CSS, et ce dépôt n'a aucune\n remise à zéro globale — les 12 px de padding s'ajoutent de chaque côté :\n mesurée, la bulle sortait à 344 px. Et 344 ressemble à 320. */\n.zds-tooltip__contenu {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n box-sizing: border-box;\n border-radius: var(--zds-radius-md);\n background: var(--zds-color-tooltip-bg);\n padding: var(--zds-space-md) var(--zds-space-lg);\n}\n\n.zds-tooltip__titre {\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-text-caption-md);\n font-weight: var(--zds-font-weight-semibold);\n line-height: var(--zds-text-caption-md-line-height);\n color: var(--zds-color-text-white);\n}\n\n.zds-tooltip__soutien {\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-text-caption-md);\n font-weight: var(--zds-font-weight-normal);\n line-height: var(--zds-text-caption-md-line-height);\n color: var(--zds-color-tooltip-supporting-text);\n}\n\n/* ---- Sans texte de soutien : la bulle se colle au libellé ------------- */\n.zds-tooltip:not([data-zds-avec-soutien]) .zds-tooltip__titre {\n /* Le Figma centre ce libellé et l'empêche de se couper. Une bulle d'un mot\n qui passerait sur deux lignes serait un défaut, pas une adaptation. */\n text-align: center;\n white-space: nowrap;\n}\n\n/* ---- Avec texte de soutien : 320 px, et 12 px partout -----------------\n ⚠️ `width`, PAS `max-width`. Le Figma cale les sept symboles à texte de\n soutien sur 320 px exactement, y compris ceux dont le texte est plus court.\n Un `max-width` laisserait la bulle rétrécir sur un texte bref, et les\n placements décalés perdraient leur alignement de flèche — il est mesuré\n depuis un bord. */\n.zds-tooltip[data-zds-avec-soutien] .zds-tooltip__contenu {\n width: 320px;\n padding: var(--zds-space-lg);\n gap: var(--zds-space-xs);\n}\n\n/* ---- Les six placements -----------------------------------------------\n ⚠️ LES DEUX PLACEMENTS DÉCALÉS NE SE CENTRENT PAS SUR LE DÉCLENCHEUR : ils\n se centrent sur LA FLÈCHE. La bulle est décalée de 20 px — le retrait de 12\n plus la demi-largeur de la flèche — pour que la pointe tombe sur le milieu du\n déclencheur quelle que soit sa largeur.\n\n C'est un GAIN par rapport à la bibliothèque retirée : elle ancrait la flèche\n au centre du déclencheur, donc le retrait de 12 px du Figma n'était juste que\n sur une icône de 16 px et dérivait sur un bouton large. Mesuré à l'époque :\n 70,64 px de retrait sur un bouton `sm`. Ici il vaut 12, partout. */\n.zds-tooltip--top {\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%);\n margin-bottom: var(--zds-tooltip-marge);\n}\n\n.zds-tooltip--top-right {\n bottom: 100%;\n left: 50%;\n transform: translateX(calc(var(--zds-tooltip-centre-fleche) * -1));\n margin-bottom: var(--zds-tooltip-marge);\n}\n\n.zds-tooltip--top-left {\n bottom: 100%;\n right: 50%;\n transform: translateX(var(--zds-tooltip-centre-fleche));\n margin-bottom: var(--zds-tooltip-marge);\n}\n\n.zds-tooltip--bottom {\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n margin-top: var(--zds-tooltip-marge);\n}\n\n.zds-tooltip--left {\n right: 100%;\n top: 50%;\n transform: translateY(-50%);\n margin-right: var(--zds-tooltip-marge);\n}\n\n.zds-tooltip--right {\n left: 100%;\n top: 50%;\n transform: translateY(-50%);\n margin-left: var(--zds-tooltip-marge);\n}\n\n/* ---- La flèche --------------------------------------------------------\n ⚠️ DEUX RECOUVREMENTS, ET L'ASYMÉTRIE EST GÉOMÉTRIQUE, PAS ARBITRAIRE.\n Le dessin fait 16 × 8,51471 et doit dépasser de 6 px, quel que soit le côté.\n\n · EN HAUT ET EN BAS il n'est pas tourné : son bord est déjà à celui de la\n bulle, il suffit donc de l'enfoncer de 8,51471 − 6 = 2,5147.\n\n · À GAUCHE ET À DROITE il est tourné d'un quart de tour, autour de son\n CENTRE — et sa boîte, elle, garde la taille du dessin NON tourné, soit 16\n de large. Le centre est donc à 8 du bord de la bulle, et le dessin tourné y\n ajoute sa demi-hauteur, 4,2574 : il dépasserait de 12,2574. Il faut donc\n l'enfoncer de 12,2574 − 6 = 6,2574.\n\n Mesuré avant correction : 9,74 px de débord sur les côtés contre 5,99 en\n haut. Un même chiffre pour les quatre côtés paraissait cohérent et se voyait\n à peine — c'est le genre d'écart qu'une capture ne dénonce pas. */\n.zds-tooltip__fleche {\n --zds-tooltip-recouvrement: 2.5147px;\n --zds-tooltip-recouvrement-tourne: 6.2574px;\n\n position: absolute;\n display: block;\n line-height: 0;\n /* Elle prend la couleur du fond de la bulle, et ce n'est pas une commodité :\n 2,51 px du dessin passent SOUS la bulle pour masquer la couture. Deux\n teintes même très proches y laisseraient un liseré d'un demi-pixel. */\n color: var(--zds-color-tooltip-bg);\n}\n\n.zds-tooltip--top .zds-tooltip__fleche,\n.zds-tooltip--top-right .zds-tooltip__fleche,\n.zds-tooltip--top-left .zds-tooltip__fleche {\n top: 100%;\n}\n\n.zds-tooltip--top .zds-tooltip__fleche {\n left: 50%;\n transform: translateX(-50%) translateY(calc(var(--zds-tooltip-recouvrement) * -1));\n}\n\n/* Les deux décalés posent la flèche à 12 px du bord, sans la centrer. */\n.zds-tooltip--top-right .zds-tooltip__fleche {\n left: var(--zds-tooltip-retrait);\n transform: translateY(calc(var(--zds-tooltip-recouvrement) * -1));\n}\n\n.zds-tooltip--top-left .zds-tooltip__fleche {\n right: var(--zds-tooltip-retrait);\n transform: translateY(calc(var(--zds-tooltip-recouvrement) * -1));\n}\n\n.zds-tooltip--bottom .zds-tooltip__fleche {\n bottom: 100%;\n left: 50%;\n transform: translateX(-50%) translateY(var(--zds-tooltip-recouvrement)) rotate(180deg);\n}\n\n.zds-tooltip--left .zds-tooltip__fleche {\n left: 100%;\n top: 50%;\n transform: translateY(-50%) translateX(calc(var(--zds-tooltip-recouvrement-tourne) * -1)) rotate(-90deg);\n}\n\n.zds-tooltip--right .zds-tooltip__fleche {\n right: 100%;\n top: 50%;\n transform: translateY(-50%) translateX(var(--zds-tooltip-recouvrement-tourne)) rotate(90deg);\n}\n\n/* ---- L'icône d'aide ---------------------------------------------------\n ⚠️ 16 PX, RELEVÉ, ET C'EST UN PALIER QUI N'EXISTE NULLE PART AILLEURS DANS\n NOS COMPOSANTS. Les icônes des boutons font 16 ou 20 selon la taille ; celle\n de l'aide est fixe, parce qu'elle n'accompagne pas un bouton mais un libellé\n de formulaire. */\n.zds-tooltip-aide {\n display: inline-flex;\n width: 16px;\n height: 16px;\n padding: 0;\n border: none;\n border-radius: var(--zds-radius-full);\n background: none;\n /* Le Figma la trace en `Bleu marine/80`, qui EST notre `text-tertiary`. */\n color: var(--zds-color-text-tertiary);\n cursor: pointer;\n}\n\n.zds-tooltip-aide > svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n/* Ouverte, l'icône fonce d'un cran — `Bleu marine/100`, notre\n `text-tertiary-hover`. Le survol et le focus clavier sont couverts par le\n même état, parce que la bulle est ouverte dans les deux cas. */\n.zds-tooltip-aide:hover,\n.zds-tooltip-aide:focus-visible {\n color: var(--zds-color-text-tertiary-hover);\n}\n\n/* L'anneau de focus, repris tel quel de la croix de fermeture.\n ⚠️ C'EST UN AJOUT, PAS UN RELEVÉ : le cadre ne dessine que `Open=False` et\n `Open=True`, et aucun état de focus. Une aide qu'on ne peut pas atteindre au\n clavier n'aide qu'une partie des gens. */\n.zds-tooltip-aide:focus-visible {\n outline: none;\n box-shadow:\n 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n","/*\n * L'avatar de Zest — relevé le 2026-09-10 sur cinq cadres du Figma :\n * `Avatar` (3881:5036, 48 symboles), `Status icon` (3881:5020),\n * `Avatar group` (3881:4989), `_Avatar add button` (3881:4946) et\n * `Avatar label group` (3881:4930).\n *\n * ------------------------------------------------------------------------\n * UN ORDRE DE PRIORITÉ, PAS QUATRE INTERRUPTEURS\n * ------------------------------------------------------------------------\n * Le Figma range le contenu sur trois axes booléens — `Placeholder icon`,\n * `Placeholder text`, `Anonymous` — et n'en dessine que les combinaisons qui\n * ont un sens : 48 symboles pour 96 combinaisons exprimables.\n *\n * La règle produit, arbitrée le 2026-09-10, est un ORDRE :\n *\n * photo > initiales > picto\n *\n * Le composant le dérive donc de ce qu'on lui donne au lieu d'exiger qu'on\n * choisisse. Trois interrupteurs auraient rendu exprimable « initiales ET\n * picto », que personne n'a dessiné et dont personne ne sait ce qu'il devrait\n * peindre. C'est le même raisonnement que les onze hiérarchies plates du\n * bouton, appliqué à un ordre plutôt qu'à une liste.\n *\n * ⚠️ L'ANONYME GAGNE SUR TOUT, ET CE N'EST PAS UNE PRÉFÉRENCE. Il sert les\n * contextes où les réponses d'un contributeur sont anonymisées — une campagne\n * de feedback. Si `anonymous` cédait à une photo présente, une photo suffirait\n * à lever l'anonymat de quelqu'un qui l'a demandé. Il passe donc AVANT la\n * photo, et il interdit le point de statut.\n *\n * ------------------------------------------------------------------------\n * DEUX ANATOMIES, SELON QUE L'AVATAR PORTE UNE PHOTO OU UNE PASTILLE\n * ------------------------------------------------------------------------\n * Le Figma ne les habille pas pareil, et l'écart est structurel :\n *\n * · une PHOTO porte deux filets — 0,5 px de noir à 16 % au bord, puis 1 px\n * de blanc à l'intérieur. Le noir empêche une photo claire de se fondre\n * dans la page, le blanc sépare l'image de ce noir ;\n * · une PASTILLE (picto, initiales, masque) porte un fond `navy-20` et un\n * seul filet, `border-primary`.\n *\n * ⚠️ EN TAILLE `xs`, LE FILET BLANC INTÉRIEUR DISPARAÎT et celui de la\n * pastille tombe à 0,5 px. Relevé sur les six tailles : `xs` est la seule à\n * les alléger. Sur 24 px, deux filets pleins mangeraient un huitième du\n * diamètre.\n *\n * ⚠️ LA BORDURE EXTÉRIEURE A TROIS PALIERS, RELEVÉS UN PAR UN, et ce ne sont\n * pas des proportions : filet de 0,5 px et retrait d'1 px en `xs` et `sm` ;\n * 0,75 px et 1 px en `md`, 0,75 et 1,5 en `lg` ; 1 px et 2 px en `xl` et\n * `2xl`. Les six tailles ont été ouvertes séparément — une interpolation\n * aurait donné 0,875 px au `xl`, que le Figma n'écrit nulle part.\n *\n * ------------------------------------------------------------------------\n * LES FILETS SONT DES OMBRES INTÉRIEURES, PAS DES BORDURES\n * ------------------------------------------------------------------------\n * Le Figma les pose sur des cadres IMBRIQUÉS — trois niveaux quand la bordure\n * extérieure est là. Reproduire l'imbrication demanderait trois éléments par\n * avatar, et chacun rognerait l'image un peu plus. Un `box-shadow` de deux\n * anneaux rend la même image avec un seul élément : l'ordre de la liste fait\n * la superposition, le premier anneau étant AU-DESSUS. Le noir à 16 % se\n * compose donc sur le blanc, exactement comme dans la maquette où il est porté\n * par le cadre parent.\n */\n\n.zds-avatar {\n /* ---- Fentes de géométrie, remplies par le modificateur de taille ---- */\n --zds-avatar-size: 40px;\n --zds-avatar-font: var(--zds-text-body-md);\n --zds-avatar-line: var(--zds-text-body-md-line-height);\n\n /* Le point de statut suit `taille / 4 + 4`, et la formule est un relevé, pas\n une commodité : 10, 12, 14, 16, 18, 20 px pour 24, 32, 40, 48, 56, 64.\n Vérifiée sur les SIX tailles, une par une. */\n --zds-avatar-status: 14px;\n\n /* Le filet intérieur d'une photo, et celui d'une pastille. `xs` les\n allège tous les deux. */\n --zds-avatar-inner: 1.5px;\n --zds-avatar-ring: 1px;\n\n /* Le filet et le retrait de la bordure extérieure. Trois paliers relevés\n sur les six tailles — xs et sm à 0,5/1, md et lg à 0,75/1 et 1,5, xl et\n 2xl à 1/2. Ce ne sont pas des valeurs proportionnelles : un anneau se\n dessine, il ne se calcule pas. */\n --zds-avatar-border-line: 0.75px;\n --zds-avatar-border-pad: 1px;\n\n position: relative;\n display: inline-block;\n box-sizing: border-box;\n width: var(--zds-avatar-size);\n height: var(--zds-avatar-size);\n border-radius: var(--zds-radius-full);\n /* Une pile de contexte pour que le point de statut se pose par-dessus\n l'image sans qu'un `z-index` de la page vienne le passer dessous. */\n isolation: isolate;\n flex: none;\n}\n\n/* La boîte qui porte le contenu et les filets. Elle vit sous la racine pour\n que la bordure EXTÉRIEURE — qui est un padding, pas un trait — puisse la\n rétrécir sans toucher à la taille de l'avatar. */\n.zds-avatar__media {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n overflow: hidden;\n border-radius: inherit;\n}\n\n/* ---- Les six tailles -------------------------------------------------\n Chaque taille a SON palier typographique : les initiales montent de 12 à\n 22 px en six crans, de `caption-md` à `heading-lg`. C'est le seul composant\n du paquet qui traverse toute l'échelle. */\n.zds-avatar--xs {\n --zds-avatar-border-line: 0.5px;\n --zds-avatar-border-pad: 1px;\n --zds-avatar-size: 24px;\n --zds-avatar-status: 10px;\n --zds-avatar-font: var(--zds-text-caption-md);\n --zds-avatar-line: var(--zds-text-caption-md-line-height);\n /* La seule taille sans filet blanc intérieur, et à filet de pastille\n réduit. Relevé, pas déduit. */\n --zds-avatar-inner: 0.5px;\n --zds-avatar-ring: 0.5px;\n}\n\n.zds-avatar--sm {\n --zds-avatar-border-line: 0.5px;\n --zds-avatar-border-pad: 1px;\n --zds-avatar-size: 32px;\n --zds-avatar-status: 12px;\n --zds-avatar-font: var(--zds-text-body-sm);\n --zds-avatar-line: var(--zds-text-body-sm-line-height);\n}\n\n.zds-avatar--md {\n --zds-avatar-border-line: 0.75px;\n --zds-avatar-border-pad: 1px;\n --zds-avatar-size: 40px;\n --zds-avatar-status: 14px;\n --zds-avatar-font: var(--zds-text-body-md);\n --zds-avatar-line: var(--zds-text-body-md-line-height);\n}\n\n.zds-avatar--lg {\n --zds-avatar-border-line: 0.75px;\n --zds-avatar-border-pad: 1.5px;\n --zds-avatar-size: 48px;\n --zds-avatar-status: 16px;\n --zds-avatar-font: var(--zds-text-heading-sm);\n --zds-avatar-line: var(--zds-text-heading-sm-line-height);\n}\n\n.zds-avatar--xl {\n --zds-avatar-border-line: 1px;\n --zds-avatar-border-pad: 2px;\n --zds-avatar-size: 56px;\n --zds-avatar-status: 18px;\n --zds-avatar-font: var(--zds-text-heading-md);\n --zds-avatar-line: var(--zds-text-heading-md-line-height);\n}\n\n.zds-avatar--2xl {\n --zds-avatar-border-line: 1px;\n --zds-avatar-border-pad: 2px;\n --zds-avatar-size: 64px;\n --zds-avatar-status: 20px;\n --zds-avatar-font: var(--zds-text-heading-lg);\n --zds-avatar-line: var(--zds-text-heading-lg-line-height);\n}\n\n/* ---- L'habillage d'une photo ---------------------------------------- */\n.zds-avatar--photo .zds-avatar__media {\n /* Le premier anneau est au-dessus : le noir à 16 % se compose donc sur le\n blanc du second, et non sur l'image. C'est l'ordre de la maquette. */\n box-shadow:\n inset 0 0 0 0.5px var(--zds-color-avatar-photo-ring),\n inset 0 0 0 var(--zds-avatar-inner) var(--zds-color-avatar-inner-ring);\n}\n\n.zds-avatar__image {\n display: block;\n width: 100%;\n height: 100%;\n /* `cover` et non `contain` : une photo de profil se recadre, elle ne se\n laisse pas encadrer de vide. Le Figma pose la même règle. */\n object-fit: cover;\n border-radius: inherit;\n}\n\n/* ---- L'habillage d'une pastille : picto, initiales, masque ----------- */\n.zds-avatar--placeholder .zds-avatar__media {\n background: var(--zds-color-avatar-bg);\n box-shadow: inset 0 0 0 var(--zds-avatar-ring) var(--zds-color-border-primary);\n}\n\n/* Les initiales. Le libellé est `text-tertiary`, qui est le navy-80 du\n relevé — 6,33:1 sur le fond, mesuré. */\n.zds-avatar__initials {\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-avatar-font);\n font-weight: var(--zds-font-weight-semibold);\n line-height: var(--zds-avatar-line);\n color: var(--zds-color-text-tertiary);\n /* Les initiales ne se coupent pas et ne se sélectionnent pas : ce n'est pas\n du texte qu'on lit, c'est un substitut de portrait. */\n white-space: nowrap;\n user-select: none;\n}\n\n/* Le picto, à 60 % de la boîte. Le Figma l'inscrit par un retrait de 20 % en\n haut et en bas, ce qui revient au même et se lit moins bien. */\n.zds-avatar__icon {\n width: 60%;\n height: 60%;\n color: var(--zds-color-text-tertiary);\n}\n.zds-avatar__icon > svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n/* Le masque de l'anonyme. Il fait toute la largeur de l'avatar pour 47,5 %\n de sa hauteur — 40 × 19 dans le relevé — et il est centré. */\n.zds-avatar__mask {\n width: 100%;\n height: 47.5%;\n color: var(--zds-color-avatar-mask);\n}\n.zds-avatar__mask > svg {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n/* ---- La bordure extérieure ------------------------------------------\n Ce n'est pas un trait, c'est un anneau blanc : un padding d'1 px, un fond\n blanc, un filet de 0,75 px et l'ombre `ombre-sm`. Le Figma l'obtient par un\n cadre de plus autour des deux autres ; ici la racine le porte, ce qui laisse\n la taille de l'avatar inchangée et rétrécit son contenu — le comportement de\n la maquette. */\n.zds-avatar--border {\n padding: var(--zds-avatar-border-pad);\n background: var(--zds-color-bg-primary);\n box-shadow:\n inset 0 0 0 var(--zds-avatar-border-line) var(--zds-color-border-primary),\n var(--zds-shadow-xs);\n}\n\n/* ---- Le point de statut ---------------------------------------------\n 16 px dans son propre cadre, posé en bas à droite à −2 px, et rendu à la\n taille de la fente. Le débord de 2 px est constant : relevé identique sur\n `xs`, `sm`, `md` et `2xl`.\n\n ⚠️ L'ANNEAU BLANC RESTE À 1,5 PX À TOUTES LES TAILLES. Le Figma l'écrit en\n absolu dans le composant, et c'est le bon comportement : cet anneau est un\n SÉPARATEUR — son travail est de détacher le point de ce qu'il recouvre, et\n un séparateur ne rétrécit pas avec ce qu'il sépare. Même raisonnement que\n les 2 px de l'anneau de focus. */\n.zds-avatar__status {\n position: absolute;\n box-sizing: border-box;\n border: 1.5px solid var(--zds-color-avatar-inner-ring);\n border-radius: var(--zds-radius-full);\n}\n\n/* ⚠️ DEUX GÉOMÉTRIES, ET UN PREMIER JET LES AVAIT CONFONDUES. Dans la\n maquette, le CADRE du statut fait 16 px et se pose à −2 px du bord de\n l'avatar ; ce qui se voit dedans n'a pas la même taille selon le statut :\n\n · « en ligne » et « hors ligne » s'inscrivent à 2 px du cadre, soit 12 px\n sur 16 — 75 % — et l'anneau blanc est porté par CE disque ;\n · « commentaire sensible » REMPLIT le cadre, ses 16 px entiers.\n\n Le premier jet posait l'anneau sur le cadre pour les trois, avec un retrait\n interne. Résultat : le disque coloré avait la bonne aire mais son anneau\n blanc était peint 1,75 px trop loin vers l'extérieur, ce qui donnait un halo\n pâle et un point qui paraissait plus gros et plus délavé qu'il ne devait.\n Rien ne le disait — c'est une capture de la page qui l'a montré.\n\n Le retrait est proportionnel au cadre là où l'anneau reste absolu : le\n disque EST l'information et garde son aire, l'anneau ne fait que le\n détacher. */\n.zds-avatar__status--online,\n.zds-avatar__status--offline {\n width: calc(var(--zds-avatar-status) * 0.75);\n height: calc(var(--zds-avatar-status) * 0.75);\n right: calc(var(--zds-avatar-status) * 0.125 - 2px);\n bottom: calc(var(--zds-avatar-status) * 0.125 - 2px);\n}\n\n.zds-avatar__status--online {\n background-color: var(--zds-color-fg-success-primary);\n}\n\n/* ⚠️ 1,44:1 SUR DU BLANC, ET C'EST UN COMPROMIS ASSUMÉ. Voir le bloc AVATAR\n de `theme.css` : le foncer ferait lire « hors ligne » comme un état actif.\n Épinglé dans `verify:avatars`. */\n.zds-avatar__status--offline {\n background-color: var(--zds-color-avatar-status-offline);\n}\n\n/* Le commentaire sensible. Il ne suit pas la géométrie des deux autres : son\n disque remplit tout le cadre au lieu de s'y inscrire à 12,5 %, donc il se\n voit plus gros. Relevé tel quel, et signalé dans la page — deux statuts sur\n trois d'un côté, un de l'autre, ça se remarque quand ils voisinent. */\n/* Le seul des trois à remplir son cadre. C'est ce qui le fait paraître plus\n gros que ses deux voisins, et c'est le relevé.\n\n ⚠️ SON PICTO EST BLANC, ET LE FIGMA LE PEINT ROUGE. C'est la conséquence\n directe du contraste : le Figma pose un picto `Rouge/200` sur un disque\n `Rouge/40`, ce qui tient 3,40 pour le picto mais 1,42 pour le disque. Un\n disque assez foncé pour tenir 3:1 sur du blanc — le palier 500 — ne laisse\n plus passer aucun rouge : un `error-600` y tombe à 1,29. Le blanc, lui, tient\n 3,76. Voir le bloc AVATAR de `theme.css`. À répercuter dans le Figma. */\n.zds-avatar__status--sensitive-comment {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--zds-avatar-status);\n height: var(--zds-avatar-status);\n right: -2px;\n bottom: -2px;\n background-color: var(--zds-color-avatar-status-sensitive-bg);\n color: var(--zds-color-text-white);\n}\n.zds-avatar__status--sensitive-comment > svg {\n display: block;\n width: 62.5%;\n height: 62.5%;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .zds-avatar-add {\n transition: none;\n }\n}\n\n/* ======================================================================\n LE GROUPE D'AVATARS — `Avatar group` (3881:4989)\n ======================================================================\n Trois tailles seulement — `xs`, `sm`, `md` — là où l'avatar en a six. Le\n Figma n'en dessine pas d'autres, et un groupe de 64 px n'aurait de toute\n façon pas de place dans une ligne de tableau.\n\n Le chevauchement est un relevé et non une proportion : −4, −8, −12 px. Le\n modèle a été vérifié sur les trois largeurs du cadre — 176, 216 et 256 px —\n et les trois tombent juste. */\n.zds-avatar-group {\n --zds-avatar-group-overlap: -12px;\n\n display: inline-flex;\n align-items: flex-start;\n gap: var(--zds-space-md);\n}\n\n.zds-avatar-group--xs {\n --zds-avatar-group-overlap: -4px;\n}\n.zds-avatar-group--sm {\n --zds-avatar-group-overlap: -8px;\n}\n.zds-avatar-group--md {\n --zds-avatar-group-overlap: -12px;\n}\n\n.zds-avatar-group__avatars {\n display: inline-flex;\n align-items: flex-start;\n}\n\n/* L'enveloppe d'un avatar dans la pile. Elle existe pour deux raisons : porter\n l'anneau, et porter la marge négative. */\n.zds-avatar-group__slot {\n display: inline-flex;\n border-radius: var(--zds-radius-full);\n}\n\n/* L'anneau qui sépare deux avatars superposés. Il est porté par le groupe et\n non par l'avatar : un avatar seul n'a rien à séparer — et un avatar bordé en\n porte déjà un, qui n'a pas la même épaisseur ni la même raison d'être. */\n.zds-avatar-group__avatars > * {\n box-shadow: 0 0 0 1.5px var(--zds-color-avatar-group-ring);\n}\n\n/* Le dernier ne chevauche personne — sans quoi le groupe finirait par un\n creux de 12 px que rien ne remplit. */\n.zds-avatar-group__avatars > * + * {\n margin-inline-start: var(--zds-avatar-group-overlap);\n}\n\n/* ======================================================================\n LE BOUTON D'AJOUT — `_Avatar add button` (3881:4946)\n ======================================================================\n Un cercle en tireté, quatre états relevés : défaut, survol, focus, inactif.\n Le Figma en dessine un état de FOCUS, contrairement à la croix du badge —\n donc ici l'anneau est un relevé et non un ajout.\n\n ⚠️ LE SPÉCIMEN DE SURVOL DU FIGMA CONTIENT UNE INFO-BULLE « Add user » ET UN\n CURSEUR DESSINÉ. Ce sont des annotations de maquette, pas des morceaux du\n composant : elles ne sont pas reproduites. */\n.zds-avatar-add {\n --zds-avatar-add-size: 40px;\n --zds-avatar-add-icon: 20px;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--zds-avatar-add-size);\n height: var(--zds-avatar-add-size);\n padding: var(--zds-space-xs);\n border: 1px dashed var(--zds-color-border-primary);\n border-radius: var(--zds-radius-full);\n background: var(--zds-color-bg-primary);\n color: var(--zds-color-text-tertiary);\n cursor: pointer;\n transition:\n background-color 0.1s ease-in-out,\n color 0.1s ease-in-out;\n}\n\n.zds-avatar-add--xs {\n --zds-avatar-add-size: 24px;\n --zds-avatar-add-icon: 16px;\n}\n.zds-avatar-add--sm {\n --zds-avatar-add-size: 32px;\n --zds-avatar-add-icon: 16px;\n}\n.zds-avatar-add--md {\n --zds-avatar-add-size: 40px;\n --zds-avatar-add-icon: 20px;\n}\n\n.zds-avatar-add > svg {\n display: block;\n width: var(--zds-avatar-add-icon);\n height: var(--zds-avatar-add-icon);\n}\n\n.zds-avatar-add:hover:not(:disabled) {\n background: var(--zds-color-avatar-add-bg-hover);\n color: var(--zds-color-text-primary);\n}\n\n.zds-avatar-add:focus-visible {\n outline: none;\n box-shadow:\n 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n/* L'inactif est une opacité, comme sur le bouton : le Figma emploie le même\n mécanisme, et une palette d'états inactifs par composant finirait par\n diverger. */\n.zds-avatar-add:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/* ======================================================================\n L'AVATAR ET SON LIBELLÉ — `Avatar label group` (3881:4930)\n ====================================================================== */\n.zds-avatar-label-group {\n display: inline-flex;\n align-items: center;\n gap: var(--zds-space-md);\n}\n\n.zds-avatar-label-group__text {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n min-width: 0;\n}\n\n/* ⚠️ LES DEUX LIGNES NE SUIVENT PAS LA MÊME ÉCHELLE, ET LES TROIS TAILLES NE\n LA DÉCALENT PAS DE LA MÊME FAÇON. Relevé sur les trois spécimens :\n\n sm nom `body-sm` 14/20 soutien `caption-md` 12/18 → 38 px\n md nom `body-sm` 14/20 soutien `body-sm` 14/20 → 40 px\n lg nom `body-md` 16/24 soutien `body-md` 16/24 → 48 px\n\n Le `sm` est le seul à descendre son soutien d'un palier sous son nom, et\n c'est ce qui explique ses 38 px — une hauteur qui n'est ni 32 ni 40 et qui\n avait tout l'air d'une erreur de maquette avant d'être additionnée. */\n.zds-avatar-label-group {\n --zds-avatar-label-name: var(--zds-text-body-sm);\n --zds-avatar-label-name-line: var(--zds-text-body-sm-line-height);\n --zds-avatar-label-support: var(--zds-text-body-sm);\n --zds-avatar-label-support-line: var(--zds-text-body-sm-line-height);\n}\n\n.zds-avatar-label-group--sm {\n --zds-avatar-label-support: var(--zds-text-caption-md);\n --zds-avatar-label-support-line: var(--zds-text-caption-md-line-height);\n}\n\n.zds-avatar-label-group--lg {\n --zds-avatar-label-name: var(--zds-text-body-md);\n --zds-avatar-label-name-line: var(--zds-text-body-md-line-height);\n --zds-avatar-label-support: var(--zds-text-body-md);\n --zds-avatar-label-support-line: var(--zds-text-body-md-line-height);\n}\n\n.zds-avatar-label-group__name {\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-avatar-label-name);\n font-weight: var(--zds-font-weight-semibold);\n line-height: var(--zds-avatar-label-name-line);\n color: var(--zds-color-text-primary);\n}\n\n/* Le texte de soutien est en REGULAR là où le nom est en semibold, et sur\n `text-secondary`. Deux graisses et deux couleurs pour deux rangs : c'est ce\n qui fait qu'on lit le nom d'abord. */\n.zds-avatar-label-group__support {\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-avatar-label-support);\n font-weight: var(--zds-font-weight-normal);\n line-height: var(--zds-avatar-label-support-line);\n color: var(--zds-color-text-secondary);\n}\n\n/* Un nom et une adresse débordent d'une colonne étroite bien avant un badge :\n ils se coupent par une ellipse plutôt que de pousser la mise en page. */\n.zds-avatar-label-group__name,\n.zds-avatar-label-group__support {\n max-width: 100%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n","/**\n * La case à cocher et le bouton radio — relevés sur `_Checkbox base`\n * (3891:11902) et `Checkbox` (3891:11629).\n *\n * ⚠️ DEUX TAILLES, ET TOUT CHANGE AVEC ELLES, PAS SEULEMENT LA BOÎTE. Relevé\n * symbole par symbole : `sm` fait 16 px de boîte, 4 px de rayon, 8 px d'écart au\n * texte, du `body-sm` et AUCUN écart entre le libellé et l'aide ; `md` fait\n * 20 px, 6 px de rayon, 12 px d'écart, du `body-md` et 2 px entre les deux\n * textes. Interpoler aurait donné à `md` un rayon de 5 px que le Figma n'écrit\n * nulle part, et un écart de texte de 1.\n *\n * ⚠️ LES DEUX RAYONS SONT DES PIÈGES DE NOMMAGE. Le Figma appelle `radius-2xs`\n * la valeur 4 px et `radius-xs` la valeur 6 ; chez nous 4 px est\n * `--zds-radius-xs` et 6 px est `--zds-radius-sm`. Les échelles se croisent d'un\n * cran, comme sur l'info-bulle — on mappe par la VALEUR mesurée, jamais par le\n * nom. (Le MCP résout même le rayon de 4 px vers `spacing-xs` : deux variables\n * portent 4, et il n'y a que la valeur pour trancher.)\n *\n * ⚠️ L'INPUT PORTE `appearance: none` ET RESTE L'INPUT. Il garde le clavier, le\n * formulaire, le groupement des radios et les pseudo-classes natives — dont\n * `:indeterminate`, qui n'a pas d'équivalent en attribut.\n */\n\n/* ---- La ligne ---------------------------------------------------------\n `align-items: flex-start` : sur deux lignes de texte, le contrôle reste en\n haut. Le centrer le ferait descendre au milieu du bloc, loin du libellé\n qu'il commande. */\n.zds-checkbox {\n display: flex;\n align-items: flex-start;\n}\n\n.zds-checkbox--sm {\n --zds-checkbox-boite: 16px;\n --zds-checkbox-rayon: var(--zds-radius-xs);\n --zds-checkbox-corps: var(--zds-text-body-sm);\n --zds-checkbox-interligne: var(--zds-text-body-sm-line-height);\n gap: var(--zds-space-md);\n}\n\n.zds-checkbox--md {\n --zds-checkbox-boite: 20px;\n --zds-checkbox-rayon: var(--zds-radius-sm);\n --zds-checkbox-corps: var(--zds-text-body-md);\n --zds-checkbox-interligne: var(--zds-text-body-md-line-height);\n gap: var(--zds-space-lg);\n}\n\n/* ---- Le contrôle ------------------------------------------------------\n ⚠️ LES 2 PX DE HAUT SONT UN RELEVÉ, PAS UN CENTRAGE. Le Figma pousse le\n contrôle de 2 px vers le bas pour l'asseoir sur la première ligne de texte.\n Ce n'est PAS un centrage : une boîte de 16 sur une ligne de 20 serait centrée\n à 2 px, mais une boîte de 20 sur une ligne de 24 le serait aussi — or les\n deux tailles portent le même 2 px. C'est une valeur, pas une formule. */\n.zds-checkbox__controle {\n position: relative;\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n padding-top: var(--zds-space-xxs);\n}\n\n.zds-checkbox__entree {\n appearance: none;\n margin: 0;\n width: var(--zds-checkbox-boite);\n height: var(--zds-checkbox-boite);\n border: 1px solid var(--zds-color-checkbox-border);\n border-radius: var(--zds-checkbox-rayon);\n background: var(--zds-color-bg-primary);\n cursor: pointer;\n}\n\n/* ⚠️ LA BORDURE EST FONCÉE PAR RAPPORT AU FIGMA, ET C'EST ARBITRÉ. Le cadre la\n peint `border-primary` (navy-40), qui tient 1,44 sur du blanc pour un seuil\n de 3:1. C'est le plus bas de ce design system, et c'est plus grave que sur le\n bouton où le même compromis a été accepté à 2,17 : un bouton garde son\n libellé à 11,82 et reste identifiable, tandis qu'ici la BOÎTE EST le\n contrôle. navy-70 tient 3,67 — le palier le plus clair de nos neutres qui\n passe le seuil. Décision produit du 2026-09-10, à remonter dans le Figma. */\n\n.zds-checkbox--radio .zds-checkbox__entree {\n border-radius: var(--zds-radius-full);\n}\n\n/* ---- La marque --------------------------------------------------------\n Posée par-dessus l'input, qu'elle ne doit pas intercepter. */\n.zds-checkbox__marque {\n position: absolute;\n top: var(--zds-space-xxs);\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--zds-checkbox-boite);\n height: var(--zds-checkbox-boite);\n color: var(--zds-color-fg-white);\n opacity: 0;\n pointer-events: none;\n}\n\n/* ⚠️ LA MARQUE NE FAIT PAS LA MÊME PART DANS LES DEUX TAILLES, ET SON TRAIT\n NON PLUS. C'est ce qui rendait la coche pâle : une seule règle pour les deux.\n\n Relevé, retrait par retrait, sur les quatre symboles :\n\n taille boîte marque part trait peint\n sm 16 12 × 12 75 % 1,6666\n md 20 14 × 14 70 % 2\n\n ⚠️ ET LE TRAIT NE SUIT PAS L'ÉCHELLE DU DESSIN. Les coordonnées du tracé,\n elles, la suivent exactement — celles du Figma sont celles de notre catalogue\n multipliées par 12/24 puis 14/24, au chiffre près. Le TRAIT, lui, reste épais :\n une mise à l'échelle proportionnelle donnerait 1 px en `sm` et 1,17 en `md`,\n alors que le Figma pose 1,6666 et 2. C'est un choix de dessin — une coche fine\n dans une petite boîte disparaît — et c'est exactement l'écart qui rendait la\n nôtre peu visible : nous rendions 1 px au lieu de 1,6666.\n\n Le `stroke-width` s'exprime dans les unités du `viewBox`, qui vaut 24 pour\n nos icônes. Pour peindre une épaisseur E sur une marque de M pixels :\n\n stroke-width = E × 24 / M\n\n soit 1,6666 × 24/12 = 3,3332 en `sm`, et 2 × 24/14 = 3,4286 en `md`. */\n.zds-checkbox__marque > svg {\n display: block;\n}\n\n.zds-checkbox--sm .zds-checkbox__marque > svg {\n width: 75%;\n height: 75%;\n stroke-width: 3.3332;\n}\n\n.zds-checkbox--md .zds-checkbox__marque > svg {\n width: 70%;\n height: 70%;\n stroke-width: 3.4286;\n}\n\n/* Le point du radio : une forme pleine, pas une icône empruntée.\n\n ⚠️ IL NE FAIT PAS LA MÊME PART NON PLUS — 37,5 % en `sm`, 40 % en `md`. Le\n Figma l'écrit en retrait, `inset: 31.25%` puis `inset: 30%`, ce qui donne un\n point de 6 px sur 16 et de 8 px sur 20. Deux valeurs, pas une proportion\n commune. */\n.zds-checkbox--radio .zds-checkbox__marque::before {\n content: \"\";\n display: block;\n border-radius: var(--zds-radius-full);\n background: currentColor;\n}\n\n.zds-checkbox--radio.zds-checkbox--sm .zds-checkbox__marque::before {\n width: 37.5%;\n height: 37.5%;\n}\n\n.zds-checkbox--radio.zds-checkbox--md .zds-checkbox__marque::before {\n width: 40%;\n height: 40%;\n}\n\n/* ---- Coché, et indéterminé --------------------------------------------\n ⚠️ `:indeterminate` EST UNE PSEUDO-CLASSE NATIVE, et c'est pour ça que\n l'input est un vrai input. Aucun attribut ne la déclare : elle se pose sur le\n nœud DOM, et le navigateur la reflète en CSS tout seul. */\n.zds-checkbox__entree:checked,\n.zds-checkbox__entree:indeterminate {\n border-color: var(--zds-color-checkbox-bg-checked);\n background: var(--zds-color-checkbox-bg-checked);\n}\n\n.zds-checkbox__entree:checked + .zds-checkbox__marque,\n.zds-checkbox__entree:indeterminate + .zds-checkbox__marque {\n opacity: 1;\n}\n\n/* ---- Le survol --------------------------------------------------------\n ⚠️ C'EST UN AJOUT, PAS UN RELEVÉ, ET IL EST À REMONTER DANS LE FIGMA. Les\n quarante symboles portent un état `Hover`, et il est identique au PIXEL à\n l'état `Default` — vérifié en échantillonnant la capture du cadre sur les\n décochés, les cochés, les indéterminés et les radios. La variante existe,\n l'intention y était, et elle ne dessine rien. Un contrôle sans retour au\n survol paraît inerte, donc on en dessine un : décoché il prend un fond\n navy-20, coché il descend d'un cran.\n\n Le cran du coché ne demande aucun jeton : `bg-brand-solid` EST brand-600,\n c'est un rôle, et de la bonne catégorie. */\n.zds-checkbox__entree:hover:not(:disabled) {\n background: var(--zds-color-checkbox-bg-hover);\n}\n\n.zds-checkbox__entree:checked:hover:not(:disabled),\n.zds-checkbox__entree:indeterminate:hover:not(:disabled) {\n border-color: var(--zds-color-bg-brand-solid);\n background: var(--zds-color-bg-brand-solid);\n}\n\n/* ---- Le focus ---------------------------------------------------------\n ⚠️ POUR UNE FOIS L'ANNEAU EST UN RELEVÉ, PAS UN AJOUT. Le Figma l'écrit\n `0 0 0 2px bg-primary, 0 0 0 4px Bleu/100` — soit exactement la recette que le\n bouton avait posée et que la croix de fermeture, la croix du badge et l'icône\n d'aide de l'info-bulle réemploient. Quatre pièces l'avaient ajoutée de leur\n côté ; celle-ci confirme qu'elle était juste. */\n/* ⚠️ `[data-zds-demo=\"focus\"]` EST UN CROCHET DE DOCUMENTATION, ET IL EST LIVRÉ\n EXPRÈS — comme sur le bouton, dont il reprend le mécanisme mot pour mot. Un\n anneau de focus ne s'affiche que sous `:focus-visible`, donc jamais sur une\n planche ni sur une capture de relecture. Le Figma, lui, en dessine bien une\n variante `State=Focused` : un état dessiné que la documentation ne peut pas\n montrer est un état que personne ne relit.\n\n ⚠️ ET LES DEUX SÉLECTEURS PARTAGENT UNE SEULE DÉCLARATION. C'est ce qui\n empêche le seul vrai danger du crochet : que la démonstration dérive de\n l'anneau réel. `verify:checkboxes` referme la porte en comparant les deux\n octet pour octet — un vrai focus clavier contre un forcé.\n\n ⚠️ IL A MANQUÉ AU PREMIER JET, et le composant a été livré sans. L'anneau\n était juste, le contrôle le mesurait, et la page n'en montrait rien : le\n tableau des états en annonçait quatre pour trois visibles. C'est Micka qui\n l'a demandé. */\n.zds-checkbox__entree:focus-visible,\n.zds-checkbox__entree[data-zds-demo=\"focus\"] {\n outline: none;\n box-shadow:\n 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n/* ---- Désactivé --------------------------------------------------------\n ⚠️ DEUX CHANGEMENTS À LA FOIS, ET LES PIXELS L'ONT TRANCHÉ. On aurait pu\n croire à une simple opacité posée sur l'état par défaut : un blanc à 50 % sur\n du blanc reste blanc, et la bordure aurait donné #e9ebef. La case désactivée\n mesure #f8f9fa — exactement navy-20 à 50 %. Le symbole confirme : fond\n navy-20, bordure conservée, `opacity: 0.5`.\n\n L'opacité est le même mécanisme que le bouton désactivé, et c'est elle qui\n explique la marque : elle reste blanche parce que l'opacité s'applique au\n GROUPE, pas à chaque couche. D'où l'opacité posée sur la LIGNE entière, et\n non sur l'input seul — sinon le libellé resterait à pleine intensité à côté\n d'un contrôle éteint. */\n.zds-checkbox:has(.zds-checkbox__entree:disabled) {\n opacity: 0.5;\n}\n\n.zds-checkbox__entree:disabled {\n background: var(--zds-color-checkbox-bg-disabled);\n cursor: not-allowed;\n}\n\n.zds-checkbox__entree:disabled:checked,\n.zds-checkbox__entree:disabled:indeterminate {\n background: var(--zds-color-checkbox-bg-checked);\n}\n\n.zds-checkbox:has(.zds-checkbox__entree:disabled) .zds-checkbox__libelle {\n cursor: not-allowed;\n}\n\n/* ---- Les textes -------------------------------------------------------\n ⚠️ L'ÉCART ENTRE LE LIBELLÉ ET L'AIDE EST NUL EN `sm` ET DE 2 PX EN `md`.\n Relevé sur les deux symboles : le `sm` ne déclare aucun `gap`, le `md` en\n déclare un de 2. Les hauteurs le confirment — 40 px pour le `sm`\n (20 + 0 + 20) et 50 pour le `md` (24 + 2 + 24). */\n.zds-checkbox__textes {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n align-items: flex-start;\n min-width: 0;\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-checkbox-corps);\n font-weight: var(--zds-font-weight-normal);\n line-height: var(--zds-checkbox-interligne);\n}\n\n.zds-checkbox--md .zds-checkbox__textes {\n gap: var(--zds-space-xxs);\n}\n\n.zds-checkbox__libelle {\n color: var(--zds-color-text-primary);\n cursor: pointer;\n}\n\n/* ⚠️ LE TEXTE D'AIDE TIENT 3,67 SUR DU BLANC, POUR UN SEUIL AA DE 4,50, ET CE\n N'EST PAS UN PROBLÈME DE CE COMPOSANT. Le Figma le peint `text-secondary`, et\n `text-secondary` EST navy-70 chez nous : le rôle lui-même est sous le seuil,\n partout où il porte du texte. Le foncer ici seulement rendrait cette aide\n différente de toutes les autres du design system. Signalé dans le README ;\n c'est une décision de fondation, pas de composant. */\n.zds-checkbox__aide {\n color: var(--zds-color-text-secondary);\n}\n","/**\n * L'interrupteur — relevé sur `_Toggle base` (3896:1480) et `Toggle`\n * (3896:1553).\n *\n * ⚠️ DEUX AXES INDÉPENDANTS, ET SIX VALEURS À TENIR. La taille change la piste,\n * le bouton et le texte ; le TYPE change la piste, le retrait du bouton, sa\n * bordure et son ombre. Relevé symbole par symbole :\n *\n * type taille piste retrait bouton ombre du bouton bordure\n * default sm 36 × 20 2 16 ombre-md aucune\n * default md 44 × 24 2 20 ombre-md aucune\n * slim sm 32 × 16 0 16 ombre-sm 1 px\n * slim md 40 × 20 0 20 ombre-sm 1 px\n *\n * ⚠️ LA PISTE DU TYPE `slim` N'EST PAS CELLE DU `default` EN PLUS PETIT. En\n * `md`, `slim` fait 40 × 20 et `default` 44 × 24 : ce n'est pas une réduction\n * proportionnelle, et le bouton, lui, garde 20 px dans les deux. Ce qui change\n * est le RETRAIT — 2 px d'un côté, 0 de l'autre — donc la piste `slim` est\n * exactement de la hauteur de son bouton. Interpoler aurait donné n'importe\n * quoi.\n *\n * ⚠️ LA BORDURE DE LA PISTE ÉTEINTE FAIT 0,5 px SUR LE `default` ET 1 px SUR LE\n * `slim`. Deux valeurs pour la même couleur et le même rôle. C'est le relevé,\n * reproduit tel quel : sur le `slim` le Figma ne pose pas une bordure mais un\n * calque `Border` en recouvrement, épais de 1 px.\n */\n\n/* ---- La ligne ---------------------------------------------------------\n `align-items: flex-start` : sur deux lignes de texte, le contrôle reste en\n haut, contre le libellé qu'il commande.\n\n ⚠️ ET IL N'Y A AUCUN DÉCALAGE VERTICAL À POSER, CONTRAIREMENT À LA CASE À\n COCHER. La piste fait exactement la hauteur de la première ligne de texte\n dans les deux tailles — 20 sur 20 en `sm`, 24 sur 24 en `md` — ce que les\n hauteurs des symboles composés confirment : 40 px pour le `sm` (20 + 0 + 20)\n et 50 pour le `md` (24 + 2 + 24). La case à cocher, elle, porte un\n `padding-top` de 2 px parce que sa boîte est plus basse que sa ligne. */\n.zds-toggle {\n display: flex;\n align-items: flex-start;\n}\n\n.zds-toggle--sm {\n --zds-toggle-piste-l: 36px;\n --zds-toggle-piste-h: 20px;\n --zds-toggle-bouton: 16px;\n --zds-toggle-corps: var(--zds-text-body-sm);\n --zds-toggle-interligne: var(--zds-text-body-sm-line-height);\n gap: var(--zds-space-md);\n}\n\n.zds-toggle--md {\n --zds-toggle-piste-l: 44px;\n --zds-toggle-piste-h: 24px;\n --zds-toggle-bouton: 20px;\n --zds-toggle-corps: var(--zds-text-body-md);\n --zds-toggle-interligne: var(--zds-text-body-md-line-height);\n gap: var(--zds-space-lg);\n}\n\n.zds-toggle--default {\n --zds-toggle-retrait: var(--zds-space-xxs);\n --zds-toggle-trait: 0.5px;\n}\n\n.zds-toggle--slim {\n --zds-toggle-retrait: 0px;\n --zds-toggle-trait: 1px;\n}\n\n.zds-toggle--slim.zds-toggle--sm {\n --zds-toggle-piste-l: 32px;\n --zds-toggle-piste-h: 16px;\n}\n\n.zds-toggle--slim.zds-toggle--md {\n --zds-toggle-piste-l: 40px;\n --zds-toggle-piste-h: 20px;\n}\n\n/* ---- Le contrôle ------------------------------------------------------ */\n.zds-toggle__controle {\n position: relative;\n display: flex;\n flex-shrink: 0;\n}\n\n/* ---- La piste ---------------------------------------------------------\n ⚠️ LA BORDURE EST FONCÉE PAR RAPPORT AU FIGMA, ET C'EST UN ÉCART ARBITRÉ LE\n 2026-09-11, APRÈS MESURE. Le cadre peint la limite du contrôle\n `border-primary` (navy-40), qui tient 1,44 sur du blanc pour le seuil de 3:1\n que la WCAG 1.4.11 demande — sur un fond navy-20 qui tient 1,11.\n\n Ce dépôt tranche ce cas sur UNE question : y a-t-il autre chose, DANS le\n contrôle, qui le rende identifiable à 3:1 ? Le bouton a son libellé à 11,82,\n donc sa bordure est restée au Figma à 2,17. La case à cocher n'a rien, donc\n elle est montée à navy-70. L'interrupteur éteint, mesuré : son bouton blanc\n tient 1,11 contre sa piste, et en `slim` la bordure de ce bouton tient 1,30.\n Rien n'atteint 3 — il est dans le cas de la case, pas dans celui du bouton.\n\n navy-70 tient 3,67. Troisième fois que cet arbitrage est rendu à partir de\n navy-40, après la case à cocher et le point « hors ligne » de l'avatar.\n `verify:interrupteur` épingle la valeur dans les deux sens. */\n.zds-toggle__piste {\n appearance: none;\n box-sizing: border-box;\n margin: 0;\n width: var(--zds-toggle-piste-l);\n height: var(--zds-toggle-piste-h);\n border: var(--zds-toggle-trait) solid var(--zds-color-toggle-border);\n border-radius: var(--zds-radius-full);\n background: var(--zds-color-toggle-bg);\n cursor: pointer;\n transition:\n background-color var(--zds-transition-fast),\n border-color var(--zds-transition-fast);\n}\n\n/* ---- Le bouton --------------------------------------------------------\n Posé par-dessus la piste, qu'il ne doit pas intercepter.\n\n ⚠️ IL EST CALÉ SUR LA BOÎTE EXTÉRIEURE DE LA PISTE, PAS SUR SON INTÉRIEUR, et\n c'est ce que le Figma dessine : sur le `slim`, la bordure est un calque en\n recouvrement, pas une bordure de mise en page, donc le bouton part du bord\n extérieur et la recouvre. Le positionner en absolu dans l'enveloppe donne\n exactement ça, et rend le déplacement indépendant de l'épaisseur du trait. */\n.zds-toggle__bouton {\n position: absolute;\n top: 50%;\n left: var(--zds-toggle-retrait);\n box-sizing: border-box;\n width: var(--zds-toggle-bouton);\n height: var(--zds-toggle-bouton);\n border-radius: var(--zds-radius-full);\n background: var(--zds-color-bg-primary);\n box-shadow: var(--zds-shadow-toggle-knob);\n transform: translateY(-50%);\n transition: transform var(--zds-transition-fast);\n pointer-events: none;\n}\n\n/* Le `slim` détache son bouton par une bordure, pas par une ombre portée :\n l'ombre descend d'un cran, à `--zds-shadow-xs`, dont la géométrie est celle\n de l'`ombre-sm` du Figma au chiffre près.\n\n ⚠️ ET CETTE BORDURE SUIT L'ARBITRAGE DE LA PISTE, elle aussi. En `slim` le\n bouton remplit la piste : sa bordure est la SEULE chose qui l'en sépare, et la\n position du bouton EST l'état. La foncer d'un côté et pas de l'autre donnerait\n un anneau extérieur net autour d'un bouton invisible — 3,30 contre la piste au\n lieu de 1,30. */\n.zds-toggle--slim .zds-toggle__bouton {\n border: 1px solid var(--zds-color-toggle-border);\n box-shadow: var(--zds-shadow-xs);\n}\n\n/* ---- Allumé -----------------------------------------------------------\n ⚠️ LE DÉPLACEMENT EST `translateX(100%)`, SOIT LA LARGEUR DU BOUTON. Les\n quatre combinaisons donnent le même résultat : 36−2−2−16 = 16 = la largeur du\n bouton `sm`, 44−2−2−20 = 20, 32−16 = 16, 40−20 = 20. Une seule règle plutôt\n que quatre valeurs à tenir d'accord avec les tailles.\n\n ⚠️ ET LA BORDURE DISPARAÎT, elle ne change pas de couleur : le symbole allumé\n n'en porte aucune. `transparent` plutôt qu'un retrait, pour que la boîte ne\n change pas de taille entre les deux états. */\n.zds-toggle__piste:checked {\n border-color: transparent;\n background: var(--zds-color-toggle-bg-pressed);\n}\n\n.zds-toggle__piste:checked + .zds-toggle__bouton {\n transform: translateY(-50%) translateX(100%);\n}\n\n.zds-toggle--slim .zds-toggle__piste:checked + .zds-toggle__bouton {\n border-color: var(--zds-color-border-brand);\n}\n\n/* ---- Le survol --------------------------------------------------------\n UNE SEULE RÈGLE POUR LES DEUX ÉTATS : au survol, la piste descend d'un cran\n de sa rampe. Éteinte, navy-20 → navy-30 ; allumée, brand-500 → brand-700.\n\n ⚠️ CELUI DE L'ÉTAT ÉTEINT EST UN AJOUT, PAS UN RELEVÉ, et c'est le même ajout\n que sur la case à cocher le 2026-09-10. Les seize symboles\n `Pressed=False, State=Hover` sont identiques, propriété par propriété, à leurs\n `State=Default` : le Figma ne dessine rien. Un contrôle qui applique son effet\n AU CLIC et qui ne répond pas au survol paraît inerte. À remonter dans le\n Figma.\n\n ⚠️ ET LE CRAN EST DISCRET, MESURÉ : 1,12 contre la piste au repos. C'est\n assumé. Un survol n'est pas un état qu'on lit, c'est une confirmation que le\n contrôle est vivant ; le rendre spectaculaire le ferait concurrencer l'état\n allumé, qui lui porte l'information. */\n.zds-toggle__piste:hover:not(:disabled) {\n background: var(--zds-color-toggle-bg-hover);\n}\n\n.zds-toggle__piste:checked:hover:not(:disabled) {\n background: var(--zds-color-bg-brand-solid-hover);\n}\n\n.zds-toggle--slim .zds-toggle__piste:checked:hover:not(:disabled) + .zds-toggle__bouton {\n border-color: var(--zds-color-toggle-border-pressed-hover);\n}\n\n/* ---- Le focus ---------------------------------------------------------\n ⚠️ L'ANNEAU EST UN RELEVÉ, PAS UN AJOUT : le Figma l'écrit\n `0 0 0 2px bg-primary, 0 0 0 4px Bleu/100` sur les huit symboles `State=Focus`\n — la recette que le bouton a posée et que la croix de fermeture, la croix du\n badge, l'icône d'aide de l'info-bulle et la case à cocher réemploient.\n\n ⚠️ `[data-zds-demo=\"focus\"]` EST UN CROCHET DE DOCUMENTATION, LIVRÉ EXPRÈS, et\n il partage UNE déclaration avec `:focus-visible`. Un anneau ne s'affiche qu'à\n la navigation clavier, et un seul élément du document tient le focus à la\n fois : sans ce crochet, un état que le Figma dessine ne peut apparaître sur\n aucune planche — donc personne ne le relit. Le partage de la déclaration est\n ce qui empêche la démonstration de dériver du vrai anneau, et\n `verify:interrupteur` compare les deux octet pour octet. */\n.zds-toggle__piste:focus-visible,\n.zds-toggle__piste[data-zds-demo=\"focus\"] {\n outline: none;\n box-shadow:\n 0 0 0 2px var(--zds-color-bg-primary),\n 0 0 0 4px var(--zds-color-focus-ring);\n}\n\n/* ---- Désactivé --------------------------------------------------------\n ⚠️ C'EST UNE OPACITÉ SEULE, ET LÀ ENCORE C'EST LE RELEVÉ. Le symbole\n désactivé ne change aucune couleur : il pose `opacity: 0.5` sur le groupe, et\n rien d'autre. La case à cocher, elle, changeait DEUX choses — un fond navy-20\n ET l'opacité — ce que les pixels avaient tranché. Ne pas transposer l'un sur\n l'autre.\n\n L'opacité est posée sur la LIGNE entière, comme sur la case et le bouton :\n sur le contrôle seul, le libellé resterait à pleine intensité à côté d'un\n interrupteur éteint. */\n.zds-toggle:has(.zds-toggle__piste:disabled) {\n opacity: 0.5;\n}\n\n.zds-toggle__piste:disabled {\n cursor: not-allowed;\n}\n\n.zds-toggle:has(.zds-toggle__piste:disabled) .zds-toggle__libelle {\n cursor: not-allowed;\n}\n\n/* ⚠️ LE GLISSEMENT EST UNE CONSTRUCTION, PAS UN RELEVÉ. Un cadre statique ne\n décrit aucune transition : le Figma donne les deux positions du bouton, pas\n le chemin entre elles. Un interrupteur qui saute d'un bord à l'autre perd ce\n qui le distingue d'une case à cocher — on VOIT la bascule. La durée est celle\n du thème, celle que le bouton emploie déjà.\n\n Et il se retire pour qui l'a demandé au système. */\n@media (prefers-reduced-motion: reduce) {\n .zds-toggle__piste,\n .zds-toggle__bouton {\n transition: none;\n }\n}\n\n/* ---- Les textes -------------------------------------------------------\n ⚠️ L'ÉCART ENTRE LE LIBELLÉ ET L'AIDE EST NUL EN `sm` ET DE 2 PX EN `md`, et\n l'écart au contrôle vaut 8 puis 12. Mêmes valeurs que la case à cocher, et ce\n n'est pas une hypothèse : les symboles composés les portent tous les deux.\n\n ⚠️ LE LIBELLÉ EST EN GRAISSE NORMALE, PAS EN DEMI-GRAS. C'est le relevé —\n `Body md/Regular` — et ça surprend, parce que beaucoup de bibliothèques\n appuient le libellé d'un interrupteur. Ce qui sépare le libellé de l'aide ici\n est la COULEUR, pas la graisse. */\n.zds-toggle__textes {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n align-items: flex-start;\n min-width: 0;\n font-family: var(--zds-font-family-body);\n font-size: var(--zds-toggle-corps);\n font-weight: var(--zds-font-weight-normal);\n line-height: var(--zds-toggle-interligne);\n}\n\n.zds-toggle--md .zds-toggle__textes {\n gap: var(--zds-space-xxs);\n}\n\n.zds-toggle__libelle {\n color: var(--zds-color-text-primary);\n cursor: pointer;\n}\n\n/* ⚠️ L'AIDE TIENT 3,67 SUR DU BLANC POUR UN SEUIL AA DE 4,50, ET CE N'EST PAS\n LE PROBLÈME DE CE COMPOSANT. Le Figma la peint `text-secondary`, et ce RÔLE\n est navy-70 : il est sous le seuil partout où il porte du texte. Le foncer ici\n seulement rendrait cette aide différente de toutes les autres. Décision de\n fondation, ouverte dans le README. */\n.zds-toggle__aide {\n color: var(--zds-color-text-secondary);\n}\n"],"mappings":"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","names":[]}