/*  LE BILAN EN TREEMAP (06/11/2026) : Shared/BilanTreemap.razor et js/bilan-treemap.js, dans le bloc Synthèse du hub (bascule « Résultat | Bilan »).
    Le dessin occupe la place du graphe. Ses commandes (détail, exercice) sont sur la ligne de titre du bloc. Préfixe btm-. */
.btm { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--tx1); }
.btm-tete { flex: none; display: grid; grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr); align-items: baseline; font-size: 10px; font-weight: 700; letter-spacing: .07em; color: var(--mut2, #8aa0ad); }
.btm-tete > div { display: flex; justify-content: space-between; gap: 6px; min-width: 0; }
.btm-tete b { font-size: 12.5px; letter-spacing: 0; font-weight: 800; color: var(--tx1); font-variant-numeric: tabular-nums; }
.btm-tete .eg { justify-content: center; }
.btm-boite { flex: 1 1 0; min-height: 200px; position: relative; overflow: hidden; }
.btm-boite svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; touch-action: manipulation; }
.btm-tile { transition: opacity .15s; cursor: default; }
.btm-sur { pointer-events: none; }
.btm svg.foc .btm-tile:not(.foc), .btm svg.foc .btm-lab:not(.foc) { opacity: .35; }
.btm-lab { pointer-events: none; animation: btm-lab .22s ease-out both; transition: opacity .15s; }
@keyframes btm-lab { from { opacity: 0; } to { opacity: 1; } }
.btm-lab .l { font-weight: 600; }
.btm-lab .v { font-weight: 800; font-variant-numeric: tabular-nums; }
.btm-lab .n { font-weight: 500; opacity: .82; font-variant-numeric: tabular-nums; }
.btm-hors { flex: none; font-size: 11px; color: var(--mut2, #8aa0ad); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.btm-hors:empty { display: none; }
/* La bande des chiffres : libellé au-dessus, valeur dessous, tout sur une ligne. */
.btm-eq { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 6px 9px; border-radius: 6px; background: var(--o4, rgba(255,255,255,.04)); font-variant-numeric: tabular-nums; }
.btm-eq .c { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.btm-eq .c span { font-size: 10px; font-weight: 600; color: var(--mut2, #8aa0ad); white-space: nowrap; }
.btm-eq .c b { font-size: 12.5px; font-weight: 800; color: var(--tx1); white-space: nowrap; }
.btm-eq i { flex: none; font-style: normal; font-size: 13px; font-weight: 600; color: var(--mut2, #8aa0ad); }
.btm-eq hr { flex: none; align-self: stretch; width: 1px; margin: 0 2px; border: 0; background: var(--o12, rgba(255,255,255,.12)); }
.btm-bulle { position: fixed; z-index: 10100; pointer-events: none; width: max-content; max-width: 240px; padding: 8px 10px; border-radius: 10px; background: var(--surf-pop, #10222c); border: 1px solid var(--o12, rgba(255,255,255,.12)); box-shadow: 0 14px 40px rgba(0,0,0,.4); font-size: 12px; color: var(--tx2); }
.btm-bulle[hidden] { display: none; }
.btm-bulle b { display: block; color: var(--tx1); }
.btm-bulle .bv { display: block; font-size: 15px; font-weight: 800; color: var(--tx1); font-variant-numeric: tabular-nums; }
/* Les commandes, sur la ligne de titre du bloc */
.btm-ctrl { display: flex; align-items: center; gap: 8px; margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 600; }
.btm-sw { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 9px 0 7px; border-radius: 8px; border: 1px solid var(--o8, rgba(255,255,255,.08)); background: var(--o5, rgba(255,255,255,.05)); font: inherit; font-size: 12px; color: var(--tx2); cursor: pointer; white-space: nowrap; }
.btm-sw i { position: relative; width: 26px; height: 15px; border-radius: 99px; background: var(--o12, rgba(255,255,255,.12)); transition: background .18s; }
.btm-sw i::after { content: ""; position: absolute; left: 2px; top: 2px; width: 11px; height: 11px; border-radius: 50%; background: var(--tx1); transition: transform .18s; }
.btm-sw[aria-checked="true"] { color: var(--tx1); }
.btm-sw[aria-checked="true"] i { background: var(--brand); }
.btm-sw[aria-checked="true"] i::after { transform: translateX(11px); background: var(--brand-contrast, #06141a); }
.btm-sw:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.btm-cbo { width: 118px; }
/* La cascade (Shared/SankeyResultat, js/sankey-resultat.js) : le dessin en pleine largeur, le tableau cède sa place. */
.sk { flex: none; width: 100%; min-width: 0; }
.sk svg { display: block; width: 100%; touch-action: manipulation; }
.sk-rub { transition: opacity .12s, fill .12s; pointer-events: all; }
.sk-noe, .sk-txt { transition: opacity .12s, fill .12s; }
.sk-prise { fill: transparent; }
.sk-fil { fill: var(--o8, rgba(255,255,255,.08)); }
.sk-hach { fill: rgba(255,255,255,.1); }
html[data-theme="light"] .sk-hach { fill: rgba(255,255,255,.2); }
.sk svg.foc .sk-rub:not(.foc), .sk svg.foc .sk-noe:not(.foc), .sk svg.foc .sk-txt:not(.foc) { opacity: .25; }
.sk text { pointer-events: none; }
.sk-et-n { fill: var(--mut2, #8aa0ad); font-weight: 500; }
.sk-et-v { fill: var(--tx1); font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.sk-et-p, .sk-li-p { fill: var(--mut2, #8aa0ad); font-weight: 500; font-variant-numeric: tabular-nums; }
.sk-li-n { fill: var(--tx2); font-weight: 500; }
.sk-li-v { fill: var(--tx1); font-weight: 700; font-variant-numeric: tabular-nums; }
.hubsynth.est-large { grid-template-columns: minmax(0, 1fr); }
.hubsynth.est-large .hubsynth-table-wrap, .hubsynth.est-large .hubsynth-mob-pli { display: none; }
.fec-overlay .hubsynth.est-large .hubsynth-mob-act { display: flex; justify-content: flex-end; }
/* Le passage d'une vue à l'autre : ce qui apparaît monte en fondu (un élément qui repasse de display none rejoue son animation). */
@keyframes synth-vue { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.btm, .sk, .hubsynth-repliable .hubsynth-apex, .hubsynth-repliable .hubsynth-table-wrap { animation: synth-vue .3s ease-out both; }
html[data-motion="reduites"] :is(.btm, .sk, .hubsynth-repliable .hubsynth-apex, .hubsynth-repliable .hubsynth-table-wrap) { animation: none; }
@media (prefers-reduced-motion: reduce) { .btm, .sk, .hubsynth-repliable .hubsynth-apex, .hubsynth-repliable .hubsynth-table-wrap { animation: none; } }
/* Le graphe du résultat reste monté, masqué : il garde son état quand on revient dessus. */
.hubsynth-apex.est-masque { display: none; }
/* Téléphone : la hauteur suit le contenu au lieu des 248 px du graphe ; les ratios cèdent la place à l'équation. */
@media (max-width: 600px) {
    .fec-overlay .hubsynth-repliable .hubsynth-chart-wrap.est-bilan { height: auto; }
    .fec-overlay .hubsynth-repliable .hubsynth-ttl-chart.est-bilan { flex-wrap: wrap; row-gap: 6px; }
    .hubsynth-ttl-chart.est-bilan .btm-ctrl { display: contents; }
    /*  La combo monte sur la ligne du titre, compacte ; sa liste de huit exercices se passe de ses groupes. Le détail du bilan passe dessous. */
    .hubsynth-ttl-chart.est-bilan .btm-cbo { flex: none; order: 2; width: 66px; }
    .hubsynth-ttl-chart.est-bilan .btm-cbo .cbo-btn { padding-left: 7px; padding-right: 3px; gap: 2px; }
    .hubsynth-ttl-chart.est-bilan .btm-sw { order: 3; }
    .fec-overlay .hubsynth-repliable .hubsynth-ttl-chart.est-bilan { column-gap: 5px; }
    .btm-cbo .cbo-grp { display: none; }
    .btm { flex: none; }
    .btm-boite { flex: none; height: 224px; min-height: 0; }
    .btm-eq .r, .btm-eq hr { display: none; }
}
html[data-motion="reduites"] .btm-lab { animation: none; }
@media (prefers-reduced-motion: reduce) { .btm-lab { animation: none; } }
@media print { .btm-ctrl { display: none; } }