/* Cockpit Artisan — COMPOSANTS (re-skin L1). Les TOKENS (couleur/rayon/ombre/type/--ease/--dur/--mono)
   viennent désormais de skb-ui.tokens.css (socle) + skb-ui.artisan.css (thème « atelier »).
   Plus de bloc :root ici — retiré au lot L1. Ce fichier disparaît au lot L6. */

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
html{overflow-x:clip}   /* ceinture : le volet détail fermé (hors-écran droite) ne crée jamais de scroll horizontal (mobile Safari) */
body{font-family:var(--font-body);color:var(--ink);
  background:var(--surface-2);overflow:hidden;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}
button{font:inherit;cursor:pointer;color:inherit}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.01em}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:8px;border:2px solid var(--surface-2)}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}
.app{display:flex;height:100vh;height:100dvh}
.hidden{display:none!important}

/* Sidebar */
.side{width:266px;flex:none;background:var(--surface-2);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:12px;gap:4px;transition:width .22s var(--ease);overflow:hidden;position:relative}
.app.sb-collapsed .side{width:66px;padding:12px 9px}
.side-top{flex:none;display:flex;align-items:center;justify-content:space-between;padding:4px 4px 8px}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand .mark{width:30px;height:30px;flex:none;border-radius:8px;background:var(--brandgrad);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:#fff;box-shadow:0 4px 14px color-mix(in oklch,var(--primary) 45%,transparent)}
.brand .txt b{font-size:16px;letter-spacing:-.02em;white-space:nowrap}
.brand .txt small{display:block;color:var(--faint);font-size:11px;font-weight:500;margin-top:-2px;white-space:nowrap}
.iconbtn{width:32px;height:32px;flex:none;border-radius:8px;border:1px solid transparent;background:none;color:var(--muted);display:flex;align-items:center;justify-content:center;font-size:16px}
.iconbtn:hover{background:var(--bg);color:var(--ink)}
.app.sb-collapsed .side-top{flex-direction:column;gap:8px}
.app.sb-collapsed .brand .txt{display:none}
.i-expand{display:none}.app.sb-collapsed .i-collapse{display:none}.app.sb-collapsed .i-expand{display:inline}
/* Retouche 1 : la zone de nav défile, le pied (Aide + identité) reste collé en bas (fin de la troncature) */
.side-nav{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:2px;margin:0 -3px;padding:0 3px}
.side-nav::-webkit-scrollbar{width:6px}
/* Retouche 2 : groupes = accordéons (repliés par défaut sauf « Vues »), état persisté localStorage */
.sgroup-sec{display:flex;flex-direction:column}
.sgroup{display:flex;align-items:center;gap:6px;width:100%;background:none;border:none;text-align:left;font-family:inherit;cursor:pointer;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);font-weight:700;padding:14px 10px 6px;white-space:nowrap;transition:color .12s}
.sgroup:hover{color:var(--muted)}
.sgroup .sg-chev{margin-left:auto;font-size:10px;line-height:1;opacity:.75;transition:transform .15s var(--ease)}
.sgroup-sec.collapsed .sg-chev{transform:rotate(-90deg)}
.sgroup-items{display:flex;flex-direction:column;gap:4px}
.sgroup-sec.collapsed .sgroup-items{display:none}
.app.sb-collapsed .sgroup{justify-content:center;text-align:center;padding:12px 0 6px;font-size:9px;pointer-events:none}
.app.sb-collapsed .sg-chev{display:none}
.app.sb-collapsed .sgroup-sec.collapsed .sgroup-items{display:flex}   /* rail : icônes toujours visibles */
.navitem{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:var(--r-md);color:var(--muted);font-size:14px;font-weight:500;border:1px solid transparent;transition:.12s;width:100%;text-align:left;background:none;white-space:nowrap}
.navitem .ic{width:20px;flex:none;display:flex;align-items:center;justify-content:center}
.navitem .ic svg{width:18px;height:18px;stroke-linecap:round;stroke-linejoin:round}
.side-foot .nav-aide{margin-bottom:6px}
.navitem:hover{background:var(--bg);color:var(--ink)}
.navitem.active{background:var(--primary-weak);color:var(--primary-text);font-weight:600}
.navitem .count{margin-left:auto;font-size:11px;font-weight:700;color:var(--faint);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-pill);padding:1px 8px;min-width:22px;text-align:center}
.navitem.active .count{color:var(--primary-text);border-color:transparent;background:color-mix(in oklch,var(--primary) 16%,transparent)}
.navitem.warn .count{color:var(--danger-ink);background:var(--danger-weak);border-color:transparent}
.app.sb-collapsed .navitem{justify-content:center;padding:9px 0}
.app.sb-collapsed .navitem .lbl,.app.sb-collapsed .navitem .count{display:none}
.side-foot{flex:none;margin-top:auto;border-top:1px solid var(--line);padding-top:8px}
.foot-row{display:flex;align-items:center;gap:4px}
.foot-btn{display:flex;align-items:center;gap:11px;flex:1;min-width:0;padding:9px 10px;border-radius:var(--r-md);background:none;border:1px solid transparent;color:var(--muted);font-size:14px;font-weight:500;white-space:nowrap}
.foot-btn:hover{background:var(--bg);color:var(--ink)}
.foot-btn.ident{cursor:default}.foot-btn.ident:hover{background:none;color:var(--muted)}   /* identité non-cliquable (plus de lien Directus) */
.foot-btn .av{width:26px;height:26px;flex:none;border-radius:50%;background:var(--primary-weak);color:var(--primary-text);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;border:1px solid color-mix(in oklch,var(--primary) 30%,transparent)}
.foot-btn .who small{display:block;color:var(--faint);font-size:11px;font-weight:500}
.foot-gear{width:38px;height:38px;flex:none;border:1px solid transparent;background:none;color:var(--muted);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:15px}
.foot-gear:hover{background:var(--bg);color:var(--ink)}
.app.sb-collapsed .foot-btn .who{display:none}
.app.sb-collapsed .foot-row{flex-direction:column}

