#vue-accueil{min-height:100vh}

  #vue-accueil{
    --papier:#FBF9F4; --ivoire:#F1EEE4; --grege:#C9C2AE; --pousse:#7C8F5F;
    --cedre:#4A5A3F; --cedre-profond:#3C4A36; --encre:#33352B; --creme:#EDE6D6;
    --fond:var(--ivoire); --blanc:var(--papier); --trait:var(--grege);
    --accent:var(--cedre-profond); --accent-clair:var(--creme);
    --doux:var(--cedre); --vert:var(--pousse); --alerte:#8C3A22; --ambre:#8a5a00; --or:#b07d23;
    --ombre:0 1px 2px rgba(60,74,54,.06), 0 8px 26px rgba(60,74,54,.07); --rayon:12px;
  }
  #vue-accueil *{box-sizing:border-box}
  #vue-accueil{margin:0;font:15px/1.6 Arial,"Helvetica Neue",sans-serif;color:var(--encre);background:var(--fond)}
  #vue-accueil h1, #vue-accueil h2, #vue-accueil h3{font-family:Arial,"Helvetica Neue",sans-serif;font-weight:800;letter-spacing:-.025em}
  #vue-accueil button{font-family:inherit}

  #barre-app{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:4px;padding:8px 18px;background:linear-gradient(180deg,#3C4A36,#2c3729);color:var(--creme);border-bottom:1px solid #222a20}
  /* Largeur fluide (chantier 2, 28 juillet 2026) : le bandeau REPLIE ses groupes sur
     une seconde ligne plutot que de pousser « Demander a Kedros » et les icones hors
     ecran (deborde de 115 px constate a 1024).
     Le repli ne tient plus a un SEUIL depuis le 14 aout 2026 : il etait pose a
     1160 px alors que le bandeau reclame environ 1400 px des que les compteurs
     portent trois chiffres. Entre les deux, il debordait, poussait ses icones hors
     ecran ET elargissait le document, ce qui decalait toute la page centree : sur
     l'Edge de Flore, « Afficher la liste » de la page Dossiers etait coupe, donc
     la liste restait masquee sans geste pour l'ouvrir. `wrap` sans seuil replie
     quand la place manque, quelle que soit la largeur et quel que soit le zoom. */
  #barre-app{flex-wrap:wrap;row-gap:2px}
  #barre-app.cache{display:none}
  #barre-app .marque{display:flex;align-items:center;gap:9px;font-size:var(--t-titre);font-weight:300;letter-spacing:.14em;color:var(--creme);flex:none;margin-right:10px;cursor:pointer}
  #barre-app .marque svg{width:28px;height:28px}
  #barre-app .chercheur-dossier-bandeau{position:relative;flex:0 1 260px;margin-right:6px}
  #barre-app .chercheur-dossier-bandeau input{width:100%;min-width:150px;padding:7px 10px;
    border:1px solid rgba(237,230,214,.32);border-radius:8px;background:rgba(255,255,255,.1);
    color:var(--creme);font-size:var(--t-appui)}
  #barre-app .chercheur-dossier-bandeau input::placeholder{color:#cdd3c2}
  #barre-app .chercheur-dossier-bandeau input:focus{outline:2px solid var(--or);outline-offset:1px}
  #barre-app #resultats-dossiers-bandeau{position:absolute;top:calc(100% + 5px);left:0;
    width:min(420px,80vw);max-height:360px;overflow:auto;margin:0;padding:5px;list-style:none;
    background:var(--blanc);color:var(--encre);border:1px solid var(--trait);border-radius:9px;
    box-shadow:0 10px 30px rgba(20,28,18,.25);z-index:80}
  #barre-app #resultats-dossiers-bandeau li{padding:9px 10px;border-radius:7px;cursor:pointer}
  #barre-app #resultats-dossiers-bandeau li:hover,
  #barre-app #resultats-dossiers-bandeau li[aria-selected="true"]{background:var(--accent-clair)}
  #barre-app #resultats-dossiers-bandeau .aucun{cursor:default;color:var(--doux)}
  #barre-app .dossiers-ouverts-bandeau{position:relative;flex:none}
  #barre-app #identite-dossier-bandeau{font-size:var(--t-appui);font-weight:600;
    color:var(--creme);max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #barre-app.mode-dossier-separe .marque span{display:none}
  #barre-app.mode-dossier-separe .marque{margin-right:2px}
  #barre-app.mode-dossier-separe #identite-dossier-bandeau{display:block}
  #barre-app .onglet{background:transparent;border:0;color:#cdd3c2;border-radius:8px;padding:8px 12px;font-size:var(--t-appui);cursor:pointer;display:flex;align-items:center;gap:7px}
  #barre-app .onglet:hover{background:rgba(237,230,214,.10);color:var(--creme)}
  #barre-app .onglet.actif{background:rgba(237,230,214,.16);color:var(--creme);font-weight:600}
  #barre-app .onglet .b{font-size:var(--t-mention);font-weight:700;background:var(--pousse);color:#fff;border-radius:20px;padding:0 7px;min-width:19px;text-align:center}
  #barre-app .onglet .b.or{background:var(--or)}
  #barre-app .etude{color:#c3c8b5;font-size:var(--t-mention);text-align:right;line-height:1.3;margin-left:auto;padding-left:10px}
  #barre-app .etude #nom-etude{color:var(--creme);font-weight:600}
  #barre-app .droite{display:flex;align-items:center;gap:6px}
  #barre-app .pilule{background:rgba(237,230,214,.14);border:1px solid rgba(237,230,214,.3);color:var(--creme);border-radius:20px;padding:7px 13px;font-size:var(--t-appui);cursor:pointer;display:flex;align-items:center;gap:7px}
  #barre-app .pilule:hover{background:rgba(237,230,214,.24)} #barre-app .pilule svg{width:15px;height:15px}
  #barre-app .ico{width:34px;height:34px;border-radius:8px;background:transparent;border:0;color:#cdd3c2;display:grid;place-items:center;cursor:pointer;position:relative}
  #barre-app .ico:hover{background:rgba(237,230,214,.14);color:var(--creme)} #barre-app .ico:disabled{opacity:.4;cursor:default} #barre-app .ico svg{width:18px;height:18px}
  #barre-app .ico .pt{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;background:var(--or)}
  #barre-app .sep{width:1px;height:22px;background:rgba(237,230,214,.2);margin:0 4px}
  #barre-app .nouv{background:linear-gradient(180deg,#c79a4e,#b07d23);color:#3a2a08;border:0;border-radius:9px;padding:8px 14px;font-size:var(--t-appui);font-weight:700;cursor:pointer}
  #barre-app .avatar{width:34px;height:34px;border-radius:9px;background:rgba(237,230,214,.18);display:grid;place-items:center;font-size:var(--t-mention);font-weight:700;color:var(--creme);cursor:pointer}
  #barre-app .tab-wrap{position:relative;display:flex}
  #barre-app .pop{position:absolute;top:calc(100% + 6px);left:0;background:var(--blanc);border:1px solid var(--trait);border-radius:11px;box-shadow:0 10px 30px rgba(60,74,54,.18);padding:6px;min-width:250px;display:none;z-index:60}
  #barre-app .pop.on{display:block}
  #barre-app .pop-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:transparent;border:0;color:var(--encre);border-radius:8px;padding:10px 11px;font-size:var(--t-appui);cursor:pointer}
  #barre-app .pop-item:hover{background:var(--accent-clair);color:var(--accent)}
  #barre-app .pop-item svg{width:16px;height:16px;color:var(--doux);flex:none}
  #barre-app .pop-item:hover svg{color:var(--accent)}
  /* LE DETAIL SOUS LE LIBELLE (19 aout 2026) : un item de menu peut dire ce
     qu'il ouvre. L'item passe donc en colonne, et l'icone se cale en haut. */
  #barre-app .pop-item{align-items:flex-start}
  #barre-app .pop-item svg{margin-top:2px}
  #barre-app .pop-item i{display:block;font-style:normal;font-size:var(--t-mention);
    color:var(--doux);line-height:1.35;margin-top:2px}
  #barre-app .pop-item:hover i{color:var(--accent)}
  #barre-app .pop-titre{font-size:var(--t-mention);letter-spacing:.13em;
    text-transform:uppercase;color:var(--doux);padding:8px 11px 5px}
  #barre-app .pop hr{border:0;border-top:1px solid var(--accent-clair);margin:6px 4px}
  #barre-app .pop{max-width:340px}

  #vue-accueil .page{max-width:1460px;margin:0 auto;padding:22px 22px 0}
  #vue-accueil .salut{font-family:Arial,"Helvetica Neue",sans-serif;font-size:var(--t-titre);color:var(--accent);margin:2px 0 1px}
  #vue-accueil .salut .p{color:var(--cedre)}
  #vue-accueil .date{color:var(--doux);font-size:var(--t-appui);margin:0 0 16px}
  #vue-accueil .surtitre{font-size:var(--t-mention);letter-spacing:.14em;text-transform:uppercase;color:var(--doux);font-weight:700;margin:20px 2px 12px}

  #vue-accueil .cartes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

  /* LA CARTE OUVERTE de Demander a Kedros (Flore, 19 aout 2026) : elle porte un champ,
     donc elle ne peut pas etre un bouton (un champ dans un bouton ne se saisit pas).
     C'est un bloc, pleine largeur, pose AVANT les zones de travail. */
  #vue-accueil .kc.ouverte{grid-column:1 / -1;cursor:default;display:block;
    margin-bottom:18px}
  #vue-accueil .kc.ouverte h3{margin-bottom:2px}
  #vue-accueil .champ-demander{display:flex;align-items:center;gap:10px;margin-top:12px;
    background:var(--blanc);border-radius:10px;padding:8px 10px}
  #vue-accueil .champ-demander input{flex:1;border:0;background:transparent;
    font:inherit;font-size:var(--t-corps);color:var(--encre);outline:none}
  #vue-accueil .champ-demander button{width:32px;height:32px;flex:none;border:0;
    border-radius:9px;background:var(--creme);color:var(--accent);cursor:pointer;
    display:flex;align-items:center;justify-content:center}
  #vue-accueil .champ-demander button:hover{background:#fff}
  #vue-accueil .champ-demander button svg{display:block;width:17px;height:17px;stroke:currentColor}
  #vue-accueil .ligne-demander{display:flex;align-items:baseline;gap:16px;margin-left:44px}
  #vue-accueil .ligne-demander p{flex:1;min-width:0}
  #vue-accueil .lien-demander{flex:none;background:rgba(237,230,214,.16);
    border:1px solid rgba(237,230,214,.42);border-radius:999px;padding:3px 10px;
    cursor:pointer;color:#fff;font:inherit;font-size:var(--t-mention);font-weight:700}
  #vue-accueil .lien-demander:hover{background:var(--creme);color:var(--accent)}
  @media(max-width:1080px){#vue-accueil .cartes{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:620px){#vue-accueil .cartes{grid-template-columns:1fr}}
  #vue-accueil .kc{display:flex;flex-direction:column;gap:6px;background:var(--blanc);border:1px solid var(--trait);border-radius:var(--rayon);padding:15px;box-shadow:var(--ombre);cursor:pointer;text-align:left;color:inherit;position:relative;transition:transform .12s,border-color .12s,box-shadow .12s}
  #vue-accueil .kc:hover{transform:translateY(-2px);border-color:var(--pousse);box-shadow:0 2px 4px rgba(60,74,54,.08),0 14px 30px rgba(60,74,54,.12)}
  #vue-accueil .kc .haut{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px}
  #vue-accueil .kc .ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--accent-clair);color:var(--accent);flex:none}
  #vue-accueil .kc .ic svg{width:20px;height:20px}
  #vue-accueil .kc h3{font-size:var(--t-corps);margin:0} #vue-accueil .kc p{margin:0;font-size:var(--t-mention);color:var(--doux);line-height:1.45}
  #vue-accueil .kc .cpt{font-size:var(--t-mention);font-weight:700;color:#fff;background:var(--pousse);border-radius:20px;padding:2px 9px;min-width:24px;text-align:center}
  #vue-accueil .kc .cpt.ambre{background:var(--ambre)} #vue-accueil .kc .cpt.or{background:var(--or)}
  #vue-accueil .kc .tag{position:absolute;top:12px;right:12px;font-size:var(--t-mention);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--or);background:#fbf3e0;border:1px solid #e6d6ad;border-radius:20px;padding:1px 8px}
  #vue-accueil .kc.pleine{background:linear-gradient(180deg,#43533b,#374630);color:var(--creme);border-color:#2c3729}
  #vue-accueil .kc.pleine h3{color:var(--creme)} #vue-accueil .kc.pleine p{color:#c9d0bd} #vue-accueil .kc.pleine .ic{background:rgba(237,230,214,.16);color:var(--creme)}
  #vue-accueil .kc.douce{border-style:dashed} #vue-accueil .kc.douce .ic{background:#fbf3e0;color:var(--ambre)}
  #vue-accueil .kc.kedros{background:linear-gradient(135deg,#4a5a3f,#3C4A36);color:var(--creme);border-color:#2c3729}
  #vue-accueil .kc.kedros h3{color:var(--creme)} #vue-accueil .kc.kedros p{color:#c9d0bd} #vue-accueil .kc.kedros .ic{background:rgba(237,230,214,.16);color:var(--creme)}
  #vue-accueil .span2{grid-column:span 2} @media(max-width:620px){#vue-accueil .span2{grid-column:span 1}}

  #vue-accueil .apercu{display:flex;gap:9px;margin-top:8px;flex-wrap:wrap}
  #vue-accueil .apercu .cr{flex:1;min-width:120px;background:var(--ivoire);border:1px solid var(--trait);border-radius:9px;padding:8px 10px}
  #vue-accueil .apercu .cr .h{font-size:var(--t-mention);font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}
  #vue-accueil .apercu .cr .q{font-size:var(--t-mention);color:var(--doux);line-height:1.3;margin-top:1px}
  #vue-accueil .apercu .cr.sig{background:#eef3e8;border-color:rgba(124,143,95,.4)} #vue-accueil .apercu .cr.sig .h{color:#3f5a2e}

  #vue-accueil .outils{background:var(--blanc);border:1px solid var(--trait);border-radius:var(--rayon);padding:14px 15px;box-shadow:var(--ombre)}
  #vue-accueil .outils .st{font-size:var(--t-mention);letter-spacing:.1em;text-transform:uppercase;color:var(--doux);font-weight:700;margin:0 0 8px}
  #vue-accueil .outils .st.d2{margin-top:12px}
  #vue-accueil .chips{display:flex;flex-wrap:wrap;gap:7px}
  #vue-accueil .chip{background:var(--blanc);border:1px solid var(--trait);color:var(--accent);border-radius:8px;padding:7px 11px;font-size:var(--t-mention);cursor:pointer;display:flex;align-items:center;gap:6px}
  #vue-accueil .chip:hover{border-color:var(--pousse);background:var(--accent-clair)} #vue-accueil .chip svg{width:14px;height:14px}

  #vue-accueil .bas{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch;margin-top:20px}
  #vue-accueil .bas>.panneau{height:100%}
  @media(max-width:900px){#vue-accueil .bas{grid-template-columns:1fr}}
  @media(max-width:620px){
    #vue-accueil .ligne-demander{margin-left:0;align-items:flex-start}
  }
  #vue-accueil .panneau{background:var(--blanc);border:1px solid var(--trait);border-radius:var(--rayon);box-shadow:var(--ombre);overflow:hidden}
  #vue-accueil .ptete{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px;border-bottom:1px solid var(--trait)}
  #vue-accueil .ptete h2{font-size:var(--t-corps);margin:0} #vue-accueil .ptete .arch{font-size:var(--t-mention);color:var(--doux);font-style:italic}
  #vue-accueil .mur{padding:12px 14px}
  #vue-accueil .postits{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  #vue-accueil .pit{border-radius:10px;padding:10px 11px;font-size:var(--t-appui);line-height:1.4;border:1px solid rgba(60,74,54,.12);box-shadow:0 1px 2px rgba(60,74,54,.08);min-height:70px}
  #vue-accueil .pit.j{background:#fbf3d9} #vue-accueil .pit.v{background:#e9f0dd} #vue-accueil .pit.b{background:#e6eef1} #vue-accueil .pit.r{background:#f6e7e2}
  #vue-accueil .pit .auteur{font-size:var(--t-mention);font-weight:700;color:var(--doux);margin-top:7px;display:flex;align-items:center;gap:6px}
  #vue-accueil .qui{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent-clair);color:var(--accent);font-size:9.5px;font-weight:700;border:1px solid var(--trait)}
  #vue-accueil .motline{display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--trait)}
  #vue-accueil .motline input{flex:1;border:1px solid var(--trait);border-radius:8px;padding:8px 11px;font-size:var(--t-appui);font-family:inherit;background:var(--blanc)}
  #vue-accueil .motline input:focus{outline:2px solid var(--pousse);outline-offset:1px}
  #vue-accueil .motline button{background:var(--accent);color:var(--creme);border:0;border-radius:8px;padding:0 13px;cursor:pointer;font-size:var(--t-appui)}
  #vue-accueil .recents{padding:6px 8px 10px}
  #vue-accueil .rc{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;cursor:pointer;font-size:var(--t-appui)}
  #vue-accueil .rc:hover{background:var(--accent-clair)} #vue-accueil .rc .pt{width:8px;height:8px;border-radius:50%;background:var(--pousse);flex:none}
  #vue-accueil .rc .pt.a{background:var(--ambre)} #vue-accueil .rc .pt.n{background:var(--grege)} #vue-accueil .rc b{font-weight:600}
  #vue-accueil .rc .qd{margin-left:auto;font-size:var(--t-mention);color:var(--doux)}

  #vue-accueil .pied{margin-top:26px;background:linear-gradient(180deg,#3C4A36,#2c3729);color:#f3efe6;padding:14px 24px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:var(--t-mention);line-height:1.4}
  #vue-accueil .pied>span:first-child{flex:none;white-space:nowrap}
  #vue-accueil .pied>.sous{flex:1;max-width:none;margin:0;color:#dfe4d6;text-align:right}
  #vue-accueil .pied .v{color:#c7d1ba} #vue-accueil .pied a{color:#f3efe6;text-decoration:none;margin:0 7px} #vue-accueil .pied a:hover{text-decoration:underline}
  #vue-accueil .pied .liens{margin-left:auto;display:flex;align-items:center;gap:2px;flex-wrap:wrap}
  #vue-accueil .pied .assist{background:rgba(237,230,214,.16);border:1px solid rgba(237,230,214,.3);color:var(--creme);border-radius:20px;padding:7px 14px;cursor:pointer;display:flex;align-items:center;gap:7px}
  #vue-accueil .pied .assist svg{width:15px;height:15px}
  @media(max-width:760px){
    #vue-accueil .pied{align-items:flex-start;gap:7px}
    #vue-accueil .pied>.sous{flex-basis:100%;text-align:left}
  }
  #vue-accueil .note-donnees{max-width:1460px;margin:14px auto 0;padding:0 22px;font-size:var(--t-mention);color:var(--doux);font-style:italic}

  /* Tâches */
  #vue-accueil .lien-arch{background:transparent;border:0;color:var(--doux);font-size:var(--t-mention);cursor:pointer;display:flex;align-items:center;gap:5px}
  #vue-accueil .lien-arch:hover{color:var(--accent)}
  #vue-accueil .filtres-t{display:flex;gap:5px;padding:12px 16px 2px}
  #vue-accueil .filtres-t button{background:var(--blanc);border:1px solid var(--trait);color:var(--doux);border-radius:20px;padding:5px 12px;font-size:var(--t-mention);cursor:pointer}
  #vue-accueil .filtres-t button[aria-pressed="true"]{background:var(--accent-clair);color:var(--accent);border-color:var(--pousse);font-weight:600}
  #vue-accueil .taches{padding:6px 8px 4px;min-height:120px}
  #vue-accueil .tache{display:flex;align-items:flex-start;gap:11px;padding:9px 10px;border-radius:9px;transition:opacity .3s,transform .3s}
  #vue-accueil .tache:hover{background:var(--accent-clair)}
  #vue-accueil .tache .ck{width:19px;height:19px;border:1.6px solid var(--grege);border-radius:6px;flex:none;margin-top:2px;cursor:pointer;display:grid;place-items:center;background:var(--blanc)}
  #vue-accueil .tache .ck svg{width:12px;height:12px;color:#fff;opacity:0}
  #vue-accueil .tache.faite .ck{background:var(--pousse);border-color:var(--pousse)} #vue-accueil .tache.faite .ck svg{opacity:1}
  #vue-accueil .tache.faite .t{text-decoration:line-through;color:var(--doux)}
  #vue-accueil .tache .corps{flex:1;min-width:0} #vue-accueil .tache .t{font-size:var(--t-appui);font-weight:600;line-height:1.3}
  #vue-accueil .tache .m{font-size:var(--t-mention);color:var(--doux);display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:1px}
  #vue-accueil .tag-d{background:var(--ivoire);border:1px solid var(--trait);border-radius:6px;padding:0 6px;font-size:var(--t-mention);color:var(--doux)}
  #vue-accueil .quiT{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent-clair);color:var(--accent);font-size:9.5px;font-weight:700;border:1px solid var(--trait)}
  #vue-accueil .du{font-size:var(--t-mention);font-weight:700;color:var(--encre);white-space:nowrap}
  #vue-accueil .ajout{display:flex;gap:8px;padding:10px 14px;border-top:1px solid var(--trait);background:var(--ivoire)}
  #vue-accueil .ajout input{flex:1;border:1px solid var(--trait);border-radius:8px;padding:8px 11px;font-size:var(--t-appui);font-family:inherit;background:var(--blanc)}
  #vue-accueil .ajout input:focus{outline:2px solid var(--pousse);outline-offset:1px}
  #vue-accueil .ajout .aff{font-size:var(--t-mention);color:var(--doux);border:1px solid var(--trait);border-radius:8px;padding:0 10px;background:var(--blanc);cursor:pointer}
  #vue-accueil .ajout button.add{background:var(--accent);color:var(--creme);border:0;border-radius:8px;padding:0 14px;cursor:pointer;font-size:var(--t-appui)}
  #vue-accueil .mur-panneau .ptete{cursor:pointer}

  /* Toast (retour visuel du clic sur une carte) */
  /* Le toast est GLOBAL (3.8, 30 juillet 2026) : scopé à #vue-accueil, il était
     invisible depuis toute autre vue (l'ancêtre en display:none avalait le
     message) ; le sélecteur suit le noeud, sorti en fin de body. */
  .toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--cedre-profond);color:var(--creme);padding:11px 18px;border-radius:10px;font-size:var(--t-appui);box-shadow:0 10px 30px rgba(20,28,16,.35);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:200}
  .toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
  .toast:empty{display:none}

  /* Modale du mur agrandi */
  #vue-accueil .modale-mur{background:var(--fond);border-radius:16px;width:min(880px,100%);box-shadow:0 24px 70px rgba(20,28,16,.4);overflow:hidden}
  #vue-accueil .modale-mur .postits{grid-template-columns:repeat(3,1fr)}
  @media(max-width:640px){#vue-accueil .modale-mur .postits{grid-template-columns:1fr}}

    /* Le scope est ELARGI a #modales-globales (10 aout 2026) : la modale des
     echeances a quitte #vue-accueil (enfermee dans une vue masquee, elle
     devenait invisible en dossier) et vit en fin de body dans ce conteneur.
     La modale du mur, restee dans la vue, garde les memes regles. */
/* MODALE ÉCHÉANCES : liste, calendrier, frise. */
  :is(#vue-accueil, #modales-globales) .voile{position:fixed;inset:0;background:rgba(44,55,41,.42);display:none;align-items:flex-start;justify-content:center;z-index:100;padding:36px 16px;overflow:auto}
  :is(#vue-accueil, #modales-globales) .voile.on{display:flex}
  :is(#vue-accueil, #modales-globales) .modale{background:var(--fond);border-radius:16px;width:min(960px,100%);box-shadow:0 24px 70px rgba(20,28,16,.4);overflow:hidden}
  :is(#vue-accueil, #modales-globales) .mtete{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--blanc);border-bottom:1px solid var(--trait)}
  :is(#vue-accueil, #modales-globales) .mtete h2{font-size:var(--t-titre);margin:0;flex:none}
  :is(#vue-accueil, #modales-globales) .mtete .src{font-size:var(--t-mention);color:var(--doux);font-style:italic}
  :is(#vue-accueil, #modales-globales) .vue-seg{display:flex;gap:5px;margin-left:auto}
  :is(#vue-accueil, #modales-globales) .vue-seg button{background:var(--blanc);border:1px solid var(--trait);color:var(--doux);border-radius:20px;padding:6px 14px;font-size:var(--t-appui);cursor:pointer;display:flex;align-items:center;gap:7px}
  :is(#vue-accueil, #modales-globales) .vue-seg button svg{width:15px;height:15px}
  :is(#vue-accueil, #modales-globales) .vue-seg button[aria-pressed="true"]{background:var(--accent-clair);color:var(--accent);border-color:var(--pousse);font-weight:600}
  :is(#vue-accueil, #modales-globales) .fermer{width:34px;height:34px;border-radius:8px;border:1px solid var(--trait);background:var(--blanc);cursor:pointer;color:var(--doux);display:grid;place-items:center}
  :is(#vue-accueil, #modales-globales) .fermer svg{width:16px;height:16px}
  :is(#vue-accueil, #modales-globales) .mcorps{padding:18px 20px 24px;max-height:66vh;overflow:auto}
  :is(#vue-accueil, #modales-globales) .vue{display:none} :is(#vue-accueil, #modales-globales) .vue.on{display:block}

  /* Vue liste */
  :is(#vue-accueil, #modales-globales) .el{display:flex;align-items:center;gap:14px;background:var(--blanc);border:1px solid var(--trait);border-radius:10px;padding:12px 15px;margin-bottom:9px}
  :is(#vue-accueil, #modales-globales) .el .jour{text-align:center;flex:none;width:52px}
  :is(#vue-accueil, #modales-globales) .el .jour .n{font-size:var(--t-titre);font-weight:700;color:var(--accent);line-height:1;font-variant-numeric:tabular-nums}
  :is(#vue-accueil, #modales-globales) .el .jour .m{font-size:var(--t-mention);text-transform:uppercase;letter-spacing:.06em;color:var(--doux)}
  :is(#vue-accueil, #modales-globales) .el .barre{width:4px;align-self:stretch;border-radius:3px;background:var(--pousse)}
  :is(#vue-accueil, #modales-globales) .el.condition .barre, :is(#vue-accueil, #modales-globales) .el.peremption .barre{background:var(--ambre)}
  :is(#vue-accueil, #modales-globales) .el.rdv .barre{background:var(--doux)} :is(#vue-accueil, #modales-globales) .el.depot .barre{background:var(--cedre)}
  :is(#vue-accueil, #modales-globales) .el .txt{flex:1} :is(#vue-accueil, #modales-globales) .el .txt .t{font-weight:600;font-size:var(--t-appui)}
  :is(#vue-accueil, #modales-globales) .el .txt .d{font-size:var(--t-mention);color:var(--doux)}
  :is(#vue-accueil, #modales-globales) .el .typ{font-size:var(--t-mention);font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 10px;border-radius:20px;background:var(--ivoire);border:1px solid var(--trait);color:var(--doux)}

  /* Vue calendrier */
  :is(#vue-accueil, #modales-globales) .cals{display:flex;gap:20px;flex-wrap:wrap}
  :is(#vue-accueil, #modales-globales) .cal{flex:1;min-width:280px;background:var(--blanc);border:1px solid var(--trait);border-radius:10px;padding:14px}
  :is(#vue-accueil, #modales-globales) .cal h3{font-size:var(--t-corps);margin:0 0 10px;text-align:center;text-transform:capitalize}
  :is(#vue-accueil, #modales-globales) .grille{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
  :is(#vue-accueil, #modales-globales) .grille .jn{font-size:var(--t-mention);text-transform:uppercase;color:var(--doux);text-align:center;font-weight:700;padding-bottom:4px}
  :is(#vue-accueil, #modales-globales) .grille .c{aspect-ratio:1;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:var(--t-mention);color:var(--encre);position:relative}
  :is(#vue-accueil, #modales-globales) .grille .c.vide{visibility:hidden}
  :is(#vue-accueil, #modales-globales) .grille .c.auj{outline:2px solid var(--grege);outline-offset:-2px}
  :is(#vue-accueil, #modales-globales) .grille .c.mark{background:var(--accent-clair);font-weight:700;color:var(--accent);cursor:pointer}
  :is(#vue-accueil, #modales-globales) .grille .c.mark .d{width:6px;height:6px;border-radius:50%;background:var(--pousse);margin-top:2px}
  :is(#vue-accueil, #modales-globales) .grille .c.mark.condition .d, :is(#vue-accueil, #modales-globales) .grille .c.mark.peremption .d{background:var(--ambre)}
  :is(#vue-accueil, #modales-globales) .grille .c.mark.rdv .d{background:var(--doux)} :is(#vue-accueil, #modales-globales) .grille .c.mark.depot .d{background:var(--cedre)}

  /* Vue frise */
  :is(#vue-accueil, #modales-globales) .frise{position:relative;padding-left:26px}
  :is(#vue-accueil, #modales-globales) .frise::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:2px;background:var(--trait)}
  :is(#vue-accueil, #modales-globales) .fn{position:relative;margin-bottom:16px}
  :is(#vue-accueil, #modales-globales) .fn::before{content:"";position:absolute;left:-22px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--pousse);border:2px solid var(--fond)}
  :is(#vue-accueil, #modales-globales) .fn.condition::before, :is(#vue-accueil, #modales-globales) .fn.peremption::before{background:var(--ambre)} :is(#vue-accueil, #modales-globales) .fn.rdv::before{background:var(--doux)} :is(#vue-accueil, #modales-globales) .fn.depot::before{background:var(--cedre)}
  :is(#vue-accueil, #modales-globales) .fn .fd{font-size:var(--t-mention);font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}
  :is(#vue-accueil, #modales-globales) .fn .ft{font-size:var(--t-appui);font-weight:600;margin-top:1px} :is(#vue-accueil, #modales-globales) .fn .fs{font-size:var(--t-mention);color:var(--doux)}
  :is(#vue-accueil, #modales-globales) .fmois{font-size:var(--t-mention);letter-spacing:.1em;text-transform:uppercase;color:var(--doux);font-weight:700;margin:2px 0 12px;text-transform:uppercase}

  /* LES SOUS-ONGLETS de l'ecran Dossiers (19 aout 2026). */
  #vue-dossiers .sous-onglets{display:flex;gap:2px;border-bottom:1px solid var(--trait);
    margin:14px 0 4px}
  #vue-dossiers .sous-onglets button{background:none;border:0;border-bottom:2px solid transparent;
    margin-bottom:-1px;padding:8px 14px;font:inherit;font-size:var(--t-appui);
    color:var(--doux);cursor:pointer;display:inline-flex;align-items:center;gap:7px}
  #vue-dossiers .sous-onglets button.on{color:var(--accent);border-bottom-color:var(--accent)}
  #vue-dossiers .sous-onglets .nb{background:var(--ivoire);border:1px solid var(--trait);
    border-radius:9px;padding:0 7px;font-size:var(--t-mention);color:var(--encre)}
  #vue-dossiers .sous-onglets .nb:empty{display:none}

  /* ============================================================================
     LOT D DE LA REFONTE DES ECRANS (DECISIONS 65 et 66.2, 20 aout 2026) :
     rangees respirantes, nuancier Poney (66.16), filtres comptes, porte de
     confidentialite, pions d'initiales, signe de rangee.
     ============================================================================ */

  /* Les FILTRES et leurs comptes. */
  #dossiers-filtres{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:12px}
  #dossiers-filtres button.fd{background:var(--blanc);border:1px solid var(--trait);
    color:var(--doux);border-radius:20px;padding:5px 12px;font:inherit;
    font-size:var(--t-mention);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
  #dossiers-filtres button.fd.on{background:var(--accent-clair);color:var(--accent);
    border-color:var(--pousse);font-weight:600}
  #dossiers-filtres button.fd:disabled{opacity:.5;cursor:default}
  #dossiers-filtres .cptf{background:var(--ivoire);border:1px solid var(--trait);
    border-radius:9px;padding:0 6px;font-size:var(--t-mention);color:var(--encre);
    font-variant-numeric:tabular-nums}
  #dossiers-filtres .cptf:empty{display:none}

  /* LA PORTE de confidentialite : bloc centre, motif en une phrase, deux gestes,
     rangees FANTOMES derriere (decoratives, aucune donnee reelle). */
  .porte-dossiers{position:relative;min-height:280px;border-radius:12px;overflow:hidden}
  .porte-dossiers .porte-fantomes{display:flex;flex-direction:column;gap:8px;
    padding:6px 2px;filter:blur(1.5px);opacity:.55;pointer-events:none;user-select:none}
  .porte-dossiers .fant{display:flex;align-items:center;gap:18px;background:var(--papier);
    border:1px solid #e3ddcc;border-left:4px solid var(--grege);border-radius:10px;
    padding:16px 14px}
  .porte-dossiers .fant span{display:inline-block;height:11px;border-radius:6px;
    background:var(--ivoire)}
  .porte-dossiers .fant .f1{width:34%} .porte-dossiers .fant .f2{width:14%}
  .porte-dossiers .fant .f3{width:9%}
  .porte-dossiers .fant .f1.c{width:26%} .porte-dossiers .fant .f2.c{width:19%}
  .porte-dossiers .fant .f3.c{width:12%}
  .porte-dossiers .porte-bloc{position:absolute;inset:0;display:flex;flex-direction:column;
    align-items:center;justify-content:center;text-align:center;gap:6px;padding:20px;
    background:linear-gradient(180deg,rgba(241,238,228,.55),rgba(241,238,228,.88))}
  .porte-dossiers .porte-bloc h3{margin:0;font-size:var(--t-titre);color:var(--accent)}
  .porte-dossiers .porte-bloc p{margin:0;max-width:520px;color:var(--doux);
    font-size:var(--t-appui);line-height:1.5}
  .porte-dossiers .porte-gestes{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap;
    justify-content:center}
  .porte-dossiers .porte-gestes #btn-dossiers-voile-note{background:var(--accent);
    color:var(--creme);border:0;border-radius:9px;padding:9px 16px;font:inherit;
    font-size:var(--t-appui);cursor:pointer}
  /* PERCEE par la recherche, la porte se fait discrete : les fantomes s'effacent,
     le bloc redevient une ligne qui DIT ce qui est montre et ce qui reste cache. */
  .porte-dossiers.percee{min-height:0}
  .porte-dossiers.percee .porte-fantomes{display:none}
  .porte-dossiers.percee .porte-bloc{position:static;background:none;padding:8px 2px;
    align-items:flex-start;text-align:left}
  .porte-dossiers.percee .porte-bloc h3{display:none}
  .porte-dossiers.percee .porte-gestes{margin-top:2px}

  /* Les RANGEES RESPIRANTES : une carte-ligne par dossier, filet de matiere de
     4 px au bord gauche (nuancier Poney, pose par le rendu ; un type hors
     nuancier reste grege). */
  #vue-dossiers table.cartes-dossiers{width:100%;border-collapse:separate;
    border-spacing:0 8px}
  #vue-dossiers .cartes-dossiers thead th{font-size:var(--t-mention);color:var(--doux);
    font-weight:600;white-space:nowrap}
  #vue-dossiers .cartes-dossiers thead [data-tri]{cursor:pointer}
  #vue-dossiers .cartes-dossiers .tri-cle{display:inline-block;margin-left:8px;
    padding:0 7px;border:1px solid var(--trait);border-radius:20px;
    background:var(--blanc);font-weight:400}
  #vue-dossiers .cartes-dossiers .tri-cle:hover{border-color:var(--pousse);
    color:var(--accent)}
  #vue-dossiers .carte-dossier td{background:var(--papier);border-top:1px solid #e3ddcc;
    border-bottom:1px solid #e3ddcc;padding:10px 12px;vertical-align:middle;
    font-size:var(--t-appui);line-height:1.45}
  #vue-dossiers .carte-dossier td:first-child{border-radius:10px 0 0 10px;padding-left:14px}
  #vue-dossiers .carte-dossier td:last-child{border-right:1px solid #e3ddcc;
    border-radius:0 10px 10px 0}
  #vue-dossiers .carte-dossier:hover td{background:#f6f3ea;border-color:var(--grege)}
  #vue-dossiers .carte-dossier .cd-parties{font-family:Arial,"Helvetica Neue",sans-serif;font-size:var(--t-corps);font-weight:700;
    color:var(--encre);line-height:1.3}
  #vue-dossiers .carte-dossier .et-mat{display:inline-block;margin-top:4px;
    padding:1px 9px;border-radius:20px;font-size:var(--t-mention);font-weight:700;
    letter-spacing:.045em;text-transform:uppercase;background:var(--ivoire);
    color:var(--doux)}
  #vue-dossiers .carte-dossier .cd-appui{color:var(--doux);white-space:nowrap;
    font-variant-numeric:tabular-nums}
  #vue-dossiers .carte-dossier .cd-signe{text-align:center;width:52px}
  #vue-dossiers .signe-rangee{display:inline-grid;place-items:center;width:18px;height:18px;
    border-radius:50%;background:var(--etat-verifier-fond);color:var(--etat-verifier-texte);
    border:1px solid currentColor;font-size:var(--t-mention);font-weight:700}
  #vue-dossiers .signe-rangee::before{content:"!"}
  #vue-dossiers .signe-rangee.rouge{background:var(--etat-bloquant-fond);
    color:var(--etat-bloquant-texte);border-radius:4px}
  #vue-dossiers .carte-dossier .cd-pion{width:44px;text-align:center}
  #vue-dossiers .pion{display:inline-grid;place-items:center;width:28px;height:28px;
    border-radius:50%;font-size:var(--t-mention);font-weight:700;letter-spacing:.02em}
  #vue-dossiers .pion.notaire{background:var(--cedre-profond);color:var(--creme)}
  #vue-dossiers .pion.collab{background:transparent;border:1.6px solid var(--cedre);
    color:var(--cedre)}

  /* Le volet MOTS-CLES : des puces comptees (le clic met le mot a la recherche). */
  #dossiers-pane-mots .chip.mot-cle{background:var(--blanc);border:1px solid var(--trait);
    color:var(--accent);border-radius:20px;padding:6px 12px;font:inherit;
    font-size:var(--t-appui);cursor:pointer;display:inline-flex;align-items:center;gap:7px}
  #dossiers-pane-mots .chip.mot-cle:hover{border-color:var(--pousse);
    background:var(--accent-clair)}
  #dossiers-pane-mots .chip.mot-cle .nb{background:var(--ivoire);
    border:1px solid var(--trait);border-radius:9px;padding:0 6px;
    font-size:var(--t-mention);color:var(--encre);font-variant-numeric:tabular-nums}