/*!****************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./assets/pages/mathematiques/mathematiques.scss ***!
  \****************************************************************************************************************************************/
@charset "UTF-8";
/* === DICO_SCSS_META_START ===
path: assets/pages/mathematiques/mathematiques.scss
=== DICO_SCSS_META_END === */
/* Page /mathematiques/ — histoire mondiale des mathématiques.

   Reprend le dessin des cartes d'exploration (/carte/) : mêmes vignettes
   `refcard`, même respiration, même socle de charte (variables, en-tête et pied
   vivent dans src/scss/app.scss). Les classes sont propres à la page, comme
   ailleurs dans le projet.

   Deux partis pris d'affichage tiennent aux DONNÉES, pas au goût :

   - les barres de la frise disent la DENSITÉ, pas la durée. Les tranches
     historiques ont des largeurs temporelles très inégales — trois millénaires
     d'un côté, un siècle de l'autre — et prétendre les mettre à l'échelle
     réduirait l'Antiquité à un trait ;

   - ce qui est incertain se voit. Une date contestée porte une marque discrète
     mais lisible : le lecteur doit pouvoir distinguer un fait établi d'une
     attribution discutée sans ouvrir la fiche. */
/* ── L'échelle des temps ──
   Une jauge statique sous le cartouche : l'axe −1000 → 2050 en pleine
   largeur, la vie de l'entité posée dessus. Discrète par construction — un
   filet, sept repères, un segment — mais à la charte : l'accent orange pour
   la période, les gris de la page pour le reste. Le dessin vit dans
   /assets/echelle/echelle-temps.js ; ici, seulement l'encre.

   HORS de tout scope, à dessein : la frise s'affiche sur la page fiche
   (.mathfiche) ET dans le panneau de /mathematiques/ (.mathpage). Scopée à
   l'un des deux, elle tombait dans l'autre sur l'encre par défaut du SVG —
   du noir, invisible sur le fond noir du site. */
.mf-echelle {
  margin: -8px 0 24px;
  max-width: 100%;
}
.mf-echelle svg {
  display: block;
  width: 100%;
}
.mf-echelle .et-axe {
  stroke: rgba(255, 255, 255, 0.1);
  stroke-width: 1;
}
.mf-echelle .et-grad {
  stroke: rgba(255, 255, 255, 0.16);
  stroke-width: 1;
}
.mf-echelle .et-annee {
  fill: var(--mut, #9aa3b2);
  font-size: 10px;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}

.mathpage {
  /* ── En-tête ── */
}
.mathpage .mp-h1 {
  margin: 0 0 8px;
  font-size: clamp(24px, 3.4vw, 34px);
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--cream);
}
.mathpage .mp-chapo {
  margin: 0 0 22px;
  max-width: 64ch;
  color: var(--mut);
  font-size: 15.5px;
  line-height: 1.65;
}
.mathpage {
  /* ── Grille des entrées ──
     `auto-fill` plutôt qu'un nombre fixe de colonnes : de trois colonnes sur
     écran large à une seule sur téléphone, sans point de rupture déclaré. */
}
.mathpage .mp-grille {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 16px;
  margin: 0 0 36px;
  padding: 0;
  list-style: none;
}
.mathpage {
  /* ── Les vignettes d'entrée ──
     Même composant que sur /carte/, repris ici parce qu'il y est scopé à
     `.cartepage` : sans cette reprise, les tuiles s'affichaient NUES — titre,
     texte et bouton empilés sans cadre ni respiration. Le dessin appartient à
     la charte, pas à une page. */
}
.mathpage .refcard {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.mathpage .refcard:hover {
  border-color: var(--acc);
  transform: translateY(-2px);
}
.mathpage .refcard__t {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: var(--cream);
  letter-spacing: 0.01em;
}
.mathpage .refcard__x {
  margin: 0;
  color: var(--txt);
  font-size: 14.5px;
  line-height: 1.6;
  flex: 1;
}
.mathpage .refcard {
  /* La limite de la carte, en retrait : elle doit être lue, pas subie. */
}
.mathpage .refcard__n {
  margin: 0;
  padding-left: 10px;
  border-left: 2px solid var(--line);
  color: var(--mut);
  font-size: 13px;
  line-height: 1.55;
}
.mathpage .refcard__b {
  align-self: flex-start;
  margin-top: 4px;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--txt);
  border-radius: 8px;
  padding: 8px 14px;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.mathpage .refcard__b:hover {
  border-color: var(--acc);
  color: var(--acc);
}
.mathpage {
  /* ── Exploration : frise à gauche, résultats à droite ──
     La frise est un SÉLECTEUR : l'empiler au-dessus des résultats obligeait à
     remonter la page après chaque clic. `start` sur l'alignement pour que la
     colonne de gauche ne s'étire pas à la hauteur d'une liste de soixante
     entrées. */
}
.mathpage .mp-explorer {
  display: grid;
  grid-template-columns: minmax(260px, 340px) 1fr;
  gap: 28px;
  align-items: start;
  margin: 0 0 30px;
}
@media (max-width: 900px) {
  .mathpage .mp-explorer {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.mathpage {
  /* ── La frise ── */
}
.mathpage .mp-frise {
  margin: 0;
  /* Elle suit le lecteur quand il parcourt une longue liste : le sélecteur
     reste sous la main. Désactivé en une colonne, où « collant » n'a plus de
     sens. */
}
@media (min-width: 901px) {
  .mathpage .mp-frise {
    position: sticky;
    top: 16px;
  }
}
.mathpage .mp-frise__t {
  margin: 0 0 14px;
  font-size: 17px;
  font-weight: 700;
  color: var(--cream);
}
.mathpage .mp-tranches {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.mathpage .mp-tranche__b {
  display: grid;
  /* Le libellé au plus large possible, la jauge élastique, le compte aligné à
     droite en chiffres de largeur fixe pour que les nombres s'empilent. */
  /* En colonne étroite, le libellé prend ce qu'il peut, la jauge se réduit et
     le compte reste lisible : trois colonnes qui se partagent 300 px. */
  grid-template-columns: minmax(0, 1fr) minmax(40px, 80px) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease;
}
.mathpage .mp-tranche__b:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.05);
}
.mathpage .mp-tranche__b:focus-visible {
  outline: 2px solid var(--cream);
  outline-offset: 2px;
}
.mathpage .mp-tranche__b.is-actif {
  background: rgba(255, 255, 255, 0.09);
}
.mathpage .mp-tranche__b:disabled {
  cursor: default;
  opacity: 0.45;
}
.mathpage .mp-tranche__l {
  font-size: 14px;
  color: var(--cream);
}
.mathpage .mp-tranche__jauge {
  display: block;
  height: 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.07);
  overflow: hidden;
}
.mathpage .mp-tranche__barre {
  display: block;
  height: 100%;
  width: var(--part, 0%);
  border-radius: 4px;
  background: var(--cream);
  opacity: 0.75;
}
.mathpage .mp-tranche__n {
  font-size: 13px;
  color: var(--mut);
  font-variant-numeric: tabular-nums;
  min-width: 3ch;
  text-align: right;
}
.mathpage {
  /* « Période inconnue » : dans la liste, mais détachée de l'axe.
     Un filet la sépare des tranches datées, et sa jauge reste VIDE — une barre
     lui donnerait une position sur l'axe qu'elle n'a pas. */
}
.mathpage .mp-tranche--sansdate {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.mathpage .mp-tranche--sansdate .mp-tranche__l {
  color: var(--mut);
  font-style: italic;
}
.mathpage .mp-tranche--sansdate .mp-tranche__jauge {
  background: transparent;
}
.mathpage {
  /* La légende de la frise : présente pour qui s'interroge sur les barres,
     assez discrète pour ne pas concurrencer le sélecteur qu'elle annote. */
}
.mathpage .mp-frise__legende {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--mut);
  font-style: italic;
}
.mathpage {
  /* ── Résultats chargés à la demande ── */
}
.mathpage .mp-resultats__t {
  margin: 22px 0 12px;
  font-size: 16px;
  font-weight: 700;
  color: var(--cream);
}
.mathpage .mp-invite {
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--mut);
  font-style: italic;
}
.mathpage .mp-liste {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 2px 24px;
}
.mathpage {
  /* Deux niveaux : le nom, puis ce qui le qualifie. Une seule ligne donnait
     « Plimpton 322Artefact1799 av. J.-C. » — et même espacée, elle restait
     illisible : trois informations de natures différentes s'y suivaient sans
     hiérarchie. */
}
.mathpage .mp-item {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.mathpage .mp-item--vide {
  color: var(--mut);
  font-style: italic;
  border: 0;
}
.mathpage .mp-item__n {
  color: var(--cream);
  font-size: 14.5px;
  text-decoration: none;
}
.mathpage .mp-item__n:hover {
  text-decoration: underline;
}
.mathpage .mp-item__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  font-size: 12px;
  color: var(--mut);
}
.mathpage .mp-item__d {
  font-variant-numeric: tabular-nums;
  /* La date se distingue du type sans crier : elle est la seule information
     de la ligne qu'on vient chercher. */
  color: var(--cream);
  opacity: 0.82;
}
.mathpage .mp-item__m {
  font-size: 10.5px;
  padding: 0 5px;
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.mathpage {
  /* Le tag « PDF » du mode œuvres : même gabarit que .mp-item__m, mais teinté
     à l'accent — il signale une possibilité (télécharger la numérisation), pas
     une réserve comme « date contestée ». */
}
.mathpage .mp-item__pdf {
  font-size: 10.5px;
  padding: 0 5px;
  border-radius: 3px;
  border: 1px solid var(--acc, #f28c28);
  color: var(--acc, #f28c28);
}
.mathpage .mp-plus {
  margin: 16px 0 0;
  text-align: center;
}
.mathpage .mp-plus__b {
  padding: 8px 18px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  background: transparent;
  color: var(--cream);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.mathpage .mp-plus__b:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.06);
}
.mathpage .mp-plus__b:disabled {
  opacity: 0.5;
  cursor: default;
}
.mathpage {
  /* Mouvement réduit : on respecte le réglage système. */
}
@media (prefers-reduced-motion: reduce) {
  .mathpage .mp-tranche__b {
    transition: none;
  }
}

/* ─────────────────────────────────────────────────────────────────────
   Fiche d'entité — /mathematiques/<slug>
   ───────────────────────────────────────────────────────────────────── */
.mathfiche .mf-fil {
  margin: 0 0 10px;
  font-size: 13px;
  color: var(--mut);
}
.mathfiche .mf-fil a {
  color: var(--mut);
}
.mathfiche {
  /* Le nom et le type sur la même ligne, le type poussé au bord opposé : il
     qualifie la fiche sans disputer la vedette au nom. Sur un écran étroit, il
     passe simplement à la ligne — c'est une étiquette, pas une colonne. */
}
.mathfiche .mf-tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 16px;
  /* Bornée à la largeur du cartouche : sur un grand écran, l'étiquette de type
     partait sinon à cinquante centimètres du nom qu'elle qualifie. */
  max-width: 56ch;
}
.mathfiche .mf-h1 {
  margin: 0 0 6px;
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  color: var(--cream);
}
.mathfiche .mf-type {
  padding: 2px 9px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  font-size: 11.5px;
  color: var(--mut);
  text-transform: lowercase;
  white-space: nowrap;
}
.mathfiche {
  /* ── Le cartouche d'identité ──
     Un état civil, pas une section : ni titre ni fond, seulement un filet qui
     le sépare de la description et la même grille libellé/valeur que le reste
     de la fiche. La régularité fait le travail — d'une fiche à l'autre, les
     rubriques tombent au même endroit, et l'œil sait où chercher. */
}
.mathfiche .mf-ident {
  margin: 0 0 24px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  max-width: 56ch;
}
.mathfiche .mf-ident__l {
  display: grid;
  grid-template-columns: minmax(84px, 9em) 1fr;
  gap: 10px;
  padding: 4px 0;
  align-items: baseline;
}
.mathfiche .mf-ident__r {
  margin: 0;
  font-size: 13px;
  color: var(--mut);
  text-transform: lowercase;
}
.mathfiche .mf-ident__v {
  margin: 0;
  font-size: 14.5px;
  color: var(--cream);
}
.mathfiche .mf-ident__v a {
  color: var(--cream);
  text-decoration: none;
}
.mathfiche .mf-ident__v a:hover {
  text-decoration: underline;
}
.mathfiche {
  /* Les formes du nom, côte à côte et sans hiérarchie visuelle marquée :
     « al-Khwārizmī » et « Algoritmi » désignent le même homme. */
}
.mathfiche .mf-formes {
  margin: 0 0 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 15px;
  color: var(--mut);
}
.mathfiche .mf-forme--tr {
  font-style: italic;
}
.mathfiche .mf-chapo {
  margin: 0 0 22px;
  max-width: 64ch;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--mut);
}
.mathfiche .mf-bloc {
  margin: 0 0 26px;
}
.mathfiche .mf-h2 {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 700;
  color: var(--cream);
}
.mathfiche {
  /* Le libellé d'une relation (« est né à ») : même rôle et même corps que
     l'intitulé d'une date, puisqu'il occupe la même colonne de gauche. */
}
.mathfiche .mf-rel__r {
  margin: 0;
  font-size: 13px;
  color: var(--mut);
  text-transform: lowercase;
}
.mathfiche {
  /* ── Dates ──
     Une VARIANTE (version concurrente non retenue) est en retrait et atténuée :
     présente, consultable, mais visiblement seconde. */
}
.mathfiche .mf-dates {
  margin: 0;
}
.mathfiche .mf-date {
  display: grid;
  /* 9em suffit à « naissance et mort », le plus long des intitulés fusionnés,
     et laisse à la valeur de quoi tenir sur une ligne dans la colonne étroite
     où le bloc est posé — « VIIIe siècle av. J.-C. » se coupait en deux. */
  grid-template-columns: minmax(84px, 9em) 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.mathfiche .mf-date.is-variante {
  opacity: 0.68;
  padding-left: 14px;
  border-left: 2px solid rgba(255, 255, 255, 0.12);
}
.mathfiche .mf-date__r {
  margin: 0;
  font-size: 13px;
  color: var(--mut);
}
.mathfiche .mf-date__v {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  font-size: 14px;
  color: var(--cream);
}
.mathfiche .mf-marque {
  font-size: 11px;
  padding: 1px 6px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--mut);
  /* La contestation se voit sans crier : un liseré, pas une alarme. */
}
.mathfiche .mf-marque--conteste {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.22);
}
.mathfiche .mf-marque {
  /* Une source infirmée est un cran plus net qu'une simple divergence : la
     valeur n'est pas discutée, elle est fausse. Le trait barré le dit sans
     qu'il faille lire l'étiquette, et la ligne reste pâle par ailleurs. */
}
.mathfiche .mf-marque--infirmee {
  background: none;
  border: 1px dashed rgba(255, 255, 255, 0.28);
  text-decoration: line-through;
  text-decoration-color: rgba(255, 255, 255, 0.35);
}
.mathfiche {
  /* ── Liens ── */
}
.mathfiche .mf-liens, .mathfiche .mf-mots, .mathfiche .mf-sources, .mathfiche .mf-ids {
  margin: 0;
  padding: 0;
  list-style: none;
}
.mathfiche .mf-lien {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  padding: 3px 0;
  font-size: 14px;
}
.mathfiche .mf-lien a {
  color: var(--cream);
  text-decoration: none;
}
.mathfiche .mf-lien a:hover {
  text-decoration: underline;
}
.mathfiche .mf-lien__d {
  font-size: 12.5px;
  color: var(--mut);
}
.mathfiche .mf-mots li {
  padding: 3px 0;
  font-size: 14px;
}
.mathfiche .mf-mot__n {
  font-size: 12.5px;
  color: var(--mut);
}
.mathfiche {
  /* ── Sources ── */
}
.mathfiche .mf-bloc--sources {
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.mathfiche .mf-sources li, .mathfiche .mf-ids li {
  padding: 3px 0;
  font-size: 13px;
  color: var(--mut);
}
.mathfiche .mf-sources li a, .mathfiche .mf-ids li a {
  color: var(--mut);
}
.mathfiche .mf-ids {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin-top: 8px;
}
.mathfiche .mf-lic, .mathfiche .mf-recup {
  font-size: 11.5px;
  opacity: 0.8;
}
.mathfiche .mf-vide {
  margin: 0;
  font-size: 15px;
  color: var(--mut);
}
.mathfiche .mf-vide a {
  color: var(--cream);
}

/* Les formules qu'une personne a nommées, trouvées ou démontrées.
   Le nom de l'objet et le verbe tiennent la ligne du dessus ; l'énoncé occupe
   la sienne, en retrait, avec un filet à gauche qui le rattache à son titre
   sans l'encadrer. Le débordement horizontal est prévu : une formule composée
   par KaTeX ne se coupe pas, et vaut mieux défiler qu'écraser la page. */
.mathfiche .mf-fmls {
  margin: 0;
  padding: 0;
}
.mathfiche .mf-fml {
  padding: 8px 0 10px 12px;
  border-left: 2px solid rgba(255, 255, 255, 0.18);
}
.mathfiche .mf-fml + .mathfiche .mf-fml {
  margin-top: 10px;
}
.mathfiche .mf-fml__t {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  font-size: 14px;
}
.mathfiche .mf-fml__t a {
  color: var(--cream);
}
.mathfiche .mf-fml__v {
  font-size: 12px;
  color: var(--mut);
}
.mathfiche .mf-fml__f {
  margin: 6px 0 0;
  overflow-x: auto;
  overflow-y: hidden;
  font-size: 15px;
  /* Sans JavaScript, le LaTeX reste en clair : il ne doit pas déborder. */
  word-break: break-word;
}
.mathfiche .mf-fml__f .katex {
  word-break: normal;
}

/* Divergences entre sources — affichées, jamais arbitrées en silence. */
.mathfiche .mf-conflits {
  margin: 0;
  padding: 0;
  list-style: none;
}
.mathfiche .mf-conflit {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  padding: 5px 0 5px 12px;
  border-left: 2px solid rgba(255, 255, 255, 0.18);
  font-size: 13.5px;
}
.mathfiche .mf-conflit__n {
  font-size: 12px;
  color: var(--mut);
  text-transform: lowercase;
}
.mathfiche .mf-conflit__v {
  color: var(--cream);
  font-variant-numeric: tabular-nums;
}
.mathfiche .mf-conflit__a {
  font-size: 12.5px;
  color: var(--mut);
  font-style: italic;
}
.mathfiche .mf-conflit__x {
  margin: 10px 0 0;
  font-size: 12.5px;
  color: var(--mut);
}

/* Le classement (« appartient à ») a quitté le pied du bloc « Liens » pour la
   ligne « domaine » du cartouche : c'est un fait d'identité, pas une piste
   d'exploration. */
.mathfiche {
  /* Sources : un bloc de référence, pas un bloc de lecture. Il se tient en fin
     de fiche, dans un corps plus petit et sur deux colonnes quand la place le
     permet — sa fonction est d'être vérifiable, pas d'être lu en continu. */
}
.mathfiche .mf-bloc--sources .mf-sources {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 2px 20px;
}
.mathfiche .mf-bloc--sources .mf-sources li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  padding: 4px 0;
}
.mathfiche .mf-lic {
  padding: 0 5px;
  border-radius: 3px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  font-size: 10.5px;
}
.mathfiche {
  /* ── Les groupes de liens ──
     Une relation par ligne : le verbe à gauche, ce qu'il relie à droite. La
     grille reprend celle des dates, à la ligne de base près, pour que les deux
     blocs se lisent de la même façon quand ils sont côte à côte. */
}
.mathfiche .mf-rels {
  margin: 0;
}
.mathfiche .mf-rel {
  display: grid;
  grid-template-columns: minmax(90px, 10em) 1fr;
  gap: 10px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  align-items: baseline;
}
.mathfiche .mf-rel__v {
  margin: 0;
}
.mathfiche {
  /* Par défaut la liste se serre : quelques liens tiennent sur une ligne, et
     « est né à → Inde ancienne » cesse d'occuper un bloc entier. */
}
.mathfiche .mf-liens {
  display: flex;
  flex-wrap: wrap;
  gap: 0 18px;
}
.mathfiche {
  /* Au-delà de quatre entrées, la ligne serrée devient un pavé illisible : on
     repasse en colonnes alignées. Le seuil est LU dans le contenu — `:has()`
     compte les éléments — plutôt que porté par une classe que le gabarit
     aurait dû calculer. Les navigateurs sans `:has()` gardent la version
     serrée, qui reste correcte. */
}
.mathfiche .mf-liens:has(> li:nth-child(5)) {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0 20px;
}

/* ── Recherche dans les travaux ──
   Placée haut, avant les tuiles : le corpus compte des milliers d'entrées, et
   qui sait ce qu'il cherche ne doit pas avoir à choisir une période d'abord. */
.mathpage {
  /* ── Recherche ──
     Le champ était trop discret pour qu'on le voie : il porte maintenant un
     bouton d'accent, et le tout occupe la pleine largeur de la colonne de
     texte. Les résultats s'affichent dans la colonne d'exploration, pas dans
     un menu flottant — on peut lire une description longue sans qu'il se
     referme. */
}
.mathpage .mp-rech {
  margin: 0 0 30px;
  max-width: 720px;
}
.mathpage .mp-rech__ligne {
  display: flex;
  gap: 10px;
}
.mathpage .mp-rech__c {
  flex: 1;
  min-width: 0;
  padding: 12px 15px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  color: var(--cream);
  font: inherit;
  font-size: 15.5px;
}
.mathpage .mp-rech__c::placeholder {
  color: var(--mut);
  opacity: 0.75;
}
.mathpage .mp-rech__c:focus {
  outline: none;
  border-color: var(--acc);
  box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.16);
}
.mathpage .mp-rech__b {
  flex: 0 0 auto;
  padding: 12px 22px;
  border: 0;
  border-radius: 10px;
  background: var(--acc);
  color: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: filter 0.15s ease;
}
.mathpage .mp-rech__b:hover {
  filter: brightness(1.1);
}
.mathpage .mp-rech__b:focus-visible {
  outline: 2px solid var(--cream);
  outline-offset: 2px;
}
.mathpage .mp-rech__a {
  margin: 8px 0 0;
  font-size: 12.5px;
  color: var(--mut);
}