/* Workspace */
.workspace{flex:1;display:flex;min-width:0;position:relative}
.convo{flex:1;display:flex;flex-direction:column;min-width:0;position:relative;background:var(--glow),var(--bg)}
.mute-toggle.muted{opacity:.55}
/* ── Topbar (chrome unifié : titre/sous-titre + actions + cloche + jour/nuit ; fin du chevauchement) ── */
.topbar{flex:0 0 auto;display:flex;align-items:center;gap:14px;padding:11px 22px;border-bottom:1px solid var(--line);background:var(--surface-2);position:sticky;top:0;z-index:30}
.tb-menu{display:none;width:40px;height:40px;flex:none;border:none;background:none;color:var(--ink);font-size:20px;border-radius:9px}
.tb-menu:hover{background:var(--bg)}
.tb-titles{min-width:0;flex:1}
.topbar .word{font-family:var(--font-display);font-size:22px;font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .sub{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.tb-acts{display:flex;align-items:center;gap:8px;flex:none}
.tb-icon{width:38px;height:38px;flex:none;border-radius:10px;border:1px solid var(--line-strong);background:var(--bg);color:var(--ink);display:flex;align-items:center;justify-content:center;font-size:16px;transition:border-color .12s}
.tb-icon:hover{border-color:var(--primary)}
.topbar .newlead{display:inline-flex;align-items:center;gap:6px}
.nav-aide{margin-top:4px}
/* flash visuel (signal de réception / validation) — overlay non bloquant */
#flash{position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:0}
body.flash-s #flash{animation:flpulse .8s ease;box-shadow:inset 0 0 0 5px var(--success-ink)}
body.flash-a #flash{animation:flpulse .9s ease;box-shadow:inset 0 0 0 6px var(--accent-ink)}
@keyframes flpulse{0%{opacity:0}12%{opacity:.85}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){body.flash-s #flash,body.flash-a #flash{animation:none}}
.scroll{flex:1;overflow-y:auto}
.board{max-width:1080px;margin:0 auto;padding:30px 30px 60px}
.alert{display:flex;align-items:center;gap:13px;margin-top:20px;background:var(--danger-weak);border:1px solid color-mix(in oklch,var(--danger) 30%,transparent);border-radius:var(--r-lg);padding:13px 16px}
.alert .aic{font-size:20px;flex:none}
.alert .atx{flex:1;min-width:0;font-size:13.5px;line-height:1.45}
.alert .atx b{color:var(--danger-ink);font-weight:700}
.alert .atx small{display:block;color:var(--muted);font-size:12px;margin-top:1px}
.alert .abtn2{font-size:12.5px;font-weight:600;color:var(--danger-ink);background:var(--bg);border:1px solid color-mix(in oklch,var(--danger) 35%,transparent);border-radius:var(--r-sm);padding:7px 11px;white-space:nowrap}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.kpi{position:relative;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;box-shadow:var(--sh-1);appearance:none;font:inherit;text-align:left;width:100%;cursor:pointer;transition:border-color .12s,box-shadow .12s}
.kpi:hover{border-color:var(--primary);box-shadow:var(--sh-2)}
.kpi:active{transform:translateY(1px)}
.kpi .n{font-size:26px;font-weight:700;letter-spacing:-.02em}
.kpi .l{font-size:12.5px;color:var(--muted);margin-top:2px}
.kpi.k-demandes .n{color:var(--accent-ink)} .kpi.k-confirm .n{color:var(--accent-ink)} .kpi.k-live .n{color:var(--warn-ink)} .kpi.k-areassigner .n{color:var(--danger-ink)}   /* L4 : KPI = couleur de son statut (forêt/forêt/ambre/terracotta=refusé) */
.kpi.is-zero .n{color:var(--faint)}   /* L4 : un 0 ne crie pas — chiffre neutre atténué */
.kpi::after{content:'›';position:absolute;top:11px;right:13px;color:var(--faint);font-size:17px;line-height:1;opacity:0;transition:opacity .12s}   /* affordance : tuile cliquable */
.kpi:hover::after{opacity:1}
.stsec{margin-top:26px}
.stsec .sh{display:flex;align-items:center;gap:9px;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--faint);padding:6px 2px 10px;width:100%;appearance:none;background:none;border:none;cursor:pointer;font-family:inherit}
.stsec .sh:hover{color:var(--muted)}
.stsec .sh .dot{width:8px;height:8px;border-radius:50%;flex:none}
.stsec .sh .c{color:var(--faint);font-weight:600}
.stsec .sh .sh-chev{margin-left:auto;font-size:11px;transition:transform .15s;color:var(--faint)}
.stsec.collapsed .sh .sh-chev{transform:rotate(-90deg)}
.stsec.collapsed .grid{display:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,1fr));gap:12px}
.card{text-align:left;background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);padding:15px 16px;transition:.15s;box-shadow:var(--sh-1);position:relative;display:flex;flex-direction:column;gap:9px}
.card:hover{transform:translateY(-2px);border-color:var(--primary);box-shadow:var(--sh-2)}
.card .top{display:flex;align-items:center;gap:8px}
.card .ref{font-family:var(--mono);font-size:11.5px;color:var(--faint);font-weight:600}
.card .badge{margin-left:auto;font-size:10.5px;font-weight:700;border-radius:var(--r-pill);padding:2px 9px;white-space:nowrap}
.b-urgent{background:var(--accent-weak);color:var(--accent-ink)}
.b-normal{background:var(--surface-2);color:var(--muted)}
.b-etage{background:var(--primary-weak);color:var(--primary-text)}   /* chip étage (métier peinture, remplace le badge urgence) */
.b-etat{background:var(--primary-weak);color:var(--primary-text)}    /* état du support connu (docs/55 §3) — même famille que b-etage */
.b-etat.unset{background:var(--surface-2);color:var(--muted)}        /* état à confirmer — neutre/muet */
.c-etat{font-size:12px;color:var(--faint);display:flex;align-items:center;gap:4px}   /* marqueur d'état sur la carte (liste) */
.card .cli{font-size:15px;font-weight:600;letter-spacing:-.01em}
.card .desc{font-size:13px;color:var(--muted);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .meta{display:flex;align-items:center;gap:8px;margin-top:2px;padding-top:10px;border-top:1px dashed var(--line)}
.card .loc{font-size:12px;color:var(--faint);display:flex;align-items:center;gap:4px}
.card .who2{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-soft);font-weight:500}
.card .who2 .av{width:22px;height:22px;border-radius:50%;background:var(--primary-weak);color:var(--primary-text);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex:none}
.card .when{font-size:12px;color:var(--muted)}
.card.confirm{border-left:3px solid var(--warn-ink)}

/* ── L2 desktop : onglets de filtre + tableau dense ── */
.tabs{display:flex;gap:6px;margin:18px 0 14px;flex-wrap:wrap}
.tab{font-size:13px;font-weight:600;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-pill);padding:7px 14px;display:inline-flex;align-items:center;gap:7px;transition:.12s}
.tab:hover{border-color:var(--line-strong);color:var(--ink)}
.tab.on{background:var(--primary);border-color:transparent;color:var(--primary-ink)}
.tab .tcount{font-size:11px;font-weight:700;background:color-mix(in oklch,var(--muted) 20%,transparent);border-radius:var(--r-pill);padding:0 6px;min-width:18px;text-align:center}
.tab.on .tcount{background:color-mix(in oklch,#fff 32%,transparent)}
.tbl-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);box-shadow:var(--sh-1)}
.tbl{min-width:720px;display:flex;flex-direction:column}
.row{display:grid;grid-template-columns:150px minmax(0,1fr) 190px 128px 128px;align-items:center;gap:14px;padding:12px 18px;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);width:100%;transition:background .12s}
.row:last-child{border-bottom:none}
.row:not(.rhead):hover{background:var(--surface-2)}
.row.rhead{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:700;background:var(--surface-2)}
.row.on,.row.on:hover{background:var(--primary-weak)}
.r-ref{font-family:var(--mono);font-size:12px;color:var(--muted);font-weight:600}
.r-ch{min-width:0}
.r-ch b{font-size:14px;font-weight:600;letter-spacing:-.01em;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.r-ch small{font-size:12px;color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.r-art{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-soft);min-width:0}
.r-av{width:24px;height:24px;flex:none;border-radius:50%;background:var(--success-weak);color:var(--success-ink);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700}
.r-an{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.r-un{color:var(--faint);font-style:italic;font-size:12px}
.r-st{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-soft);font-weight:600}
.r-st .dot{width:8px;height:8px;border-radius:50%;flex:none}
.r-date{font-size:12px;color:var(--muted);white-space:nowrap}

/* Volet détail (écran scindé) */
.artpane{width:0;flex:none;overflow:hidden;background:var(--surface-2);border-left:1px solid var(--line);display:flex;flex-direction:column;transition:width .24s var(--ease)}
.app.split .artpane{width:min(46%,520px)}
.artpane-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--bg);flex:none}
.artpane-head .dot{width:9px;height:9px;flex:none;border-radius:50%}
.artpane-head b{font-family:var(--mono);font-size:13px}
.artpane-head .grow{flex:1}
.abtn{font-size:12.5px;color:var(--muted);background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:6px 10px;white-space:nowrap;font-weight:600}
.abtn:hover{color:var(--ink);border-color:var(--muted)}
.artpane-body{flex:1;overflow-y:auto;padding:20px}
.d-cli{font-size:20px;font-weight:700;letter-spacing:-.01em}
.d-badges{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
.pill{font-size:11px;font-weight:700;border-radius:var(--r-pill);padding:3px 10px}
.d-block{margin-top:20px}
.d-block .t{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:700;margin-bottom:9px}
.d-row{display:flex;gap:10px;font-size:13.5px;padding:6px 0;border-bottom:1px solid var(--line)}
.d-row .k{color:var(--muted);width:120px;flex:none}
.d-row .v{color:var(--ink);font-weight:500}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.photos .ph{aspect-ratio:1;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:22px;color:var(--faint)}
.ph-img{position:relative;display:block;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);aspect-ratio:1}
.ph-img img{width:100%;height:100%;object-fit:cover;display:block;background:var(--surface)}
.ph-img .ph-lab{position:absolute;left:0;right:0;bottom:0;font-size:10px;font-weight:700;color:#fff;background:rgba(0,0,0,.52);padding:2px 6px}
.ph-empty{color:var(--faint);font-size:13px}

/* Temps sur place (somme des paires arrivée→départ pointées sur le terrain) — tokens only, aucune couleur en dur */
.tps-total{font-family:var(--font-display);font-size:26px;font-weight:600;color:var(--ink);line-height:1.1;display:flex;align-items:baseline;gap:9px}
.tps-live{font-family:var(--font-body);font-size:12px;font-weight:600;color:var(--success-ink);background:var(--success-weak);border-radius:var(--r-pill);padding:2px 8px}
.tps-list{margin-top:10px}
.tps-row{display:flex;gap:10px;font-size:13px;padding:5px 0;border-bottom:1px solid var(--line)}
.tps-row .k{color:var(--muted);width:52px;flex:none}
.tps-row .v{color:var(--ink);font-variant-numeric:tabular-nums}
.tps-row .d{margin-left:auto;color:var(--muted);font-variant-numeric:tabular-nums}
.tps-row.is-open .d{color:var(--success-ink);font-weight:600}
.tps-warn{margin-top:9px;font-size:12.5px;color:var(--warn-ink);background:var(--warn-weak);border-radius:var(--r-sm);padding:6px 9px}
.mrow .opt{color:var(--faint);font-weight:400;font-size:11px}
.mrow input[type=file]{font-size:13px;color:var(--muted)}
.d-actions{position:sticky;bottom:0;background:linear-gradient(180deg,transparent,var(--surface-2) 30%);padding:16px 0 0;margin-top:24px;display:flex;flex-direction:column;gap:9px}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;border-radius:var(--r-md);font-size:14px;font-weight:600;border:1px solid var(--line-strong);background:var(--bg);color:var(--ink);transition:.15s}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--primary);border-color:transparent;color:var(--primary-ink)}
.btn.primary:hover{background:var(--primary-hover)}
.btn.ghost{background:var(--surface-2)}   /* fond subtil : un bouton secondaire lisible (pas « fantôme ») */
.btn.danger{color:var(--danger-ink)}
/* utilitaires audit UX : label masqué (a11y login #15), indice de saisie (#13), carte non assignée (#11) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mhint{font-size:12.5px;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:8px 11px;margin-bottom:12px}
.mhint b{color:var(--ink)}
.who2.unassigned{color:var(--muted);font-style:italic;font-size:12px}
.btn.danger:hover{border-color:var(--danger-ink)}
.btn[disabled]{opacity:.55;cursor:default}

/* Négociation lead */
.reassign-note{background:var(--danger-weak);color:var(--danger-ink);border:1px solid color-mix(in oklch,var(--danger) 28%,transparent);border-radius:var(--r-sm);padding:8px 11px;font-size:12.5px;font-weight:600;margin-bottom:10px;line-height:1.4}
.reassign-note b{font-weight:800}
.lead-notes{width:100%;min-height:82px;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:10px 12px;font:inherit;font-size:13.5px;line-height:1.5;resize:vertical;outline:none}
.lead-notes:focus{border-color:var(--primary)}
.lead-budget{display:flex;align-items:center;gap:10px;margin:10px 0}
.lead-budget label{font-size:12.5px;color:var(--muted);flex:none}
.lead-budget input{flex:1;min-width:0;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:9px 12px;font:inherit;font-size:14px;outline:none}
.lead-budget input:focus{border-color:var(--primary)}
.lead-etat select{flex:1;min-width:0;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:9px 12px;font:inherit;font-size:14px;outline:none;appearance:none;cursor:pointer}
.lead-etat select:focus{border-color:var(--primary)}
.assign-lbl{font-size:12px;font-weight:600;color:var(--muted);margin-bottom:-3px}
.assign-row{position:relative}
.assign-row select{width:100%;background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:11px 34px 11px 12px;font:inherit;font-size:14px;outline:none;appearance:none;cursor:pointer}
.assign-row select:focus{border-color:var(--primary)}
.assign-row::after{content:'▾';position:absolute;right:13px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:11px;pointer-events:none}
.lead-lose{align-self:center;background:none;border:none;color:var(--danger-ink);text-decoration:underline;font:inherit;font-size:12.5px;padding:6px;cursor:pointer;margin-top:2px}
.lead-lose:hover{color:var(--danger)}
.lead-date{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--muted)}
.lead-date input{background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:8px 10px;font:inherit;font-size:13.5px;outline:none}
.lead-date input:focus{border-color:var(--primary)}
/* ── Calendrier — look natif (Google / iOS Calendar) ── */
.cal-head{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.cal-nav{width:34px;height:34px;flex:none;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:none;border:1px solid var(--line);color:var(--ink);font-size:17px;line-height:1;cursor:pointer;padding:0}
.cal-nav:hover{background:var(--surface-2);border-color:var(--line-strong)}
.cal-title{font-size:20px;font-weight:600;letter-spacing:-.01em;text-transform:capitalize;margin-left:4px;white-space:nowrap}
.cal-today-btn{margin-left:auto;flex:0 0 auto;width:auto;padding:8px 16px;white-space:nowrap}
.cal-frame{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg)}
.cal-grid7{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));width:100%}
.cal-dow{border-bottom:1px solid var(--line)}
.cal-dowh{font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--faint);text-align:center;padding:9px 0}
.cal-cell{min-height:104px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px 6px 8px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.cal-cell:nth-child(7n){border-right:none}
.cal-grid7:last-child .cal-cell:nth-last-child(-n+7){border-bottom:none}
.cal-wknd{background:color-mix(in oklch,var(--ink) 3%,transparent)}
.cal-out{background:color-mix(in oklch,var(--ink) 1.5%,transparent)}
.cal-out .cal-dnum{opacity:.4}
.cal-dnum{font-size:12.5px;font-weight:500;color:var(--ink-soft);width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.cal-today-n{background:var(--primary);color:#fff;border-radius:50%;font-weight:700}
.cal-evs{display:flex;flex-direction:column;gap:2px;overflow:hidden}
.cal-ev{display:block;width:100%;text-align:left;background:var(--evc);color:#fff;border:none;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:500;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.cal-ev:hover{filter:brightness(1.1)}
.cal-more{font-size:10.5px;color:var(--faint);padding:1px 5px}
@media(max-width:820px){
  .cal-cell{min-height:58px;padding:4px 3px}
  .cal-dnum{width:20px;height:20px;font-size:11px}
  .cal-dowh{font-size:9px;padding:6px 0}
  .cal-title{font-size:17px}
  .cal-evs{flex-direction:row;flex-wrap:wrap;gap:3px;justify-content:center;margin-top:1px}
  .cal-ev{font-size:0;width:6px;height:6px;padding:0;border-radius:50%}   /* mobile : pastilles (iOS) au lieu de chips tronqués */
  .cal-more{display:none}
}
.navitem.lead .count{color:var(--accent-ink);background:var(--accent-weak);border-color:transparent}

/* Cartes Artisans */
.acard{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);padding:15px 16px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:10px}
.acard .atop{display:flex;align-items:center;gap:11px}
.acard .aav{width:38px;height:38px;flex:none;border-radius:50%;background:var(--primary-weak);color:var(--primary-text);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;border:1px solid color-mix(in oklch,var(--primary) 30%,transparent)}
.acard .ainfo{flex:1;min-width:0}
.acard .ainfo b{font-size:15px;letter-spacing:-.01em;display:block}
.acard .ainfo small{font-size:12px;color:var(--faint)}
.acard .astat{font-size:10.5px;font-weight:700;border-radius:var(--r-pill);padding:2px 9px;white-space:nowrap}
.acard .astat.ok{background:var(--success-weak);color:var(--success-ink)}
.acard .astat.none{background:var(--surface-2);color:var(--muted)}
.acard .ameta{font-size:12px;color:var(--muted);border-top:1px dashed var(--line);padding-top:9px}
.aacts{display:flex;gap:8px;flex-wrap:wrap}
.aacts .btn{width:auto;flex:1 1 auto;padding:10px 12px;font-size:13px}
/* Badge conformité */
.aconf{font-size:12px;font-weight:600;border-radius:var(--r-sm);padding:6px 10px;display:inline-block}
.aconf.ok{background:var(--success-weak);color:var(--success-ink)}
.aconf.soon{background:var(--warn-weak);color:var(--warn-ink)}
.aconf.exp{background:var(--danger-weak);color:var(--danger-ink)}
.aconf.none{background:var(--surface-2);color:var(--muted)}
/* Conformité + RGE sur une même ligne */
.aconf-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* Badge RGE (open data ADEME) — statut jamais inventé (rge / non rge / siren manquant / à vérifier) */
.arge{font-size:11.5px;font-weight:600;border-radius:var(--r-sm);padding:6px 10px;display:inline-block;white-space:nowrap}
.arge.ok{background:var(--success-weak);color:var(--success-ink)}
.arge.no{background:var(--surface-2);color:var(--muted)}
.arge.unk{background:var(--surface-2);color:var(--muted);border:1px dashed var(--line)}
.arge.pending{background:var(--surface-2);color:var(--faint)}
.mcheck{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--ink-soft);margin:4px 0 8px;cursor:pointer}
.mcheck input{width:16px;height:16px;flex:none;accent-color:var(--primary)}
/* Sinistre / dossier assurance (docs/61) : coche + champs révélés, groupés visuellement (bordure gauche « alerte »). */
.sini-toggle{font-weight:600;color:var(--ink)}
.sini-fields{border-left:2px solid var(--warn-ink);padding-left:11px;margin:0 0 11px}

/* Bouton + Nouvelle demande (en-tête) */
.newlead{font-size:12.5px;font-weight:600;color:var(--primary-ink);background:var(--primary);border:1px solid transparent;border-radius:var(--r-sm);padding:8px 13px;white-space:nowrap}
.newlead:hover{background:var(--primary-hover)}

/* Modale (nouvelle demande) */
.modal{position:fixed;inset:0;z-index:110;display:flex;align-items:center;justify-content:center;background:var(--overlay);padding:20px;overflow-y:auto}
.modal-card{width:100%;max-width:450px;background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:var(--sh-2);padding:20px 22px;margin:auto}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.modal-head b{font-size:17px;letter-spacing:-.01em}
.mrow{margin-bottom:11px}
.mrow label{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-bottom:5px}
.mrow input,.mrow select,.mrow textarea{width:100%;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:10px 12px;font:inherit;font-size:14px;outline:none}
.mrow input:focus,.mrow select:focus,.mrow textarea:focus{border-color:var(--primary)}
.mrow textarea{min-height:62px;resize:vertical}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.modal-err{color:var(--danger-ink);font-size:12.5px;min-height:16px;margin:2px 0 8px}
.modal-acts{display:flex;gap:10px;margin-top:4px}
.modal-acts .btn{width:auto;flex:1}

/* Login (overlay plein écran, façon Hub) */
.login{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:var(--glow),var(--surface-2);padding:24px}
.login-card{width:100%;max-width:360px;background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:var(--sh-2);padding:28px 26px;text-align:center}
.login-card .mark{width:44px;height:44px;margin:0 auto 14px;border-radius:12px;background:var(--brandgrad);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 6px 20px color-mix(in oklch,var(--primary) 45%,transparent)}
.login-card h1{font-size:19px;letter-spacing:-.01em}
.login-card p{color:var(--muted);font-size:13px;margin-top:6px}
.login-card input{width:100%;margin-top:18px;background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--r-md);color:var(--ink);padding:12px 14px;font-size:15px;outline:none}
.login-card input:focus{border-color:var(--primary)}
.login-card .btn{margin-top:12px}
.login-card .err{color:var(--danger-ink);font-size:12.5px;margin-top:10px;min-height:16px}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:var(--r-md);font-size:13.5px;font-weight:600;opacity:0;transition:.25s;box-shadow:var(--sh-2);z-index:120}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:var(--danger);color:#fff}
.scrim{display:none}
.bottom-nav{display:none}   /* footer de navigation mobile — visible < 1024px (cf. media query) */

/* Écran scindé (desktop, audit UX #6) : volet détail ouvert → sidebar en rail + board 1 colonne = plus de troncature de cartes/labels. */
@media(min-width:1024px){
  .app.split .side{width:64px;padding:12px 8px}
  .app.split .brand .txt,.app.split .navitem .lbl,.app.split .navitem .count,.app.split .foot-btn .who,.app.split .sgroup{display:none}
  .app.split .side-top{flex-direction:column;gap:8px}
  .app.split .navitem,.app.split .foot-btn{justify-content:center;padding:9px 0}
  .app.split .sgroup-sec.collapsed .sgroup-items{display:flex}   /* rail détail : icônes toujours visibles */
  .app.split .foot-row{flex-direction:column;gap:4px}
  .app.split #sections .grid{grid-template-columns:1fr}
  .app.split .board{padding:24px 22px 50px}
}
@media(max-width:1023px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  /* Topbar mobile : le sous-titre était tronqué (nowrap+ellipsis dans une barre à hauteur fixe).
     On passe .tb-titles en display:contents (→ .word et .sub deviennent enfants directs de la topbar),
     la topbar wrappe, et .sub descend en PLEINE LARGEUR sous la barre où il peut s'afficher en entier. */
  .tb-menu{display:flex;order:0}
  .topbar{padding:9px 12px;gap:6px 10px;flex-wrap:wrap}
  .tb-titles{display:contents}
  .topbar .word{font-size:18px;flex:1 1 auto;min-width:0;order:1}
  .tb-acts{order:2}
  .topbar .sub{order:3;flex-basis:100%;white-space:normal;overflow:visible;text-overflow:clip;margin-top:0;line-height:1.3}
  .topbar .sub:empty{display:none}   /* vues sans sous-titre : pas de 2e ligne vide */
  #refreshBtn{display:none}   /* mobile : le polling 30 s suffit, plus de bouton concurrent */
  .newlead .nl-lbl{display:none}.topbar .newlead{padding:0;width:38px;height:38px;justify-content:center;border-radius:10px}
  /* Footer de navigation (façon app mobile) : 5 vues, cibles ≥48px, safe-area iOS */
  .bottom-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface-2);border-top:1px solid var(--line);padding:6px 2px calc(6px + env(safe-area-inset-bottom));gap:2px}
  .bn-item{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px 2px;min-height:50px;background:none;border:none;color:var(--muted);font-size:10.5px;font-weight:600;border-radius:10px;position:relative}
  .bn-item svg{width:22px;height:22px;stroke-linecap:round;stroke-linejoin:round}
  .bn-item.on{color:var(--primary-text)}
  .bn-count{position:absolute;top:2px;left:calc(50% + 5px);background:var(--accent);color:#fff;font-size:9px;font-weight:700;min-width:15px;height:15px;line-height:15px;border-radius:999px;padding:0 4px;text-align:center}
  .scroll{padding-bottom:66px;overflow-x:hidden}
  .kpi{min-width:0}.kpi .l{overflow-wrap:anywhere}   /* les tuiles rétrécissent, plus de débordement */
  .alert{flex-wrap:wrap}.alert .abtn2{margin-left:auto}   /* le bouton passe à la ligne si besoin */
  .grid{grid-template-columns:1fr}   /* cartes en 1 colonne (le minmax 288px forçait un débordement) */
  .board,.scroll,.convo,.workspace{max-width:100%;min-width:0}
  .side{position:fixed;top:0;left:0;height:100%;width:min(86vw,320px);transform:translateX(-100%);transition:transform .22s var(--ease);z-index:70;box-shadow:var(--sh-2)}
  .app.sidebar-open .side{transform:none}
  .scrim{position:fixed;inset:0;background:var(--overlay);z-index:65}.app.sidebar-open .scrim{display:block}
  .board{padding:20px 16px 50px}
  .artpane{position:fixed;inset:0;width:100%!important;transform:translateX(100%);transition:transform .22s var(--ease);z-index:80;border-left:none}
  .app.split .artpane{transform:none;width:100%!important}
}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}

