
/* Thème unique (clair). Le mode sombre a été retiré le 10/07/2026 : le sélecteur
   :root[data-theme="dark"] et l'interrupteur des Paramètres n'existent plus.
   Le sélecteur [data-theme="light"] est conservé : d'anciens navigateurs ont encore
   `data-theme` posé sur <html>, et init() le force désormais à "light". */
:root, :root[data-theme="light"]{
  color-scheme:light;
  --bg:#F5F6F9; --surface:#fff; --surface-alt:#FBFBFD;
  --ink:#141925; --ink2:#4A5163; --ink3:#8A91A3;
  --line:#E7E9F0; --line2:#EEF0F5;
  --accent:#00FFC9; --accent-soft:#E3FFF8; --accent-ink:#067A5E; --accent-on:#0A2A23;
  /* Palette sémantique (figée avec Théo le 22/07/2026) : une teinte = un sens.
     Bleu = en cours / information / cliquable · Vert = gagné / validé · Rouge = perdu / erreur / retard
     Orange = attention / à traiter · Violet = étapes intermédiaires · Menthe = actions & marque SAYCO uniquement. */
  --blue:#2563EB;   --blue-soft:#E6F1FA;
  --green:#15803D;  --green-soft:#D1FAE5;
  --red:#C12B33;    --red-soft:#FDECEC;
  --orange:#B26B00; --orange-soft:#FCF0DC;
  /* Pastille de la barre de gauche : --orange (#B26B00) est illisible sur le fond #272727 de la
     sidebar. Meme parti que .beta : aplat vif, encre sombre. */
  --nav-alerte:#F59E0B;
  --violet:#7A4DD6; --violet-soft:#F0E9FB;
  --link-hover:#2563EB; /* bleu — couleur de survol de TOUS les textes cliquables (la menthe est réservée aux actions) */
  --sidebar:#272727; --sidebar-ink:#c8cdd6; --sidebar-line:#3A3A3A; --sidebar-hover:rgba(255,255,255,.07);
  --shadow:0 10px 40px rgba(20,25,37,.16);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font-family:'Inter',system-ui,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased;transition:background .2s,color .2s}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit}
