/* Maison Le Kinff — application des associés · v4
   Charte du site : Futura PT (Book / Medium), marine #060617 sur blanc, capitales espacées,
   angles droits, aplats, aucune ombre. Accent or réservé aux points d'attention. */
:root{
  --fond:#ffffff; --surface:#f4f4f7; --encre:#060617; --encre-2:#5c5d70; --encre-3:#8d8ea0; --trait:#e1e1e8;
  --or:#8a6a1f; --or-fond:#f7f1e1; --ok:#060617; --alerte:#8f4a3b; --info:#060617;
  --inverse:#ffffff; --bande:#000;
  --police:"Futura PT","Futura","Jost","Century Gothic",system-ui,sans-serif;
  --barre-h:64px; --marge:20px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root{
  --fond:#060617; --surface:#10112a; --encre:#f3f3f8; --encre-2:#a9aac0; --encre-3:#6f7090; --trait:#24253f;
  --or:#d8b862; --or-fond:#272111; --ok:#f3f3f8; --alerte:#df9f90; --info:#f3f3f8; --inverse:#060617; color-scheme:dark } }

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0}
html{-webkit-text-size-adjust:100%;touch-action:manipulation}
body{background:var(--fond);color:var(--encre);font-family:var(--police);font-weight:400;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;padding-top:env(safe-area-inset-top,0px)}
button,select,textarea,input{font:inherit;color:inherit;border-radius:0}
button{cursor:pointer}
a{color:inherit}
b,strong{font-weight:500}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--encre);outline-offset:2px}
@media (prefers-color-scheme: dark){ .logo,.connexion-logo{filter:invert(1)} }

.bande{display:none}
@media (min-width:900px){ .bande{display:block;position:fixed;inset:0 auto 0 0;width:44px;background:var(--bande)} }
.page{max-width:720px;margin:0 auto;padding:0 var(--marge) calc(var(--barre-h) + 40px + env(safe-area-inset-bottom,0px))}

/* ---------- Connexion (référence de la charte) ---------- */
.connexion{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px var(--marge)}
.connexion-boite{width:100%;max-width:380px;display:flex;flex-direction:column;gap:24px}
.connexion-logo{width:190px}
.connexion-intro{margin:0;text-transform:uppercase;letter-spacing:.2em;font-size:13px;color:var(--encre-2)}
.connexion form{display:flex;flex-direction:column;gap:12px}
.connexion label{font-size:15px;color:var(--encre-2)}
.connexion input{border:1px solid var(--trait);background:var(--surface);padding:14px 16px;font-size:17px;width:100%}
.connexion-msg{min-height:1.4em;margin:0;font-size:14px;color:var(--encre-2)}
.connexion-msg.erreur{color:var(--alerte)}
.lien{background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:3px;color:var(--encre-2);font-size:14px;align-self:flex-start}

/* ---------- En-tête ---------- */
header{position:sticky;top:0;z-index:5;background:var(--fond);display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:calc(14px + env(safe-area-inset-top,0px)) 0 12px;margin-top:calc(-1 * env(safe-area-inset-top,0px));border-bottom:1px solid var(--trait)}
.marque{display:flex;flex-direction:column;gap:6px}
.logo{height:32px;width:auto;display:block}
.marque small{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--encre-2)}
.outils{display:flex;gap:8px}
.rond{width:40px;height:40px;border:1px solid var(--trait);background:var(--fond);display:inline-flex;align-items:center;justify-content:center;padding:0;text-decoration:none;font-size:13px;font-weight:500;letter-spacing:.06em}
.rond svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.rond.jc{border-color:var(--encre)}
.rond.moi{background:var(--encre);color:var(--inverse);border-color:var(--encre)}
.rond:active{background:var(--surface)} .rond.moi:active{opacity:.8}
.installer{font-size:13.5px;line-height:1.5;padding:12px 14px;margin:14px 0 0;background:var(--surface);border-left:2px solid var(--encre)}
.installer .btn{margin-left:4px}
.etat{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--encre-3);padding:10px 0 0;letter-spacing:.02em}
#fraicheur.hors{color:var(--alerte)}
.bandeau{background:var(--surface);border-left:2px solid var(--alerte);font-size:14px;padding:12px 14px;margin:14px 0}

