
@font-face{font-family:"Source Sans 3";font-style:normal;font-display:swap;font-weight:200 900;src:url(/VIDOM/maquette/polices/source-sans-3-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Sans 3";font-style:normal;font-display:swap;font-weight:200 900;src:url(/VIDOM/maquette/polices/source-sans-3-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:normal;font-display:swap;font-weight:200 900;src:url(/VIDOM/maquette/polices/source-serif-4-latin-opsz-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-display:swap;font-weight:200 900;src:url(/VIDOM/maquette/polices/source-serif-4-latin-ext-opsz-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
.didact-temps{height:3px;border-radius:2px;background:var(--bois-c);overflow:hidden;margin-top:-4px}.didact-temps i{display:block;height:100%;width:0;background:var(--terra)}.didact-temps.marche i{animation:didTemps 6s linear forwards}@keyframes didTemps{from{width:0}to{width:100%}}.didact-lecture{display:inline-flex;align-items:center;gap:4px}
/* D-531 : les artisans en fiches, comme les contrats */
.rayon.fiches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:stretch;padding:6px 2px 4px}
@media (min-width:600px){.rayon.fiches{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}}
.rayon.fiches .classeur{max-width:none;width:auto;flex:none}
.rayon.fiches .classeur::before{display:none}
.pro-fiche.ct-vide svg{width:22px;height:22px;color:var(--sauge-f)}
.pro-fiche.ct-vide{gap:4px;font:inherit;cursor:pointer}
/* D-632 : le profil en petits cadres, bord de couleur ; fermés à l'arrivée, un seul ouvert à la fois */
.pf-haut{display:flex;flex-wrap:wrap;gap:12px}
.pf-haut>.card{flex:1 1 300px;min-width:0}
.pf-sec{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-top:6px}
.pf-sec h2{margin:0;font-size:1em;font-weight:700;color:var(--sauge-f)}
.pf-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;grid-auto-flow:dense}
.pf-tuile{background:var(--blanc);border:1px solid var(--bois-c);border-left:6px solid var(--pf-c,var(--sauge));border-radius:14px;min-width:0}
.pf-tuile.ouverte{grid-column:span 2}
.pf-ferme{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;gap:8px;width:100%;height:100%;min-height:112px;padding:12px 14px;border-radius:12px}
.pf-ferme:hover{background:var(--sauge-cc)}
.pf-ferme:focus-visible{outline:3px solid var(--sauge-f);outline-offset:2px}
.pf-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;min-width:0}
.pf-titre{line-height:1.25;overflow-wrap:break-word;min-width:0}
.pf-tete .chip{flex:0 0 auto;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.pf-ligne{display:flex;justify-content:space-between;align-items:flex-end;gap:6px;min-width:0}
.pf-ligne .small{line-height:1.35;overflow-wrap:break-word;min-width:0}
.pf-ligne svg{width:18px;height:18px;flex:0 0 auto;transform:rotate(90deg);color:var(--sable)}
.pf-ouvert{display:flex;flex-direction:column;gap:10px;padding:14px 16px 16px}
.pf-reduire svg{width:16px;height:16px;transform:rotate(-90deg)}
@media (max-width:599px){
.pf-grille{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pf-tuile.ouverte{grid-column:1/-1}
.pf-ferme{min-height:104px;padding:10px 10px}
.pf-tete{flex-direction:column;gap:6px}
.pf-titre{font-size:.92em}
.pf-ligne .small{font-size:.85em}
.pf-ouvert{padding:12px 12px 14px}
}
/* D-591 puis D-630 : les cartes de visite des artisans et des professionnels, en rectangles couchés (démonstration du 10 septembre) */
.rayon.fiches.cv-grille{grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px;padding:4px 0 2px}
.cv-carte{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr) auto;grid-template-areas:"av nom badge" "sous sous sous" "motif motif motif" "date date date" "btn btn btn";column-gap:10px;row-gap:2px;align-items:center;background:var(--blanc);border:1px solid var(--sable);border-radius:10px;padding:12px 14px;box-sizing:border-box;min-width:0}
.cv-carte:hover{border-color:var(--sauge-f)}
.cv-av{grid-area:av;width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.74em}
.cv-carte a.classeur.cv-nom{grid-area:nom;display:block;max-width:none;width:auto;position:static;z-index:auto;gap:0;align-items:initial;font-weight:700;line-height:1.2;color:var(--encre);min-width:0;overflow-wrap:break-word;hyphens:manual}
.cv-carte a.classeur.cv-nom::before{display:none}
.cv-carte a.classeur.cv-nom::after{content:"";position:absolute;inset:0;border-radius:10px;z-index:1}
.cv-carte a.classeur.cv-nom:focus-visible{outline:none}
.cv-carte:focus-within{outline:3px solid var(--sauge-f);outline-offset:2px}
.cv-badge{grid-area:badge;justify-self:end;font-size:max(.7em,13px);border-radius:999px;padding:2px 8px;background:var(--sable-c,#efe6d8);color:var(--ardoise);white-space:nowrap}
.cv-badge.ok{background:var(--sauge-c);color:var(--sauge-f)}
.cv-carte p{margin:0;min-width:0}
.cv-carte .cv-sous{grid-area:sous;margin-top:6px}
.cv-carte .cv-motif{grid-area:motif;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-carte .cv-date{grid-area:date}
.cv-carte .cv-btn{grid-area:btn;position:relative;z-index:2;justify-self:start;margin-top:8px}
/* les étagères des artisans, allégées : un titre de métier, « Trouver un … » à droite, plus de grand cadre */
.view details.card.grp.etg-leger{background:none;border:0;border-radius:0;padding:0;box-shadow:none}
.view details.card.grp.etg-leger>summary{padding:6px 2px;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--sable)}
.view details.card.grp.etg-leger .grp-corps{padding:8px 0 4px}
.etg-titre{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0}
.etg-trouver{margin-left:auto;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 8px;background:none;border:0;font:inherit;font-size:max(.85em,13px);font-weight:600;color:var(--sauge-f);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.etg-trouver svg{width:18px;height:18px;flex:0 0 auto}
.etg-leger>summary .chev{margin-left:0!important}
@media (max-width:599px){
/* D-630 : sur le téléphone, deux cartes par ligne, police un peu réduite (en em : la « Taille du texte » des Réglages s'applique toujours) */
.rayon.fiches.cv-grille{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.cv-carte{grid-template-columns:26px minmax(0,1fr);grid-template-areas:"av badge" "nom nom" "sous sous" "motif motif" "date date" "btn btn";padding:8px 9px;row-gap:1px;align-items:center}
.cv-av{width:26px;height:26px;font-size:.66em}
.cv-carte a.classeur.cv-nom{font-size:.88em;margin-top:5px}
.cv-carte .small{font-size:.8em;line-height:1.3}
.cv-carte .cv-sous,.cv-carte .cv-motif{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:0}
.cv-badge{font-size:.72em;padding:1px 7px}
.cv-carte .cv-btn{justify-self:stretch;margin-top:6px}
.etg-titre{order:1;flex:1 1 calc(100% - 48px)}
.etg-leger>summary .chev{order:2}
.etg-trouver{order:3;margin-left:-4px;padding:0 4px}
}
.line.lien-fort{background:var(--terra-c);border-radius:10px;padding-left:12px;padding-right:12px;margin:4px 0;color:var(--terra-f)}
.line.lien-fort span{font-weight:700}
.lien-didact{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin:2px 0 4px;padding:6px 12px;border-radius:999px;border:1px solid var(--terra-c);background:var(--terra-c);color:var(--terra-f);font:inherit;font-size:.86em;font-weight:600;cursor:pointer}.lien-didact .i{width:16px;height:16px}.didact{display:flex;flex-direction:column;gap:10px}.didact-ecrans{display:flex;gap:10px;justify-content:center;align-items:flex-start;background:var(--sauge-cc);border-radius:16px;padding:12px 8px}.didact-ecrans img{display:block;max-width:46%;max-height:42vh;height:auto;border-radius:14px;border:3px solid var(--encre);background:var(--blanc);box-shadow:0 6px 16px rgba(47,52,57,.18)}.didact-ecrans.un img{max-width:62%;max-height:46vh}.didact h2{margin:2px 0 0}.didact-pts{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px}.didact-pts li{font-size:.95em}.didact-points{display:flex;gap:6px;justify-content:center}.didact-points button{width:9px;height:9px;padding:0;border-radius:50%;border:0;background:var(--bois);cursor:pointer}.didact-points button.on{background:var(--terra);width:22px;border-radius:5px}

/* ================= D-597 : la nouvelle navigation ================= */
.side{display:none}
.nav5,.tete5{display:none}
@media (min-width:1024px){
  body.app .desk.nav3{display:grid;grid-template-columns:248px minmax(0,1fr);gap:0;max-width:none;margin:0;padding:0;min-height:100vh}
  .desk.nav3 .pane.left{background:#4A6255;color:#fff;padding:18px 14px;gap:4px;box-sizing:border-box}
  .desk.nav3 .pane.right{padding:0 32px 32px;max-width:1240px;width:100%;box-sizing:border-box}
  .desk.nav3 .pane.right>.topbar{padding:16px 0 10px;gap:12px}
  .side{display:flex;flex-direction:column;gap:2px;min-height:calc(100vh - 36px)}
}
.side .logo5{display:flex;flex-direction:column;align-items:center;gap:0;padding:10px 18px 8px;margin-bottom:10px;background:var(--ivoire);border-radius:12px;align-self:flex-start;text-decoration:none}
.side .logo5 svg{width:46px;height:46px}.side .logo5 .logo-mot{font-size:1.25em;line-height:1}
.side .log5{display:flex;gap:6px;margin-bottom:6px}
.side .log5 button{border:0;border-radius:12px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;font:inherit}
.side .log5 .nom{flex:1 1 auto;min-width:0;text-align:left;padding:10px 12px;display:flex;align-items:center;gap:8px}
.side .log5 .nom .stack{min-width:0}
.side .log5 .nom .small{color:#E4EBE6;overflow-wrap:anywhere}
.side .log5 .plus{flex:0 0 44px;display:flex;align-items:center;justify-content:center}
.side .log5 svg{width:20px;height:20px}
.side .adr5{display:block;color:#E4EBE6;font-size:.8em;padding:0 8px 10px;text-decoration:none;overflow-wrap:anywhere}
.side .adr5:hover{text-decoration:underline}
.side a.it,.side button.it{display:flex;align-items:center;gap:12px;border:0;border-radius:10px;color:#fff;padding:10px 12px;text-align:left;text-decoration:none;background:transparent;font:inherit;font-size:1em;cursor:pointer;width:100%}
.side a.it:hover,.side button.it:hover{background:rgba(255,255,255,.1)}
.side a.it.on{background:rgba(255,255,255,.18);font-weight:700}
.side .it svg{width:20px;height:20px;flex:0 0 auto}
.side .it .n{margin-left:auto;font-size:.8em;background:var(--terra-f);color:#fff;border-radius:10px;padding:0 7px;font-weight:600}
.side .it.cours{background:rgba(201,119,91,.35)}
.side .bas{margin-top:auto;display:flex;flex-direction:column;gap:2px;padding-top:10px;border-top:1px solid rgba(255,255,255,.18)}
.side .bas .it{padding:8px 12px;font-size:.94em}
.side .qui{padding:8px 12px 0;font-size:.85em;color:#E4EBE6}
.cherche5{flex:1 1 auto;display:flex;align-items:center;gap:10px;background:var(--blanc);border:1px solid var(--bois-c);border-radius:12px;padding:0 14px;min-height:44px}
.cherche5 svg{width:20px;height:20px;color:var(--ardoise)}
.cherche5 input{flex:1 1 auto;border:0;background:transparent;font:inherit;min-height:42px;outline:none;min-width:0}
.btn-q5{width:44px;height:44px;border-radius:50%;border:1px solid var(--terra-f);background:var(--terra-f);font-weight:700;font-size:1.1em;cursor:pointer;color:var(--blanc)}
.tete5 .rond.q5{background:var(--terra-f);border-color:var(--terra-f);color:var(--blanc);font-size:1.1em} /* D-598 */
/* téléphone */
@media (max-width:1023px){
  .tete5{display:flex;align-items:center;gap:8px;padding:10px 4px 8px}
  .nav5{display:grid}
}
.tete5 .logo6{display:flex;flex-direction:column;align-items:center;text-decoration:none;flex:0 0 auto}
.tete5 .logo6 svg{width:30px;height:30px}.tete5 .logo6 .logo-mot{font-size:.85em;line-height:1}
.tete5 .lg{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:6px;border:1px solid var(--bois);border-radius:12px;background:var(--blanc);padding:4px 10px;min-height:44px;text-align:left;font:inherit;cursor:pointer}
.tete5 .lg .stack{min-width:0}.tete5 .lg .b,.tete5 .lg .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tete5 .rond{flex:0 0 44px;width:44px;height:44px;border-radius:50%;border:1px solid var(--bois);background:var(--blanc);display:flex;align-items:center;justify-content:center;color:var(--sauge-f);font-weight:700;cursor:pointer;text-decoration:none}
.tete5 svg{width:20px;height:20px}
/* D-671 : sur le téléphone, le sélecteur de logement garde toujours sa place ; les boutons ronds passent à la ligne si besoin ; « Pas encore sauvegardé » a sa propre ligne, sous l'en-tête */
@media (max-width:1023px){
  .tete5{flex-wrap:wrap;gap:6px}
  .tete5 .lg{flex:1 1 110px;min-width:110px}
  .tete5 #signe-attente{order:99;flex:1 0 100%;display:flex;min-width:0}
  .tete5 #signe-attente:empty{display:none}
  .tete5 #signe-attente .chip{max-width:100%;white-space:normal;text-align:left}
}
.nav.nav5{grid-template-columns:repeat(5,minmax(0,1fr))}
.nav.nav5 a,.nav.nav5 label,.nav.nav5 button{font-size:.75em}
.nav.nav5 button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;border:0;background:transparent;color:var(--ardoise);border-radius:var(--r);font-weight:600;cursor:pointer;position:relative}
.nav.nav5 button.on{color:var(--sauge-f);background:var(--sauge-cc)}
.nav.nav5 button svg{width:24px;height:24px}
.feuille5{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;justify-content:flex-end}
.feuille5 .fond{position:absolute;inset:0;background:rgba(47,52,57,.35);border:0}
.feuille5 .panneau{position:relative;background:var(--ivoire);border-radius:20px 20px 0 0;padding:10px 16px 90px;max-height:80vh;overflow:auto;display:flex;flex-direction:column;gap:2px}
.feuille5 .panneau a,.feuille5 .panneau button.it{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 6px;border:0;background:transparent;text-decoration:none;color:var(--encre);font:inherit;font-weight:600;text-align:left;width:100%;border-bottom:1px solid var(--bois-c);cursor:pointer}
.feuille5 .panneau svg{width:22px;height:22px;color:var(--sauge-f)}
.feuille5 .panneau .n{margin-left:auto;font-weight:400;color:var(--ardoise)}
/* Documents et Appareils */
.puces5{display:flex;flex-wrap:wrap;gap:8px}
.puce5{border:1px solid var(--bois);border-radius:999px;padding:7px 16px;font-weight:600;background:var(--blanc);color:var(--encre);cursor:pointer;font:inherit;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:40px;box-sizing:border-box}
.puce5 .c{font-weight:400;opacity:.8}
.puce5.on{background:#4A6255;color:#fff;border-color:#4A6255}
.puce5.vide{background:var(--ivoire);color:var(--ardoise);border-style:dashed;cursor:default}
.puce5.sm{padding:4px 12px;font-size:.9em;min-height:34px}
.etiq5{font-size:.8em;font-weight:600;color:var(--ardoise);text-transform:uppercase;letter-spacing:.06em}
.zone-sr5{position:relative}
.panneau-sr5{position:absolute;left:0;right:0;top:100%;z-index:30;padding-top:6px}
.panneau-sr5>div{background:var(--blanc);border:1px solid var(--bois);border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.14);padding:12px 14px;display:flex;flex-wrap:wrap;gap:6px}
.table5{background:var(--blanc);border:1px solid var(--bois-c);border-radius:16px;padding:4px 18px 8px}
.table5 .t5h,.table5 a.t5l{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1fr) 140px minmax(0,1.2fr) 110px;gap:14px;align-items:center}
.table5 .t5h{padding:10px 0;font-size:.78em;font-weight:600;color:var(--ardoise);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--bois)}
.table5 a.t5l{padding:10px 0;border-bottom:1px solid var(--bois-c);text-decoration:none;color:var(--encre)}
.table5 a.t5l:hover{background:var(--sauge-cc)}
.table5 .t5l .b{display:block}
.table5 .t5h .tri5{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;padding:4px 6px;margin:-4px -6px;border-radius:6px;max-width:100%}
.table5 .t5h .tri5:hover{background:var(--sauge-cc);color:var(--encre)}
.table5 .t5h .tri5:focus-visible{outline:2px solid var(--sauge-f);outline-offset:1px}
.table5 .t5h .tri5.on{color:var(--encre)}
.table5 .t5h .tri5 .fl5{font-size:.85em;opacity:.45}
.table5 .t5h .tri5.on .fl5{opacity:1}
.table5.eq a.t5l,.table5.eq .t5h{grid-template-columns:minmax(0,2.2fr) minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr)}
@media (max-width:1023px){
  .table5{padding:0;background:transparent;border:0}
  .table5 .t5h{display:none}
  .table5 a.t5l,.table5.eq a.t5l{display:block;background:var(--blanc);border:1px solid var(--bois-c);border-radius:14px;padding:12px 14px;margin-bottom:8px}
  .table5 .t5l>span:first-child{display:block;margin-bottom:2px}
  .table5 .t5l .x5{display:inline;font-size:.88em;color:var(--ardoise)}
  .table5 .t5l .x5:not(:empty)~.x5:not(:empty)::before{content:" · "}
}
.deux5{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.deux5>button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:2px solid var(--sauge-f);border-radius:14px;padding:10px 14px;background:var(--sauge-f);color:var(--blanc);font:inherit;cursor:pointer;min-height:56px;position:relative}
.deux5>button::after{content:"";position:absolute;right:14px;top:50%;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-70%) rotate(45deg)}
.deux5>button[aria-expanded="true"]::after{transform:translateY(-20%) rotate(-135deg)}
.deux5>button.on{background:var(--sauge-f);color:#fff;border-color:var(--or);box-shadow:inset 0 0 0 1px var(--or)}
.deux5 .p{font-size:.8em;opacity:.85}
/* D-598 : une couleur par famille de papier */
.ty5{display:inline-block;border-radius:999px;padding:1px 10px;font-size:.85em;font-weight:600;line-height:1.6}
.ty5.argent{background:#F6ECD3;color:#6E5210}.ty5.engag{background:var(--terra-c);color:var(--terra-f)}.ty5.tech{background:var(--sauge-c);color:var(--sauge-f)}.ty5.img5{background:var(--bois-c);color:#5E4A2E}.mini5{flex:0 0 48px;width:48px;height:48px;border-radius:8px;overflow:hidden;background:var(--bois-c);display:block}.mini5 img{width:100%;height:100%;object-fit:cover;display:block}.ty5.autre{background:#E6E8EA;color:var(--ardoise)}
@media (max-width:1023px){.table5 a.t5l.argent{border-left:5px solid var(--or)}.table5 a.t5l.engag{border-left:5px solid var(--terra)}.table5 a.t5l.tech{border-left:5px solid var(--sauge)}.table5 a.t5l.img5{border-left:5px solid var(--bois)}.table5 a.t5l.autre{border-left:5px solid var(--ardoise)}.table5 .t5l .b{color:var(--encre)}}
.cherche5 .mic5{min-height:38px;width:38px;padding:0;border:0;border-radius:50%;background:var(--sauge-cc);color:var(--sauge-f);flex:0 0 auto}
.cherche5 .mic5.terra{background:var(--terra-f);color:var(--blanc)}
.cherche5.d598{border-color:var(--sauge-c);border-width:2px;padding-right:4px}
/* D-599 */
.deux5 .b{font-size:1.05em;font-weight:700}.deux5 .p{font-size:.85em;opacity:.9}
.liste5.deplie5{max-height:60vh;overflow:auto}
.liste5 button.rub{font-weight:700;margin-top:2px}
.liste5 button.sous{padding-left:30px;min-height:40px;font-size:.95em;color:var(--ardoise)}
.liste5 button.sous::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--bois);margin-left:-14px;margin-right:4px}
.liste5 button.sous.on{color:#fff}
.tete5 .rond.sortir5{color:var(--terra-f)}
.suppr5{color:var(--terra-f)!important}
.tuiles5 a{border-left:5px solid var(--sauge)}.tuiles5 a:nth-child(2){border-left-color:var(--or)}.tuiles5 a:nth-child(3){border-left-color:var(--terra)}.tuiles5 a:nth-child(4){border-left-color:var(--ardoise)}
.titre5{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;margin:0;padding:4px 12px;border-radius:999px;font-size:.9em;font-weight:700}
.titre5.terra{background:var(--terra-c);color:var(--terra-f)}.titre5.sauge{background:var(--sauge-c);color:var(--sauge-f)}
.card.fil5{border-left:5px solid var(--sauge)}.card.fil5.t-rappel{border-left-color:var(--or);background:#FFFBF1}.card.fil5.t-question{border-left-color:var(--terra);background:#FFF8F4}.card.fil5.t-recu{border-left-color:var(--terra-f)}
.card.fil5 .when{display:inline-block;padding:1px 10px;border-radius:999px;background:var(--sauge-cc);color:var(--sauge-f);font-weight:600;font-size:.85em}
.card.fil5.t-rappel .when{background:#F6ECD3;color:#6E5210}.card.fil5.t-question .when{background:var(--terra-c);color:var(--terra-f)}
.card.ag5{border-left:5px solid var(--bois)}
.grp5{align-self:flex-start;padding:1px 10px;border-radius:999px;font-size:.82em;font-weight:600;background:#E6E8EA;color:var(--ardoise)}
.ag5.g-log{border-left-color:var(--terra)}.ag5.g-log .grp5{background:var(--terra-c);color:var(--terra-f)}
.ag5.g-ener{border-left-color:var(--or)}.ag5.g-ener .grp5{background:#F6ECD3;color:#6E5210}
.ag5.g-trav{border-left-color:var(--sauge)}.ag5.g-trav .grp5{background:var(--sauge-c);color:var(--sauge-f)}
.ag5.g-app{border-left-color:#7A8FA3}.ag5.g-app .grp5{background:#E3E9F0;color:#3E5266}
.ag5.g-ass{border-left-color:var(--terra-f)}.ag5.g-ass .grp5{background:var(--terra-c);color:var(--terra-f)}
.raconte5-livre p{line-height:1.6}
.card.chauf5{background:var(--sauge-cc);border-color:var(--sauge-c);border-left:5px solid var(--sauge)}
.frise5{position:relative;display:flex;flex-direction:column;gap:14px;padding-left:22px}
.frise5::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--bois-c)}
.frise5 .m{position:relative;display:flex;flex-direction:column;gap:1px}
.frise5 .m::before{content:"";position:absolute;left:-21px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--sauge);border:2px solid var(--blanc)}
.frise5 .m.k-achat::before{background:var(--terra)}.frise5 .m.k-travaux::before{background:var(--or)}.frise5 .m.k-sinistre::before{background:var(--terra-f)}.frise5 .m.k-souvenir::before{background:#7A8FA3}
.frise5 .m .d{font-size:.82em;color:var(--sable)}
/* D-600 */
.nav.nav5 a>span:last-child,.nav.nav5 button>span:last-child,.nav.nav5 label>span:last-child{white-space:nowrap;overflow-wrap:normal;letter-spacing:-.01em}
.nav.nav5{gap:4px;padding-left:6px;padding-right:6px}
.tuiles-doc5{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tdoc5{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:16px;text-decoration:none;color:var(--encre);background:var(--sauge-cc);border:1px solid var(--sauge-c);border-left:6px solid var(--sauge);min-height:96px;position:relative}
.tdoc5 .ic{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--blanc);color:var(--sauge-f)}
.tdoc5 .ic svg{width:20px;height:20px}.tdoc5 .b{font-size:1em;line-height:1.2}.tdoc5 .c{position:absolute;top:12px;right:14px;font-weight:700;font-size:1.1em;color:var(--sauge-f)}
.tdoc5.r-travaux{background:#FBF4E2;border-color:#EBDDB2;border-left-color:var(--or)}.tdoc5.r-travaux .ic,.tdoc5.r-travaux .c{color:#6E5210}
.tdoc5.r-abonnements{background:#EAF0F5;border-color:#D3DEE8;border-left-color:#7A8FA3}.tdoc5.r-abonnements .ic,.tdoc5.r-abonnements .c{color:#3E5266}
.tdoc5.r-assurance{background:var(--terra-c);border-color:#EBCDBF;border-left-color:var(--terra)}.tdoc5.r-assurance .ic,.tdoc5.r-assurance .c{color:var(--terra-f)}
.tdoc5.r-logement{background:#F6EEE6;border-color:var(--bois-c);border-left-color:var(--terra-f)}.tdoc5.r-logement .ic,.tdoc5.r-logement .c{color:var(--terra-f)}
.tdoc5.r-papiers,.tdoc5.r-photos{background:var(--bois-c);border-color:var(--bois);border-left-color:var(--bois)}.tdoc5.r-papiers .ic,.tdoc5.r-papiers .c,.tdoc5.r-photos .ic,.tdoc5.r-photos .c{color:#5E4A2E}
.tdoc5.r-averifier{background:#FFF8F4;border-color:var(--terra-c);border-left-color:var(--terra-f)}.tdoc5.r-averifier .ic,.tdoc5.r-averifier .c{color:var(--terra-f)}
.defile5{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.defile5::-webkit-scrollbar{display:none}
.defile5 .puce5{flex:0 0 auto;white-space:nowrap}
.puces5:not(.types5)>.puce5:not(.on){background:var(--sauge-cc);border-color:var(--sauge-c);color:var(--sauge-f)}
.panneau-sr5 .puce5,.sous5 .puce5{background:#FBF4E2;border-color:#E8D49B;color:#6E5210}
.panneau-sr5 .puce5.on,.sous5 .puce5.on{background:#8A6A14;border-color:#8A6A14;color:#fff}
.types5 .puce5{background:var(--terra-c);border-color:#EBCDBF;color:var(--terra-f)}
.types5 .puce5.on{background:var(--terra-f);border-color:var(--terra-f);color:#fff}
.types5 .puce5.vide{background:var(--ivoire);color:var(--sable);border-color:var(--bois-c)}
/* D-602 : un bord de couleur sur les cadres (vert, doré, terracotta, bleu-gris, à tour de rôle dans la page) ; les cadres dont la
   couleur veut déjà dire quelque chose (À faire, sinistre en cours, à garder, chauffage) gardent la leur */
.view .bc0,.view .bc1,.view .bc2,.view .bc3{border-left:4px solid var(--sauge)}
.view .card.bc0,.view .card.bc1,.view .card.bc2,.view .card.bc3{padding-left:15px} /* le bord ne prend pas de place : rien ne déborde à 320 points */
.view .bc1{border-left-color:var(--or)}.view .bc2{border-left-color:var(--terra)}.view .bc3{border-left-color:#7A8FA3}
.liste5{background:var(--blanc);border:1px solid var(--bois);border-radius:14px;padding:6px;display:flex;flex-direction:column;gap:2px;box-shadow:0 6px 18px rgba(0,0,0,.08)}
.liste5 button{display:flex;align-items:center;gap:8px;text-align:left;border:0;border-radius:10px;padding:0 12px;min-height:46px;background:transparent;font:inherit;cursor:pointer;color:var(--encre)}
.liste5 button.on{background:#4A6255;color:#fff}
.liste5 button .c{margin-left:auto;font-size:.9em;opacity:.8}
.liste5 button:disabled{color:var(--sable);cursor:default}
.tuiles5{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:1023px){.tuiles5{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tuiles5 a{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:16px;background:var(--blanc);border:1px solid var(--bois-c);text-decoration:none;color:var(--encre)}
.tuiles5 a .num{font-size:1.5em;font-weight:700;color:var(--sauge-f);line-height:1.1}
.tabs5{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--bois-c)}
.tabs5 a{padding:10px 14px;text-decoration:none;color:var(--ardoise);border-bottom:3px solid transparent;font-weight:400}
.tabs5 a.on{color:var(--sauge-f);border-bottom-color:var(--sauge-f);font-weight:700}
.grille5{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:1023px){.grille5{grid-template-columns:minmax(0,1fr)}}
/* D-638 : les cercles de la mémoire */
.donut6{position:relative;display:inline-block;border-radius:50%;flex:0 0 auto}.donut6-c{position:absolute;border-radius:50%;background:var(--blanc);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px}.cercles6{gap:10px;text-decoration:none;color:var(--encre);border:2px solid var(--sauge)}.barre6{display:block;height:10px;border-radius:5px;border:1.5px dashed #BFB09A;background:var(--blanc);overflow:hidden}.barre6>span{display:block;height:100%}.pastille6{width:14px;height:14px;border-radius:50%;flex:0 0 auto;display:inline-block;box-sizing:border-box}@media (max-width:1023px){.cercles6.ordi6{display:none}}@media (min-width:1024px){.cercles6.tel6{display:none}}

/* ----- deuxième bloc de styles (fin de l'ancien premier <style>, début du second) ----- */

:root{
  --sauge:#5F7A6A;--sauge-f:#4A6255;--sauge-c:#E4EBE6;--sauge-cc:#F0F4F1;
  --ivoire:#F6F3ED;--blanc:#FFFDF9;--bois:#D8C8B2;--bois-c:#EFE6D8;--sable:#6C6963; /* D-588 : lisible (4,9 sur ivoire), était #B5B0A5 */
  --ardoise:#50575E;--encre:#2F3439;--terra:#C9775B;--terra-c:#F4E3DB;--terra-f:#8E503A; /* D-588 : petit texte orangé lisible, était #A85F45 */--or:#D4AF5A;
  --fs:17px;--r:12px;--r2:16px;
}
#barre-pris{position:fixed;left:8px;right:8px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 12px;background:var(--blanc);border:2px solid var(--terra);border-radius:var(--r2);box-shadow:0 6px 24px rgba(0,0,0,.18)}
@media (min-width:1024px){#barre-pris{left:auto;right:24px;bottom:24px;max-width:520px}}
body:has(.modal-bg) #barre-pris{display:none}
.cible-pose{outline:3px dashed var(--terra)!important;outline-offset:2px;border-radius:var(--r)}
html[data-texte="grand"]{--fs:19px}
html[data-texte="tres-grand"]{--fs:21px}
@media (min-width:1024px){:root{--fs:16px}html[data-texte="grand"]{--fs:18px}html[data-texte="tres-grand"]{--fs:20px}}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--ivoire);color:var(--encre);font-family:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;font-size:var(--fs);line-height:1.4;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
a{color:var(--sauge-f)}
h1,h2{font-family:"Source Serif 4","Georgia",serif}h1,h2,h3{margin:0;font-weight:600;line-height:1.15;text-wrap:balance}
h1{font-size:1.65em}h2{font-size:1.3em}h3{font-size:1.1em}
p{margin:0}
.muted{color:var(--ardoise)}.faint{color:var(--sable)}.small{font-size:.85em}.b{font-weight:600}
.num{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--terra);outline-offset:2px}
[hidden]{display:none!important}
/* D-588 (essai par personas) : un mot sous chaque icône du haut, des boutons de 44 points, la barre passe à la ligne au lieu de sortir de l'écran */
.btn-haut{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:44px;min-height:44px;padding:2px 4px;border:0;border-radius:10px;background:none;color:var(--sauge-f);font:inherit;font-size:.78em;font-weight:600;line-height:1.1;cursor:pointer;text-decoration:none;flex:0 0 auto}
.btn-haut svg,.btn-haut .i{width:22px;height:22px}
.btn-haut.sortir{margin-left:12px}
.top{flex-wrap:wrap;row-gap:4px}.top>.row:last-child{flex-wrap:wrap;justify-content:flex-end;flex:0 1 auto;min-width:0;max-width:100%;margin-left:auto}
.btn-contrats{min-height:44px}
@media (max-width:360px){.top{padding-left:12px;padding-right:12px}.bande-aide .small{display:none}.bande-aide{margin:2px 12px 8px;padding:8px 12px;gap:8px}.bande-aide .tile{width:28px;height:28px}}
@media (max-width:300px){.btn-contrats{padding:0 8px}.btn-haut.sortir{margin-left:6px}}
.btn-chip.on::before{content:"✓ " / "";font-weight:700}
.top .back{min-width:44px;justify-content:center}
input[type=checkbox]{min-width:24px;min-height:24px}
.btn.sm{min-height:44px!important;font-size:max(.85em,13px)!important}
.ct-badge{font-size:max(.68em,13px)!important}
.btn-chip,.lien-didact{min-height:44px}
button.h{min-height:44px!important}
.chip{font-size:max(.8em,13px)}
.input:focus{box-shadow:0 0 0 2px var(--terra-f)}
@media (max-width:260px){.card,.line,.row,.split,.ask,summary{flex-wrap:wrap!important;min-width:0}.stack{min-width:0}.chip,.btn,.btn-chip{white-space:normal!important;max-width:100%}.btn.grow{flex-basis:100%}} /* D-588 : zoom 200 %, rien ne sort de l'écran */
button:focus-visible,a:focus-visible,[role=button]:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--terra-f)!important;outline-offset:2px}
.toast.erreur{pointer-events:auto;border-radius:16px;display:flex;align-items:center;gap:12px;text-align:left;background:var(--terra-f)}
.toast.erreur button{flex:0 0 auto;min-height:40px;min-width:56px;border:2px solid var(--blanc);border-radius:999px;background:none;color:var(--blanc);font:inherit;font-weight:700;cursor:pointer}
.lien-coord{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:44px}
.lien-coord:hover,.lien-coord:focus-visible{text-decoration:underline}
/* D-298 : listes repliables et recherche */
.rech{display:flex;align-items:center;gap:8px}.rech-champ{position:relative;flex:1 1 auto;min-width:0;display:flex;align-items:center}
.rech-champ .input{padding-left:44px;padding-right:44px}.rech-champ .input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}.rech-champ .loupe{position:absolute;left:14px;color:var(--ardoise);pointer-events:none}
.rech-champ .efface{all:unset;position:absolute;right:6px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:999px;color:var(--ardoise);cursor:pointer}
.rech .rech-mic{min-height:54px;min-width:54px;padding:0;border-radius:14px;justify-content:center}
.card.grp{padding:0;gap:0}.card.grp>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:14px 18px;cursor:pointer;min-height:24px}
.card.grp>summary::-webkit-details-marker{display:none}.card.grp>summary .chev{margin-left:auto;color:var(--ardoise);transition:transform .2s}
.card.grp[open]>summary .chev{transform:rotate(90deg)}.card.grp .grp-corps{padding:0 16px 8px}.card.grp .grp-corps .mosaique{padding:4px 2px 8px}
.sr{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
svg.i{width:20px;height:20px;flex:0 0 auto}
.logo-p{display:inline-flex;align-items:center;flex:0 0 auto;margin-right:6px}.logo-p svg{width:26px;height:26px}
.logo-grand{display:flex;flex-direction:column;align-items:center;gap:2px}.logo-grand svg{width:132px;height:132px}
.logo-mot{font-weight:600;font-size:2.4em;letter-spacing:.01em;line-height:1}.logo-mot .v{color:var(--sauge)}.logo-mot .o{color:var(--terra)}
.logo-public{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}.logo-public svg{width:72px;height:72px}.logo-public .logo-mot{font-size:1.7em}.logo-public p{margin-top:4px}

/* ---------- squelette ---------- */
#app{min-height:100%;display:flex;flex-direction:column}
.col{width:100%;max-width:600px;margin:0 auto;display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
.top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(14px + env(safe-area-inset-top)) 20px 8px}
.top .t{font-size:.8em;color:var(--ardoise);font-weight:600;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60vw}
.top .back{display:inline-flex;align-items:center;gap:6px;color:var(--sauge-f);font-weight:600;min-height:44px}
.bande-aide{display:flex;align-items:center;gap:12px;width:auto;margin:2px 20px 10px;padding:10px 14px;border-radius:var(--r);border:1px solid var(--terra-f);background:var(--terra-f);color:var(--blanc);text-align:left;cursor:pointer;font:inherit}.bande-aide .tile{width:36px;height:36px;flex:0 0 auto;background:rgba(255,253,249,.18);color:var(--blanc)}.bande-aide .b{font-size:1.05em}.bande-aide .small{color:rgba(255,253,249,.88);line-height:1.3}.bande-aide>svg{flex:0 0 auto}.desk .bande-aide{margin:0 4px 12px}
.aide{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--bois);background:var(--blanc);color:var(--sauge-f);flex:0 0 auto}.aide svg{width:20px;height:20px}.aide:hover{border-color:var(--sauge)}
.top .chip{overflow:hidden;text-overflow:ellipsis;max-width:48vw}
.view{flex:1 1 auto;display:flex;flex-direction:column;gap:14px;padding:6px 18px 24px}
.view.center{justify-content:center;padding-bottom:120px}
.nav{position:sticky;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px 10px calc(10px + env(safe-area-inset-bottom));background:var(--blanc);border-top:1px solid var(--bois-c)}
.nav a,.nav label.imp{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:54px;text-decoration:none;color:var(--ardoise);font-size:.8em;font-weight:500;border-radius:var(--r)}
.nav a svg,.nav label svg{width:24px;height:24px}.nav a span:last-child,.nav label span{text-align:center;line-height:1.15;overflow-wrap:anywhere}
.nav label.cam,.nav a.cam{color:var(--blanc)}
.nav a.on{color:var(--sauge-f);background:var(--sauge-cc)}
.nav a.cam{color:var(--blanc);background:var(--sauge)}
.nav a{position:relative}
.pastille{position:absolute;top:2px;left:calc(50% + 6px);min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--terra-f);color:var(--blanc);font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
.nav a.cam.on{background:var(--sauge-f)}

/* ---------- ordinateur ---------- */
.desk{display:none}
@media (min-width:1024px){
  body.app .col{display:none}
  body.app .desk{display:grid;grid-template-columns:420px minmax(0,1fr);gap:32px;max-width:1280px;margin:0 auto;padding:0 32px;min-height:100vh}
  .desk .pane{display:flex;flex-direction:column;min-height:100vh}
  .desk .pane.left{position:sticky;top:0;max-height:100vh;overflow:auto;padding-bottom:24px}
  .desk .pane .view{padding:6px 4px 32px}
  .desk .topbar{position:sticky;top:0;z-index:5;background:var(--ivoire);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 4px 8px}
  .desk .topbar .t{font-size:.8em;color:var(--ardoise);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
  .desk .topbar .actions{display:flex;gap:8px;align-items:center}
  .nav{display:none}
}

/* ---------- composants ---------- */
.card{background:var(--blanc);border:1px solid var(--bois-c);border-radius:var(--r2);padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.card.soft{background:var(--sauge-cc);border-color:var(--sauge-c)}
.card.attn{border-color:var(--terra);background:var(--terra-c)}
.card.dash{border-style:dashed;background:transparent;color:var(--sable)}
a.card{text-decoration:none;color:inherit}
.row{display:flex;gap:10px;align-items:center}
.row.wrap{flex-wrap:wrap}
.split{display:flex;justify-content:space-between;align-items:center;gap:10px}
.stack{display:flex;flex-direction:column;gap:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r);border:1px solid var(--bois);background:var(--blanc);color:var(--encre);font-size:.95em;font-weight:600;text-decoration:none;text-align:center;line-height:1.2}
.btn:hover{border-color:var(--sauge)}
.btn.primary{background:var(--sauge);border-color:var(--sauge);color:var(--blanc)}
.btn.primary:hover{background:var(--sauge-f)}
.btn.terra{background:var(--terra-f);border-color:var(--terra-f);color:var(--blanc)}
.btn.ghost{border-color:transparent;background:transparent;color:var(--sauge-f)}
.btn.big{min-height:56px;font-size:1.05em;border-radius:14px}
.btn.sm{min-height:36px;padding:0 12px;font-size:.85em}
.btn.grow{flex:1 1 auto}
.btn svg{width:20px;height:20px}
.btn.file{position:relative;overflow:hidden}
.btn.file input{position:absolute;inset:0;opacity:0;cursor:pointer}
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;background:var(--sauge-c);color:var(--sauge-f);font-size:.8em;font-weight:600;white-space:nowrap}
.chip.terra{background:var(--terra-c);color:var(--terra-f)}
.raccourcis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.raccourci{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:44px;padding:4px 8px;border-radius:999px;border:1px solid var(--terra);background:var(--terra-c);color:var(--terra-f);font:inherit;font-weight:600;font-size:.92em;line-height:1.15;text-align:center;cursor:pointer}.raccourci:hover{border-color:var(--terra-f)}.raccourci .i{width:16px;height:16px;flex:0 0 auto}.raccourci span{min-width:0;overflow-wrap:break-word}
@media (max-width:440px){.raccourci{flex-direction:column;gap:2px;border-radius:16px;padding:6px 4px}}
.chip.neutre{background:var(--bois-c);color:var(--ardoise)}
.chip.btn-chip{border:1px solid var(--bois);background:var(--blanc);color:var(--ardoise);font-weight:500;font-size:.9em;padding:8px 14px;cursor:pointer}
.chip.btn-chip.on{background:var(--sauge-c);border-color:var(--sauge);color:var(--sauge-f)}
.input{min-height:54px;border-radius:14px;border:1.5px solid var(--bois);background:var(--blanc);padding:0 16px;font-size:1.05em;display:flex;align-items:center;width:100%;color:var(--encre)}
.input:focus{border-color:var(--sauge);outline:none}.input:focus-visible{outline:2px solid var(--terra-f);outline-offset:1px} /* D-588 */
textarea.input{min-height:90px;padding:12px 16px;resize:vertical}
label.f{display:flex;flex-direction:column;gap:6px}
label.f>span{font-size:.85em;color:var(--ardoise)}
.sep{display:flex;align-items:center;gap:10px;color:var(--sable);font-size:.75em;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-top:4px}
.sep i{flex:1 1 auto;height:1px;background:var(--sauge-c);display:block}
.when{font-size:.8em;color:var(--sable);font-weight:500}
.h{font-size:1.65em;font-weight:600;line-height:1.15}
.tile{width:40px;height:40px;border-radius:12px;background:var(--sauge-c);color:var(--sauge-f);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.tile svg{width:22px;height:22px}
.tile.terra{background:var(--terra-c);color:var(--terra-f)}
.tile.dash{background:transparent;border:1.5px dashed var(--bois);color:var(--sable)}
.line{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--bois-c);text-decoration:none;color:inherit}
.revenu{animation:revenu 1.8s ease-out}@keyframes revenu{0%,35%{background:var(--sauge-c)}100%{background:transparent}} /* D-302 */
.line:last-child{border-bottom:0}
.step{display:flex;justify-content:space-between;align-items:center;min-height:50px;border-bottom:1px solid var(--bois-c)}
.step:last-of-type{border-bottom:0}
.step .ctl{display:flex;align-items:center}
.step .ctl button{width:42px;height:42px;border-radius:10px;border:1px solid var(--bois);display:flex;align-items:center;justify-content:center;color:var(--ardoise);font-size:1.4em;background:var(--blanc)}
.step .ctl b{width:40px;text-align:center;font-size:1.1em}
.photo{border-radius:var(--r2);background:#E9E4DA;border:1px solid var(--bois);min-height:150px;display:flex;align-items:flex-end;padding:12px;overflow:hidden;position:relative}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo .chip{position:relative;background:var(--blanc);color:var(--ardoise)}
.photo.entier{cursor:zoom-in;background:#F4F1EA}.photo.entier img{object-fit:contain} /* D-331 : le document se voit en entier */
@media (min-width:1024px){.photo.entier{min-height:60vh!important}}
#zoomv{position:fixed;inset:0;z-index:200;background:rgba(28,30,28,.94);display:flex;flex-direction:column}
#zoomv .zb{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:10px 12px calc(10px) 12px;color:#fff}
#zoomv .zb .t{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
#zoomv .zb button,#zoomv .zb a{background:#fff;color:#222;border-radius:10px;padding:8px 12px;font-weight:600;min-width:44px;text-align:center;text-decoration:none;flex:0 0 auto}
@media (max-width:480px){#zoomv .zb{flex-wrap:wrap;gap:6px}#zoomv .zb .t{flex-basis:100%}#zoomv .zb button,#zoomv .zb a{flex:1 1 0;padding:8px 2px;min-width:0;font-size:.9em}} /* D-485 : la barre tient sur un téléphone */
#zoomv .zc{flex:1 1 auto;overflow:auto;display:flex;touch-action:pan-x pan-y pinch-zoom}
#zoomv .zc img{margin:auto;display:block;max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in;user-select:none;-webkit-user-drag:none}
#zoomv .zc.gros img{max-width:none;max-height:none;cursor:grab}
.bulle{align-self:flex-end;max-width:85%;background:var(--sauge);color:var(--blanc);border-radius:18px 18px 4px 18px;padding:10px 16px}
.ask{display:flex;gap:8px;align-items:center;position:sticky;bottom:calc(76px + env(safe-area-inset-bottom));background:var(--ivoire);padding:8px 0 4px}
@media (min-width:1024px){.ask{bottom:0;padding:10px 0 18px}}
.ask input{flex:1 1 auto}
.ask button{width:54px;height:54px;border-radius:14px;background:var(--sauge);color:var(--blanc);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.house{display:block;width:100%;max-width:300px;margin:0 auto}
.house rect{cursor:pointer}
.plan{width:100%;border-radius:var(--r);border:1px solid var(--bois-c);display:block}
.mono{font-variant-numeric:tabular-nums;word-break:break-all}
.depot{display:block;text-align:center;font-weight:700;font-size:1.25em;line-height:1.25;word-break:break-all;font-variant-numeric:tabular-nums;color:var(--sauge-f);margin:0} /* D-205 : l'adresse VIDOM ne se perd plus dans le texte */
.qr{width:96px;height:96px;flex:0 0 auto;border-radius:6px;background:var(--blanc);padding:4px;border:1px solid var(--bois-c)}
.qr svg{width:100%;height:100%;display:block}
.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--encre);color:var(--blanc);padding:10px 16px;border-radius:999px;font-size:.9em;z-index:50;opacity:0;transition:opacity .25s;pointer-events:none;max-width:90vw;text-align:center}
.toast.on{opacity:1}
.toast.avec-lien{pointer-events:auto}.toast a.toast-voir{color:var(--blanc);font-weight:700;text-decoration:underline;margin-left:10px;white-space:nowrap} /* D-607 */
@media (min-width:1024px){.toast{bottom:32px}}
.modal-bg{position:fixed;inset:0;background:rgba(47,52,57,.35);display:flex;align-items:flex-end;justify-content:center;z-index:40;padding:0}
@media (min-width:600px){.modal-bg{align-items:center;padding:24px}}
.modal{background:var(--ivoire);border-radius:20px 20px 0 0;width:100%;max-width:560px;max-height:92vh;overflow:auto;padding:20px 20px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px}
.modal>*{flex-shrink:0} /* 23 septembre 2026 : une liste dans une fenêtre ne s'écrase plus à zéro sur le téléphone ; c'est la fenêtre qui défile */
@media (min-width:600px){.modal{border-radius:20px;padding:24px}}
.drop{position:fixed;inset:0;background:rgba(95,122,106,.18);border:4px dashed var(--sauge);z-index:60;display:flex;align-items:center;justify-content:center;font-size:1.4em;font-weight:600;color:var(--sauge-f);pointer-events:none}
.fadein{animation:fade .35s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.spin{width:38px;height:38px;border-radius:50%;border:4px solid var(--bois-c);border-top-color:var(--sauge);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.fadein{animation:none}.toast{transition:none}.spin{animation:none}}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:.95em}
.kv dt{color:var(--ardoise)}.kv dd{margin:0}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mosaique{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}@media (min-width:700px){.mosaique{grid-template-columns:repeat(5,minmax(0,1fr))}}
.mosaique button{all:unset;cursor:pointer;position:relative;aspect-ratio:1;border-radius:var(--r2);overflow:hidden;background:var(--sauge-cc);display:block}
.mosaique button img{width:100%;height:100%;object-fit:cover;display:block}.mosaique button .leg{position:absolute;left:0;right:0;bottom:0;padding:4px 6px;font-size:.72em;line-height:1.2;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.65));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mosaique button[data-ph]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation}
.mosaique button[data-ph] img{pointer-events:none;-webkit-user-drag:none} /* D-360 : l'appui long vise la vignette, pas l'image (pas de menu ni de glisser d'image) */
#selbar{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:calc(10px + env(safe-area-inset-top)) 12px 10px;background:var(--sauge-f);color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.25)} /* D-359 */
.mosaique button .pt{position:absolute;top:6px;right:6px;width:10px;height:10px;border-radius:50%;background:var(--terra);border:2px solid #fff}
.mosaique button.choisie{outline:4px solid var(--terra);outline-offset:-4px}.mosaique button.choisie::after{content:"✓";position:absolute;top:6px;left:6px;width:24px;height:24px;border-radius:50%;background:var(--terra);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700} /* D-317 */
.progress{height:6px;border-radius:3px;background:var(--bois-c);overflow:hidden}
.progress i{display:block;height:100%;background:var(--sauge);border-radius:3px}
.book{background:var(--blanc);border:1px solid var(--bois);border-radius:8px;padding:18px 20px;box-shadow:2px 2px 0 var(--bois-c)}
.check{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--bois-c)}
.check input{width:26px;height:26px;min-width:26px;flex:0 0 auto;margin-top:2px;accent-color:var(--sauge)} /* D-447 : la case ne se rétrécit plus (13 px de large mesurés par l'agent IA) */
#bv-go:disabled,#ch-ok:disabled{opacity:.45;cursor:not-allowed} /* D-285 */
/* D-306 : l'appareil n'est pas connecté au compte — on le dit en haut de l'écran */
.bandeau-compte{display:flex;flex-direction:column;gap:6px;margin:8px 16px 0;padding:12px 14px;border-radius:var(--r);background:var(--terra-c);border:1px solid var(--terra);color:var(--encre)}
.bandeau-compte .b{color:var(--terra-f)}
.bandeau-compte .btn{align-self:flex-start}
/* D-350 (30 septembre 2026) : rien ne dépasse d'un téléphone de 360 points (trouvé par les essais automatiques, D-348).
   La barre du haut ne se rétrécissait pas : le nom de la page ou du logement ne se coupait pas, et poussait Profil, Aide,
   Déconnexion hors de l'écran ; le téléphone dézoomait alors toute la page. */
.top>.row:first-child{min-width:0;flex:1 1 auto;overflow:hidden}
.top>.row:last-child{flex:0 0 auto}
.top .t{min-width:0}
.top button[aria-label^="Mes logements"]{min-width:0!important;max-width:100%!important;overflow:hidden!important}
@media (max-width:440px){.top .chip{display:none}}
@media (max-width:400px){.bande-aide{margin:2px 14px 8px;padding:9px 12px}.top{padding-left:14px;padding-right:14px;gap:6px}.top>.row:last-child{gap:4px!important}.top .aide{width:34px;height:34px}}
@supports (height:1dvh){.modal{max-height:92dvh}} /* la fenêtre tient dans la partie visible de l'écran, barre du navigateur comprise */
/* D-496 (14 octobre 2026) — l'armoire des artisans : une étagère par métier, un classeur par artisan (même dessin que « Mes contrats », D-452). */
/* D-526 (17 octobre 2026) — remarque d'un testeur : trois classeurs par ligne sur le téléphone, autant que la largeur le permet sur l'ordinateur.
   Un seul rayon par étagère, qui passe à la ligne tout seul ; chaque classeur porte son morceau de planche. */
.rayon{position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));align-items:end;column-gap:10px;row-gap:14px;padding:6px 4px 0}
.rayon .classeur{max-width:none;width:100%}
.rayon .classeur::before{content:"";position:absolute;left:-5px;right:-5px;bottom:36px;height:10px;background:#D8C8B2;box-shadow:0 3px 0 #EFE6D8;z-index:-1}

.classeur{flex:0 1 96px;min-width:0;max-width:96px;display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none;color:inherit;background:none;border:0;padding:0;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;position:relative;z-index:1}
.cl-dos{width:72px;height:132px;box-sizing:border-box;border-radius:6px 6px 3px 3px;background:var(--c,#5F7A6A);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:10px 0;box-shadow:inset -7px 0 0 rgba(47,52,57,.12)}
.cl-ico{width:34px;height:34px;border-radius:999px;background:#FFFDF9;display:inline-flex;align-items:center;justify-content:center;color:#2F3439}
.cl-ico svg{width:18px;height:18px}
.cl-nom{width:58px;box-sizing:border-box;background:#FFFDF9;border-radius:4px;padding:5px 2px;text-align:center;font-size:.72em;font-weight:700;line-height:1.1;color:#2F3439;overflow-wrap:anywhere;max-height:50px;overflow:hidden}
.cl-pt{width:12px;height:12px;border-radius:999px;background:#F6F3ED;border:2px solid rgba(47,52,57,.25)}
.cl-sous{height:34px;overflow:hidden;text-align:center;line-height:1.2;width:96px}
.cl-dos.trouver{background:none;border:2px dashed #B5B0A5;border-radius:8px;box-shadow:none;justify-content:center;gap:6px;color:var(--sauge-f);text-align:center;padding:6px;font-weight:700;font-size:.8em;line-height:1.2;width:96px}
.cl-dos.trouver svg{width:22px;height:22px}
.cl-actif{position:absolute;top:-4px;right:6px;background:var(--sauge-f);color:#fff;font-size:.65em;font-weight:700;border-radius:999px;padding:2px 7px}
.cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:4px 0 8px}
.cases .case{min-height:64px;border-radius:14px;background:#FFFDF9;border:1px solid #EFE6D8;padding:10px 12px;text-align:left;display:flex;flex-direction:column;justify-content:space-between;text-decoration:none;color:inherit;font:inherit;cursor:pointer}
.cercle-n{flex:0 0 26px;height:26px;border-radius:999px;background:var(--sauge-f);color:#fff;font-size:.85em;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.cercle-n.gris{background:#8A8F93}
.en-tete-pro{margin:-16px -18px 0;padding:18px 18px 16px;color:var(--encre-sur,#fff);display:flex;align-items:center;gap:14px;border-radius:0 0 18px 18px}
.en-tete-pro .cl-ico{width:48px;height:48px}.en-tete-pro .cl-ico svg{width:24px;height:24px}
