/* ══════════════════════════════════════════════════════════════════════════
   FICHES MATIÈRES PREMIÈRES — styles propres (matieres_fiche.js). Le standard des
   fiches est HÉRITÉ de la fiche métier ; les critères et la liste réutilisent les
   classes des fiches stablecoins (stc-*). ⚠ 1 rem = 10 px sur ce site.
   ══════════════════════════════════════════════════════════════════════════ */
body[data-ca-vue]:not([data-ca-vue="fiche"]) .per-page > #mat-fiche-hote { display: none !important; }
#mat-fiche-hote[hidden] { display: none !important; }
.per-page .mat-root { font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
#mat-fiche-hote .fs-pane > .nrf-deux, #mat-fiche-hote .fs-pane > .fs-grid, #mat-fiche-hote .fs-pane > .pf-racine, #mat-fiche-hote .fs-pane > .mat-note-bas {
  background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important;
}
#mat-fiche-hote .fs-pane > * + * { margin-top: 18px; }
body .per-page #mat-fiche-hote button.stc-lien { background: none !important; border: 0 !important; padding: 0 !important; color: #1B4FD8 !important;
  font-size: 13px !important; font-weight: 600 !important; cursor: pointer; min-height: 0 !important; }
.per-page .mat-ic { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 12px; font-size: 19px; }
.per-page .stc-l-nom .mat-ic { border-radius: 7px; font-size: 12px; }
#mat-fiche-hote .mat-unite { font-size: 14px; font-weight: 500; color: #6B6B6B; }
#mat-fiche-hote .mat-pastille { display: flex; align-items: center; gap: 9px; padding: 8px 12px 8px 8px; border: 1px solid; border-radius: 12px; }
#mat-fiche-hote .mat-past-t { display: flex; flex-direction: column; line-height: 1.2; }
#mat-fiche-hote .mat-past-t b { font-size: 14px; font-weight: 700; }
#mat-fiche-hote .mat-past-t em { font-style: normal; font-size: 11px; color: #6B6B6B; }