/* ── vue Devis (Lot 3-A4) : tableau dédié (7 colonnes), défile dans .tbl-scroll sur petit écran ── */
.tbl-devis{min-width:880px}
.row-devis{grid-template-columns:130px minmax(0,1fr) 140px 112px 122px 148px 86px}
.row-devis .r-eur{font-size:13px;font-weight:700;white-space:nowrap}
.row-devis .abtn{cursor:pointer}

/* ── vue Prospection (AO, morceau Lot 5) : motif du gate juridique visible sous les actions ── */
.gate-note{font-size:11.5px;color:var(--muted);background:var(--surface-2);border-radius:var(--r-sm);padding:6px 9px;margin-top:2px;line-height:1.45}

/* ── Gamme / finition (docs/58) ──────────────────────────────────────────────── */
/* Pastille de gamme (fiche) — famille neutre, distincte de l'état (b-etat teinté primary). */
.b-gamme{background:var(--surface);color:var(--ink-soft);border:1px solid var(--line)}
/* Négociation : état + gamme côte à côte (desktop), empilés sur mobile. Densité raisonnable. */
.lead-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lead-2col .lead-budget{margin:10px 0 0}
/* Mini-grille tarifs de référence (repliable) — chiffres bakés, annonce téléphone. */
.tarif-grille{margin:12px 0 4px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2);overflow:hidden}
.tarif-grille>summary{cursor:pointer;list-style:none;padding:10px 12px;font-size:12.5px;font-weight:700;color:var(--ink);user-select:none}
.tarif-grille>summary::-webkit-details-marker{display:none}
.tarif-grille>summary::before{content:'▸';margin-right:7px;color:var(--muted);font-size:11px}
.tarif-grille[open]>summary::before{content:'▾'}
.tarif-grille>summary:focus-visible{outline:2px solid var(--primary);outline-offset:-2px;border-radius:var(--r-sm)}
.tg-hint{font-weight:500;color:var(--muted)}
.tg-row{display:grid;grid-template-columns:1.3fr 1fr 1.5fr;gap:8px;padding:6px 12px;font-size:12.5px;border-top:1px solid var(--line);align-items:baseline}
.tg-row.tg-head{color:var(--faint);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10.5px}
.tg-g{color:var(--ink);font-weight:600}
.tg-e{color:var(--muted)}
.tg-p{color:var(--ink-soft);text-align:right;font-variant-numeric:tabular-nums}
.tg-row.tg-hit{background:var(--primary-weak)}
.tg-row.tg-autre .tg-g{font-weight:500;color:var(--ink-soft)}
.tg-devis{color:var(--muted);font-style:italic}
.tg-foot{padding:8px 12px;font-size:11px;color:var(--faint);border-top:1px solid var(--line)}
@media (max-width:520px){ .lead-2col{grid-template-columns:1fr} }