/* ---------- Titres (échelle de la charte, mobile) ---------- */
.titre-page{font-weight:500;text-transform:uppercase;font-size:28px;line-height:1.05;letter-spacing:.03em;margin:28px 0 4px}
.titre-page + .sous-titre{margin:0 0 4px;color:var(--encre-2);font-size:15px}
h2{font-weight:500;text-transform:uppercase;letter-spacing:.14em;font-size:13px;color:var(--encre);margin:40px 0 14px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
h2 span{letter-spacing:.02em;text-transform:none;font-weight:400;color:var(--encre-3);font-size:13px}
h2 .lien,h4 .lien{font-size:13px;text-transform:none;letter-spacing:.02em;color:var(--encre);text-decoration:underline;text-underline-offset:3px;font-weight:400}
h4{font-weight:500;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--encre-2);margin:32px 0 12px;display:flex;justify-content:space-between;align-items:baseline}
.sans-marge{margin-top:8px}
.aide{font-size:13.5px;line-height:1.55;color:var(--encre-2);margin:14px 0}
.vide{color:var(--encre-3);font-size:14.5px;padding:14px 0}
.erreur{color:var(--alerte);font-size:14px;padding:12px 0}
.lien.plus{display:inline-block;margin:16px 0 0;color:var(--encre)}

/* ---------- Étiquettes : contour fin, sans aplat coloré ---------- */
.puce{display:inline-block;font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;padding:3px 7px;border:1px solid currentColor;white-space:nowrap;line-height:1.3}
.p-ok{background:var(--encre);color:var(--inverse);border-color:var(--encre)}
.p-in{color:var(--encre)} .p-ne{color:var(--encre-3)} .p-or{color:var(--or)} .p-al{color:var(--alerte)}

/* ---------- Boutons ---------- */
.btn{border:1px solid var(--encre);background:transparent;color:var(--encre);padding:13px 18px;font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;text-decoration:none;display:inline-block;text-align:center;line-height:1.2}
.btn.plein{background:var(--encre);color:var(--inverse)}
.btn.doux{border-color:var(--trait);color:var(--encre-2)}
.btn.jules{border-color:var(--encre)}
.btn.petit{padding:8px 12px;font-size:11.5px}
.btn.bloc{display:block;width:100%;margin:16px 0}
.btn:active{opacity:.75}
.btn:disabled{opacity:.45;cursor:default}
.actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- Listes ---------- */
.liste{display:flex;flex-direction:column;gap:12px}
.ligne{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--trait);min-width:0}
.ligne:last-child{border-bottom:0}
.ligne.cliquable,.corps.cliquable{background:none;border-left:0;border-right:0;border-top:0;text-align:left;width:100%;color:inherit;text-decoration:none}
.corps.cliquable{border:0;padding:0;display:block}
.ligne.cliquable{align-items:center}
.ligne.cliquable:active{background:var(--surface)}
@media (hover:hover){ .ligne.cliquable:hover{background:var(--surface)} }
.corps{flex:1;min-width:0}
.corps b{display:block;font-weight:500;font-size:16px;line-height:1.35;overflow-wrap:anywhere}
.sous{color:var(--encre-2);font-size:13.5px;line-height:1.45}
.corps .sous{display:block;margin-top:4px}
.ligne.fait .corps b{text-decoration:line-through;color:var(--encre-3)}
.ligne input[type=checkbox]{appearance:none;-webkit-appearance:none;width:22px;height:22px;border:1.5px solid var(--encre);margin:1px 0 0;flex:none;display:grid;place-content:center;cursor:pointer;background:var(--fond)}
.ligne input[type=checkbox]::after{content:"";width:11px;height:6px;border-left:2px solid var(--inverse);border-bottom:2px solid var(--inverse);transform:rotate(-45deg) translate(1px,-1px);opacity:0}
.ligne input[type=checkbox]:checked{background:var(--encre)}
.ligne input[type=checkbox]:checked::after{opacity:1}
.ligne select{border:1px solid var(--trait);background-color:var(--fond);padding:6px 30px 6px 10px;font-size:13px;flex:none;max-width:128px}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23060617' stroke-width='1.4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:12px;padding-right:34px!important}
@media (prefers-color-scheme: dark){select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23f3f3f8' stroke-width='1.4'/%3E%3C/svg%3E")}}
.jour{width:42px;flex:none;text-align:center;font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--encre-2);line-height:1.2}
.jour b{display:block;font-size:24px;font-weight:500;color:var(--encre);letter-spacing:0;line-height:1.1;margin:2px 0}
.jour em{display:block;font-style:normal}
.droite{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.retard{color:var(--or)}
.absents{color:var(--encre-2)}
.avatar{width:32px;height:32px;border:1px solid var(--trait);display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;letter-spacing:.06em;flex:none}
.avatar.agent{border-color:var(--encre)}

/* ---------- À surveiller ---------- */
.alertes{border:1px solid var(--encre)}
.alerte{display:flex;gap:14px;align-items:center;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--trait);padding:14px 16px;color:var(--encre)}
.alerte:last-child{border-bottom:0}
.alerte:active{background:var(--surface)}
.alerte i{width:7px;height:7px;flex:none;background:var(--encre-3)}
.alerte.k-or i{background:var(--or)} .alerte.k-in i{background:var(--encre)}
.alerte .corps{display:flex;flex-direction:column;gap:2px}
.alerte .corps .sous{margin:0;font-size:10.5px;text-transform:uppercase;letter-spacing:.12em}
.alerte b{font-size:15.5px}
.alerte .fl{color:var(--encre-3);font-size:20px;line-height:1}

/* ---------- Cartes messages ---------- */
details.carte{border:1px solid var(--trait);border-left:2px solid var(--trait);display:block;min-width:0;background:var(--fond)}
details.carte.attente{border-left-color:var(--encre)}
details.carte.associe{border-left-color:var(--or)}
details.carte summary{list-style:none;cursor:pointer;padding:16px 44px 16px 16px;display:flex;flex-direction:column;gap:8px;position:relative}
details.carte summary::-webkit-details-marker{display:none}
details.carte summary::after{content:"";position:absolute;right:18px;top:22px;width:8px;height:8px;border-right:1.5px solid var(--encre-2);border-bottom:1.5px solid var(--encre-2);transform:rotate(45deg);transition:transform .15s}
details.carte[open] summary::after{transform:rotate(-135deg);top:26px}
.haut{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.titre{font-weight:500;font-size:16px;line-height:1.35;min-width:0;overflow-wrap:anywhere}
.meta{color:var(--encre-2);font-size:13.5px}
.volet{display:flex;flex-direction:column;gap:14px;padding:0 16px 18px}
.volet p{margin:0;font-size:15px;line-height:1.55;overflow-wrap:anywhere}
.brouillon{background:var(--surface);padding:14px 16px;font-size:14.5px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.brouillon .etiquette{display:block;font-size:10.5px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--encre-2);margin-bottom:8px}

/* ---------- Chiffres ---------- */
.chiffres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--trait)}
.chiffres div{padding:16px 12px;border-right:1px solid var(--trait);min-width:0}
.chiffres div:last-child{border-right:0}
.chiffres b{display:block;font-size:22px;font-weight:500;line-height:1.15;font-variant-numeric:tabular-nums;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chiffres span{display:block;font-size:11px;line-height:1.35;color:var(--encre-2);text-transform:uppercase;letter-spacing:.08em}
.chiffres.petit{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:20px}
.barres{display:flex;align-items:flex-end;gap:10px;height:170px;border-bottom:1px solid var(--encre);padding-top:20px}
.barre-col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;min-width:0;position:relative}
.barre-col .barre{width:62%;max-width:40px;background:var(--encre);display:block}
.barre-col:last-child .barre{background:var(--or)}
.barre-col .val{font-size:10.5px;color:var(--encre-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.barre-col .lib{position:absolute;bottom:-22px;font-size:10.5px;color:var(--encre-2);text-transform:uppercase;letter-spacing:.1em}
.barres + .aide{margin-top:34px}
.hbarre{display:grid;grid-template-columns:minmax(96px,34%) 1fr 28px;gap:12px;align-items:center;padding:8px 0;font-size:14.5px}
.hbarre .piste{height:6px;background:var(--surface)}
.hbarre .piste span{display:block;height:100%;background:var(--encre)}
.hbarre b{font-weight:500;text-align:right;font-variant-numeric:tabular-nums}

/* ---------- Filtres, segments, saisie ---------- */
.filtres{display:flex;gap:8px;margin:20px 0 14px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.filtres::-webkit-scrollbar{display:none}
.filtres button{flex:none;white-space:nowrap;border:1px solid var(--trait);background:none;padding:8px 14px;font-size:13px;color:var(--encre-2)}
.filtres button[aria-pressed="true"]{background:var(--encre);color:var(--inverse);border-color:var(--encre)}
.filtres .nb{opacity:.6;font-size:12px;margin-left:2px}
.segments{display:flex;border:1px solid var(--encre);margin:20px 0}
.segments button{flex:1;min-width:0;background:none;border:0;border-right:1px solid var(--encre);padding:11px 6px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--encre);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.segments button:last-child{border-right:0}
.segments button[aria-selected="true"]{background:var(--encre);color:var(--inverse)}
.entete-liste{display:flex;justify-content:space-between;align-items:center;gap:12px}
.entete-liste .segments{flex:1}
.ajout{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 4px}
.ajout input,.ajout select{border:1px solid var(--trait);background-color:var(--surface);padding:12px;min-width:0;font-size:16px}
.ajout input[type=text]{flex:1 1 100%}
.ajout select,.ajout input[type=date]{flex:1 1 30%}
.ajout .btn{flex:1 1 30%}
.ajout .ajouter .signe{display:none;font-size:26px;line-height:1}
@media (max-width:599px){.ajout select{flex:1 1 0}.ajout input[type=date]{flex:1 1 0}.ajout .ajouter{flex:0 0 54px;padding:0}.ajout .ajouter .mot{display:none}.ajout .ajouter .signe{display:block}}
.champ{width:100%;border:1px solid var(--trait);background:var(--surface);padding:12px 14px;font-size:16px;margin:16px 0 4px}
details.formulaire{margin:28px 0 0;border:1px solid var(--trait)}
details.formulaire summary{padding:14px 16px;cursor:pointer;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.12em}
.retour{background:none;border:0;padding:8px 0;margin-top:16px;color:var(--encre-2);font-size:13px;text-transform:uppercase;letter-spacing:.12em}
.menu-plus{margin-top:12px;border-top:1px solid var(--trait)}
.menu-plus .ligne{padding:18px 0}
.squelette{height:62px;margin:10px 0;background:var(--surface);animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.5}}

/* ---------- Agenda ---------- */
.navmois{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px}
.navmois b{font-weight:500;text-transform:uppercase;letter-spacing:.14em;font-size:14px}
.navmois button{border:1px solid var(--trait);background:none;width:44px;height:44px;font-size:18px}
.mois{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin-top:14px}
.mois .tete{text-align:center;text-transform:uppercase;letter-spacing:.1em;color:var(--encre-3);font-size:10px;padding:4px 0}
.case{position:relative;aspect-ratio:1/1.08;border:1px solid var(--trait);background:var(--fond);padding:5px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;min-width:0;overflow:hidden}
.case .num{font-size:13px;line-height:1;font-variant-numeric:tabular-nums}
.case .marques{display:flex;flex-direction:column;gap:2px;width:100%}
.case .marques i{display:block;height:4px;width:100%}
.case .abs{position:absolute;right:4px;bottom:3px;font-size:9px;letter-spacing:.04em;color:var(--encre-2);font-weight:500}
.case.passe{opacity:.4}
.case.auj{border:2px solid var(--encre)}
.case.auj .num{font-weight:500}
.case.choisi{background:var(--encre);color:var(--inverse);border-color:var(--encre)}
.case.choisi .abs{color:var(--inverse)}
.mois.dispo .case.passe{pointer-events:none}
.mois.dispo .case.moi-abs{border-color:var(--encre);background:repeating-linear-gradient(135deg,var(--fond) 0 5px,var(--trait) 5px 7px)}
.c-ok{background:var(--encre)} .c-in{background:var(--encre);opacity:.7} .c-or{background:var(--or)} .c-ne{background:var(--encre-3)} .c-al{background:var(--alerte)}
.c-site{background:transparent;border:1.5px solid var(--encre);height:5px!important}
.case.choisi .c-ok,.case.choisi .c-in{background:var(--inverse)}
.c-tache{background:transparent;border-top:1.5px dotted var(--encre-2);height:0!important}
.c-moi{border:1px solid var(--encre);background:repeating-linear-gradient(135deg,var(--fond) 0 3px,var(--trait) 3px 5px)}
.legende{display:flex;gap:10px 18px;flex-wrap:wrap;font-size:12px;color:var(--encre-2);margin:16px 0 4px}
.legende i{display:inline-block;width:16px;height:6px;margin-right:6px;vertical-align:middle}
.abs-ex{font-size:11px;font-weight:500;margin-right:4px;color:var(--encre)}

/* ---------- Barre d'onglets ---------- */
nav.barre{position:fixed;left:0;right:0;bottom:0;z-index:7;display:flex;justify-content:center;background:var(--fond);border-top:1px solid var(--encre);padding:0 8px env(safe-area-inset-bottom,0px)}
.barre button{position:relative;flex:1;max-width:120px;height:var(--barre-h);background:none;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--encre-3);padding:0}
.barre svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.barre span{font-size:9.5px;text-transform:uppercase;letter-spacing:.14em;font-weight:500}
.barre button[aria-selected="true"]{color:var(--encre)}
.barre button[aria-selected="true"]::before{content:"";position:absolute;top:-1px;left:22%;right:22%;height:3px;background:var(--encre)}
.barre .n{position:absolute;top:9px;left:calc(50% + 7px);min-width:16px;height:16px;padding:0 4px;background:var(--encre);color:var(--inverse);font-size:9.5px;font-style:normal;font-weight:500;line-height:16px;text-align:center}
@media (min-width:900px){ nav.barre{left:44px} }
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--barre-h) + 16px + env(safe-area-inset-bottom,0px));background:var(--encre);color:var(--inverse);padding:12px 18px;font-size:13.5px;z-index:20;max-width:min(90%,460px);animation:entre .18s ease-out}
@keyframes entre{from{opacity:0;transform:translate(-50%,6px)}}