/* La carte de tension : jauge et lecture à gauche, critères à droite. */
#mat-fiche-hote .mat-t-corps { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 28px; align-items: start; }
#mat-fiche-hote .mat-t-lec b { font-size: 18px; }
#mat-fiche-hote .mat-t-lec b span { font-size: 13px; color: #6B6B6B; font-weight: 500; margin-left: 4px; }
#mat-fiche-hote .mat-t-lec p { margin: 6px 0 0; font-size: 13px; line-height: 1.5; color: #333; }
#mat-fiche-hote .mat-t-crits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 26px; }
#mat-fiche-hote .stc-crit { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 12px; row-gap: 4px; padding: 7px 0; font-size: 13px; border-bottom: 1px solid #F3F3F3; }
#mat-fiche-hote .stc-crit-l { color: #262626; font-weight: 600; }
#mat-fiche-hote .stc-crit-p { text-align: right; color: #9E9E9E; font-size: 11.5px; }
#mat-fiche-hote .stc-crit-v { font-size: 12.5px; color: #4D4D4D; font-variant-numeric: tabular-nums; }
/* Piste 0-100 bleu (détendu) → orange (tendu), un point pour la valeur. */
#mat-fiche-hote .mat-crit-b { position: relative; align-self: center; width: 110px; height: 6px; border-radius: 3px;
  background: linear-gradient(90deg, #BFD3FB, #E7E5E4 50%, #FDD1B3); }
#mat-fiche-hote .mat-crit-b i { position: absolute; top: 50%; width: 11px; height: 11px; margin: -5.5px 0 0 -5.5px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
#mat-fiche-hote .mat-manque { grid-column: 1 / -1; margin: 8px 0 0; font-size: 12px; color: #8A8A8A; }
@media (max-width: 1100px) { #mat-fiche-hote .mat-t-corps { grid-template-columns: minmax(0, 1fr); } #mat-fiche-hote .mat-t-g { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 16px; align-items: center; } }
@media (max-width: 760px) { #mat-fiche-hote .mat-t-crits { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { #mat-fiche-hote .mat-t-g { grid-template-columns: minmax(0, 1fr); } }

/* Graphes. */
#mat-fiche-hote .mat-canvas { position: relative; height: 240px; }
#mat-fiche-hote .fs-card-title .mat-hz { display: inline-flex; gap: 4px; margin-left: auto; }
body .per-page #mat-fiche-hote .mat-hz button.nrf-hz { padding: 2px 9px !important; font-size: 11.5px !important; font-weight: 600 !important; border-radius: 999px !important;
  border: 1px solid rgba(13,13,13,.12); background: #fff; color: #4D4D4D; cursor: pointer; min-height: 0 !important; }
body .per-page #mat-fiche-hote .mat-hz button.nrf-hz.on { border-color: #1B4FD8; color: #1B4FD8; background: rgba(27,79,216,.07); }
#mat-fiche-hote .fs-grid.mat-ratios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
#mat-fiche-hote .fs-grid.mat-ratios > .fs-card { margin: 0 !important; min-width: 0; }
#mat-fiche-hote .fs-grid.mat-ratios > .fs-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (max-width: 1000px) { #mat-fiche-hote .fs-grid.mat-ratios { grid-template-columns: minmax(0, 1fr); } }
#mat-fiche-hote .mat-note-bas { font-size: 12px; color: #6B6B6B; line-height: 1.5; margin: 8px 2px 0; }

/* La liste (vue Indices). */
.per-page .mat-liste { margin-top: 26px; padding: 18px 20px; }
.per-page .mat-lt .mat-fam td { background: #F7F7F8 !important; font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #6B6B6B; cursor: default; }
.per-page .mat-lt .mat-u { color: #8A8A8A; font-size: 12px; }
.per-page .mat-l-t { font-weight: 600; }
.per-page .mat-l-t svg { vertical-align: middle; margin-right: 6px; }
#mat-fiche-hote .mat-crit-large { grid-column: 1 / -1; }
/* Mesure des colonnes du Résumé sans l'étirement des dernières cartes (equilibrer). */
#mat-fiche-hote .stc-mesure .nrf-deux { align-items: flex-start !important; }
#mat-fiche-hote .stc-mesure .nrf-col, #mat-fiche-hote .stc-mesure .nrf-col > * { flex: none !important; height: auto !important; }

/* ══ ENRICHISSEMENT du 01/10/2026 : grammaire NVIDIA, vue dédiée, offre et demande ══ */
/* Ce que c'est (comme la thèse d'un jeton). */
#mat-fiche-hote .mat-these { margin: 14px 0 4px; padding: 13px 15px; border-radius: 10px; background: rgba(27,79,216,.055); border-left: 3px solid #1B4FD8; font-size: 13.5px; line-height: 1.6; color: #23262B; }
#mat-fiche-hote .mat-these-titre { display: block; font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: #1B4FD8; margin-bottom: 5px; font-weight: 600; }
#mat-fiche-hote .mat-puce-crit { background: #FFF4E5 !important; color: #8A4B00 !important; }
/* Résumé en deux colonnes (fs-deux), comme la fiche NVIDIA et la fiche stablecoin. */
#mat-fiche-hote .fs-pane > .fs-deux { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }
#mat-fiche-hote .fs-deux { display: flex; align-items: flex-start; gap: 18px; }
#mat-fiche-hote .fs-col-g, #mat-fiche-hote .fs-col-d { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
#mat-fiche-hote .fs-col-g { flex: 1 1 0%; }
#mat-fiche-hote .fs-col-d { flex: 0 0 42%; max-width: 560px; position: static; }
#mat-fiche-hote .fs-col-g > .fs-card, #mat-fiche-hote .fs-col-d > .fs-card { margin: 0 !important; }
@media (max-width: 1000px) { #mat-fiche-hote .fs-deux { flex-direction: column; } #mat-fiche-hote .fs-col-d { flex: 1 1 auto; width: 100%; max-width: none; } }
/* La note de tension. */
#mat-fiche-hote .mat-note-jauge { flex: 0 0 150px; width: 150px; }
#mat-fiche-hote .mat-note .fs-note-cote b { display: block; font-size: 22px; font-weight: 650; text-transform: none; margin-bottom: 4px; }
#mat-fiche-hote .mat-note-sc { font-style: normal; font-size: 13px; font-weight: 500; color: #6B6B6B; margin-left: 6px; }
#mat-fiche-hote .mat-note .fs-cats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 26px !important; }
#mat-fiche-hote .mat-crit-t .fs-crit-v { font-weight: 600; white-space: nowrap; }
#mat-fiche-hote .mat-crit-t .fs-crit-p { color: #6B6B6B; }
#mat-fiche-hote .mat-cat-lire p { margin: 0; font-size: 12px; line-height: 1.55; color: #5F5F5F; }
@media (max-width: 640px) { #mat-fiche-hote .mat-note .fs-cats { grid-template-columns: minmax(0, 1fr) !important; } }
/* Informations : jamais un libellé mangé par sa valeur. */
#mat-fiche-hote .mat-infos .fs-kv { grid-template-columns: minmax(150px, auto) minmax(0, 1fr); gap: 7px 16px; }
#mat-fiche-hote .mat-infos .fs-kv dt { white-space: nowrap; }
#mat-fiche-hote .mat-infos .fs-kv dd { margin: 0; text-align: right; font-size: 13px; color: #1F1F1F; min-width: 0; overflow-wrap: anywhere; }
#mat-fiche-hote .fs-kv dd.fs-down { color: #C4261F; font-weight: 600; }
#mat-fiche-hote .mat-cours .mat-canvas { height: 230px; }
#mat-fiche-hote .mat-cchips { margin-top: 10px; }
/* Profil : radar + liste. */
#mat-fiche-hote .mat-pls { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
#mat-fiche-hote .mat-pl { display: grid; grid-template-columns: minmax(0, 1fr) 92px 90px 40px; gap: 10px; align-items: center; font-size: 12.5px; }
#mat-fiche-hote .mat-pl-l { color: #333; cursor: help; }
#mat-fiche-hote .mat-pl-v { text-align: right; font-variant-numeric: tabular-nums; color: #1F1F1F; }
#mat-fiche-hote .mat-pl-b { height: 6px; border-radius: 3px; background: rgba(13,13,13,.07); overflow: hidden; }
#mat-fiche-hote .mat-pl-b i { display: block; height: 100%; background: #1B4FD8; border-radius: 3px; }
#mat-fiche-hote .mat-pl-p { text-align: right; color: #8A8A8A; font-variant-numeric: tabular-nums; }
/* Barres « qui pèse ». */
#mat-fiche-hote .mat-barres { display: flex; flex-direction: column; gap: 7px; }
#mat-fiche-hote .mat-bl { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(60px, 1fr) 52px 92px; column-gap: 10px; align-items: center; font-size: 13px; }
#mat-fiche-hote .mat-bl-n { display: flex; align-items: center; gap: 7px; min-width: 0; white-space: nowrap; overflow: hidden; color: #23262B; }
#mat-fiche-hote .mat-bl-n > span:last-child { overflow: hidden; text-overflow: ellipsis; }
#mat-fiche-hote .mat-bl-n .ca-drapeau { flex: 0 0 auto; }
#mat-fiche-hote .mat-bl-b { height: 8px; border-radius: 4px; background: rgba(13,13,13,.06); overflow: hidden; display: flex; }
#mat-fiche-hote .mat-bl-b i { display: block; height: 100%; background: #1B4FD8; border-radius: 4px; }
#mat-fiche-hote .mat-bl-dbl i { border-radius: 0; } #mat-fiche-hote .mat-bl-dbl i.mat-gaz { background: #9CB3F2; }
#mat-fiche-hote .mat-bl-2 { grid-template-columns: minmax(0, 1.25fr) minmax(60px, 1.4fr) 92px; }
#mat-fiche-hote .mat-bl-p { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
#mat-fiche-hote .mat-bl-v { text-align: right; color: #6B6B6B; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
#mat-fiche-hote .mat-bl-reste { color: #8A8A8A; } #mat-fiche-hote .mat-bl-reste .mat-bl-n { color: #8A8A8A; font-style: italic; }
#mat-fiche-hote .mat-ans { font-style: normal; color: #8A4B00; margin-left: 4px; }
#mat-fiche-hote .mat-qui-tete { font-size: 13px; color: #4D4D4D; margin: -2px 0 12px; } #mat-fiche-hote .mat-qui-tete b { font-size: 20px; color: #0D0D0D; margin-right: 4px; }
#mat-fiche-hote .mat-leg { display: flex; gap: 16px; margin-top: 10px; font-size: 12px; color: #4D4D4D; } #mat-fiche-hote .mat-leg i { display: inline-block; width: 12px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
/* Tableaux droits (évolution, chutes, OPEP). */
#mat-fiche-hote .mat-evo { display: flex; flex-direction: column; font-size: 13px; }
#mat-fiche-hote .mat-evo-l { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 10px; padding: 6px 0; border-bottom: 1px solid #F3F3F3; align-items: center; }
#mat-fiche-hote .mat-evo-3 .mat-evo-l { grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(0, 1fr)); }
#mat-fiche-hote .mat-evo-5 .mat-evo-l { grid-template-columns: repeat(2, minmax(0, .8fr)) minmax(0, .7fr) minmax(0, .9fr) minmax(0, 1.6fr); }
#mat-fiche-hote .mat-evo-l > span:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
#mat-fiche-hote .mat-evo-5 .mat-evo-l > span { text-align: left !important; }
#mat-fiche-hote .mat-evo-l > span:first-child { display: flex; align-items: center; gap: 7px; min-width: 0; }
#mat-fiche-hote .mat-evo-t { font-size: 11.5px; color: #8A8A8A; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
#mat-fiche-hote .mat-evo-m { font-weight: 650; border-bottom: 0; }
#mat-fiche-hote .mtf-tuiles.mat-tuiles-auto { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; }
/* Corrélations. */
#mat-fiche-hote .mat-cor { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
#mat-fiche-hote .mat-cor-l { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, 62px); gap: 8px; align-items: center; }
#mat-fiche-hote .mat-cor-l:has(> .mat-cor-c:nth-child(3):last-child) { grid-template-columns: minmax(0, 1fr) repeat(2, 62px); }
#mat-fiche-hote .mat-cor-t { font-size: 11.5px; color: #8A8A8A; text-transform: uppercase; } #mat-fiche-hote .mat-cor-t span { text-align: center; }
#mat-fiche-hote .mat-cor-c { display: inline-block; text-align: center; padding: 4px 0; border-radius: 6px; font-weight: 600; font-variant-numeric: tabular-nums; font-size: 12.5px; min-width: 52px; }
#mat-fiche-hote .mat-voisins { display: flex; flex-wrap: wrap; gap: 8px; }
#mat-fiche-hote .mat-voisins-t { margin: 14px 0 8px; font-size: 11.5px; color: #8A8A8A; text-transform: uppercase; letter-spacing: .04em; }
body .per-page #mat-fiche-hote button.mat-vois { display: inline-flex !important; align-items: center; gap: 8px; padding: 5px 8px 5px 6px !important; border: 1px solid rgba(13,13,13,.1) !important; border-radius: 10px !important; background: #fff !important; cursor: pointer; font-size: 13px !important; color: #1F1F1F !important; min-height: 0 !important; }
body .per-page #mat-fiche-hote button.mat-vois:hover { border-color: #1B4FD8 !important; }
#mat-fiche-hote .mat-vois .mat-ic { border-radius: 6px; font-size: 11px; }
@media (max-width: 640px) { #mat-fiche-hote .mat-bl { grid-template-columns: minmax(0, 1fr) 60px 46px; } #mat-fiche-hote .mat-bl-v { display: none; } #mat-fiche-hote .mat-pl { grid-template-columns: minmax(0, 1fr) 80px 36px; } #mat-fiche-hote .mat-pl-b { display: none; } }

/* ══ LA VUE « MATIÈRES » ══ */
/* Une vue du rail n'est montrée que par sa propre règle (même procédé que la vue Obligations). */
body[data-ca-vue] .per-page > #per-tab-matieres { display: none !important; }
body[data-ca-vue="matieres"] .per-page > #per-tab-matieres { display: block !important; }
body:not([data-ca-vue]) .per-page > #per-tab-matieres:not(.active) { display: none; }
#per-tab-matieres .mat-vue-tete { display: flex; gap: 28px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding: 22px 24px; }
#per-tab-matieres .mat-vt-g { flex: 1 1 420px; min-width: 0; }
#per-tab-matieres .mat-vt-g h2 { margin: 0 0 6px; font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
#per-tab-matieres .mat-vt-g p { margin: 0; font-size: 13.5px; line-height: 1.6; color: #4D4D4D; }
#per-tab-matieres .mat-vt-d { display: flex; gap: 0; }
#per-tab-matieres .mat-vt-k { display: flex; flex-direction: column; padding: 2px 20px; border-left: 1px solid rgba(13,13,13,.08); }
#per-tab-matieres .mat-vt-k:first-child { border-left: 0; }
#per-tab-matieres .mat-vt-k b { font-size: 26px; font-weight: 650; line-height: 1.1; }
#per-tab-matieres .mat-vt-k span { font-size: 12px; color: #6B6B6B; }
#per-tab-matieres .mat-liste { margin-top: 18px; }
#per-tab-matieres .mat-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
body .per-page #per-tab-matieres button.mat-chip { padding: 5px 12px !important; border-radius: 999px !important; border: 1px solid rgba(13,13,13,.12) !important; background: #fff !important; font-size: 12.5px !important; color: #4D4D4D !important; cursor: pointer; min-height: 0 !important; font-weight: 500 !important; }
body .per-page #per-tab-matieres button.mat-chip.on { border-color: #B45309 !important; color: #8A3A00 !important; background: rgba(180,83,9,.07) !important; }
#per-tab-matieres .mat-prod { white-space: nowrap; }
#per-tab-matieres .mat-prod .ca-drapeau { margin-right: 6px; }
.per-page .mat-lt tbody tr[data-matiere] { cursor: pointer; }

/* ══ ACCUEIL : 8 entrées sur trois colonnes → la dernière (Comparateur) prend deux cases ══ */
@media (min-width: 1241px) {
  .per-page #ca-sommaire .ca-som-grille > .ca-som-carte:last-child:nth-child(3n+2) { grid-column: span 2; flex-direction: row; align-items: stretch; gap: 22px; }
  .per-page #ca-sommaire .ca-som-grille > .ca-som-carte:last-child:nth-child(3n+2) > .ca-som-illu { flex: 0 0 42%; width: 42% !important; aspect-ratio: auto; min-height: 168px; }
  .per-page #ca-sommaire .ca-som-grille > .ca-som-carte:last-child:nth-child(3n+2) > .ca-som-corps { align-self: center; padding: 6px 12px 6px 0; }
  .per-page #ca-sommaire .ca-som-grille > .ca-som-carte:last-child:nth-child(3n+2) > .ca-som-illu .ca-som-grav { background-size: contain !important; inset: 10px 0 !important; }
}
#per-tab-matieres .mat-note-bas { font-size: 12px; color: #6B6B6B; line-height: 1.5; margin: 10px 2px 0; }

/* ══ LA VUE D'ENSEMBLE (matieres_vue.js, 01/10/2026) — grammaire de la vue Obligations (.obl-*) ══ */
#per-tab-matieres { padding-top: 6px; }
.per-page .mat-vue .obl-vue h1.obl-titre em, .per-page .mat-vue h1.obl-titre em { color: #B45309; }
.per-page .mat-vue .obl-sec { display: flex; flex-direction: column; gap: 16px; }
.per-page .mat-vue .mat-cor { display: flex; flex-direction: column; gap: 7px; font-size: 13px; }
.per-page .mat-vue .mat-cor-l { display: grid; grid-template-columns: minmax(0, 1fr) repeat(2, 76px); gap: 10px; align-items: center; }
.per-page .mat-vue .mat-cor-t { font-size: 11.5px; color: #8A8A8A; text-transform: uppercase; } .per-page .mat-vue .mat-cor-t span { text-align: center; }
.per-page .mat-vue .mat-cor-c { display: inline-block; text-align: center; padding: 5px 0; border-radius: 6px; font-weight: 600; font-variant-numeric: tabular-nums; font-size: 12.5px; }
/* mini-visuel « fiches » de la carte */
.per-page .mat-fv { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; height: 100%; align-content: center; }
.per-page .mat-fv-i { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 7px 3px; border-radius: 10px; background: #fff; border: 1px solid rgba(13,13,13,.06); min-width: 0; }
.per-page .mat-fv-i em { font-style: normal; font-size: 10.5px; color: #4D4D4D; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.per-page .mat-fv-i b { font-size: 12px; font-weight: 750; font-variant-numeric: tabular-nums; }
.per-page .obl-rub-p .mat-fv-i em, .per-page .obl-rub-p .mat-fv-i .mat-ic { display: none; }
.per-page .obl-rub-p .mat-fv { gap: 4px; } .per-page .obl-rub-p .mat-fv-i { padding: 3px 2px; } .per-page .obl-rub-p .mat-fv-i b { font-size: 10px; }
/* les familles (cycle) */
.per-page .mat-vue .mat-fl { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, .8fr)) 44px; gap: 8px; align-items: center; padding: 9px 4px; border-bottom: 1px solid #F2F2F2; font-size: 13px; cursor: pointer; border-radius: 6px; }
.per-page .mat-vue .mat-fl:hover { background: #FAF7F2; }
.per-page .mat-vue .mat-fl-t { font-size: 11px; color: #8A8A8A; text-transform: uppercase; letter-spacing: .04em; cursor: default; } .per-page .mat-vue .mat-fl-t:hover { background: none; }
.per-page .mat-vue .mat-fl > span:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.per-page .mat-vue .mat-fl-n { display: flex; align-items: center; gap: 8px; } .per-page .mat-vue .mat-fl-n i { width: 10px; height: 10px; border-radius: 3px; flex: 0 0 10px; }
.per-page .mat-vue .mat-fl-c { color: #6B6B6B; font-weight: 500 !important; }
/* chères ou bon marché */
.per-page .mat-vue .mat-rls { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.per-page .mat-vue .mat-rl { display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, 1.3fr) 48px; gap: 10px; align-items: center; font-size: 13px; }
.per-page .mat-vue .mat-rl-n { display: flex; align-items: center; gap: 8px; } .per-page .mat-vue .mat-rl-n i { width: 10px; height: 10px; border-radius: 3px; }
.per-page .mat-vue .mat-rl-b { position: relative; height: 8px; border-radius: 4px; background: linear-gradient(90deg, #DBEAFE, #F5F5F4 50%, #FED7AA); }
.per-page .mat-vue .mat-rl-b i { position: absolute; top: 50%; width: 13px; height: 13px; margin: -6.5px 0 0 -6.5px; border-radius: 50%; background: #B45309; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
.per-page .mat-vue .mat-rl-v { text-align: right; font-weight: 650; font-variant-numeric: tabular-nums; }
.per-page .mat-vue .mat-rl-ech, .per-page .mat-vue .mat-dv-ech { display: flex; justify-content: space-between; font-size: 11px; color: #8A8A8A; margin-top: 8px; }
.per-page .mat-vue .mat-rl-ech { padding: 0 58px 0 calc(42% - 6px); }
/* le tableau des variations (carte de chaleur) */
.per-page .mat-vue .mat-hm-defil { overflow-x: auto; }
.per-page .mat-vue table.mat-hm { width: 100%; border-collapse: separate; border-spacing: 3px; font-size: 12.5px; }
.per-page .mat-vue .mat-hm th { font-size: 11px; font-weight: 600; color: #6B6B6B; text-align: center; padding: 6px 4px; cursor: pointer; white-space: nowrap; border-radius: 6px; }
.per-page .mat-vue .mat-hm th.on { color: #0E8A5F; background: rgba(14,138,95,.08); }
.per-page .mat-vue .mat-hm th.mat-hm-n { text-align: left; cursor: default; }
.per-page .mat-vue .mat-hm td { text-align: center; padding: 2px; font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.per-page .mat-vue .mat-hm .mat-hm-c { display: block; padding: 6px 4px; border-radius: 6px; }
.per-page .mat-vue .mat-hm td.mat-hm-n { text-align: left; font-weight: 600; color: #1F1F1F; }
.per-page .mat-vue .mat-hm td.mat-hm-n { min-width: 200px; width: 230px; }
.per-page .mat-vue .mat-hm .mat-hm-nn { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.per-page .mat-vue .mat-hm td.mat-hm-n em { font-style: normal; font-size: 10px; color: #8A8A8A; border: 1px solid #DDD; border-radius: 4px; padding: 0 3px; margin-left: 3px; }
.per-page .mat-vue .mat-hm .mat-ic { border-radius: 6px; font-size: 10px; }
.per-page .mat-vue .mat-hm tbody tr[data-matiere] { cursor: pointer; } .per-page .mat-vue .mat-hm tbody tr[data-matiere]:hover td.mat-hm-n { color: #0E8A5F; }
.per-page .mat-vue .mat-hm-fam td { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8A8A8A; padding: 12px 4px 2px; text-align: left; }
/* gagnants et perdants */
.per-page .mat-vue .mat-gp { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(60px, 1fr) 56px; gap: 10px; align-items: center; padding: 5px 0; font-size: 13px; cursor: pointer; }
.per-page .mat-vue .mat-gp-n { display: flex; align-items: center; gap: 8px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.per-page .mat-vue .mat-gp-n .mat-ic { border-radius: 6px; font-size: 10px; }
.per-page .mat-vue .mat-gp-b { height: 9px; background: rgba(13,13,13,.05); border-radius: 5px; overflow: hidden; } .per-page .mat-vue .mat-gp-b i { display: block; height: 100%; border-radius: 5px; }
.per-page .mat-vue .mat-gp-v { text-align: right; font-weight: 650; font-variant-numeric: tabular-nums; }
/* la carte de tension */
.per-page .mat-vue .mat-tgs { display: flex; flex-direction: column; gap: 14px; }
.per-page .mat-vue .mat-tg-ft { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8A8A8A; margin-bottom: 7px; }
.per-page .mat-vue .mat-tg { display: grid; grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); gap: 8px; }
body .per-page .mat-vue button.mat-tg-i { display: grid !important; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 8px; align-items: center; text-align: left !important;
  padding: 8px 10px !important; border-radius: 11px !important; min-height: 0 !important; cursor: pointer; font: inherit !important;
  background: color-mix(in srgb, var(--tc) 7%, #FFFFFF) !important; border: 1px solid color-mix(in srgb, var(--tc) 30%, transparent) !important; color: #1F1F1F !important; }
body .per-page .mat-vue button.mat-tg-i:hover { border-color: var(--tc) !important; }
.per-page .mat-vue .mat-tg-i svg { grid-row: span 2; }
.per-page .mat-vue .mat-tg-n { font-size: 12.5px; font-weight: 650; line-height: 1.25; overflow-wrap: anywhere; }
.per-page .mat-vue .mat-tg-s { white-space: nowrap; }
.per-page .mat-vue .mat-tg-s { font-size: 11.5px; color: var(--tc); font-weight: 600; }
.per-page .mat-vue .mat-tg-leg { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; } .per-page .mat-vue .mat-tg-leg i { width: 10px; height: 10px; border-radius: 3px; margin-left: 8px; }
/* barres divergentes (courbe, stocks) et positions */
.per-page .mat-vue .mat-dv, .per-page .mat-vue .mat-sp { display: flex; flex-direction: column; gap: 5px; }
.per-page .mat-vue .mat-dv-l, .per-page .mat-vue .mat-sp-l { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(90px, 1.5fr) 58px; gap: 10px; align-items: center; font-size: 12.5px; cursor: pointer; padding: 2px 0; }
.per-page .mat-vue .mat-dv-n, .per-page .mat-vue .mat-sp-n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #23262B; }
.per-page .mat-vue .mat-dv-b { position: relative; height: 10px; background: linear-gradient(90deg, transparent calc(50% - .5px), #CFCFCF calc(50% - .5px), #CFCFCF calc(50% + .5px), transparent calc(50% + .5px)); }
.per-page .mat-vue .mat-dv-b i { position: absolute; top: 0; bottom: 0; border-radius: 3px; }
.per-page .mat-vue .mat-dv-v, .per-page .mat-vue .mat-sp-v { text-align: right; font-weight: 650; font-variant-numeric: tabular-nums; }
.per-page .mat-vue .mat-sp-b { position: relative; height: 6px; border-radius: 3px; background: linear-gradient(90deg, #FDE2E2, #F1EFF9 50%, #E3DDF8); }
.per-page .mat-vue .mat-sp-b i { position: absolute; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
.per-page .mat-vue .mat-sp-v { color: #4D4D4D; font-weight: 500; }
/* les tuiles des ratios */
.per-page .mat-vue .mat-rts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1240px) { .per-page .mat-vue .mat-rts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .per-page .mat-vue .mat-rts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
body .per-page .mat-vue button.mat-rt { display: flex !important; flex-direction: column; align-items: stretch; gap: 2px; text-align: left !important; padding: 13px 14px 11px !important; border-radius: 14px !important;
  background: #FFFFFF !important; border: 1px solid rgba(13,13,13,.09) !important; cursor: pointer; min-height: 0 !important; font: inherit !important; color: #1F1F1F !important; }
body .per-page .mat-vue button.mat-rt:hover { border-color: #6B4FD8 !important; }
body .per-page .mat-vue button.mat-rt.on { border-color: #6B4FD8 !important; box-shadow: 0 0 0 2px rgba(107,79,216,.18); }
.per-page .mat-vue .mat-rt-l { font-size: 12px; font-weight: 650; color: #4D4D4D; }
.per-page .mat-vue .mat-rt b { font-size: 22px; font-weight: 750; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: #2E1F73; }
.per-page .mat-vue .mat-rt em { font-style: normal; font-size: 11px; color: #8A8A8A; min-height: 28px; line-height: 1.3; }
.per-page .mat-vue .mat-rt-g { position: relative; height: 6px; border-radius: 3px; background: linear-gradient(90deg, #EDE9FB, #C9BEF2); margin-top: 6px; }
.per-page .mat-vue .mat-rt-g i { position: absolute; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #6B4FD8; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
.per-page .mat-vue .mat-rt-e { display: flex; justify-content: space-between; font-size: 10.5px; color: #8A8A8A; margin-top: 4px; } .per-page .mat-vue .mat-rt-e span:nth-child(2) { color: #4B3A9E; font-weight: 650; }
/* les cartes de fiches */
.per-page .mat-vue .mat-fcs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1240px) { .per-page .mat-vue .mat-fcs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 800px) { .per-page .mat-vue .mat-fcs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
body .per-page .mat-vue button.mat-fc { display: flex !important; flex-direction: column; align-items: stretch; gap: 9px; text-align: left !important; padding: 13px 14px !important; border-radius: 14px !important;
  background: #FFFFFF !important; border: 1px solid rgba(13,13,13,.09) !important; cursor: pointer; min-height: 0 !important; font: inherit !important; color: #1F1F1F !important; transition: transform .15s, box-shadow .15s; }
body .per-page .mat-vue button.mat-fc:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -14px rgba(13,13,13,.35); }
.per-page .mat-vue .mat-fc-h { display: flex; align-items: center; gap: 10px; min-width: 0; }
.per-page .mat-vue .mat-fc-n { display: flex; flex-direction: column; min-width: 0; } .per-page .mat-vue .mat-fc-n b { font-size: 13.5px; font-weight: 700; line-height: 1.25; }
.per-page .mat-vue .mat-fc-n em { font-style: normal; font-size: 11px; color: #8A8A8A; }
.per-page .mat-vue .mat-fc-v { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } .per-page .mat-vue .mat-fc-v b { font-size: 19px; font-weight: 750; font-variant-numeric: tabular-nums; } .per-page .mat-vue .mat-fc-v span { font-size: 12px; font-weight: 600; }
.per-page .mat-vue .mat-fc-p { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 11.5px; }
.per-page .mat-vue .mat-fc-t { padding: 2px 8px; border-radius: 999px; border: 1px solid; font-weight: 650; }
.per-page .mat-vue .mat-fc-pr { display: inline-flex; align-items: center; gap: 5px; color: #6B6B6B; white-space: nowrap; overflow: hidden; }
.per-page .mat-vue .mat-fc-pr .ca-drapeau { flex: 0 0 auto; }
.per-page .mat-vue .mat-ic { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 9px; }
.per-page .mat-vue .mat-fc .mat-ic { font-size: 14px; }

.per-page .mat-vue .mat-dv-n .mat-dv-d { display: block; font-size: 10.5px; color: #8A8A8A; white-space: normal; line-height: 1.3; }

/* ══ CORRECTIONS DE L'AUDIT DU 01/10/2026 (soir) — vue d'ensemble ══ */
/* Le tableau des variations : une règle globale des tableaux de la page imposait 52 px de haut,
   10 px de marge et un filet à chaque cellule (le tableau faisait 2 900 px). */
body .per-page .mat-vue table.mat-hm td, body .per-page .mat-vue table.mat-hm th { padding: 1px 2px !important; height: auto !important; border: 0 !important; line-height: 1.25 !important; }
body .per-page .mat-vue table.mat-hm .mat-hm-c { padding: 5px 4px; }
body .per-page .mat-vue table.mat-hm .mat-hm-fam td { padding: 12px 4px 3px !important; }
body .per-page .mat-vue table.mat-hm td.mat-hm-n { padding-right: 10px !important; }
.per-page .mat-vue .mat-hm .mat-hm-nn em { font-style: normal; font-size: 10px; font-weight: 500; color: #8A8A8A; border: 1px solid #DDD; border-radius: 4px; padding: 0 4px; margin-left: 4px; }
/* La carte de tension : une matière ne se lit plus « Pétrole br… », le statut tient sur une ligne. */
body .per-page .mat-vue button.mat-tg-i { min-height: 54px; }
/* Les grandes tendances : la courbe occupe la place que la carte voisine impose (plus de blanc). */
.per-page .mat-vue .obl-canvas.mat-tend-c { min-height: 200px; }
/* Les chiffres de la tête mènent à leur rubrique : ils doivent le montrer. */
.per-page .mat-vue .obl-chiffre[data-rub] { cursor: pointer; border-radius: 8px; transition: background .15s; }
.per-page .mat-vue .obl-chiffre[data-rub]:hover b { color: #B45309; }
/* Les petites cartes « autres rubriques » : à 92 px de haut, les textes du dessin faisaient 5 px —
   illisibles ; on n'y garde que le dessin. */
.per-page .mat-vue .obl-rub-p .obl-rub-vis svg text { display: none; }
/* La ligne « Les familles » : le nom tient sur une ligne. */
.per-page .mat-vue .mat-fl-n { white-space: nowrap; min-width: 0; }

/* ══ CORRECTIONS DE L'AUDIT DU 01/10/2026 (soir) — fiches ══ */
/* Un pays sans drapeau dessiné garde sa place (les noms restent alignés). */
.per-page .ca-drapeau.mat-dr-vide { display: inline-block; width: 21px; height: 14px; flex: 0 0 21px; }
/* Le pic sorti du cadre d'un graphe, écrit sous la courbe. */
#mat-fiche-hote .mat-hors-cadre { margin-top: 6px; font-size: 11.5px; line-height: 1.45; color: #7A7A7A; }
#mat-fiche-hote .mat-hors-cadre b { color: #3D3D3D; font-weight: 650; }
/* La note de tension : un critère = une ligne (« Stocks US vs 5 / ans » se coupait). */
#mat-fiche-hote .mat-crit-t .fs-crit-l { white-space: nowrap; }
/* Les sources ne se collent plus à la dernière note de l'onglet. */
#mat-fiche-hote .fs-body > .fs-bandeau { margin-top: 22px !important; }
#mat-fiche-hote .fs-pane > .mat-note-bas { margin: 10px 2px 0; }
/* La note de tension : la page impose (!important) des libellés qui passent à la ligne et une piste
   de 84 px — « Courbe à / terme », « Gérants / de / fonds ». Ici, un critère = une ligne ; et sous
   720 px de large, les catégories s'empilent au lieu de s'écraser à deux par rangée. */
#mat-fiche-hote .mat-note { container-type: inline-size; }
body .per-page #mat-fiche-hote .mat-note .fs-crit { grid-template-columns: minmax(0, 1fr) auto 28px 56px !important; column-gap: 10px; }
body .per-page #mat-fiche-hote .mat-note .fs-crit-l { white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; }
@container (max-width: 720px) { body .per-page #mat-fiche-hote .mat-note .fs-cats { grid-template-columns: minmax(0, 1fr) !important; gap: 14px !important; } }
/* Une matière sans cours public le dit, au lieu d'un tiret. */
#mat-fiche-hote .nrf-cote-v.mat-pas-cours { font-size: 17px; font-weight: 650; color: #6B6B6B; }
/* Les réserves : la valeur porte aussi les années de production — colonne plus large. */
#mat-fiche-hote .mat-barres-x .mat-bl { grid-template-columns: minmax(0, 1.25fr) minmax(60px, 1fr) 52px 150px; }
@media (max-width: 640px) { #mat-fiche-hote .mat-barres-x .mat-bl { grid-template-columns: minmax(0, 1fr) 60px 46px; } }
.per-page .mat-vue .mat-fc-v b.mat-fc-nc { font-size: 14px; font-weight: 600; color: #8A8A8A; }
/* « À quoi elle sert » : un usage se lit en entier (« Alimentation humaine, semences, industrie »). */
#mat-fiche-hote .mat-usages .mat-bl-n { white-space: normal; line-height: 1.3; }
#mat-fiche-hote .mat-usages .mat-bl-n > span:last-child { overflow: visible; text-overflow: clip; }
/* Un nom de pays long (« Papouasie-Nouvelle-Guinée ») passe à la ligne au lieu d'être coupé. */
#mat-fiche-hote .mat-bl-n { white-space: normal; line-height: 1.25; }
#mat-fiche-hote .mat-bl-n > span:last-child { overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }