/* Tokens = DESK-DESIGN-SYSTEM.md (loi du desk LandQuire, source portal.cjs, 2026-07-20).
   Servi statique (pas de donnée client dedans) : /assets/shared.css */
:root{
  --parchemin:#F2F5F1; --creme:#FFFFFF; --ivoire:#E2E6E0;
  --encre:#1B1A17; --encre-douce:#2B2A25; --fumee:#5A5750; --brume:#807C72; --ardoise:#413F38;
  --cuivre:#2E8540; --cuivre-brule:#1E5C2C; --cuivre-clair:#8DC154;
  --topbar:#151D1A; --ambre:#B7791F; --rouge:#B3372C;
  --ombre:0 1px 3px rgba(27,26,23,.07);
  --ff-d:'Fraunces',Georgia,serif; --ff-b:'Inter Tight',-apple-system,sans-serif; --ff-m:'IBM Plex Mono',monospace;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--parchemin);color:var(--encre);font-family:var(--ff-b);font-size:14px;line-height:1.45}
a{color:var(--cuivre-brule)}
.topbar{background:var(--topbar);color:#F2F5F1;padding:12px 20px;display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.topbar .t{font-family:var(--ff-d);font-weight:600;font-size:17px}
.topbar .m{font-family:var(--ff-m);font-size:10.5px;color:#8DC154;letter-spacing:.04em}
.topbar nav{display:flex;gap:14px;margin-left:auto;font-size:12.5px}
.topbar nav a{color:#D9DED6;text-decoration:none;font-weight:600}
.topbar nav a.on{color:#fff;border-bottom:2px solid var(--cuivre-clair)}
.topbar nav a:hover{color:#fff}
.wrap{max-width:1400px;margin:0 auto;padding:22px 24px 56px}
.bandeau{display:flex;flex-wrap:wrap;align-items:flex-end;gap:18px;margin-bottom:6px}
h1{font-family:var(--ff-d);font-weight:600;font-size:27px;color:var(--encre-douce);margin:0;flex:1;min-width:220px}
.back{font-size:12.5px;font-weight:600;text-decoration:none;display:inline-block;margin-bottom:10px}
.counters{display:flex;gap:22px;flex-wrap:wrap}
.counter{text-align:right}
.counter .num{font-family:var(--ff-d);font-weight:700;font-size:26px;color:var(--encre);line-height:1;font-variant-numeric:tabular-nums}
.counter .num em{font-style:normal;font-size:13px;color:var(--fumee);font-family:var(--ff-b);font-weight:600}
.counter .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--brume);margin-top:3px}
.note{font-size:12.5px;color:var(--brume);margin:4px 0 18px}
.note .src{font-family:var(--ff-m);font-size:10.5px}
h2{font-family:var(--ff-d);font-weight:600;font-size:19px;color:var(--encre-douce);margin:26px 0 10px}
.watch{background:var(--creme);border:1px solid var(--ivoire);border-radius:8px;box-shadow:var(--ombre);padding:12px 15px;margin-bottom:4px}
.watch h3{margin:0 0 7px;font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--ambre);font-weight:700}
.watch ul{margin:0;padding-left:16px;display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--ardoise)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.lanebox{background:var(--creme);border:1px solid var(--ivoire);border-radius:8px;box-shadow:var(--ombre);padding:14px 16px;container-type:inline-size}
/* une fiche cliquable reste une fiche : sans ceci, tout son texte s'affiche
   souligne et en vert parce que c'est un <a>. */
a.lanebox{display:block;text-decoration:none;color:inherit;transition:border-color .12s}
a.lanebox:hover{border-color:var(--cuivre)}
.lanebox h3{margin:0;font-family:var(--ff-d);font-weight:600;font-size:16.5px;color:var(--encre-douce);line-height:1.25}
.lb-head{display:flex;align-items:flex-start;gap:10px}
.lb-head .tt{flex:1;min-width:0}
.lb-sub{font-size:12.5px;color:var(--brume);margin-top:2px}
.s-wrap{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ivoire);border-radius:20px;padding:4px 10px;background:var(--parchemin)}
.feu{width:8px;height:8px;border-radius:50%;background:var(--brume)}
.feu.c{background:var(--cuivre)} .feu.r{background:var(--rouge)} .feu.v{background:var(--encre)}
.s-lbl{font-size:11.5px;font-weight:600;color:var(--ardoise);white-space:nowrap}
.lrow{display:flex;gap:12px;padding:7px 0;border-top:1px solid var(--ivoire);font-size:13.5px}
.lrow:first-of-type{margin-top:10px}
.lrow .k{flex:0 0 148px;color:var(--brume)}
.lrow .v{flex:1;min-width:0;color:var(--encre);font-weight:500}
.lrow .v .money{font-weight:600}
@container (max-width:400px){.lrow .k{flex-basis:118px;font-size:12.5px}}
details.second{margin-top:9px;border-top:1px solid var(--ivoire);padding-top:8px}
details.second summary{cursor:pointer;font-size:12.5px;font-weight:600;color:var(--cuivre-brule);list-style:none}
details.second summary::before{content:'▸ '}
details.second[open] summary::before{content:'▾ '}
details.second p{font-size:13px;color:var(--fumee);margin:7px 0 2px;line-height:1.5;white-space:pre-line}
.strip{display:flex;gap:8px;overflow-x:auto;margin:10px 0 2px;padding-bottom:2px}
.strip a{flex:0 0 auto}
.strip img{height:86px;border-radius:6px;border:1px solid var(--ivoire);display:block}
.map{width:100%;height:260px;border:1px solid var(--ivoire);border-radius:6px;margin-top:8px}
.lb-actions{margin-top:10px;display:flex;gap:14px;flex-wrap:wrap}
.lb-actions a{font-size:12.5px;font-weight:600;text-decoration:none}
.empty{background:var(--creme);border:1px solid var(--ivoire);border-radius:8px;padding:20px;text-align:center;color:var(--brume);font-size:13px}
.pmitem{display:flex;align-items:center;gap:12px;padding:11px 0}
.pmitem+.pmitem{border-top:1px solid var(--ivoire)}
.pmitem .t1{font-size:13.5px;font-weight:600;color:var(--encre)}
.pmitem .t2{font-size:12px;color:var(--brume);margin-top:2px}
.pmitem .st{flex:0 0 auto;font-size:11px;font-weight:700;padding:4px 9px;border-radius:20px;border:1px solid var(--ivoire);color:var(--ardoise);background:var(--parchemin)}
.pmitem .st.done{background:var(--encre);color:#F2F5F1;border-color:var(--encre)}
.gov{margin-top:40px;padding-top:12px;border-top:1px solid var(--ivoire);font-size:11px;color:var(--brume);display:flex;flex-wrap:wrap;gap:6px 18px}
.gov .mono{font-family:var(--ff-m);font-size:10px}
.locked{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:0 40px}
.locked h1{font-size:22px}

/* kanban (pipeline par statut, lecture seule — structure prête pour un drag&drop futur) */
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px;margin-top:4px}
.kanban-col{flex:0 0 260px;background:var(--ivoire);border-radius:8px;padding:10px}
.kanban-col h3{margin:0 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ardoise);display:flex;align-items:center;gap:6px}
.kanban-col h3 .n{font-family:var(--ff-m);color:var(--brume);font-weight:400}
.kanban-card{display:block;background:var(--creme);border:1px solid var(--ivoire);border-radius:7px;box-shadow:var(--ombre);padding:11px 12px;margin-bottom:9px;text-decoration:none;color:inherit}
.kanban-card:hover{border-color:var(--cuivre)}
.kanban-card .t1{font-family:var(--ff-d);font-weight:600;font-size:14px;color:var(--encre-douce);line-height:1.25}
.kanban-card .t2{font-size:11.5px;color:var(--brume);margin-top:3px}
.kanban-card .t3{font-size:12.5px;color:var(--ardoise);margin-top:6px;font-weight:600}

/* chapitres fiche deal / finance = pills numérotées à ancres */
.chapters{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 22px;position:sticky;top:0;background:var(--parchemin);padding:8px 0;z-index:5}
.chapters a{font-size:12px;font-weight:600;color:var(--ardoise);text-decoration:none;background:var(--creme);border:1px solid var(--ivoire);border-radius:20px;padding:6px 12px;white-space:nowrap}
.chapters a:hover{border-color:var(--cuivre)}
.chapter{scroll-margin-top:52px;margin-bottom:8px}

/* jauge de progression — valeurs exactes reprises de landquire-desk/tools/portal.cjs:6825-6827 (variante hero, pbar flex:1) */
.pbar-row{display:flex;align-items:center;gap:12px;margin:4px 0 14px}
.pbar{flex:1;height:8px;border-radius:5px;background:var(--ivoire);overflow:hidden}
.pbar>i{display:block;height:100%;border-radius:5px;background:var(--cuivre)}
.pbar-pct{font-size:12px;font-weight:600;color:var(--ardoise);font-variant-numeric:tabular-nums;flex:0 0 auto}