/* ---------- Panneau (fiche) ---------- */
body.fige{overflow:hidden}
.voile{position:fixed;inset:0;background:rgba(6,6,23,.45);z-index:10;animation:fondu .18s ease-out}
@keyframes fondu{from{opacity:0}}
.panneau{position:fixed;left:0;right:0;bottom:0;z-index:11;background:var(--fond);max-height:93vh;max-height:93dvh;display:flex;flex-direction:column;border-top:1px solid var(--encre);max-width:720px;margin:0 auto;animation:monte .22s cubic-bezier(.2,.8,.2,1)}
@keyframes monte{from{transform:translateY(40px);opacity:0}}
@media (min-width:760px){ .panneau{top:5vh;bottom:auto;max-height:90vh;border:1px solid var(--encre)} }
.poignee{width:36px;height:3px;background:var(--trait);margin:8px auto 0}
.panneau-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px var(--marge) 14px;border-bottom:1px solid var(--trait)}
.panneau-tete h3{margin:6px 0 0;font-weight:500;font-size:20px;line-height:1.2;text-transform:uppercase;letter-spacing:.03em;min-width:0;overflow-wrap:anywhere}
.panneau-corps{overflow-y:auto;padding:20px var(--marge) calc(32px + env(safe-area-inset-bottom,0px));-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.panneau-corps > h4:first-child{margin-top:0}
.fiche-tete{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:15.5px}
.infos{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px}
.infos span{border:1px solid var(--trait);padding:5px 10px;font-size:13.5px}
.bandeau.doux{border-left-color:var(--or)}
.etapes{display:flex;flex-wrap:wrap;gap:6px}
.etapes button{border:1px solid var(--trait);background:none;padding:10px 12px;font-size:13px;color:var(--encre-2)}
.etapes button[aria-pressed="true"]{background:var(--encre);color:var(--inverse);border-color:var(--encre)}
.paiement{border-top:1px solid var(--trait);margin-bottom:16px}
.interrupteur{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--trait);font-size:15.5px;cursor:pointer}
.interrupteur span{order:-1}
.interrupteur input{appearance:none;-webkit-appearance:none;width:46px;height:26px;background:var(--trait);position:relative;margin:0;flex:none;cursor:pointer;transition:background .15s}
.interrupteur input::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:var(--fond);transition:transform .15s}
.interrupteur input:checked{background:var(--encre)}
.interrupteur input:checked::after{transform:translateX(20px)}
.checklist h5{margin:20px 0 6px;font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--encre-2)}
.coche{display:flex;gap:12px;align-items:flex-start;padding:10px 0;font-size:15.5px;line-height:1.4;cursor:pointer;border-bottom:1px solid var(--trait)}
.coche input{appearance:none;-webkit-appearance:none;width:20px;height:20px;border:1.5px solid var(--encre);margin:1px 0 0;flex:none;display:grid;place-content:center;background:var(--fond)}
.coche input::after{content:"";width:10px;height:5px;border-left:2px solid var(--inverse);border-bottom:2px solid var(--inverse);transform:rotate(-45deg) translate(1px,-1px);opacity:0}
.coche input:checked{background:var(--encre)} .coche input:checked::after{opacity:1}
.coche input:checked + span{color:var(--encre-3);text-decoration:line-through}
.compteur{font-size:12px;letter-spacing:.04em;color:var(--encre);font-weight:500}
.carte-client{border:1px solid var(--trait);padding:16px;display:flex;flex-direction:column;gap:12px}
.carte-client .ligne{padding:0;border:0}
.notes{white-space:pre-wrap;font-size:15px;line-height:1.55;margin:0;background:var(--surface);padding:14px 16px}
.panneau details.formulaire .grille{padding:4px 16px 16px}
.grille{display:grid;grid-template-columns:1fr 1fr;gap:16px 14px}
.champ-l{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--encre-2);min-width:0}
.champ-l input,.champ-l select,.champ-l textarea{border:1px solid var(--trait);background-color:var(--surface);padding:12px;font-size:16px;color:var(--encre);width:100%;min-width:0;text-transform:none;letter-spacing:0;font-weight:400}
.champ-l:has(textarea),.champ-l:first-child,.plein-l{grid-column:1/-1}
.grille .btn.plein{flex:1}
@media (max-width:380px){ .grille{grid-template-columns:1fr} }