/* ── Sinistre / dossier assurance (docs/61) ────────────────────────────────────
   Badge 🚨 en liste (.badge) + fiche (.pill) : accent « attention » ambre, DISTINCT du
   terracotta « à réassigner ». Fail-open : rendu seulement si le lead est un sinistre. */
.b-sinistre{background:var(--warn-weak);color:var(--warn-ink);border:1px solid color-mix(in oklch,var(--warn-ink) 28%,transparent)}
/* Encadré repliable « Dossier assurance » (fiche) — même famille que la grille tarifs. */
.dossier-assurance{margin-top:20px;border:1px solid color-mix(in oklch,var(--warn-ink) 32%,transparent);border-radius:var(--r-md);background:var(--warn-weak);overflow:hidden}
.dossier-assurance>summary{cursor:pointer;list-style:none;padding:11px 13px;font-size:13px;font-weight:700;color:var(--warn-ink);user-select:none}
.dossier-assurance>summary::-webkit-details-marker{display:none}
.dossier-assurance>summary::before{content:'▸';margin-right:7px;font-size:11px}
.dossier-assurance[open]>summary::before{content:'▾'}
.dossier-assurance>summary:focus-visible{outline:2px solid var(--primary);outline-offset:-2px;border-radius:var(--r-sm)}
.dossier-assurance .ds-fields{padding:2px 13px 6px;background:var(--bg)}
.dossier-assurance .ds-fields .d-row:last-child{border-bottom:none}
.ds-list{padding:8px 13px;background:var(--bg);border-top:1px solid var(--line)}
.ds-row{display:flex;align-items:center;gap:9px;font-size:13px;padding:4px 0;color:var(--ink-soft)}
.ds-ok{color:var(--success-ink);font-weight:800}
.ds-no{color:var(--faint);font-weight:800}
.ds-delai{padding:8px 13px;font-size:12.5px;color:var(--warn-ink);background:var(--warn-weak);border-top:1px solid color-mix(in oklch,var(--warn-ink) 20%,transparent)}
.ds-note{padding:8px 13px;font-size:11.5px;line-height:1.5;color:var(--muted);background:var(--bg);border-top:1px solid var(--line)}
/* Dossier assurance — bouton d'assemblage (WF 48) + zone de message (succès / refus métier / erreur) */
.ds-actions{padding:11px 13px;background:var(--bg);border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px}
.ds-actions .btn{width:100%}
.ds-msg{font-size:12.5px;line-height:1.45;font-weight:600}
.ds-msg:empty{display:none}
.ds-msg.ok{color:var(--success-ink)}
.ds-msg.blocked{color:var(--warn-ink)}
.ds-msg.err{color:var(--danger-ink)}