/* Étiquette réservée aux lecteurs d'écran. Le champ de recherche porte un
   texte indicatif visible, mais un « placeholder » n'est pas une étiquette :
   il disparaît à la saisie et n'est pas annoncé de façon fiable. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* L'énoncé en notation : donné en LaTeX brut, dans une chasse fixe. On ne
   compose pas les mathématiques ici — charger un moteur de rendu sur toutes les
   fiches pour les 10 % qui portent une formule coûterait plus qu'il ne rend. */
.mathfiche .mf-formule {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card);
  overflow-x: auto;
}
.mathfiche .mf-formule code {
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 15px;
  color: var(--cream);
  white-space: pre;
}

/* Mention de traduction : lisible sans peser. Le lecteur doit savoir qu'un
   texte a été traduit — automatiquement ou non — pour juger de ce qu'il lit. */
.mathfiche .mf-trad {
  margin: -14px 0 22px;
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--mut);
}
.mathfiche .mf-trad__o {
  display: block;
  margin-top: 2px;
  font-style: italic;
  opacity: 0.82;
}

/* La description d'une entrée de liste passe à la ligne : c'est elle qui
   permet de distinguer « Analyse » de « Analyse complexe » sans ouvrir. */
.mathpage .mp-item__x {
  flex-basis: 100%;
  font-size: 12px;
  line-height: 1.5;
  color: var(--mut);
  opacity: 0.9;
}