/* ---------- Recherche ---------- */
.recherche{position:fixed;inset:0;z-index:12;background:var(--fond);overflow-y:auto;padding:0 var(--marge) calc(24px + env(safe-area-inset-bottom,0px));animation:fondu .15s ease-out}
.recherche-tete{position:sticky;top:0;background:var(--fond);display:flex;gap:14px;align-items:center;padding:calc(14px + env(safe-area-inset-top,0px)) 0 14px;border-bottom:1px solid var(--encre);max-width:720px;margin:0 auto}
.recherche-tete input{flex:1;border:1px solid var(--trait);background:var(--surface);padding:13px 14px;font-size:16px;min-width:0}
.recherche .liste{max-width:720px;margin:0 auto;gap:0}

/* Vue : apparition douce au changement d'onglet */
#vue.entre{animation:fondu .14s ease-out}
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation:none!important;transition:none!important} }
.marque{align-items:flex-start}
.actions .btn{flex:1 1 auto;padding:12px 14px;font-size:12px;letter-spacing:.08em}
.volet .actions{gap:8px}

/* ---------- v5 : bandeau d'installation, brief, réponse, chat, noms dans l'agenda ---------- */
.installer{background:var(--or-fond);border-left-color:var(--or)}
.brief{border:1px solid var(--encre);padding:16px;margin:24px 0 0;background:var(--fond)}
.brief-tete{display:flex;justify-content:space-between;align-items:center;gap:14px}
.brief-tete .sous{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;margin-bottom:4px}
.brief-tete b{font-weight:500;font-size:16px;line-height:1.3}
.brief-tete .btn{flex:none}
.brief details{margin-top:12px}
.brief summary{cursor:pointer;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--encre-2)}
.brief p{margin:10px 0 0;font-size:15px;line-height:1.6}
.secondaires{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:4px}
.secondaires .lien{font-size:13px}
textarea.reponse{width:100%;border:1px solid var(--trait);background:var(--surface);padding:14px;font-size:16px;line-height:1.55;resize:vertical;min-height:200px;margin-bottom:14px}
textarea.reponse.attente{opacity:.5}
.panneau .actions + .aide{margin-top:16px}
.panneau .secondaires{margin-top:20px;padding-top:16px;border-top:1px solid var(--trait)}
.chat{display:flex;flex-direction:column;gap:10px;min-height:120px;margin-bottom:16px}
.bulle{max-width:88%;padding:12px 14px;font-size:15px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.bulle.moi{align-self:flex-end;background:var(--encre);color:var(--inverse)}
.bulle.jules{align-self:flex-start;background:var(--surface)}
.bulle.attente{color:var(--encre-2);animation:pulse 1.2s ease-in-out infinite}
.suggestions{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.chat-saisie{display:flex;gap:8px;align-items:stretch;position:sticky;bottom:0;background:var(--fond);padding-top:8px}
.chat-saisie textarea{flex:1;border:1px solid var(--trait);background:var(--surface);padding:12px;font-size:16px;resize:none;min-width:0}
.case .nom{display:block;width:100%;font-size:9px;line-height:1.15;color:var(--encre-2);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.case.choisi .nom{color:var(--inverse)}
@media (min-width:600px){ .case .nom{font-size:10.5px} }
.case{aspect-ratio:auto;min-height:68px}
.case .abs{top:5px;bottom:auto}
.case .nom{margin-top:auto}
@media (min-width:600px){ .case{min-height:84px} }
.panneau[data-type="chat"]{height:88vh;height:88dvh}
.panneau[data-type="chat"] .panneau-corps{flex:1;display:flex;flex-direction:column}
.panneau[data-type="chat"] .chat{flex:1}
body.fige .toast{bottom:auto;top:calc(16px + env(safe-area-inset-top,0px));animation:none}
.notif-bloc{border:1px solid var(--trait);border-left:2px solid var(--encre);padding:14px 16px;margin:16px 0 0}
.notif-bloc p{margin:0 0 10px;font-size:14px;line-height:1.5;color:var(--encre-2)}
.notif-bloc p:last-child{margin:0}
.notif-bloc .actions{align-items:center}
.notif-bloc .actions .btn{flex:0 0 auto}

.carte.veille .score{letter-spacing:2px;color:var(--or);font-size:11px}
.carte.veille .volet .sous b{font-weight:500;color:var(--encre)}

.post{border:1px solid var(--trait);margin:16px 0}
.post canvas.visuel{display:block;width:100%;height:auto;background:var(--surface)}
.post-corps{padding:16px}
.post-corps .fiche-tete{margin-bottom:8px}
.post-texte{margin:12px 0}
.post-texte summary{cursor:pointer;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--encre-2)}
.post-texte p{white-space:pre-wrap;font-size:15px;line-height:1.55;margin:10px 0 0}
.post .actions{margin:12px 0}
.post details.formulaire{margin-top:12px}
.post details.formulaire .grille{padding:4px 16px 16px}
.carte.prospect .volet .sous b{font-weight:500;color:var(--encre)}

/* visite guidée */
#visite{position:fixed;inset:0;z-index:200}
#visite .v-trou{position:fixed;border-radius:4px;box-shadow:0 0 0 9999px rgba(6,6,23,.62);outline:2px solid #f2d26b;transition:all .25s ease;pointer-events:none}
#visite .v-bulle{position:fixed;width:min(320px,calc(100vw - 24px));background:var(--fond,#fff);color:var(--encre,#060617);padding:18px 18px 12px;border-radius:4px;box-shadow:0 12px 40px rgba(0,0,0,.25)}
#visite .v-bulle b{display:block;font-size:17px;letter-spacing:.06em;text-transform:uppercase;margin:4px 0 6px}
#visite .v-bulle p{margin:0 0 12px;line-height:1.5}
#visite .v-bulle .sous{font-size:12px;opacity:.6;letter-spacing:.08em}
#visite .v-bulle .actions{display:flex;justify-content:space-between;align-items:center;gap:12px}

/* statut d'une tâche : cases à cocher exclusives */
.coches-ligne{display:flex;flex-wrap:wrap;gap:0 22px;padding:2px 0}
.coches-ligne .coche{border-bottom:0;padding:8px 0;text-transform:none;letter-spacing:0;font-weight:400;color:var(--encre)}
.champ-l .coches-ligne input{width:20px;height:20px;padding:0;background:var(--fond)} .champ-l .coches-ligne input:checked{background:var(--encre)}
.coches-ligne .coche input:checked + span{color:var(--encre);text-decoration:none;font-weight:500}
.contrat-etat{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;color:var(--encre-2);margin-bottom:10px}
.lien.danger{color:#a33}