/* ==========================================================================
   Feuille de style commune de la formation.
   Toutes les pages (accueil, leçons, fiches de référence) s'y rattachent.

   Langage visuel inspiré de Fluent 2, celui de Windows 11 et de Microsoft 365 :
   surfaces neutres, bleu d'accent, coins de 8 px, relief discret, hiérarchie
   calme. Pensé pour des débutants : contrastes d'au moins 4,5:1, cibles de
   44 px, focus toujours visible, animations réduites sur demande.

   Pour changer l'habillage, modifier les variables des blocs « Couleurs »
   (thème clair, puis thème sombre). Chaque étape a sa teinte (--teinte).
   Aucune ressource externe : polices du système, icônes intégrées ci-dessous.
   ========================================================================== */

:root {
  color-scheme: light dark;

  /* ----- Couleurs, thème clair ----- */
  --fond: #F5F6F8;
  --carte: #FFFFFF;
  --attenue: #F0F1F3;
  --texte: #242424;
  --texte-2: #5C5C5C;
  --filet: #E0E0E0;
  --bordure: #D1D1D1;
  --bordure-forte: #707070;
  --primaire: #0F6CBD;
  --primaire-fonce: #0F6CBD;
  --primaire-tres-fonce: #0C5290;
  --primaire-clair: #EBF3FC;
  --sur-primaire: #FFFFFF;
  --secondaire: #479EF5;
  --bouton: #0F6CBD;
  --bouton-survol: #115EA3;
  --bouton-appui: #0C3B5E;
  --sur-bouton: #FFFFFF;
  --accent: #BC4B09;
  --accent-fonce: #8A3707;
  --accent-clair: #FFF9F5;
  --accent-trait: #FDCFB4;
  --ok: #107C10;
  --ok-fonce: #0E700E;
  --ok-clair: #F1FAF1;
  --ok-trait: #9FD89F;
  --sur-ok: #FFFFFF;
  --ko: #C50F1F;
  --ko-fonce: #B10E1C;
  --ko-clair: #FDF3F4;
  --ko-trait: #EEACB2;
  --sur-ko: #FFFFFF;
  --surlignage: #FFF4B8;
  --selection: #CFE4FA;
  --bandeau: linear-gradient(115deg, #0A2E4E 0%, #0F548C 48%, #0F6CBD 100%);
  --sur-bandeau: #FFFFFF;
  --sur-bandeau-2: #D3E6F8;
  --anneau: #0F6CBD;
  --contour: #E0E0E0;
  --inverse: #1F1F1F;
  --sur-inverse: #FFFFFF;
  --teinte: #0F6CBD;
  --teinte-claire: #EBF3FC;

  /* ----- Relief (trois niveaux) ----- */
  --ombre: 0 0 2px rgba(0, 0, 0, .10), 0 1px 2px rgba(0, 0, 0, .12);
  --ombre-haute: 0 0 2px rgba(0, 0, 0, .10), 0 4px 10px rgba(0, 0, 0, .12);
  --ombre-flottante: 0 0 8px rgba(0, 0, 0, .10), 0 14px 28px rgba(0, 0, 0, .16);

  /* ----- Polices (celles du système : rien n'est téléchargé) ----- */
  --police-texte: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --police-titres: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --police-interface: var(--police-texte);
  --police-code: "Cascadia Mono", Consolas, "Courier New", monospace;

  /* ----- Mesures ----- */
  --mesure: 46rem;
  --large: 68rem;
  --rayon: 8px;
  --rayon-petit: 4px;
  --rapide: 150ms;
  --barre: 3.25rem;

  /* ----- Icônes : Fluent System Icons (Microsoft, licence MIT), voir assets/icones/ ----- */
  /* icones:debut (bloc écrit par outils/icones.js, ne pas modifier à la main) */
  --ic-alerte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.13848 3.70711C10.3664 1.43126 13.6315 1.43104 14.8592 3.70711L21.6024 16.209C22.7697 18.374 21.2016 21.0014 18.742 21.002H5.25469C2.79486 21.0017 1.22681 18.3742 2.39433 16.209L9.13848 3.70711ZM13.5389 4.41902C12.8779 3.1935 11.119 3.19371 10.4578 4.41902L3.71464 16.921C3.08599 18.0867 3.93027 19.5017 5.25469 19.502H18.742C20.0661 19.5014 20.9105 18.0866 20.2821 16.921L13.5389 4.41902ZM11.9998 15.0001C12.5521 15.0001 12.9998 15.4478 12.9998 16.0001C12.9998 16.5523 12.5521 17.0001 11.9998 17.0001C11.4477 16.9999 10.9999 16.5522 10.9998 16.0001C10.9998 15.4479 11.4476 15.0002 11.9998 15.0001ZM11.9998 7.50007C12.414 7.50007 12.7498 7.83586 12.7498 8.25007V12.7501C12.7498 13.1642 12.414 13.5001 11.9998 13.5001C11.5857 13.4999 11.2499 13.1642 11.2498 12.7501V8.25007C11.2498 7.83593 11.5857 7.5002 11.9998 7.50007Z'/%3E%3C/svg%3E");
  --ic-ampoule: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.00098C16.0041 2.00098 19.25 5.24691 19.25 9.25098C19.25 11.347 18.3493 13.2707 16.5869 14.9929C16.51 15.0681 16.4504 15.1586 16.4118 15.2582L16.3804 15.3605L15.2493 20.2561C15.0266 21.22 14.2035 21.9183 13.2302 21.993L13.057 21.9996H10.9433C9.95374 21.9996 9.08791 21.3545 8.79629 20.4228L8.75088 20.2555L7.62132 15.3607C7.58904 15.2208 7.51728 15.0931 7.41456 14.9928C5.73515 13.3526 4.83778 11.5297 4.75613 9.54923L4.75 9.25098L4.75388 9.01166C4.88014 5.11837 8.07601 2.00098 12 2.00098ZM14.115 18.499H9.884L10.2125 19.9182C10.2831 20.2245 10.5357 20.4504 10.8401 20.4925L10.9433 20.4996H13.057C13.3713 20.4996 13.6481 20.3044 13.7577 20.0174L13.7878 19.9184L14.115 18.499ZM12 3.50098C8.89821 3.50098 6.37006 5.95699 6.25415 9.03042L6.25 9.25098L6.25672 9.52799C6.33286 11.0913 7.05722 12.5471 8.46262 13.9197C8.72675 14.1777 8.92265 14.496 9.03422 14.846L9.08291 15.0235L9.538 16.999H14.461L14.9189 15.0228C15.0019 14.6634 15.1718 14.3309 15.4124 14.0539L15.5386 13.9201C16.9432 12.5475 17.6672 11.0916 17.7433 9.52803L17.75 9.25098L17.7458 9.03042C17.6299 5.95699 15.1018 3.50098 12 3.50098Z'/%3E%3C/svg%3E");
  --ic-badge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.2288 5.64234L13.1414 7.495L15.1853 7.79036C15.3946 7.8206 15.4783 8.07783 15.3268 8.22543L13.8485 9.66589L14.1975 11.7013C14.2332 11.9097 14.0144 12.0686 13.8273 11.97L12.0001 11.0076L10.1728 11.97C9.98566 12.0686 9.76674 11.9096 9.80266 11.7011L10.1534 9.66589L8.67339 8.22553C8.52177 8.07798 8.60539 7.82061 8.81478 7.79036L10.8587 7.495L11.7713 5.64234C11.8648 5.45255 12.1354 5.45255 12.2288 5.64234ZM19 9C19 5.13401 15.866 2 12 2C8.13401 2 5 5.13401 5 9C5 10.907 5.76256 12.6359 6.99937 13.8983L7.0008 21.2502L7.00774 21.3547C7.08074 21.8973 7.71499 22.1927 8.18265 21.8634L11.9991 19.1757L15.8175 21.8635L15.907 21.918C16.3926 22.1706 16.9992 21.8221 16.9992 21.2502L17.0006 13.8983C18.2374 12.6359 19 10.907 19 9ZM15.4994 15.0639L15.4992 19.8051L12.4306 17.6452L12.3298 17.5853C12.0866 17.4657 11.7937 17.4857 11.5671 17.6453L8.5008 19.8047L8.50058 15.0639C9.53006 15.6592 10.7252 16 12 16C13.2748 16 14.4699 15.6592 15.4994 15.0639ZM6.5 9C6.5 5.96243 8.96243 3.5 12 3.5C15.0376 3.5 17.5 5.96243 17.5 9C17.5 12.0376 15.0376 14.5 12 14.5C8.96243 14.5 6.5 12.0376 6.5 9Z'/%3E%3C/svg%3E");
  --ic-bouclier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5.75C3 5.33579 3.33579 5 3.75 5C6.41341 5 9.00797 4.05652 11.55 2.15C11.8167 1.95 12.1833 1.95 12.45 2.15C14.992 4.05652 17.5866 5 20.25 5C20.6642 5 21 5.33579 21 5.75V11C21 11.3381 20.9865 11.6701 20.9595 11.9961C20.5062 11.7106 20.0152 11.4795 19.4955 11.3121C19.4985 11.2087 19.5 11.1047 19.5 11V6.47793C16.9227 6.32585 14.4192 5.38829 12 3.67782C9.58084 5.38829 7.07735 6.32585 4.5 6.47793V11C4.5 15.1488 6.83178 18.2214 11.625 20.2846C11.8882 20.839 12.2276 21.3503 12.6297 21.8048C12.5126 21.8531 12.3944 21.9007 12.2749 21.9478C12.0982 22.0174 11.9018 22.0174 11.7251 21.9478C5.95756 19.6757 3 16.0012 3 11V5.75ZM23 17.5C23 20.5376 20.5376 23 17.5 23C14.4624 23 12 20.5376 12 17.5C12 14.4624 14.4624 12 17.5 12C20.5376 12 23 14.4624 23 17.5ZM20.8536 15.1464C20.6583 14.9512 20.3417 14.9512 20.1464 15.1464L16.5 18.7929L14.8536 17.1464C14.6583 16.9512 14.3417 16.9512 14.1464 17.1464C13.9512 17.3417 13.9512 17.6583 14.1464 17.8536L16.1464 19.8536C16.3417 20.0488 16.6583 20.0488 16.8536 19.8536L20.8536 15.8536C21.0488 15.6583 21.0488 15.3417 20.8536 15.1464Z'/%3E%3C/svg%3E");
  --ic-boussole: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 16.6944 7.30558 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM7.08301 8.70801C6.67677 7.68861 7.68762 6.67797 8.70703 7.08398L8.91309 7.16602L12.6592 8.59082C13.9277 9.07301 14.93 10.075 15.4121 11.3438L15.5742 11.7715L17.1973 15.5557C17.6416 16.5927 16.5927 17.6415 15.5557 17.1973L11.7988 15.5869L11.3428 15.4141C10.0743 14.9319 9.072 13.9298 8.58984 12.6611L7.20898 9.02539L7.08301 8.70801ZM10.082 12.1807C10.4017 12.9827 11.0277 13.6247 11.8213 13.9648L12.3428 14.1875L15.3184 15.3203L14.1768 12.3174L13.9648 11.8213C13.6248 11.0278 12.9826 10.4017 12.1807 10.082L8.69238 8.69238L10.082 12.1807Z'/%3E%3C/svg%3E");
  --ic-cadenas: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1C14.7614 1 17 3.23858 17 6V8.00977C18.6781 8.13743 20 9.5392 20 11.25V18.75C20 20.5449 18.5449 22 16.75 22H7.25C5.45507 22 4 20.5449 4 18.75V11.25C4 9.5392 5.3219 8.13743 7 8.00977V6C7 3.23858 9.23858 1 12 1ZM7.25 9.5C6.2835 9.5 5.5 10.2835 5.5 11.25V18.75C5.5 19.7165 6.2835 20.5 7.25 20.5H16.75C17.7165 20.5 18.5 19.7165 18.5 18.75V11.25C18.5 10.2835 17.7165 9.5 16.75 9.5H7.25ZM12 13.75C12.6904 13.75 13.25 14.3096 13.25 15C13.25 15.6904 12.6904 16.25 12 16.25C11.3096 16.25 10.75 15.6904 10.75 15C10.75 14.3096 11.3096 13.75 12 13.75ZM12 2.5C10.067 2.5 8.5 4.067 8.5 6V8H15.5V6C15.5 4.067 13.933 2.5 12 2.5Z'/%3E%3C/svg%3E");
  --ic-calcul: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7C7 5.89543 7.89543 5 9 5H15C16.1046 5 17 5.89543 17 7V8C17 9.10457 16.1046 10 15 10H9C7.89543 10 7 9.10457 7 8V7ZM9 6.5C8.72386 6.5 8.5 6.72386 8.5 7V8C8.5 8.27614 8.72386 8.5 9 8.5H15C15.2761 8.5 15.5 8.27614 15.5 8V7C15.5 6.72386 15.2761 6.5 15 6.5H9ZM8.25 14.5C8.94036 14.5 9.5 13.9404 9.5 13.25C9.5 12.5596 8.94036 12 8.25 12C7.55964 12 7 12.5596 7 13.25C7 13.9404 7.55964 14.5 8.25 14.5ZM9.5 17.25C9.5 17.9404 8.94036 18.5 8.25 18.5C7.55964 18.5 7 17.9404 7 17.25C7 16.5596 7.55964 16 8.25 16C8.94036 16 9.5 16.5596 9.5 17.25ZM15.75 14.5C16.4404 14.5 17 13.9404 17 13.25C17 12.5596 16.4404 12 15.75 12C15.0596 12 14.5 12.5596 14.5 13.25C14.5 13.9404 15.0596 14.5 15.75 14.5ZM17 17.25C17 17.9404 16.4404 18.5 15.75 18.5C15.0596 18.5 14.5 17.9404 14.5 17.25C14.5 16.5596 15.0596 16 15.75 16C16.4404 16 17 16.5596 17 17.25ZM12 14.5C12.6904 14.5 13.25 13.9404 13.25 13.25C13.25 12.5596 12.6904 12 12 12C11.3096 12 10.75 12.5596 10.75 13.25C10.75 13.9404 11.3096 14.5 12 14.5ZM13.25 17.25C13.25 17.9404 12.6904 18.5 12 18.5C11.3096 18.5 10.75 17.9404 10.75 17.25C10.75 16.5596 11.3096 16 12 16C12.6904 16 13.25 16.5596 13.25 17.25ZM7.25 2C5.45507 2 4 3.45507 4 5.25V18.75C4 20.5449 5.45507 22 7.25 22H16.75C18.5449 22 20 20.5449 20 18.75V5.25C20 3.45507 18.5449 2 16.75 2H7.25ZM5.5 5.25C5.5 4.2835 6.2835 3.5 7.25 3.5H16.75C17.7165 3.5 18.5 4.2835 18.5 5.25V18.75C18.5 19.7165 17.7165 20.5 16.75 20.5H7.25C6.2835 20.5 5.5 19.7165 5.5 18.75V5.25Z'/%3E%3C/svg%3E");
  --ic-calendrier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.5 12C20.5376 12 23 14.4624 23 17.5C23 20.5376 20.5376 23 17.5 23C14.4624 23 12 20.5376 12 17.5C12 14.4624 14.4624 12 17.5 12ZM17.75 3C19.5449 3 21 4.45507 21 6.25L21.0012 12.0226C20.5378 11.7258 20.0342 11.4861 19.5004 11.3136L19.5 8.5H4.5V17.75C4.5 18.7165 5.2835 19.5 6.25 19.5L11.3136 19.5004C11.4861 20.0342 11.7258 20.5378 12.0226 21.0012L6.25 21C4.45507 21 3 19.5449 3 17.75V6.25C3 4.45507 4.45507 3 6.25 3H17.75ZM16.984 14.0455L16.9446 14.1441L16.3876 15.9311H14.5851C14.0527 15.9311 13.813 16.5995 14.1682 16.9671L14.2418 17.0323L15.7001 18.1368L15.1431 19.9238C14.978 20.4535 15.5181 20.8989 15.9641 20.6548L16.0417 20.6044L17.5 19.5L18.9583 20.6044C19.3905 20.9318 19.9638 20.534 19.8789 20.0163L19.8569 19.9238L19.2999 18.1368L20.7582 17.0323C21.1889 16.7061 21.0059 16.0185 20.5113 15.9387L20.4149 15.9311H18.6124L18.0554 14.1441C17.8915 13.6183 17.2123 13.5854 16.984 14.0455ZM17.75 4.5H6.25C5.2835 4.5 4.5 5.2835 4.5 6.25V7H19.5V6.25C19.5 5.2835 18.7165 4.5 17.75 4.5Z'/%3E%3C/svg%3E");
  --ic-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.21967 8.46967C4.51256 8.17678 4.98744 8.17678 5.28033 8.46967L12 15.1893L18.7197 8.46967C19.0126 8.17678 19.4874 8.17678 19.7803 8.46967C20.0732 8.76256 20.0732 9.23744 19.7803 9.53033L12.5303 16.7803C12.2374 17.0732 11.7626 17.0732 11.4697 16.7803L4.21967 9.53033C3.92678 9.23744 3.92678 8.76256 4.21967 8.46967Z'/%3E%3C/svg%3E");
  --ic-cible: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.9982 14.0002C13.1027 14.0002 13.9982 13.1047 13.9982 12.0002C13.9982 10.8956 13.1027 10.0002 11.9982 10.0002C10.8936 10.0002 9.99817 10.8956 9.99817 12.0002C9.99817 13.1047 10.8936 14.0002 11.9982 14.0002ZM5.99817 12.0002C5.99817 8.68644 8.68446 6.00015 11.9982 6.00015C15.3119 6.00015 17.9982 8.68644 17.9982 12.0002C17.9982 15.3139 15.3119 18.0002 11.9982 18.0002C8.68446 18.0002 5.99817 15.3139 5.99817 12.0002ZM11.9982 7.50015C9.51289 7.50015 7.49817 9.51487 7.49817 12.0002C7.49817 14.4854 9.51289 16.5002 11.9982 16.5002C14.4834 16.5002 16.4982 14.4854 16.4982 12.0002C16.4982 9.51487 14.4834 7.50015 11.9982 7.50015ZM1.99609 12.0001C1.99609 6.47614 6.47419 1.99805 11.9982 1.99805C17.5222 1.99805 22.0003 6.47614 22.0003 12.0001C22.0003 17.5242 17.5222 22.0022 11.9982 22.0022C6.47419 22.0022 1.99609 17.5242 1.99609 12.0001ZM11.9982 3.49805C7.30261 3.49805 3.49609 7.30457 3.49609 12.0001C3.49609 16.6957 7.30261 20.5022 11.9982 20.5022C16.6938 20.5022 20.5003 16.6957 20.5003 12.0001C20.5003 7.30457 16.6938 3.49805 11.9982 3.49805Z'/%3E%3C/svg%3E");
  --ic-clavier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.7454 5C20.988 5 21.9954 6.00736 21.9954 7.25V16.7546C21.9954 17.9972 20.988 19.0046 19.7454 19.0046H4.25C3.00736 19.0046 2 17.9972 2 16.7546V7.25C2 6.00736 3.00736 5 4.25 5H19.7454ZM19.7454 6.5H4.25C3.83579 6.5 3.5 6.83579 3.5 7.25V16.7546C3.5 17.1688 3.83579 17.5046 4.25 17.5046H19.7454C20.1596 17.5046 20.4954 17.1688 20.4954 16.7546V7.25C20.4954 6.83579 20.1596 6.5 19.7454 6.5ZM6.75 14.5H17.25C17.6642 14.5 18 14.8358 18 15.25C18 15.6297 17.7178 15.9435 17.3518 15.9932L17.25 16H6.75C6.33579 16 6 15.6642 6 15.25C6 14.8703 6.28215 14.5565 6.64823 14.5068L6.75 14.5H17.25H6.75ZM16.5 11C17.0523 11 17.5 11.4477 17.5 12C17.5 12.5523 17.0523 13 16.5 13C15.9477 13 15.5 12.5523 15.5 12C15.5 11.4477 15.9477 11 16.5 11ZM10.5049 11C11.0572 11 11.5049 11.4477 11.5049 12C11.5049 12.5523 11.0572 13 10.5049 13C9.95259 13 9.50488 12.5523 9.50488 12C9.50488 11.4477 9.95259 11 10.5049 11ZM7.50488 11C8.05716 11 8.50488 11.4477 8.50488 12C8.50488 12.5523 8.05716 13 7.50488 13C6.95259 13 6.50488 12.5523 6.50488 12C6.50488 11.4477 6.95259 11 7.50488 11ZM13.5049 11C14.0572 11 14.5049 11.4477 14.5049 12C14.5049 12.5523 14.0572 13 13.5049 13C12.9526 13 12.5049 12.5523 12.5049 12C12.5049 11.4477 12.9526 11 13.5049 11ZM6 8C6.55228 8 7 8.44772 7 9C7 9.55228 6.55228 10 6 10C5.44772 10 5 9.55228 5 9C5 8.44772 5.44772 8 6 8ZM8.99512 8C9.54741 8 9.99512 8.44772 9.99512 9C9.99512 9.55228 9.54741 10 8.99512 10C8.44284 10 7.99512 9.55228 7.99512 9C7.99512 8.44772 8.44284 8 8.99512 8ZM11.9951 8C12.5474 8 12.9951 8.44772 12.9951 9C12.9951 9.55228 12.5474 10 11.9951 10C11.4428 10 10.9951 9.55228 10.9951 9C10.9951 8.44772 11.4428 8 11.9951 8ZM14.9951 8C15.5474 8 15.9951 8.44772 15.9951 9C15.9951 9.55228 15.5474 10 14.9951 10C14.4428 10 13.9951 9.55228 13.9951 9C13.9951 8.44772 14.4428 8 14.9951 8ZM17.9951 8C18.5474 8 18.9951 8.44772 18.9951 9C18.9951 9.55228 18.5474 10 17.9951 10C17.4428 10 16.9951 9.55228 16.9951 9C16.9951 8.44772 17.4428 8 17.9951 8Z'/%3E%3C/svg%3E");
  --ic-coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.53033 12.9697C4.23744 12.6768 3.76256 12.6768 3.46967 12.9697C3.17678 13.2626 3.17678 13.7374 3.46967 14.0303L7.96967 18.5303C8.26256 18.8232 8.73744 18.8232 9.03033 18.5303L20.0303 7.53033C20.3232 7.23744 20.3232 6.76256 20.0303 6.46967C19.7374 6.17678 19.2626 6.17678 18.9697 6.46967L8.5 16.9393L4.53033 12.9697Z'/%3E%3C/svg%3E");
  --ic-concentration: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 5.75C4.5 5.05964 5.05964 4.5 5.75 4.5H7.75C8.16421 4.5 8.5 4.16421 8.5 3.75C8.5 3.33579 8.16421 3 7.75 3H5.75C4.23122 3 3 4.23122 3 5.75V7.75C3 8.16421 3.33579 8.5 3.75 8.5C4.16421 8.5 4.5 8.16421 4.5 7.75V5.75ZM4.5 18.25C4.5 18.9404 5.05964 19.5 5.75 19.5H7.75C8.16421 19.5 8.5 19.8358 8.5 20.25C8.5 20.6642 8.16421 21 7.75 21H5.75C4.23122 21 3 19.7688 3 18.25V16.25C3 15.8358 3.33579 15.5 3.75 15.5C4.16421 15.5 4.5 15.8358 4.5 16.25V18.25ZM18.25 4.5C18.9404 4.5 19.5 5.05964 19.5 5.75V7.75C19.5 8.16421 19.8358 8.5 20.25 8.5C20.6642 8.5 21 8.16421 21 7.75V5.75C21 4.23122 19.7688 3 18.25 3H16.25C15.8358 3 15.5 3.33579 15.5 3.75C15.5 4.16421 15.8358 4.5 16.25 4.5H18.25ZM19.5 18.25C19.5 18.9404 18.9404 19.5 18.25 19.5H16.25C15.8358 19.5 15.5 19.8358 15.5 20.25C15.5 20.6642 15.8358 21 16.25 21H18.25C19.7688 21 21 19.7688 21 18.25V16.25C21 15.8358 20.6642 15.5 20.25 15.5C19.8358 15.5 19.5 15.8358 19.5 16.25V18.25Z'/%3E%3C/svg%3E");
  --ic-courrier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.25 4H18.75C20.483 4 21.8992 5.35645 21.9949 7.06558L22 7.25V16.75C22 18.483 20.6435 19.8992 18.9344 19.9949L18.75 20H5.25C3.51697 20 2.10075 18.6435 2.00514 16.9344L2 16.75V7.25C2 5.51697 3.35645 4.10075 5.06558 4.00514L5.25 4H18.75H5.25ZM20.5 9.373L12.3493 13.6637C12.1619 13.7623 11.9431 13.7764 11.7468 13.706L11.6507 13.6637L3.5 9.374V16.75C3.5 17.6682 4.20711 18.4212 5.10647 18.4942L5.25 18.5H18.75C19.6682 18.5 20.4212 17.7929 20.4942 16.8935L20.5 16.75V9.373ZM18.75 5.5H5.25C4.33183 5.5 3.57881 6.20711 3.5058 7.10647L3.5 7.25V7.679L12 12.1525L20.5 7.678V7.25C20.5 6.33183 19.7929 5.57881 18.8935 5.5058L18.75 5.5Z'/%3E%3C/svg%3E");
  --ic-croix: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.39705 4.55379L4.46967 4.46967C4.73594 4.2034 5.1526 4.1792 5.44621 4.39705L5.53033 4.46967L12 10.939L18.4697 4.46967C18.7626 4.17678 19.2374 4.17678 19.5303 4.46967C19.8232 4.76256 19.8232 5.23744 19.5303 5.53033L13.061 12L19.5303 18.4697C19.7966 18.7359 19.8208 19.1526 19.6029 19.4462L19.5303 19.5303C19.2641 19.7966 18.8474 19.8208 18.5538 19.6029L18.4697 19.5303L12 13.061L5.53033 19.5303C5.23744 19.8232 4.76256 19.8232 4.46967 19.5303C4.17678 19.2374 4.17678 18.7626 4.46967 18.4697L10.939 12L4.46967 5.53033C4.2034 5.26406 4.1792 4.8474 4.39705 4.55379L4.46967 4.46967L4.39705 4.55379Z'/%3E%3C/svg%3E");
  --ic-discussion: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C10.3817 22 8.81782 21.6146 7.41286 20.888L3.58704 21.9553C2.92212 22.141 2.23258 21.7525 2.04691 21.0876C1.98546 20.8676 1.98549 20.6349 2.04695 20.4151L3.11461 16.5922C2.38637 15.186 2 13.6203 2 12C2 6.47715 6.47715 2 12 2ZM12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 13.4696 3.87277 14.8834 4.57303 16.1375L4.72368 16.4072L3.61096 20.3914L7.59755 19.2792L7.86709 19.4295C9.12006 20.1281 10.5322 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM8.75 13H13.2483C13.6625 13 13.9983 13.3358 13.9983 13.75C13.9983 14.1297 13.7161 14.4435 13.35 14.4932L13.2483 14.5H8.75C8.33579 14.5 8 14.1642 8 13.75C8 13.3703 8.28215 13.0565 8.64823 13.0068L8.75 13H13.2483H8.75ZM8.75 9.5H15.2545C15.6687 9.5 16.0045 9.83579 16.0045 10.25C16.0045 10.6297 15.7223 10.9435 15.3563 10.9932L15.2545 11H8.75C8.33579 11 8 10.6642 8 10.25C8 9.8703 8.28215 9.55651 8.64823 9.50685L8.75 9.5H15.2545H8.75Z'/%3E%3C/svg%3E");
  --ic-document: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.75 11.5C8.33579 11.5 8 11.8358 8 12.25C8 12.6642 8.33579 13 8.75 13H15.25C15.6642 13 16 12.6642 16 12.25C16 11.8358 15.6642 11.5 15.25 11.5H8.75ZM8.75 14.25C8.33579 14.25 8 14.5858 8 15C8 15.4142 8.33579 15.75 8.75 15.75H15.25C15.6642 15.75 16 15.4142 16 15C16 14.5858 15.6642 14.25 15.25 14.25H8.75ZM8.75 17C8.33579 17 8 17.3358 8 17.75C8 18.1642 8.33579 18.5 8.75 18.5H15.25C15.6642 18.5 16 18.1642 16 17.75C16 17.3358 15.6642 17 15.25 17H8.75ZM13.585 2.586L19.414 8.414C19.789 8.789 20 9.298 20 9.828V20C20 21.104 19.104 22 18 22H6C4.896 22 4 21.104 4 20V4C4 2.896 4.896 2 6 2H12.172C12.6865 2 13.2194 2.22035 13.585 2.586ZM18 20.5C18.276 20.5 18.5 20.275 18.5 20V10H14C12.896 10 12 9.104 12 8V3.5H6C5.724 3.5 5.5 3.725 5.5 4V20C5.5 20.275 5.724 20.5 6 20.5H18ZM17.378 8.5L13.5 4.621V8C13.5 8.275 13.724 8.5 14 8.5H17.378Z'/%3E%3C/svg%3E");
  --ic-dossier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 6.25V8H8.12868C8.32759 8 8.51836 7.92098 8.65901 7.78033L10.1893 6.25L8.65901 4.71967C8.51836 4.57902 8.32759 4.5 8.12868 4.5H5.25C4.2835 4.5 3.5 5.2835 3.5 6.25ZM2 6.25C2 4.45507 3.45507 3 5.25 3H8.12868C8.72542 3 9.29771 3.23705 9.71967 3.65901L11.5607 5.5H18.75C20.5449 5.5 22 6.95507 22 8.75V17.75C22 19.5449 20.5449 21 18.75 21H5.25C3.45507 21 2 19.5449 2 17.75V6.25ZM3.5 9.5V17.75C3.5 18.7165 4.2835 19.5 5.25 19.5H18.75C19.7165 19.5 20.5 18.7165 20.5 17.75V8.75C20.5 7.7835 19.7165 7 18.75 7H11.5607L9.71967 8.84099C9.29771 9.26295 8.72542 9.5 8.12868 9.5H3.5Z'/%3E%3C/svg%3E");
  --ic-eclair: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.42505 2.83052C7.60245 2.33254 8.07392 2 8.60256 2H15.0562C15.9094 2 16.5118 2.83587 16.242 3.64528L14.7905 8H18.7492C19.8534 8 20.4153 9.32683 19.647 10.1198L8.586 21.536C7.53226 22.6236 5.71405 21.6422 6.04495 20.1645L7.31418 14.4964L5.74573 14.4904C4.53898 14.4858 3.69895 13.2899 4.10392 12.1532L7.42505 2.83052ZM8.77889 3.5L5.51693 12.6565C5.45908 12.8189 5.57909 12.9898 5.75148 12.9904L8.25277 13C8.47997 13.0009 8.69453 13.1047 8.83621 13.2823C8.97789 13.4599 9.03142 13.6922 8.98177 13.9139L7.50871 20.4923L18.1589 9.5H13.7499C13.5088 9.5 13.2824 9.38411 13.1415 9.18853C13.0005 8.99296 12.9622 8.74154 13.0384 8.51283L14.7093 3.5H8.77889Z'/%3E%3C/svg%3E");
  --ic-etoile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.7878 3.10215C11.283 2.09877 12.7138 2.09876 13.209 3.10215L15.567 7.87987L20.8395 8.64601C21.9468 8.80691 22.3889 10.1677 21.5877 10.9487L17.7724 14.6676L18.6731 19.9189C18.8622 21.0217 17.7047 21.8627 16.7143 21.342L11.9984 18.8627L7.28252 21.342C6.29213 21.8627 5.13459 21.0217 5.32374 19.9189L6.2244 14.6676L2.40916 10.9487C1.60791 10.1677 2.05005 8.80691 3.15735 8.64601L8.42988 7.87987L10.7878 3.10215ZM11.9984 4.03854L9.74008 8.61443C9.54344 9.01288 9.16332 9.28904 8.72361 9.35294L3.67382 10.0867L7.32788 13.6486C7.64606 13.9587 7.79125 14.4055 7.71614 14.8435L6.85353 19.8729L11.3702 17.4983C11.7635 17.2915 12.2333 17.2915 12.6266 17.4983L17.1433 19.8729L16.2807 14.8435C16.2056 14.4055 16.3508 13.9587 16.6689 13.6486L20.323 10.0867L15.2732 9.35294C14.8335 9.28904 14.4534 9.01288 14.2568 8.61443L11.9984 4.03854Z'/%3E%3C/svg%3E");
  --ic-etoile-pleine: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.7878 3.10215C11.283 2.09877 12.7138 2.09876 13.209 3.10215L15.567 7.87987L20.8395 8.64601C21.9468 8.80691 22.3889 10.1677 21.5877 10.9487L17.7724 14.6676L18.6731 19.9189C18.8622 21.0217 17.7047 21.8627 16.7143 21.342L11.9984 18.8627L7.28252 21.342C6.29213 21.8627 5.13459 21.0217 5.32374 19.9189L6.2244 14.6676L2.40916 10.9487C1.60791 10.1677 2.05005 8.80691 3.15735 8.64601L8.42988 7.87987L10.7878 3.10215Z'/%3E%3C/svg%3E");
  --ic-fenetre: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.25 3C4.45507 3 3 4.45507 3 6.25V17.75C3 19.5449 4.45507 21 6.25 21H17.75C19.5449 21 21 19.5449 21 17.75V6.25C21 4.45507 19.5449 3 17.75 3H6.25ZM19.5 7H4.5V6.25C4.5 5.2835 5.2835 4.5 6.25 4.5H17.75C18.7165 4.5 19.5 5.2835 19.5 6.25V7ZM4.5 8.5H19.5V17.75C19.5 18.7165 18.7165 19.5 17.75 19.5H6.25C5.2835 19.5 4.5 18.7165 4.5 17.75V8.5Z'/%3E%3C/svg%3E");
  --ic-feu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.5383 4.29449C12.8615 4.05075 13.182 3.86356 13.4688 3.73169C13.5555 5.85881 14.5955 7.45829 15.5965 8.87109C15.6881 9.00031 15.779 9.12767 15.8688 9.25354C16.9522 10.7721 17.8801 12.0725 17.9813 13.794C18.0979 15.7759 17.6036 17.4514 16.6453 18.6176C15.6986 19.7696 14.2385 20.5 12.25 20.5C10.1887 20.5 8.6396 19.9712 7.55849 19.0843C6.48244 18.2015 5.79472 16.9026 5.56502 15.2123C5.33902 13.5492 5.74149 12.3672 6.17625 11.6092C6.26176 11.4601 6.34906 11.3266 6.43394 11.2084L6.74894 11.8066C7.29998 12.8532 8.57839 13.2789 9.64684 12.7716C10.9525 12.1516 11.2311 10.5595 10.8165 9.4416C10.5264 8.65954 10.3721 7.70456 10.7077 6.74841C11.084 5.67629 11.7985 4.85253 12.5383 4.29449ZM6.15636 9.3231L6.15395 9.32491L6.15 9.3279L6.13963 9.33586C6.13164 9.34204 6.12151 9.34999 6.10942 9.35973C6.08524 9.37919 6.05314 9.40581 6.01442 9.43966C5.93703 9.50732 5.83284 9.6042 5.71236 9.73104C5.47171 9.98437 5.16368 10.3598 4.8751 10.8629C4.29291 11.8779 3.80368 13.3906 4.07868 15.4142C4.34997 17.4107 5.18833 19.0801 6.60711 20.244C8.02084 21.4038 9.93533 22 12.25 22C14.6375 22 16.5425 21.1054 17.8042 19.5699C19.0544 18.0486 19.6122 15.9741 19.4787 13.706C19.3508 11.5302 18.1656 9.87945 17.1188 8.42123C17.0177 8.28043 16.9179 8.14142 16.8205 8.00391C15.6785 6.39222 14.7768 4.90657 14.9959 2.82863C15.0182 2.61721 14.9497 2.40625 14.8075 2.24824C14.6652 2.09023 14.4626 2 14.25 2C13.868 2 13.4309 2.11822 13.0077 2.29599C12.5715 2.47923 12.0984 2.74751 11.6351 3.09694C10.7104 3.79438 9.78589 4.84563 9.29236 6.25159C8.80006 7.65408 9.04947 8.99089 9.41008 9.9632C9.64689 10.6017 9.39005 11.233 9.00347 11.4165C8.66159 11.5789 8.25252 11.4427 8.07619 11.1078L7.26887 9.57452C7.16673 9.38052 6.98481 9.24093 6.77099 9.19248C6.55717 9.14403 6.33215 9.19209 6.15636 9.3231Z'/%3E%3C/svg%3E");
  --ic-fleche-droite: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.2673 4.20889C12.9674 3.9232 12.4926 3.93475 12.2069 4.23467C11.9212 4.5346 11.9328 5.00933 12.2327 5.29502L18.4841 11.2496H3.75C3.33579 11.2496 3 11.5854 3 11.9996C3 12.4138 3.33579 12.7496 3.75 12.7496H18.4842L12.2327 18.7043C11.9328 18.99 11.9212 19.4648 12.2069 19.7647C12.4926 20.0646 12.9674 20.0762 13.2673 19.7905L20.6862 12.7238C20.8551 12.5629 20.9551 12.3576 20.9861 12.1443C20.9952 12.0975 21 12.0491 21 11.9996C21 11.9501 20.9952 11.9016 20.986 11.8547C20.955 11.6415 20.855 11.4364 20.6862 11.2756L13.2673 4.20889Z'/%3E%3C/svg%3E");
  --ic-fleche-gauche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.7327 19.7905C11.0326 20.0762 11.5074 20.0646 11.7931 19.7647C12.0788 19.4648 12.0672 18.99 11.7673 18.7043L5.51587 12.7497L20.25 12.7497C20.6642 12.7497 21 12.4139 21 11.9997C21 11.5855 20.6642 11.2497 20.25 11.2497L5.51577 11.2497L11.7673 5.29502C12.0672 5.00933 12.0787 4.5346 11.7931 4.23467C11.5074 3.93475 11.0326 3.9232 10.7327 4.20889L3.31379 11.2756C3.14486 11.4365 3.04491 11.6417 3.01393 11.8551C3.00479 11.9019 3 11.9503 3 11.9997C3 12.0493 3.00481 12.0977 3.01398 12.1446C3.04502 12.3579 3.14496 12.563 3.31379 12.7238L10.7327 19.7905Z'/%3E%3C/svg%3E");
  --ic-horloge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 12C3.5 7.30558 7.30558 3.5 12 3.5C16.6944 3.5 20.5 7.30558 20.5 12C20.5 16.6944 16.6944 20.5 12 20.5C7.30558 20.5 3.5 16.6944 3.5 12ZM12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2ZM11.9931 6.64827C11.9435 6.28233 11.6295 6 11.25 6C10.836 6 10.5 6.336 10.5 6.75V12.75L10.5069 12.8517C10.5565 13.2177 10.8705 13.5 11.25 13.5H15.25L15.3517 13.4931C15.7177 13.4435 16 13.1295 16 12.75C16 12.336 15.664 12 15.25 12H12V6.75L11.9931 6.64827Z'/%3E%3C/svg%3E");
  --ic-imprimer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15.7525 3C16.9951 3 18.0025 4.00736 18.0025 5.25L18.002 6.003L18.7525 6.00358C20.5469 6.00533 22.0011 7.45877 22.0038 9.25244L22.0071 15.2497C22.009 16.4918 21.0021 17.5002 19.7591 17.5009L18 17.5V18.75C18 19.9926 16.9926 21 15.75 21H8.25C7.00736 21 6 19.9926 6 18.75L6.00091 17.5L4.25 17.5001C3.00736 17.5001 2 16.4927 2 15.2501V9.25358C2 7.45865 3.45507 6.00358 5.25 6.00358L5.999 6.003L6 5.25C6 4.00736 7.00736 3 8.25 3H15.7525ZM15.75 13.5H8.25C7.83579 13.5 7.5 13.8358 7.5 14.25V18.75C7.5 19.1642 7.83579 19.5 8.25 19.5H15.75C16.1642 19.5 16.5 19.1642 16.5 18.75V14.25C16.5 13.8358 16.1642 13.5 15.75 13.5ZM18.7518 7.50358H5.25C4.2835 7.50358 3.5 8.28708 3.5 9.25358V15.2501C3.5 15.6643 3.83579 16.0001 4.25 16.0001L6 16V14.25C6 13.0074 7.00736 12 8.25 12H15.75C16.9926 12 18 13.0074 18 14.25L18.0009 16.0001L19.7827 16.0005C20.1855 15.9874 20.5077 15.6567 20.5071 15.2512L20.5038 9.25398C20.5024 8.28801 19.7185 7.50452 18.7518 7.50358ZM15.7525 4.5H8.25C7.83579 4.5 7.5 4.83579 7.5 5.25L7.499 6.003H16.502L16.5025 5.25C16.5025 4.83579 16.1667 4.5 15.7525 4.5Z'/%3E%3C/svg%3E");
  --ic-jeux: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.9979 5C18.8639 5 21.9979 8.13401 21.9979 12C21.9979 15.7855 18.9931 18.8691 15.2385 18.9959L14.9979 19H9.00211C5.13611 19 2.00211 15.866 2.00211 12C2.00211 8.21455 5.00689 5.1309 8.76146 5.00406L9.00211 5H14.9979ZM14.9979 6.5H9.00211C5.96454 6.5 3.50211 8.96243 3.50211 12C3.50211 14.9635 5.84589 17.3795 8.7809 17.4956L9.00211 17.5H14.9979C18.0354 17.5 20.4979 15.0376 20.4979 12C20.4979 9.03652 18.1541 6.62046 15.2191 6.50437L14.9979 6.5ZM7.99999 9C8.4142 9 8.74999 9.33579 8.74999 9.75L8.74911 11.248L10.25 11.2487C10.6642 11.2487 11 11.5845 11 11.9987C11 12.413 10.6642 12.7487 10.25 12.7487L8.74911 12.748L8.74999 14.25C8.74999 14.6642 8.4142 15 7.99999 15C7.58578 15 7.24999 14.6642 7.24999 14.25L7.24911 12.748L5.74999 12.7487C5.33578 12.7487 4.99999 12.413 4.99999 11.9987C4.99999 11.5845 5.33578 11.2487 5.74999 11.2487L7.24911 11.248L7.24999 9.75C7.24999 9.33579 7.58578 9 7.99999 9ZM14.75 12.5C15.4403 12.5 16 13.0596 16 13.75C16 14.4404 15.4403 15 14.75 15C14.0596 15 13.5 14.4404 13.5 13.75C13.5 13.0596 14.0596 12.5 14.75 12.5ZM16.75 9C17.4403 9 18 9.55964 18 10.25C18 10.9404 17.4403 11.5 16.75 11.5C16.0596 11.5 15.5 10.9404 15.5 10.25C15.5 9.55964 16.0596 9 16.75 9Z'/%3E%3C/svg%3E");
  --ic-lecture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.60846 4.61489C7.1087 4.34296 6.5 4.70472 6.5 5.27368V18.726C6.5 19.2949 7.1087 19.6567 7.60846 19.3848L19.97 12.6586C20.4921 12.3746 20.4921 11.6251 19.97 11.341L7.60846 4.61489ZM5 5.27368C5 3.56682 6.82609 2.48151 8.32538 3.2973L20.687 10.0235C22.2531 10.8756 22.2531 13.124 20.687 13.9762L8.32538 20.7024C6.82609 21.5181 5 20.4328 5 18.726V5.27368Z'/%3E%3C/svg%3E");
  --ic-liste: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.78033 4.78033C7.07322 4.48744 7.07322 4.01256 6.78033 3.71967C6.48744 3.42678 6.01256 3.42678 5.71967 3.71967L3.75 5.68934L3.28033 5.21967C2.98744 4.92678 2.51256 4.92678 2.21967 5.21967C1.92678 5.51256 1.92678 5.98744 2.21967 6.28033L3.21967 7.28033C3.51256 7.57322 3.98744 7.57322 4.28033 7.28033L6.78033 4.78033ZM21.25 18.0068H9.75L9.64823 18.0137C9.28215 18.0634 9 18.3772 9 18.7568C9 19.1711 9.33579 19.5068 9.75 19.5068H21.25L21.3518 19.5C21.7178 19.4503 22 19.1365 22 18.7568C22 18.3426 21.6642 18.0068 21.25 18.0068ZM21.25 11.5H9.75L9.64823 11.5068C9.28215 11.5565 9 11.8703 9 12.25C9 12.6642 9.33579 13 9.75 13H21.25L21.3518 12.9932C21.7178 12.9435 22 12.6297 22 12.25C22 11.8358 21.6642 11.5 21.25 11.5ZM21.25 5H9.75L9.64823 5.00685C9.28215 5.05651 9 5.3703 9 5.75C9 6.16421 9.33579 6.5 9.75 6.5H21.25L21.3518 6.49315C21.7178 6.44349 22 6.1297 22 5.75C22 5.33579 21.6642 5 21.25 5ZM6.78033 17.7803C7.07322 17.4874 7.07322 17.0126 6.78033 16.7197C6.48744 16.4268 6.01256 16.4268 5.71967 16.7197L3.75 18.6893L3.28033 18.2197C2.98744 17.9268 2.51256 17.9268 2.21967 18.2197C1.92678 18.5126 1.92678 18.9874 2.21967 19.2803L3.21967 20.2803C3.51256 20.5732 3.98744 20.5732 4.28033 20.2803L6.78033 17.7803ZM6.78033 10.2197C7.07322 10.5126 7.07322 10.9874 6.78033 11.2803L4.28033 13.7803C3.98744 14.0732 3.51256 14.0732 3.21967 13.7803L2.21967 12.7803C1.92678 12.4874 1.92678 12.0126 2.21967 11.7197C2.51256 11.4268 2.98744 11.4268 3.28033 11.7197L3.75 12.1893L5.71967 10.2197C6.01256 9.92678 6.48744 9.92678 6.78033 10.2197Z'/%3E%3C/svg%3E");
  --ic-livre: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 19.1375C11.4986 19.6686 10.788 20 10 20H3.75C2.7835 20 2 19.2165 2 18.25V5.75C2 4.7835 2.7835 4 3.75 4H10C10.788 4 11.4986 4.33145 12 4.86253C12.5014 4.33145 13.212 4 14 4H20.25C21.2165 4 22 4.7835 22 5.75V18.25C22 19.2165 21.2165 20 20.25 20H14C13.212 20 12.5014 19.6686 12 19.1375ZM3.5 5.75V18.25C3.5 18.3881 3.61193 18.5 3.75 18.5H10C10.6904 18.5 11.25 17.9404 11.25 17.25V6.75C11.25 6.05964 10.6904 5.5 10 5.5H3.75C3.61193 5.5 3.5 5.61193 3.5 5.75ZM12.75 17.25C12.75 17.9404 13.3096 18.5 14 18.5H20.25C20.3881 18.5 20.5 18.3881 20.5 18.25V5.75C20.5 5.61193 20.3881 5.5 20.25 5.5H14C13.3096 5.5 12.75 6.05964 12.75 6.75V17.25Z'/%3E%3C/svg%3E");
  --ic-maison: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5495 2.53189C11.3874 1.82531 12.6126 1.82531 13.4505 2.5319L20.2005 8.224C20.7074 8.65152 21 9.2809 21 9.94406L21 19.2539C21 20.2204 20.2165 21.0039 19.25 21.0039H15.75C14.7835 21.0039 14 20.2204 14 19.2539L14 14.2468C14 14.1088 13.8881 13.9968 13.75 13.9968H10.25C10.1119 13.9968 9.99999 14.1088 9.99999 14.2468L9.99999 19.2539C9.99999 20.2204 9.2165 21.0039 8.25 21.0039H4.75C3.7835 21.0039 3 20.2204 3 19.2539V9.94406C3 9.2809 3.29255 8.65152 3.79952 8.224L10.5495 2.53189ZM12.4835 3.6786C12.2042 3.44307 11.7958 3.44307 11.5165 3.6786L4.76651 9.37071C4.59752 9.51321 4.5 9.72301 4.5 9.94406L4.5 19.2539C4.5 19.392 4.61193 19.5039 4.75 19.5039H8.25C8.38807 19.5039 8.49999 19.392 8.49999 19.2539L8.49999 14.2468C8.49999 13.2803 9.2835 12.4968 10.25 12.4968H13.75C14.7165 12.4968 15.5 13.2803 15.5 14.2468L15.5 19.2539C15.5 19.392 15.6119 19.5039 15.75 19.5039H19.25C19.3881 19.5039 19.5 19.392 19.5 19.2539L19.5 9.94406C19.5 9.72301 19.4025 9.51321 19.2335 9.37071L12.4835 3.6786Z'/%3E%3C/svg%3E");
  --ic-minuteur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5C16.6944 5 20.5 8.80558 20.5 13.5C20.5 18.1944 16.6944 22 12 22C7.30558 22 3.5 18.1944 3.5 13.5C3.5 8.80558 7.30558 5 12 5ZM12 6.5C8.13401 6.5 5 9.63401 5 13.5C5 17.366 8.13401 20.5 12 20.5C15.866 20.5 19 17.366 19 13.5C19 9.63401 15.866 6.5 12 6.5ZM12 8C12.3797 8 12.6935 8.28215 12.7432 8.64823L12.75 8.75V13.25C12.75 13.6642 12.4142 14 12 14C11.6203 14 11.3065 13.7178 11.2568 13.3518L11.25 13.25V8.75C11.25 8.33579 11.5858 8 12 8ZM19.1472 5.11371L19.2298 5.17355L20.3882 6.13773C20.7066 6.40272 20.7498 6.87562 20.4849 7.19398C20.2419 7.48581 19.8243 7.54649 19.5112 7.35047L19.4286 7.29063L18.2702 6.32645C17.9518 6.06146 17.9086 5.58856 18.1735 5.2702C18.4165 4.97837 18.8341 4.91769 19.1472 5.11371ZM14.25 2.5C14.6642 2.5 15 2.83579 15 3.25C15 3.6297 14.7178 3.94349 14.3518 3.99315L14.25 4H9.75C9.33579 4 9 3.66421 9 3.25C9 2.8703 9.28215 2.55651 9.64823 2.50685L9.75 2.5H14.25Z'/%3E%3C/svg%3E");
  --ic-muet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.9195 3.31534C13.7255 2.59866 15 3.17089 15 4.24951V19.7451C15 20.8238 13.7255 21.396 12.9194 20.6792L8.42793 16.6855C8.29063 16.5634 8.11329 16.496 7.92956 16.496H4.25C3.00736 16.496 2 15.4886 2 14.246V9.7481C2 8.50546 3.00736 7.4981 4.25 7.4981H7.92961C8.11333 7.4981 8.29065 7.43067 8.42794 7.30861L12.9195 3.31534ZM13.5 4.8063L9.4246 8.42962C9.01272 8.79581 8.48075 8.9981 7.92961 8.9981H4.25C3.83579 8.9981 3.5 9.33388 3.5 9.7481V14.246C3.5 14.6602 3.83579 14.996 4.25 14.996H7.92956C8.48074 14.996 9.01275 15.1983 9.42465 15.5646L13.5 19.1883V4.8063ZM16.2197 9.2192C16.5126 8.9263 16.9874 8.9263 17.2803 9.2192L19 10.9389L20.7197 9.2192C21.0126 8.9263 21.4874 8.9263 21.7803 9.2192C22.0732 9.51209 22.0732 9.98696 21.7803 10.2799L20.0607 11.9995L21.7803 13.7192C22.0732 14.0121 22.0732 14.487 21.7803 14.7799C21.4874 15.0728 21.0126 15.0728 20.7197 14.7799L19 13.0602L17.2803 14.7799C16.9874 15.0728 16.5126 15.0728 16.2197 14.7799C15.9268 14.487 15.9268 14.0121 16.2197 13.7192L17.9393 11.9995L16.2197 10.2799C15.9268 9.98696 15.9268 9.51209 16.2197 9.2192Z'/%3E%3C/svg%3E");
  --ic-navigation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.75254 17.9997H21.2525C21.6668 17.9997 22.0025 18.3355 22.0025 18.7497C22.0025 19.1294 21.7204 19.4432 21.3543 19.4928L21.2525 19.4997H2.75254C2.33832 19.4997 2.00254 19.1639 2.00254 18.7497C2.00254 18.37 2.28469 18.0562 2.65077 18.0065L2.75254 17.9997H21.2525H2.75254ZM2.75254 11.5027H21.2525C21.6668 11.5027 22.0025 11.8385 22.0025 12.2527C22.0025 12.6324 21.7204 12.9462 21.3543 12.9959L21.2525 13.0027H2.75254C2.33832 13.0027 2.00254 12.6669 2.00254 12.2527C2.00254 11.873 2.28469 11.5592 2.65077 11.5095L2.75254 11.5027H21.2525H2.75254ZM2.75168 5.00293H21.2517C21.6659 5.00293 22.0017 5.33872 22.0017 5.75293C22.0017 6.13263 21.7195 6.44642 21.3535 6.49608L21.2517 6.50293H2.75168C2.33746 6.50293 2.00168 6.16714 2.00168 5.75293C2.00168 5.37323 2.28383 5.05944 2.64991 5.00978L2.75168 5.00293H21.2517H2.75168Z'/%3E%3C/svg%3E");
  --ic-nuage: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5.5C9.58676 5.5 7.61684 7.39994 7.50502 9.78512C7.48627 10.1852 7.15641 10.5 6.75585 10.5H6.5C4.84315 10.5 3.5 11.8431 3.5 13.5C3.5 15.1569 4.84315 16.5 6.5 16.5H17.5C19.1569 16.5 20.5 15.1569 20.5 13.5C20.5 11.8431 19.1569 10.5 17.5 10.5H17.2442C16.8436 10.5 16.5137 10.1852 16.495 9.78512C16.3832 7.39994 14.4132 5.5 12 5.5ZM6.07981 9.01936C6.54808 6.17188 9.02022 4 12 4C14.9798 4 17.4519 6.17189 17.9202 9.01936C20.2085 9.23125 22 11.1564 22 13.5C22 15.9853 19.9853 18 17.5 18H6.5C4.01472 18 2 15.9853 2 13.5C2 11.1564 3.79155 9.23125 6.07981 9.01936Z'/%3E%3C/svg%3E");
  --ic-oeil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.9999 9.00462C14.209 9.00462 15.9999 10.7955 15.9999 13.0046C15.9999 15.2138 14.209 17.0046 11.9999 17.0046C9.79073 17.0046 7.99987 15.2138 7.99987 13.0046C7.99987 10.7955 9.79073 9.00462 11.9999 9.00462ZM11.9999 10.5046C10.6192 10.5046 9.49987 11.6239 9.49987 13.0046C9.49987 14.3853 10.6192 15.5046 11.9999 15.5046C13.3806 15.5046 14.4999 14.3853 14.4999 13.0046C14.4999 11.6239 13.3806 10.5046 11.9999 10.5046ZM11.9999 5.5C16.6134 5.5 20.596 8.65001 21.701 13.0644C21.8016 13.4662 21.5574 13.8735 21.1556 13.9741C20.7537 14.0746 20.3465 13.8305 20.2459 13.4286C19.307 9.67796 15.9212 7 11.9999 7C8.07681 7 4.68997 9.68026 3.75273 13.4332C3.65237 13.835 3.24523 14.0794 2.84336 13.9791C2.44149 13.8787 2.19707 13.4716 2.29743 13.0697C3.40052 8.65272 7.38436 5.5 11.9999 5.5Z'/%3E%3C/svg%3E");
  --ic-ordinateur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.75 22.0004C6.33579 22.0004 6 21.6647 6 21.2504C6 20.8707 6.28215 20.557 6.64823 20.5073L6.75 20.5004L8.499 20.5V18.002L4.25 18.0023C3.05914 18.0023 2.08436 17.0771 2.00519 15.9063L2 15.7523V5.25C2 4.05914 2.92516 3.08436 4.09595 3.00519L4.25 3H19.7488C20.9397 3 21.9145 3.92516 21.9936 5.09595L21.9988 5.25V15.7523C21.9988 16.9431 21.0737 17.9179 19.9029 17.9971L19.7488 18.0023L15.499 18.002V20.5L17.25 20.5004C17.6642 20.5004 18 20.8362 18 21.2504C18 21.6301 17.7178 21.9439 17.3518 21.9936L17.25 22.0004H6.75ZM13.998 18.002H9.998L9.999 20.5004H13.999L13.998 18.002ZM19.7488 4.5H4.25C3.8703 4.5 3.55651 4.78215 3.50685 5.14823L3.5 5.25V15.7523C3.5 16.132 3.78215 16.4458 4.14823 16.4954L4.25 16.5023H19.7488C20.1285 16.5023 20.4423 16.2201 20.492 15.854L20.4988 15.7523V5.25C20.4988 4.8703 20.2167 4.55651 19.8506 4.50685L19.7488 4.5Z'/%3E%3C/svg%3E");
  --ic-ouvrir: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.24992 4.5C5.28344 4.5 4.49996 5.2835 4.49996 6.25V17.75C4.49996 18.7165 5.28344 19.5 6.24992 19.5H17.7496C18.7161 19.5 19.4996 18.7165 19.4996 17.75V13.75C19.4996 13.3358 19.8354 13 20.2496 13C20.6638 13 20.9995 13.3358 20.9995 13.75V17.75C20.9995 19.5449 19.5445 21 17.7496 21H6.24992C4.45504 21 3 19.5449 3 17.75V6.25C3 4.45507 4.45504 3 6.24992 3H10.2498C10.664 3 10.9998 3.33579 10.9998 3.75C10.9998 4.16421 10.664 4.5 10.2498 4.5H6.24992ZM12.9997 3.75C12.9997 3.33579 13.3355 3 13.7497 3H20.25C20.6642 3 21 3.33579 21 3.75V10.25C21 10.6642 20.6642 11 20.25 11C19.8358 11 19.5 10.6642 19.5 10.25V5.56074L14.28 10.7804C13.9871 11.0732 13.5123 11.0732 13.2194 10.7803C12.9265 10.4874 12.9265 10.0125 13.2194 9.71964L18.4395 4.5H13.7497C13.3355 4.5 12.9997 4.16421 12.9997 3.75Z'/%3E%3C/svg%3E");
  --ic-pause: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.25 3C5.00736 3 4 4.00736 4 5.25V18.75C4 19.9926 5.00736 21 6.25 21H8.75C9.99264 21 11 19.9926 11 18.75V5.25C11 4.00736 9.99264 3 8.75 3H6.25ZM5.5 5.25C5.5 4.83579 5.83579 4.5 6.25 4.5H8.75C9.16421 4.5 9.5 4.83579 9.5 5.25V18.75C9.5 19.1642 9.16421 19.5 8.75 19.5H6.25C5.83579 19.5 5.5 19.1642 5.5 18.75V5.25ZM15.25 3C14.0074 3 13 4.00736 13 5.25V18.75C13 19.9926 14.0074 21 15.25 21H17.75C18.9926 21 20 19.9926 20 18.75V5.25C20 4.00736 18.9926 3 17.75 3H15.25ZM14.5 5.25C14.5 4.83579 14.8358 4.5 15.25 4.5H17.75C18.1642 4.5 18.5 4.83579 18.5 5.25V18.75C18.5 19.1642 18.1642 19.5 17.75 19.5H15.25C14.8358 19.5 14.5 19.1642 14.5 18.75V5.25Z'/%3E%3C/svg%3E");
  --ic-presentation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.75 8C6.33579 8 6 8.33579 6 8.75C6 9.16421 6.33579 9.5 6.75 9.5H11.25C11.6642 9.5 12 9.16421 12 8.75C12 8.33579 11.6642 8 11.25 8H6.75ZM6 11.75C6 11.3358 6.33579 11 6.75 11H15.25C15.6642 11 16 11.3358 16 11.75C16 12.1642 15.6642 12.5 15.25 12.5H6.75C6.33579 12.5 6 12.1642 6 11.75ZM6.75 14C6.33579 14 6 14.3358 6 14.75C6 15.1642 6.33579 15.5 6.75 15.5H13.25C13.6642 15.5 14 15.1642 14 14.75C14 14.3358 13.6642 14 13.25 14H6.75ZM4.75 4C3.23122 4 2 5.23122 2 6.75V17.25C2 18.7688 3.23122 20 4.75 20H19.25C20.7688 20 22 18.7688 22 17.25V6.75C22 5.23122 20.7688 4 19.25 4H4.75ZM3.5 6.75C3.5 6.05964 4.05964 5.5 4.75 5.5H19.25C19.9404 5.5 20.5 6.05964 20.5 6.75V17.25C20.5 17.9404 19.9404 18.5 19.25 18.5H4.75C4.05964 18.5 3.5 17.9404 3.5 17.25V6.75Z'/%3E%3C/svg%3E");
  --ic-question: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C17.523 2 22 6.478 22 12C22 17.522 17.523 22 12 22C6.477 22 2 17.522 2 12C2 6.478 6.477 2 12 2ZM12 3.667C7.405 3.667 3.667 7.405 3.667 12C3.667 16.595 7.405 20.333 12 20.333C16.595 20.333 20.333 16.595 20.333 12C20.333 7.405 16.595 3.667 12 3.667ZM12 15.5C12.5523 15.5 13 15.9477 13 16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5C11 15.9477 11.4477 15.5 12 15.5ZM12 6.75C13.5188 6.75 14.75 7.98122 14.75 9.5C14.75 10.5108 14.4525 11.074 13.6989 11.8586L13.5303 12.0303C12.9084 12.6522 12.75 12.9163 12.75 13.5C12.75 13.9142 12.4142 14.25 12 14.25C11.5858 14.25 11.25 13.9142 11.25 13.5C11.25 12.4892 11.5475 11.926 12.3011 11.1414L12.4697 10.9697C13.0916 10.3478 13.25 10.0837 13.25 9.5C13.25 8.80964 12.6904 8.25 12 8.25C11.3528 8.25 10.8205 8.74187 10.7565 9.37219L10.75 9.5C10.75 9.91421 10.4142 10.25 10 10.25C9.58579 10.25 9.25 9.91421 9.25 9.5C9.25 7.98122 10.4812 6.75 12 6.75Z'/%3E%3C/svg%3E");
  --ic-rappel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.5C16.1421 4.5 19.5 7.85786 19.5 12C19.5 16.1421 16.1421 19.5 12 19.5C7.85786 19.5 4.5 16.1421 4.5 12C4.5 11.6236 4.52772 11.2538 4.58123 10.8923C4.64845 10.4382 4.31609 10 3.85708 10C3.48623 10 3.161 10.2562 3.10471 10.6228C3.03576 11.0718 3 11.5317 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C9.69494 3 7.59227 3.86656 6 5.29168V4.25C6 3.83579 5.66421 3.5 5.25 3.5C4.83579 3.5 4.5 3.83579 4.5 4.25V7.25C4.5 7.66421 4.83579 8 5.25 8H8.25C8.66421 8 9 7.66421 9 7.25C9 6.83579 8.66421 6.5 8.25 6.5H6.90093C8.23907 5.25883 10.0309 4.5 12 4.5ZM12.5 7.75C12.5 7.33579 12.1642 7 11.75 7C11.3358 7 11 7.33579 11 7.75V12.25C11 12.6642 11.3358 13 11.75 13H14.75C15.1642 13 15.5 12.6642 15.5 12.25C15.5 11.8358 15.1642 11.5 14.75 11.5H12.5V7.75Z'/%3E%3C/svg%3E");
  --ic-recommencer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.5C16.1421 4.5 19.5 7.85786 19.5 12C19.5 16.1421 16.1421 19.5 12 19.5C7.85786 19.5 4.5 16.1421 4.5 12C4.5 11.6236 4.52772 11.2538 4.58123 10.8923C4.64845 10.4382 4.31609 10 3.85708 10C3.48623 10 3.161 10.2562 3.10471 10.6228C3.03576 11.0718 3 11.5317 3 12C3 16.9706 7.02944 21 12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C9.69494 3 7.59227 3.86656 6 5.29168V4.25C6 3.83579 5.66421 3.5 5.25 3.5C4.83579 3.5 4.5 3.83579 4.5 4.25V7.25C4.5 7.66421 4.83579 8 5.25 8H8.25C8.66421 8 9 7.66421 9 7.25C9 6.83579 8.66421 6.5 8.25 6.5H6.90093C8.23907 5.25883 10.0309 4.5 12 4.5Z'/%3E%3C/svg%3E");
  --ic-signet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.19094 21.8547C5.6948 22.2117 5.00293 21.8571 5.00293 21.2459V6.25C5.00293 4.45507 6.458 3 8.25293 3H15.7513C17.5462 3 19.0013 4.45507 19.0013 6.25V21.2459C19.0013 21.8571 18.3094 22.2117 17.8133 21.8547L12.0021 17.6738L6.19094 21.8547ZM17.5013 6.25C17.5013 5.2835 16.7178 4.5 15.7513 4.5H8.25293C7.28643 4.5 6.50293 5.2835 6.50293 6.25V19.7824L11.5641 16.141C11.8258 15.9528 12.1785 15.9528 12.4401 16.141L17.5013 19.7824V6.25Z'/%3E%3C/svg%3E");
  --ic-son: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 4.24951C15 3.17089 13.7255 2.59866 12.9195 3.31534L8.42794 7.30861C8.29065 7.43067 8.11333 7.4981 7.92961 7.4981H4.25C3.00736 7.4981 2 8.50546 2 9.7481V14.246C2 15.4886 3.00736 16.496 4.25 16.496H7.92956C8.11329 16.496 8.29063 16.5634 8.42793 16.6855L12.9194 20.6792C13.7255 21.396 15 20.8238 15 19.7451V4.24951ZM9.4246 8.42962L13.5 4.8063V19.1883L9.42465 15.5646C9.01275 15.1983 8.48074 14.996 7.92956 14.996H4.25C3.83579 14.996 3.5 14.6602 3.5 14.246V9.7481C3.5 9.33388 3.83579 8.9981 4.25 8.9981H7.92961C8.48075 8.9981 9.01272 8.79581 9.4246 8.42962ZM18.9916 5.89684C19.3244 5.6503 19.7941 5.72028 20.0407 6.05313C21.2717 7.71521 22 9.77341 22 11.9995C22 14.2256 21.2717 16.2838 20.0407 17.9459C19.7941 18.2788 19.3244 18.3488 18.9916 18.1022C18.6587 17.8557 18.5888 17.386 18.8353 17.0531C19.8815 15.6406 20.5 13.8934 20.5 11.9995C20.5 10.1057 19.8815 8.35848 18.8353 6.94592C18.5888 6.61307 18.6587 6.14338 18.9916 5.89684ZM17.143 8.36884C17.5072 8.17165 17.9624 8.30709 18.1596 8.67135C18.6958 9.66196 19 10.7963 19 11.9995C19 13.2027 18.6958 14.3371 18.1596 15.3277C17.9624 15.6919 17.5072 15.8274 17.143 15.6302C16.7787 15.433 16.6432 14.9778 16.8404 14.6136C17.2609 13.8368 17.5 12.9472 17.5 11.9995C17.5 11.0518 17.2609 10.1622 16.8404 9.38544C16.6432 9.02118 16.7787 8.56603 17.143 8.36884Z'/%3E%3C/svg%3E");
  --ic-sortir: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 3.75C8.5 3.33579 8.16421 3 7.75 3C7.33579 3 7 3.33579 7 3.75V6.25C7 6.66421 6.66421 7 6.25 7H3.75C3.33579 7 3 7.33579 3 7.75C3 8.16421 3.33579 8.5 3.75 8.5H6.25C7.49264 8.5 8.5 7.49264 8.5 6.25V3.75ZM8.5 20.25C8.5 20.6642 8.16421 21 7.75 21C7.33579 21 7 20.6642 7 20.25V17.75C7 17.3358 6.66421 17 6.25 17H3.75C3.33579 17 3 16.6642 3 16.25C3 15.8358 3.33579 15.5 3.75 15.5H6.25C7.49264 15.5 8.5 16.5074 8.5 17.75V20.25ZM16.25 3C15.8358 3 15.5 3.33579 15.5 3.75V6.25C15.5 7.49264 16.5074 8.5 17.75 8.5H20.25C20.6642 8.5 21 8.16421 21 7.75C21 7.33579 20.6642 7 20.25 7H17.75C17.3358 7 17 6.66421 17 6.25V3.75C17 3.33579 16.6642 3 16.25 3ZM15.5 20.25C15.5 20.6642 15.8358 21 16.25 21C16.6642 21 17 20.6642 17 20.25V17.75C17 17.3358 17.3358 17 17.75 17H20.25C20.6642 17 21 16.6642 21 16.25C21 15.8358 20.6642 15.5 20.25 15.5H17.75C16.5074 15.5 15.5 16.5074 15.5 17.75V20.25Z'/%3E%3C/svg%3E");
  --ic-souris: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.25 2C9.66421 2 10 2.33579 10 2.75V5.25C10 5.66421 9.66421 6 9.25 6C8.83579 6 8.5 5.66421 8.5 5.25V2.75C8.5 2.33579 8.83579 2 9.25 2ZM4.46965 3.96981C4.76253 3.67691 5.23741 3.67689 5.53031 3.96977L7.28031 5.71965C7.57322 6.01253 7.57323 6.48741 7.28035 6.78031C6.98747 7.07322 6.51259 7.07323 6.21969 6.78035L4.46969 5.03047C4.17678 4.73759 4.17677 4.26271 4.46965 3.96981ZM14.0303 3.96979C14.3232 4.26269 14.3232 4.73756 14.0303 5.03045L12.2803 6.78045C11.9874 7.07335 11.5126 7.07335 11.2197 6.78045C10.9268 6.48756 10.9268 6.01269 11.2197 5.71979L12.9697 3.96979C13.2626 3.6769 13.7374 3.6769 14.0303 3.96979ZM2.5 8.75C2.5 8.33579 2.83579 8 3.25 8H5.75C6.16421 8 6.5 8.33579 6.5 8.75C6.5 9.16421 6.16421 9.5 5.75 9.5H3.25C2.83579 9.5 2.5 9.16421 2.5 8.75ZM10.6773 8.48562C9.82176 7.75227 8.5 8.36019 8.5 9.48706V20.7608C8.5 21.9715 9.99462 22.5426 10.8019 21.6403L13.4165 18.7181C13.6918 18.4104 14.0801 18.2274 14.4927 18.2109L18.3327 18.0573C19.5304 18.0094 20.0484 16.518 19.1384 15.7379L10.6773 8.48562ZM10 20.287V9.88067L17.8123 16.5769L14.4327 16.7121C13.6146 16.7448 12.8446 17.1077 12.2986 17.7179L10 20.287Z'/%3E%3C/svg%3E");
  --ic-tableur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6.25C3 4.45507 4.45507 3 6.25 3H17.75C19.5449 3 21 4.45507 21 6.25V17.75C21 19.5449 19.5449 21 17.75 21H6.25C4.45507 21 3 19.5449 3 17.75V6.25ZM6.25 4.5C5.2835 4.5 4.5 5.2835 4.5 6.25V8.5H8.5V4.5H6.25ZM4.5 10V14H8.5L8.5 10H4.5ZM10 10L10 14H14L14 10H10ZM15.5 10L15.5 14H19.5V10H15.5ZM14 15.5H10V19.5H14V15.5ZM15.5 19.5H17.75C18.7165 19.5 19.5 18.7165 19.5 17.75V15.5H15.5V19.5ZM15.5 8.5H19.5V6.25C19.5 5.2835 18.7165 4.5 17.75 4.5H15.5V8.5ZM14 4.5H10V8.5H14V4.5ZM4.5 15.5V17.75C4.5 18.7165 5.2835 19.5 6.25 19.5H8.5V15.5H4.5Z'/%3E%3C/svg%3E");
  --ic-trophee: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15.2536 2C16.4119 2 17.3657 2.87524 17.4899 4.00044L18.7576 4C19.6758 4 20.4288 4.70711 20.5018 5.60647L20.5076 5.75V8.75C20.5076 10.483 19.1512 11.8992 17.4421 11.9949L17.2318 12.0007C16.564 14.0909 14.7334 15.6615 12.5007 15.9517L12.5001 17.5H14.2536C15.9866 17.5 17.4028 18.8565 17.4984 20.5656L17.5036 20.75V21.25C17.5036 21.6297 17.2214 21.9435 16.8554 21.9932L16.7536 22H6.75056C6.37086 22 6.05707 21.7178 6.00741 21.3518L6.00056 21.25V20.75C6.00056 19.017 7.35702 17.6008 9.06614 17.5051L9.25056 17.5H11.0001L11.0004 15.9513C8.76915 15.6601 6.93987 14.09 6.27235 12.0007L6.24609 12C4.45117 12 2.99609 10.5449 2.99609 8.75V5.75C2.99609 4.7835 3.7796 4 4.74609 4L6.01424 4.00044C6.13841 2.87524 7.09227 2 8.25056 2H15.2536ZM14.2536 19H9.25056C8.4208 19 7.72592 19.5775 7.54591 20.3525L7.51828 20.5H15.9859C15.8717 19.7018 15.2189 19.0774 14.4075 19.0067L14.2536 19ZM15.2536 3.5H8.25056C7.83635 3.5 7.50056 3.83579 7.50056 4.25V10.2485C7.50056 12.5965 9.40403 14.5 11.7521 14.5C14.1001 14.5 16.0036 12.5965 16.0036 10.2485V4.25C16.0036 3.83579 15.6678 3.5 15.2536 3.5ZM18.7576 5.5H17.5036V10.4829C18.3036 10.3703 18.93 9.71683 19.0009 8.90415L19.0076 8.75V5.75C19.0076 5.63165 18.9254 5.53251 18.815 5.5066L18.7576 5.5ZM6.00056 5.5H4.74609C4.60802 5.5 4.49609 5.61193 4.49609 5.75V8.75C4.49609 9.63317 5.15031 10.3635 6.00056 10.4829V5.5Z'/%3E%3C/svg%3E");
  --ic-valide: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 16.6944 7.30558 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM10.75 13.4393L15.2197 8.96967C15.5126 8.67678 15.9874 8.67678 16.2803 8.96967C16.5466 9.23594 16.5708 9.6526 16.3529 9.94621L16.2803 10.0303L11.2803 15.0303C11.0141 15.2966 10.5974 15.3208 10.3038 15.1029L10.2197 15.0303L7.71967 12.5303C7.42678 12.2374 7.42678 11.7626 7.71967 11.4697C7.98594 11.2034 8.4026 11.1792 8.69621 11.3971L8.78033 11.4697L10.75 13.4393L15.2197 8.96967L10.75 13.4393Z'/%3E%3C/svg%3E");
  /* icones:fin */
}

/* ----- Couleurs, thème sombre : suit le réglage de Windows, à l'écran seulement ----- */
@media screen and (prefers-color-scheme: dark) {
  :root {
    --fond: #1F1F1F;
    --carte: #292929;
    --attenue: #333333;
    --texte: #FFFFFF;
    --texte-2: #B8B8B8;
    --filet: #3D3D3D;
    --bordure: #525252;
    --bordure-forte: #ADADAD;
    --primaire: #479EF5;
    --primaire-fonce: #62ABF5;
    --primaire-tres-fonce: #96C6FA;
    --primaire-clair: #0E2E4D;
    --sur-primaire: #061724;
    --secondaire: #115EA3;
    --bouton: #115EA3;
    --bouton-survol: #0F6CBD;
    --bouton-appui: #0C3B5E;
    --sur-bouton: #FFFFFF;
    --accent: #FAA06B;
    --accent-fonce: #FBB48B;
    --accent-clair: #3B1E0B;
    --accent-trait: #8A3707;
    --ok: #54B054;
    --ok-fonce: #7BC77B;
    --ok-clair: #0B2A0B;
    --ok-trait: #107C10;
    --sur-ok: #052505;
    --ko: #DC626D;
    --ko-fonce: #E8858E;
    --ko-clair: #3B0A0F;
    --ko-trait: #960B18;
    --sur-ko: #2B0509;
    --surlignage: #4D4000;
    --selection: #0E4775;
    --bandeau: linear-gradient(115deg, #0A1B2B 0%, #0C3B5E 55%, #115EA3 100%);
    --sur-bandeau: #FFFFFF;
    --sur-bandeau-2: #C7E0F4;
    --anneau: #62ABF5;
    --contour: #3D3D3D;
    --inverse: #F5F5F5;
    --sur-inverse: #1F1F1F;
    --teinte: #62ABF5;
    --teinte-claire: #0E2E4D;
    --ombre: 0 0 2px rgba(0, 0, 0, .30), 0 1px 2px rgba(0, 0, 0, .36);
    --ombre-haute: 0 0 2px rgba(0, 0, 0, .30), 0 4px 10px rgba(0, 0, 0, .40);
    --ombre-flottante: 0 0 8px rgba(0, 0, 0, .30), 0 14px 28px rgba(0, 0, 0, .50);
  }
}

/* ----- Une teinte par étape : --teinte (texte, icônes) sur --teinte-claire (fond) ----- */
[data-etape="1"]  { --teinte: #03787C; --teinte-claire: #E5F2F3; }
[data-etape="2"]  { --teinte: #0F6CBD; --teinte-claire: #EBF3FC; }
[data-etape="3"]  { --teinte: #C50F1F; --teinte-claire: #FDF3F4; }
[data-etape="4"]  { --teinte: #3B52C4; --teinte-claire: #EEF1FD; }
[data-etape="5"]  { --teinte: #0027B4; --teinte-claire: #E6EAF8; }
[data-etape="6"]  { --teinte: #5C2E91; --teinte-claire: #F1ECF7; }
[data-etape="7"]  { --teinte: #107C10; --teinte-claire: #F1FAF1; }
[data-etape="8"]  { --teinte: #A8420D; --teinte-claire: #FDF2EB; }
[data-etape="9"]  { --teinte: #A52C98; --teinte-claire: #FBEEF9; }
[data-etape="10"] { --teinte: #835B00; --teinte-claire: #FDF6E3; }
@media screen and (prefers-color-scheme: dark) {
  [data-etape="1"]  { --teinte: #58D3DB; --teinte-claire: #05393B; }
  [data-etape="2"]  { --teinte: #62ABF5; --teinte-claire: #0E2E4D; }
  [data-etape="3"]  { --teinte: #F1707B; --teinte-claire: #3B0A0F; }
  [data-etape="4"]  { --teinte: #93A4F4; --teinte-claire: #17214D; }
  [data-etape="5"]  { --teinte: #8C9FF0; --teinte-claire: #0D1A4A; }
  [data-etape="6"]  { --teinte: #C6B1DE; --teinte-claire: #2B1545; }
  [data-etape="7"]  { --teinte: #7BC77B; --teinte-claire: #0B2A0B; }
  [data-etape="8"]  { --teinte: #F4975F; --teinte-claire: #3D1805; }
  [data-etape="9"]  { --teinte: #E48AD7; --teinte-claire: #3A1136; }
  [data-etape="10"] { --teinte: #F2C661; --teinte-claire: #3D2E00; }
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

/* 18 px quand le navigateur est à sa taille par défaut ; suit le réglage de l'utilisateur sinon. */
html { font-size: 112.5%; -webkit-text-size-adjust: 100%; scroll-padding-top: 7.5rem; }

body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font-family: var(--police-texte);
  line-height: 1.6;
}

/* ---------- Icônes ---------- */

.ic, .bloc:is(.objectif, .pratique, .retenir, .attention, .astuce, .usage, .source) > :is(h2, h3)::before,
details.rappel > summary::before, .exercice > .titre-ex::before, .quiz .verdict::before {
  content: "";
  display: inline-block;
  flex: none;
  width: 1.25em;
  height: 1.25em;
  vertical-align: -.25em;
  background-color: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
  mask: var(--i) center / contain no-repeat;
}
/* icones:classes:debut (bloc écrit par outils/icones.js) */
.ic-alerte { --i: var(--ic-alerte); }
.ic-ampoule { --i: var(--ic-ampoule); }
.ic-badge { --i: var(--ic-badge); }
.ic-bouclier { --i: var(--ic-bouclier); }
.ic-boussole { --i: var(--ic-boussole); }
.ic-cadenas { --i: var(--ic-cadenas); }
.ic-calcul { --i: var(--ic-calcul); }
.ic-calendrier { --i: var(--ic-calendrier); }
.ic-chevron { --i: var(--ic-chevron); }
.ic-cible { --i: var(--ic-cible); }
.ic-clavier { --i: var(--ic-clavier); }
.ic-coche { --i: var(--ic-coche); }
.ic-concentration { --i: var(--ic-concentration); }
.ic-courrier { --i: var(--ic-courrier); }
.ic-croix { --i: var(--ic-croix); }
.ic-discussion { --i: var(--ic-discussion); }
.ic-document { --i: var(--ic-document); }
.ic-dossier { --i: var(--ic-dossier); }
.ic-eclair { --i: var(--ic-eclair); }
.ic-etoile { --i: var(--ic-etoile); }
.ic-etoile-pleine { --i: var(--ic-etoile-pleine); }
.ic-fenetre { --i: var(--ic-fenetre); }
.ic-feu { --i: var(--ic-feu); }
.ic-fleche-droite { --i: var(--ic-fleche-droite); }
.ic-fleche-gauche { --i: var(--ic-fleche-gauche); }
.ic-horloge { --i: var(--ic-horloge); }
.ic-imprimer { --i: var(--ic-imprimer); }
.ic-jeux { --i: var(--ic-jeux); }
.ic-lecture { --i: var(--ic-lecture); }
.ic-liste { --i: var(--ic-liste); }
.ic-livre { --i: var(--ic-livre); }
.ic-maison { --i: var(--ic-maison); }
.ic-minuteur { --i: var(--ic-minuteur); }
.ic-muet { --i: var(--ic-muet); }
.ic-navigation { --i: var(--ic-navigation); }
.ic-nuage { --i: var(--ic-nuage); }
.ic-oeil { --i: var(--ic-oeil); }
.ic-ordinateur { --i: var(--ic-ordinateur); }
.ic-ouvrir { --i: var(--ic-ouvrir); }
.ic-pause { --i: var(--ic-pause); }
.ic-presentation { --i: var(--ic-presentation); }
.ic-question { --i: var(--ic-question); }
.ic-rappel { --i: var(--ic-rappel); }
.ic-recommencer { --i: var(--ic-recommencer); }
.ic-signet { --i: var(--ic-signet); }
.ic-son { --i: var(--ic-son); }
.ic-sortir { --i: var(--ic-sortir); }
.ic-souris { --i: var(--ic-souris); }
.ic-tableur { --i: var(--ic-tableur); }
.ic-trophee { --i: var(--ic-trophee); }
.ic-valide { --i: var(--ic-valide); }
/* icones:classes:fin */

/* ---------- Texte courant ---------- */

h1, h2, h3, h4 { font-family: var(--police-titres); line-height: 1.25; font-weight: 600; text-wrap: balance; }
h1 { font-size: 2rem; margin: 0 0 .6rem; letter-spacing: -.01em; }
h2 { font-size: 1.4rem; margin: 2.6rem 0 .8rem; }
h3 { font-size: 1.1rem; margin: 1.8rem 0 .5rem; }
p { margin: 0 0 1rem; }
ul, ol { margin: 0 0 1rem; padding-left: 1.4rem; }
li { margin-bottom: .35rem; }
strong { font-weight: 600; }
a { color: var(--primaire-fonce); text-underline-offset: .18em; transition: color var(--rapide), background-color var(--rapide), border-color var(--rapide); }
a:hover { color: var(--primaire-tres-fonce); }
hr { border: 0; border-top: 1px solid var(--filet); margin: 2.5rem 0; }
img, svg { max-width: 100%; height: auto; }

:focus-visible { outline: 2px solid var(--anneau); outline-offset: 2px; border-radius: var(--rayon-petit); }

/* Lien d'évitement : premier arrêt du clavier, visible seulement quand il a le focus */
.evitement {
  position: absolute; left: .6rem; top: -5rem; z-index: 60;
  padding: .7rem 1rem; background: var(--carte); color: var(--texte); font-weight: 600;
  border: 2px solid var(--anneau); border-radius: var(--rayon-petit);
}
.evitement:focus { top: .6rem; }

/* Un mot nouveau, défini dans le glossaire */
a.terme { color: inherit; text-decoration: underline dotted var(--primaire); text-decoration-thickness: 2px; }
a.terme:hover { background: var(--primaire-clair); }

mark { background: var(--surlignage); color: inherit; padding: 0 .15em; border-radius: 2px; }

/* Touches du clavier : <kbd>Ctrl</kbd> + <kbd>C</kbd> */
kbd {
  display: inline-block;
  min-width: 1.9em;
  padding: .05em .5em .1em;
  font: 600 .8em var(--police-interface);
  text-align: center;
  white-space: nowrap;
  color: var(--texte);
  background: var(--carte);
  border: 1px solid var(--bordure);
  border-bottom: 2px solid var(--bordure-forte);
  border-radius: var(--rayon-petit);
}

/* Ce qu'on tape ou ce qu'on lit à l'écran */
code, .saisie {
  font-family: var(--police-code);
  font-size: .88em;
  background: var(--attenue);
  border: 1px solid var(--filet);
  border-radius: var(--rayon-petit);
  padding: .05em .35em;
  white-space: normal;
  overflow-wrap: anywhere;
}
code.formule { background: var(--ok-clair); border-color: var(--ok-trait); color: var(--ok-fonce); font-weight: 600; }

/* Un bouton ou un libellé de l'écran : <span class="ui">Enregistrer</span> */
.ui, .chemin {
  font-size: .9em;
  background: var(--carte);
  border: 1px solid var(--bordure);
  border-radius: var(--rayon-petit);
  padding: .05em .45em;
}
.ui { font-weight: 600; white-space: nowrap; }

/* Un chemin de menus : <span class="chemin"><b>Fichier</b><b>Enregistrer sous</b></span> */
.chemin b { font-weight: 600; white-space: nowrap; }
.chemin b + b::before { content: "›"; color: var(--texte-2); font-weight: 400; margin: 0 .4em; }

/* ---------- En-tête du site ---------- */

.barre-haut {
  position: sticky; top: 0; z-index: 30;
  display: flex; align-items: center; gap: 1rem;
  min-height: var(--barre); padding: 0 1.2rem;
  background: var(--carte);
  border-bottom: 1px solid var(--filet);
  font-size: .82rem;
}
.barre-haut .marque {
  display: inline-flex; align-items: center; gap: .55rem; min-height: 2.6rem; padding: 0 .5rem; margin-left: -.5rem;
  font: 600 .95rem var(--police-titres); color: var(--texte); text-decoration: none; white-space: nowrap; border-radius: var(--rayon-petit);
}
.barre-haut .marque:hover { background: var(--attenue); }
.barre-haut .marque .logo {
  display: inline-flex; align-items: center; justify-content: center; width: 1.8rem; height: 1.8rem; border-radius: 6px;
  background: var(--bouton); color: var(--sur-bouton);
}
.barre-haut .marque .logo .ic { width: 1.15rem; height: 1.15rem; vertical-align: 0; }
.barre-haut .fil { display: flex; align-items: center; gap: .5rem; flex: 1; min-width: 0; color: var(--texte-2); }
.barre-haut .fil::before { content: ""; width: 1px; height: 1.4rem; background: var(--filet); }
.barre-haut .fil span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barre-haut .liens { display: flex; gap: .2rem; flex: 1; }
.barre-haut .liens a { display: inline-flex; align-items: center; min-height: 2.4rem; padding: 0 .8rem; color: var(--texte); text-decoration: none; font-weight: 600; border-radius: var(--rayon-petit); }
.barre-haut .liens a:hover { background: var(--attenue); }
.barre-haut .outils { display: flex; align-items: center; gap: .9rem; margin-left: auto; }
.barre-haut .avancement { display: flex; align-items: center; gap: .6rem; white-space: nowrap; color: var(--texte-2); }
.jauge { width: 6rem; height: .3rem; background: var(--filet); border-radius: 99px; overflow: hidden; }
.jauge > span { display: block; height: 100%; background: var(--ok); width: 0; border-radius: 99px; transition: width 400ms ease-out; }

main { max-width: var(--mesure); margin: 0 auto; padding: 2.2rem 1.2rem 5rem; }
main.large { max-width: var(--large); }

/* ---------- Leçon : en-tête et onglets ---------- */

.entete-lecon { margin-bottom: 1.4rem; }
.surtitre {
  display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .8rem;
  font-size: .78rem; font-weight: 600; color: var(--texte-2); margin: 0 0 .7rem;
}
.surtitre .ou-suis-je { padding: .15rem .6rem; border-radius: var(--rayon-petit); background: var(--teinte-claire); color: var(--teinte); }
.surtitre .duree { display: inline-flex; align-items: center; gap: .3rem; font-weight: 400; }
.chapeau { font-size: 1.1rem; color: var(--texte-2); margin: 0; }

/* Les onglets : un trait sous la partie affichée, comme dans les applications Microsoft 365 */
.onglets {
  position: sticky; top: var(--barre); z-index: 20;
  display: flex; gap: .2rem; margin: 0 -1.2rem 1.8rem; padding: 0 1.2rem;
  background: var(--fond); border-bottom: 1px solid var(--filet);
  overflow-x: auto; scrollbar-width: none;
}
.onglets::-webkit-scrollbar { display: none; }
.onglets [role="tab"] {
  position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; gap: .45rem;
  min-height: 2.9rem; padding: 0 .9rem;
  font: 400 .92rem var(--police-interface); color: var(--texte-2); white-space: nowrap;
  background: none; border: 0; border-radius: var(--rayon-petit) var(--rayon-petit) 0 0; cursor: pointer;
  transition: background-color var(--rapide), color var(--rapide);
}
.onglets [role="tab"] .ic { width: 1.15rem; height: 1.15rem; vertical-align: 0; }
.onglets [role="tab"]::after {
  content: ""; position: absolute; left: .9rem; right: .9rem; bottom: 0; height: 3px; border-radius: 3px 3px 0 0;
  background: transparent; transition: background-color var(--rapide);
}
.onglets [role="tab"]:hover { background: var(--attenue); color: var(--texte); }
.onglets [role="tab"]:hover::after { background: var(--bordure); }
.onglets [role="tab"][aria-selected="true"] { color: var(--texte); font-weight: 600; }
.onglets [role="tab"][aria-selected="true"]::after { background: var(--teinte); }
.onglets [role="tab"][aria-selected="true"] .ic { color: var(--teinte); }
.onglets [role="tab"] .fait { display: none; width: .95rem; height: .95rem; color: var(--ok); }
.onglets [role="tab"].vu:not([aria-selected="true"]) .fait { display: inline-block; }
.panneau > :first-child { margin-top: 0; }
.panneau > section:first-child > h2:first-child { margin-top: 0; }
.panneau > .suite { display: flex; justify-content: space-between; gap: 1rem; margin: 2.4rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--filet); }
.panneau > .suite > :only-child { margin-left: auto; }
.panneau:focus-visible { outline-offset: 8px; }

/* ---------- Blocs (encadrés) ---------- */

.bloc {
  margin: 1.5rem 0;
  padding: 1rem 1.2rem;
  border: 1px solid var(--contour);
  border-radius: var(--rayon);
  background: var(--carte);
}
.bloc > :last-child { margin-bottom: 0; }
.bloc > h2, .bloc > h3 { display: flex; align-items: center; gap: .55rem; margin: 0 0 .5rem; font-size: 1.05rem; }
.bloc > h2::before, .bloc > h3::before { vertical-align: 0; }

.bloc.objectif > h2, .bloc.objectif > h3 { --i: var(--ic-cible); }
.bloc.objectif > :is(h2, h3)::before { color: var(--primaire-fonce); }
.bloc.pratique > h2, .bloc.pratique > h3 { --i: var(--ic-souris); }
.bloc.retenir { background: var(--primaire-clair); border-color: var(--selection); }
.bloc.retenir > h2, .bloc.retenir > h3 { --i: var(--ic-signet); }
.bloc.retenir > :is(h2, h3)::before { color: var(--primaire-fonce); }
.bloc.attention { background: var(--ko-clair); border-color: var(--ko-trait); }
.bloc.attention > h2, .bloc.attention > h3 { --i: var(--ic-alerte); }
.bloc.attention > :is(h2, h3)::before { color: var(--ko); }
.bloc.astuce { background: var(--accent-clair); border-color: var(--accent-trait); }
.bloc.astuce > h2, .bloc.astuce > h3 { --i: var(--ic-ampoule); }
.bloc.astuce > :is(h2, h3)::before { color: var(--accent); }
.bloc.usage { background: var(--teinte-claire); border-color: transparent; }
.bloc.usage > h2, .bloc.usage > h3 { --i: var(--ic-boussole); }
.bloc.usage > :is(h2, h3)::before { color: var(--teinte); }
.bloc.source { background: var(--attenue); border-color: transparent; }
.bloc.source > h2, .bloc.source > h3 { --i: var(--ic-livre); }
.bloc.professeur { display: flex; gap: .8rem; align-items: flex-start; font-size: .92rem; background: var(--attenue); border-color: transparent; }
.bloc.professeur > .ic { margin-top: .15rem; width: 1.4em; height: 1.4em; color: var(--primaire-fonce); }
.bloc.professeur p { margin: 0; }

/* Référence à une source, en fin de phrase : <a class="src" href="…">Microsoft</a> */
a.src {
  font-size: .68em; font-weight: 600; vertical-align: .35em;
  text-decoration: none; color: var(--texte-2); border: 1px solid var(--bordure); border-radius: var(--rayon-petit);
  padding: .05em .45em; margin-left: .15em; white-space: nowrap; background: var(--carte);
}
a.src:hover { color: var(--primaire-tres-fonce); border-color: var(--primaire); background: var(--primaire-clair); }

/* ---------- Tableaux ---------- */

table { border-collapse: collapse; width: 100%; margin: 1.2rem 0; font-size: .9rem; line-height: 1.45; }
caption { caption-side: top; text-align: left; font-weight: 600; padding-bottom: .4rem; }
th, td { text-align: left; padding: .55rem .7rem; border-bottom: 1px solid var(--filet); vertical-align: top; }
thead th { border-bottom: 1px solid var(--bordure-forte); font-weight: 600; font-size: .82rem; color: var(--texte-2); }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.defile { overflow-x: auto; }

/* ---------- Boutons ---------- */

.bouton, button.bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 2.6rem;
  font: 600 .92rem var(--police-interface);
  color: var(--sur-bouton); background: var(--bouton);
  border: 1px solid var(--bouton); border-radius: var(--rayon-petit); padding: .4rem 1.1rem;
  cursor: pointer; text-decoration: none;
  transition: background-color var(--rapide), border-color var(--rapide), color var(--rapide);
}
.bouton .ic { width: 1.15em; height: 1.15em; vertical-align: 0; }
.bouton:hover { background: var(--bouton-survol); border-color: var(--bouton-survol); color: var(--sur-bouton); }
.bouton:active { background: var(--bouton-appui); border-color: var(--bouton-appui); }
.bouton.secondaire { background: var(--carte); color: var(--texte); border-color: var(--bordure); }
.bouton.secondaire:hover { background: var(--attenue); color: var(--texte); border-color: var(--bordure-forte); }
.bouton.discret { background: none; color: var(--texte); border-color: transparent; }
.bouton.discret:hover { background: var(--attenue); color: var(--texte); border-color: transparent; }
.bouton.succes { background: var(--ok); border-color: var(--ok); color: var(--sur-ok); }
.bouton.succes:hover { background: var(--ok-fonce); border-color: var(--ok-fonce); color: var(--sur-ok); }
.bouton.grand { min-height: 2.9rem; font-size: 1rem; padding: .5rem 1.4rem; }
.bouton.petit { min-height: 2.2rem; font-size: .82rem; padding: .25rem .8rem; }
.bouton[disabled] { opacity: .45; cursor: not-allowed; }

/* ---------- Étapes guidées (actions réelles sur l'ordinateur) ---------- */

ol.etapes { list-style: none; padding: 0; counter-reset: etape; }
ol.etapes > li {
  counter-increment: etape;
  position: relative;
  margin: 0 0 .6rem;
  padding: .9rem 1rem .8rem 3.5rem;
  background: var(--carte);
  border: 1px solid var(--contour);
  border-radius: var(--rayon);
  transition: background-color var(--rapide), border-color var(--rapide);
}
ol.etapes > li::before {
  content: counter(etape);
  position: absolute; left: 1rem; top: .85rem;
  width: 1.75rem; height: 1.75rem; border-radius: 50%;
  background: var(--teinte-claire); color: var(--teinte);
  font: 600 .85rem/1.75rem var(--police-interface); text-align: center;
}
ol.etapes > li.fait { background: var(--ok-clair); border-color: var(--ok-trait); }
ol.etapes > li.fait::before { content: "✓"; background: var(--ok); color: var(--sur-ok); }
ol.etapes .attendu {
  display: block; margin-top: .5rem; padding: .45rem .7rem; border-radius: var(--rayon-petit); background: var(--attenue);
  font-size: .86rem; color: var(--texte-2);
}
ol.etapes > li.fait .attendu { background: transparent; padding-left: 0; }
ol.etapes .attendu::before { content: "Vous devez voir : "; font-weight: 600; color: var(--texte); }
ol.etapes label.coche {
  display: inline-flex; align-items: center; gap: .6rem; min-height: 2.6rem; margin-top: .2rem; padding-right: .6rem;
  font: 600 .86rem var(--police-interface); cursor: pointer; user-select: none;
}
ol.etapes label.coche input { width: 1.25rem; height: 1.25rem; accent-color: var(--ok); cursor: pointer; }
.etapes-bilan { font-size: .88rem; color: var(--texte-2); margin: .2rem 0 1.4rem; }
.etapes-bilan.complet { color: var(--ok-fonce); font-weight: 600; }

/* ---------- Rappels (pratique de récupération) ---------- */

details.rappel {
  margin: 0 0 .6rem; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon);
  transition: background-color var(--rapide), border-color var(--rapide);
}
details.rappel > summary {
  --i: var(--ic-question);
  cursor: pointer; position: relative; display: block; padding: .9rem 1rem .85rem 3rem;
  font-weight: 600; font-size: .98rem; list-style: none; border-radius: var(--rayon);
}
details.rappel > summary:hover { background: var(--attenue); }
details.rappel[open] > summary:hover { background: none; }
details.rappel > summary::-webkit-details-marker { display: none; }
details.rappel > summary::before { position: absolute; left: 1rem; top: .95rem; width: 1.3em; height: 1.3em; color: var(--primaire-fonce); }
details.rappel > summary::after { content: "Voir la réponse"; display: block; margin-top: .2rem; font-size: .8rem; font-weight: 400; color: var(--primaire-fonce); }
details.rappel[open] > summary::after { content: "Masquer la réponse"; }
details.rappel > .reponse { padding: .8rem 1rem .9rem 3rem; border-top: 1px solid var(--filet); }
details.rappel .auto-eval { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: .6rem; font-size: .82rem; color: var(--texte-2); }
details.rappel.su { border-color: var(--ok-trait); background: var(--ok-clair); }
details.rappel.oublie { border-color: var(--accent-trait); background: var(--accent-clair); }

/* Analyse ou corrigé repliable : <details> ordinaire, sans classe */
details:not(.rappel):not(.etape):not(.enveloppe):not(.dk-chapitre) { margin: 1rem 0; padding: .7rem 1rem; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); }
details:not(.rappel):not(.etape):not(.enveloppe):not(.dk-chapitre) > summary { cursor: pointer; font-weight: 600; font-size: .95rem; color: var(--primaire-fonce); min-height: 1.8rem; }
details:not(.rappel):not(.etape):not(.enveloppe):not(.dk-chapitre)[open] > summary { margin-bottom: .6rem; }
details:not(.rappel):not(.etape):not(.enveloppe):not(.dk-chapitre) > :last-child { margin-bottom: 0; }

/* ---------- Quiz ---------- */

.quiz { margin: 1.2rem 0; }
.quiz .question { margin: 0 0 1rem; padding: 1.1rem 1.2rem; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); }
.quiz .enonce { font-weight: 600; margin-bottom: .8rem; }
.quiz .enonce .num { color: var(--texte-2); font-weight: 400; margin-right: .35em; }
.quiz ul.choix { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.quiz ul.choix li { margin: 0; }
.quiz button.choix-btn {
  width: 100%; min-height: 2.9rem; text-align: left; cursor: pointer;
  font: 1rem/1.4 var(--police-texte); color: var(--texte);
  background: var(--carte); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); padding: .6rem .9rem;
  transition: background-color var(--rapide), border-color var(--rapide);
}
.quiz button.choix-btn:hover:not([disabled]) { border-color: var(--primaire); background: var(--primaire-clair); }
.quiz button.choix-btn[disabled] { cursor: default; color: var(--texte-2); border-color: var(--filet); background: var(--fond); }
.quiz button.choix-btn.juste { border-color: var(--ok); background: var(--ok-clair); color: var(--texte); font-weight: 600; }
.quiz button.choix-btn.faux { border-color: var(--ko); background: var(--ko-clair); color: var(--texte); }
/* la bonne et la mauvaise réponse sont nommées, pas seulement colorées */
.quiz button.choix-btn.juste::after { content: "✓ Bonne réponse"; float: right; margin-left: 1rem; font: 600 .78rem/1.8 var(--police-interface); color: var(--ok-fonce); }
.quiz button.choix-btn.faux::after { content: "✗ Votre réponse"; float: right; margin-left: 1rem; font: 600 .78rem/1.8 var(--police-interface); color: var(--ko-fonce); }
.quiz .verdict { display: flex; align-items: center; gap: .4rem; font-weight: 600; font-size: .92rem; margin: .8rem 0 .3rem; }
.quiz .verdict.juste { --i: var(--ic-coche); color: var(--ok-fonce); }
.quiz .verdict.faux { --i: var(--ic-croix); color: var(--ko-fonce); }
.quiz .explication { display: none; font-size: .95rem; margin: 0; color: var(--texte-2); }
.quiz .question.repondu .explication { display: block; }
.quiz .bilan { padding: 1rem 1.2rem; border-radius: var(--rayon); background: var(--primaire-clair); border: 1px solid var(--selection); }
.quiz .bilan strong { font-size: 1.15rem; }
.quiz .bilan .temps { display: block; margin-top: .3rem; font-size: .88rem; color: var(--texte-2); }
.quiz .bilan .bouton { margin-top: .7rem; }

/* ---------- Exercices interactifs (cadre commun) ---------- */

.exercice {
  margin: 1.4rem 0; padding: 1rem 1.2rem 1.2rem;
  background: var(--carte); border: 1px solid var(--contour); border-top: 3px solid var(--primaire); border-radius: var(--rayon);
  box-shadow: var(--ombre);
  font-size: .92rem;
  transition: border-color var(--rapide);
}
.exercice > .titre-ex { --i: var(--ic-souris); display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-weight: 600; margin: 0 0 .3rem; }
.exercice > .titre-ex::before { color: var(--primaire-fonce); vertical-align: 0; }
.exercice .consigne { margin: 0 0 .8rem; }
.exercice .retour { min-height: 1.6em; font-weight: 600; margin: .7rem 0 0; }
.exercice .retour.ok { color: var(--ok-fonce); }
.exercice .retour.ko { color: var(--ko-fonce); }
.exercice.reussi { border-top-color: var(--ok); }
.exercice.reussi > .titre-ex::after { content: "Réussi ✓"; padding: .05rem .5rem; border-radius: var(--rayon-petit); background: var(--ok-clair); color: var(--ok-fonce); font-size: .78rem; }

/* ---------- Maquettes d'écran (schémas simplifiés, pas des captures) ---------- */

.maquette {
  margin: 1.4rem 0; padding: 1rem; background: var(--attenue); border: 1px solid var(--filet); border-radius: var(--rayon);
  font-size: .8rem; line-height: 1.45; overflow-x: auto;
}
.maquette > figcaption, figure.maquette figcaption { margin-top: .7rem; font-size: .8rem; color: var(--texte-2); }
figure { margin: 1.4rem 0; }
figcaption { font-size: .82rem; color: var(--texte-2); margin-top: .5rem; }

.fenetre { background: var(--carte); border: 1px solid var(--bordure); border-radius: var(--rayon); box-shadow: var(--ombre-haute); overflow: hidden; min-width: 18rem; }
.fenetre-titre { display: flex; align-items: center; gap: .5rem; padding: .35rem .6rem; background: var(--attenue); border-bottom: 1px solid var(--filet); font-weight: 600; }
.fenetre-titre .boutons { margin-left: auto; display: flex; gap: 0; }
.fenetre-titre .boutons > span:not(.repere) { width: 2.2rem; text-align: center; padding: .1rem 0; border-radius: var(--rayon-petit); }
.fenetre-titre .boutons > span.fermer { background: var(--ko); color: var(--sur-ko); }
.fenetre-corps { padding: .8rem; min-height: 4rem; }
.ruban { display: flex; gap: .2rem; flex-wrap: wrap; padding: .3rem .5rem 0; background: var(--attenue); border-bottom: 1px solid var(--filet); }
.ruban .onglet { padding: .3rem .7rem; border-radius: var(--rayon-petit) var(--rayon-petit) 0 0; }
.ruban .onglet.actif { background: var(--carte); border: 1px solid var(--filet); border-bottom-color: var(--carte); margin-bottom: -1px; font-weight: 600; color: var(--primaire-fonce); }
.barre-taches { position: relative; display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .45rem .8rem; background: var(--carte); border: 1px solid var(--bordure); border-radius: var(--rayon); }
.barre-taches .zone-droite { position: absolute; right: .8rem; display: flex; align-items: center; gap: .6rem; color: var(--texte-2); }
.barre-taches .zone-gauche { position: absolute; left: .8rem; display: flex; align-items: center; gap: .6rem; }
.icone { display: inline-flex; flex-direction: column; align-items: center; gap: .15rem; min-width: 4.2rem; padding: .35rem .3rem; border-radius: var(--rayon-petit); text-align: center; font-size: .75rem; }
.icone .pic { font-size: 1.7rem; line-height: 1; }
.icone.choisie { background: var(--selection); outline: 1px solid var(--primaire); }
.menu-contextuel { display: inline-block; min-width: 11rem; background: var(--carte); border: 1px solid var(--bordure); border-radius: var(--rayon); box-shadow: var(--ombre-haute); padding: .3rem; }
.menu-contextuel div { padding: .3rem .7rem; border-radius: var(--rayon-petit); }
.menu-contextuel div.survol { background: var(--attenue); }
.repere {
  display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  background: var(--accent); color: var(--carte); font: 600 .78rem var(--police-interface); vertical-align: middle;
}
.arbre { font-family: var(--police-code); font-size: .82rem; line-height: 1.55; white-space: pre; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); padding: .9rem 1.1rem; overflow-x: auto; }

/* ---------- Pied de leçon ---------- */

.fin-lecon { margin-top: 2.6rem; }
.fin-lecon .terminer { text-align: center; margin: 1.8rem 0; padding: 1.6rem 1rem; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); }
.fin-lecon .terminer p { font-size: .88rem; color: var(--texte-2); margin: .7rem 0 0; }
.nav-lecons { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.nav-lecons a {
  display: block; padding: .8rem 1rem; min-height: 4.2rem; border: 1px solid var(--contour); border-radius: var(--rayon);
  background: var(--carte); text-decoration: none; color: var(--texte); font-weight: 600; line-height: 1.35;
}
.nav-lecons a:hover { border-color: var(--bordure-forte); background: var(--attenue); }
.nav-lecons a small { display: flex; align-items: center; gap: .35rem; margin-bottom: .2rem; color: var(--texte-2); font-weight: 400; font-size: .78rem; }
.nav-lecons a small .ic { width: 1rem; height: 1rem; vertical-align: 0; }
.nav-lecons a.suivante { text-align: right; grid-column: 2; }
.nav-lecons a.suivante small { justify-content: flex-end; }
.nav-lecons a.suivante.mise-en-avant { background: var(--bouton); color: var(--sur-bouton); border-color: var(--bouton); }
.nav-lecons a.suivante.mise-en-avant small { color: inherit; }
.nav-lecons a.suivante.mise-en-avant:hover { background: var(--bouton-survol); border-color: var(--bouton-survol); }

/* ---------- Quiz de validation : mode concentration, compte à rebours, badge ---------- */

.focus-barre {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: .6rem 1.2rem; flex-wrap: wrap;
  min-height: var(--barre); padding: .3rem 1.2rem;
  background: var(--inverse); color: var(--sur-inverse); font-size: .86rem;
}
.focus-barre .quoi { display: flex; align-items: center; gap: .5rem; flex: 1; min-width: 0; font-weight: 600; }
.focus-barre .quoi span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.focus-barre .ou { opacity: .85; white-space: nowrap; }
.focus-barre .temps { font: 600 1.3rem var(--police-titres); font-variant-numeric: tabular-nums; min-width: 3.8rem; text-align: center; }
.focus-barre button {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 2.3rem; padding: .2rem .8rem; font: 600 .82rem var(--police-interface);
  color: inherit; background: transparent; border: 1px solid currentColor; border-radius: var(--rayon-petit); cursor: pointer;
}
.focus-barre button .ic { width: 1.05rem; height: 1.05rem; vertical-align: 0; }
.focus-barre button:hover { background: rgba(128, 128, 128, .28); }
.focus-barre :focus-visible { outline-color: currentColor; }
.focus-barre.bientot .temps { color: #FFB86B; }
.focus-barre.reussi { background: var(--ok); color: var(--sur-ok); }
.focus-barre.rate { background: var(--accent); color: var(--carte); }
.focus-barre.reussi .temps, .focus-barre.rate .temps { display: none; }
body.concentration .barre-haut, body.concentration .onglets, body.concentration .entete-lecon,
body.concentration .panneau > .suite { display: none; }
body.concentration main { padding-top: 2rem; max-width: 42rem; }

.quiz.attente .question { display: none; }
.quiz .question.choisie { border-color: var(--bordure-forte); }
.quiz button.choix-btn.choisi { border-color: var(--primaire); background: var(--primaire-clair); color: var(--texte); font-weight: 600; }
.quiz button.choix-btn.choisi::after { content: "Votre réponse"; float: right; margin-left: 1rem; font: 600 .78rem/1.8 var(--police-interface); color: var(--primaire-fonce); }
.quiz .bilan { margin-bottom: 1.2rem; }
.quiz .bilan p { margin: .3rem 0 0; }
.quiz .bilan .bouton { margin: .8rem .5rem 0 0; }
.quiz .bilan.reussi { background: var(--ok-clair); border-color: var(--ok-trait); }
.quiz .bilan.rate { background: var(--accent-clair); border-color: var(--accent-trait); }

/* la médaille d'un badge */
.medaille {
  float: left; display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; margin: 0 1rem .4rem 0;
  border-radius: 50%; background: var(--ok); color: var(--sur-ok);
}
.medaille .ic { width: 1.7rem; height: 1.7rem; vertical-align: 0; }
.surtitre .validee { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .6rem; border-radius: var(--rayon-petit); background: var(--ok-clair); color: var(--ok-fonce); }
.surtitre .validee .ic { width: 1rem; height: 1rem; vertical-align: 0; }
.fin-lecon .terminer strong { display: block; font: 600 1.1rem var(--police-titres); }
.fin-lecon .terminer .bouton { margin-top: 1rem; }
.fin-lecon .terminer.validee { text-align: left; background: var(--ok-clair); border-color: var(--ok-trait); }
.fin-lecon .terminer.validee::after { content: ""; display: block; clear: both; }

.grille-badges { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: .6rem; }
.badge-etape { display: flex; flex-direction: column; align-items: center; gap: .15rem; padding: 1rem .6rem; text-align: center; line-height: 1.3; border: 1px solid var(--contour); border-radius: var(--rayon); background: var(--carte); }
.badge-etape .medaille { float: none; margin: 0 0 .4rem; background: var(--attenue); color: var(--texte-2); }
.badge-etape.acquis .medaille { background: var(--teinte); color: var(--carte); }
.badge-etape strong { font-size: .9rem; }
.badge-etape small { font-size: .78rem; color: var(--texte-2); }
.badge-etape.acquis small { color: var(--ok-fonce); font-weight: 600; }

/* ---------- Info-bulles du glossaire, à la manière des info-bulles d'Office ---------- */

a.terme { cursor: help; }
a.terme[aria-describedby] { background: var(--primaire-clair); }
.infobulle {
  position: absolute; z-index: 50; width: max-content; max-width: min(21rem, calc(100vw - 20px)); padding: .6rem .8rem;
  background: var(--carte); color: var(--texte); border: 1px solid var(--bordure); border-radius: var(--rayon-petit); box-shadow: var(--ombre-haute);
  font-size: .86rem; line-height: 1.45; pointer-events: none;
}
.infobulle strong { display: block; margin-bottom: .15rem; font-weight: 600; }
.infobulle span { display: block; color: var(--texte-2); }

.consigne-examen { margin: 0 0 1.2rem; padding: .9rem 1.1rem; background: var(--primaire-clair); border: 1px solid var(--selection); border-radius: var(--rayon); font-size: .95rem; }

/* ---------- Accueil ---------- */

body.accueil { overflow-x: clip; }
.hero {
  position: relative; z-index: 0; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2.4rem; align-items: center;
  margin: -2.2rem 0 2.4rem; padding: 3rem 0; color: var(--sur-bandeau);
}
.hero::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -100vmax; right: -100vmax; background: var(--bandeau); }
/* un halo discret, pour ne pas laisser un aplat nu */
.hero::after {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -100vmax; right: -100vmax; pointer-events: none;
  background: radial-gradient(40rem 22rem at 78% 30%, rgba(98, 171, 245, .35), transparent 70%), radial-gradient(26rem 16rem at 12% 110%, rgba(71, 158, 245, .22), transparent 70%);
}
.hero h1 { font-size: 2.5rem; margin-bottom: .7rem; }
.hero .surtitre { color: var(--sur-bandeau-2); }
.hero .chapeau { color: var(--sur-bandeau-2); font-size: 1.1rem; max-width: 30rem; }

/* la prochaine leçon : la seule chose mise en avant */
.reprise {
  display: flex; flex-direction: column; gap: 1rem; padding: 1.4rem;
  background: var(--carte); color: var(--texte); border-radius: var(--rayon); box-shadow: var(--ombre-flottante);
}
.reprise .texte { line-height: 1.35; }
.reprise .texte small { display: inline-block; padding: .15rem .6rem; border-radius: var(--rayon-petit); font-size: .76rem; font-weight: 600; background: var(--teinte-claire); color: var(--teinte); }
.reprise .texte strong { display: block; font: 600 1.3rem/1.25 var(--police-titres); margin: .6rem 0 .3rem; }
.reprise .texte p { margin: 0; color: var(--texte-2); font-size: .88rem; }
.reprise .texte .duree { display: inline-flex; align-items: center; gap: .3rem; margin-left: .5rem; white-space: nowrap; }
.reprise .texte .duree .ic { width: 1rem; height: 1rem; vertical-align: 0; }
.reprise .texte .bravo { display: flex; align-items: center; gap: .35rem; margin-top: .5rem; color: var(--ok-fonce); font-weight: 600; }
.reprise .bouton { align-self: flex-start; }

.titre-zone { margin: 2.4rem 0 .3rem; font-size: 1.3rem; }
.hero + .titre-zone { margin-top: 0; }
.resume-zone { color: var(--texte-2); margin: 0 0 1rem; font-size: .92rem; }

/* Enveloppes : une liste de lignes qui s'ouvrent et se referment (étapes, rubriques) */
.liste-enveloppes { background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); box-shadow: var(--ombre); overflow: hidden; }
.etape, .enveloppe { border-bottom: 1px solid var(--filet); }
.liste-enveloppes > :last-child { border-bottom: 0; }
.etape > summary, .enveloppe > summary {
  display: flex; align-items: center; gap: .9rem; min-height: 3.7rem;
  padding: .5rem 1rem; cursor: pointer; list-style: none;
  transition: background-color var(--rapide);
}
.etape > summary:hover, .enveloppe > summary:hover { background: var(--attenue); }
.etape > summary::-webkit-details-marker, .enveloppe > summary::-webkit-details-marker { display: none; }
.etape[open] > summary, .enveloppe[open] > summary { background: var(--attenue); }
.boite {
  flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: var(--rayon);
  background: var(--teinte-claire); color: var(--teinte);
}
.boite .ic { width: 1.4rem; height: 1.4rem; vertical-align: 0; }
.etape .titres, .enveloppe .titres { flex: 1; min-width: 0; line-height: 1.3; }
.etape .titres small { display: block; font-size: .74rem; color: var(--texte-2); }
.etape .titres strong, .enveloppe .titres strong { display: block; font: 600 1.02rem var(--police-titres); }
.etape .titres .resume, .enveloppe .titres .resume { display: block; font-size: .84rem; color: var(--texte-2); }
/* fermée, une étape ne montre que son nom : le détail vient à l'ouverture */
.etape:not([open]) .titres .resume { display: none; }
.etat-etape {
  flex: none; display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .6rem; border-radius: var(--rayon-petit);
  font-size: .76rem; font-weight: 600; white-space: nowrap; background: var(--attenue); color: var(--texte-2);
}
.etat-etape .ic { width: .95rem; height: .95rem; vertical-align: 0; }
.etape.en-cours .etat-etape { background: var(--primaire-clair); color: var(--primaire-fonce); }
.etape.finie .etat-etape { background: var(--ok-clair); color: var(--ok-fonce); }
.chevron { flex: none; width: 1.2rem; height: 1.2rem; color: var(--texte-2); background-color: currentColor; -webkit-mask: var(--ic-chevron) center / contain no-repeat; mask: var(--ic-chevron) center / contain no-repeat; transition: transform var(--rapide); }
[open] > summary .chevron { transform: rotate(180deg); }
.etape > ol.liste-lecons { margin: 0; padding: .3rem 1rem .8rem; }
.enveloppe > :not(summary) { margin-left: 1.2rem; margin-right: 1.2rem; }
.enveloppe > summary + * { margin-top: 1rem; }
.enveloppe > :last-child { margin-bottom: 1.2rem; }
.enveloppe > ol { padding-left: 1.4rem; font-size: .95rem; }
/* sans script (et pour les robots), les étapes sont de simples sections */
section.etape { padding: 1rem 1.2rem; }
section.etape > h2 { margin: 0 0 .3rem; font-size: 1.1rem; }
section.etape > p.resume { color: var(--texte-2); margin: 0 0 .6rem; font-size: .9rem; }

ol.liste-lecons { list-style: none; padding: 0; margin: 0; }
ol.liste-lecons li { margin: 0; }
ol.liste-lecons a {
  display: flex; align-items: center; gap: .9rem; min-height: 2.9rem; padding: .35rem .6rem;
  text-decoration: none; color: var(--texte); font-size: .95rem; line-height: 1.35; border-radius: var(--rayon-petit);
}
ol.liste-lecons a:hover { background: var(--attenue); }
ol.liste-lecons .pastille { flex: none; width: 1.8rem; height: 1.8rem; border-radius: 50%; border: 1px solid var(--bordure-forte); font: 600 .78rem/calc(1.8rem - 2px) var(--police-interface); text-align: center; color: var(--texte-2); }
ol.liste-lecons li.terminee .pastille { background: var(--ok); border-color: var(--ok); color: var(--sur-ok); }
ol.liste-lecons li.prochaine a { background: var(--primaire-clair); font-weight: 600; }
ol.liste-lecons li.prochaine .pastille { background: var(--bouton); color: var(--sur-bouton); border-color: var(--bouton); }
ol.liste-lecons .t { flex: 1; }
ol.liste-lecons .etat { font-size: .76rem; font-weight: 600; color: var(--primaire-fonce); white-space: nowrap; }
ol.liste-lecons li.terminee .etat { color: var(--ok-fonce); }
ol.liste-lecons .d { color: var(--texte-2); font-size: .8rem; font-weight: 400; white-space: nowrap; }

.grille-fiches { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .6rem; }
.grille-fiches a { display: grid; grid-template-columns: auto 1fr; gap: .1rem .8rem; align-items: center; padding: .8rem; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); text-decoration: none; color: var(--texte); line-height: 1.35; transition: border-color var(--rapide), background-color var(--rapide); }
.grille-fiches a:hover { border-color: var(--bordure-forte); background: var(--attenue); }
.grille-fiches a .boite { grid-row: span 2; }
.grille-fiches a strong { display: block; font-size: .95rem; }
.grille-fiches a span.r { font-size: .82rem; color: var(--texte-2); }

.pied-accueil { margin: 3rem 0 0; padding-top: 1.2rem; border-top: 1px solid var(--filet); font-size: .82rem; color: var(--texte-2); text-align: center; }

/* ---------- Bonus : écrire sans regarder le clavier (assets/dactylo.js) ---------- */

.carte-bonus {
  display: flex; align-items: center; gap: .9rem; padding: .9rem 1rem; text-decoration: none; color: var(--texte);
  background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); box-shadow: var(--ombre);
  transition: border-color var(--rapide), background-color var(--rapide);
}
.carte-bonus:hover { border-color: var(--bordure-forte); background: var(--attenue); color: var(--texte); }
.carte-bonus .titres { flex: 1; line-height: 1.3; }
.carte-bonus .titres strong { display: block; font: 600 1.02rem var(--police-titres); }
.carte-bonus .titres .resume { display: block; font-size: .84rem; color: var(--texte-2); }
.carte-bonus > .ic { color: var(--texte-2); }

/* Le jeu : un tableau de bord, le prochain niveau en avant, puis les chapitres en enveloppes. */
.dk { --or: #E8A200; display: flex; flex-direction: column; gap: .8rem; }
.dk-stat { display: inline-flex; flex-direction: column; line-height: 1.2; }
.dk-stat small { font-size: .74rem; font-weight: 400; color: var(--texte-2); }
.dk-stat strong { display: inline-flex; align-items: center; gap: .3rem; font: 600 1.25rem var(--police-titres); font-variant-numeric: tabular-nums; }
.dk-stat .ic { width: 1.1rem; height: 1.1rem; vertical-align: 0; }
.dk .ic-etoile-pleine { color: var(--or); }
.dk-bord .ic-feu, .dk-bord .ic-badge { color: var(--accent); }

.dk-bord {
  display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 2.2rem; padding: .8rem 1.2rem;
  background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon);
}
.dk-bord .dk-son { margin-left: auto; }

.dk-carte {
  display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1rem; padding: 1rem 1.2rem;
  background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon);
}
.dk-titres { flex: 1; min-width: 10rem; display: flex; flex-direction: column; line-height: 1.35; text-align: left; }
.dk-titres small { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; color: var(--texte-2); }
.dk-titres small .ic { width: 1rem; height: 1rem; vertical-align: 0; }
.dk-titres strong { font: 600 1.02rem var(--police-titres); }
.dk-titres > span { font-size: .86rem; color: var(--texte-2); }
.dk-principale { padding: 1.3rem 1.4rem; border-left: 4px solid var(--primaire); box-shadow: var(--ombre-haute); }
.dk-principale .dk-titres small { font-weight: 600; color: var(--primaire-fonce); }
.dk-principale .dk-titres strong { margin: .15rem 0; font-size: 1.45rem; }
.dk-cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: .8rem; }

.dk-chapitre { background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); }
.dk-chapitre > summary { display: flex; align-items: center; gap: .8rem; padding: .6rem 1rem; cursor: pointer; list-style: none; border-radius: var(--rayon); }
.dk-chapitre > summary::-webkit-details-marker { display: none; }
.dk-chapitre > summary:hover { background: var(--attenue); }
.dk-chapitre > summary > .ic-chevron { flex: none; color: var(--texte-2); transition: transform var(--rapide); }
.dk-chapitre[open] > summary > .ic-chevron { transform: rotate(180deg); }
.dk-chapitre .dk-titres, .dk-badge .dk-titres { min-width: 0; }
.dk-chapitre .dk-titres strong { font-size: .95rem; }

.dk-parcours, .dk-grille-badges { list-style: none; margin: 0; padding: .3rem 1rem 1rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .5rem; }
.dk-parcours li { margin: 0; }
.dk-niveau, .dk-badge {
  display: flex; align-items: center; gap: .7rem; width: 100%; min-height: 3.4rem; padding: .45rem .7rem; text-align: left;
  font: inherit; color: var(--texte); background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon-petit);
}
.dk-niveau { cursor: pointer; transition: border-color var(--rapide), background-color var(--rapide); }
.dk-niveau:hover:not([disabled]) { border-color: var(--bordure-forte); background: var(--attenue); }
.dk-niveau[disabled], .dk-badge:not(.dk-acquis) { cursor: default; background: var(--fond); color: var(--texte-2); }
.dk-num {
  flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--attenue); color: var(--texte-2); font-weight: 600; font-size: .86rem;
}
.dk-num .ic { width: 1.05rem; height: 1.05rem; vertical-align: 0; }
.dk-reussi .dk-num, .dk-fini > summary .dk-num, .dk-acquis .dk-num { background: var(--ok); color: var(--sur-ok); }
.dk-prochain .dk-niveau { border-color: var(--primaire); box-shadow: inset 0 0 0 1px var(--primaire); }
.dk-prochain .dk-num { background: var(--bouton); color: var(--sur-bouton); }
.dk-etoiles { flex: none; display: inline-flex; color: var(--bordure); }
.dk-etoiles .ic { width: .95rem; height: .95rem; vertical-align: 0; }
.dk-etoiles .dk-gagnee { color: var(--or); }

/* pendant une partie, il ne reste que le jeu */
body.dk-en-jeu main > :not(.dk-section) { display: none; }
body.dk-en-jeu .dk-section > :not([data-dactylo]) { display: none; }

.dk-tete { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; }
.dk-titre { font-size: .92rem; color: var(--texte-2); }
.dk-titre strong { font: 600 1.05rem var(--police-titres); color: var(--texte); }
.dk-scene { padding: 1.1rem 1.4rem 1.4rem; text-align: center; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); box-shadow: var(--ombre); }

/* les chiffres en direct */
.dk-hud { position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem 2.4rem; padding-bottom: 1rem; text-align: left; }
.dk-avance { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--filet); border-radius: 99px; overflow: hidden; }
.dk-avance span { display: block; width: 0; height: 100%; background: var(--primaire); border-radius: 99px; transition: width 200ms ease-out; }
.dk-serie .ic { color: var(--bordure-forte); }
.dk-serie.dk-chaude .ic, .dk-serie.dk-chaude .dk-combo { color: var(--accent); }
.dk-multi { padding: 0 .4rem; font: 600 .78rem var(--police-interface); font-style: normal; background: var(--accent); color: var(--carte); border-radius: 99px; }
.dk-multi:empty { display: none; }

/* la ligne à suivre : la lettre attendue reste en place, le texte défile */
.dk-ligne { overflow: hidden; margin: 1rem 0 0; padding: 1.1rem 0; text-align: left; background: var(--fond); border: 1px solid var(--filet); border-radius: var(--rayon); }
.dk-ligne { -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 92%, transparent); }
.dk-ruban { position: relative; display: inline-block; padding: 0 1.2rem; white-space: nowrap; font: 600 2.1rem/1.3 var(--police-titres); transition: transform 120ms ease-out; }
.dk-ruban span { display: inline-block; min-width: .5em; margin: 0 1px; text-align: center; color: var(--texte-2); border-bottom: 3px solid transparent; border-radius: 3px 3px 0 0; }
.dk-ruban .dk-blanc { color: var(--bordure); }
.dk-ruban .dk-fait { color: var(--ok-fonce); }
.dk-ruban .dk-fait.dk-blanc { color: var(--ok-trait); }
.dk-ruban .dk-ici { color: var(--texte); background: var(--selection); border-bottom-color: var(--primaire); }
.dk-ruban .dk-ici.dk-blanc { color: var(--texte-2); }
.dk-secoue { animation: dk-secousse 240ms; }
@keyframes dk-secousse { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.dk-aide { min-height: 1.6em; margin: .8rem 0 1rem; font-size: .98rem; color: var(--texte-2); }
.dk-aide.dk-alerte { color: var(--ko-fonce); }

/* le clavier dessiné : une teinte par doigt, la touche à frapper allumée */
.dk-clavier { display: inline-block; max-width: 100%; overflow: hidden; padding: .6rem; text-align: left; background: var(--attenue); border-radius: var(--rayon); }
.dk-rangee { display: flex; gap: .25rem; margin-bottom: .25rem; }
.dk-rangee:last-child { justify-content: center; margin-bottom: 0; }
.dk-rangee.dk-r0 { padding-left: 2.65rem; } .dk-rangee.dk-r1 { padding-left: 3.95rem; } .dk-rangee.dk-r2 { padding-left: 4.65rem; }
.dk-k {
  flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem;
  font: 600 .85rem var(--police-interface); color: var(--texte); background: var(--carte);
  border: 1px solid var(--bordure); border-bottom-width: 2px; border-radius: var(--rayon-petit); transition: background-color 80ms, color 80ms;
}
.dk-k.dk-d0, .dk-k.dk-d7 { background: var(--ko-clair); }
.dk-k.dk-d1, .dk-k.dk-d6 { background: var(--accent-clair); }
.dk-k.dk-d2, .dk-k.dk-d5 { background: var(--ok-clair); }
.dk-k.dk-d3, .dk-k.dk-d4 { background: var(--primaire-clair); }
.dk-k.dk-inconnue { background: var(--carte); color: var(--bordure); border-color: var(--filet); }
.dk-k.dk-repere { box-shadow: inset 0 -5px 0 -2px var(--bordure-forte); }
.dk-k.dk-maj { width: 5.7rem; font-size: .72rem; font-weight: 400; color: var(--texte-2); }
.dk-k.dk-espace { width: 15rem; font-size: .72rem; font-weight: 400; color: var(--texte-2); }
.dk-k.dk-cible { background: var(--bouton); color: var(--sur-bouton); border-color: var(--bouton); box-shadow: 0 0 0 3px var(--selection); }
.dk-k.dk-erreur { animation: dk-erreur 320ms; }
@keyframes dk-erreur { 30% { background: var(--ko); color: var(--sur-ko); border-color: var(--ko); } }

/* les deux mains : le doigt à utiliser s'allume */
.dk-mains { display: flex; justify-content: center; gap: 4rem; margin-top: .9rem; }
.dk-main { display: inline-flex; flex-direction: column; align-items: center; gap: .2rem; }
.dk-main small { font-size: .74rem; color: var(--texte-2); }
.dk-main svg { display: block; width: 7.2rem; height: auto; }
.dk-main-droite svg { transform: scaleX(-1); }
.dk-doigt, .dk-paume { fill: var(--attenue); stroke: var(--bordure); stroke-width: 1.5; transition: fill 80ms, stroke 80ms; }
.dk-doigt.dk-allume { fill: var(--bouton); stroke: var(--bouton); }

/* le bilan d'une partie */
.dk-resultat {
  padding: 2rem 1.4rem 1.4rem; text-align: center; outline: none;
  background: var(--carte); border: 1px solid var(--contour); border-top: 4px solid var(--accent); border-radius: var(--rayon); box-shadow: var(--ombre-haute);
}
.dk-resultat.dk-ok { border-top-color: var(--ok); }
.dk-etoiles.dk-grandes .ic { width: 2.8rem; height: 2.8rem; }
.dk-grandes .dk-gagnee { animation: dk-pop 420ms backwards; }
.dk-grandes .dk-gagnee:nth-child(2) { animation-delay: 150ms; }
.dk-grandes .dk-gagnee:nth-child(3) { animation-delay: 300ms; }
@keyframes dk-pop { from { transform: scale(.2); opacity: 0; } 70% { transform: scale(1.2); } }
.dk-verdict { display: block; margin: .6rem 0 1.2rem; font: 600 1.6rem var(--police-titres); }
.dk-chiffres { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 2.6rem; margin-bottom: 1.2rem; }
.dk-chiffres .dk-stat { align-items: center; }
.dk-chiffres .dk-stat strong { font-size: 1.5rem; }
.dk-resultat p { margin: 0 0 .7rem; color: var(--texte-2); }
.dk-resultat p.dk-nouveau-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .4rem 1rem; font-weight: 600; color: var(--texte); background: var(--primaire-clair); border-radius: 99px; }
.dk-nouveau-badge .ic { color: var(--accent); }
.dk-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 1.2rem; }
.dk-resultat p.dk-touche-entree { margin: 1rem 0 0; font-size: .84rem; }

/* ---------- Fiches de référence ---------- */

body.fiche main { max-width: var(--large); }
.fiche-entete { display: flex; align-items: baseline; gap: .4rem 1rem; flex-wrap: wrap; border-bottom: 1px solid var(--bordure); padding-bottom: .8rem; margin-bottom: 1.4rem; }
.fiche-entete h1 { margin: 0; font-size: 1.8rem; }
.fiche-entete p { margin: 0; color: var(--texte-2); font-size: .9rem; flex: 1; min-width: 14rem; }
.colonnes { columns: 2 22rem; column-gap: 1.2rem; }
.colonnes > * { break-inside: avoid; }
.carte { break-inside: avoid; margin: 0 0 1.2rem; padding: 1rem 1.1rem; background: var(--carte); border: 1px solid var(--contour); border-radius: var(--rayon); box-shadow: var(--ombre); }
.carte > h2, .carte > h3 { margin: 0 0 .5rem; font-size: 1.02rem; }
.carte table { margin: 0; font-size: .84rem; }
.carte table + p, .carte table + ul { margin-top: .7rem; }
.carte > :last-child { margin-bottom: 0; }
.carte > p, .carte > ul, .carte > ol { font-size: .88rem; line-height: 1.5; }
td code, th code, .carte code { white-space: normal; overflow-wrap: anywhere; }
dl.glossaire { margin: 0; font-size: .92rem; line-height: 1.5; }
dl.glossaire dt { font-weight: 600; margin-top: 1rem; }
dl.glossaire dd { margin: .1rem 0 0; }
dl.glossaire dd.eviter { font-size: .8rem; color: var(--texte-2); font-style: italic; }
dl.glossaire dt:target { background: var(--surlignage); outline: 4px solid var(--surlignage); border-radius: 2px; }
.imprimer-fiche { margin-left: auto; }

/* ---------- Petits écrans ---------- */

@media (max-width: 760px) {
  .hero { grid-template-columns: 1fr; gap: 1.6rem; padding: 2rem 0; }
  .hero h1 { font-size: 1.9rem; }
  .barre-haut .fil, .barre-haut .avancement .txt, .focus-barre .ou { display: none; }
}
@media (max-width: 640px) {
  html { font-size: 106.25%; }
  h1 { font-size: 1.6rem; }
  .barre-haut .liens { display: none; }
  .nav-lecons { grid-template-columns: 1fr; }
  .nav-lecons a.suivante { grid-column: 1; }
  ol.liste-lecons .etat { display: none; }
  .etape > summary, .enveloppe > summary { gap: .7rem; padding: .5rem .8rem; }
  .enveloppe .titres .resume { display: none; }
  .dk-k { width: 1.75rem; height: 1.9rem; font-size: .72rem; }
  .dk-k.dk-maj { display: none; }
  .dk-k.dk-espace { width: 9rem; }
  .dk-rangee.dk-r0 { padding-left: 0; } .dk-rangee.dk-r1 { padding-left: .6rem; } .dk-rangee.dk-r2 { padding-left: 1rem; } .dk-rangee.dk-r3 { padding-left: 1.6rem; }
  .dk-ruban { font-size: 1.6rem; }
  .dk-scene { padding: .8rem; }
  .dk-mains { gap: 1.5rem; }
  .quiz button.choix-btn.juste::after, .quiz button.choix-btn.faux::after { float: none; display: block; margin: .2rem 0 0; }
}

/* ---------- Animations réduites sur demande (réglage de Windows) ---------- */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
}

/* ---------- Impression (toujours en clair, sur A4) ---------- */

@media print {
  html { font-size: 11pt; }
  body { background: #fff; }
  .barre-haut, .focus-barre, .infobulle, .consigne-examen, .evitement, .onglets, .panneau > .suite, .fin-lecon, .bouton, .imprimer-fiche, .bloc.professeur, .auto-eval, label.coche, .etapes-bilan { display: none !important; }
  .panneau[hidden], body.concentration .entete-lecon, .quiz.attente .question { display: block !important; }
  main, body.fiche main, main.large { max-width: none; padding: 0; }
  a { color: inherit; text-decoration: none; }
  h2 { margin-top: 1.6rem; }
  .bloc, .carte, .quiz .question, ol.etapes > li, details.rappel, .maquette, .exercice { break-inside: avoid; box-shadow: none; }
  h1, h2, h3 { break-after: avoid; }
  .carte { margin-bottom: .8rem; padding: .6rem .8rem; }
  details.rappel > .reponse { display: block; }
  details.rappel > summary::after { content: none; }
  .hero { display: block; color: inherit; margin: 0; padding: 0 0 1rem; }
  .hero::before, .hero::after { display: none; }
  .hero .chapeau, .hero .surtitre { color: inherit; }
  @page { size: A4; margin: 14mm; }
}

/* Les ancres ne se cachent pas sous l'en-tête et les onglets, qui restent collés en haut de l'écran. */
[id] { scroll-margin-top: 7.5rem; }