/* La notice : le seul texte de la fiche qui soit ÉCRIT, et non importé.
   Un peu plus large et plus aéré que le reste — c'est ce qu'on vient lire. */
.mathfiche .mf-notice {
  margin: 0 0 26px;
  max-width: 68ch;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--txt);
}

/* ─────────────────────────────────────────────────────────────────────
   Composants repris du dictionnaire — /!\ définis dans
   assets/pages/dictionnaire/dictionnaire.scss, feuille qui n'est pas chargée
   ici. On les reprend plutôt que d'importer la feuille entière, qui amènerait
   avec elle la mise en page de la page d'accueil.

   Ce sont les MÊMES gestes que sur le dictionnaire : écouter une fiche,
   agrandir le texte. Les redessiner aurait obligé le lecteur à les
   réapprendre d'une page à l'autre.
   ───────────────────────────────────────────────────────────────────── */
.dico-panel {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 26px 28px;
  min-height: 160px;
}
.dico-panel__empty {
  color: var(--mut);
  font-size: 16px;
  padding: 24px 4px;
  text-align: center;
}

.dico-ecouter {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: none;
  align-self: center;
  padding: 6px 12px 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
  color: var(--mut);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.12s, color 0.12s;
}
.dico-ecouter:hover {
  border-color: var(--acc2);
  color: var(--cream);
}
.dico-ecouter {
  /* Triangle de lecture, dessiné en bordures : pas d'image à charger. */
}
.dico-ecouter__ico {
  width: 0;
  height: 0;
  border-left: 9px solid currentColor;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  margin-left: 2px;
}
.dico-ecouter {
  /* Pendant la lecture : le triangle devient un carré d'arrêt. */
}
.dico-ecouter.is-lecture {
  border-color: var(--acc);
  color: var(--acc);
}
.dico-ecouter.is-lecture .dico-ecouter__ico {
  width: 10px;
  height: 10px;
  border: 0;
  margin-left: 0;
  background: currentColor;
  border-radius: 2px;
}

.dico-confort-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
  color: var(--mut);
  cursor: pointer;
  transition: border-color 0.12s, color 0.12s, background 0.12s;
}
.dico-confort-btn:hover {
  border-color: var(--acc2);
  color: var(--cream);
}
.dico-confort-btn:focus-visible {
  outline: 2px solid var(--acc2);
  outline-offset: 2px;
}
.dico-confort-btn__ico {
  display: block;
}
.dico-confort-btn {
  /* État actif : le confort est en cours, le bouton s'allume à l'accent. */
}
.dico-confort-btn.is-on {
  border-color: var(--acc);
  color: var(--acc);
  background: rgba(255, 102, 0, 0.1);
}

/* Le panneau de fiche dans la colonne de résultats. */
.mathpage .mp-panel {
  margin-top: 4px;
}
.mathpage .mp-panel__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.mathpage {
  /* Le retour prend la place restante : les deux réglages filent à droite,
     comme dans l'en-tête de fiche du dictionnaire. */
}
.mathpage .mp-panel__retour {
  flex: 1 1 auto;
  text-align: left;
  padding: 6px 0;
  border: 0;
  background: transparent;
  color: var(--mut);
  font: inherit;
  font-size: 13.5px;
  cursor: pointer;
}
.mathpage .mp-panel__retour:hover {
  color: var(--cream);
  text-decoration: underline;
}
.mathpage {
  /* Dans le panneau, la fiche n'a plus besoin de son fil d'Ariane ni de sa
     propre marge : le panneau les porte. */
}
.mathpage .mp-panel__corps .mf-fil {
  display: none;
}
.mathpage .mp-panel__corps .mf-h1 {
  margin-top: 0;
}

/* ── Mode lecture confortable ──
   Valeurs du critère WCAG 1.4.12 : interligne ≥ 1.5, lettres ≥ 0.12em,
   mots ≥ 0.16em. Cantonné au PANNEAU : la liste et le moteur, denses par
   nature, ne gagneraient rien à s'étirer. */
.mathpage.is-confort .mp-panel {
  font-size: 1.08em;
}
.mathpage.is-confort .mf-notice,
.mathpage.is-confort .mf-chapo,
.mathpage.is-confort .mf-date__v,
.mathpage.is-confort .mf-lien {
  line-height: 1.7;
  letter-spacing: 0.05em;
  word-spacing: 0.16em;
}
.mathpage.is-confort .mf-notice {
  font-size: 18px;
}
.mathpage.is-confort .mf-h1 {
  font-size: 32px;
}

/* ── Dates et liens, côte à côte ──
   Deux lectures parallèles : QUAND d'un côté, AVEC QUOI de l'autre. Empilés,
   il fallait faire défiler les dates — toujours courtes — pour atteindre les
   liens, qui sont ce qu'on vient explorer.

   LE NOMBRE DE COLONNES DÉPEND DU CONTENEUR, PAS DE L'ÉCRAN.

   Le même bloc s'affiche à deux endroits : en pleine page (~1 130 px) et dans
   le panneau latéral (~740 px). Une media query interrogeant la fenêtre ne sait
   rien de cette différence — j'avais donc forcé une colonne dans le panneau en
   le croyant étroit, alors qu'il a la place pour deux. Mesuré : 738 px.

   Une container query pose la vraie question : de combien dispose CE bloc-ci.
   Il décide seul, où qu'on le mette, et un futur troisième emplacement
   fonctionnera sans qu'on y touche. */
.mathfiche,
.mathpage .mp-panel__corps {
  container-type: inline-size;
  container-name: fiche;
}

.mf-cols {
  display: grid;
  grid-template-columns: 1fr; /* par défaut : une colonne, la plus sûre */
  gap: 8px 34px;
  align-items: start;
  margin: 0 0 26px;
}
.mf-cols > .mf-bloc {
  margin-bottom: 18px;
}

/* 620 px : en dessous, la colonne des dates descendrait sous 200 px utiles et
   les intitulés de rôle passeraient à la ligne. */