/* table à-brancher / contacts (max 9 colonnes, zebra) */
table.ztable{width:100%;min-width:560px;border-collapse:collapse;font-size:13px;background:var(--creme);border:1px solid var(--ivoire);border-radius:8px;overflow:hidden}
table.ztable th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--brume);padding:9px 12px;border-bottom:1px solid var(--ivoire)}
table.ztable td{padding:9px 12px;border-bottom:1px solid var(--ivoire);color:var(--encre)}
table.ztable tr:nth-child(even) td{background:var(--parchemin)}
table.ztable td.num{text-align:right;font-variant-numeric:tabular-nums}
.pill{display:inline-block;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.pill.ambre{background:#F3E6D1;color:var(--ambre)}
.pill.ok{background:#E8F3EA;color:var(--cuivre-brule)}
.overflow-x{overflow-x:auto}
.tel,.mail{font-family:var(--ff-m);font-size:12px}

/* carte parcelle Leaflet vendorisée (pattern desk : pm-bar/pmmap) */
.pmwrap{border:1px solid var(--ivoire);border-radius:8px;overflow:hidden;margin-top:8px}
.pmmap{height:340px;width:100%}
.pm-bar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:9px 11px;background:var(--parchemin);border-bottom:1px solid var(--ivoire)}
.pm-bar button{font:600 12px var(--ff-b);border:1px solid var(--ivoire);background:#fff;color:var(--encre);border-radius:8px;padding:5px 11px;cursor:pointer}
.pm-bar button.on{background:var(--encre);color:#fff;border-color:var(--encre)}
.pm-hint{font-size:11px;color:var(--brume);margin-left:auto}
.pm-mlabel{background:#E4572E;color:#fff;font:600 11px var(--ff-b);padding:2px 7px;border-radius:6px;white-space:nowrap;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.pm-poi span{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:12px;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.leaflet-container{font-family:var(--ff-b)}

@media (min-width:900px){
  .grid{grid-template-columns:repeat(auto-fill,minmax(420px,1fr))}
  h1{font-size:32px}
  .counter .num{font-size:30px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* === Anatomie fiche deal = desk LandQuire (phasestrip, hero, sommaire, chapitres/sous-sections numérotés) === */
:root{ --cuivre-soft:#EAF3EC; --ambre-soft:#F6EFE0; }
/* stepper de phase */
.phasestrip{display:flex;background:var(--creme);border:1px solid var(--ivoire);border-radius:12px;padding:10px 12px 8px;margin-bottom:14px;box-shadow:var(--ombre)}
.phasestrip .ps{flex:1;position:relative;text-align:center;min-width:0}
.phasestrip .ps::before{content:"";position:absolute;top:8px;right:calc(50% + 13px);left:calc(-50% + 13px);height:2px;background:var(--ivoire);border-radius:1px}
.phasestrip .ps:first-child::before{display:none}
.phasestrip .ps.done::before,.phasestrip .ps.on::before{background:var(--cuivre)}
.phasestrip .ps i{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;background:var(--creme);border:2px solid #AEB9AE;font:700 10px/1 var(--ff-b);font-style:normal;color:#fff}
.phasestrip .ps.done i{background:var(--cuivre);border-color:var(--cuivre)}
.phasestrip .ps.on i{border-color:var(--cuivre);background:var(--cuivre-soft)}
.phasestrip .ps.on i::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--cuivre)}
.phasestrip .ps small{display:block;margin-top:3px;font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--brume);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phasestrip .ps.done small{color:var(--cuivre)}
.phasestrip .ps.on small{color:var(--cuivre-brule);font-weight:700}
@media(max-width:480px){.phasestrip{padding:8px 6px 6px}.phasestrip .ps small{font-size:9px;letter-spacing:.02em}}
/* hero card */
.hero{background:var(--creme);border:1px solid var(--ivoire);border-radius:16px;padding:22px 24px;box-shadow:var(--ombre);margin-bottom:16px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--cuivre),var(--cuivre-clair))}
.hero .badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.b-type{background:var(--cuivre-brule);color:#fff}
.b-phase{background:var(--cuivre-soft);color:var(--cuivre-brule)}
.h-title{font-family:var(--ff-d);font-weight:600;font-size:28px;line-height:1.12;margin:0 0 3px;color:var(--encre-douce)}
.h-code{font:500 12px var(--ff-m);color:var(--brume);letter-spacing:.04em}
.herogrid{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;margin-top:16px}
@media(max-width:720px){.herogrid{grid-template-columns:1fr;gap:16px}}
.fund .flabel{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--brume)}
.fund .fnum{font-family:var(--ff-d);font-weight:600;font-size:20px;color:var(--encre);margin:4px 0 6px;font-variant-numeric:tabular-nums}
.hbar{height:9px;border-radius:6px;background:var(--ivoire);overflow:hidden;margin:6px 0}
.hbar i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--cuivre),var(--cuivre-clair))}
.fund .fmeta{font-size:12.5px;color:var(--fumee)}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;align-content:start}
.kpi .kl{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--brume)}
.kpi .kv{font-family:var(--ff-d);font-weight:600;font-size:18px;color:var(--encre);font-variant-numeric:tabular-nums}
.kpi .kv small{font-size:11.5px;color:var(--fumee);font-weight:400;font-family:var(--ff-b)}
/* sommaire numéroté */
.toc{margin:0 0 16px;padding:13px 16px 11px;background:var(--creme);border:1px solid var(--ivoire);border-radius:14px;box-shadow:var(--ombre)}
.toc .tl{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--cuivre);font-weight:600;margin-bottom:8px}
.toc ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:5px 20px}
.toc li>a{display:flex;align-items:center;gap:9px;font:500 13.5px var(--ff-b);color:var(--encre);text-decoration:none;padding:4px 6px;border-radius:8px}
.toc li>a:hover{background:var(--cuivre-soft);color:var(--cuivre-brule)}
.toc li>a b{flex:none;width:22px;height:22px;border-radius:50%;background:var(--cuivre-brule);color:#fff;font:600 11px var(--ff-m);display:inline-flex;align-items:center;justify-content:center}
/* chapitres numérotés (details) */
.chapx{background:var(--creme);border:1px solid var(--ivoire);border-radius:16px;box-shadow:var(--ombre);margin-bottom:16px;overflow:hidden;scroll-margin-top:14px}
.chapx>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid var(--ivoire)}
.chapx>summary::-webkit-details-marker{display:none}
.chapx .cn{font:600 12px var(--ff-m);font-style:normal;color:#fff;background:var(--cuivre-brule);border-radius:50%;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.chapx .ct{font-family:var(--ff-d);font-weight:600;font-size:19px;color:var(--encre-douce)}
.chapx .chev{margin-left:auto;color:var(--brume);transition:transform .2s;font-size:12px}
.chapx[open]>summary .chev{transform:rotate(180deg)}
.chapx>.cbody,
.panel>.cbody{padding:14px 18px 16px}
.chapx>.cbody>.lrow:first-child,
.panel>.cbody>.lrow:first-child{border-top:0}
/* valeurs longues (adresses) : couper plutôt que déborder sur la bordure */
.lrow .v{overflow-wrap:anywhere}
/* sous-sections numérotées */
.subsec{border:1px solid var(--ivoire);border-radius:12px;margin-bottom:9px;overflow:hidden;background:var(--creme)}
.subsec:last-child{margin-bottom:0}
.subsec>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;padding:11px 14px}
.subsec>summary::-webkit-details-marker{display:none}
.subsec .sn{font:600 11px var(--ff-m);font-style:normal;color:var(--cuivre);min-width:22px}
.subsec .stt{font-family:var(--ff-d);font-weight:600;font-size:15px;color:var(--encre-douce)}
.subsec .chev{margin-left:auto;color:var(--brume);transition:transform .2s;font-size:11px}
.subsec[open]>summary .chev{transform:rotate(180deg)}
.subsec>.sbody{padding:2px 14px 12px}
.subsec>.sbody>.lrow:first-child{border-top:0}

/* === Cockpit home = desk (hero band + tuiles KPI + ligne Lecture) === */
.cockpit{padding:22px 24px}
.cockpit .kicker{font:600 11px var(--ff-m);letter-spacing:.08em;text-transform:uppercase;color:var(--cuivre);margin-bottom:5px}
.cockpit .h-title{font-family:var(--ff-d);font-weight:600;font-size:26px;color:var(--encre-douce);margin:0 0 16px}
.ckkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px 26px}
.ckk .kl{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--brume)}
.ckk .kv{font-family:var(--ff-d);font-weight:700;font-size:24px;color:var(--encre);font-variant-numeric:tabular-nums;line-height:1.12;margin-top:2px}
.ckk .kv em{font-style:normal;font-size:13px;color:var(--fumee);font-weight:600;font-family:var(--ff-b)}
.lecture{margin-top:18px;background:var(--cuivre-soft);border-radius:12px;padding:12px 16px;font-size:13.5px;color:var(--encre-douce);line-height:1.55}
.lecture .ll{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--cuivre-brule);font-weight:700;margin-right:8px}
.kanban-card .kc-head{display:flex;align-items:center;gap:7px;margin-bottom:3px}
.kanban-card .kc-head .feu{flex:none}

/* === Kanban drag & drop (écriture statut) === */
.kanban-drop{min-height:38px;display:flex;flex-direction:column;gap:9px}
.kanban-col.drop-hover{outline:2px dashed var(--cuivre);outline-offset:-2px;background:var(--cuivre-soft)}
.kanban-card{cursor:grab}
.kanban-card.dragging{opacity:.5;cursor:grabbing}
.kanban-hint{margin-top:10px;font-style:italic}
#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--topbar);color:#F2F5F1;font-size:13px;font-weight:600;padding:10px 18px;border-radius:10px;box-shadow:0 6px 24px rgba(27,26,23,.22);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:50;max-width:88vw;text-align:center}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* === Upload document (fiche) === */
.uploader{margin-top:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.up-btn{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#fff;background:var(--cuivre);border-radius:9px;padding:8px 14px;cursor:pointer}
.up-btn:hover{background:var(--cuivre-brule)}
.up-msg{font-size:12.5px;color:var(--fumee)}

/* Colonnes vides du kanban : réduites, pour ne pas écraser les colonnes qui
   contiennent quelque chose. Elles restent des zones de dépôt valides. */
.kanban-col.vide{flex:0 0 132px;background:transparent;border:1px dashed var(--ivoire)}
.kanban-col.vide h3{color:var(--brume)}
.kanban-col.vide .kanban-drop{min-height:56px}

/* Pastilles businesses : passer d'un business à l'autre en un clic. */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 20px}
.chip{display:inline-block;padding:6px 13px;border-radius:999px;border:1px solid var(--ivoire);background:var(--creme);color:var(--fumee);font-size:12.5px;font-weight:500;text-decoration:none;box-shadow:var(--ombre)}
.chip:hover{border-color:var(--cuivre-clair);color:var(--encre-douce)}
.chip.on{background:var(--cuivre-brule);border-color:var(--cuivre-brule);color:#fff}

/* ========================================================================== */
/* PANNEAUX — le motif de base du tableau de bord.                            */
/* Un panneau = un titre, un compteur, un lien "tout voir", et des lignes.    */
/* Pour ajouter un bloc (Marketing, Banque...), on réutilise ce motif :       */
/* aucune nouvelle règle CSS n'est nécessaire.                                */
/* ========================================================================== */
.dash{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;align-items:start}
.dash > div{display:grid;gap:14px;align-content:start}
@media(max-width:900px){.dash{grid-template-columns:1fr}}

.panel{background:var(--creme);border:1px solid var(--ivoire);border-radius:10px;box-shadow:var(--ombre);overflow:hidden}
.panel-h{display:flex;align-items:baseline;gap:9px;padding:13px 16px;border-bottom:1px solid var(--ivoire)}
.panel-h h2{margin:0;font-family:var(--ff-d);font-weight:600;font-size:15.5px;color:var(--encre-douce)}
.panel-h .n{font:500 11px var(--ff-m);color:var(--brume)}
.panel-h .more{margin-left:auto;font-size:11.5px;color:var(--cuivre-brule);text-decoration:none;font-weight:600;white-space:nowrap}
.panel-h .more:hover{text-decoration:underline}
.panel-empty{padding:20px 16px;font-size:12.5px;color:var(--brume);line-height:1.5}

.row{display:flex;align-items:center;gap:12px;padding:11px 16px;text-decoration:none;color:inherit}
.row + .row{border-top:1px solid var(--ivoire)}
a.row:hover{background:var(--parchemin)}
.row .rmain{flex:1;min-width:0}
.row .rt{font-family:var(--ff-d);font-weight:600;font-size:14px;color:var(--encre-douce);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .rs{font-size:11.5px;color:var(--brume);margin-top:2px;overflow:hidden;text-overflow:ellipsis}
.row .rv{text-align:right;flex:0 0 auto}
.row .rv b{display:block;font-family:var(--ff-d);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;color:var(--encre)}
.row .rv span{display:block;font-size:10.5px;color:var(--brume);margin-top:1px}

.pill{display:inline-block;padding:3px 9px;border-radius:999px;font-size:10.5px;font-weight:600;white-space:nowrap}
.pill.c{background:#E7F0E4;color:var(--cuivre-brule)}
.pill.v{background:var(--cuivre-brule);color:#fff}
.pill.todo{background:var(--ivoire);color:var(--fumee)}
.pill.r{background:#F6E2E0;color:var(--rouge)}
.pill.amb{background:#F7EBD5;color:var(--ambre)}

/* bande de KPI compacte : informe sans manger un demi-écran */
.kstrip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--ivoire);border:1px solid var(--ivoire);border-radius:10px;overflow:hidden;margin-bottom:14px}
.kstrip .kc{background:var(--creme);padding:13px 16px}
.kstrip .kl{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--brume)}
.kstrip .kv{font-family:var(--ff-d);font-weight:700;font-size:22px;color:var(--encre);font-variant-numeric:tabular-nums;line-height:1.15;margin-top:3px}
.kstrip .kv em{font-style:normal;font-size:12px;color:var(--brume);font-weight:400}
.kstrip .kc.soft .kv{color:var(--brume)}
@media(max-width:560px){.kstrip{grid-template-columns:1fr 1fr}.kstrip .kv{font-size:19px}}

/* mini-grille : plusieurs petites fiches sans cadre, séparées par un filet */
.mini{display:flex;flex-wrap:wrap;background:var(--creme)}
.mini > *{flex:1 1 148px;min-width:148px;padding:11px 14px;text-decoration:none;color:inherit;display:block;border-top:1px solid var(--ivoire);border-right:1px solid var(--ivoire);box-sizing:border-box}
.mini a:hover{background:var(--parchemin)}
.mini .mt{font-family:var(--ff-d);font-weight:600;font-size:13.5px;color:var(--encre-douce);line-height:1.25}
.mini .ms{font-size:11px;color:var(--brume);margin-top:3px}

/* titre de page compact : remplace le grand bloc héros sur les pages de liste */
/* En-tete de page. Le titre porte la page a lui seul : pas d'horodatage ni de
   nom de fichier a cote. La provenance d'un CHIFFRE reste sous le chiffre. */
.phead{margin:2px 0 22px;padding-bottom:15px;border-bottom:1px solid var(--ivoire)}
.phead h1{margin:0;font-family:var(--ff-d);font-weight:600;font-size:32px;letter-spacing:-.012em;
          color:var(--encre);line-height:1.08}
.phead .psub{display:block;font-size:13.5px;color:var(--fumee);margin-top:7px;max-width:64ch;line-height:1.45}
.phead .pnote{display:block;font-size:11px;color:var(--brume);font-family:var(--ff-m);margin-top:7px}
@media(max-width:560px){ .phead h1{font-size:26px} }

/* Grand écran : la colonne latérale s'élargit un peu plutôt que de laisser
   des marges vides de chaque côté. */
@media(min-width:1500px){
  .wrap{max-width:1560px}
  .dash{grid-template-columns:1.7fr 1fr}
}

/* ========================================================================== */
/* BARRE LATÉRALE — un rail étroit, comme le desk LandQuire.                  */
/* Trois sections, une icône chacune. On gagne ~110px de largeur utile pour   */
/* le contenu, et une icône se reconnaît plus vite qu'une ligne de texte.     */
/* Les rubriques non branchées ne sont PAS ici : elles s'annoncent dans la    */
/* page qui les accueillera, pas dans la barre.                               */
/* ========================================================================== */
.shell{display:grid;grid-template-columns:104px minmax(0,1fr);min-height:100vh}
.side{background:var(--topbar);padding:14px 0 16px;position:sticky;top:0;align-self:start;height:100vh;
      display:flex;flex-direction:column;align-items:stretch;gap:2px;overflow-y:auto}
.side .mark{display:block;text-align:center;text-decoration:none;padding:0 6px 14px;margin-bottom:4px;
            border-bottom:1px solid rgba(242,245,241,.10)}
.side .mono-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;
                 background:var(--cuivre);color:#fff;font:700 12.5px var(--ff-m);letter-spacing:.04em}
.side .mark-l{display:block;font-family:var(--ff-d);font-weight:600;font-size:10.5px;line-height:1.25;
              color:#C9D2C6;margin-top:7px}
.side .nav{display:flex;flex-direction:column;gap:2px}
.side .nav a,.side .out{display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 4px 9px;margin:0 7px;
                        border-radius:10px;text-decoration:none;color:#A9B3A6;font-size:10.5px;font-weight:500;
                        line-height:1.2;text-align:center;transition:background .12s,color .12s}
.side .nav a:hover,.side .out:hover{background:rgba(242,245,241,.07);color:#F2F5F1}
.side .nav a.on{background:var(--cuivre);color:#fff;font-weight:600}
.side .nav a.on .ico{opacity:1}
.side .ico{opacity:.9}
.side .out{margin-top:auto;color:#868F84;font-size:10px}

/* Language picker (FR EN ES PT) — top-right corner of every page, modelled on
   the LandQuire desk (ai.landquire.com/desk/public). It floats over the page
   header instead of taking a row, so no page moves; .phead keeps room for it.
   Its right edge follows the right edge of .wrap (1400px, 1560px when wide). */
.main{position:relative}
.ptop{position:absolute;top:20px;right:max(24px,calc((100% - 1400px)/2 + 24px));z-index:5}
.ptop .langs{display:flex;align-items:center;gap:2px;height:36px;padding:0 4px;border-radius:999px;
             background:rgba(23,28,25,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.ptop .langs button{font:600 12.5px var(--ff-b);padding:6px 10px;border:0;border-radius:999px;cursor:pointer;
                    background:transparent;color:var(--fumee);transition:background .12s,color .12s}
.ptop .langs button:hover{color:var(--encre)}
.ptop .langs button.on{background:linear-gradient(140deg,#242B26,#121714);color:#fff;
                       box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.ptop .langsel{display:none;height:34px;padding:0 10px;border:0;border-radius:999px;cursor:pointer;
               background:rgba(23,28,25,.055);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
               font:700 12px var(--ff-b);color:var(--fumee);letter-spacing:.02em}
.phead{padding-right:190px}
/* A page that opens straight on a card (Finance) leaves the corner free. */
.main .wrap > .hero:first-child{margin-top:44px}
@media(min-width:1500px){ .ptop{right:max(24px,calc((100% - 1560px)/2 + 24px))} }

.main{min-width:0;background:var(--parchemin)}
.main .wrap{padding-top:26px}

@media(max-width:860px){
  /* minmax(0,1fr) et non 1fr : sinon la barre, plus large que l'ecran, pousse
     toute la page vers la droite et le contenu sort du telephone. */
  .shell{grid-template-columns:minmax(0,1fr)}
  .side{position:static;height:auto;flex-direction:row;align-items:center;gap:6px;padding:8px 12px;
        min-width:0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  .side .nav a,.side .out{flex:none}
  .side .mark{padding:0 10px 0 0;margin:0;border-bottom:0;border-right:1px solid rgba(242,245,241,.12);display:flex;align-items:center;gap:8px}
  .side .mono-mark{width:28px;height:28px;border-radius:8px;font-size:11px}
  .side .mark-l{display:none}
  .side .nav{flex-direction:row;gap:4px}
  .side .nav a,.side .out{flex-direction:row;gap:6px;padding:7px 12px;margin:0;border-radius:999px;font-size:12.5px}
  .side .nav a .ico,.side .out .ico{width:16px;height:16px}
  .side .out{margin-top:0;margin-left:auto}
  .side .out span{display:none}
  /* Phone: the four labels become one small pill dropdown, as on LandQuire. */
  .ptop{top:14px;right:14px}
  .ptop .langs{display:none}
  .ptop .langsel{display:inline-block}
  .phead{padding-right:76px}
  .main .wrap{padding-top:18px}
}

/* Sur un telephone etroit, on resserre pour garder les trois libelles lisibles
   plutot que de tomber sur des icones seules. */
@media(max-width:430px){
  .side{gap:3px;padding:7px 10px}
  .side .mark{padding-right:8px}
  .side .nav{gap:3px}
  .side .nav a,.side .out{padding:6px 9px;gap:5px;font-size:11.5px}
  .side .nav a .ico,.side .out .ico{width:15px;height:15px}
  .main .wrap{padding-left:14px;padding-right:14px}
}

/* ========================================================================== */
/* CARTES BUSINESS — l'icône et la couleur viennent du type (Gym, Barber...), */
/* voir towerBizTheme() dans shared.js. Un métier se reconnaît d'un coup      */
/* d'oeil, ce qu'une liste de noms ne permet pas.                             */
/* ========================================================================== */
.bizgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:12px}
.bizcard{display:flex;flex-direction:column;gap:10px;background:var(--creme);border:1px solid var(--ivoire);
         border-radius:12px;padding:14px;text-decoration:none;color:inherit;box-shadow:var(--ombre);
         transition:border-color .12s,transform .12s}
.bizcard:hover{border-color:var(--cuivre);transform:translateY(-1px)}
.bizcard .bc-top{display:flex;align-items:flex-start;gap:11px}
.bizcard .bc-ico{flex:none;width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center}
.bizcard .bc-id{display:block;min-width:0;flex:1}
.bizcard .bc-n{display:block;font-family:var(--ff-d);font-weight:600;font-size:15px;color:var(--encre);line-height:1.2}
.bizcard .bc-t{display:block;font-size:11.5px;color:var(--brume);margin-top:2px;line-height:1.35}
.bizcard .bc-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11.5px;color:var(--fumee);
                  border-top:1px solid var(--ivoire);padding-top:9px;margin-top:auto}
.bizcard .bc-meta b{font-weight:600;color:var(--encre-douce)}
.bizcard .bc-meta .none{color:var(--brume);font-style:italic;font-weight:400}
.bizcard .bc-top{display:flex;align-items:flex-start;gap:11px}
.bizcard .bc-meta > span:first-child{font-weight:600;color:var(--encre-douce)}

/* bascule vers le tableau glisser-deposer */
.viewtoggle{display:inline-flex;align-items:center;gap:7px;margin-left:auto;padding:6px 12px;
            border:1px solid var(--ivoire);border-radius:999px;background:var(--creme);
            font:600 12px var(--ff-b);color:var(--fumee);cursor:pointer}
.viewtoggle:hover{border-color:var(--cuivre);color:var(--cuivre-brule)}
.viewtoggle[aria-pressed="true"]{background:var(--cuivre);border-color:var(--cuivre);color:#fff}

/* petite mention de provenance sous un chiffre : d'où il vient, et s'il est prévisionnel */
.kstrip .ksrc{font-size:9.5px;color:var(--brume);margin-top:4px;line-height:1.35}
.kstrip .ksrc.prev{color:var(--ambre)}

/* ========================================================================== */
/* SOUS-SECTIONS D'UNE PAGE                                                   */
/* Une section de la barre de gauche porte ses rubriques DANS la page : la    */
/* barre reste courte, et tout l'Immobilier se lit sans changer d'écran.      */
/* ========================================================================== */
.subnav{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 20px}
.subnav a{padding:5px 12px;border:1px solid var(--ivoire);border-radius:999px;background:var(--creme);
          font-size:12.5px;font-weight:500;color:var(--fumee);text-decoration:none}
.subnav a:hover{border-color:var(--cuivre);color:var(--cuivre-brule)}

.sechead{display:flex;align-items:baseline;gap:9px;margin:28px 0 10px;scroll-margin-top:16px}
.sechead h2{margin:0}
.sechead .n{font:500 11.5px var(--ff-m);color:var(--brume)}
.sechead .more{margin-left:auto;font-size:12px;color:var(--cuivre-brule);text-decoration:none;font-weight:600;white-space:nowrap}
.sechead .more:hover{text-decoration:underline}

/* ce qui reste à brancher : une ligne en bas de page, pas un panneau vide */
.todo-note{margin-top:26px;padding-top:14px;border-top:1px solid var(--ivoire);font-size:12px;line-height:1.5}

/* ========================================================================== */
/* SYNTHÈSE — trois colonnes à partir de 1150px.                              */
/* Cinq panneaux sur deux colonnes laissaient de larges bandes blanches pour  */
/* deux lignes de contenu : la densité vient du nombre de colonnes.           */
/* ========================================================================== */
@media(min-width:1150px){ .dash.dash-3{grid-template-columns:1.25fr 1fr 1fr} }
@media(max-width:1149px){ .dash.dash-3{grid-template-columns:1.4fr 1fr} }
@media(max-width:900px){  .dash.dash-3{grid-template-columns:1fr} }

/* pastille métier dans la liste compacte des businesses (Synthèse) */
.mini > a{display:flex;align-items:center;gap:9px}
.mini .mi{flex:none;width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center}
.mini .mtx{min-width:0}

/* La prochaine action d'un bien, posée sur sa fiche. Elle vient des colonnes
   « Prochaine action » et « Échéance » du registre : c'est un engagement réel,
   pas une décoration — d'où le fond ambré. */
.bizcard .bc-act{display:flex;align-items:flex-start;gap:9px;margin-top:2px;padding:9px 10px;
                 background:#FBF4E6;border:1px solid #EBDCBE;border-radius:8px}
.bizcard .bc-at{flex:1;min-width:0;font-size:11.5px;line-height:1.35;color:#7A5A14;font-weight:500}
.bizcard .bc-ae{flex:none;font:600 10.5px var(--ff-m);color:#8A6A1E;white-space:nowrap;padding-top:1px}

/* Incohérence détectée par la tour elle-même (pas lue dans une feuille). */
.ecart{display:flex;align-items:flex-start;gap:10px;margin:0 0 20px;padding:12px 14px;
       background:#FBF4E6;border:1px solid #EBDCBE;border-radius:10px}
.ecart .et{flex:1;min-width:0;font-size:12.5px;line-height:1.45;color:var(--encre-douce)}
.ecart .et b{display:block;font-weight:600;margin-bottom:2px}
.ecart .ep{flex:none;font:600 10.5px var(--ff-b);color:#7A5A14;background:#F2E4C6;
           border-radius:999px;padding:3px 9px}

/* ========================================================================== */
/* DOSSIER DU BIEN — loyers, encaissements, conformité (page d'un bien)       */
/* ========================================================================== */
.dalias{background:var(--creme);border:1px solid var(--ivoire);border-left:3px solid var(--cuivre);
        border-radius:8px;padding:12px 15px;margin:0 0 16px}
.dalias b{display:block;font-family:var(--ff-d);font-weight:600;font-size:14.5px;color:var(--encre)}
.dalias span{display:block;font-size:12.5px;color:var(--fumee);margin-top:4px;line-height:1.45}
.dalias .da-w{color:var(--ambre);margin-top:6px}

.dsrc{font-size:11.5px;color:var(--brume);margin:10px 0 0}
.dnote{display:block;font-size:11px;color:var(--brume);margin-top:2px;line-height:1.35}

.dmois{background:var(--creme);border:1px solid var(--ivoire);border-radius:10px;padding:14px 16px;margin-bottom:12px}
.dmois .dm-h{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:9px}
.dmois .dm-h h4{margin:0;font-family:var(--ff-d);font-weight:600;font-size:15px;color:var(--encre-douce)}
.dmois .dm-k{font-size:12.5px;color:var(--fumee)}
.dmois .dm-k b{font-variant-numeric:tabular-nums;color:var(--encre)}
.dmois .dm-miss{margin-left:auto;font:600 12px var(--ff-b);color:var(--rouge)}
.dmois .dm-ok{margin-left:auto;font:600 12px var(--ff-b);color:var(--cuivre)}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:8px;margin-top:12px}
.dcell{border:1px solid var(--ivoire);border-radius:8px;padding:9px 10px;background:var(--parchemin)}
.dcell .du{display:block;font:600 11.5px var(--ff-m);color:var(--brume)}
.dcell .pill{margin:5px 0 0}
.dcell .dv{display:block;font-family:var(--ff-d);font-weight:700;font-size:15px;margin-top:5px;
           font-variant-numeric:tabular-nums;color:var(--encre)}

.ztable .r{text-align:right}
.ztable .ztot td{font-weight:600;border-top:2px solid var(--ivoire);background:var(--parchemin)}
.ztable tr.zlate td{background:#FDF6F4}
.ztable .zr{color:var(--rouge);font-weight:600;white-space:nowrap}

.dlinks{display:flex;flex-direction:column;gap:7px}
.dlinks a{display:block;padding:10px 13px;background:var(--creme);border:1px solid var(--ivoire);
          border-radius:8px;text-decoration:none;color:var(--encre-douce);font-size:13px;font-weight:500}
.dlinks a:hover{border-color:var(--cuivre);color:var(--cuivre-brule)}

/* ========================================================================== */
/* FICHE BUSINESS — les départements en colonne à gauche, cliquables.         */
/* Demande de Romain (réunion 2 oct) : « put the departments on the left...   */
/* so we can click on different departments once you go on Power ».           */
/* ========================================================================== */
.bizlayout{display:grid;grid-template-columns:208px minmax(0,1fr);gap:16px;align-items:start}
.deptnav{display:flex;flex-direction:column;gap:3px;position:sticky;top:16px}
.deptnav .dbtn{display:grid;grid-template-columns:26px minmax(0,1fr);gap:3px 10px;align-items:center;
               width:100%;text-align:left;padding:9px 12px;border:1px solid transparent;
               border-radius:9px;background:transparent;cursor:pointer;font-family:var(--ff-b);
               transition:background .12s,border-color .12s}
.deptnav .dbtn .di{grid-row:1 / span 2;width:26px;height:26px;border-radius:8px;
                   display:flex;align-items:center;justify-content:center}
.deptnav .dbtn .dw{grid-column:2}
.deptnav .dbtn:hover{background:var(--creme);border-color:var(--ivoire)}
.deptnav .dbtn .dn{display:block;font-size:13.5px;font-weight:600;color:var(--encre-douce);line-height:1.25}
.deptnav .dbtn .dw{display:block;font-size:11px;color:var(--brume);margin-top:2px;line-height:1.3}
.deptnav .dbtn.on{background:var(--creme);border-color:var(--ivoire);
                  border-left:3px solid var(--dfg,var(--cuivre));padding-left:10px}
.deptnav .dbtn.on .dn{color:var(--encre)}
.deptbody{min-width:0;display:grid;gap:14px;align-content:start}

/* une ligne « ce qu'on attend ici, et de qui » */
.dintro{margin:0 0 14px;font-size:13px;line-height:1.5;color:var(--fumee)}
.att{border-top:1px solid var(--ivoire);padding:10px 0}
.att:first-of-type{border-top:0;padding-top:0}
.att .at{font-weight:600;font-size:13px;color:var(--encre-douce)}
.att .aq{font-size:12.5px;color:var(--fumee);margin-top:2px;line-height:1.45}
.att .aw{font-size:11.5px;color:var(--ambre);margin-top:3px}
.deptbody .cbody,.deptbody .panel > .mini{padding:0}
.deptbody .panel .cbody,.deptbody .panel-h + div:not(.mini):not(.panel-empty){padding:14px 16px}

@media(max-width:860px){
  .bizlayout{grid-template-columns:1fr}
  .deptnav{position:static;flex-direction:row;flex-wrap:wrap;gap:6px}
  .deptnav .dbtn{width:auto;padding:7px 12px;border-radius:999px;border-color:var(--ivoire);background:var(--creme)}
  .deptnav .dbtn.on{border-left-width:1px;padding-left:12px;border-color:var(--cuivre)}
  .deptnav .dbtn .dw{display:none}
}

/* ========================================================================== */
/* EN-TÊTE D'UN DÉPARTEMENT                                                   */
/* Le titre ne porte QUE le nom du département. Le responsable est une        */
/* mention distincte, à droite. Avant, les deux étaient collés dans un même   */
/* titre de 15,5 px — à peine plus gros que le texte courant — et se lisaient */
/* comme une seule phrase.                                                    */
/* ========================================================================== */
.panel.dept{overflow:hidden}
.depthead{display:flex;align-items:flex-start;gap:13px;padding:16px 18px;
          border-bottom:1px solid var(--ivoire);
          background:linear-gradient(180deg,#FBFCFB 0%,var(--creme) 100%);
          position:relative}
.depthead::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--dfg,var(--cuivre))}
.depthead .dh-ico{flex:none;width:40px;height:40px;border-radius:11px;display:flex;
                  align-items:center;justify-content:center;margin-top:1px}
.depthead .dh-t{flex:1;min-width:0}
.depthead .dh-n{display:block;font-family:var(--ff-d);font-weight:600;font-size:22px;
                letter-spacing:-.012em;color:var(--encre);line-height:1.15}
.depthead .dh-s{display:block;font-size:12.5px;line-height:1.5;color:var(--fumee);
                margin-top:5px;max-width:68ch}
.depthead .dh-r{flex:none;text-align:right;padding-left:10px}
.depthead .dh-rl{display:block;font:600 9.5px var(--ff-m);letter-spacing:.09em;
                 text-transform:uppercase;color:var(--brume)}
.depthead .dh-rn{display:block;font-size:13px;font-weight:600;color:var(--encre-douce);margin-top:3px}
.depthead .dh-rn.none{font-weight:400;font-style:italic;color:var(--brume)}
.panel.dept .dbody{padding:16px 18px}

@media(max-width:620px){
  .depthead{flex-wrap:wrap}
  .depthead .dh-n{font-size:19px}
  .depthead .dh-r{width:100%;text-align:left;padding-left:0;padding-top:4px;
                  border-top:1px solid var(--ivoire);margin-top:4px}
}

/* ========================================================================== */
/* LIVRE RECOMMANDÉ — un encart, pas une rubrique.                            */
/* Romain recommande deux livres d'Alex Hormozi et veut que leur cadre soit   */
/* sous les yeux de tout le monde. La couverture est dessinée en CSS : la     */
/* vraie jaquette est une œuvre protégée.                                     */
/* ========================================================================== */
.bookcard{margin-top:18px;border:1px solid var(--ivoire);border-radius:14px;overflow:hidden;
          background:var(--creme);box-shadow:var(--ombre)}
.bk-head{display:flex;gap:16px;padding:18px;background:linear-gradient(135deg,#FAFBFA 0%,var(--parchemin) 100%);
         border-bottom:1px solid var(--ivoire)}
.bk-cover{flex:none;width:86px;height:118px;border-radius:4px 7px 7px 4px;position:relative;
          display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;
          padding:10px;text-align:center;color:#fff;
          background:linear-gradient(135deg,var(--bc) 0%,color-mix(in srgb,var(--bc) 62%,#000) 100%);
          box-shadow:0 3px 10px rgba(27,26,23,.22)}
.bk-cover::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;border-radius:4px 0 0 4px;
                  background:rgba(0,0,0,.22)}
.bk-ct{font-family:var(--ff-d);font-weight:700;font-size:15px;line-height:1.1;letter-spacing:-.01em}
.bk-ca{font:500 8px var(--ff-m);letter-spacing:.08em;text-transform:uppercase;opacity:.85}
.bk-img{flex:none;width:86px;border-radius:5px;box-shadow:0 3px 10px rgba(27,26,23,.22)}
.bk-meta{min-width:0;flex:1}
.bk-kicker{font:600 9.5px var(--ff-m);letter-spacing:.09em;text-transform:uppercase;color:var(--bc)}
.bk-title{font-family:var(--ff-d);font-weight:700;font-size:21px;color:var(--encre);line-height:1.15;margin-top:5px}
.bk-author{font-size:12.5px;color:var(--fumee);margin-top:2px}
.bk-why{margin:9px 0 0;font-size:12.5px;line-height:1.5;color:var(--fumee);max-width:62ch}

.bk-grids{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:0}
.bk-grp{padding:15px 18px;border-right:1px solid var(--ivoire)}
.bk-grp:last-child{border-right:0}
.bk-grp h4{margin:0 0 10px;font:600 9.5px var(--ff-m);letter-spacing:.09em;text-transform:uppercase;color:var(--brume)}
.bk-grp ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.bk-grp li{display:grid;gap:1px;padding-left:13px;position:relative}
.bk-grp li::before{content:"";position:absolute;left:0;top:6px;width:5px;height:5px;border-radius:50%;background:var(--bc)}
.bi-t{font-size:13px;font-weight:600;color:var(--encre-douce);line-height:1.3}
.bi-d{font-size:11.5px;color:var(--fumee);line-height:1.4}
.bi-w{font-size:11px;color:var(--ambre)}
.bk-note{padding:12px 18px;border-top:1px solid var(--ivoire);background:#FBF4E6;
         font-size:12px;line-height:1.5;color:#7A5A14}
@media(max-width:620px){
  .bk-head{flex-direction:column}
  .bk-grp{border-right:0;border-top:1px solid var(--ivoire)}
  .bk-grp:first-child{border-top:0}
}

/* Première lettre toujours en majuscule sur les intitulés.
   Nos textes sont déjà corrects ("Prospection tiède"), mais le site est lu via
   la traduction automatique du navigateur, qui capitalise « Cold prospecting »
   et pas « lukewarm prospecting ». Ceci corrige l'affichage quelle que soit la
   traduction, sans toucher au reste du texte. */
.att .at::first-letter,
.bi-t::first-letter,
.bk-grp h4::first-letter,
.deptnav .dbtn .dn::first-letter,
.depthead .dh-n::first-letter{text-transform:uppercase}

/* ========================================================================== */
/* ---- Compte de résultat (P&L) d'un business — Irfan, 7 oct 2026 -----------
   Redessiné le 12 oct 2026 : filtres de période et de monnaie, et un graphique
   en colonnes à la place des 23 barres couchées, qui ne tenaient plus à l'écran.
   Classes préfixées « pnl- » et « pc- » : shared.css possède déjà beaucoup de
   noms courts et les peint (piège 22). Ces textes vivent DANS une carte claire,
   pas sur le fond sombre de la page : ils prennent donc var(--brume) comme les
   autres textes secondaires de carte, et surtout PAS --mist-note, qui est pâle
   et les rendait illisibles (1,43 contre 1 — piège 16, repris le 7 oct 2026). */
.pnl-kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:0 0 4px}
.pnl-kpis .kv small{display:block;margin-top:1px}
.pnl-sub{font-size:12px;margin:0 0 12px;line-height:1.45;color:var(--brume)}
.pnl-note{font-size:11.5px;margin:14px 0 0;line-height:1.5;color:var(--brume)}
.pnl-note-warn{border-left:3px solid var(--pnl-warn);padding:8px 0 8px 11px;margin:12px 0 4px;color:var(--encre)}
.pnl-flag{color:var(--pnl-warn);font-size:12px;margin-left:3px;cursor:help}
.ztable th.num{text-align:right}
.ztable tr.pnl-warn td:first-child{font-style:italic}
.subsec .tchart,.subsec .tlegend{margin-top:2px}

/* Les filtres. Des pastilles, comme le sélecteur de langue en haut à droite :
   une forme déjà connue ailleurs sur le site, donc rien de nouveau à apprendre. */
.pnl-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 14px}
.pnl-ctrl-l{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--brume)}
.pnl-chips{display:inline-flex;flex-wrap:wrap;gap:4px;padding:3px;border-radius:999px;
  background:rgba(23,28,25,.05);border:1px solid var(--ivoire)}
.pnl-chip{appearance:none;border:0;cursor:pointer;font:inherit;font-size:11.5px;font-weight:500;
  padding:5px 11px;border-radius:999px;background:transparent;color:var(--fumee);
  transition:background .15s,color .15s}
.pnl-chip:hover{background:rgba(23,28,25,.07);color:var(--encre)}
.pnl-chip.on{background:var(--encre);color:#fff}
.pnl-chip:focus-visible{outline:2px solid var(--encre);outline-offset:1px}

/* Un mois = une colonne. La hauteur, c'est les revenus ; la coupe, c'est ce qui
   est parti et ce qui est resté. Les couleurs viennent de TOWER_CHART, posées
   en style par le gabarit : une seule source pour la palette. */
.pnl-cols{position:relative;display:flex;align-items:flex-end;gap:3px;height:210px;
  padding:18px 0 0;margin:2px 0 0;border-bottom:1px solid var(--ivoire)}
.pnl-max{position:absolute;top:0;right:0;font-size:10px;color:var(--brume);
  font-variant-numeric:tabular-nums}
.pnl-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;
  align-items:center;height:100%;position:relative;border-radius:5px 5px 0 0;cursor:default}
.pnl-col:hover,.pnl-col:focus-visible{background:rgba(23,28,25,.05);outline:none}
.pc-bars{display:flex;flex-direction:column;width:100%;max-width:26px;border-radius:4px 4px 0 0;
  overflow:hidden;transform-origin:bottom center;
  /* court et sans attente : le graphique se redessine a chaque clic de filtre,
     et une pause de 0,15 s avant de commencer donnait un graphique vide. */
  animation:towerBarIn .45s cubic-bezier(.22,.7,.25,1) backwards}
@media (prefers-reduced-motion:reduce){.pc-bars{animation:none}}
.pc-bars i{display:block;width:100%;min-height:1px}
.pnl-col:hover .pc-bars i{filter:brightness(1.1) saturate(1.1)}
.pc-lbl{margin-top:6px;font-size:9.5px;line-height:1.15;color:var(--brume);text-align:center;
  max-width:100%;min-height:22px}
.pc-lbl b,.pc-lbl s{display:block;font-weight:500;text-decoration:none;white-space:nowrap}
.pc-lbl s{font-size:8.5px;opacity:.75}
.pc-flag{position:absolute;top:0;font-size:10px;color:var(--pnl-warn)}
.pnl-col.doute .pc-bars{outline:1px dashed var(--pnl-warn);outline-offset:1px}

@media (max-width:700px){
  .pnl-cols{height:150px;gap:2px}
  .pc-lbl{font-size:8.5px}
  .pnl-ctrl{gap:4px 8px}
}

/* THÈME DÉGRADÉ — d'après le desk LandQuire (ai.landquire.com/desk/public).  */
/* Tout le « nouveau look » tient dans ce bloc, posé PAR-DESSUS les règles    */
/* ci-dessus : aucune n'a été réécrite. Pour revenir à l'ancien look, il      */
/* suffit de supprimer ce bloc (jusqu'à « FIN DU THÈME »).                     */
/*                                                                            */
/*   fond      : vert-noir très sombre + halos vert / turquoise               */
/*   page      : grand panneau clair flottant, lavé de dégradés doux          */
/*   barre     : verre sombre flottant, onglet actif en dégradé vert          */
/*   cartes    : verre blanc + ombre douce ; chiffres clés en cartes pastel   */
/*   jauges    : dégradé vert lumineux                                        */
/* ========================================================================== */
:root{
  --encre:#171C19; --encre-douce:#1F2621; --fumee:#4B554E; --brume:#7E8781; --ardoise:#3A433C;
  --creme:rgba(255,255,255,.62); --ivoire:rgba(23,28,25,.09); --parchemin:rgba(23,28,25,.035);
  --g-hi:#65B16D; --g-deep:#2C6341;
  --grad-green:linear-gradient(140deg,#65B16D,#2C6341);
  --grad-dark:linear-gradient(140deg,#242B26,#121714);
  --glass-border:1px solid rgba(255,255,255,.85);
  --ombre:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px rgba(23,28,25,.07),0 14px 30px -16px rgba(23,28,25,.18);
  --ombre-hover:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px rgba(23,28,25,.07),0 26px 50px -20px rgba(23,28,25,.26);
  --tile-teal:linear-gradient(140deg,#C9E7EF,#E6F5F8);
  --tile-green:linear-gradient(150deg,#DFF3CB,#F0FAE4);
  --tile-gold:linear-gradient(150deg,#F9E9AE,#FDF4D6);
  --tile-mint:linear-gradient(150deg,#D7EFE6,#EEF8F4);
}

/* --- fond et cadre de page ------------------------------------------------ */
body{background:
  radial-gradient(820px 820px at -6% -12%,rgba(141,193,84,.16),transparent 62%),
  radial-gradient(740px 740px at 106% 14%,rgba(117,200,214,.12),transparent 62%),
  radial-gradient(700px 700px at 44% 118%,rgba(47,120,115,.14),transparent 62%),
  linear-gradient(180deg,#0F130E 0%,#141A13 55%,#0E120D 100%);
  background-attachment:fixed;background-color:#10140F}
.shell{gap:14px;padding:14px}
.side{top:14px;height:calc(100vh - 28px);border-radius:28px;
      background:rgba(19,25,20,.72);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4);
      border:1px solid rgba(255,255,255,.1);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 20px 44px -22px rgba(0,0,0,.65)}
.side .mark{border-bottom-color:rgba(242,245,241,.08)}
.side .mono-mark{background:var(--grad-green);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.side .nav a.on{background:var(--grad-green);
                box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 22px -10px rgba(101,177,109,.7)}
.main{min-height:calc(100vh - 28px);border-radius:28px;background:#FCFDFC;isolation:isolate;
      border:1px solid rgba(255,255,255,.6);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 30px 64px -38px rgba(0,0,0,.55)}
.main::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;background:
  radial-gradient(900px 620px at 14% 0%,rgba(141,193,84,.30),transparent 60%),
  radial-gradient(1000px 700px at 100% 2%,rgba(117,200,214,.34),transparent 60%),
  radial-gradient(900px 600px at 0% 26%,rgba(47,120,115,.16),transparent 60%),
  radial-gradient(1000px 700px at 100% 42%,rgba(141,193,84,.20),transparent 60%),
  radial-gradient(900px 600px at 6% 60%,rgba(248,195,0,.13),transparent 60%),
  radial-gradient(1000px 650px at 100% 76%,rgba(117,200,214,.24),transparent 60%),
  radial-gradient(900px 600px at 0% 94%,rgba(141,193,84,.24),transparent 60%),
  radial-gradient(1000px 650px at 100% 100%,rgba(248,195,0,.12),transparent 62%)}
.phead{border-bottom-color:rgba(23,28,25,.08)}
.phead h1,h1{color:var(--encre)}

/* --- cartes en verre ------------------------------------------------------- */
.panel,.hero,.chapx,.toc,.lanebox,.bizcard,.watch,.empty,.phasestrip,.kanban-card,.dmois,.dalias,
.bookcard,table.ztable,.dlinks a{
  background:rgba(255,255,255,.62);border:var(--glass-border);box-shadow:var(--ombre);
  -webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35)}
.panel,.chapx,.bookcard{border-radius:22px}
.lanebox,.bizcard,.toc,.phasestrip,.dmois,.empty,.watch{border-radius:18px}
.hero{border-radius:24px;background:linear-gradient(150deg,rgba(141,193,84,.20),rgba(255,255,255,.66) 58%)}
.hero::before{height:0}
.hero.cockpit{background:linear-gradient(140deg,rgba(201,231,239,.95),rgba(230,245,248,.75))}
.panel-h,.chapx>summary,.depthead,.bk-head{border-bottom-color:rgba(23,28,25,.07)}
.depthead,.bk-head{background:linear-gradient(150deg,rgba(101,177,109,.10),rgba(255,255,255,.4))}
.subsec{border-radius:14px;border:1px solid rgba(23,28,25,.07);background:rgba(255,255,255,.55)}
table.ztable{border-radius:16px}
table.ztable tr:nth-child(even) td{background:rgba(23,28,25,.025)}
.dcell{background:rgba(255,255,255,.55);border-color:rgba(23,28,25,.07);border-radius:12px}
.deptpane > * + *{margin-top:14px}

/* cliquable = se soulève */
a.lanebox,.bizcard,.kanban-card,.dlinks a{transition:transform .22s,box-shadow .22s,border-color .22s}
a.lanebox:hover,a.bizcard:hover,.kanban-card:hover,.dlinks a:hover{transform:translateY(-2px);box-shadow:var(--ombre-hover);border-color:rgba(255,255,255,.95)}
a.row{border-radius:12px;margin:0 6px}
a.row:hover{background:rgba(101,177,109,.10)}
.mini a:hover{background:rgba(101,177,109,.10)}

/* --- chiffres clés : cartes pastel ----------------------------------------- */
.kstrip{background:transparent;border:0;gap:12px;overflow:visible}
.kstrip .kc{border-radius:20px;padding:15px 18px;border:var(--glass-border);box-shadow:var(--ombre)}
.kstrip .kc:nth-child(4n+1){background:var(--tile-teal)}
.kstrip .kc:nth-child(4n+2){background:var(--tile-green)}
.kstrip .kc:nth-child(4n+3){background:var(--tile-gold)}
.kstrip .kc:nth-child(4n+4){background:var(--tile-mint)}
.kstrip .kc.soft{background:rgba(255,255,255,.55)}
.kstrip .kv{color:var(--encre)}
.lecture{background:linear-gradient(150deg,rgba(101,177,109,.20),rgba(255,255,255,.66));border:var(--glass-border);
         box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}

/* --- jauges, étapes, pastilles --------------------------------------------- */
@keyframes towerBarIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.pbar,.hbar{background:rgba(23,28,25,.11);box-shadow:inset 0 1px 2px rgba(23,28,25,.10);border-radius:999px}
.pbar>i,.hbar i{background:linear-gradient(90deg,var(--g-hi),var(--g-deep));border-radius:999px;
                box-shadow:0 0 8px rgba(101,177,109,.4);transform-origin:left center;
                animation:towerBarIn .9s cubic-bezier(.22,.7,.25,1) .15s backwards}
.phasestrip .ps.done::before,.phasestrip .ps.on::before{background:linear-gradient(90deg,var(--g-hi),var(--g-deep))}
.phasestrip .ps.done i{background:var(--grad-green);border-color:transparent}
.toc li>a b,.chapx .cn{background:var(--grad-green);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.toc li>a:hover{background:rgba(101,177,109,.12)}
.b-type,.pill.v{background:var(--grad-dark);color:#fff}
.b-phase,.pill.c{background:rgba(101,177,109,.16);color:var(--g-deep)}
.up-btn{background:var(--grad-green);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 22px -10px rgba(44,99,65,.6)}
.up-btn:hover{background:var(--grad-green);filter:brightness(1.06)}

.chip,.subnav a,.viewtoggle,.chapters a{background:rgba(255,255,255,.62);border:1px solid rgba(23,28,25,.12);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
  transition:background .16s,color .16s,border-color .16s}
.chip:hover,.subnav a:hover,.chapters a:hover{border-color:rgba(23,28,25,.25);color:var(--encre)}
.chip.on,.viewtoggle[aria-pressed="true"],.pm-bar button.on{background:var(--grad-dark);border-color:transparent;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 18px -8px rgba(23,28,25,.45)}
.chapters{background:rgba(252,253,252,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
          border-radius:0 0 16px 16px}
.kanban-col{background:rgba(23,28,25,.05);border-radius:18px}
.kanban-col.vide{border-color:rgba(23,28,25,.12)}
.deptnav .dbtn:hover,.deptnav .dbtn.on{background:rgba(255,255,255,.66);border-color:rgba(255,255,255,.9);box-shadow:var(--ombre)}
#toast{background:rgba(19,25,20,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:14px}

@media(max-width:860px){
  /* the top bar is already exactly as wide as a phone: it runs edge to edge
     (no side margin, no border), only the page panel floats */
  .shell{padding:0 10px 10px;gap:10px}
  .side{top:auto;height:auto;margin:0 -10px;border-width:0 0 1px;border-radius:0 0 22px 22px}
  .main{border-radius:22px;min-height:0}
}

/* ========================================================================== */
/* GRAPHIQUES — barres horizontales et barres empilées (voir towerBars() et   */
/* towerStack() dans shared.js). Règles : barres fines à bout arrondi, valeur */
/* écrite au bout de chaque barre (rien n'est caché derrière un survol),      */
/* légende dès qu'il y a deux séries, couleurs validées pour le daltonisme.   */
/* ========================================================================== */
.tchart{display:grid;gap:4px}
.tb-row{display:grid;grid-template-columns:clamp(96px,26%,220px) minmax(0,1fr);align-items:center;gap:12px;
        padding:6px 8px;margin:0 -8px;border-radius:10px;text-decoration:none;color:inherit;outline:none}
a.tb-row:hover,.tb-row:focus-visible{background:rgba(101,177,109,.10)}
.tb-l{font-size:12.5px;color:var(--fumee);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-track{display:flex;align-items:center;gap:8px;min-width:0}
.tb-bars{display:flex;gap:2px;height:14px;flex:none;width:calc((100% - 110px) * var(--w,0));min-width:3px}
.tb-bars i{display:block;height:100%;flex:none;transform-origin:left center;
           animation:towerBarIn .9s cubic-bezier(.22,.7,.25,1) .15s backwards}
.tb-bars i:last-child{border-radius:0 4px 4px 0}
.tb-row:hover .tb-bars i,.tb-row:focus-visible .tb-bars i{filter:brightness(1.1) saturate(1.1)}
.tb-v{font-size:12.5px;font-weight:600;color:var(--encre);white-space:nowrap}
.tb-v small{font-weight:500;color:var(--brume);margin-left:4px}
.tb-zero .tb-bars{min-width:0;width:0}
.tlegend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 10px;font-size:12px;color:var(--fumee)}
.tlegend span{display:inline-flex;align-items:center;gap:6px}
.tlegend span::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--sw)}
.tchart-note{font-size:11px;color:var(--brume);margin:10px 0 0}
.panel > .tbody{padding:14px 18px 16px}
#tower-tip{position:fixed;z-index:80;pointer-events:none;max-width:280px;padding:8px 11px;border-radius:12px;
           background:rgba(19,25,20,.92);color:#E9EEE8;font-size:12px;line-height:1.4;
           box-shadow:0 12px 28px -12px rgba(0,0,0,.5);opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
#tower-tip.on{opacity:1;transform:none}
#tower-tip b{display:block;color:#fff;font-size:13px}
@media(max-width:560px){ .tb-row{grid-template-columns:minmax(80px,38%) minmax(0,1fr);gap:8px} .tb-bars{width:calc((100% - 92px) * var(--w,0))} }
/* ========================================================================== */
/* PALETTE « MIST » — choisie par Azim le 4 oct 2026 (Ocean Teal → Deep      */
/* Ocean → Frost → Deep Glass → Smoked Glass → Mist). Posée sur la structure  */
/* du thème ci-dessus : cadre marine profond, page en brume bleu-gris         */
/* translucide, cartes en verre dépoli, accents glace / turquoise / citron.   */
/*                                                                            */
/* LISIBILITÉ — vérifiée, pas devinée (4 oct 2026) : chaque texte mesuré       */
/* contre son vrai fond, norme WCAG AA (4,5:1 ; 3:1 pour les grands titres).  */
/*   textes posés sur la brume (titres de page et de section, notes) : clairs */
/*     — 10,6:1 pour un titre, 5,9:1 minimum pour une note, même sur le halo  */
/*     le plus lumineux ;                                                     */
/*   textes dans les cartes : encres foncées (--fumee / --brume) — la brume   */
/*     se voit à travers la carte, d'où des gris plus soutenus que d'habitude.*/
/* Avant de changer une couleur de texte ou l'opacité d'une carte ici, faire  */
/* refaire la mesure (voir STATUS.md, « Look and charts »).                   */
/* ========================================================================== */
:root{
  /* --grad-green carries white text (numbered circles, upload button): its light end
     #1F7A90 keeps white at 4.95:1. The brighter #3FB6C9 (2.4:1) is for bars only. */
  --g-hi:#3FB6C9; --g-deep:#145F72; --grad-green:linear-gradient(140deg,#1F7A90,#0F4C5F);
  --encre:#14202A; --encre-douce:#1A2731; --fumee:#2F3D47; --brume:#3F4D57; --ardoise:#26323A;
  --mist-light:#E8F0F5; --mist-sub:#C9D6DF; --mist-note:#C3D2DC; --mist-link:#A6DEEC;
  --ink-link:#0E4C5F;
}
body{line-height:1.5;background:
  radial-gradient(900px 900px at -8% -12%,rgba(63,182,201,.26),transparent 62%),
  radial-gradient(800px 800px at 108% 18%,rgba(70,120,210,.22),transparent 62%),
  radial-gradient(760px 760px at 44% 120%,rgba(20,95,114,.30),transparent 62%),
  linear-gradient(180deg,#07101A 0%,#0B1824 55%,#060E16 100%);background-attachment:fixed;background-color:#0B1824}

/* barre latérale : verre marine, onglet actif en glace avec un liseré citron */
.side{background:rgba(8,20,30,.78);border-color:rgba(140,210,230,.14)}
.side .nav a{color:#9DB4BE}
.side .out{color:#A9BCC9}
.side .nav a.on,.side .nav a.on .ico{color:#0B2230}
.side .nav a.on{background:linear-gradient(140deg,rgba(244,251,254,.95),rgba(207,232,244,.85));
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(200,242,122,.55),0 10px 24px -10px rgba(190,228,245,.9)}
.side .mono-mark{background:linear-gradient(140deg,#F4FBFE,#CFE8F4);color:#0B2230}

/* la page : brume bleu-gris translucide sur le cadre, halos doux */
.main{background:rgba(58,86,110,.50);-webkit-backdrop-filter:blur(30px) saturate(1.2);backdrop-filter:blur(30px) saturate(1.2);
      border-color:rgba(200,225,240,.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 64px -38px rgba(0,0,0,.6)}
.main::before{background:
  radial-gradient(1000px 640px at 20% 0%,rgba(160,210,232,.13),transparent 62%),
  radial-gradient(900px 600px at 100% 20%,rgba(185,238,106,.10),transparent 60%),
  radial-gradient(1000px 700px at 50% 100%,rgba(160,210,232,.18),transparent 62%)}

/* textes posés directement sur la brume : clairs */
.phead h1,.sechead h2,.locked h1,.wrap > h2,.chapter > h2{color:var(--mist-light)}
.phead h1,.sechead h2,.wrap > h2,.chapter > h2{text-shadow:0 1px 12px rgba(8,20,30,.35)}
.phead .psub{color:var(--mist-sub)}
.phead .pnote,.sechead .n,.note,.gov,.todo-note,.kanban-hint,.tchart-note,.locked .note{color:var(--mist-note)}
.phead{border-bottom-color:rgba(232,240,245,.12)}
.gov,.todo-note{border-top-color:rgba(232,240,245,.12)}
.wrap > .back,.sechead .more{color:var(--mist-link)}

/* cartes : verre dépoli clair, bord glacé */
.panel,.lanebox,.bizcard,.chapx,.toc,.hero,.empty,.phasestrip,.bookcard,.dalias,.dmois,table.ztable,.kanban-card,.dlinks a{
  background:rgba(242,247,250,.86);-webkit-backdrop-filter:blur(24px) saturate(1.3);backdrop-filter:blur(24px) saturate(1.3);
  border-color:rgba(255,255,255,.65)}
.panel,.lanebox,.bizcard,.chapx,.toc,.kstrip .kc{
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(150,205,230,.18),0 18px 36px -20px rgba(30,90,130,.28),0 0 24px -6px rgba(190,228,245,.55)}
/* Number tiles keep the pastel gradients of the theme above (ice / lime /
   gold / mint, one per tile) — chosen by Azim on 4 Oct 2026 — with an icy
   border and a lime top line. A tile with no figure yet stays plain ice. */
.kstrip .kc{border:1px solid rgba(214,238,248,1);border-top:2px solid rgba(185,238,106,.85)}
.kstrip .kc.soft{background:rgba(242,247,250,.80)}.panel-h{border-bottom-color:rgba(140,190,215,.22)}
.subsec{background:rgba(255,255,255,.45)}

/* encres dans les cartes */
a,.panel a,.panel-h .more,.lanebox a,.bizcard a,.chapx a,.toc a,.hero a{color:var(--ink-link)}
.kstrip .kl,.ckk .kl,.kpi .kl,.fund .flabel{font-size:11px;letter-spacing:.05em;color:var(--brume)}
.kstrip .ksrc{font-size:10.5px;line-height:1.45}
.kstrip .ksrc.prev{color:#6B4405}
.row .rs,.lb-sub,.mini .ms,.bizcard .bc-t{font-size:12px;color:var(--brume)}
.dintro,.depthead .dh-s,.bk-why,.att .aq,.lecture,details.second p{line-height:1.62}
.tb-l{color:var(--fumee)} .tb-v small{color:var(--brume)}
.ztable th{color:var(--brume)}
.toc .tl,.subsec .sn,.cockpit .kicker{color:#2C6341}
.phasestrip .ps small{color:var(--brume)}
.phasestrip .ps.done small{color:#2C6341}
.phasestrip .ps.on small{color:var(--encre)}

/* pastilles, boutons, jauges */
.b-type,.pill.v{background:linear-gradient(140deg,#123448,#0A1E2B)}
.pill.ambre,.pill.amb{color:#6B4405}
.b-phase,.pill.c{color:var(--ink-link);background:rgba(63,182,201,.20)}
.chip,.subnav a,.viewtoggle{background:rgba(244,248,250,.94);color:#2E3B44}
.chip.on,.viewtoggle[aria-pressed="true"]{background:linear-gradient(140deg,#1F7A90,#0F4C5F);color:#fff}
.deptnav .dbtn{background:rgba(244,248,250,.94)}
.pbar>i,.hbar i{background:linear-gradient(90deg,#B9EE6A,#5FAE3A);box-shadow:0 0 8px rgba(140,210,80,.4)}
a.row:hover,.mini a:hover,a.tb-row:hover,.tb-row:focus-visible{background:rgba(91,184,201,.12)}
.kanban-col{background:rgba(232,240,245,.10)}
.kanban-col h3{color:var(--mist-sub)}
.kanban-col.vide{border-color:rgba(232,240,245,.18)}
.chapters{background:rgba(22,38,58,.85)}

/* sélecteur de langue, sur la brume */
.ptop .langs{background:rgba(232,240,245,.10);box-shadow:none}
.ptop .langs button{color:var(--mist-sub)}
.ptop .langs button:hover{color:#fff}
.ptop .langs button.on{background:#F4F8FA;color:#0B2230}
.ptop .langsel{background:rgba(232,240,245,.12);color:var(--mist-light)}
.ptop .langsel option{color:#14202A}

/* ========================================================================== */
/* COINS ARRONDIS — demande d'Azim : chaque rectangle a des coins doux,       */
/* barres de graphique comprises (pilules entières, légendes en ronds).       */
/* ========================================================================== */
.tb-bars{height:16px}
.tb-bars i,.tb-bars i:last-child{border-radius:8px}
.tlegend span::before{border-radius:50%}
table.ztable{border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:18px}
table.ztable tr:last-child td{border-bottom:0}
.pmwrap,.map,.pmmap,.leaflet-container{border-radius:18px}
.strip img,.bk-img{border-radius:14px}
.pm-bar{border-radius:18px 18px 0 0}
.pm-bar button,.up-btn,.viewtoggle,.chip,.subnav a,.chapters a{border-radius:999px}
.kanban-col{border-radius:20px}
.kanban-card{border-radius:16px}
.ecart{border-radius:16px}
.ecart .ep{border-radius:999px}
.bizcard{border-radius:20px}
.bizcard .bc-ico,.depthead .dh-ico{border-radius:14px}
.bizcard .bc-act{border-radius:14px}
.mini .mi{border-radius:10px}
.deptnav .dbtn{border-radius:14px}
.lecture,.dalias,.subsec,.dlinks a,.dcell{border-radius:16px}
.toc li>a{border-radius:12px}
.lanebox,.toc,.phasestrip,.dmois,.empty,.watch{border-radius:20px}
.panel,.chapx,.bookcard{border-radius:24px}
.hero{border-radius:26px}
.kstrip .kc{border-radius:22px}
.pill,.s-wrap,.pmitem .st{border-radius:999px}
#toast,#tower-tip{border-radius:16px}
.side .nav a,.side .out{border-radius:14px}
.side .mono-mark{border-radius:12px}
/* ========================================================================== */
/* INTERRUPTEUR CLAIR / SOMBRE — « liquid pill » (choisi par Azim, 5 oct      */
/* 2026) : une capsule de verre, une bulle brillante glisse vers la lune      */
/* (sombre) ou le soleil (clair). Voir towerThemeSwitch() dans shared.js.     */
/* ========================================================================== */
.ptop{display:flex;align-items:center;gap:10px}
.phead{padding-right:270px}
.tsw{position:relative;flex:none;width:76px;height:36px;border-radius:999px;display:flex;align-items:center;justify-content:space-between;
  padding:0 10px;cursor:pointer;font:inherit;color:var(--mist-sub);
  -webkit-backdrop-filter:blur(14px) saturate(1.6);backdrop-filter:blur(14px) saturate(1.6);
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.35),inset 0 -1px 2px rgba(0,0,0,.25),0 6px 18px -8px rgba(0,0,0,.45)}
.tsw svg{position:relative;z-index:2;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tsw .knob{position:absolute;top:2px;left:42px;width:30px;height:30px;border-radius:50%;z-index:1;
  transition:left .38s cubic-bezier(.3,1.4,.5,1);
  background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.95),rgba(255,255,255,.35) 38%,rgba(190,228,245,.25) 70%,rgba(255,255,255,.55));
  box-shadow:inset 0 -3px 6px rgba(20,60,90,.25),inset 0 2px 3px rgba(255,255,255,.9),0 4px 10px -2px rgba(0,0,0,.35),0 0 14px rgba(190,228,245,.55)}
.tsw .moon{color:#0B2230}
.tsw:focus-visible{outline:2px solid var(--mist-link);outline-offset:3px}
/* phone: language + switch get their own row at the top right, above the page,
   instead of floating over the title (too wide to float once the switch was added) */
@media(max-width:860px){
  .ptop{position:static;justify-content:flex-end;padding:12px 14px 0}
  .phead{padding-right:0}
  .main .wrap{padding-top:10px}
  .main .wrap > .hero:first-child{margin-top:0}
}

/* ========================================================================== */
/* HALO DOUX AU SURVOL — « soft halo » (choisi par Azim, 5 oct 2026) : le     */
/* verre se soulève, son bord s'éclaire et un halo glacé apparaît autour.     */
/* Le clavier (focus) reçoit le même halo que la souris.                      */
/* ========================================================================== */
:root{ --halo:rgba(120,205,232,.55); --halo-edge:rgba(166,222,236,.75); --halo-wash:rgba(166,222,236,.18); }
:is(a.lanebox,a.bizcard,.kanban-card,.dlinks a,.kstrip .kc,.panel,a.row,.mini a,.chip,.subnav a,.viewtoggle,.toc li>a,
    .deptnav .dbtn,.ptop .langs button,.tsw,.side .nav a,.side .out,a.tb-row){
  transition:transform .22s,box-shadow .22s,border-color .22s,background .22s}
:is(a.lanebox,a.bizcard,.kanban-card,.dlinks a,.kstrip .kc):is(:hover,:focus-visible){
  transform:translateY(-3px);border-color:rgba(255,255,255,1);
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px var(--halo-edge),0 0 30px -2px var(--halo),0 22px 40px -22px rgba(8,20,30,.5)}
.panel:hover{box-shadow:inset 0 1px 0 #fff,0 0 0 1px var(--halo-edge),0 0 26px -4px var(--halo),0 18px 36px -20px rgba(8,20,30,.4)}
:is(a.row,.mini a,a.tb-row,.toc li>a):is(:hover,:focus-visible){background:var(--halo-wash);box-shadow:inset 0 0 0 1px var(--halo-edge)}
:is(.chip,.subnav a,.viewtoggle,.deptnav .dbtn,.ptop .langs button,.tsw):is(:hover,:focus-visible){
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 0 0 1px var(--halo-edge),0 0 18px var(--halo)}
/* :not(.on) — the selected menu item keeps its own fill (its dark text would vanish) */
:is(.side .nav a:not(.on),.side .out):is(:hover,:focus-visible){background:rgba(166,222,236,.12);box-shadow:inset 0 0 0 1px rgba(166,222,236,.35),0 0 16px rgba(120,205,232,.30)}
.side .nav a.on:is(:hover,:focus-visible){box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(200,242,122,.7),0 0 20px rgba(190,228,245,.7)}
@media (prefers-reduced-motion:reduce){ :is(a.lanebox,a.bizcard,.kanban-card,.dlinks a,.kstrip .kc):hover{transform:none} }

/* ========================================================================== */
/* THÈME CLAIR — « Frost Day » (choisi par Azim, 5 oct 2026, à la place de    */
/* « Day with Navy Rail ») : fond glace et turquoise, page givrée claire,     */
/* cartes de verre blanc, mêmes tuiles pastel, barre de gauche en verre clair.*/
/* Activé par <html data-theme="light"> (interrupteur ci-dessus).             */
/* LISIBILITÉ : textes sur la page en encre foncée — mesurés comme le thème   */
/* sombre (voir STATUS.md). Refaire la mesure après tout changement ici.      */
/* ========================================================================== */
html[data-theme="light"]{ --halo:rgba(31,122,144,.30); --halo-edge:rgba(31,122,144,.38); --halo-wash:rgba(31,122,144,.08); }
html[data-theme="light"] body{background:
  radial-gradient(900px 700px at 0% 0%,rgba(141,193,84,.24),transparent 62%),
  radial-gradient(900px 700px at 100% 8%,rgba(117,200,214,.34),transparent 62%),
  radial-gradient(800px 700px at 50% 110%,rgba(120,170,230,.20),transparent 62%),
  linear-gradient(180deg,#E9F2F6 0%,#E3EEF4 100%);background-attachment:fixed;background-color:#E6F0F5}
/* barre de gauche : verre clair givré, onglet actif en turquoise profond */
html[data-theme="light"] .side{background:rgba(255,255,255,.62);border-color:rgba(255,255,255,.95);
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(20,60,80,.06),0 20px 40px -24px rgba(20,60,80,.30)}
html[data-theme="light"] .side .mark{border-bottom-color:rgba(20,40,50,.08)}
html[data-theme="light"] .side .mark-l{color:#1A2731}
html[data-theme="light"] :is(.side .nav a,.side .out){color:#3F4D57}
html[data-theme="light"] :is(.side .nav a:not(.on),.side .out):hover{background:rgba(31,122,144,.08);color:#14202A}
html[data-theme="light"] :is(.side .nav a.on,.side .nav a.on .ico){color:#fff}
html[data-theme="light"] .side .nav a.on{background:linear-gradient(140deg,#1F7A90,#0F4C5F);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 22px -10px rgba(15,76,95,.6)}
html[data-theme="light"] .side .mono-mark{background:linear-gradient(140deg,#1F7A90,#0F4C5F);color:#fff}
html[data-theme="light"] :is(.side .nav a:not(.on),.side .out):is(:hover,:focus-visible){box-shadow:inset 0 0 0 1px var(--halo-edge),0 0 16px var(--halo)}
html[data-theme="light"] .side .nav a.on:is(:hover,:focus-visible){box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 0 0 1px var(--halo-edge),0 0 18px var(--halo)}
@media(max-width:860px){ html[data-theme="light"] .side{border-width:0 0 1px} }
html[data-theme="light"] .main{background:rgba(255,255,255,.50);border-color:rgba(255,255,255,.95);
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(20,60,80,.05),0 30px 60px -40px rgba(20,60,80,.35)}
html[data-theme="light"] .main::before{background:
  radial-gradient(1000px 640px at 20% 0%,rgba(190,228,245,.45),transparent 62%),
  radial-gradient(900px 600px at 100% 20%,rgba(200,242,122,.18),transparent 60%),
  radial-gradient(1000px 700px at 50% 100%,rgba(190,228,245,.35),transparent 62%)}
/* textes posés sur la page : encre foncée */
html[data-theme="light"] :is(.phead h1,.sechead h2,.locked h1,.wrap > h2,.chapter > h2){color:#14202A;text-shadow:none}
html[data-theme="light"] .phead .psub{color:#2F3D47}
html[data-theme="light"] :is(.phead .pnote,.sechead .n,.note,.gov,.todo-note,.kanban-hint,.tchart-note,.locked .note){color:#3F4D57}
html[data-theme="light"] .phead{border-bottom-color:rgba(20,40,50,.10)}
html[data-theme="light"] :is(.gov,.todo-note){border-top-color:rgba(20,40,50,.10)}
html[data-theme="light"] :is(.wrap > .back,.sechead .more){color:#0E4C5F}
/* cartes : verre plus blanc */
html[data-theme="light"] :is(.panel,.lanebox,.bizcard,.chapx,.toc,.hero,.empty,.phasestrip,.bookcard,.dalias,.dmois,table.ztable,.kanban-card,.dlinks a){
  background:rgba(255,255,255,.80);border-color:rgba(255,255,255,.95)}
html[data-theme="light"] :is(.panel,.lanebox,.bizcard,.chapx,.toc,.kstrip .kc){
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(20,60,80,.06),0 16px 32px -20px rgba(20,60,80,.25)}
/* :not(.on) — the selected chip keeps its dark teal fill (white text on white was invisible) */
html[data-theme="light"] :is(.chip:not(.on),.subnav a,.viewtoggle:not([aria-pressed="true"]),.deptnav .dbtn){background:rgba(255,255,255,.80)}
html[data-theme="light"] .kanban-col{background:rgba(20,40,50,.05)}
html[data-theme="light"] .kanban-col h3{color:#2F3D47}
html[data-theme="light"] .kanban-col.vide{border-color:rgba(20,40,50,.14)}
html[data-theme="light"] .chapters{background:rgba(250,252,253,.85)}
/* sélecteur de langue et interrupteur sur page claire */
html[data-theme="light"] .ptop .langs{background:rgba(20,40,60,.07)}
html[data-theme="light"] .ptop .langs button{color:#3B4A55}
html[data-theme="light"] .ptop .langs button:hover{color:#14202A}
html[data-theme="light"] .ptop .langs button.on{background:linear-gradient(140deg,#242B26,#121714);color:#fff}
html[data-theme="light"] .ptop .langsel{background:rgba(20,40,60,.07);color:#14202A}
html[data-theme="light"] .tsw{background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.45));border-color:rgba(255,255,255,.95);color:#56656F;
  box-shadow:inset 0 1px 1px #fff,inset 0 -1px 2px rgba(20,40,60,.12),0 6px 18px -8px rgba(20,40,60,.35)}
html[data-theme="light"] .tsw .knob{left:2px}
html[data-theme="light"] .tsw .moon{color:#56656F}
html[data-theme="light"] .tsw .sun{color:#0B2230}
html[data-theme="light"] .tsw:focus-visible{outline-color:#0E4C5F}
html[data-theme="light"] :is(a.lanebox,a.bizcard,.kanban-card,.dlinks a,.kstrip .kc):is(:hover,:focus-visible){
  box-shadow:inset 0 1px 0 #fff,0 0 0 1px var(--halo-edge),0 0 28px -4px var(--halo),0 20px 38px -22px rgba(20,60,80,.35)}
html[data-theme="light"] .panel:hover{box-shadow:inset 0 1px 0 #fff,0 0 0 1px var(--halo-edge),0 0 24px -6px var(--halo),0 16px 32px -20px rgba(20,60,80,.25)}
:root{--pnl-warn:#72470F}
/* ==== FIN DU THÈME ========================================================= */

/* ===== VISIONNEUSE DE DOCUMENTS — tout le site (8 oct 2026) =====
   Un document ou une image Drive, ou qu il soit sur le site, s ouvre dans cette
   fenetre (towerViewerOpen dans shared.js). Memes regles que la visionneuse de
   Perso de Romain, d ou elles viennent. La fenetre a ses propres couleurs claires,
   identiques dans les deux themes. */
.pv-back{position:fixed;inset:0;z-index:50;background:rgba(6,16,24,.72);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:24px}
.pv-box{background:#F2F6F8;color:#14202A;border-radius:20px;width:min(1000px,100%);max-height:100%;
  display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 70px -20px rgba(0,0,0,.6)}
.pv-head{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid rgba(20,40,60,.12)}
.pv-name{flex:1;font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-head a.pv-drive{font:600 12px 'Inter Tight',sans-serif;color:#17627A;text-decoration:underline;white-space:nowrap}
.pv-close{font:600 20px/1 'Inter Tight',sans-serif;border:0;background:rgba(20,40,60,.08);color:#14202A;
  width:34px;height:34px;border-radius:50%;cursor:pointer}
.pv-close:hover{background:rgba(20,40,60,.16)}
.pv-body{flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;padding:16px;background:#E6EDF1}
.pv-body img{max-width:100%;max-height:78vh;border-radius:8px;display:block}
.pv-body iframe{width:100%;height:78vh;border:0;border-radius:8px;background:#fff}
.pv-msg{font-size:13px;color:#3F4D57;text-align:center;line-height:1.5;padding:40px 10px}
.pv-msg p{margin:0 0 14px}
.pv-msg a.pv-btn{display:inline-block;font:600 13px 'Inter Tight',sans-serif;color:#F2F8FA;text-decoration:none;
  padding:10px 18px;border-radius:12px;background:var(--grad-green,linear-gradient(140deg,#1F7A90,#0F4C5F))}
.pv-msg a.pv-btn:hover{filter:brightness(1.09)}
@media(max-width:640px){ .pv-back{padding:0} .pv-box{border-radius:0;height:100%} }
.pv-body video{max-width:100%;max-height:78vh;border-radius:8px;display:block;background:#000}
.pv-note{margin:0;padding:10px 20px;font-size:12.5px;line-height:1.45;color:#5A3D05;background:#F7EBD5;border-bottom:1px solid rgba(20,40,60,.12)}
.pv-note a{color:#17627A;font-weight:600}
.pv-body audio{width:min(520px,100%)}
/* fichier Word / Excel / PowerPoint lu par la tour : page blanche, encre sombre
   explicite (piège 16), boutons d'onglet avec leur propre couleur (piège 26) */
.pv-body .pv-doc{align-self:stretch;width:100%;height:78vh;overflow:auto;background:#fff;color:#14202A;
  border-radius:8px;padding:16px 18px;font-size:13px;line-height:1.5;text-align:left}
.pv-doc h4{margin:16px 0 6px;font-size:14px;color:#14202A}
.pv-doc p{margin:0 0 8px;color:#22313B}
.pv-doc .pv-empty{color:#4A5A66}
.pv-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.pv-tabs button{font:600 12px 'Inter Tight',sans-serif;color:#14202A;background:#E6EDF1;border:0;border-radius:999px;padding:6px 12px;cursor:pointer}
.pv-tabs button.on{color:#fff;background:#17627A}
.pv-sheet table{border-collapse:collapse;font-size:12px;color:#14202A}
.pv-sheet th,.pv-sheet td{border:1px solid #D5DEE4;padding:4px 8px;vertical-align:top;text-align:left;white-space:pre-wrap;max-width:360px}
.pv-sheet th{background:#EEF3F6;font-weight:600}
.pv-doc [hidden]{display:none}
/* ===== FIN VISIONNEUSE ===== */

/* ---------------------------------------------------------------------------
   SECTION « SALES » : DEUX HISTOIRES, PAS UNE BOUILLIE   (Irfan, 14 oct 2026)
   La page melangeait les contacts du CRM et les membres de la salle sans rien
   pour les separer, et cachait les trois graphiques derriere trois clics.
   Trois regles depuis :
     1. un titre par source, pour qu'on sache de quoi on parle ;
     2. les graphiques sont ouverts : on ne fait pas travailler le lecteur ;
     3. la provenance tient sur une ligne discrete, en bas, pas en tableau.
   --------------------------------------------------------------------------- */
.sec-t{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--brume);
  margin:30px 0 14px;padding-bottom:8px;border-bottom:1px solid rgba(127,127,127,.25);font-weight:700}
.sec-t:first-child{margin-top:0}
.pnl-mini-row{display:flex;flex-wrap:wrap;gap:4px 20px;margin-top:16px}
.pnl-mini{display:inline-flex;gap:6px;align-items:baseline}
.pnl-mini .mk{opacity:.6}
.pnl-mini .mv{font-weight:600}
@media (max-width:640px){.pnl-mini-row{gap:4px 12px}}

/* ANNEAU — une part d'un tout (voir towerDonut(), 14 oct 2026) ------------- */
.tdonut{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin:14px 0 4px}
.tdn-svg{width:142px;height:142px;flex:0 0 auto}
.tdn-tot{font-size:19px;font-weight:700;fill:var(--encre)}
.tdn-totl{font-size:7.5px;letter-spacing:.07em;text-transform:uppercase;fill:var(--brume)}
.tdn-leg{list-style:none;margin:0;padding:0;flex:1 1 230px;min-width:0}
.tdn-leg li{display:flex;align-items:baseline;gap:9px;padding:4px 0;font-size:12.5px}
.tdn-dot{width:9px;height:9px;border-radius:3px;flex:0 0 auto;transform:translateY(1px)}
.tdn-n{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tdn-v{font-weight:700;font-variant-numeric:tabular-nums}
.tdn-p{color:var(--brume);font-variant-numeric:tabular-nums;min-width:40px;text-align:right}
@media (max-width:640px){.tdonut{gap:16px}.tdn-svg{width:116px;height:116px}}

/* ---------------------------------------------------------------------------
   FICHE BUSINESS EN GRAND ÉCRAN   (Irfan, 15 oct 2026)
   « Il y a de grands espaces vides des deux côtés. Utilise-les. » La fiche
   d'un business est un tableau de bord : sur un grand écran elle prend la
   largeur, et ses graphiques se mettent côte à côte au lieu de s'empiler en
   une longue colonne. Sur un écran étroit, tout repasse en une colonne.
   Préfixe bx- : aucune règle plus haut ne porte ces noms (piège 22).
   --------------------------------------------------------------------------- */
@media(min-width:1500px){
  .wrap.wrap-wide{max-width:1880px}
  .main:has(.wrap-wide) .ptop{right:max(24px,calc((100% - 1880px)/2 + 24px))}
}
.bx-grid{display:grid;gap:18px 26px;grid-template-columns:minmax(0,1fr);align-items:start}
.bx-col{min-width:0}
@media(min-width:1100px){
  .bx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bx-grid.bx-wide{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}
  .bx-side{border-left:1px solid rgba(127,127,127,.22);padding-left:26px}
}
.bx-grid.bx-half > .panel{margin:0;height:100%}
.bx-big{font-family:var(--ff-d);font-weight:700;font-size:40px;line-height:1.1;color:var(--encre);
  font-variant-numeric:tabular-nums;margin:8px 0 4px}

/* L'ESSENTIEL : des tuiles qui ouvrent l'onglet qui les explique. */
.bx-essentiel .bx-tiles{display:grid;gap:12px;padding:14px 16px 16px;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.bx-tile{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;cursor:pointer;
  font:inherit;color:var(--encre);border:var(--glass-border,1px solid var(--ivoire));border-radius:18px;
  padding:14px 16px 12px;background:var(--creme);box-shadow:var(--ombre);transition:transform .12s}
.bx-tile:nth-child(4n+1){background:var(--tile-teal,var(--creme))}
.bx-tile:nth-child(4n+2){background:var(--tile-green,var(--creme))}
.bx-tile:nth-child(4n+3){background:var(--tile-gold,var(--creme))}
.bx-tile:nth-child(4n+4){background:var(--tile-mint,var(--creme))}
.bx-tile:hover,.bx-tile:focus-visible{transform:translateY(-2px)}
.bx-tl{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--fumee);font-weight:600}
.bx-tv{font-family:var(--ff-d);font-weight:700;font-size:28px;line-height:1.1;color:var(--encre);
  font-variant-numeric:tabular-nums}
.bx-tf{display:flex;justify-content:space-between;align-items:center;width:100%;gap:8px;margin-top:2px}
.bx-src{font:600 9.5px var(--ff-m);letter-spacing:.06em;padding:2px 7px;border-radius:999px;
  background:rgba(255,255,255,.6);color:var(--fumee)}
.bx-go{font-size:11.5px;font-weight:600;color:var(--fumee)}
/* L'en-tête de la fiche : ses quatre chiffres sur une ligne au lieu de deux
   colonnes serrées à gauche et d'une moitié droite vide. */
@media(min-width:900px){
  .wrap-wide .herogrid{grid-template-columns:minmax(0,1fr)}
  .wrap-wide .herogrid .kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
}
/* « À fournir par … » et le nom sous chaque chiffre d'un livre : l'ambre
   d'origine tombait à 3,5:1 sur les cartes givrées (audit du 15 oct 2026,
   minimum 4,5:1). Même teinte, plus foncée. */
.att .aw,.bi-w{color:#85560F}