/* Tous les champs de saisie suivent le thème (corrige les inputs « blancs » en mode sombre) */
input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select{background:var(--surface-alt);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13px;outline:none}
input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,textarea:focus,select:focus{border-color:var(--accent)}
/* Hitbox élargie pour plus de marge d'erreur au clic */
input[type=checkbox],input[type=radio]{width:16px;height:16px;margin:3px;cursor:pointer;vertical-align:middle}
.inl,.ie{padding:4px 7px !important;border-radius:6px;cursor:text;transition:background .1s}
.inl:hover,.ie:hover{background:var(--surface-alt)}
.mailtrunc{display:block;max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Colonne Secteur (Prospects) : les valeurs Mantiks sont des listes a rallonge qui elargissaient
   toute la colonne. On la borne a ~118px et on tronque en « … » ; le libelle complet s'affiche
   au survol via le title natif (jamais rogne par le conteneur scrollable, contrairement a une
   info-bulle CSS ::after qui serait coupee par #prospScroll). Meme principe que .mailtrunc. */
.sectrunc{display:inline-block;max-width:118px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;font-size:12px;color:var(--ink2);cursor:help}
/* Titre d'affaire (vue Liste) : 2 lignes max + « … » — le span d'édition inline repasse en inline pour que le clamp s'applique au texte */
.affTitleClamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:250px;word-break:break-word}
.affTitleClamp .ie{display:inline !important;padding:1px 0 !important}
a{color:var(--blue,#2563EB);text-decoration:none} /* liens en bleu : la menthe est réservée aux actions */
.mono{font-family:'JetBrains Mono',monospace}
.display{font-family:'Space Grotesk',sans-serif;letter-spacing:-.3px}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}

/* ---------- APP SHELL ---------- */
.app{position:relative;display:grid;grid-template-columns:272px 1fr;height:100vh;overflow:hidden;transition:grid-template-columns .22s cubic-bezier(.4,0,.2,1)}
/* Sidebar repliée : superposée au contenu, largeur animée en douceur (façon Supabase) */
.app.collapsed .sidebar{position:absolute;top:0;left:0;height:100vh;width:72px;z-index:60;overflow:hidden;transition:width .24s cubic-bezier(.4,0,.2,1),box-shadow .24s ease}
.app.collapsed .sidebar:hover{width:272px;box-shadow:8px 0 34px rgba(20,25,37,.24)}
.app.collapsed .sidebar:hover .brand{flex-direction:row;justify-content:flex-start;gap:10px}
.app.collapsed .sidebar:hover .collapse-btn{position:absolute;right:10px;top:18px;margin:0;transform:none}
.app.collapsed .sidebar:hover .brand .name,.app.collapsed .sidebar:hover .user .meta{display:block}
.app.collapsed .sidebar:hover .nav button span,.app.collapsed .sidebar:hover .set-btn span{display:inline}
.app.collapsed .sidebar:hover .nav button{justify-content:flex-start;gap:12px}
.app.collapsed .sidebar:hover .nav button .count{display:inline-flex}
.app.collapsed .sidebar:hover .set-btn{justify-content:flex-start}
.app.collapsed .sidebar:hover .user{justify-content:flex-start}
.app.collapsed .sidebar:hover .user .out{display:inline-flex}
.app.collapsed{grid-template-columns:72px 1fr}
/* La sidebar repliée étant en position absolute (hors flux), on ancre la zone principale
   dans la 2e colonne pour qu'elle ne se replace pas dans la colonne de 72px. */
.app.collapsed .main{grid-column:2}

/* ---------- SIDEBAR ---------- */
.sidebar{background:var(--sidebar);color:var(--sidebar-ink);display:flex;flex-direction:column;padding:16px 14px;overflow:hidden;min-height:0}
.brand{display:flex;align-items:center;gap:11px;padding:6px 6px 16px;position:relative}
.brand .logo{width:34px;height:34px;border-radius:8px;background:var(--accent);display:grid;place-items:center;flex-shrink:0}
.brand .name{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;color:#fff;letter-spacing:-.4px;white-space:nowrap}
.collapse-btn{margin-left:auto;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;color:var(--sidebar-ink);flex-shrink:0}
.collapse-btn:hover{background:var(--sidebar-hover);color:#fff}
.app.collapsed .brand{flex-direction:column;justify-content:center;gap:10px}
.app.collapsed .brand .name, .app.collapsed .nav button span, .app.collapsed .user .meta, .app.collapsed .user .out, .app.collapsed .set-btn span{display:none}
.app.collapsed .collapse-btn{position:static;margin:0 auto;transform:rotate(180deg)}

.nav{display:flex;flex-direction:column;gap:3px;margin-top:6px;overflow-y:auto;overflow-x:hidden;min-height:0;flex:1 1 auto;scrollbar-width:none;-ms-overflow-style:none}
.nav::-webkit-scrollbar{width:0;height:0;display:none}
.nav-cat-h{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sidebar-ink);opacity:.45;padding:11px 11px 4px}
.nav-cat+.nav-cat{margin-top:4px}
.app.collapsed .nav-cat-h{display:none}
.app.collapsed .sidebar:hover .nav-cat-h{display:block}
.nav button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 11px;border-radius:10px;color:var(--sidebar-ink);font-size:14px;font-weight:500;text-align:left;transition:.15s;white-space:nowrap;position:relative}
.nav button:hover{background:var(--sidebar-hover);color:#fff}
.nav button.active{background:rgba(255,255,255,.11);color:#fff;font-weight:600}
.nav button .count{margin-left:auto;font-size:11px;font-weight:600;background:rgba(255,255,255,.13);padding:1px 8px;border-radius:999px}
.nav button .beta{font-size:8.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1;padding:3px 6px;border-radius:8px;background:var(--accent,#00FFC9);color:#0A2A23;margin-left:2px;flex-shrink:0}
/* « en dev » : la puce dit « pas encore pour toi », pas « viens essayer » — donc grise, pas verte. */
.nav button .beta.dev{background:rgba(255,255,255,.13);color:rgba(255,255,255,.66)}
/* Les trois etats, cote barre sombre (la table de reference est _STAGE dans app.js) :
   .beta = new, vert SAYCO · .beta.bet = beta, orange · .beta.dev = en dev, gris. */
.nav button .beta.bet{background:#F59E0B;color:#2B1A02}
/* Un onglet en developpement : visible pour qu'on sache qu'il arrive, mais inerte. */
.nav button.nav-dev{opacity:.45;cursor:not-allowed}
.nav button.nav-dev:hover{background:none;color:var(--sidebar-ink)}
/* Lettre du raccourci clavier, a la place du compteur que personne ne lisait (16/09). Elle suit les
   memes regles d'affichage que .count : masquee barre repliee, revelee au survol. */
.nav button .navk{margin-left:auto;font-size:10px;font-weight:700;font-family:ui-monospace,Menlo,monospace;color:rgba(255,255,255,.42);border:1px solid rgba(255,255,255,.16);border-radius:5px;padding:0 5px;line-height:15px;flex-shrink:0}
/* Infobulles (#gtip) — deux formes, un seul composant : BULLE pour un fragment, CARTE dès qu'il y
   a une structure. Fond blanc comme le reste de Kama — menus, sélecteurs et panneaux sont tous en
   --surface avec un liseré, le fond sombre était l'intrus (16/09). Voir frontend/ui/tooltips.mts. */
#gtip{position:fixed;z-index:9999;background:var(--surface);color:var(--ink2);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 34px rgba(20,25,37,.17);font-size:11.5px;font-weight:500;line-height:1.45;max-width:352px;pointer-events:none;display:none;word-break:break-word}
#gtip.gtip-bulle{max-width:300px;padding:7px 10px;white-space:pre-wrap}
#gtip .gtip-h{padding:10px 12px}
#gtip .gtip-intro{color:var(--ink);font-weight:600;line-height:1.4;padding-bottom:6px}
#gtip .gtip-l{display:flex;align-items:flex-start;gap:8px;padding:2.5px 0}
#gtip .gtip-ic{display:flex;flex:0 0 auto;color:var(--ink3);margin-top:1.5px}
#gtip .gtip-t{flex:1;min-width:0}
#gtip .gtip-b{padding:8px 12px 10px;background:var(--surface-alt);border-top:1px solid var(--line2)}
#gtip .gtip-bt{font-size:9px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);padding-bottom:4px}
#gtip .gtip-k{display:inline-block;font-family:ui-monospace,Menlo,monospace;font-size:9.5px;font-weight:700;padding:0 5px;line-height:15px;border:1px solid var(--line);border-radius:5px;background:var(--surface-alt);color:var(--ink2);vertical-align:1px}
/* Bouclier de defilement (frontend/ui/scroll-shield.mts) : calque transparent pose en tete des
   grandes listes. Il ne capte la souris que pendant la molette, pour que les lignes qui passent
   sous le pointeur ne recalculent pas leur :hover a chaque image. Hauteur et marge posees en JS. */
.bouclier{position:sticky;top:0;z-index:40;display:block;pointer-events:none}
.bouclier.actif{pointer-events:auto}
.nav button:hover .navk,.nav button.active .navk{color:rgba(255,255,255,.62);border-color:rgba(255,255,255,.26)}
.app.collapsed .nav button{justify-content:center;gap:0}
.app.collapsed .nav button .count{display:none}
/* Pastille « Appels » : la SEULE de la barre. Les compteurs ambiants sont bien partis le 16/09 —
   celui-ci est une file de travail, il monte, il tombe a zero et il disparait. */
.nav button .count.cons{background:var(--nav-alerte);color:#3A2400;font-weight:700}
/* Barre repliee : il ne reste que l'icone, or c'est la que le signal compte le plus. La pastille
   devient un point sur l'icone (le chiffre ne tiendrait pas), et redevient un chiffre au survol. */
.app.collapsed .nav button .count.cons{display:block;position:absolute;top:8px;left:50%;margin:0 0 0 4px;width:8px;height:8px;padding:0;border-radius:50%;font-size:0;line-height:0;color:transparent;overflow:hidden;box-shadow:0 0 0 2px var(--sidebar)}
.app.collapsed .sidebar:hover .nav button .count.cons{display:inline-flex;position:static;margin-left:auto;width:auto;height:auto;padding:1px 8px;border-radius:999px;font-size:11px;line-height:normal;color:#3A2400;box-shadow:none}
.nav .ico{width:18px;height:18px;flex-shrink:0;opacity:.92}

.side-foot{margin-top:auto;display:flex;flex-direction:column;gap:4px}
.set-btn{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:10px;color:var(--sidebar-ink);font-size:13.5px;font-weight:500;white-space:nowrap}
.set-btn:hover{background:var(--sidebar-hover);color:#fff}
.app.collapsed .set-btn{justify-content:center}
.user{display:flex;align-items:center;gap:10px;padding:11px 8px 4px;border-top:1px solid var(--sidebar-line);margin-top:4px}
.avatar{width:32px;height:32px;border-radius:999px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:600;font-size:13px;flex-shrink:0}
.app.collapsed .user{justify-content:center}
.user .meta{line-height:1.3;min-width:0}
.user .meta b{color:#fff;font-size:13px;font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user .meta span{color:#6c7286;font-size:11px;display:block}
.user .out{margin-left:auto;color:#6c7286;font-size:11px;padding:5px 7px;border-radius:8px;flex-shrink:0}
.user .out:hover{color:#fff;background:var(--sidebar-hover)}

/* ---------- MAIN ---------- */
.main{display:flex;flex-direction:column;overflow:hidden;contain:layout style}
.topbar{display:flex;align-items:center;gap:14px;padding:0 26px;height:64px;background:var(--surface);border-bottom:1px solid var(--line);flex-shrink:0}
.topbar h1{font-family:'Space Grotesk',sans-serif;font-size:19px;font-weight:600;letter-spacing:-.3px}
.topbar .sub{color:var(--ink3);font-size:12.5px}
.topbar>div:first-child{flex:1 1 0;min-width:0}
/* Recherche globale : FIXE en haut AU CENTRE, au-dessus de tout (panneaux compris), quoi qu'il arrive.
   L'élément est déplacé dans <body> au boot (app.js) pour échapper à tout contexte d'empilement parent. */
.search{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:95;width:min(520px,42vw);margin:0}
body:has(#app.hidden) .search{display:none} /* pas de recherche sur l'écran de connexion */
@media(max-width:900px){.search{width:min(360px,60vw)}}
.search input{width:100%;box-sizing:border-box;padding-left:36px}
.search-ico{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--ink3);pointer-events:none}
.top-actions{flex:1 1 0;display:flex;align-items:center;justify-content:flex-end;gap:12px}
#searchWrap input{width:100%;box-sizing:border-box;padding:9px 13px 9px 38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);font-size:13.5px;color:var(--ink);outline:none;box-shadow:0 2px 10px rgba(20,25,37,.08)}
#searchWrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft,rgba(3,255,201,.16))}
/* Panneau de droite ouvert : la recherche se recale au centre DU PANNEAU (à droite) ; en temps normal elle reste au centre de l'écran */
body:has(.drawer.open) .search{left:auto;right:70px;transform:none} /* juste à gauche de la croix du panneau */
body:has(.drawer.open) #searchWrap input{box-shadow:0 8px 28px rgba(20,25,37,.30);border-color:var(--accent)}
.content{flex:1;overflow-y:auto;scrollbar-gutter:stable;padding:24px 26px 70px}
/* Vue candidats (grille) : la zone de défilement descend jusqu'au bas de la fenêtre (pas de bande grise) */
.content.cand-flush{display:flex;flex-direction:column;overflow:hidden;padding-bottom:0}
.content.cand-flush>.card{flex:1 1 auto;min-height:0;margin-bottom:0}
.content.cand-flush #candScroll{flex:1 1 auto;min-height:0;max-height:none!important}
/* Vue Prospects (tableau) : meme principe. #prospScroll etait borne par un calc(100vh - 190px) qui
   SUPPOSE que la carte commence a 190px du haut. Des que .content defile (la barre d'outils + les
   filtres montent), la carte remonte d'autant et la reserve de 190px devient une bande grise en bas
   — 70px mesures. En flush, la carte descend jusqu'au bas de la fenetre et seul le tableau defile.
   Non applique sous 768px : sur telephone, la barre d'outils passe sur 3-4 lignes et il ne resterait
   presque rien au tableau. */
@media (min-width:768px){
  .content.prosp-flush{display:flex;flex-direction:column;overflow:hidden;padding-bottom:0}
  .content.prosp-flush>.card{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;margin-bottom:0}
  .content.prosp-flush #prospScroll{flex:1 1 auto;min-height:0;max-height:none!important}
}

/* ---------- BUTTONS ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;border-radius:10px;font-size:13.5px;font-weight:600;transition:.15s}
.btn-primary{background:var(--accent);color:var(--accent-on,#fff)}
.btn-primary:hover{filter:brightness(1.05)}
/* Croix de suppression d'un historique de statut (visible au survol de la ligne, admin) */
/* Stylo d'édition de l'évaluation (visible au survol de la cellule Éval) */
/* Stylo d'édition des étiquettes (visible au survol de la cellule) */
/* Stylo d'édition de la rémunération (visible au survol de la cellule) */
.remucell .remu-edit{opacity:0;transition:opacity .12s}
.remucell:hover .remu-edit{opacity:1}
.remu-edit:hover{color:var(--accent-ink,#067A5E)}
.tagcell .tag-edit{opacity:0;transition:opacity .12s}
.tagcell:hover .tag-edit{opacity:1}
.tag-edit:hover{color:var(--accent-ink,#067A5E)}
.evalcell .eval-edit{opacity:0;transition:opacity .12s}
.evalcell:hover .eval-edit{opacity:1}
.eval-edit:hover{color:var(--accent-ink,#067A5E)}
.hist-del{opacity:0;transition:opacity .12s}
.histrow:hover .hist-del{opacity:1}
.hist-del:hover{color:#C12B33;background:var(--surface-alt)}
.btn-ghost{background:var(--surface);border:1px solid var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink3)}

/* ---------- BADGES ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap;letter-spacing:.1px;border:1px solid transparent}
.badge.editable{cursor:pointer}
.badge.editable:hover{filter:brightness(.97);box-shadow:0 0 0 2px var(--accent-soft)}
.badge .car{opacity:.5}

/* ---------- TABLE ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px}
table{width:100%;border-collapse:collapse}
thead th{text-align:left;padding:0;font-size:10.5px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.6px;background:var(--surface-alt);white-space:nowrap;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.th-inner{display:flex;align-items:center;gap:6px;padding:11px 14px}
/* En-tête de colonne (tables colf : candidats, organisations, contacts, affaires) */
th[data-colf]{cursor:pointer}
.th-title{cursor:pointer;white-space:nowrap}
th[data-colf]:hover .th-title{color:#00FFC9}
.th-i{display:inline-flex;align-items:center;justify-content:center;color:var(--ink3);cursor:help;flex-shrink:0;line-height:0;opacity:.72;transition:color .1s,opacity .1s}
.th-i:hover{color:#00FFC9;opacity:1}
.th-sortind{font-size:10.5px;flex-shrink:0;cursor:pointer;display:inline-flex;align-items:center;line-height:1}
.th-sortind .tri{color:#00FFC9}
.th-sortind .clr{display:none;color:var(--ink2);font-size:10.5px}
.th-sortind:hover .tri{display:none}
.th-sortind:hover .clr{display:inline}
.th-sortind:hover .clr{color:#C12B33}
.th-dot{width:7px;height:7px;border-radius:50%;background:#00FFC9;flex-shrink:0;box-shadow:0 0 0 2px var(--accent-soft,#E3FFF8)}
th.th-filtered .th-inner{background:var(--accent-soft,#E3FFF8)}
th.th-filtered .th-title{color:var(--ink);font-weight:800}
/* Tri dans le volet de filtre (haut-droite) */
.colf-sort{display:inline-flex;gap:3px}
.colf-sort button{width:22px;height:22px;display:grid;place-items:center;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink3);font-size:10.5px;line-height:1;cursor:pointer;padding:0;transition:border-color .1s,background .1s,color .1s}
.colf-sort button:hover{border-color:#00FFC9;color:var(--ink)}
.colf-sort button.on{background:#00FFC9;border-color:#00FFC9;color:#0A2A23;font-weight:900}
/* Bouton stylo « Remplir la fiche » sur une activité d'évaluation */
.hist-magic{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border:1px solid var(--accent,#00FFC9);border-radius:14px;background:var(--accent-soft,#E3FFF8);color:var(--ink);font-size:11px;font-weight:700;cursor:pointer;line-height:1}
.hist-magic:hover{background:#00FFC9;color:#0A2A23}
.hist-magic:disabled{opacity:.5;cursor:default}
.hist-magic-done{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;color:#0A2A23;background:#00FFC9;padding:2px 9px;border-radius:12px}
/* Prospection : figer les 2 premières colonnes (statut + entreprise) au scroll horizontal */
.ptable th:first-child,.ptable td:first-child{position:sticky;left:0;z-index:3;background:var(--surface);width:178px;min-width:178px;max-width:178px;transition:background .12s}
.ptable th:nth-child(2),.ptable td:nth-child(2){position:sticky;left:178px;z-index:3;background:var(--surface);box-shadow:1px 0 0 var(--line);transition:background .12s}
.ptable thead th:first-child,.ptable thead th:nth-child(2){position:sticky;top:0;z-index:8;background:var(--surface-alt)}
.ptable tbody tr:hover td:first-child,.ptable tbody tr:hover td:nth-child(2){background:var(--surface-alt)}
/* Table organisations : pas de figeage 178px de la Prospection (Créé le en 1re colonne) */
.ptable-org th:first-child,.ptable-org td:first-child{position:static;width:auto;min-width:0;max-width:none;box-shadow:none}
.ptable-org th:nth-child(2),.ptable-org td:nth-child(2){position:static;left:auto;box-shadow:none}
/* Table candidats : 1re colonne = case à cocher 34px, pas le figeage 178px de la Prospection */
.ptable-cand th:first-child,.ptable-cand td:first-child{position:static;width:34px;min-width:34px;max-width:34px;box-shadow:none}
.ptable-cand th:nth-child(2),.ptable-cand td:nth-child(2){position:static;left:auto;box-shadow:none}
.ptable-ann th:first-child,.ptable-ann td:first-child{position:static;width:30px;min-width:30px;max-width:30px;box-shadow:none;padding-left:2px;padding-right:2px}
.ptable-ann th:nth-child(2),.ptable-ann td:nth-child(2){position:static;left:auto;box-shadow:none}
/* Prospects : lignes plus denses. Scope .ptable-ann UNIQUEMENT — le `tbody td{padding:11px 14px}`
   global reste la regle des tables Candidats / Organisations / Contacts / Affaires. */
.ptable-ann tbody td{padding:6px 12px}
/* Candidats : lignes denses (demande Théo 04/09) — même principe que .ptable-ann. */
.ptable-cand tbody td{padding:7px 12px;overflow:hidden} /* table-layout:fixed (12/09) : une cellule trop large est rognée, jamais la colonne élargie */
/* Organisations : lignes denses et UNIFORMES (demande Théo 09/09). */
.ptable-org tbody td{padding:5px 12px;vertical-align:middle}
.ptable-org tbody tr{height:44px}
/* Statut : la colonne épouse le badge (une seule ligne, jamais de retour). */
.ptable-org th:nth-child(2),.ptable-org td:nth-child(2){width:1%;white-space:nowrap}
.ptable-org .crm-stat{white-space:nowrap}
/* Nom d'organisation : 2 lignes max, coupé proprement — la ligne ne grandit pas. */
.ptable-org .co .orgnm{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.22;word-break:break-word;font-size:13px}
/* Étiquettes : une rangée visible, le reste est coupé pour garder la hauteur constante. */
.ptable-org .orgtags{max-height:34px;overflow:hidden}
.ptable-ann .co{font-size:13px;line-height:1.3}
.ptable-ann .po{margin-top:1px;line-height:1.3}
/* Titre du poste ET nom d'organisation : JAMAIS plus d'une ligne. Tronques en « … », complets au
   survol (title natif). Colonne « Poste / Entreprise » = 240px, moins 24px de padding du td ;
   le nom d'organisation partage sa ligne avec le favicon (16px) et son gap (6px). */
.ptable-ann .co .postname{display:block;min-width:0;max-width:212px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptable-ann .po .orgname{display:block;min-width:0;max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Cellules bornees : sans cela, `table-layout:auto` laisse le contenu le plus large dicter la
   largeur de colonne (Tel montait a 331px en prod pour une colonne declaree a 210). Le max-width
   du <th> seul ne suffit pas : en layout auto, c'est le CONTENU qu'il faut borner. */
.ptable-ann .cellcap{display:block;min-width:0;overflow:hidden}
.ptable-ann .capLoc{max-width:102px}
.ptable-ann .capTel{max-width:186px}
/* ── Hauteur de ligne UNIQUE : 47px (demande Théo 04/09) ─────────────────────────────────────
   Mesure prod avant correctif : 98 lignes a 47px, 101 lignes de 52 a 117px. Coupables mesures
   cellule par cellule : Localisation 76, Contact 22, Pipedrive 3.
   Budget : 47px = 12px de padding du td + 35px de contenu. La reference est « Poste / Entreprise »
   (2 lignes de 17px = 34px). Tout ce qui depasse 35px casse l'alignement.
   Le vrai coupable cache : .inl (edition inline) porte padding:4px 7px, soit 24px par ligne de
   texte. Deux lignes de .inl = 48px, impossible a tenir. On rabote le padding VERTICAL dans ce
   tableau uniquement (le padding horizontal et le fond au survol restent). */
.ptable-ann tbody tr{height:47px}
.ptable-ann tbody .inl{padding-top:1px !important;padding-bottom:1px !important}
/* Colonne Contact : 2 lignes (nom + email) → padding vertical nul, comme la branche « contact du
   CRM » qui n'a pas de .inl du tout. 16 + 2 (gap) + 14 = 32px. */
.ptable-ann .leadcell .inl{padding-top:0 !important;padding-bottom:0 !important;max-width:100%}
/* Interlignage fixe : un nom en armenien + drapeaux (« Marc Կարո ILIOZER 🇦🇲 🇫🇷 ») a une boite de
   ligne 1px plus haute que le latin et faisait une ligne a 48px dans un tableau a 47. On fige la
   hauteur de ligne sans overflow:hidden : la mise en page ne bouge plus, les glyphes s'affichent
   quand meme en entier. */
.ptable-ann .leadcell{line-height:16px}
.ptable-ann .leadcell .mailtrunc{line-height:14px}
.ptable-ann .leadcell>span,.ptable-ann .leadcell>div>span{min-width:0;max-width:100%}
/* Colonne Localisation : ville sur UNE ligne, « … » + survol si trop long ; idem pour la mention
   « ↳ près de <grande ville> ». 18 + 1 + 13 = 32px.
   Pour que les « … » apparaissent VRAIMENT (et non une coupe nette par overflow:hidden du parent),
   il faut borner le .inl lui-meme : en inline-flex non borne il grandit avec son contenu et le
   .inlv n'a jamais a se retrecir. Le crayon ne doit pas etre ecrase → flex-shrink:0. */
.ptable-ann .capLoc .inl,.ptable-ann .capTel .inl{max-width:100%}
.ptable-ann .inl>svg{flex-shrink:0}
.ptable-ann .inlv{display:block;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptable-ann .bigcityhint{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:13px}
/* Colonne Pipedrive : les etiquettes s'empilaient jusqu'a 3 lignes (ligne a 117px). Une seule
   ligne, tronquee ; la liste complete est dans le title. */
.ptable-ann .tagline{max-width:78px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Colonne Étiquettes ramenée à 100px le 20/09/2026 : sous table-layout:auto, le max-width du
   <th> ne borne rien — c'est la cellule la plus large qui fixe la colonne. Une étiquette
   longue (« Déjà passé par des cabinets ») la rouvrait à 215px. On borne donc la pastille. */
.ptable-ann .tagline>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
/* Poste / Entreprise : .co est deja en flex (regle globale plus bas), les pastilles « repost » /
   « expire » restent donc a cote du titre. On resserre juste le gap dans ce tableau. */
.ptable-ann .co{gap:5px}
.th-filter{width:18px;height:18px;border-radius:6px;display:grid;place-items:center;color:var(--ink3);flex-shrink:0;margin-left:auto}
.th-filter:hover{background:var(--line2);color:var(--ink)}
.th-filter.on{color:var(--accent);background:var(--accent-soft)}
tbody tr{border-top:1px solid var(--line2);cursor:pointer;transition:background .12s}
tbody tr:hover{background:var(--surface-alt)}
tbody td{padding:11px 14px;vertical-align:middle;font-size:13px;color:var(--ink2)}
.co{font-weight:600;color:var(--ink);font-size:13.5px;display:flex;align-items:center;gap:7px}
.po .fav{width:16px;height:16px;border-radius:6px;flex-shrink:0;object-fit:cover;background:var(--line2)}
.co .fav{width:28px;height:28px;border-radius:6px;flex-shrink:0;object-fit:cover;background:var(--line2)}
#affClientView .fav{width:22px;height:22px;border-radius:6px;flex-shrink:0;object-fit:cover;background:var(--line2)}
.co a.colink{color:inherit;text-decoration:none}
.co a.colink:hover{color:var(--accent);text-decoration:underline}
.po{color:var(--ink3);font-size:12px;margin-top:2px}
.po a.polink{color:inherit;text-decoration:none}
.po a.polink:hover{color:var(--accent);text-decoration:underline}
.opt-tag{font-family:'JetBrains Mono',monospace;font-weight:500;font-size:11.5px;color:var(--accent-ink);background:var(--accent-soft);padding:2px 8px;border-radius:6px}
.rep-tag{font-size:10.5px;font-weight:600;color:#B26B00;background:#FCF0DC;padding:1px 6px;border-radius:6px;margin-left:5px}
.row-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.row-meta .n{font-size:12.5px;color:var(--ink3)}
.chiprec{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink2)}
.chiprec .ava{width:20px;height:20px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);display:grid;place-items:center;font-size:10.5px;font-weight:700}

/* ---------- POPOVER ---------- */
.pop{position:fixed;z-index:90;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:7px;min-width:210px;max-height:360px;overflow:auto;font-family:'Inter',sans-serif}
.pop .psearch{width:100%;padding:7px 9px;border-radius:8px;border:1px solid var(--line);font-size:12.5px;color:var(--ink);outline:none;background:var(--surface-alt);margin-bottom:6px}
.pop .pitem{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px;font-size:13px;color:var(--ink2);cursor:pointer;white-space:nowrap}
.pop .pitem:hover{background:var(--surface-alt)}
.pop .pitem input{accent-color:#2563EB;width:14px;height:14px}
.pop .psearch:focus{border-color:#2563EB}
.pop .pitem .dot{width:8px;height:8px;border-radius:6px;flex-shrink:0}
.pop .pbar{display:flex;justify-content:space-between;padding:4px 6px 8px;border-bottom:1px solid var(--line2);margin-bottom:5px}
.pop .pbar button{font-size:11.5px;color:#2563EB;font-weight:600}
.pop .phead{font-size:10.5px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.5px;padding:4px 8px 7px}

/* ---------- SETTINGS MENU ---------- */
.menu{position:fixed;z-index:95;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:7px;min-width:230px;font-family:'Inter',sans-serif}
.menu .mhead{font-size:10.5px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.5px;padding:7px 9px 6px}
.menu .mitem{display:flex;align-items:center;gap:10px;padding:9px 9px;border-radius:8px;font-size:13.5px;color:var(--ink);cursor:pointer}
.menu .mitem:hover{background:var(--surface-alt)}
.menu .mitem .ri{margin-left:auto;color:var(--ink3);font-size:12px}
.toggle{margin-left:auto;width:38px;height:22px;border-radius:999px;background:var(--line);position:relative;transition:.2s;flex-shrink:0}
.toggle.on{background:var(--accent)}
.toggle .knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:999px;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.toggle.on .knob{left:18px}

/* ---------- IMPORT ---------- */
.wrap{max-width:none;margin:0}
h2.sec{font-family:'Space Grotesk',sans-serif;font-size:21px;font-weight:700;letter-spacing:-.3px;margin-bottom:8px}
p.lead{color:var(--ink2);font-size:14px;line-height:1.6;margin-bottom:22px}
.drop{border:1.5px dashed var(--line);background:var(--surface-alt);border-radius:16px;padding:42px 24px;text-align:center;cursor:pointer;transition:.15s;margin-bottom:16px}
.drop:hover,.drop.drag{border-color:var(--accent);background:var(--accent-soft)}
.drop .ic{width:48px;height:48px;border-radius:12px;background:var(--accent-soft);display:grid;place-items:center;margin:0 auto 14px;color:var(--accent)}
.drop .t{font-weight:600;font-size:15px;color:var(--ink)}
.drop .s{color:var(--ink3);font-size:13px;margin-top:4px}
.stats3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stat{background:var(--surface-alt);border-radius:10px;padding:14px 16px}
.stat .num{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:26px}
.stat .lab{color:var(--ink3);font-size:12px;margin-top:2px}

/* ---------- STATS ---------- */
.kpigrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}
.kpi .top{display:flex;align-items:center;justify-content:space-between}
.kpi .ic{width:34px;height:34px;border-radius:8px;display:grid;place-items:center}
.kpi .num{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:30px;margin-top:12px;letter-spacing:-.5px}
.kpi .lab{color:var(--ink3);font-size:12.5px;margin-top:2px}
.kpi .delta{font-size:11.5px;font-weight:600;padding:2px 7px;border-radius:999px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px}
.panel .h{font-weight:600;font-size:14px;margin-bottom:4px;display:flex;align-items:center;gap:8px}
.panel .hsub{color:var(--ink3);font-size:12px;margin-bottom:16px}
.bar-row{display:flex;align-items:center;gap:12px;margin-bottom:11px}
.bar-row .lbl{width:130px;flex-shrink:0;font-size:13px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{flex:1;height:9px;background:var(--line2);border-radius:999px;overflow:hidden}
.bar-fill{height:100%;border-radius:999px;transition:width .6s cubic-bezier(.4,0,.2,1)}
.bar-row .v{width:30px;text-align:right;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--ink2)}
.funnel-step{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.funnel-bar{height:38px;border-radius:8px;display:flex;align-items:center;padding:0 14px;color:#fff;font-weight:600;font-size:13px;transition:width .6s;min-width:64px}
.funnel-meta{font-size:12.5px;color:var(--ink3)}
.reccard{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line2)}
.reccard:first-child{border-top:none}
.reccard .ava{width:34px;height:34px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);display:grid;place-items:center;font-weight:700;font-size:13px;flex-shrink:0}
.reccard .nm{font-weight:600;font-size:13.5px;color:var(--ink)}
.reccard .sb{font-size:11.5px;color:var(--ink3)}
.reccard .mets{margin-left:auto;display:flex;gap:18px;text-align:right}
.reccard .met .mn{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:17px}
.reccard .met .ml{font-size:10.5px;color:var(--ink3);text-transform:uppercase;letter-spacing:.4px}
.donut-wrap{display:flex;align-items:center;gap:22px}
.legend{display:flex;flex-direction:column;gap:8px}
.legend .li{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--ink2)}
.legend .li .sw{width:11px;height:11px;border-radius:6px}
.legend .li b{margin-left:auto;font-family:'JetBrains Mono',monospace;color:var(--ink)}

/* ---------- EMPTY ---------- */
.empty{text-align:center;padding:70px 20px;max-width:420px;margin:0 auto}
.empty .ic{width:54px;height:54px;border-radius:14px;background:var(--line2);display:grid;place-items:center;margin:0 auto 16px;color:var(--ink3)}
.empty h3{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600}
.empty p{color:var(--ink3);font-size:13.5px;margin-top:8px;line-height:1.6}

/* ---------- DRAWER ---------- */
.drawer-bg{position:fixed;inset:0;background:rgba(20,25,37,.34);z-index:60;opacity:0;pointer-events:none;transition:.2s}
.drawer-bg.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100vh;width:min(max(66.7vw,1100px),96vw);background:var(--bg);z-index:70;overflow-y:auto;transform:translateX(100%);transition:transform .25s cubic-bezier(.3,.8,.3,1);box-shadow:-8px 0 40px rgba(20,25,37,.22)}
.drawer.open{transform:translateX(0)}
/* Grand panneau (style Pipedrive) : xl = affaires (2 colonnes), lg = organisations / personnes / candidats */
.drawer.xl{width:min(max(66.7vw,1100px),96vw)}
.drawer.lg{width:min(max(66.7vw,1100px),96vw)}
.affxl{display:grid;grid-template-columns:400px minmax(0,1fr);align-items:start}
.affxl .axl-left{border-right:1px solid var(--line);padding:16px 20px 60px;min-width:0}
.affxl .axl-right{padding:16px 22px 60px;min-width:0}
@media(max-width:920px){.affxl{grid-template-columns:1fr}.affxl .axl-left{border-right:0;border-bottom:1px solid var(--line);padding-bottom:16px}}
/* Modal de création d'activité (fenêtre identique partout) */
#actModal .amod-bg{position:fixed;inset:0;background:rgba(20,25,37,.45);z-index:120}
#actModal .amod{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(680px,94vw);max-height:92vh;overflow-y:auto;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 70px rgba(20,25,37,.35);z-index:121;padding:18px 20px}
#actModal .amod .fld{margin-bottom:9px}
#actModal .atype-chip{padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:var(--surface-alt);color:var(--ink2);font-size:12px;font-weight:600;cursor:pointer}
#actModal .atype-chip.on{background:var(--accent,#2563EB);border-color:var(--accent,#2563EB);color:#fff}
.drawer-head{position:sticky;top:0;background:var(--surface);border-bottom:1px solid var(--line);padding:16px 20px;display:flex;justify-content:space-between;align-items:flex-start;z-index:6}
.drawer-head .co2{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:17px}
.drawer-head .co2 .k-name{transition:color .12s}
.drawer-head .co2 .k-name:hover{color:#00FFC9}
.drawer-head .po2{color:var(--ink3);font-size:13px;margin-top:2px}
.annedit-pen{opacity:0;transition:opacity .12s;cursor:pointer;color:var(--ink3);background:none;border:0;padding:0;display:inline-flex;align-items:center;line-height:0}
.annedit:hover .annedit-pen{opacity:1}
.annedit-pen:hover{color:#2563EB}
/* Notes « post-it » : mêmes teintes que textarea.nico-act-note de l'extension
   (extension/content.css) — le champ Notes doit se lire pareil des deux côtés.
   Sélecteur `textarea.postit` (0,1,1) et non `.postit` (0,1,0) : une règle
   `.fld textarea` / `.dbox textarea` plus spécifique reprendrait le dessus et le
   fond resterait blanc — c'est exactement le piège rencontré dans l'extension. */
textarea.postit{background:#FFF9DB;border:1px solid #EFE4A8;color:#3F3A18;min-height:92px;resize:vertical}
textarea.postit::placeholder{color:#A99F62}
.x{background:var(--line2);border-radius:8px;width:30px;height:30px;display:grid;place-items:center;color:var(--ink2)}
.x:hover{background:var(--line)}
.drawer-body{padding:20px;display:flex;flex-direction:column;gap:16px}
.secbox{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:0 0 12px}
/* Volets org / contact / candidat en 2 colonnes : 1/3 champs à gauche, 2/3 activités & historique à droite */
.dsplit{display:grid;grid-template-columns:minmax(300px,1fr) minmax(0,2fr);gap:18px;align-items:start}
.dsplit>div{display:flex;flex-direction:column;gap:16px;min-width:0}
@media(max-width:920px){.dsplit{grid-template-columns:1fr}}
.secbox h4:first-child{margin-top:0}
.dlabel{font-size:12px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between}
.dlabel .ed{font-size:10.5px;color:#2563EB;font-weight:600;letter-spacing:0;text-transform:none}
.hoverpen{opacity:0;transition:opacity .12s}
.fld:hover .hoverpen,.orgNameWrap:hover .hoverpen,.orgLocWrap:hover .hoverpen,.drawer-head:hover .hoverpen,.hoverpen:focus{opacity:1}
.amfield-ic{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--ink3);pointer-events:none;display:flex;align-items:center}
.fld input[style*="display: none"] ~ .amfield-ic{display:none}
.sayco-sel{display:flex;align-items:center;gap:6px;width:100%;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--surface-alt);color:var(--ink);font-size:12.5px;font-weight:600;cursor:pointer;text-align:left}
.sayco-sel:hover{border-color:#2563EB}
.sayco-sel-nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sayco-sel-cx{color:var(--ink3);flex-shrink:0}
.fldtip{position:relative}
.fldtip[data-tip]:hover::after{content:attr(data-tip);position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);background:#1B2130;color:#fff;font-size:10.5px;font-weight:600;line-height:1.3;padding:5px 9px;border-radius:8px;white-space:nowrap;box-shadow:0 8px 24px rgba(20,25,37,.28);z-index:50;pointer-events:none}
.fldtip[data-tip]:hover::before{content:"";position:absolute;left:50%;top:calc(100% + 3px);transform:translateX(-50%) rotate(45deg);width:8px;height:8px;background:#1B2130;z-index:50;pointer-events:none;border-radius:6px}
/* Titre intégré dans la carte (comme le volet Affaire) : le gap de .dbox gère l'espacement. */
.dbox>.dlabel{margin-bottom:1px}
.dbox{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:11px}
.axl-left>.dbox{margin-bottom:16px}
.axl-left>.dbox:last-child{margin-bottom:0}
.fld{display:flex;flex-direction:column;gap:4px;margin-bottom:0}
.fld:last-child{margin-bottom:0}
.fld label{font-size:11px;color:var(--ink3);font-weight:500}
.fld input,.fld select,.fld textarea{padding:8px 10px;border-radius:8px;border:1px solid var(--line);font-size:13px;color:var(--ink);background:var(--surface-alt);outline:none;width:100%}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--accent);background:var(--surface)}
/* Champ neutralise par le type d'activite (eval. candidat). Doit se lire au premier coup d'oeil
   comme inactif : le fond NORMAL des champs est deja --surface-alt (#FBFBFD), il faut donc un gris
   nettement plus marque, plus un trait tirete et l'italique. (line-through ne rend pas sur un input.) */
/* Selecteur volontairement calque sur la regle globale des champs :
     input:not([type=checkbox]):not([type=radio]):not([type=range]) -> specificite (0,3,1)
   Un simple « .fld input.am-off » ne pese que (0,2,1) : il perdait, et le champ gardait son
   fond normal. En reprenant les trois :not() on monte a (0,4,1) et on passe devant, sans !important. */
input.am-off:not([type=checkbox]):not([type=radio]):not([type=range]),
input.am-off:not([type=checkbox]):not([type=radio]):not([type=range]):focus{background:#E4E8EF;color:#8A91A3;border:1px dashed #C2C9D8;font-style:italic;cursor:not-allowed}
input.am-off:not([type=checkbox]):not([type=radio]):not([type=range])::placeholder{color:#AEB5C4}
.fld textarea{resize:vertical;min-height:80px;line-height:1.5;font-family:'Inter',sans-serif}
/* « Nouveau prospect », bêta lien_annonce (maquette v2 validée par Théo le 01/10/2026) : le lien
   d'abord, dans une zone à coller ; le mode d'emploi dans l'info-bulle ⓘ ; les champs en squelette
   pendant la lecture. Le #createModal pèse plus lourd que la règle globale des <input>. */
.cml-zone{display:flex;align-items:center;gap:10px;border:2px dashed #7CF5DB;border-radius:12px;padding:12px 12px 12px 14px;background:var(--surface);min-height:66px;transition:border-color .15s,background .15s,box-shadow .15s}
.cml-zone:focus-within{border-color:var(--accent);border-style:solid;box-shadow:0 0 0 4px #00FFC922}
.cml-zone.pris{border-style:solid;border-color:var(--line);box-shadow:none}
.cml-zone.survol{background:var(--accent-soft);border-color:var(--accent)}
.cml-zone [hidden]{display:none!important}
.cml-ic{color:var(--ink2);display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--accent-soft);flex:none}
#createModal .cml-zone input.cml-in{flex:1;min-width:0;border:0;outline:none;background:none;box-shadow:none;padding:0;height:auto;border-radius:0;font-size:15px;font-weight:600;color:var(--ink);font-family:inherit}
#createModal .cml-zone input.cml-in::placeholder{color:var(--ink2);font-weight:600;opacity:1}
.cml-pris{flex:1;min-width:0;display:flex;align-items:center;gap:8px}
.cml-src{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;border:1px solid var(--accent);background:var(--accent-soft);color:var(--accent-on);font-weight:700;font-size:11.5px;white-space:nowrap;flex:none}
.cml-src i{width:6px;height:6px;border-radius:50%;display:inline-block}
.cml-url{flex:1;min-width:0;font-size:14px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cml-coller{border:0;cursor:pointer;border-radius:9px;padding:9px 14px;font-weight:700;font-size:13px;background:var(--accent);color:var(--accent-on);font-family:inherit;white-space:nowrap;flex:none}
.cml-coller:hover{filter:brightness(.95)}
.cml-chg{border:0;background:none;color:var(--blue);font-weight:600;cursor:pointer;font-size:12.5px;font-family:inherit;padding:6px 4px;flex:none}
.cml-chg:hover{text-decoration:underline}
.cml-i{position:relative;display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;color:var(--ink3);cursor:help;flex:none;outline:none}
.cml-i:hover,.cml-i:focus-visible{color:var(--ink2);background:var(--line2)}
.cml-bulle{display:none;position:absolute;right:-6px;top:calc(100% + 8px);width:280px;background:#fff;color:var(--ink);border:1px solid var(--line);font-size:11.5px;font-weight:500;line-height:1.5;padding:9px 12px;border-radius:9px;box-shadow:0 8px 24px rgba(20,25,37,.18);z-index:5;text-align:left;cursor:default;flex-direction:column;gap:4px}
.cml-i:hover .cml-bulle,.cml-i:focus .cml-bulle{display:flex}
.cml-bulle b{font-size:12px}
.cml-bulle .gris{color:var(--ink3)}
.cml-touche{display:inline-flex;align-items:center;padding:0 5px;border-radius:4px;border:1px solid var(--line);border-bottom-width:2px;font-size:10.5px;font-weight:700;color:var(--ink2)}
#createModal input.cml-skel{background:linear-gradient(90deg,#E4E7EE 0%,#F6F7FA 50%,#E4E7EE 100%)!important;background-size:200% 100%!important;animation:cmlsk 1.1s ease-in-out infinite;color:transparent;border-color:transparent}
#createModal input.cml-skel::placeholder{color:transparent}
@keyframes cmlsk{0%{background-position:100% 0}100%{background-position:-100% 0}}
#createModal .fld input:disabled{color:var(--ink2);background:var(--line2);cursor:not-allowed}
.cml-ok{color:var(--ink2)}
.cml-ok::before{content:"✓";display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;background:var(--accent);color:var(--accent-on);font-size:9px;font-weight:800;margin-right:6px;vertical-align:-2px}
.cml-pill{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:700;white-space:nowrap}
.cml-deja{flex:1;background:var(--accent-soft);border:1px solid #7CF5DB;color:var(--accent-on);border-radius:10px;padding:8px 11px;font-size:12.5px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.cml-meme{margin-top:6px;background:#FFF4E5;border:1px solid #FBD9A8;color:#7A4B00;border-radius:10px;padding:7px 10px;font-size:12px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cml-meme.gris{background:none;border:0;padding:0 2px;color:var(--ink3);font-size:11.5px}
.cml-meme[hidden],.cml-pop[hidden]{display:none}
.cml-avis{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;background:#FFF4E5;color:#7A4B00;font-size:11px;font-weight:700;cursor:pointer;border:1px solid #FBD9A8;font-family:inherit}
.cml-lien{border:0;background:none;padding:0;color:var(--blue);font-weight:600;font-size:11.5px;cursor:pointer;font-family:inherit}
.cml-pop{margin-top:6px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:4px}
.cml-pop button{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:7px 9px;border:0;background:none;cursor:pointer;border-radius:7px;font-size:12.5px;color:var(--ink);font-family:inherit}
.cml-pop button:hover,.cml-pop button:focus-visible{background:var(--surface-alt)}
.cml-pop .n{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cml-pop .i{color:var(--ink3);font-size:11.5px;white-space:nowrap}
.cml-csv{font-size:12px;color:var(--ink3);cursor:pointer;display:inline-flex;align-items:center;gap:5px;background:none;border:0;padding:0;font-family:inherit}
.cml-csv b{color:var(--blue);font-weight:600}
#createModal.cml-dup .cm-org-etat,#createModal.cml-dup .cml-pop,#createModal.cml-dup .cml-meme{display:none!important}
/* « Nouvelle affaire » : prospects actifs de l'organisation, antidoublon (06/10/2026, _affAntidoublon) */
#createModal .cm-dbl{flex:1 1 100%;margin-top:-4px}
#createModal .cm-dbl[hidden]{display:none}
#createModal .cm-dbl-liste{margin-top:6px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:4px}
#createModal .cm-dbl-ligne{display:flex;align-items:center;gap:8px;padding:6px 9px;border-radius:7px;font-size:12.5px}
#createModal .cm-dbl-ligne .p{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#createModal .cm-dbl-ligne .i{color:var(--ink3);font-size:11.5px;white-space:nowrap}
#createModal .cm-dbl-plus{display:block;border:0;background:none;padding:5px 2px 0;color:var(--ink3);font-size:11.5px;cursor:pointer;font-family:inherit}
#createModal .cm-dbl-liste .cm-dbl-plus{padding:4px 9px}
#createModal .cm-dbl-plus:hover{color:var(--ink2);text-decoration:underline}
.opt-row{display:flex;gap:10px}
.optbtn{flex:1;text-align:left;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);transition:.15s}
.optbtn:hover{border-color:var(--ink3)}
.optbtn.active{border-color:var(--accent);background:var(--accent-soft)}
.optbtn .t{font-weight:600;font-size:13.5px;color:var(--ink)}
.optbtn.active .t{color:var(--accent-ink)}
.optbtn .s{font-size:11.5px;color:var(--ink3);margin-top:3px;line-height:1.4}
.optbtn:disabled{opacity:.5;cursor:default}
.ia-result{margin-top:14px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:12px}
.mini-row{display:flex;gap:18px;flex-wrap:wrap}
.mini .ml{font-size:10.5px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.5px}
.mini .mv{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:15px;margin-top:3px}
.ml2{font-size:10.5px;font-weight:600;color:var(--ink3);text-transform:uppercase;letter-spacing:.5px}
.ia-text{font-size:13px;color:var(--ink2);line-height:1.6;margin-top:5px;white-space:pre-wrap}
.ia-imp{font-size:12.5px;color:#B26B00;line-height:1.6;margin-top:5px;white-space:pre-wrap}
.note{font-size:11.5px;color:var(--ink3);margin-top:8px}
.success{background:#D1FAE5;border:1px solid #BCE3CF;border-radius:12px;padding:14px;font-size:13px;color:#15803D;display:flex;gap:8px;align-items:center}
.warn{font-size:13px;color:#C12B33;display:flex;gap:8px;align-items:center}
.loading{display:flex;align-items:center;gap:8px;margin-top:12px;color:var(--accent);font-size:13px}
.saved-hint{font-size:11px;font-weight:700;color:#00FFC9;opacity:0;transition:.2s}
/* Croix de suppression d'un élément d'historique (admin) — visible au survol de la ligne uniquement */
.hist-del{position:absolute;top:7px;right:0;width:22px;height:22px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ink3);cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .12s,background .12s,color .12s}
.histrow:hover .hist-del{opacity:1}
.hist-del:hover{background:#FDECEC;color:#C12B33}
/* Copier la note d'un élément d'historique — même logique que la croix, posée juste à sa gauche */
.hist-copy{position:absolute;top:7px;width:22px;height:22px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ink3);cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .12s,background .12s,color .12s}
.histrow:hover .hist-copy{opacity:1}
.hist-copy:hover{background:var(--surface-alt);color:var(--ink)}
.hist-copy.ok{opacity:1;color:var(--accent-ink,#067A5E)}
.saved-hint.show{opacity:1}
.spin{animation:sp 1s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* ---------- LOGIN ---------- */
.login{position:fixed;inset:0;background:var(--bg);display:grid;place-items:center;padding:24px;z-index:100}
.login .box{width:100%;max-width:384px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:32px;text-align:center;box-shadow:0 8px 30px rgba(20,25,37,.07)}
.login .logo{width:50px;height:50px;border-radius:12px;background:var(--accent);display:grid;place-items:center;margin:0 auto 18px}
.login h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:23px;letter-spacing:-.4px}
.login .s{color:var(--ink3);font-size:13.5px;margin:6px 0 26px}
.login input{width:100%;padding:11px 13px;border-radius:10px;border:1px solid var(--line);font-size:14px;color:var(--ink);outline:none;margin-bottom:12px;background:var(--surface-alt)}
.login input:focus{border-color:var(--accent)}
.login .gbtn{width:100%;padding:11px;border-radius:10px;background:var(--accent);color:var(--accent-on,#fff);font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px}
.login .foot{color:var(--ink3);font-size:11.5px;margin-top:16px;line-height:1.5}
.hidden{display:none!important}
@keyframes nm-spin{to{transform:rotate(360deg)}}
.nm-spin{animation:nm-spin .8s linear infinite;transform-origin:50% 50%}
/* Espace admin — toggles & cartes de rôle (style Discord) */
input[type=checkbox].permsw{appearance:none;-webkit-appearance:none;width:38px;height:21px;border-radius:999px;background:var(--line2);position:relative;cursor:pointer;flex:none;transition:background .15s;border:none;margin:0}
input[type=checkbox].permsw:checked{background:var(--accent,#15803D)}
input[type=checkbox].permsw::after{content:"";position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 1px 3px rgba(0,0,0,.35)}
input[type=checkbox].permsw:checked::after{left:19px}
input[type=checkbox].permsw:disabled{opacity:.45;cursor:not-allowed}
.permrow{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:8px}
.permrow:hover{background:var(--surface-alt)}
.permcat{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink3);margin:14px 0 2px;display:flex;align-items:center;gap:6px}
.rolecard{border:1px solid var(--line2);border-radius:12px;margin-bottom:13px;overflow:hidden;background:var(--surface)}
.rolecard .rhead{display:flex;align-items:center;gap:9px;padding:11px 13px;border-bottom:1px solid var(--line2)}
.rolecard .rbody{padding:6px 12px 12px}


/* ---- (2e bloc <style>, déplacé du <body>) ---- */

#motivBtn{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:var(--surface);box-shadow:0 6px 24px rgba(20,25,37,.28);display:flex;align-items:center;justify-content:center;font-size:27px;cursor:pointer;z-index:90;border:1px solid var(--line);transition:transform .15s;overflow:visible}
#motivBtn:hover{transform:scale(1.09)}
#motivBtn .loco{display:inline-block;animation:motivChug 1.7s ease-in-out infinite;transform-origin:center}
@keyframes motivChug{0%,100%{transform:translateX(-1.5px) rotate(-2deg)}50%{transform:translateX(1.5px) rotate(2deg)}}
#motivBtn.running .loco{animation:motivRun .45s linear infinite}
@keyframes motivRun{0%{transform:translateX(-2.5px) translateY(0)}50%{transform:translateX(2.5px) translateY(-1.5px)}100%{transform:translateX(-2.5px) translateY(0)}}
#motivBtn .smoke{position:absolute;top:8px;left:46%;width:7px;height:7px;border-radius:50%;background:var(--ink3);opacity:0}
#motivBtn.running .smoke{animation:motivSmoke .9s ease-out infinite}
@keyframes motivSmoke{0%{opacity:.45;transform:translateY(0) scale(.5)}100%{opacity:0;transform:translateY(-20px) scale(1.4)}}
#motivBtn .badge{position:absolute;bottom:-2px;right:-2px;background:var(--accent,#2563EB);color:#fff;font-size:10.5px;font-weight:700;padding:1px 5px;border-radius:8px;font-family:'Space Grotesk',sans-serif}
#motivPanel{position:fixed;right:22px;bottom:90px;width:min(480px,96vw);height:min(780px,90vh);background:var(--bg);border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 50px rgba(20,25,37,.32);z-index:90;display:flex;flex-direction:column;overflow:hidden}
#motivPanel.maxd{right:16px!important;bottom:16px!important;width:calc(100vw - 32px)!important;height:calc(100vh - 32px)!important}
.motiv-rz{position:absolute;z-index:8}
.motiv-rz.t{top:0;left:18px;right:18px;height:11px;cursor:ns-resize}
.motiv-rz.l{left:0;top:18px;bottom:18px;width:11px;cursor:ew-resize}
.motiv-rz.tl{top:0;left:0;width:24px;height:24px;cursor:nwse-resize}
#motivPanel.maxd .motiv-rz{display:none}
.motiv-head{padding:12px 14px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:15px}
.motiv-head .x{margin-left:auto;background:none;border:0;color:var(--ink3);cursor:pointer;font-size:18px;line-height:1}
.motiv-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.motiv-msg{max-width:88%;padding:10px 13px;border-radius:12px;font-size:13.5px;line-height:1.55;white-space:pre-wrap;word-break:break-word;font-family:'Space Grotesk',sans-serif}
.motiv-msg b{font-weight:700}
.motiv-msg.u{align-self:flex-end;background:var(--accent,#2563EB);color:var(--accent-on,#fff);border-bottom-right-radius:4px}
.motiv-msg.a{align-self:flex-start;background:var(--surface-alt);color:var(--ink);border-bottom-left-radius:4px}
.motiv-inp{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
.motiv-inp input{flex:1;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface-alt);color:var(--ink);font-size:13px}
.motiv-inp button{border:0;border-radius:12px;background:var(--accent,#2563EB);color:var(--accent-on,#fff);font-weight:600;padding:0 14px;cursor:pointer}
.motiv-inp #motivAddBtn,.motiv-inp #motivMicBtn{background:var(--surface-alt);color:var(--ink);border:1px solid var(--line)}
#motivRecBar{display:none;align-items:center;gap:8px;padding:10px;border-top:1px solid var(--line)}
#motivRecBar.on{display:flex}
#motivWaveWrap{position:relative;flex:1;display:flex;min-width:0}
#motivWave{flex:1;height:38px;width:100%;background:var(--surface-alt);border:1px solid var(--line);border-radius:12px}
#motivRecStatus{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;font-family:'Space Grotesk',sans-serif;color:var(--ink);pointer-events:none;text-align:center;padding:0 8px}
#motivRecBar.listening #motivRecStatus{display:none}
#motivHead{cursor:grab;user-select:none}
#motivHead:active{cursor:grabbing}
#motivHead button{cursor:pointer}
/* Markdown MOTIV */
.motiv-h{font-weight:700;font-family:'Space Grotesk',sans-serif;margin:7px 0 2px;line-height:1.3}
.motiv-h.h1{font-size:1.28em}
.motiv-h.h2{font-size:1.16em}
.motiv-h.h3{font-size:1.06em}
.motiv-hr{border:0;border-top:1px solid var(--line);margin:9px 0}
.motiv-li{margin:1px 0}
.motiv-sp{height:6px}
.motiv-msg code{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:0 4px;font-size:.92em}
.motiv-tbl{border-collapse:collapse;margin:6px 0;font-size:.94em;width:100%}
.motiv-tbl th,.motiv-tbl td{border:1px solid var(--line);padding:4px 8px;text-align:left;vertical-align:top}
.motiv-tbl th{background:var(--surface);font-weight:700}
/* Plein écran : conversation centrée + agrandie, bulles rapprochées, focus sur les réponses */
#motivPanel.maxd .motiv-msgs{padding-left:max(16px,calc(50% - 470px));padding-right:max(16px,calc(50% - 470px));gap:8px}
#motivPanel.maxd .motiv-msg{max-width:94%;font-size:15px;line-height:1.62}
#motivPanel.maxd .motiv-msg.a{background:var(--surface-alt)}
#motivRecBar button{border:0;border-radius:12px;width:44px;height:38px;font-size:17px;font-weight:700;cursor:pointer;flex:0 0 auto}
#motivRecCancel{background:var(--surface-alt);color:var(--ink);border:1px solid var(--line)}
#motivRecOk{background:var(--accent,#2563EB);color:var(--accent-on,#fff)}
#motivDrop{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:rgba(3,255,201,.10);border:2px dashed var(--accent,#00FFC9);border-radius:16px;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:15px;color:var(--ink);z-index:6;pointer-events:none}
#motivPanel.dragover #motivDrop{display:flex}
/* ===== Stepper d'étapes (fiche affaire) — style SAYCO + tooltip moderne ===== */
.aff-stepw{position:relative}
/* Coins adoucis. clip-path decoupe la boite APRES le border-radius : seuls les bords que
   le polygone ne touche pas restent arrondis (bord gauche de la 1re fleche, hauts/bas).
   On ne peut pas mettre overflow:hidden sur la barre, cela masquerait .aff-tip. */
.aff-step{border-radius:8px}
.aff-step:hover{filter:brightness(1.05)}
.aff-step.is-active{box-shadow:0 3px 12px rgba(20,25,37,.22)}
.aff-tip{
  position:absolute;left:50%;top:calc(100% + 11px);transform:translateX(-50%);
  background:#1B2130;padding:9px 13px;border-radius:12px;
  display:flex;flex-direction:column;gap:2px;white-space:nowrap;text-align:left;
  box-shadow:0 14px 36px rgba(20,25,37,.34);opacity:0;visibility:hidden;
  z-index:40;pointer-events:none; /* plus de liseré vert à gauche (retiré le 10/07/2026) */
}
.aff-stepw:hover .aff-tip{opacity:1;visibility:visible}
.aff-tip b{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:12.5px;color:#fff;line-height:1.25}
.aff-tip span{font-size:11.5px;font-weight:500;color:#B9C1D2;line-height:1.25}
.aff-tip::before{content:"";position:absolute;left:50%;top:-5px;transform:translateX(-50%) rotate(45deg);width:10px;height:10px;background:#1B2130;border-radius:6px}
/* Blocs Client/Business/Détails de la fiche affaire : marge entre blocs, espacement interne homogène & resserré */
.afblk+.afblk{margin-top:28px}
body:has(.drawer.open) #searchWrap{display:none !important}
.afblk>h4{margin:0 !important}
.afblk>*+*{margin-top:9px !important}
.afblk .fld{margin-bottom:0 !important}
/* Badges-icônes du type d'activité (formulaire inline), une seule ligne, libellé au survol */
.aff-atype{position:relative;padding:0;width:38px;height:34px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid var(--line);background:var(--surface-alt);color:var(--ink2);font-size:16px;line-height:1;cursor:pointer;transition:border-color .12s,background .12s}
.lf-view{display:flex;align-items:center;gap:6px;min-height:38px;border:1px solid var(--line);border-radius:8px;background:var(--surface-alt);padding:0 6px 0 11px}
.lf-link{color:var(--ink);cursor:pointer;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.lf-link:hover{color:var(--accent,#00FFC9)}
.lf-edit-btn{flex:0 0 auto;background:none;border:0;cursor:pointer;font-size:13px;opacity:0;padding:4px;line-height:1;transition:opacity .12s}
/* Le crayon d'édition n'apparaît qu'au survol (ou focus clavier) de son champ */
.biz-field:hover .lf-edit-btn,.ci-field:hover .lf-edit-btn,.lf-view:hover .lf-edit-btn,#affAttr:hover .lf-edit-btn,
.biz-field:focus-within .lf-edit-btn,.ci-field:focus-within .lf-edit-btn,.lf-view:focus-within .lf-edit-btn{opacity:.7}
.lf-edit-btn:hover{opacity:1!important}
/* ===== Survol des textes cliquables : vert SAYCO =====
   Attention : --accent vaut #00FFC9 en theme clair mais #6E84FF (BLEU) en theme sombre.
   On ne peut donc pas s'en servir pour « le vert SAYCO ». D'ou --link-hover, defini
   par theme : le vert lisible (#067A5E) sur fond clair, le vert vif sur fond sombre.
   `!important` : la plupart des elements cliquables portent leur couleur en style inline
   depuis le JS, qui l'emporte sur une regle de feuille de style. */
.hist-link{color:var(--ink2);white-space:nowrap;cursor:pointer;transition:color .12s}
.hist-edit{transition:color .12s}
a,.pitem,.crm-ent,.crm-vbtn{transition:color .12s}
a:hover,a:focus-visible,
.pitem:hover,
.hist-link:hover,
.hist-edit:hover,
.crm-ent:hover,
.crm-vbtn:hover{color:var(--link-hover) !important}
.lf-edit-btn svg{display:block}
.field-err{border-color:#C12B33 !important}
.field-err::placeholder{color:#C12B33 !important;opacity:1}
.aff-atype:hover{border-color:var(--tc,var(--accent,#00FFC9))}
.aff-atype{color:var(--ic,var(--ink2))}
.aff-atype.on{background:var(--tc,var(--accent,#00FFC9));border-color:var(--tc,var(--accent,#00FFC9));color:var(--tcon,var(--accent-on,#0A2A23))}
.aff-atype[data-tip]:hover::after{content:attr(data-tip);position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);background:#1B2130;color:#fff;font-size:10.5px;font-weight:600;line-height:1.3;padding:5px 9px;border-radius:8px;white-space:nowrap;box-shadow:0 8px 24px rgba(20,25,37,.28);z-index:50;pointer-events:none}
.aff-atype[data-tip]:hover::before{content:"";position:absolute;left:50%;top:calc(100% + 3px);transform:translateX(-50%) rotate(45deg);width:8px;height:8px;background:#1B2130;z-index:50;pointer-events:none;border-radius:6px}
/* (i) « Eval. candidat » : apparait quand ce type est choisi et explique au survol pourquoi
   l'affaire, l'organisation et le lead sont grises. Remplace un bandeau qui prenait trop de place. */
.amevalinfo{position:relative;display:none;align-items:center;justify-content:center;width:22px;height:34px;flex:0 0 auto;color:var(--ink3);cursor:help}
.amevalinfo.on{display:inline-flex}
.amevalinfo:hover{color:#B4670A}
.amevalinfo[data-tip]:hover::after{content:attr(data-tip);position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);background:#fff;color:var(--ink);border:1px solid var(--line);font-size:11px;font-weight:500;line-height:1.45;padding:8px 11px;border-radius:8px;white-space:normal;width:max-content;max-width:250px;box-shadow:0 8px 24px rgba(20,25,37,.18);z-index:80;pointer-events:none}
.nota-tip{position:relative}
.nota-tip[data-tip]:hover::after{content:attr(data-tip);position:absolute;right:0;bottom:calc(100% + 5px);background:#fff;color:var(--ink);border:1px solid var(--line);font-size:11px;font-weight:500;line-height:1.4;padding:7px 10px;border-radius:8px;white-space:pre-line;width:max-content;max-width:280px;box-shadow:0 8px 24px rgba(20,25,37,.18);z-index:80;pointer-events:none}

/* ===== Glisser-déposer de CV (plein écran) ===== */
/* Indice affiché pendant qu'on glisse un fichier au-dessus de la fenêtre.
   pointer-events:none IMPÉRATIF : le drop doit traverser cet indice pour atteindre la vraie
   cible (zone de dépôt spécifique ou body), sinon il atterrirait sur l'indice. */
.cv-draghint{position:fixed;inset:0;z-index:300;pointer-events:none;display:flex;align-items:center;justify-content:center;background:rgba(6,122,94,.14);backdrop-filter:blur(1.5px)}
.cv-draghint-box{display:flex;flex-direction:column;align-items:center;gap:7px;padding:34px 46px;border:2.5px dashed var(--accent-ink,#067A5E);border-radius:20px;background:var(--surface);box-shadow:0 20px 60px rgba(20,25,37,.28);color:var(--accent-ink,#067A5E)}
.cv-draghint-box>div{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:17px;color:var(--ink)}
.cv-draghint-box>span{font-size:12.5px;color:var(--ink3)}
/* Panneau ANCRÉ À GAUCHE (pas un overlay plein écran) : il reste ouvert pendant qu'on
   consulte les fiches à droite (le drawer candidat est large, docké à droite). Il ne se
   ferme QUE manuellement (croix) : on s'assure d'avoir traité tous les CV déposés.
   z-index 120 > drawer-bg (60) et drawer (70) : reste visible au-dessus, sans les recouvrir
   (ils sont à droite, le panneau à gauche). */
.cvdrop-panel{position:fixed;left:16px;top:64px;bottom:16px;width:min(430px,42vw);z-index:120;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 70px rgba(20,25,37,.34);overflow:hidden}
.cvdrop-head{display:flex;align-items:center;padding:15px 18px;border-bottom:1px solid var(--line2);font-family:'Space Grotesk',sans-serif;font-size:16px}
.cvdrop-head .x{background:none;border:0;font-size:16px;color:var(--ink3);cursor:pointer;line-height:1}
.cvdrop-list{overflow:auto;padding:8px 18px 18px}
.cvdrop-item{padding:12px 0;border-bottom:1px solid var(--line2)}
.cvdrop-item:last-child{border-bottom:0}
/* Nom du PDF déposé = bouton : clic pour OUVRIR le PDF (vérifier qu'il correspond à la fiche). */
.cvdrop-file{display:block;width:100%;text-align:left;font:inherit;font-size:11px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px;background:none;border:0;padding:0;cursor:pointer}
.cvdrop-file:hover{color:var(--link-hover);text-decoration:underline}
.cvdrop-body{display:flex;align-items:center;gap:10px;flex-wrap:wrap}


/* ---------- Bouton « Convertir en affaire » : effet gamifié arc-en-ciel ---------- */
.convaff-fx{position:relative;border:0;border-radius:12px;color:#0A2A23;font-weight:700;cursor:pointer;background:linear-gradient(135deg,var(--accent,#00FFC9),#00d9a8);box-shadow:0 2px 12px rgba(0,200,160,.35);transition:transform .15s ease,box-shadow .2s ease,color .2s ease;will-change:transform}
.convaff-fx svg{position:relative;z-index:1}
.convaff-fx:hover{color:#fff;background:linear-gradient(90deg,#ff004c,#ff8a00,#ffe600,#22e07a,#00c4ff,#7a5cff,#ff2fd0,#ff004c);background-size:300% 100%;animation:convaffRainbow 1s linear infinite,convaffShake .34s ease-in-out infinite,convaffPulse 1s ease-in-out infinite}
.convaff-fx:active{filter:brightness(1.05)}
@keyframes convaffRainbow{from{background-position:0% 50%}to{background-position:300% 50%}}
@keyframes convaffPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,0,128,.5),0 0 16px 3px rgba(0,200,255,.35)}50%{box-shadow:0 0 0 7px rgba(255,0,128,0),0 0 30px 10px rgba(120,92,255,.6)}}
@keyframes convaffShake{
 0%,100%{transform:translate(0,0) rotate(0deg) scale(1.05)}
 20%{transform:translate(-1.7px,1.1px) rotate(-1.4deg) scale(1.07)}
 40%{transform:translate(1.7px,-1.1px) rotate(1.4deg) scale(1.07)}
 60%{transform:translate(-1.3px,-1.1px) rotate(-.9deg) scale(1.05)}
 80%{transform:translate(1.3px,1.1px) rotate(.9deg) scale(1.07)}
}
@media(prefers-reduced-motion:reduce){.convaff-fx:hover{animation:convaffRainbow 1s linear infinite}}

/* Vue consolidée : filtres (dates, granularité) au même fond que le sélecteur recruteur */
.cfilt input,.cfilt select{background:var(--surface)}
.cfilt .fld input,.cfilt .fld select{height:32px;box-sizing:border-box;padding-top:5px;padding-bottom:5px}
.cfilt .fld{gap:2px}
.cfilt .fld label{font-size:10.5px}

/* Vue consolidée : tous les contrôles de filtre à la même hauteur, alignés en bas */
.cfilt{align-items:flex-end}
.cfilt .consoPreset{height:32px;box-sizing:border-box;display:inline-flex;align-items:center;padding-top:0;padding-bottom:0}
.cfilt .peoplebtn{height:32px;box-sizing:border-box}
.cfilt .fld{margin-bottom:0}

/* ============================================================
   RESPONSIVE MOBILE (< 768px) — 27/07/2026
   La prod était desktop-only : ce bloc rend le shell utilisable
   au doigt (sidebar off-canvas + burger, recherche adaptée,
   tables scrollables, FABs recalés, tiroir plein écran).
   ============================================================ */
@media (max-width: 767px), ((pointer: coarse) and (max-height: 500px)){
  /* ---- Shell : 1 colonne, sidebar off-canvas ---- */
  .app{grid-template-columns:1fr}
  .app.collapsed{grid-template-columns:1fr}
  .app.collapsed .main{grid-column:auto}
  .app .sidebar,
  .app.collapsed .sidebar{position:fixed;top:0;left:0;bottom:0;height:100dvh;width:min(300px,84vw);z-index:140;transform:translateX(-105%);transition:transform .26s cubic-bezier(.3,.8,.3,1);box-shadow:8px 0 40px rgba(20,25,37,.35);overflow:hidden}
  .app.mobile-nav .sidebar,
  .app.mobile-nav.collapsed .sidebar{transform:translateX(0)}
  /* Le mode replié (icônes) n'a pas de sens dans un tiroir : on ré-affiche les libellés */
  .app.collapsed .brand{flex-direction:row;justify-content:flex-start;gap:11px}
  .app.collapsed .brand .name,.app.collapsed .user .meta{display:block}
  .app.collapsed .nav button span,.app.collapsed .set-btn span{display:inline}
  .app.collapsed .nav button{justify-content:flex-start;gap:12px}
  .app.collapsed .nav button .count{display:inline-flex}
  .app.collapsed .nav-cat-h{display:block}
  .app.collapsed .set-btn{justify-content:flex-start}
  .app.collapsed .user{justify-content:flex-start}
  .app.collapsed .user .out{display:inline-flex}
  .collapse-btn{display:none}
  .sidebar-overlay{position:fixed;inset:0;background:rgba(20,25,37,.46);z-index:139;opacity:0;pointer-events:none;transition:opacity .2s}
  .app.mobile-nav .sidebar-overlay{opacity:1;pointer-events:auto}

  /* ---- Topbar : burger + recherche + cloche ---- */
  .topbar{padding:0 10px;height:56px;gap:8px}
  .topbar>div:has(#viewTitle){display:none} /* titre + sous-titre : la vue est identifiée par le menu */
  .search{top:8px;left:52px;right:56px;width:auto;transform:none}
  body:has(.drawer.open) .search{left:52px;right:56px}
  #searchWrap input{padding:10px 12px 10px 36px}
  #importTopBtn{display:none !important} /* Import : desktop uniquement */
  #updBtn{display:none !important} /* icône Nouveautés (ancrée à la recherche) : recouvrirait le burger */
  .top-actions{flex:none;margin-left:auto}

  /* ---- Contenu ---- */
  .content{padding:12px 10px 130px;scrollbar-gutter:auto}
  ::-webkit-scrollbar{width:4px;height:4px}

  /* ---- Cartes & tables : défilement horizontal fluide ---- */
  .card{overflow-x:auto;-webkit-overflow-scrolling:touch}
  /* Colonnes figées Prospection : 178px c'est la moitié de l'écran → 120px
     (uniquement la variante de base — les tables -ann/-org/-cand ont leur propre 1re colonne) */
  .ptable:not(.ptable-ann):not(.ptable-org):not(.ptable-cand) th:first-child,
  .ptable:not(.ptable-ann):not(.ptable-org):not(.ptable-cand) td:first-child{width:120px;min-width:120px;max-width:120px}
  .ptable:not(.ptable-ann):not(.ptable-org):not(.ptable-cand) th:nth-child(2),
  .ptable:not(.ptable-ann):not(.ptable-org):not(.ptable-cand) td:nth-child(2){left:120px}

  /* ---- Grilles inline générées en JS : linéarisées sur mobile ---- */
  .content div[style*="grid-template-columns:1fr 1fr"],
  .content div[style*="grid-template-columns:1.3fr 1fr"],
  .content div[style*="minmax(0,2fr) minmax(280px,1fr)"],
  .content div[style*="minmax(440px"],
  .content div[style*="minmax(340px"],
  .content div[style*="minmax(320px"]{grid-template-columns:1fr !important}
  /* Blocs qui s'étendent sur 2 colonnes (ex. « Appels » du dashboard Stats) :
     sur une grille passée à 1 colonne, le span créait une colonne implicite → blocs écrasés */
  .content div[style*="grid-column:span 2"]{grid-column:auto !important}

  /* ---- Grilles fluides ---- */
  .kpigrid{grid-template-columns:repeat(2,1fr);gap:10px}
  .grid2{grid-template-columns:1fr}
  .stats3{grid-template-columns:1fr;gap:8px}
  .donut-wrap{flex-direction:column;align-items:flex-start}
  .bar-row .lbl{width:96px}

  /* ---- Tiroir plein écran ---- */
  .drawer,.drawer.xl,.drawer.lg{width:100vw}
  .drawer-head{padding:12px 12px;flex-wrap:wrap;gap:8px}
  .drawer-body{padding:12px 10px calc(28px + env(safe-area-inset-bottom,0px))}
  .secbox{padding:12px}
  .x{width:38px;height:38px}

  /* ---- Popovers / menus : jamais hors écran ---- */
  .pop,.menu{max-width:calc(100vw - 12px);max-height:min(360px,62vh)}

  /* ---- FABs : plus petits, coin bas-droit, au-dessus du pouce ---- */
  #quickAddFab{right:10px;bottom:calc(74px + env(safe-area-inset-bottom,0px));width:48px;height:48px}
  #quickAddFab .plus{font-size:26px}
  #quickAddFab .kbd{display:none}
  #motivBtn{right:10px;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:48px;height:48px}
  #motivPanel{left:8px;right:8px;width:auto;bottom:calc(70px + env(safe-area-inset-bottom,0px));height:min(600px,72dvh)}
  .motiv-rz{display:none}

  /* ---- Panneaux ancrés ---- */
  .cvdrop-panel{left:8px;right:8px;width:auto;top:60px;bottom:12px}
  #actModal .amod{width:calc(100vw - 12px);max-height:88dvh;padding:14px 12px}

  /* ---- Onglets segmentés générés en JS (Prospects / Vue consolidée / Historique…) ---- */
  .prosub-seg{padding:6px 9px !important;font-size:12px !important}
  /* Groupe recruteur + onglets (toolbar Prospection & co) : autorisé à passer à la ligne */
  .content div[style*="gap:6px;flex:none"]{flex-wrap:wrap;flex:1 1 auto !important;min-width:0}

  /* ---- Anti-zoom iOS : les champs < 16px déclenchent un zoom au focus ---- */
  input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select{font-size:16px}
  .pop .psearch,#searchWrap input{font-size:16px}
}

/* Burger : n'existe que sur mobile */
.burger-btn{display:none}
@media (max-width: 767px), ((pointer: coarse) and (max-height: 500px)){
  .burger-btn{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
  .burger-btn:active{background:var(--line2)}
}

/* Écrans tactiles : les actions révélées au survol n'existent pas au doigt → visibles atténuées */
@media (pointer: coarse){
  .remu-edit,.tag-edit,.eval-edit,.lf-edit-btn,.annedit-pen,.hoverpen,.hist-del,.hist-copy{opacity:.55}
  .nav button{padding:12px 11px}
}

/* ---- Affaires (vue Liste) : lignes de hauteur uniforme, contenu tronqué à 2 lignes ---- */
.ptable-aff{border-collapse:separate;border-spacing:0}
.ptable-aff tbody tr{height:54px;content-visibility:auto;contain-intrinsic-size:0 54px}
.ptable-aff tbody td{vertical-align:middle;overflow:hidden}
.ptable-aff .cellClamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;line-height:1.3;max-height:2.6em}
.ptable-aff .affTitleClamp{max-width:none}
.ptable-aff .chipsClamp{display:flex;flex-wrap:wrap;gap:3px;max-height:2.6em;overflow:hidden;align-content:flex-start}
/* Raison de la perte : crayon d'edition qui apparait au survol de la ligne. */
.ptable-aff td.affLossTd,.ptable-aff td.affCanalTd{position:relative}
.ptable-aff .affLossVal,.ptable-aff .affCanalVal{padding-right:24px}
/* Canal d'acquisition : une seule ligne, trois petits points si ca deborde (pas de retour a la ligne). */
.ptable-aff .affCanalTxt{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35;min-height:16px}
.pop .canalrow:hover .canaledit,.pop .canaledit:focus-visible{opacity:1 !important}
.pop .canaledit:hover{background:var(--surface-alt) !important;color:var(--ink) !important}
.affLossPen,.affCanalPen{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:22px;height:22px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink2);cursor:pointer;opacity:0;transition:opacity .12s,color .12s,border-color .12s;box-shadow:0 1px 3px rgba(20,25,37,.12)}
.ptable-aff tr:hover .affLossPen,.ptable-aff tr:hover .affCanalPen,.affLossPen[data-open],.affCanalPen[data-open],.affLossPen:focus-visible,.affCanalPen:focus-visible{opacity:1}
.affLossPen:hover,.affCanalPen:hover{color:var(--ink);border-color:#2563EB}
@media (hover:none){.affLossPen,.affCanalPen{opacity:1}}
.ptable-aff .affCandCell:hover{background:var(--surface-alt);border-radius:6px}
.ie:hover{background:var(--surface-alt)}
/* Infobulle blanche pour tout contenu tronqué de la vue Liste */
#nmCellTip{position:fixed;z-index:10120;background:#fff;color:#141925;border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:12px;font-weight:500;line-height:1.4;max-width:340px;white-space:pre-line;box-shadow:0 8px 24px rgba(20,25,37,.18);pointer-events:none}

/* ===== Célébration « Placé » (drop en Signé sur le kanban candidats) ===== */
.placed-overlay{position:fixed;inset:0;z-index:9999;pointer-events:none;display:flex;align-items:center;justify-content:center}
.placed-canvas{position:absolute;inset:0;pointer-events:none}
.placed-banner{position:relative;overflow:hidden;text-align:center;padding:26px 42px 22px;border-radius:22px;color:#fff;
  background:radial-gradient(120% 140% at 50% 0%,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 55%),linear-gradient(140deg,#06301f 0%,#0b5c42 45%,#03b488 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.14) inset,0 24px 60px -12px rgba(0,255,201,.45),0 8px 26px rgba(0,0,0,.35);
  animation:placedBannerIn 620ms cubic-bezier(.16,1.2,.3,1) both}
.placed-banner.is-leaving{animation:placedBannerOut 480ms cubic-bezier(.4,0,1,1) both}
.placed-shine{position:absolute;top:0;bottom:0;width:55%;left:-60%;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.35) 50%,rgba(255,255,255,0) 100%);
  animation:placedShine 1150ms 380ms cubic-bezier(.3,0,.2,1) both}
.placed-trophy{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;margin-bottom:8px;border-radius:50%;font-size:27px;line-height:1;
  background:linear-gradient(160deg,#ffe89a 0%,#ffc93c 55%,#f5a524 100%);box-shadow:0 6px 20px rgba(255,201,60,.5);
  animation:placedTrophy 900ms cubic-bezier(.16,1.4,.3,1) both}
.placed-kicker{font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.placed-title{font-size:40px;line-height:1.05;font-weight:900;letter-spacing:-.02em;margin:2px 0 6px;
  background:linear-gradient(180deg,#fff 0%,#c9fff0 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.placed-name{font-size:17px;font-weight:800}
.placed-client{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.75);margin-top:1px}
.placed-amount{margin-top:12px;font-size:30px;font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:#ffdf6b;text-shadow:0 3px 16px rgba(255,201,60,.45)}
.placed-streak{margin-top:10px;display:inline-block;padding:4px 12px;border-radius:999px;font-size:11px;font-weight:700;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18)}
@keyframes placedBannerIn{0%{opacity:0;transform:scale(.72) translateY(18px);filter:blur(6px)}60%{opacity:1;transform:scale(1.05) translateY(0);filter:blur(0)}100%{opacity:1;transform:scale(1) translateY(0)}}
@keyframes placedBannerOut{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.94) translateY(-14px);filter:blur(4px)}}
@keyframes placedShine{0%{left:-60%}100%{left:115%}}
@keyframes placedTrophy{0%{transform:scale(.2) rotate(-35deg);opacity:0}55%{transform:scale(1.18) rotate(8deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
@media (prefers-reduced-motion:reduce){.placed-banner,.placed-banner.is-leaving,.placed-trophy,.placed-shine{animation:none!important}.placed-shine{display:none}}

/* Menu « Secteur de la mission » (wireSecteurCombo) : le confort avant la mecanique.
   - pas de barre horizontale : les libelles longs passent sur deux lignes au lieu de deborder ;
   - pas de barre verticale visible : la molette et les fleches suffisent a parcourir la liste. */
.popsec{overflow-x:hidden;overflow-y:auto}
.popsec::-webkit-scrollbar{width:9px;height:0}
.popsec::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px;border:2px solid var(--surface)}
.popsec::-webkit-scrollbar-track{background:transparent}
.popsec .pitem{white-space:normal;line-height:1.35}
.popsec .psep{height:1px;background:var(--line2);margin:6px 4px}
.popsec .pcreer{color:#2563EB;font-weight:600}

/* Referentiel des sources : le gerant renomme ou retire une source sans quitter le champ.
   Les outils n'apparaissent qu'au survol de la ligne — la liste reste une liste. */
.popsec .srcrow{justify-content:space-between}
.popsec .srcout{display:inline-flex;gap:2px;opacity:0;transition:opacity .12s;flex:0 0 auto}
.popsec .srcrow:hover .srcout,.popsec .srcout:focus-within{opacity:1}
.popsec .srcbtn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border:0;border-radius:6px;background:none;color:var(--ink3);cursor:pointer;padding:0}
.popsec .srcbtn:hover{background:var(--surface);color:var(--ink)}
.popsec .srcbtn[data-sup]:hover{color:#C12B33}

/* Bloc facturation : la source se lit comme dans le Dashboard — une bulle, pas un champ. */
.viv-chip{display:inline-block;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:700;
  background:#9CF5DC;color:#4B5563;white-space:nowrap}
/* Panneau de choix de la source : toutes les options d'un coup, aucune barre. */
.pop.srcpop{position:fixed;max-height:none;overflow:visible;padding:7px}
.pop.srcpop .pitem{white-space:normal;align-items:center}
.pop.srcpop .psep{height:1px;background:var(--line2);margin:6px 4px}

/* ---------- CALENDRIER MAISON ----------
   Remplace le calendrier natif de Chrome sur les champs marques data-kcal.
   Meme grammaire visuelle que les autres panneaux de Kama (.pop) : fond
   surface, bord --line, rayon 12, ombre douce ; la menthe SAYCO ne sert qu'a
   la date choisie, le bleu au jour d'aujourd'hui (information). */
input[type="date"][data-kcal]{cursor:pointer}
input[type="date"][data-kcal]::-webkit-calendar-picker-indicator{opacity:0;width:0;padding:0;margin:0;display:none}
.kcal{position:fixed;z-index:400;background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);padding:10px;width:252px;font-family:'Inter',sans-serif;user-select:none}
.kcal .kcal-h{display:flex;align-items:center;justify-content:space-between;gap:4px;margin-bottom:8px}
.kcal .kcal-nav{width:28px;height:28px;border-radius:8px;color:var(--ink2);font-size:17px;line-height:1;
  display:flex;align-items:center;justify-content:center}
.kcal .kcal-nav:hover{background:var(--surface-alt);color:var(--ink)}
.kcal .kcal-t{flex:1;height:28px;border-radius:8px;font-size:13px;font-weight:600;color:var(--ink);
  text-transform:capitalize;letter-spacing:-.1px}
.kcal .kcal-t:hover{background:var(--surface-alt)}
.kcal .kcal-sem{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:3px}
.kcal .kcal-sem span{text-align:center;font-size:10.5px;font-weight:600;color:var(--ink3);
  text-transform:uppercase;letter-spacing:.4px;line-height:20px}
.kcal .kcal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.kcal .kcal-d{height:30px;border-radius:8px;font-size:12.5px;color:var(--ink2);
  display:flex;align-items:center;justify-content:center;transition:background .1s}
.kcal .kcal-d:hover{background:var(--surface-alt);color:var(--ink)}
.kcal .kcal-d.hors{color:var(--ink3);opacity:.55}
.kcal .kcal-d.ajd{color:var(--blue);font-weight:700;box-shadow:inset 0 0 0 1px var(--line)}
.kcal .kcal-d.sel,.kcal .kcal-d.sel:hover{background:var(--accent);color:var(--accent-on);font-weight:700;box-shadow:none}
.kcal .kcal-mg{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.kcal .kcal-m{height:36px;border-radius:8px;font-size:12.5px;color:var(--ink2)}
.kcal .kcal-m:hover{background:var(--surface-alt);color:var(--ink)}
.kcal .kcal-m.sel{background:var(--accent);color:var(--accent-on);font-weight:700}
.kcal .kcal-racc{display:flex;gap:5px;margin-top:9px;padding-top:8px;border-top:1px solid var(--line2)}
.kcal .kcal-r{flex:1;height:26px;border:1px solid var(--line);border-radius:8px;background:var(--surface-alt);
  font-size:11.5px;font-weight:600;color:var(--ink2);cursor:pointer}
.kcal .kcal-r:hover{border-color:var(--accent);color:var(--ink)}
.kcal .kcal-r.sel{background:var(--accent);border-color:var(--accent);color:var(--accent-on);font-weight:700}
.kcal .kcal-racc + .kcal-f{margin-top:6px;padding-top:6px;border-top:0}
.kcal .kcal-f{display:flex;justify-content:space-between;align-items:center;gap:8px;
  margin-top:9px;padding-top:8px;border-top:1px solid var(--line2)}
.kcal .kcal-f button{font-size:11.5px;font-weight:600;color:var(--blue);padding:3px 6px;border-radius:6px}
.kcal .kcal-f button:hover{background:var(--surface-alt)}
.kcal .kcal-f .eff{color:var(--ink3)}
/* Le champ n'est plus une zone de saisie a segments : le calendrier est le seul
   chemin, donc on retire le surlignage bleu que Chrome pose sur le segment actif. */
input[type="date"][data-kcal]::selection{background:transparent}
input[type="date"][data-kcal]:focus::-webkit-datetime-edit-day-field,
input[type="date"][data-kcal]:focus::-webkit-datetime-edit-month-field,
input[type="date"][data-kcal]:focus::-webkit-datetime-edit-year-field{background:transparent !important;color:inherit !important;outline:none}
/* Un combobox ouvert depuis une fenetre maison (saycoConfirm, z-index 140) doit
   passer au-dessus d'elle : sinon le panneau des villes s'ouvre derriere le voile. */
body:has(#saycoConfirmOv) .pop{z-index:200}
/* ===== Pile du panneau d'import =====
   Le panneau etait a 145 : la fenetre « Etiquettes CRM » (#etiqOverlay, z-index 120) ouverte
   depuis la fiche organisation s'affichait DERRIERE lui, et elle n'etait pas seule — toutes les
   modales que le volet peut ouvrir vivent entre 120 et 161, avec des z-index ecrits en dur dans
   le JS. Les surelever une par une serait sans fin.
   Le panneau se place donc SOUS elles (112), et on descend les seuls elements de chrome qui le
   couvraient : la sidebar et son voile. La barre de recherche (95) et le bouton + (91) passent
   dessous d'eux-memes. NE PAS remonter #impOv au-dessus de 118 sans revoir tout ce bloc. */
body:has(#impOv) .sidebar{z-index:108}
body:has(#impOv) .sidebar-overlay{z-index:107}
/* Les popovers du panneau lui-meme (selecteur « Recruteur assigne ») passent devant tout. */
body:has(#impOv) .pop,body:has(#impOv) .menu{z-index:200}
/* Un clic sur une ligne de l'apercu ouvre la fiche de l'entreprise : elle passe devant le
   panneau (112) mais reste SOUS les modales qu'elle ouvre elle-meme (120 et plus). */
body:has(#impOv) .drawer{z-index:116}
body:has(#impOv) .drawer-bg{z-index:114}
/* Outils d'administration du referentiel des sources, dans le selecteur lui-meme. */
.pop.srcpop .srcrow{justify-content:flex-start;gap:7px}
.pop.srcpop .srccoche{margin-left:auto;color:var(--accent-ink,#067A5E);font-weight:700}
.pop.srcpop .srcout{margin-left:auto;display:inline-flex;gap:2px;opacity:0;transition:opacity .12s}
.pop.srcpop .srcrow:hover .srcout,.pop.srcpop .srcbtn:focus-visible{opacity:1}
.pop.srcpop .srccoche+.srcout{margin-left:6px}
.pop.srcpop .srcbtn{width:22px;height:22px;border:0;border-radius:6px;background:none;color:var(--ink3);
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.pop.srcpop .srcbtn:hover{background:var(--surface-alt);color:var(--ink)}
.pop.srcpop .pcreer{color:var(--blue);font-weight:600}
/* Une facture = son numero, puis ses informations juste dessous et serrees.
   L'espace separe les factures entre elles, pas les lignes d'une meme facture. */
/* Pas de marge negative : le conteneur coupe ce qui deborde, et les bords arrondis
   comme la bordure disparaissaient a gauche et a droite. La carte tient dedans. */
#affFacLien{padding-left:2px}
#affFacLien .facln{display:block;min-width:0;border-radius:11px;padding:6px 10px;margin:0;
  border:1px solid transparent;transition:background .12s,border-color .12s}
/* La liste EST le selecteur du bloc au-dessus : chaque ligne se clique pour montrer
   les chiffres de son candidat. Il faut donc que ca se voie et que ca reponde. */
#affFacLien .facln.cliq{cursor:pointer}
#affFacLien .facln.cliq:hover{background:var(--surface-alt);border-color:var(--line2)}
#affFacLien .facln.actif{background:var(--accent-soft,#E3FFF8);border-color:#00C4A0}
#affFacLien .facln.actif .facnum{color:var(--ink)}
/* La ligne selectionnee garde son vert au survol : basculer sur le gris donnait
   l'impression de la deselectionner. Elle fonce un peu, c'est tout. */
#affFacLien .facln.cliq.actif:hover{background:#D3FBF0;border-color:#00C4A0}
/* Le placement signe mais pas encore chiffre : present dans la liste, sinon on ne
   peut ni le voir ni le selectionner. */
#affFacLien .facln.vide .facnum{color:#8A5A00}
#affFacLien .facln.vide{background:#FEF6E7;border-color:#F5C87A}
#affFacLien .facln.vide:hover{background:#FDF0DC}
#affFacLien .faclock{margin-left:8px;font-size:10px;font-weight:800;color:#12703A;
  background:#DCF2E3;border-radius:999px;padding:1px 7px;white-space:nowrap}
#affFacLien .facnum{display:block;font-weight:650;color:var(--ink);font-size:12.5px;line-height:1.35}
/* Le nom du candidat prend sa propre ligne. A la suite du numero, un nom un peu long
   se coupait au milieu — « Maxime / Remoissonnet » — et la carte perdait sa structure.
   Trois lignes, toujours les memes : la reference, la personne, les chiffres. */
#affFacLien .faccand{display:block;font-weight:500;color:var(--ink2);font-size:12px;
  margin-left:0;margin-top:1px}
/* Un candidat signe sans facture, c'est du CA qui n'existe nulle part. */
/* La porte d'entree de la facturation d'un placement supplementaire. */
/* Toujours accessible, meme quand tout est facture : c'est par la qu'on ajoute
   le placement suivant d'un mandat a plusieurs postes. */
/* Le nom du placement affiche par le bloc : sans lui, on ne sait pas lequel on modifie. */
.aff-drawer .facwho,#drawer .facwho{margin-left:6px;padding:2px 9px;border-radius:999px;
  background:var(--accent-soft,#E3FFF8);color:#067A5E;font-size:11px;font-weight:800;
  letter-spacing:0;text-transform:none}
/* Volet affaire, blocs Business et Detail facturation (maquette validee par Theo le
   29/09/2026) : 5 px entre un titre et son champ, 14 px entre un champ et le titre
   suivant, 36 px de haut pour chaque champ. Avant : 4 et 9 px, des champs a 34, 36 et
   38 px, et rien sous « Date de facturation » — le titre suivant collait au champ du
   dessus, on ne savait plus a quel champ il appartenait. */
#affBiz>*+*,#affFacBody>*+*{margin-top:14px}
#affFacBody>:empty{margin-top:0}
#affBiz .fld,#affFacBody .fld{gap:5px}
#affBiz .fld input:not([type=checkbox]):not([type=radio]),
#affFacBody .fld input:not([type=checkbox]):not([type=radio]),
#affFacBody .fld select{height:36px;box-sizing:border-box}
/* La vignette du candidat place est vide tant qu'aucun candidat n'est choisi : elle
   comptait quand meme dans l'ecart du flex et decalait le champ de 7 px. */
#affCandPhoto:empty{display:none}
/* Une date vide s'affiche « jj/mm/aaaa » en noir, comme une date saisie : meme gris
   que le texte d'exemple des autres champs (classe posee par _datesVides). */
#affFacBody input[type=date].date-vide:not(:focus)::-webkit-datetime-edit{color:#757575}
/* Message a Theo : deux lignes suffisent, le champ s'agrandit a la main. Fige avec le
   reste une fois parti en facturation (meme gris pointille que les autres champs). */
#affMsgTheo{min-height:58px;line-height:1.45}
textarea.am-off{background:#E4E8EF;color:#8A91A3;border:1px dashed #C2C9D8;font-style:italic;cursor:not-allowed}
/* « Envoyer en facturation » : le geste qui remplace le mail au gerant. */
/* Adresses en copie : une bulle par adresse, comme un champ de destinataires de
   messagerie. Une liste separee par des virgules dans un champ texte, personne ne
   la relit — et on ne sait pas ou en retirer une. Les bulles grises viennent de la
   societe facturee : elles valent pour tous ses recrutements et se retirent depuis
   sa fiche, pas depuis un mandat. */
.ccbox{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:36px;padding:5px 8px;
  border:1px solid var(--line);border-radius:8px;background:var(--surface-alt);cursor:text}
.ccbox.fige{background:var(--surface-alt);opacity:.75;cursor:default}
.ccbox input{flex:1 1 130px;min-width:110px;border:0!important;background:none!important;padding:2px 0!important;
  font-size:12.5px;outline:none}
.ccpuce{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;
  background:var(--accent-soft,#E3FFF8);border:1px solid #00C4A0;color:var(--ink2);
  font-size:11.5px;font-weight:600;white-space:nowrap}
.ccpuce.herit{background:var(--surface);border-color:var(--line2);color:var(--ink3);font-weight:500}
.ccpuce .ccx{border:0;background:none;padding:0;margin:0;cursor:pointer;color:var(--ink3);
  font-size:14px;line-height:1;display:inline-flex}
.ccpuce .ccx:hover{color:var(--red,#C12B33)}
.facenvoi{margin-top:4px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
/* « Envoyer en facturation » porte le vert SAYCO et l'effet arc-en-ciel de
   « Convertir en affaire » : c'est le meme genre de geste — on acte une bonne
   nouvelle, autant que ca se fete. La couleur vient de .convaff-fx ; ici on ne
   pose que la taille, sinon le vert fonce d'origine gagnerait en specificite. */
.facenvoi button{padding:8px 14px;border:0;border-radius:9px;font:inherit;font-size:12.5px;
  font-weight:700;cursor:pointer}
.facenvoi button:not(.convaff-fx){background:var(--accent-ink,#067A5E);color:#fff}
.facenvoi button:not(.convaff-fx):hover{filter:brightness(1.08)}
.facenvoi-s{font-size:11.5px;color:var(--ink3);line-height:1.35;flex:1;min-width:140px}
/* Le bandeau prend la menthe de la ligne de facture selectionnee, juste dessous :
   c'est le meme placement, il n'y a pas de raison que ce soit deux couleurs. Le
   cadenas et le mot « figees » disent la fermeture ; la couleur n'a pas a le crier. */
.facenvoi.fait{padding:8px 11px;border-radius:11px;background:var(--accent-soft,#E3FFF8);
  border:1px solid #00C4A0;color:var(--ink2,#3A4152);font-size:12px;font-weight:600}
.facenvoi.fait .faccad{margin-right:6px;vertical-align:-2px;opacity:.7}
.facenvoi.fait button{background:none;color:var(--accent-ink,#067A5E);text-decoration:underline;padding:0;
  font-size:11.5px;font-weight:600;cursor:pointer}
.facenvoi.fait button:hover{color:var(--ink)}
#affFacLien .facadd{align-self:flex-start;margin-top:2px;padding:4px 0;border:0;background:none;
  font:inherit;font-size:11.5px;font-weight:600;color:var(--blue,#2563EB);cursor:pointer}
#affFacLien .facadd:hover{text-decoration:underline}
#affFacLien .facbtn{display:inline-block;margin-left:4px;padding:2px 8px;border-radius:999px;
  border:1px solid #E0A94B;background:#fff;color:#7A4E12;font:inherit;font-size:11px;font-weight:700;cursor:pointer}
#affFacLien .facbtn:hover{background:#FDF0DC}
#affFacLien .facremp{display:block;margin-bottom:2px;padding:6px 10px;border-radius:8px;
  background:var(--surface-alt);border:1px solid var(--line);color:var(--ink2);font-size:11.5px;line-height:1.35}
#affFacLien .facalerte{display:block;margin-bottom:2px;padding:6px 10px;border-radius:8px;
  background:#FEF6E7;border:1px solid #F5C87A;color:#7A4E12;font-size:11.5px;font-weight:600;line-height:1.35}
#affFacLien .facdet{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:1px;line-height:1.35}
/* Date de facturation dans la ligne Facture : editable, mais discrete. */
#affFacLien input.facdt{font-size:11.5px;line-height:1.4;color:var(--ink3);font-family:inherit;
  border:1px solid transparent;background:transparent;border-radius:6px;padding:1px 4px;
  margin:0;min-height:0;height:auto;width:auto;min-width:0;max-width:104px;flex:0 0 auto;
  box-shadow:none;cursor:pointer}
#affFacLien input.facdt:hover{border-color:var(--line);background:var(--surface-alt);color:var(--ink2)}
#affFacLien input.facdt:focus{outline:none;border-color:var(--accent);color:var(--ink);background:var(--surface)}
/* Fin de periode d'essai : une duree, pas une date a calculer de tete. */
.pe-bloc .pe-racc{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:7px}
.pe-bloc .pe-chip{padding:3px 10px;border:1px solid var(--line);border-radius:14px;background:var(--surface-alt);
  color:var(--ink2);font-size:11.5px;font-weight:600;cursor:pointer;line-height:1.5}
.pe-bloc .pe-chip:hover{border-color:var(--accent);color:var(--ink)}
.pe-bloc .pe-chip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-on);font-weight:700}
.pe-bloc .pe-saisie{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.pe-bloc .pe-saisie input{width:66px;flex:0 0 auto}
.pe-bloc .pe-saisie select{width:auto;flex:0 0 auto;padding-right:26px}
.pe-bloc .pe-fl{color:var(--ink3);font-size:13px}
.pe-bloc .pe-fin{font-size:13.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.pe-bloc .pe-fin.vide{color:var(--ink3);font-weight:500}
.pe-bloc .pe-note{font-size:11px;color:var(--ink3);margin-top:5px}
.pe-bloc .pe-main{background:none;border:0;padding:0;font-size:11px;font-weight:600;color:var(--blue);cursor:pointer;text-decoration:underline}

/* ---- Recherche au sens (onglet Candidats, 11/09/2026) ----
   Le Sens n'est pas un mode réglé avant de taper : c'est ce qui suit un clic sur
   « Chercher au sens » dans le champ. --sens = teinte du mode (violet validé sur maquette ;
   à basculer sur var(--blue) si la palette « une teinte = un sens » doit primer). */
.cand-fld{--sens:var(--violet);--sens-soft:var(--violet-soft);flex:1;min-width:240px;display:flex;align-items:center;gap:6px;padding:0 6px 0 0;border-radius:10px;border:1px solid var(--line);background:var(--surface-alt);height:38px;transition:border-color .15s,background .15s}
.cand-fld:focus-within{border-color:var(--accent)}
.cand-fld.sens{border-color:var(--sens);background:color-mix(in srgb,var(--sens-soft) 45%,var(--surface-alt))}
.cand-fld.sens:focus-within{border-color:var(--sens)}
/* La bordure et le fond appartiennent au conteneur .cand-fld, jamais au champ : sinon on voit une
   barre dans la barre. La regle visait #candSearch seul — la vue Process (#procSearch) a herite du
   style generique des input et dessinait sa propre bordure (constate par Theo le 14/09). */
.cand-fld input{flex:1;min-width:0;border:0 !important;background:none !important;padding:9px 12px;height:100%;font-size:13px}
.cand-sens-go{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:7px;font-size:12px;font-weight:700;border:1px solid var(--sens);color:var(--sens);background:transparent;white-space:nowrap;flex:0 0 auto;transition:background .15s,color .15s}
.cand-sens-go.soft{border-color:color-mix(in srgb,var(--sens) 45%,var(--surface));background:var(--surface)}
.cand-sens-go.soft:hover{background:var(--sens-soft)}
.cand-sens-go.hot{background:var(--sens);color:#fff}
.cand-sens-go[disabled]{opacity:.85;cursor:progress}
.cand-sens-go kbd{font-family:inherit;font-size:10px;font-weight:600;opacity:.75;border:1px solid currentColor;border-radius:4px;padding:0 4px}
.cand-sens-back{display:inline-flex;align-items:center;height:28px;padding:0 9px;border-radius:7px;font-size:11.5px;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink2);white-space:nowrap;flex:0 0 auto}
.cand-sens-back:hover{background:var(--surface-alt)}
@keyframes cand-spin{to{transform:rotate(360deg)}}
.cand-spin{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:cand-spin .7s linear infinite;vertical-align:-2px}
/* sous le champ : syntaxe ignorée en Sens */
.cand-sens-sub{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 8px;font-size:11.5px;color:var(--ink3)}
.cand-sens-sub s{color:var(--ink3);background:var(--surface-alt);border:1px dashed var(--line);border-radius:6px;padding:0 6px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px}
/* ligne d'état du Sens */
.cand-sens-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:30px;margin-bottom:10px;font-size:12px;color:var(--ink3)}
.cand-sens-line b{color:var(--ink);font-weight:600}
.cand-sens-line .bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;padding:8px 12px;border-radius:10px;font-size:12.5px}
.cand-sens-line .bar.info{background:var(--violet-soft);color:var(--violet)}
.cand-sens-line .bar.info b{color:inherit;font-weight:700}
.cand-sens-line .bar.warn{background:var(--orange-soft);color:var(--orange)}
.cand-sens-line .bar.warn b{color:inherit;font-weight:700}
.cand-sens-line .bar.err{background:var(--red-soft);color:var(--red)}
.cand-sens-line .bar .chip{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:600;border:1px solid currentColor;background:var(--surface);color:inherit;cursor:pointer}
.cand-sens-line .busy{display:inline-flex;align-items:center;gap:8px;color:var(--violet)}
/* liste grisée : chargement, ou requête modifiée pas encore relancée */
.cand-sens-dim table{opacity:.45;pointer-events:none;filter:saturate(.6)}
/* colonne Proximité (remplace « Créé le » tant que le Sens est actif) */
.cand-prox{display:inline-flex;align-items:center;gap:7px;font-size:11px;color:var(--ink2);font-weight:600;white-space:nowrap}
.cand-prox .dots{display:inline-flex;gap:3px}
.cand-prox .dots i{width:7px;height:7px;border-radius:50%;background:var(--line);display:block}
.cand-prox .dots i.on{background:var(--violet)}
.cand-prox-ex{display:inline-flex;padding:2px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-size:10.5px;font-weight:700}

/* ---- Vue Process : défilement des colonnes sans barre (choix de Théo, 15/09) ----
   Six barres verticales à l'écran, c'est six traits qui ne disent rien de plus que « ça continue ».
   On les masque et on garde le défilement (molette, trackpad, clavier) ; ce qui reste à voir est
   annoncé par un dégradé en bas de colonne, posé par .proc-fade et allumé au défilement.
   overflow-x:hidden : une carte 1 px trop large faisait apparaître une barre HORIZONTALE dans la
   colonne — il n'y a jamais rien à voir sur le côté ici. */
.proc-zone{overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}
.proc-zone::-webkit-scrollbar{width:0;height:0;display:none}
.proc-fade{position:absolute;left:6px;right:6px;bottom:6px;height:34px;pointer-events:none;z-index:2;
  border-bottom-left-radius:7px;border-bottom-right-radius:7px;opacity:0;transition:opacity .18s}
/* ---- Process : pré-liste élargie (bêta, 07/10/2026) ----
   Maquette validée le 07/10 dans la vraie vue (maquettes/sequences.js, blocs c9 … c23). Une ligne par
   candidat sur une grille commune aux titres et aux lignes ; les autres étapes en bandes de 40 px.
   Fenêtre étroite (requêtes de conteneur) : les bandes d'abord, puis Prochain geste, Poste actuel et
   Canaux. !important sur la largeur : mobile.css impose aux colonnes une largeur d'écran. */
.proc-largebtn{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;height:31px;padding:0 11px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:600 12.5px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.proc-largebtn:hover{border-color:#BFD3F8;color:var(--blue,#2563EB)}
.proc-largebtn.on{background:#E6F1FA;border-color:#BFD3F8;color:var(--blue,#2563EB)}
#procBoard.proc-large{container:procboard/inline-size}
#procBoard.proc-large>.proc-col[data-col="shortlist"]{flex:1 1 auto !important;min-width:0 !important;container:procpre/inline-size}
#procBoard.proc-large>.proc-rail{flex:0 0 40px !important;min-width:40px !important;max-width:40px;align-self:stretch;box-sizing:border-box;padding:8px 0;border-radius:10px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer}
#procBoard.proc-large>.proc-rail:hover{filter:brightness(.97)}
.proc-rail>b{writing-mode:vertical-rl;font-size:12px;color:var(--ink);white-space:nowrap}
.proc-rail>.proc-rail-n{font-size:10.5px;font-weight:700;color:var(--ink3)}
.pl-thead,.pl-row{display:grid;grid-template-columns:180px minmax(0,1fr) 64px 124px 128px;column-gap:10px;align-items:center}
.pl-thead{padding:0 9px 6px;font-size:9.5px;font-weight:800;letter-spacing:.05em;color:var(--ink3);text-transform:uppercase}
.pl-thead>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-row{height:36px;padding:0 8px;border-top:1px solid rgba(0,0,0,.05)}
.pl-row>div{min-width:0}
.pl-row>.pl-nom{display:flex;align-items:center;gap:8px}
.pl-row>.pl-nom>span:last-child{font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-row>.pl-metier{font-size:11.5px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-row>.pl-canaux{display:flex;align-items:center;gap:8px}
.pl-row>.pl-contact{display:flex;align-items:center}
.pl-row>.pl-next{font-size:11.5px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-filtre{display:flex;align-items:center;gap:8px;margin:0 2px 8px;padding:7px 10px;border-radius:9px;background:#FCF0DC;color:#B26B00;font-size:12px;font-weight:600}
.pl-filtre b{font-weight:800}
.pl-filtre button{flex:0 0 auto;margin-left:auto;border:0;border-radius:7px;height:24px;padding:0 10px;background:var(--surface);color:#B26B00;font:700 11.5px Inter,system-ui,sans-serif;cursor:pointer}
@container procboard (max-width:900px){#procBoard.proc-large>.proc-rail{display:none}}
@container procpre (max-width:680px){#procBoard:not(.pl-avecseq) .pl-thead,#procBoard:not(.pl-avecseq) .pl-row{grid-template-columns:180px minmax(0,1fr) 64px 124px}#procBoard:not(.pl-avecseq) .pl-next{display:none}}
@container procpre (max-width:540px){#procBoard:not(.pl-avecseq) .pl-thead,#procBoard:not(.pl-avecseq) .pl-row{grid-template-columns:minmax(0,1fr) 64px 124px}#procBoard:not(.pl-avecseq) .pl-metier{display:none}}
@container procpre (max-width:420px){#procBoard:not(.pl-avecseq) .pl-thead,#procBoard:not(.pl-avecseq) .pl-row{grid-template-columns:minmax(0,1fr) 124px}#procBoard:not(.pl-avecseq) .pl-canaux{display:none}}
/* Avec les séquences (bêta) : une case à cocher en tête de ligne et la colonne Séquence ; la barre d'actions
   de la sélection en bas, sombre (maquette c9, c17). Fenêtre étroite : « Poste actuel » part la première
   (900 px de pré-liste), puis Canaux (660), Prochain geste (540), Contact (420). La maquette effaçait
   « Prochain geste » dès 820 px : c'est la largeur du navigateur intégré de Théo. */
#procBoard.pl-avecseq .pl-thead,#procBoard.pl-avecseq .pl-row{grid-template-columns:22px 180px minmax(0,1fr) 64px 124px 112px 128px}
.pl-row>.pl-chk{display:grid;place-items:center;width:22px;height:22px;cursor:pointer;border-radius:6px}
.pl-row>.pl-chk:hover .pl-box{box-shadow:inset 0 0 0 1.5px var(--blue,#2563EB)}
.pl-box{width:15px;height:15px;border-radius:5px;box-shadow:inset 0 0 0 1.5px #B8BECB;display:grid;place-items:center;color:transparent;background:var(--surface)}
.pl-box svg{width:10px;height:10px}
.pl-row.pl-sel{background:#E6F1FA;box-shadow:inset 3px 0 0 var(--blue,#2563EB)}
.pl-row.pl-sel .pl-box{background:var(--blue,#2563EB);box-shadow:none;color:#fff}
.pl-row>.pl-seq{display:flex;align-items:center}
.pl-lancer{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 8px;border-radius:20px;border:1px dashed #BFD3F8;background:var(--surface);color:var(--blue,#2563EB);font:700 10.5px Inter,system-ui,sans-serif;cursor:pointer}
.pl-lancer svg{width:9px;height:9px}
.pl-lancer:hover{background:#F3F7FE}
#plBarre{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:940;background:#141925;color:#fff;border-radius:12px;box-shadow:0 14px 40px rgba(20,25,37,.35);padding:8px 10px 8px 14px;display:flex;align-items:center;gap:10px;font:12.5px Inter,system-ui,sans-serif;white-space:nowrap}
#plBarre button{height:30px;padding:0 12px;border-radius:8px;border:0;font:700 12.5px Inter,system-ui,sans-serif;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
#plBarre .pl-bseq{background:var(--accent,#00FFC9);color:#0A2A23}
#plBarre .pl-binv{background:#2A3142;color:#8A91A3;cursor:default}
#plBarre .pl-bx{background:none;color:#8A91A3;padding:0 6px}
@container procpre (max-width:900px){#procBoard.pl-avecseq .pl-thead,#procBoard.pl-avecseq .pl-row{grid-template-columns:22px minmax(0,1fr) 64px 124px 112px 128px}#procBoard.pl-avecseq .pl-metier{display:none}}
@container procpre (max-width:660px){#procBoard.pl-avecseq .pl-thead,#procBoard.pl-avecseq .pl-row{grid-template-columns:22px minmax(0,1fr) 124px 112px 128px}#procBoard.pl-avecseq .pl-canaux{display:none}}
@container procpre (max-width:540px){#procBoard.pl-avecseq .pl-thead,#procBoard.pl-avecseq .pl-row{grid-template-columns:22px minmax(0,1fr) 124px 112px}#procBoard.pl-avecseq .pl-next{display:none}}
@container procpre (max-width:420px){#procBoard.pl-avecseq .pl-thead,#procBoard.pl-avecseq .pl-row{grid-template-columns:22px minmax(0,1fr) 112px}#procBoard.pl-avecseq .pl-contact{display:none}}
/* écran vide : l'appel vers le Sens */
.cand-sens-cta{padding:34px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.cand-sens-cta h3{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:600;color:var(--ink)}
.cand-sens-cta p{margin:0;color:var(--ink3);font-size:12.5px;max-width:52ch}
.cand-sens-cta .big{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:10px;background:var(--violet);color:#fff;font-weight:700;font-size:13px;border:0;cursor:pointer}
.cand-sens-cta .big[disabled]{opacity:.85;cursor:progress}
/* « Tu cherchais » (02/10/2026, frontend/ui/tu-cherchais.mts) : à 0 résultat, le métier corrigé ou les
   noms proches — sous « Aucun exact pour … », dans la barre « classé au sens », dans la recherche du haut. */
.tc-proches{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:0 0 4px}
.tc-proches[hidden],.tc-inline[hidden]{display:none}
.tc-inline{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.tc-lbl{font-size:12.5px;color:var(--ink3)}
.tc-nom{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:420px;padding:4px 12px 4px 4px;border:1px solid var(--line);border-radius:999px;background:var(--surface);cursor:pointer;font:inherit;font-size:13px;color:var(--ink);text-align:left}
.tc-nom:hover,.tc-nom:focus-visible{border-color:var(--accent);background:var(--accent-soft);outline:none}
.tc-nom.tc-mot{padding:5px 14px}
.tc-nom b{font-weight:600;white-space:nowrap}
.tc-nom small{min-width:0;font-size:11.5px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-ava{border-radius:999px;object-fit:cover;flex-shrink:0}
.tc-ini{display:inline-grid;place-items:center;flex-shrink:0;border-radius:999px;background:var(--accent-soft);color:var(--ink);font-size:10.5px;font-weight:700}
.tc-genre{padding:1px 7px;border-radius:20px;background:var(--surface-alt);color:var(--ink3);font-size:10.5px;font-weight:600;white-space:nowrap}
.tc-gs-tete{padding:9px 10px 3px;color:var(--ink3);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
/* Recherche du haut (10/10/2026, maquette validée par Théo, journal 10/10 (4) et (5)) : sans vert foncé,
   lignes de 42 px, passage trouvé surligné, « pourquoi », « Voir les N », aide clavier, touche « / ». */
#gsBox .gs-cadre{display:flex;max-height:calc(74vh - 31px)}
#gsBox .gs-rail{flex:0 0 150px;border-right:1px solid var(--line);padding:6px;overflow:auto;background:var(--surface-alt)}
#gsBox.gs-recents .gs-rail{display:none}
#gsBox .gs-res{flex:1;min-width:0;overflow:auto;padding:6px}
#gsBox .gs-cat{position:relative;display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:12.5px;font-weight:500;color:var(--ink2)}
#gsBox .gs-cat:hover{background:var(--surface)}
#gsBox .gs-cat.on{background:var(--surface);font-weight:700;color:var(--ink)}
#gsBox .gs-cat.on::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:2px;background:var(--accent,#00FFC9)}
#gsBox .gs-ci{display:inline-flex;color:var(--ink3)}
#gsBox .gs-cat.on .gs-ci{color:var(--ink)}
#gsBox .gs-cl{flex:1;white-space:nowrap}
#gsBox .gs-cn{font-size:10.5px;color:var(--ink3)}
#gsBox .gs-h{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);padding:9px 10px 3px}
#gsBox .gs-hn{margin-left:7px;font-weight:600;letter-spacing:0;opacity:.85}
#gsBox .gs-ligne{display:flex;align-items:center;gap:9px;height:42px;box-sizing:border-box;padding:4px 10px;border-radius:8px;cursor:pointer}
#gsBox .gs-ligne.clos{opacity:.55}
#gsBox .gs-ic{flex-shrink:0;color:var(--ink3);display:inline-flex}
#gsBox .gs-tx{min-width:0;flex:1}
#gsBox .gs-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink);font-weight:600}
#gsBox .gs-s{font-size:11px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
#gsBox .gs-r{flex-shrink:0;margin-left:auto}
#gsBox .gs-ava{width:22px;height:22px;border-radius:999px;object-fit:cover;flex-shrink:0}
#gsBox .gs-ini{width:22px;height:22px;border-radius:999px;background:var(--accent-soft,#E3FFF8);color:var(--ink);display:grid;place-items:center;font-size:10.5px;font-weight:700;flex-shrink:0}
#gsBox .gs-sub{color:var(--ink2);cursor:pointer}
#gsBox .gs-sub:hover{color:var(--ink);text-decoration:underline}
#gsBox .gs-mt{color:var(--ink);font-weight:600}
#gsBox .gs-et{color:var(--ink2)}
#gsBox .gs-ent{color:var(--ink2);font-weight:500}
#gsBox .gs-badge{display:inline-block;padding:1px 7px;border-radius:20px;font-size:10.5px;font-weight:600;white-space:nowrap}
#gsBox mark.gs-hl{background:#BFFFF2;color:inherit;border-radius:3px;padding:0 1px;margin:0 -1px}
#gsBox .gs-why{display:inline-block;padding:0 6px;border-radius:999px;background:var(--surface-alt);border:1px solid var(--line2);color:var(--ink2);font-size:10.5px;line-height:15px}
#gsBox .gs-why b{font-weight:600}
#gsBox .gs-voir{display:flex;align-items:center;gap:5px;padding:5px 10px 7px 41px;border-radius:8px;cursor:pointer;font-size:12px;color:var(--ink2)}
#gsBox .gs-voir svg{color:var(--ink3)}
#gsBox .gs-vide{padding:16px;color:var(--ink3)}
#gsBox .gs-astuce{padding:10px 10px 12px;color:var(--ink3);font-size:12px}
#gsBox .gs-pied{display:flex;gap:16px;justify-content:flex-end;align-items:center;padding:7px 12px;border-top:1px solid var(--line2);background:var(--surface-alt);font-size:11px;color:var(--ink3)}
#gsBox .gs-k{display:inline-block;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:10px;font-weight:700;padding:0 5px;line-height:16px;border:1px solid var(--line);border-radius:5px;background:var(--surface);color:var(--ink2);margin-right:4px}
#searchWrap .gs-slash{display:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--ink3);border:1px solid var(--line);border-radius:5px;padding:3px 6px;background:var(--surface);pointer-events:none}
#searchWrap:has(#search:placeholder-shown):not(:focus-within) .gs-slash{display:block}
@media (max-width:767px),(hover:none){#searchWrap .gs-slash{display:none!important}#gsBox .gs-pied{display:none}}
.cand-sens-line .tc-lbl{color:inherit}
.cand-sens-line .tc-nom{gap:6px;padding:2px 10px 2px 3px;font-size:12px}
.cand-sens-line .tc-nom.tc-mot{padding:3px 10px}
.cand-sens-line .tc-nom small{display:none}

/* ---- Bloc CV du volet candidat (13/09) : une carte fichier + un menu, plus de champ de recherche ---- */
/* Parcours LinkedIn du volet candidat (bêta parcours_linkedin, maquette validée par Théo le
   01/10/2026) : frise des postes, le poste actuel en vert SAYCO. */
.kparc{padding:2px 0 12px}
.kparc-tete{display:flex;align-items:baseline;gap:8px;margin:2px 0 9px}
.kparc-tete b{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3)}
.kparc-tete span{font-size:11px;color:var(--ink3)}
.kparc-liste{list-style:none;margin:0;padding:0 0 0 17px;position:relative}
.kparc-liste::before{content:"";position:absolute;left:4px;top:7px;bottom:9px;width:2px;border-radius:2px;background:var(--line2)}
.kparc-poste{position:relative;padding:0 0 10px}
.kparc-poste:last-child{padding-bottom:0}
.kparc-vieux{display:none}
.kparc.tout .kparc-vieux{display:block}
.kparc-pt{position:absolute;left:-17px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--surface);border:2px solid var(--line);box-sizing:border-box}
.kparc-poste.en-cours .kparc-pt{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.kparc-l{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.kparc-titre{font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.35;min-width:0}
.kparc-dates{font-size:11.5px;color:var(--ink3);white-space:nowrap;font-variant-numeric:tabular-nums}
.kparc-poste.en-cours .kparc-dates{color:var(--ink2);font-weight:600}
.kparc-l2{margin-top:1px}
.kparc-boite{font-size:11.5px;color:var(--ink2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kparc-boite b{font-weight:600}
.kparc-boite i{font-style:normal;color:var(--ink3)}
.kparc-duree{font-size:11px;color:var(--ink3);white-space:nowrap}
.kparc-desc{margin-top:4px;font-size:12px;line-height:1.45;color:var(--ink2);white-space:pre-line;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kparc-poste.a-desc{cursor:pointer}
.kparc-poste.ouvert .kparc-desc{display:block;-webkit-line-clamp:unset}
.kparc-plus{margin-top:8px;border:0;background:none;padding:0;color:var(--blue);font-weight:600;font-size:11.5px;cursor:pointer;font-family:inherit}
.kcvcard{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:10px;padding:9px 8px 9px 11px;background:var(--surface)}
.kcvcard .kcvico{color:#C12B33;flex-shrink:0;line-height:0;margin-top:1px}
.kcvcard .kcvbody{flex:1;min-width:0}
.kcvcard .kcvnm{display:block;font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;overflow-wrap:anywhere}
.kcvcard .kcvnm:hover{text-decoration:underline}
.kcvcard .kcvmeta{display:block;font-size:11.5px;color:var(--ink3);margin-top:2px}
.kcvcard .kcvmore{flex-shrink:0;border:0;background:none;color:var(--ink3);border-radius:7px;width:26px;height:26px;display:grid;place-items:center;cursor:pointer;padding:0}
.kcvcard .kcvmore:hover{background:var(--surface-alt);color:var(--ink)}
.kcvdz{border:1.5px dashed var(--line);border-radius:8px;padding:8px;text-align:center;font-size:12px;color:var(--ink3);cursor:pointer}
.kcvdz:hover{border-color:var(--ink3);color:var(--ink2)}
.kcvfind{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--blue,#2563EB);font-size:12px;font-weight:600;cursor:pointer;padding:0;font-family:inherit}
.kcvsub{font-size:11px;font-weight:700;color:var(--ink3);text-transform:uppercase;letter-spacing:.05em;margin:14px 0 4px}

/* Cale du rendu progressif (13/09) : une ligne vide qui tient la hauteur des lignes à venir, pour
   que la barre de défilement ne change pas de taille pendant le chargement. Jamais survolée. */
.ptable-cand tbody tr.cand-ph:hover td{background:transparent}
.ptable-cand tbody tr.cand-ph td{border:0;padding:0}
/* Liste stable (Candidats, 13/10) : ligne qui ne passe plus le filtre après une modif, estompée à sa
   place jusqu'à « Retirer ». La case et la note restent nettes : on voit ce qu'on vient de changer. */
.ptable-cand tbody tr.cand-hors>td{opacity:.42}
.ptable-cand tbody tr.cand-hors>td:first-child,.ptable-cand tbody tr.cand-hors>td.evalcell{opacity:1}
/* Gestes de la liste Candidats (14/10, maquette du 11/10) — un seul repère : la ligne courante (clavier,
   dernière fiche ouverte), un ton plus soutenu tant que sa fiche est ouverte. */
.ptable-cand tbody tr.cand-cur>td,.ptable-cand tbody tr.cand-cur:hover>td{background:#F4F7FE}
.ptable-cand tbody tr.cand-open>td,.ptable-cand tbody tr.cand-open:hover>td{background:#EEF3FE}
.ptable-cand tbody tr.cand-cur>td:first-child,.ptable-cand tbody tr.cand-open>td:first-child{box-shadow:inset 3px 0 0 var(--blue,#2563EB)}
/* Note en un clic : la case Éval entière ouvre le choix ; l'âge de la note sous la puce. */
.ptable-cand td.cand-evc{text-align:center}
.ptable-cand td.cand-evc[data-evalcand],.ptable-cand td.cand-edc{cursor:pointer}
.ptable-cand tbody tr:not(.cand-cur):not(.cand-open) td.cand-evc[data-evalcand]:hover,.ptable-cand tbody tr:not(.cand-cur):not(.cand-open) td.cand-edc:hover{background:#F2F4F8}
.cand-evin{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:40px}
.cand-age{font-size:10px;line-height:12px;color:var(--ink3);white-space:nowrap}
.cand-age.now{color:var(--blue,#2563EB);font-weight:600}
.pop.cand-evpick{padding:0;min-width:0}
.pop.cand-evpick .phead{padding:9px 11px 0}
.cand-evrow{display:flex;gap:6px;padding:10px 11px 8px}
.cand-evb{display:inline-flex;align-items:center;justify-content:center;gap:3px;min-width:34px;height:28px;padding:0 10px;border-radius:999px;border:0;font-size:12px;font-weight:800;cursor:pointer;font-family:inherit;transition:transform .08s,box-shadow .08s}
.cand-evb:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(20,25,37,.14)}
.cand-evb.on{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--blue,#2563EB)}
.cand-evfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 11px 8px;border-top:1px solid var(--line2)}
.cand-evnone{border:0;background:none;padding:0;font-size:11.5px;color:var(--ink3);cursor:pointer;text-decoration:underline;text-underline-offset:2px;font-family:inherit}
.cand-evnone:hover{color:var(--ink)}
.cand-kbd{font-size:10.5px;color:var(--ink3);white-space:nowrap}
.cand-mev{display:inline-grid;place-items:center;width:18px;height:16px;border-radius:999px;font-size:10px;font-weight:800}
/* Clavier de la liste : l'aide sous la grille, tant qu'une ligne courante existe. */
.cand-keys{display:flex;gap:14px;padding:6px 12px;border-top:1px solid var(--line2);font-size:11px;color:var(--ink3);background:var(--surface)}
.cand-keys kbd{font-family:inherit;font-size:10px;font-weight:700;border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:0 4px;margin-right:3px;color:var(--ink2);background:var(--surface)}
/* Volet candidat : fiche précédente / suivante de la liste. */
.k-nav{display:inline-flex;align-items:center;gap:2px;margin-left:auto;margin-top:2px;padding:2px;border:1px solid var(--line);border-radius:9px;background:var(--surface);align-self:flex-start;flex-shrink:0}
.k-nav button{display:grid;place-items:center;width:26px;height:26px;border:0;border-radius:7px;background:transparent;color:var(--ink2);cursor:pointer;padding:0}
.k-nav button:hover:not([disabled]){background:var(--surface-alt);color:var(--ink)}
.k-nav button[disabled]{opacity:.3;cursor:default}
.k-nav .pos{font-size:11.5px;font-weight:600;color:var(--ink3);padding:0 4px;white-space:nowrap;font-variant-numeric:tabular-nums}

/* ===== Brique usage (18/09/2026) : clic droit « Signaler », Admin → Signalements / Usage / Tuyauterie, « Mon usage » ===== */
.ku-ctx{position:fixed;z-index:10041;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(20,25,37,.18);padding:4px;min-width:220px}
.ku-ctx button{display:flex;gap:8px;align-items:center;width:100%;text-align:left;font-size:12.5px;padding:7px 9px;border-radius:7px;color:var(--ink);border:0;background:none;cursor:pointer;font-family:inherit}
.ku-ctx button:hover{background:var(--surface-alt)}
.ku-ctx button:disabled{opacity:.45;cursor:default}
.ku-sep{height:1px;background:var(--line2);margin:4px 2px}
.ku-pop{position:fixed;z-index:10042;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(20,25,37,.22);padding:10px 12px;width:340px;max-width:calc(100vw - 16px)}
.ku-pop-h{display:flex;align-items:baseline;gap:8px;margin-bottom:8px;font-size:13px;min-width:0}
.ku-pop-h span{color:var(--ink3);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ku-pop textarea{width:100%;resize:vertical;min-height:60px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:13px;color:var(--ink);background:var(--surface-alt);outline:none;box-sizing:border-box}
.ku-pop textarea:focus{border-color:var(--blue,#2563EB)}
.ku-pop-f{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.ku-pop-hint{font-size:11px;color:var(--ink3)}
.ku-pop .btn{padding:7px 12px;font-size:12.5px}
.ku-wrap{max-width:1040px;margin:0 auto}
.ku-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.ku-chips,.ku-tabs{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ku-chip{padding:4px 10px;border-radius:20px;border:1px solid var(--line);background:var(--surface);color:var(--ink2);font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.ku-chip b{font-weight:700;color:var(--ink)}
.ku-chip.on{border-color:var(--blue,#2563EB);color:var(--blue,#2563EB);background:var(--blue-soft,#E6F1FA)}
.ku-chip.on b{color:var(--blue,#2563EB)}
.ku-tab{padding:6px 12px;font-size:12.5px;font-weight:700;border:0;background:none;color:var(--ink3);cursor:pointer;border-bottom:2px solid transparent;font-family:inherit}
.ku-tab.on{color:var(--ink);border-bottom-color:var(--accent,#00FFC9)}
.ku-select{padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:12.5px}
.ku-hint{font-size:11.5px;color:var(--ink3);display:inline-flex;align-items:center;gap:5px}
.ku-table{width:100%;border-collapse:collapse;font-size:12.5px}
.ku-table th{text-align:left;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.ku-table td{padding:5px 8px;border-bottom:1px solid var(--line2);vertical-align:top;height:30px;line-height:1.35}
.ku-table tr.ku-row{cursor:pointer}
.ku-table tr.ku-row:hover td,.ku-table tr.ku-row.open td{background:var(--surface-alt)}
.ku-table .ku-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ku-nowrap{white-space:nowrap}
.ku-mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11.5px}
.ku-mono.small{font-size:10.5px;color:var(--ink3)}
.ku-texte{white-space:pre-wrap;max-width:420px}
.ku-muted{color:var(--ink3)}
.ku-muted.small,.ku-empty.small{font-size:11.5px;padding:10px 0}
.ku-ok{color:var(--green,#15803D);font-weight:600}
.ku-empty{padding:28px 12px;text-align:center;color:var(--ink3);font-size:13px}
.ku-empty.err{color:var(--red,#C12B33)}
.ku-st{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap}
.ku-st.st-nouveau{background:var(--orange-soft,#FCF0DC);color:var(--orange,#B26B00)}
.ku-st.st-vu{background:var(--blue-soft,#E6F1FA);color:var(--blue,#2563EB)}
.ku-st.st-corrige{background:var(--green-soft,#D1FAE5);color:var(--green,#15803D)}
.ku-st.st-ecarte{background:var(--line2);color:var(--ink3)}
.ku-det td{background:var(--surface-alt);padding:8px 10px 10px;height:auto}
.ku-det-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 18px;font-size:12px;color:var(--ink2)}
.ku-det-grid b{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);margin-bottom:3px}
.ku-det-grid i{color:var(--ink3);font-style:normal}
.ku-note{color:var(--ink2);font-size:12px;margin-top:2px}
.ku-periode{font-size:12px;color:var(--ink3);margin-bottom:10px}
.ku-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-bottom:14px}
.ku-kpi{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px 10px;min-height:56px;display:flex;flex-direction:column;justify-content:center}
.ku-kpi-v{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;line-height:1.1;display:flex;align-items:baseline;gap:6px;font-variant-numeric:tabular-nums}
.ku-kpi-l{font-size:11.5px;color:var(--ink3);margin-top:2px}
.ku-kpi-l i{font-style:normal;opacity:.85}
.ku-delta{font-size:11px;font-weight:700;font-family:'Inter',sans-serif}
.ku-delta.up{color:var(--blue,#2563EB)}.ku-delta.down,.ku-delta.flat{color:var(--ink3)}
.ku-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ku-card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0}
.ku-card.wide{grid-column:1/-1}
.ku-card h3{font-size:12.5px;font-weight:700;margin:0 0 8px;display:flex;gap:8px;align-items:baseline}
.ku-card h3 span{font-size:11px;font-weight:500;color:var(--ink3)}
.ku-list{list-style:none;margin:0;padding:0;font-size:12.5px}
.ku-list li{display:flex;justify-content:space-between;gap:10px;padding:0;border-bottom:1px solid var(--line2);height:26px;align-items:center}
.ku-list li:last-child{border-bottom:0}
.ku-list li i{color:var(--ink3);font-style:normal;font-size:11px}
.ku-who{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;padding:2px 8px;border-radius:999px;background:var(--line2);color:var(--ink2);margin:2px 2px 2px 0;white-space:nowrap}
.ku-who b{color:var(--ink)}.ku-who i{color:var(--ink3);font-style:normal}
.ku-who.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px}
.ku-pipe{display:grid;grid-template-columns:190px 1fr;gap:12px;align-items:start;padding:9px 0;border-bottom:1px solid var(--line2);font-size:12.5px}
.ku-pipe-l{font-weight:700}.ku-pipe-l i{display:block;font-style:normal;font-weight:500;color:var(--ink3);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px}
.ku-pipe-v{color:var(--ink2);line-height:1.5}.ku-pipe-v b{color:var(--ink)}.ku-pipe-v i{color:var(--ink3);font-style:normal}
.ku-pipe.local{background:var(--surface-alt);border-radius:8px;padding:9px 10px;margin-top:8px;border-bottom:0}
.ku-sub{margin-top:4px}
.ku-link{border:0;background:none;color:var(--blue,#2563EB);cursor:pointer;font:inherit;font-size:12.5px;font-weight:600;padding:0;display:inline-flex;align-items:center;gap:4px}
.ku-link:disabled{opacity:.5;cursor:default}
.ku-trace{margin-top:14px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.ku-trace-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ku-trace-h .ku-link{margin-left:auto}
.ku-switch{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;cursor:pointer}
.ku-switch input{accent-color:var(--blue,#2563EB);width:15px;height:15px;margin:0}
.ku-trace-list{margin-top:8px;max-height:320px;overflow:auto;font-size:12px}
.ku-trace-row{display:grid;grid-template-columns:70px 130px 1fr 110px 1fr 70px;gap:8px;align-items:center;height:26px;border-bottom:1px solid var(--line2);white-space:nowrap;overflow:hidden}
.ku-trace-row>*{overflow:hidden;text-overflow:ellipsis}
.ku-trace-row i{color:var(--ink3);font-style:normal;text-align:right}
.ku-ov{position:fixed;inset:0;background:rgba(15,20,30,.45);z-index:140;display:flex;align-items:center;justify-content:center;padding:20px}
.ku-ov-p{background:var(--bg);border:1px solid var(--line);border-radius:14px;width:100%;max-width:960px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(20,25,37,.4)}
.ku-ov-h{display:flex;align-items:center;gap:10px;padding:14px 18px 10px;border-bottom:1px solid var(--line)}
.ku-ov-h b{font-family:'Space Grotesk',sans-serif;font-size:15px}
.ku-ov-h span{color:var(--ink3);font-size:12px;flex:1}
.ku-close{border:0;background:none;color:var(--ink3);cursor:pointer;padding:4px;border-radius:6px;display:inline-flex}
.ku-close:hover{background:var(--line2);color:var(--ink)}
.ku-ov-b{padding:14px 18px 18px;overflow:auto}
@media (max-width:760px){.ku-grid2{grid-template-columns:1fr}.ku-pipe{grid-template-columns:1fr}.ku-trace-row{grid-template-columns:60px 1fr 1fr}}
/* usage : matrice « Qui utilise quoi » et barres « Par famille » (maquettes validées le 18/09/2026) */
.ku-mat{width:100%;border-collapse:collapse;font-size:12px}
.ku-mat th{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink3);padding:6px 6px;border-bottom:1px solid var(--line);text-align:center;white-space:nowrap}
.ku-mat th:first-child{text-align:left}
.ku-mat td{padding:0 6px;height:28px;border-bottom:1px solid var(--line2);text-align:center;font-variant-numeric:tabular-nums}
.ku-mat td:first-child{text-align:left;white-space:nowrap}
.ku-mat td.fam{background:var(--surface-alt);color:var(--ink3);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;text-align:left;height:24px}
.ku-mat .c{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:20px;border-radius:6px;font-weight:600;color:var(--ink)}
.ku-mat .c.z{color:var(--ink3);font-weight:400}
.ku-mat .tot{color:var(--ink2);font-weight:700}
.ku-bars{display:grid;gap:7px}
.ku-bar{display:grid;grid-template-columns:110px 1fr 110px;align-items:center;gap:10px;font-size:12px;height:22px}
.ku-bar .lbl{color:var(--ink2);white-space:nowrap}
.ku-bar .tr{position:relative;height:12px;background:var(--line2);border-radius:6px}
.ku-bar .fill{position:absolute;left:0;top:0;height:12px;border-radius:6px;background:var(--accent,#00FFC9)}
.ku-bar .med{position:absolute;top:-4px;width:2px;height:20px;background:var(--ink);border-radius:1px}
.ku-bar .val{color:var(--ink2);white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.ku-bar .val b{color:var(--ink)}
.ku-legend{font-size:11px;color:var(--ink3);margin-top:8px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.ku-legend i{display:inline-block;width:14px;height:8px;border-radius:4px;background:var(--accent,#00FFC9);vertical-align:middle;margin-right:5px}
.ku-legend b{display:inline-block;width:2px;height:12px;background:var(--ink);vertical-align:middle;margin-right:5px}
@media (max-width:760px){.ku-bar{grid-template-columns:90px 1fr 90px}}
.ku-help{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:4px;border:0;border-radius:50%;background:none;color:var(--ink3);cursor:help;padding:0}
.ku-help:hover{color:var(--ink,#141925);background:var(--bg,#F5F6F9)}
/* usage : le jour par jour (colonne Équipe, volet sous la ligne, case, Jours actifs) et l'onglet
   Propositions — maquettes validées par Théo le 29/09/2026 dans la vraie vue. Au clic, jamais au survol. */
.ku-card h3 .ku-h3r{margin-left:auto;display:inline-flex;gap:6px;align-items:center}
.ku-mat tbody tr[data-cle]{cursor:pointer}
.ku-mat tbody tr[data-cle]:hover>td{background:var(--surface-alt)}
.ku-mat tbody tr.ku-open>td{background:var(--accent-soft,#E3FFF8)}
.ku-mat td.ku-sel{box-shadow:inset 0 0 0 2px var(--ink)}
.ku-eq{display:inline-grid;grid-template-columns:62px 30px 28px;align-items:center;gap:6px;vertical-align:middle}
.ku-eq b{text-align:right;color:var(--ink2);font-weight:700}
.ku-eq i{text-align:left;font-style:normal;font-size:10.5px;font-weight:600;color:var(--ink3)}
.ku-spark{display:block;overflow:visible}
.ku-spark .bar{fill:var(--accent,#00FFC9)}
.ku-spark .hat{fill:url(#kuHat)}
.ku-spark .base{stroke:var(--line,#E7E9F0);stroke-width:1}
.ku-spark .nmb{stroke:var(--ink3);stroke-width:1;stroke-dasharray:1 2;opacity:.6}
.ku-spark .mk{stroke:var(--ink2);stroke-width:1;stroke-dasharray:2 2}
.ku-spark .we{fill:var(--line2,#EEF0F5);opacity:.7}
.ku-spark .grid{stroke:var(--line,#E7E9F0);stroke-dasharray:3 3}
.ku-spark .cum{fill:none;stroke:var(--ink);stroke-width:1.5}
.ku-spark .dot{fill:var(--ink)}
.ku-spark text{font-size:10px;fill:var(--ink3);font-family:inherit}
.ku-spark text.mkl{fill:var(--ink2);font-weight:600}
.ku-mat tr.ku-vol1>td{background:var(--surface-alt);padding:12px 12px 2px;height:auto;text-align:left;white-space:normal;border-bottom:0}
.ku-mat tr.ku-vol2>td{background:var(--surface-alt);height:36px;padding:0 4px 6px;font-size:10.5px;color:var(--ink3);vertical-align:top}
.ku-mat tr.ku-vol2>td.ku-vlab{text-align:right;padding-right:10px;font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;vertical-align:middle}
.ku-mat tr.ku-vol2>td.ku-vder{text-align:center;vertical-align:middle}
.ku-mat tr.ku-vol2>td[data-em]{cursor:pointer}
.ku-mat tr.ku-vol2>td[data-em].on{background:var(--accent-soft,#E3FFF8);color:var(--ink);font-weight:700}
.ku-vol2 .ku-spark{margin:5px auto 2px}
.ku-vbox{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;position:relative;padding-right:14px}
.ku-vt{font-size:13px;font-weight:700;color:var(--ink);display:flex;align-items:center;flex-wrap:wrap}
.ku-vs{font-size:11px;color:var(--ink3);margin:2px 0 8px}
.ku-vbig{display:flex;align-items:baseline;gap:2px;margin-bottom:6px}
.ku-vbig b{font-family:'Space Grotesk',sans-serif;font-size:26px;line-height:1;color:var(--ink)}
.ku-vbig span{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:700;color:var(--ink3)}
.ku-vbig i{font-style:normal;font-size:11.5px;color:var(--ink3);margin-left:6px}
.ku-vl{font-size:11.5px;color:var(--ink2);line-height:1.6}
.ku-vl em{font-style:normal;color:var(--ink3)}
.ku-vx{position:absolute;top:-8px;right:-6px;border:0;background:none;color:var(--ink3);font-size:18px;line-height:1;cursor:pointer;padding:4px 6px}
.ku-vx:hover{color:var(--ink)}
.ku-vback{border:0;background:none;padding:0;margin-top:6px;font:inherit;font-size:11.5px;color:var(--blue,#2563EB);cursor:pointer}
.ku-vcl{font-size:10.5px;color:var(--ink3);margin-top:2px}
.ku-cal{display:grid;grid-template-columns:40px repeat(7,24px);grid-auto-rows:24px;gap:4px;align-items:center;margin:2px 0 8px}
.ku-cal b{font-size:9.5px;font-weight:700;color:var(--ink3);text-align:center}
.ku-cal .wk{font-size:10px;color:var(--ink3);white-space:nowrap}
.ku-cal-sem{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 8px}
.ku-cal i,.ku-cal-sem i{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;font-style:normal;font-size:10px;font-weight:600;color:var(--ink);box-sizing:border-box}
.ku-cal-sem i{width:38px}
.ku-cal i.z,.ku-cal-sem i.z{background:var(--line2,#EEF0F5);color:var(--ink3);font-weight:500}
.ku-cal i.nm,.ku-cal-sem i.nm{background:repeating-linear-gradient(135deg,var(--line,#E5E7EB) 0 2px,transparent 2px 6px);color:var(--ink3);font-weight:500}
.ku-cal i.out{color:var(--ink3);opacity:.35;font-weight:500}
.ku-cal i.auj,.ku-cal-sem i.auj{box-shadow:inset 0 0 0 1.5px var(--ink)}
.ku-cal-leg{display:flex;gap:12px;flex-wrap:wrap;font-size:10.5px;color:var(--ink3);margin-top:4px}
.ku-pr-badge{display:inline-block;min-width:16px;padding:0 5px;margin-left:5px;border-radius:9px;background:var(--accent,#00FFC9);color:#0A2A23;font-size:10px;font-weight:800;line-height:16px;text-align:center}
.ku-pr{display:flex;flex-direction:column;gap:10px}
.ku-pr-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ku-pr-top .ku-periode{margin:0}
.ku-pr-prog{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ink2)}
.ku-pr-bar{flex:0 0 220px;height:8px;border-radius:5px;background:var(--line2,#EEF0F5);overflow:hidden}
.ku-pr-bar i{display:block;height:100%;background:var(--accent,#00FFC9);border-radius:5px;transition:width .25s}
.ku-pr-done{font-size:12px;font-weight:600;color:var(--ink);background:var(--accent-soft,#E3FFF8);border:1px solid var(--accent,#00FFC9);border-radius:8px;padding:7px 10px}
.ku-pr-res{margin:0;padding:0 0 0 16px;font-size:12.5px;line-height:1.7;color:var(--ink2)}
.ku-pr-it{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;padding:9px 2px;border-bottom:1px solid var(--line2)}
.ku-pr-it:last-child{border-bottom:0}
.ku-pr-h{display:flex;align-items:center;gap:8px;font-size:13px;min-width:0}
.ku-pr-h b{font-weight:700;color:var(--ink)}
.ku-pr-c{grid-column:1;font-size:11px;color:var(--ink3);font-family:ui-monospace,Menlo,Consolas,monospace}
.ku-pr-p{grid-column:1;font-size:12px;color:var(--ink2)}
.ku-pr-act{grid-column:2;grid-row:1 / span 3;display:flex;align-items:center;gap:6px;justify-content:flex-end}
.ku-pr-it.e .ku-pr-h,.ku-pr-it.e .ku-pr-c,.ku-pr-it.e .ku-pr-p{opacity:.45}
.ku-pr-portee{font-size:9.5px;font-weight:800;letter-spacing:.03em;padding:1px 6px;border-radius:8px;white-space:nowrap}
.ku-pr-portee.kama{background:var(--blue-soft,#E6F1FA);color:var(--blue,#2563EB)}
.ku-pr-portee.equipe{background:var(--accent-soft,#E3FFF8);color:#0A2A23;box-shadow:inset 0 0 0 1px var(--accent,#00FFC9)}
.ku-pr-portee.personne{background:var(--line2,#EEF0F5);color:var(--ink2)}
.ku-pr-g{border-color:var(--accent,#00FFC9)!important}
.ku-pr-st{font-size:11px;font-weight:700;padding:2px 8px;border-radius:9px;white-space:nowrap}
.ku-pr-st.g{background:var(--accent-soft,#E3FFF8);color:#0A2A23}
.ku-pr-st.e{background:var(--line2,#EEF0F5);color:var(--ink3)}
.ku-pr-lk{border:0;background:none;padding:0;font:inherit;font-size:11.5px;color:var(--blue,#2563EB);cursor:pointer;white-space:nowrap}
.ku-pr-lk.m{color:var(--ink3)}
.ku-pr-lk:disabled,.ku-pr-act .ku-chip:disabled{opacity:.5;cursor:default}
.ku-pr-pts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ku-pr-pc{border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--surface)}
.ku-pr-pc-h{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
.ku-pr-pc-h b{font-size:12.5px}
.ku-pr-pc-h i{font-style:normal;font-size:11px;color:var(--ink3);flex:1}
.ku-pr-pc ul{list-style:none;margin:0;padding:0;font-size:12px;color:var(--ink2);line-height:1.55}
.ku-pr-pc li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:6px;align-items:start}
.ku-pr-pc li::before{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;margin-top:2px;border-radius:50%;font-size:9px;font-weight:800;line-height:1}
.ku-pr-pc li.ok::before{content:'✓';background:var(--accent,#00FFC9);color:#0A2A23}
.ku-pr-pc li.try::before{content:'→';background:var(--blue-soft,#E6F1FA);color:var(--blue,#2563EB)}
.ku-pr-pc li.q::before{content:'?';background:var(--line2,#EEF0F5);color:var(--ink2)}
.ku-pr-ch{display:flex;flex-wrap:wrap;gap:4px}
.ku-pr-toggle{cursor:pointer}
@media (max-width:760px){.ku-vbox{grid-template-columns:1fr}.ku-pr-pts{grid-template-columns:1fr}.ku-pr-it{grid-template-columns:1fr}.ku-pr-act{grid-column:1;grid-row:auto;justify-content:flex-start}}

/* Feu de contexte (colonne Source de Prospects) : ou en est le TEXTE de l'annonce.
   Meme dessin et meme code couleur que le feu du matching IA (volet affaire) : pilule de trois
   points, seul l'etat courant est allume. Rouge = pas de lien, orange = lien sans texte,
   vert = texte en base. */
.feu3{display:inline-flex;gap:3px;align-items:center;padding:3px 5px;border:1px solid var(--line2);border-radius:999px;background:var(--surface-alt);flex:none;line-height:0;cursor:default}
/* Puce d'etat posee sur un bouton (meme code couleur que la nav : gris = en dev). */
.pucebtn{font-size:8px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1;padding:2px 5px;border-radius:7px;margin-left:6px;vertical-align:1px;background:var(--line2);color:var(--ink3)}

/* Nom d'un profil dans « Choisir le profil a pousser » : ouvre la fiche candidat.
   Survol vert SAYCO vif, sans soulignement — meme geste que .k-name du volet. */
.sensnom{transition:color .12s}
.sensnom:hover{color:var(--accent,#00FFC9)}

/* Icône « annonce » des cartes d'affaire (affAnnIconHtml) : le survol dit que c'est cliquable. */
.aff-ann:hover{background:var(--bg)}
/* « Trouver des candidats » à sa gauche (affImIconHtml) : même survol, collée à l'annonce. */
.aff-im:hover{background:var(--bg)}
.aff-im+.aff-ann{margin-left:-4px}

/* Résumés d'appel : le compte rendu se corrige d'un clic dans le texte (_consResumeHtml).
   Bordure transparente au repos, teintée de bleu au survol — le bleu du champ qui prend sa
   place, dans la même boîte : rien ne bouge d'un pixel au clic. L'indication du pied n'apparaît
   qu'au survol du texte : une infobulle native se posait sur les mots qu'on était en train de lire. */
.cons-cr-clic{border:1px solid transparent;cursor:text;transition:border-color .12s}
.cons-cr-clic:hover{border-color:color-mix(in srgb,var(--blue,#2563EB) 35%,transparent)}
.cons-cr-pied .cons-cr-astuce{visibility:hidden}
.cons-cr-clic:hover + .cons-cr-pied .cons-cr-astuce{visibility:visible}

/* Résumés d'appel : l'en-tête du volet (nom, Enregistrer, Ne pas consigner) reste en haut quand
   le compte rendu défile. Marges négatives : le fond couvre toute la largeur du volet, sinon le
   texte qui passe dessous apparaîtrait dans les 18 px de côté. Ombre seulement une fois décollé
   (classe .colle posée au défilement, cf. wireConsigner). */
.cons-entete{position:sticky;top:0;z-index:3;background:var(--surface);margin:-16px -18px 2px;padding:16px 18px 10px;transition:box-shadow .15s}
.cons-entete.colle{box-shadow:0 1px 0 var(--line),0 8px 14px -12px rgba(15,23,42,.35)}
/* Résumés d'appel : la barre de la rédaction en cours, au pied du bandeau orange (_consResumeHtml).
   Elle avance sur la durée attendue jusqu'à 92 %, puis attend le texte. Durée et délai sont posés
   au rendu : un délai négatif (le temps déjà écoulé) la fait repartir à sa largeur après un repeint. */
.cons-prog{position:absolute;left:0;bottom:0;height:3px;width:2%;background:var(--orange,#B26B00);opacity:.5;animation-name:consProg;animation-timing-function:linear;animation-fill-mode:forwards}
@keyframes consProg{from{width:2%}to{width:92%}}
/* Pas de barre de page sur cette vue : les deux volets défilent chacun de leur côté. */
.content.cons-flush{padding-bottom:0}

/* Rendu des comptes rendus (_sumMd) : résumés d'appel, bloc historique des fiches, détail d'un
   appel. Classes globales .md-* : le rendu marche partout où il est posé, sans conteneur dédié. */
.md-p{margin:0 0 2px}
.md-sp{height:6px}
.md-h{font-weight:700;color:var(--ink);margin:10px 0 3px}
.md-h:first-child{margin-top:0}
.md-h1{font-size:13.5px}
.md-h2{font-size:13px}
.md-l{margin:2px 0 6px 18px;padding:0}
.md-l li{margin:1px 0;padding-left:2px}
.md-hr{height:1px;background:var(--line);margin:10px 0}
.md-sep{display:flex;align-items:center;gap:8px;margin:12px 0 6px;font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink3)}
.md-sep span{flex:1;height:1px;background:var(--line)}
.md-q{border-left:3px solid var(--line);padding:1px 0 1px 10px;color:var(--ink2);margin:4px 0}
.md-p i,.md-l i,.md-h i,.md-q i,.md-t i{font-style:italic;color:var(--ink2)}
/* Tableaux (la couverture SOLARC) : les règles globales des grandes listes (en-tête collant,
   ligne cliquable et survolée, 11 px de marge) ne doivent pas s'appliquer dans un compte rendu. */
.md-t{width:100%;border-collapse:collapse;margin:6px 0 10px;line-height:1.45}
.md-t thead th{position:static;z-index:auto;padding:6px 9px;border-bottom:1px solid var(--line);background:var(--surface-alt);color:var(--ink3)}
.md-t tbody tr{border-top:0;cursor:inherit}
.md-t tbody tr:hover{background:transparent}
.md-t tbody td{padding:6px 9px;vertical-align:top;font-size:inherit;color:inherit;border-bottom:1px solid var(--line2)}
.md-t tbody tr:last-child td{border-bottom:0}
.md-t td:first-child{white-space:nowrap}
/* La note du bloc historique à l'interligne des comptes rendus (celui de la maquette validée) :
   à 1,2 un compte rendu mis en forme de 10 000 caractères se lisait serré. */
.hist-body{line-height:1.55}
/* Réglages → Comptes rendus → Prompts (25/09) : en fenêtre étroite, le rail des prompts passe
   au-dessus du texte, sur deux colonnes, et les deux comptes rendus de l'essai s'empilent. */
@media (max-width:900px){
  .cr-prompts{flex-direction:column;align-items:stretch!important}
  .cr-prompts > #crRail{width:auto!important;flex:none!important;display:grid;grid-template-columns:1fr 1fr}
  .cr-prompts > #crRail > div{grid-column:1/-1}
  .cr-essai-cols{flex-direction:column}
}

/* Petit cœur (09/10/2026) : un candidat aimé passe en tête de son bloc (Process) et de sa colonne
   (kanban candidats de l'affaire). Vide au survol de la carte, rouge quand il est posé.
   Dans Process : en pastille sur l'avatar, pour ne raccourcir aucun nom. Règles : frontend/process/coeur.mts. */
.proc-c{position:relative}
.afc-coeur{flex:0 0 auto;display:inline-grid;place-items:center;width:20px;height:20px;margin:0 -2px;padding:0;border:0;border-radius:6px;background:none;color:var(--ink3,#8A91A3);cursor:pointer;opacity:0;transition:opacity .12s,background .12s,transform .12s}
.afc-coeur svg{width:13px;height:13px;display:block}
.proc-c:hover .afc-coeur,.afc-card:hover .afc-coeur,.afc-coeur:focus-visible{opacity:.8}
.afc-coeur:hover{opacity:1;color:var(--red,#C12B33);background:var(--red-soft,#FDECEC)}
.afc-coeur.on{opacity:1;color:var(--red,#C12B33)}
.afc-coeur.on svg{fill:currentColor}
.afc-coeur:active{transform:scale(.85)}
span.afc-coeur{cursor:default}
.proc-c:not(.pl-row) > .afc-coeur,.pl-row > .pl-nom > .afc-coeur{position:absolute;left:23px;top:16px;width:18px;height:18px;margin:0;border-radius:50%;background:var(--surface,#fff);box-shadow:0 0 0 1.5px var(--surface,#fff),0 1px 3px rgba(20,25,37,.18)}
.proc-c:not(.pl-row) > .afc-coeur svg,.pl-row > .pl-nom > .afc-coeur svg{width:11px;height:11px}
.proc-c:not(.pl-row) > .afc-coeur:hover,.pl-row > .pl-nom > .afc-coeur:hover{background:var(--red-soft,#FDECEC)}
/* Pré-liste élargie (15/10/2026, Théo : « les petits cœurs […] bougent lorsqu'on élargit ») : même place par rapport à
   la photo que sur le board — 15 px à droite de son bord gauche, à mi-hauteur. Placé avant le nom, le cœur rend aussi
   au nom sa règle « une ligne, coupée » (span:last-child). */
.pl-row > .pl-nom{position:relative}
.pl-row > .pl-nom > .afc-coeur{left:15px;top:calc(50% - .5px)}

/* ---- Kanban candidats de l'affaire (volet et plein écran) : refonte des cartes (Théo, 09/10/2026) ----
   Maquette « Actuel retravaillé » validée dans la vraie vue. Mêmes colonnes ; carte de 32 px pour tout
   le monde (photo ou initiales, nom sur une ligne, cœur en pastille sur la photo) ; plein écran : plus
   de barre de défilement dans les colonnes, un dégradé (.afc-fade, allumé par afcFondus) dit qu'il
   reste des cartes. Colonnes de 140 px au moins : fenêtre étroite, on défile de côté. */
.afc-board{display:flex;gap:8px;padding-bottom:6px}
.afc-board:not(.big){overflow-x:auto}
.afc-board.big{height:100%;min-height:0;overflow-x:auto;overflow-y:hidden}
.afc-col{display:flex;flex-direction:column;border-radius:10px;padding:6px 4px 4px;box-sizing:border-box}
.afc-board.big>.afc-col{flex:1 1 0;min-width:140px;height:100%;min-height:0}
.afc-board:not(.big)>.afc-col{flex:0 0 152px;min-width:152px}
.afc-colh{flex:0 0 auto;display:flex;align-items:center;gap:5px;padding:0 3px 6px;min-width:0}
.afc-colh>b{font-size:11px;font-weight:700;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.afc-coln{margin-left:auto;flex:0 0 auto;font-size:10.5px;color:var(--ink3);background:var(--surface);border-radius:999px;padding:0 6px}
.afc-zw{position:relative;display:flex;flex-direction:column;border-radius:8px}
.afc-zw.bot{background:rgba(120,120,120,.06)}
.afc-board:not(.big) .afc-zw.top{min-height:44px}
.afc-board:not(.big) .afc-zw.bot{min-height:46px}
.afc-board.big .afc-zw{min-height:0}
.afc-board.big .afc-zw.top{flex:1 1 auto;min-height:60px}
.afc-board.big .afc-zw.bot{flex:0 0 auto;min-height:96px;max-height:38%}
.afc-drop{display:flex;flex-direction:column;gap:5px;padding:2px;border-radius:8px;transition:background .12s}
.afc-board.big .afc-drop{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}
.afc-board.big .afc-drop::-webkit-scrollbar{width:0;height:0;display:none}
.afc-fade{position:absolute;left:0;right:0;bottom:0;height:34px;pointer-events:none;z-index:2;border-bottom-left-radius:8px;border-bottom-right-radius:8px;opacity:0;transition:opacity .18s}
.afc-zw.bot>.afc-fade{height:26px}
.afc-sep{flex:0 0 auto;display:flex;align-items:center;gap:5px;margin:7px 2px 4px;min-width:0}
.afc-sep>span{height:1px;flex:1;min-width:0}
.afc-sep>b{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;color:var(--ink3);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;min-width:0}
.afc-sep>b>span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.afc-sep>b>i{font-style:normal;flex:0 0 auto}
.afc-vide{font-size:11px;color:var(--ink3);text-align:center;padding:8px 0}
.afc-card{position:relative;flex:0 0 32px;height:32px;box-sizing:border-box;display:flex;align-items:center;gap:5px;padding:0 5px 0 4px;background:var(--surface);border:1px solid var(--line);border-radius:7px;font-size:12px;user-select:none}
.afc-card:hover{border-color:#D3D7E1;box-shadow:0 1px 3px rgba(20,25,37,.07)}
.afc-card.stp{background:transparent;border-style:dashed}
.afc-av{position:relative;flex:0 0 22px;width:22px;height:22px}
.afc-av>img,.afc-ini{width:22px;height:22px;border-radius:50%;display:block;object-fit:cover}
.afc-ini{display:grid;place-items:center;background:var(--accent-soft,#E3FFF8);color:var(--ink2);font-size:9px;font-weight:700}
.afc-card.stp .afc-av>img,.afc-card.stp .afc-ini{opacity:.45;filter:grayscale(1)}
.afc-nm{flex:1 1 auto;min-width:0;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.afc-card.stp .afc-nm{color:var(--ink3);font-weight:500;text-decoration:line-through}
.afc-av>.afc-coeur{position:absolute;right:-5px;bottom:-4px;width:15px;height:15px;margin:0;border-radius:50%;background:var(--surface,#fff);box-shadow:0 0 0 1.5px var(--surface,#fff),0 1px 2px rgba(20,25,37,.22)}
.afc-av>.afc-coeur svg{width:9px;height:9px}
.afc-av>.afc-coeur:hover{background:var(--red-soft,#FDECEC)}