@container fiche (min-width: 620px) {
  /* Deux colonnes SEULEMENT si la gauche a de quoi être remplie. Le cartouche
     ayant pris les dates de vie, une fiche sobre n'a plus de bloc « Dates » :
     les liens se retrouvaient poussés à droite d'une colonne vide. */
  .mf-cols:has(> [aria-labelledby=mfDates], > [aria-labelledby=mfConflits]) {
    grid-template-columns: minmax(190px, 280px) 1fr;
    /* Les dates et leurs divergences à gauche, les liens à droite sur toute la
       hauteur : les trois sections ne s'alignent pas rangée par rangée. */
  }
  .mf-cols:has(> [aria-labelledby=mfDates], > [aria-labelledby=mfConflits]) > [aria-labelledby=mfDates] {
    grid-column: 1;
  }
  .mf-cols:has(> [aria-labelledby=mfDates], > [aria-labelledby=mfConflits]) > [aria-labelledby=mfConflits] {
    grid-column: 1;
  }
  .mf-cols:has(> [aria-labelledby=mfDates], > [aria-labelledby=mfConflits]) > [aria-labelledby=mfLiens] {
    grid-column: 2;
    grid-row: 1/span 2;
  }
}
/* Repli pour les navigateurs sans container queries : on retombe sur la
   largeur de fenêtre, moins juste mais mieux que rien. */
@supports not (container-type: inline-size) {
  @media (min-width: 1000px) {
    .mathfiche .mf-cols {
      grid-template-columns: minmax(190px, 280px) 1fr;
    }
    .mathfiche .mf-cols > [aria-labelledby=mfLiens] {
      grid-column: 2;
      grid-row: 1/span 2;
    }
  }
}
/* Le texte des travaux : même corps que la notice, mais distinct d'elle par son
   intertitre. Les deux se lisent à la suite — la vie, puis l'œuvre. */
.mathfiche .mf-travaux {
  max-width: 68ch;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--txt);
}

/* ─────────────────────────────────────────────────────────────────────
   Le mini-cours — « Pour comprendre »

   Seul bloc de la fiche qui EXPLIQUE au lieu de rapporter. Il est posé juste
   sous la définition, et se distingue visuellement du reste : encadré, fond de
   carte, un filet d'accent à gauche. Ce n'est pas de la décoration — la fiche
   mêle des données importées et un texte pédagogique original, et le lecteur
   doit voir d'un coup d'œil qu'il change de registre.
   ───────────────────────────────────────────────────────────────────── */
.mathfiche .mf-cours {
  /* La boîte suit le texte qu'elle contient. Bornée au seul .mc, elle s'étirait
     sur toute la largeur de la fiche et laissait un grand vide encadré à droite. */
  max-width: 72ch;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--acc, #4a9eda);
  border-radius: 10px;
  background: var(--card);
}

.mathfiche .mc {
  max-width: 68ch;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--txt);
}
.mathfiche .mc p {
  margin: 0 0 14px;
}
.mathfiche .mc p:last-child {
  margin-bottom: 0;
}
.mathfiche .mc {
  /* Les intertitres du cours ne reprennent pas les étiquettes de la fiche :
     celles-ci sont en bas de casse et en gris, faites pour nommer une relation
     ou un rôle, pas pour ouvrir une partie d'un texte suivi. */
}
.mathfiche .mc .mc-h3 {
  margin: 22px 0 8px;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--cream);
  text-transform: none;
  letter-spacing: 0;
}
.mathfiche .mc > .mc-h3:first-child {
  margin-top: 0;
}
.mathfiche .mc ul {
  margin: 0 0 14px;
  padding-left: 20px;
}
.mathfiche .mc li {
  margin: 0 0 6px;
}
.mathfiche .mc {
  /* Formule en bloc : centrée, détachée du fil. Elle défile horizontalement
     plutôt que de déborder — une longue égalité ne doit pas élargir la page. */
}
.mathfiche .mc .mc-formule {
  margin: 16px 0;
  padding: 10px 4px;
  text-align: center;
  overflow-x: auto;
  /* Avant composition par KaTeX, c'est du LaTeX brut : la chasse fixe le rend
     lisible, et le reste lisible si le JavaScript ne s'exécute jamais. */
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 14px;
  color: var(--cream);
}
.mathfiche .mc {
  /* Une fois composé, KaTeX remplace le contenu : la chasse fixe n'a plus lieu
     d'être et la taille revient à celle d'un texte mathématique. */
}
.mathfiche .mc .mc-formule .katex-display {
  margin: 0;
  font-size: 1.12em;
}
.mathfiche .mc .katex {
  color: var(--cream);
}
.mathfiche .mc {
  /* Diagramme : même contrat que la formule en bloc. Avant composition par
     Mermaid, le <pre> montre la SOURCE — chasse fixe, retours à la ligne
     préservés ; après, il porte un SVG qui ne doit jamais élargir la page. */
}
.mathfiche .mc .mc-mermaid {
  margin: 16px 0;
  padding: 10px 4px;
  overflow-x: auto;
  text-align: center;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 1.5;
  color: var(--cream);
  white-space: pre;
}
.mathfiche .mc .mc-mermaid svg {
  max-width: 100%;
  height: auto;
}
.mathfiche .mc {
  /* Figure drawio : le XML mxfile n'est pas fait pour être lu — avant
     composition on le montre en tout petit, replié ; après, le viewer pose
     son SVG sur un fond clair, car les traits d'une figure sont noirs. */
}
.mathfiche .mc .mc-drawio {
  margin: 16px 0;
  padding: 12px;
  border-radius: 8px;
  background: #f4f2ec;
  color: #333;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 10px;
  line-height: 1.3;
  max-height: 480px;
  overflow: auto;
  word-break: break-all;
}
.mathfiche .mc .mc-drawio svg {
  max-width: 100%;
  height: auto;
}
.mathfiche .mc {
  /* Graphique jsxgraph : même contrat que la figure drawio — le JSON déclaratif
     n'est pas fait pour être lu, on le montre replié en tout petit tant que le
     viewer n'a pas composé ; lui aussi pose sa planche sur fond clair. */
}
.mathfiche .mc .mc-jsxgraph {
  margin: 16px 0;
  padding: 12px;
  border-radius: 8px;
  background: #f4f2ec;
  color: #333;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 10px;
  line-height: 1.3;
  max-height: 480px;
  overflow: auto;
  word-break: break-all;
}

/* Le titre du cours et son étiquette d'origine sur la même ligne. Le cours
   n'est pas dérivé des sources importées, et la fiche doit le dire — mais une
   phrase en pied de bloc pesait plus que l'information ne vaut. L'étiquette le
   dit d'un coup d'œil, au même endroit et dans la même forme que « CC0-1.0 »
   ou « contestée » ailleurs sur la page ; le survol donne la phrase entière,
   qui reste lisible aux lecteurs d'écran. */
.mathfiche .mc-tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  /* La marge passe du titre à la ligne qui le porte : laissée sur le h2, elle
     poussait l'étiquette vers le bas ; retirée sans être reprise ici, le
     premier intertitre du cours venait coller au titre. */
  margin-bottom: 12px;
}
.mathfiche .mc-tete .mf-h2 {
  margin-bottom: 0;
}

.mathfiche .mc-tag {
  padding: 1px 7px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 400;
  color: var(--mut);
  text-transform: lowercase;
  white-space: nowrap;
  cursor: help;
}

/* ── Ce qui subsiste d'une œuvre, et où le consulter ────────────────────
   Deux blocs qui n'existaient pas : le corpus décrivait des œuvres sans
   jamais dire par quoi elles nous sont parvenues. Ils se lisent comme une
   fiche de catalogue — un objet par ligne, son lieu, sa cote — et non comme
   un paragraphe, parce que c'est ainsi qu'on les consulte. */
.mf-temoins__l,
.mf-editions__l {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.mf-temoin,
.mf-edition {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border-left: 2px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.03);
  border-radius: 0 4px 4px 0;
}

.mf-temoin__n,
.mf-edition__n {
  font-size: 15px;
  color: var(--cream);
}

/* Le lieu et la cote sur leur propre ligne : ce sont eux qu'on recopie pour
   écrire au conservateur, et les noyer dans la description les perdrait. */
.mf-temoin__ou,
.mf-edition__c {
  font-size: 13px;
  color: var(--mut);
  /* Un lieu de conservation inconnu se dit, mais ne s'affiche pas comme un
     fait acquis. */
}
.mf-temoin__ou--flou,
.mf-edition__c--flou {
  font-style: italic;
  opacity: 0.75;
}

.mf-temoin__d,
.mf-edition__d {
  font-size: 13px;
  color: var(--mut);
}

.mf-edition__c a + a {
  margin-left: 12px;
}

/* Un titre cité dans une notice mène à sa fiche. Souligné en pointillé plutôt
   qu'en plein : le lien se remarque à la lecture sans hacher le paragraphe. */
.mf-notice__lien {
  color: var(--cream);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 3px;
}
.mf-notice__lien:hover, .mf-notice__lien:focus-visible {
  text-decoration-style: solid;
}

/* Le domaine public se signale sans se vanter : un liseré vert sourd, pas une
   décoration. C'est une information, pas une récompense. */
.mf-marque--dp {
  border: 1px solid rgba(120, 200, 140, 0.34);
  color: rgba(150, 215, 170, 0.92);
  background: rgba(120, 200, 140, 0.07);
}

/* L'avertissement sur les éditions : en retrait, avant la liste qu'il qualifie. */
.mf-editions__droit {
  margin: 0 0 10px;
  padding-left: 10px;
  border-left: 2px solid rgba(255, 255, 255, 0.12);
  font-size: 13px;
  line-height: 1.55;
  color: var(--mut);
}

/* Les copies gardées sur place. Une ligne par fichier, avec son poids : on
   n'ouvre pas un PDF de quatre-vingts mégaoctets sans le savoir. */
.mf-copies__l {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}
.mf-copies__l li {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.mf-copies__l a {
  color: var(--cream);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 3px;
}
.mf-copies__l a:hover, .mf-copies__l a:focus-visible {
  color: var(--acc);
  text-decoration-style: solid;
}

.mf-copies__t {
  font-size: 13px;
  color: var(--mut);
  font-variant-numeric: tabular-nums;
}

.mf-copies__n {
  margin: 10px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--mut);
  font-style: italic;
}

/*# sourceMappingURL=mathematiques.css.map*/