/* ==========================================================================
   Système de design Logikeo Solution
   --------------------------------------------------------------------------
   Implémentation du modèle logikeo_dashboard.html fourni par FR le
   05/08/2026, qui fait foi pour les couleurs et les formats. Écrit à la
   main, sans framework. Remplace le thème Bootstrap 3 et ne cohabite pas
   avec lui.

   La police Inter est hébergée par le site, dans css/polices/ — voir le
   bloc @font-face plus bas. Les pages n'ont donc plus rien à charger dans
   leur en-tête.
   ========================================================================== */

:root{
    /* Bleus du modèle */
    --bleu-950:#102963;
    --bleu-900:#173b87;
    --bleu-800:#244ca8;
    --bleu-700:#2f62d6;
    --bleu-600:#3b82f6;

    --texte:#153067;
    --texte-doux:#6f82aa;
    --ligne:#dfe7f5;
    --panneau:rgba(255,255,255,.94);
    --ombre:0 18px 45px rgba(30,64,175,.14);
    --rayon:18px;
    --rayon-petit:10px;
    --rayon-pilule:999px;

    /* Couleurs d'accent des pastilles — voir CHARTE_UI.md §7 */
    --vert:#59af4f;
    --orange:#f39a2b;
    --violet:#6c4bd4;
    --cyan:#35a8d6;
}

/* ==========================================================================
   POLICE INTER, HEBERGEE ICI
   --------------------------------------------------------------------------
   Les pages la chargeaient depuis fonts.googleapis.com. Chaque visiteur
   envoyait donc son adresse IP a Google avant meme d'avoir clique — c'est le
   seul contact tiers qu'avait le site, et celui qui a valu des condamnations
   ailleurs en Europe. Les fichiers sont desormais servis par le site
   lui-meme (FR, 09/08/2026, en sa qualite de DPO).

   Deux jeux seulement, latin et latin-ext : le site est en francais, les
   alphabets grec, cyrillique et vietnamien de Google ne servaient a rien.
   130 Ko au total, contre un aller-retour vers un tiers a chaque visite.

   Police variable : un seul fichier couvre toutes les graisses de 100 a 900,
   la ou l'ancien lien en telechargeait cinq.

   Inter est sous SIL Open Font License 1.1 — redistribution autorisee.
   ========================================================================== */

@font-face{
    font-family:'Inter';
    font-style:normal;
    font-weight:400 800;
    font-display:swap;
    src:url('polices/inter-latin-ext.woff2') format('woff2');
    unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face{
    font-family:'Inter';
    font-style:normal;
    font-weight:400 800;
    font-display:swap;
    src:url('polices/inter-latin.woff2') format('woff2');
    unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100vh}

body{
    font-family:Inter,"Segoe UI",Arial,sans-serif;
    font-size:14px;
    color:#fff;
    background:
        radial-gradient(circle at 88% 4%, rgba(255,255,255,.65), transparent 22%),
        radial-gradient(circle at 20% 35%, rgba(255,255,255,.10), transparent 28%),
        linear-gradient(135deg,#2f5ac0 0%,#6c88cc 55%,#edf2ff 100%);
    background-attachment:fixed;
    -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none}
button,select{font:inherit}
h1,h2,h3{margin:0}

/* ==========================================================================
   Barre haute — figée, translucide, floutée
   ========================================================================== */

/* HAUTEUR MINIMALE, PAS FIXE — correction du 19/08/2026 (FR).
   .lk-nav porte flex-wrap:wrap. Avec une hauteur figee a 76px, les liens
   passaient a la ligne A L'INTERIEUR d'une barre qui ne grandissait pas :
   vers 1040px de large, la seconde rangee debordait sur le titre de la page
   et la marque se faisait rogner a gauche. La barre s'agrandit desormais au
   lieu de deborder, a toute largeur et sans dependre d'un point de rupture. */
.lk-barre{
    min-height:76px;
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:26px;
    padding:0 32px;
    background:linear-gradient(90deg,rgba(37,86,193,.82),rgba(31,67,157,.60));
    box-shadow:0 1px 0 rgba(255,255,255,.18);
    backdrop-filter:blur(16px);
    position:sticky;
    top:0;
    z-index:10;
}

/* flex:0 0 auto : la marque ne se comprime jamais. Sans cela le flex la
   retrecissait avant de renvoyer la nav a la ligne, et le logo sortait de la
   barre par la gauche — visible sur la capture de FR du 19/08/2026. */
.lk-marque{
    display:flex;align-items:center;gap:12px;flex:0 0 auto;
    font-weight:800;font-size:18px;white-space:nowrap;
}
.lk-marque span:last-child{font-weight:400;opacity:.92}
.lk-marque-pastille{
    width:30px;height:30px;border-radius:9px;
    background:#fff;color:var(--bleu-700);
    display:grid;place-items:center;font-size:14px;
}

.lk-nav{display:flex;align-items:center;gap:6px;flex:1;justify-content:center;flex-wrap:wrap}
.lk-nav a{
    display:flex;align-items:center;gap:9px;
    padding:12px 16px;border-radius:var(--rayon-petit);
    font-size:15px;font-weight:600;
    color:rgba(255,255,255,.92);
    transition:.18s ease;
    white-space:nowrap;
}
.lk-nav a:hover{background:rgba(255,255,255,.12)}
.lk-nav a.courant{
    background:#fff;color:var(--bleu-700);
    box-shadow:0 8px 20px rgba(11,52,138,.18);
}
.lk-nav a.courant .lk-icone{stroke:var(--bleu-700)}

.lk-barre-fin{display:flex;align-items:center;flex:0 0 auto;margin-left:auto;
              gap:16px;white-space:nowrap;font-size:14px}

.lk-cloche{
    position:relative;display:grid;place-items:center;
    width:38px;height:38px;border-radius:50%;
    background:rgba(255,255,255,.08);
}
.lk-cloche b{
    position:absolute;right:-2px;top:-4px;
    min-width:18px;height:18px;padding:0 5px;
    display:grid;place-items:center;border-radius:9px;
    background:#2563eb;font-size:11px;font-weight:800;
}

.lk-avatar{
    width:42px;height:42px;display:grid;place-items:center;
    border-radius:50%;
    background:rgba(255,255,255,.16);
    border:1px solid rgba(255,255,255,.28);
    font-weight:600;font-size:13px;
}
.lk-utilisateur{font-size:14px}

/* ==========================================================================
   Icônes — linéaires, 2 px
   ========================================================================== */

.lk-icone{
    width:18px;height:18px;
    stroke:currentColor;stroke-width:2;
    stroke-linecap:round;stroke-linejoin:round;
    fill:none;flex:0 0 auto;
}

/* ==========================================================================
   Page : titre à gauche, étude à droite
   ========================================================================== */

.lk-page{width:min(1380px,calc(100% - 64px));margin:34px auto 18px}

.lk-entete-page{
    display:flex;justify-content:space-between;align-items:flex-end;
    gap:28px;margin-bottom:26px;padding:0 8px;flex-wrap:wrap;
}
.lk-entete-page h1{margin:0 0 8px;font-size:34px;line-height:1.1;letter-spacing:-.6px}
.lk-entete-page p{margin:0;color:rgba(255,255,255,.90);font-size:16px}

/* ==========================================================================
   Page publique a but unique — desinscription, message d'erreur, remerciement
   --------------------------------------------------------------------------
   Ces pages n'ont qu'une chose a dire et un seul geste a proposer. Alignees
   en haut a gauche comme les pages de travail, elles laissaient un ecran de
   vide sous une petite carte (FR, 09/08/2026). Ici le bloc est centre dans
   la hauteur disponible, et le texte au-dessus de lui.

   Le formulaire, lui, reste aligne a gauche : un champ et son libelle se
   lisent mal centres.
   ========================================================================== */
/* Les deux blocs de la section Contact.
   Ils partagent la meme carte mais s'adressent a deux personnes differentes :
   au-dessus un prospect, en dessous un paneliste qui veut sortir des listes.
   Chacun annonce donc a qui il parle — sans titre, les deux boutons se
   confondaient (FR, 09/08/2026). */
.lk-contact-bloc h3,
.lk-repondants h3{
    margin:0 0 6px;font-size:16px;color:var(--texte);
    display:flex;align-items:center;justify-content:center;gap:8px;
}
.lk-contact-bloc p,
.lk-repondants p{
    margin:0 auto 16px;max-width:34rem;
    font-size:14px;color:var(--texte-doux);
}

/* Le second seul porte le filet : il separe, il n'encadre pas. */
.lk-repondants{
    margin-top:26px;padding-top:24px;
    border-top:1px solid var(--ligne);
}

.lk-page-simple{
    display:flex;flex-direction:column;
    justify-content:center;align-items:center;
    min-height:60vh;
}
.lk-page-simple .lk-entete-page{
    flex-direction:column;align-items:center;text-align:center;
    justify-content:center;margin-bottom:22px;
}
.lk-page-simple .lk-carte{width:min(34rem,100%);text-align:left}
.lk-page-simple .lk-carte .lk-bouton{width:100%;justify-content:center}

.lk-entete-etude{display:flex;align-items:center;gap:18px}
.lk-entete-etude label{font-size:15px;color:rgba(255,255,255,.92);white-space:nowrap}
/* La recherche d'une etude, devant le selecteur (lk_etude_recherche_poser,
   13/10/2026) : meme verre fume que le selecteur ; rose pale quand rien ne
   correspond. */
.lk-etude-recherche{
    width:190px;max-width:100%;color:#fff;
    background:rgba(28,57,126,.32);
    border:1px solid rgba(255,255,255,.26);border-radius:var(--rayon-petit);
    padding:13px 14px;outline:none;font:inherit;font-size:14px;
}
.lk-etude-recherche::placeholder{color:rgba(255,255,255,.72)}
.lk-etude-recherche:focus{border-color:rgba(255,255,255,.6);background:rgba(28,57,126,.48)}
.lk-etude-recherche.lk-etude-recherche-vide{border-color:#fca5a5;background:rgba(220,38,38,.28)}

/* Sélecteur sombre translucide du modèle */
.lk-select{
    min-width:246px;max-width:100%;
    color:#fff;
    background:rgba(28,57,126,.48);
    border:1px solid rgba(255,255,255,.26);
    border-radius:var(--rayon-petit);
    padding:14px 44px 14px 18px;
    outline:none;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
    appearance:none;-webkit-appearance:none;
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 16px center;
    cursor:pointer;
}
.lk-select option{color:var(--texte);background:#fff}
/* Un selecteur POSE SUR FOND CLAIR (une note, une carte) : la version pour
   bandeau bleu — blanc translucide sur bleu — y sortait violet (FR,
   30/09/2026, sur le grain du plan de sondage : « tu peux mettre une autre
   couleur »). Meme forme, encre sur blanc, fleche bleue. */
.lk-note .lk-select,.lk-carte .lk-select{
    color:var(--texte);
    background-color:#fff;
    border:1px solid #cedaf2;
    box-shadow:none;
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%232f62d6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
}
.lk-note .lk-select:focus,.lk-carte .lk-select:focus{border-color:#2f62d6}

/* ==========================================================================
   Bandeau de chiffres (KPI)
   ========================================================================== */

.lk-bandeau{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    background:var(--panneau);
    border-radius:var(--rayon);
    overflow:hidden;
    box-shadow:var(--ombre);
    margin-bottom:14px;
}

.lk-mesure{
    color:var(--texte);
    padding:28px 20px;
    display:flex;align-items:center;gap:18px;
    min-width:0;
    border-right:1px solid var(--ligne);
}
.lk-mesure:last-child{border-right:0}

/* Pastilles rondes en dégradé, anneau interne clair */
.lk-pastille{
    width:58px;height:58px;flex:0 0 58px;
    border-radius:50%;
    display:grid;place-items:center;
    color:#fff;
    box-shadow:inset 0 0 0 7px rgba(255,255,255,.08);
}
.lk-pastille .lk-icone{width:28px;height:28px}
.lk-pastille.bleu   {background:linear-gradient(145deg,#2f6deb,#1f53cf)}
.lk-pastille.violet {background:linear-gradient(145deg,#7a4bdd,#5532ba)}
.lk-pastille.cyan   {background:linear-gradient(145deg,#35a8d6,#197dae)}
.lk-pastille.vert   {background:linear-gradient(145deg,#69ba55,#3d8b37)}
.lk-pastille.orange {background:linear-gradient(145deg,#ff9b45,#e36d1e)}

.lk-mesure-valeur{font-size:24px;font-weight:800;line-height:1;margin-bottom:7px}
.lk-mesure-libelle{font-size:14px;color:#49628f;margin-bottom:12px}
.lk-mesure-taux{font-size:17px;font-weight:700}
.lk-mesure-quoi{font-size:13px;color:#7486aa;margin-top:4px}
.lk-evolution{color:#55a940;font-size:13px;margin-left:6px}
.lk-evolution.baisse{color:#d64545}

/* ==========================================================================
   Panneaux
   ========================================================================== */

.lk-grille-2-1{display:grid;grid-template-columns:minmax(0,2fr) minmax(330px,1fr);gap:14px}
.lk-grille-1-1{display:grid;grid-template-columns:1fr 1.1fr;gap:14px;margin-top:14px}
@media (max-width:1100px){.lk-grille-2-1,.lk-grille-1-1{grid-template-columns:1fr}}

.lk-carte{
    background:var(--panneau);
    color:var(--texte);
    border-radius:var(--rayon);
    box-shadow:var(--ombre);
    padding:24px;
}

.lk-carte-titre{
    font-size:20px;margin:0 0 20px;
    display:flex;align-items:center;gap:10px;
}
.lk-carte-titre .lk-icone{width:24px;height:24px;color:#2454b8}
/* Ce que montre la carte, a cote du titre (« par motif », 04/10/2026). */
.lk-carte-sous-titre{font-size:13px;font-weight:400;color:#6e80a5}

/* ==========================================================================
   Tableaux
   ========================================================================== */

.lk-tableau-boite{overflow-x:auto}

/* LE TABLEAU DEFILE, LES COMMANDES RESTENT (FR, 28/08/2026 : « figer le
   bloc en haut de page et que les questions descendent sinon on ne peut
   pas cliquer directement » — puis « apres Question » : la ligne
   d'en-tetes se fige AVEC le bloc).

   Le corps du tableau defile dans SA boite plutot que dans la page : les
   barres Croiser / Ajouter et les en-tetes de colonnes ne quittent jamais
   l'ecran, quelle que soit la ligne cochee. La hauteur laisse la place a
   ce qui precede (bandeau du site, mesures, barres), avec un plancher
   pour que le tableau reste utilisable sur un petit ecran.

   border-collapse:separate, et non collapse : en mode collapse les
   bordures appartiennent a la GRILLE et ne suivent pas un en-tete
   sticky — le trait sous les titres partait avec le defilement. Le fond
   opaque cache les lignes qui passent dessous. */
.lk-tableau-fige{max-height:max(320px,calc(100vh - 420px));overflow-y:auto}
.lk-tableau-fige .lk-tableau{border-collapse:separate;border-spacing:0}
.lk-tableau-fige thead th{
    position:sticky;top:0;z-index:2;
    /* Opaque, et non var(--panneau) : le panneau est a 94 % — les lignes
       qui defilent dessous transparaissaient a travers les titres. */
    background:#fff;
}
.lk-tableau{width:100%;border-collapse:collapse;font-size:14px}
.lk-tableau th{
    padding:10px 8px 14px;color:#6d7fa3;text-align:left;
    font-size:13px;font-weight:500;border-bottom:1px solid var(--ligne);
    white-space:nowrap;
}
/* break-word, ET SURTOUT PAS anywhere.
   Sans coupure du tout, un libelle long et sans espace etire la table au-dela
   de la page — 2 333 px pour une largeur declaree a 100 % (18/08/2026) : les
   effectifs et les pourcentages passent hors champ et le tableau parait vide.
   Mais « anywhere » abaisse la largeur MINIMALE d'une cellule : le navigateur
   s'autorise alors a couper au milieu d'un nombre, et « 6945 » sort a la
   verticale, un chiffre par ligne. « break-word » coupe le mot trop long sans
   permettre a la colonne de descendre sous la largeur de son contenu. */
.lk-tableau td{padding:14px 8px;border-bottom:1px solid var(--ligne);color:#223c73;vertical-align:middle;overflow-wrap:break-word}

/* LE TABLEAU DES QUOTAS TIENT DANS SA CARTE, A TOUTE LARGEUR.
   En mise en page automatique, la colonne Question — des identifiants
   insecables — prenait sa largeur intrinseque et poussait Completes,
   Incomplets et Etat hors de la boite : le defilement discret passait pour
   des colonnes disparues des que la fenetre descendait sous ~1450px (FR,
   21/08/2026). La mise en page FIXE distribue la largeur declaree :
   Question et Item recoivent leur part, les colonnes de chiffres se
   partagent le reste a egalite, et break-word (ci-dessus) coupe les
   libelles trop longs au lieu d'etirer la table. */
#QuotaTable{table-layout:fixed}
#QuotaTable th.lk-choix-case{width:36px}
/* Onze colonnes depuis % min et % max (12/10/2026) : a parts egales, la
   derniere — Dépassements et son menu — ne tenait plus et se coupait (FR,
   capture du 12/10 : « le dépassement est tronqué »). Question et Item
   cedent un peu ; Etat, Dépassements et les deux taux recoivent une largeur
   fixe ; les autres chiffres se partagent le reste. */
#QuotaTable th:nth-child(2){width:20%}
#QuotaTable th:nth-child(3){width:16%}
#QuotaTable th:nth-child(4),
#QuotaTable th:nth-child(5){width:86px}
#QuotaTable th:nth-child(6),
#QuotaTable th:nth-child(9){width:78px}
#QuotaTable th:nth-child(7),
#QuotaTable th:nth-child(8){width:64px}
#QuotaTable th:nth-child(10){width:96px}
#QuotaTable th:nth-child(11){width:136px}
/* Plancher : sous cette largeur, la boite defile de cote (overflow-x de
   .lk-tableau-boite) plutot que d'ecraser les chiffres les uns sur les
   autres — mesure a 1024 px le 12/10/2026, Complétés et Incomplets se
   chevauchaient. */
#QuotaTable{min-width:1080px}
/* Une jauge suit sa cellule : a 104 px, elle debordait sur la colonne
   voisine (la ligne verte sous « 18 » et « 100 % » de la capture). */
#QuotaTable .lk-jauge{width:100%;max-width:104px}
/* Le libelle de MODALITE est en 3e colonne — la case a cocher decale tout —
   et la regle generale « nowrap hors deux premieres colonnes » l'empechait
   de passer a la ligne : en mise en page fixe, il se superposait aux
   colonnes voisines au lieu d'etirer la table (FR, 21/08/2026, tard). Ici
   il se coupe en plusieurs lignes ; les colonnes de chiffres, elles,
   restent insecables. */
#QuotaTable td:nth-child(3){white-space:normal}

/* Une cellule marquee LONGUE par la page — un verbatim de question ouverte
   dans un tri a plat — reprend le droit de replier, ou qu'elle soit dans la
   ligne. Les nombres et libelles courts gardent l'insecable ci-dessus. */
.lk-tableau td.lk-cellule-longue{white-space:normal}

/* EN FENETRE ETROITE, LE TRI A PLAT IMPOSE SES LARGEURS — et seulement la :
   en pleine largeur, la mise en page naturelle validee par FR ne bouge pas.
   Certaines etudes portent des libelles enormes ; en mise en page
   automatique la colonne des libelles reclame sa largeur de contenu et
   pousse Effectifs et Pourcentage hors de la carte (FR, 22/08/2026, la
   225). En fixe, les deux premieres colonnes recoivent leur part et
   replient (break-word est deja sur les td), les colonnes de chiffres se
   partagent le reste : les effectifs restent sous les yeux. */
@media (max-width:1450px){
    .lk-tap{table-layout:fixed}
    .lk-tap td:first-child{width:22%}
    .lk-tap td:nth-child(2){width:34%}
}

/* Un nombre ne se coupe jamais : les colonnes de chiffres d'un tri a plat
   sont etroites, et c'est la premiere chose qu'un navigateur sacrifie. */
.lk-tableau td:not(:first-child):not(:nth-child(2)){white-space:nowrap}
.lk-tableau tbody tr:last-child td{border-bottom:0}

.lk-jauge{
    width:104px;height:4px;border-radius:var(--rayon-pilule);
    background:#d8dfeb;margin-top:6px;overflow:hidden;
}
.lk-jauge i{display:block;height:100%;border-radius:inherit;background:var(--vert)}
.lk-jauge.alerte i{background:var(--orange)}

/* ==========================================================================
   Boutons
   ========================================================================== */

.lk-bouton{
    display:inline-flex;align-items:center;gap:8px;
    padding:10px 16px;
    border-radius:var(--rayon-petit);
    cursor:pointer;font-weight:600;font-size:14px;
    border:1px solid transparent;
    transition:.18s ease;
}
.lk-bouton-contour{color:var(--bleu-700);background:#fff;border-color:#cedaf2}
.lk-bouton-contour:hover{border-color:var(--bleu-700)}
.lk-bouton-primaire{color:#fff;background:var(--bleu-700)}
.lk-bouton-primaire:hover{background:var(--bleu-800)}
.lk-bouton-clair{color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.26)}
.lk-bouton-clair:hover{background:rgba(255,255,255,.22)}
.lk-bouton-texte{color:var(--bleu-700);background:transparent;padding:8px 4px}
.lk-bouton-texte:hover{text-decoration:underline}

/* ==========================================================================
   Listes d'actions (exports) — rond pâle, titre, sous-titre, flèche
   ========================================================================== */

.lk-actions{display:flex;flex-direction:column}
.lk-action{
    display:grid;grid-template-columns:44px 1fr 24px;
    gap:14px;align-items:center;
    min-height:70px;
    border-bottom:1px solid var(--ligne);
}
.lk-action:last-child{border-bottom:0}
.lk-action:hover .lk-action-nom{color:var(--bleu-700)}

.lk-vignette{
    width:42px;height:42px;border-radius:50%;
    display:grid;place-items:center;
    background:#edf3ff;color:#2e64d7;
}
.lk-vignette .lk-icone{width:20px;height:20px}
.lk-vignette.vert  {background:#edf9f1;color:#28a163}
.lk-vignette.violet{background:#f1edff;color:#6f4bd8}
.lk-vignette.orange{background:#fff2e8;color:#f0832b}
.lk-vignette.cyan  {background:#e8f7fc;color:#197dae}

.lk-action-nom{display:block;font-weight:700;font-size:14px;margin-bottom:4px}
.lk-action-aide{display:block;font-size:13px;color:#6e80a5}
.lk-action-fleche{color:#2363df;font-size:28px;text-align:center;line-height:1}

/* ==========================================================================
   Activité et pastilles d'état
   ========================================================================== */

.lk-activite{
    display:grid;grid-template-columns:28px 1fr 110px 110px;
    align-items:center;gap:10px;
    padding:10px 0;border-bottom:1px solid var(--ligne);
    font-size:14px;
}
.lk-activite:last-of-type{border-bottom:0}
.lk-point{
    width:23px;height:23px;border-radius:50%;
    display:grid;place-items:center;
    color:#fff;font-size:13px;font-weight:800;
}
.lk-point.vert{background:#69b858}
.lk-point.violet{background:#6c4bd4}
.lk-point.orange{background:#f49a2b}
.lk-quand,.lk-ref{color:#6d7fa3;font-size:13px}

/* Pastille de couleur en tete de ligne de tableau.
   .lk-point ci-dessus ne convient pas ici : il fait 23px et s'affiche en
   grille — donc en bloc — parce qu'il est prevu pour porter un chiffre dans
   le fil d'activite. Dans une cellule il renverrait le libelle a la ligne. */
/* Message d'etat sous le bandeau. Ce n'est ni une alerte — rien n'est en
   panne — ni un titre : une precision de lecture sur les chiffres affiches. */
.lk-note{
    background:rgba(255,255,255,.92);
    border-left:4px solid var(--orange);
    border-radius:var(--rayon-petit);
    box-shadow:var(--ombre);
    color:var(--texte);
    padding:13px 17px;margin:0 0 14px;font-size:14px;
}

/* Precision sous un libelle de tableau : ce que le libelle seul ne dit pas. */
.lk-aide{display:block;color:#7486aa;font-size:12px;margin-top:3px;font-weight:400}

.lk-cellule-point{display:flex;align-items:center;gap:9px}
.lk-cellule-point i{width:9px;height:9px;flex:0 0 9px;border-radius:50%;display:block}
.lk-cellule-point i.vert  {background:var(--vert)}
.lk-cellule-point i.orange{background:var(--orange)}
.lk-cellule-point i.violet{background:var(--violet)}
.lk-cellule-point i.cyan  {background:var(--cyan)}
/* Quotas, colonne « Dépassements » (FR, 09/10/2026) : « Filtre questionnaire »
   est la ligne ouverte, même cyan que l'état « Ouvert ». */
.lk-depassement {white-space:nowrap; color:#6b7a99}
.lk-depassement-ouvert {color:var(--cyan); font-weight:600}
/* Le menu Autorisé / Jamais de qui peut modifier (FR, 09/10/2026). */
select.lk-depassement-choix {font:inherit; font-size:12px; padding:2px 4px; border:1px solid #cfd8ea;
    border-radius:6px; background:#fff; color:#6b7a99; max-width:120px}
select.lk-depassement-choix.lk-depassement-ouvert {color:var(--cyan); font-weight:600}
/* Nettoyage des adresses (FR, 09/10/2026) : le tableau des catégories sous la délivrabilité. */
.lk-nettoyage-entete{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 8px}
.lk-nettoyage-table{margin:6px 0 10px;max-width:640px}
/* Refus et envois des listes (FR, 12/10/2026, capture : les boutons sortaient
   de la carte) : la table prend la largeur de sa boite, les textes passent a
   la ligne, seuls les boutons restent d'un bloc ; au-dela, la boite
   (.lk-tableau-boite) defile de cote. */
.lk-table-souple{max-width:none;width:100%}
/* Meme poids que « .lk-tableau td:not(:first-child):not(:nth-child(2)) »
   (insecable), et plus loin dans le fichier : c'est elle qui l'emporte. */
.lk-tableau.lk-table-souple td:not(:last-child){white-space:normal}
.lk-tableau.lk-table-souple td:last-child{white-space:nowrap;text-align:right}
.lk-table-souple td .lk-aide{display:block}
/* Envois des listes : un nom de liste sans espace se coupe, les deux boutons
   s'empilent — la table tient dans une carte de ~500 px (12/10/2026). */
#envois_table td:first-child{overflow-wrap:anywhere}
#envois_table td:last-child .lk-bouton{display:block;width:100%;margin:3px 0;font-size:12px;padding:5px 10px}
/* Les en-tetes aussi passent a la ligne : insecables, « Dernière exécution » et
   « envoi, mails par passage » tenaient la table a 529 px dans une boite de
   434 (mesure dans le navigateur, 12/10/2026). */
.lk-tableau.lk-table-souple th{white-space:normal}
.lk-envoi-reglage td{background:var(--panneau,#f6f8fc)}
.lk-tableau.lk-table-souple tr.lk-envoi-reglage td:last-child{white-space:normal;text-align:left}
#envois_table tr.lk-envoi-reglage td .lk-bouton{display:inline-block;width:auto}
.lk-envoi-reglage label{display:inline-flex;align-items:center;gap:6px;margin:4px 14px 4px 0;white-space:nowrap}
.lk-envoi-reglage input[type=number]{width:90px}
.lk-envoi-reglage select{width:auto;min-width:0}
.lk-envoi-reglage input[name=intervalle],
.lk-envoi-reglage input[name=repete_heures],
.lk-envoi-reglage input[name=repete_minutes]{width:64px}
.lk-nettoyage-table td .lk-aide{display:block}
.lk-nettoyage-vide td{color:var(--texte-doux)}
/* « Jamais » sur un maximum illimité : le signal, à côté du menu. */
.lk-depassement .lk-aide.lk-alerte {color:#d97706; margin-left:4px; cursor:help}
/* Un état que la page ne sait pas nommer (règle : il doit se voir). */
.lk-cellule-point i.gris  {background:#94A3B8}

/* ==========================================================================
   Plan de sondage
   ========================================================================== */
.lk-sous-onglets{display:flex;gap:10px;margin:0 0 18px}
/* Deux colonnes de cases : dix-sept régions en une seule pile obligeaient à
   dérouler la page pour en décocher une. */
.lk-colonnes-2{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px}
/* La selection des actifs (03/10/2026) : des blocs repartis par le navigateur
   sur deux colonnes de hauteur egale, sans jamais couper un bloc ; le
   conteneur des criteres du cube s'efface pour que chacun s'y range. */
.lk-act-colonnes{column-count:2;column-gap:28px}
.lk-act-colonnes .lk-act-bloc{break-inside:avoid;margin-bottom:14px}
.lk-act-colonnes .lk-act-bloc > p:first-child{margin-top:0}
.lk-act-criteres{display:contents}
@media (max-width:1100px){.lk-act-colonnes{column-count:1}}
@media (max-width:700px){.lk-colonnes-2{grid-template-columns:1fr}}
.lk-case{display:flex;align-items:center;gap:8px;font-size:14px;color:#223c73;cursor:pointer}
.lk-case input{accent-color:var(--bleu, #2563eb)}

/* ==========================================================================
   Tuiles d'accès rapide
   ========================================================================== */

.lk-tuiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.lk-tuile{
    display:flex;align-items:center;gap:12px;
    padding:14px;border:1px solid var(--ligne);border-radius:var(--rayon-petit);
    background:#fff;color:var(--texte);
    transition:.18s ease;
}
.lk-tuile:hover{border-color:var(--bleu-700);box-shadow:0 8px 20px rgba(11,52,138,.12)}
.lk-tuile-nom{font-weight:700;font-size:14px;display:block}
.lk-tuile-aide{font-size:13px;color:#6e80a5;display:block}

/* Documents (17/09/2026) : ce que Logikeo a depose depuis la derniere visite.
   [hidden] explicite : la regle display ci-dessous l'emporterait sinon sur
   l'attribut, et la pastille resterait visible vide. */
.lk-pastille-nouveau{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:var(--rayon-pilule);
                     background:var(--orange);color:#fff;font-size:11px;font-weight:700;vertical-align:1px}
.lk-pastille-nouveau[hidden]{display:none}
.lk-doc-depot{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 6px;color:var(--texte)}
/* Le choix des fichiers se voit (FR, 29/09/2026 : « on ne voit pas assez le
   bouton selectionner fichier ») : le bouton natif, gris et petit, prend
   l'allure d'un .lk-bouton-contour, dans une zone en pointilles. */
.lk-doc-depot input[type=file]{padding:6px 10px 6px 6px;border:2px dashed #b9c9ec;border-radius:var(--rayon-petit);
                               background:#f5f8ff;font-size:13px;color:var(--texte);cursor:pointer;
                               width:340px;max-width:100%}
.lk-doc-depot input[type=file]:hover{border-color:var(--bleu-700)}
.lk-doc-depot input[type=file]::file-selector-button{margin-right:12px;padding:9px 16px;border-radius:var(--rayon-petit);
                               border:1px solid var(--bleu-700);background:#fff;color:var(--bleu-700);
                               font-family:inherit;font-weight:600;font-size:14px;cursor:pointer;transition:.18s ease}
.lk-doc-depot input[type=file]::file-selector-button:hover{background:var(--bleu-700);color:#fff}

/* Action principale : ouvrir l'éditeur sur l'étude en cours */
.lk-editeur{
    display:flex;align-items:center;gap:16px;
    padding:20px 24px;border-radius:var(--rayon);
    background:linear-gradient(135deg,#2f62d6,#5a43c9);
    color:#fff;box-shadow:var(--ombre);
    margin-bottom:14px;
    transition:.18s ease;
}
.lk-editeur:hover{filter:brightness(1.06)}
.lk-editeur-nom{font-size:16px;font-weight:700}
.lk-editeur-aide{font-size:13px;opacity:.88}

/* ==========================================================================
   Pied de page
   ========================================================================== */

.lk-pied{
    width:min(1380px,calc(100% - 64px));
    margin:0 auto 20px;
    display:flex;flex-wrap:wrap;gap:16px;align-items:center;
    padding:12px 8px;
    color:rgba(255,255,255,.85);font-size:13px;
}
.lk-pied-fin{margin-left:auto;display:flex;align-items:center;gap:8px}
.lk-pastille-etat{width:8px;height:8px;border-radius:50%;background:#69b858}

/* Pied colle au bas de la fenetre tant que la page est courte, et repousse
   normalement des qu'elle deborde. Un pied VRAIMENT fixe mangerait de la
   hauteur en permanence, ce qui se paie cher sur les longues listes de
   quotas ou de tableaux.

   Le :has() ne vise que les pages qui ont un pied : la page de connexion
   n'en a pas et garde donc sa mise en page telle quelle. Un navigateur qui
   ignore :has() retombe sur l'ancien comportement — le pied suit le
   contenu — sans rien casser. */
body:has(.lk-pied){display:flex;flex-direction:column}
body:has(.lk-pied) .lk-page{flex:1 0 auto}
body:has(.lk-pied) .lk-pied{flex-shrink:0}

/* Le bouton de support flotte en bas a DROITE, et le texte d'etat du pied
   est cale a droite lui aussi : sans cette reserve, l'un recouvre l'autre
   des que le pied touche le bas de la fenetre. */
body:has(.lk-support-ouvrir) .lk-pied-fin{margin-right:206px}

/* ==========================================================================
   Voile d'attente des traitements de la suite
   --------------------------------------------------------------------------
   La classe .loader est posée par le JS des pages pendant qu'un export
   tourne côté serveur. Depuis le passage en synchrone, l'attente se compte
   en minutes sur une grosse étude : l'écran doit dire qu'il se passe
   quelque chose, et empêcher un second clic.
   ========================================================================== */

.loader{
    position:fixed;inset:0;z-index:60;
    background:rgba(16,41,99,.42);
    backdrop-filter:blur(2px);
}
.loader::after{
    content:"";position:absolute;inset:0;margin:auto;
    width:54px;height:54px;border-radius:50%;
    border:5px solid #fff;border-top-color:transparent;
    animation:lk-rotation .9s linear infinite;
}
@keyframes lk-rotation{to{transform:rotate(360deg)}}

/* DEUX PALIERS AVANT LE REPLI, ET C'EST L'INTERVALLE QUI MANQUAIT.
   Il n'y avait qu'un point de rupture, a 900px, alors que la barre pleine
   demande environ 1280px : marque 230, cinq liens 620, fin de barre 300, plus
   les gouttieres. Entre 900 et 1280 rien ne s'adaptait — c'est la zone ou FR
   a vu le menu casser, vers 1040. On resserre d'abord, on replie ensuite. */
@media (max-width:1280px){
    .lk-barre{gap:14px;padding:0 20px}
    .lk-nav{gap:2px}
    .lk-nav a{padding:11px 12px;font-size:14px;gap:7px}
    .lk-barre-fin{gap:10px;font-size:13px}
}

@media (max-width:1100px){
    /* La nav prend sa propre rangee, pleine largeur : c'est plus lisible que
       cinq liens comprimes, et la barre grandit au lieu de deborder. */
    /* flex-basis:100% ET NON width:100% : .lk-nav porte flex:1, donc une base
       de 0 qui l'emporte sur width dans le calcul flex. La regle d'origine
       etait inerte — elle ne renvoyait la nav a la ligne que lorsque le
       contenu ne tenait plus de toute facon. */
    .lk-barre{padding:10px 20px}
    .lk-nav{order:3;flex:1 1 100%;justify-content:flex-start;padding-bottom:2px}

    /* La barre sombre de l'accueil a son propre repli, declare APRES sa regle
       de base — voir « Page de garde publique ». Ici il etait inerte. */
}

@media (max-width:900px){
    .lk-barre{padding:12px 20px}
    .lk-page{width:calc(100% - 32px)}
    .lk-mesure{border-right:0;border-bottom:1px solid var(--ligne)}
    .lk-pied-fin{margin-left:0}
    /* Trop etroit pour placer le texte d'etat a cote du bouton : il passe
       au-dessus plutot que dessous. */
    body:has(.lk-support-ouvrir) .lk-pied-fin{margin-right:0}
    body:has(.lk-support-ouvrir) .lk-pied{padding-bottom:58px}
}

/* TELEPHONE (FR, 14/09/2026 : « vérifier le responsive sur toutes les pages »).
   Chaque regle repond a une mesure faite a 375px de large :
   - la barre membre porte dix onglets, soit six rangees : figee, elle
     occupait 376px d'un ecran de 812 a chaque defilement. Elle suit le flux,
     et les onglets tiennent sur UNE rangee qui defile au doigt ;
   - le selecteur d'etude gardait son libelle et ses 246px sur une ligne :
     toutes les pages d'etude s'elargissaient a 525px ;
   - un titre de carte qui porte un bouton (export des quotas) ne passait pas
     a la ligne, et les tableaux des cartes, aux chiffres insecables, sortaient
     de la carte (tableau de bord, suivi) : le tableau defile DANS sa carte. */
@media (max-width:700px){
    .lk-barre{position:static}
    .lk-nav{flex-wrap:nowrap;overflow-x:auto}
    .lk-entete-etude{flex-wrap:wrap;gap:8px;width:100%}
    .lk-entete-etude .lk-select{min-width:0;width:100%}
    .lk-entete-etude .lk-etude-recherche{width:100%}
    .lk-carte{overflow-x:auto}
    .lk-carte-titre{flex-wrap:wrap}
}

/* Un element de grille et un fieldset gardent par defaut la largeur de leur
   contenu (min-width:auto, et min-content pour un fieldset) : les cartes du
   plan de sondage et les options d'export debordaient de l'ecran au lieu de
   se resserrer. Sans effet tant que la place suffit. */
.lk-grille-2-1>*,.lk-grille-1-1>*{min-width:0}
.lk-options fieldset{min-width:0}

/* Filet d'arborescence des quotas.
   A chasse fixe : les caracteres de branche doivent s'aligner d'une ligne a
   l'autre, ce qu'une police proportionnelle ne garantit pas. Non
   selectionnable — c'est un decor, il n'a rien a faire dans un copier-coller
   ni dans le classeur exporte. */
.lk-branche{
    font-family:Consolas,"Courier New",monospace;
    color:#7d93b8;
    white-space:pre;
    user-select:none;-webkit-user-select:none;
}

/* Rangs du tableau des quotas.
   Le relief suit le NIVEAU et non la descendance : deux cellules de meme
   rang doivent se ressembler, qu'elles soient decoupees ou non. Le filet dit
   le rattachement, la graisse dit le rang. */
.lk-tableau tr.lk-rang-0 td{font-weight:700;color:var(--texte)}
.lk-tableau tr.lk-rang-0{background:#e4ecfa}
.lk-tableau tr.lk-rang-1 td{font-weight:600;color:var(--texte)}
.lk-tableau tr.lk-rang-1{background:#f2f6fd}
.lk-tableau tr.lk-rang-2 td{color:#43598a}

/* Les variables de quota en pastel (FR, 12/09/2026 : « differencier les
   sous-quotas par des couleurs, ou au moins la variable de base en pastel »).
   Une teinte par niveau d'imbrication, trois en boucle : la variable de
   premier niveau (CELLS) en bleu, le sous-quota ouvert sous une de ses
   modalites (RS8_9_RECAP) en vert, le niveau suivant en mauve. La ligne de
   la variable prend le fond ; ses modalites ne portent qu'un lisere de la
   meme teinte, pour qu'on voie a quelle variable elles appartiennent sans
   que le tableau devienne un damier. Deux classes dans le selecteur : elles
   priment sur le fond des rangs ci-dessus, et c'est voulu. */
.lk-tableau tr.lk-variable.lk-teinte-1{background:#dce8fb}
.lk-tableau tr.lk-variable.lk-teinte-2{background:#dcf2e4}
.lk-tableau tr.lk-variable.lk-teinte-3{background:#efe3f7}
.lk-tableau tr.lk-modalite.lk-teinte-1 td:first-child{box-shadow:inset 4px 0 0 #b9cff2}
/* Les CELLULES DE PREMIER NIVEAU (CELL 1, CELL 2) sont les blocs du plan :
   on doit voir qu'on change de bloc (FR, 12/09/2026). Fond bleu pale sur
   toute la ligne, trait au-dessus, libelle en semi-gras — au-dessus de la
   regle des rangs et de celle des teintes, d'ou les trois classes. */
.lk-tableau tr.lk-modalite.lk-niveau-1.lk-teinte-1{background:#e9f0fb}
.lk-tableau tr.lk-modalite.lk-niveau-1.lk-teinte-1 td{border-top:2px solid #9fbbea;font-weight:600;color:var(--texte)}
.lk-tableau tr.lk-modalite.lk-teinte-2 td:first-child{box-shadow:inset 4px 0 0 #b3e0c3}
.lk-tableau tr.lk-modalite.lk-teinte-3 td:first-child{box-shadow:inset 4px 0 0 #d8c3e8}

/* Bouton desactive : pendant un calcul long, il ne doit ni repondre au
   survol ni donner l'impression qu'un second clic servirait a quelque chose. */
.lk-bouton[disabled]{opacity:.55;cursor:default;pointer-events:none}

/* ==========================================================================
   Formulaires — page de garde
   ========================================================================== */

.lk-formulaire{display:grid;gap:15px;text-align:left}
.lk-libelle{display:block;font-size:13px;color:#49628f;margin:0 0 6px;font-weight:500}

.lk-champ{
    width:100%;
    padding:13px 16px;
    border:1px solid #cedaf2;
    border-radius:var(--rayon-petit);
    background:#fff;color:var(--texte);
    font:inherit;outline:none;
    transition:.15s ease;
}
.lk-champ::placeholder{color:#93a5c4}
.lk-champ:focus{border-color:var(--bleu-700);box-shadow:0 0 0 3px rgba(47,98,214,.16)}
/* :invalid ne mord qu'apres une tentative d'envoi : sans :not(:placeholder-shown),
   un champ obligatoire encore vide s'afficherait en rouge des l'ouverture. */
.lk-champ:invalid:not(:placeholder-shown){border-color:#e2a1a1}

/* Message d'etat d'un formulaire. Masque tant que rien n'est arrive :
   ajax.js les revele par .show(). */
.lk-message{
    border-radius:var(--rayon-petit);
    padding:13px 16px;font-size:14px;margin-bottom:16px;
    text-align:left;
}
.lk-message.erreur{background:#fdeceb;color:#8d2220;border-left:4px solid #ef4444}
.lk-message.succes{background:#eafaf1;color:#14663a;border-left:4px solid #22c55e}

/* Page publique : les cartes s'y presentent en grille libre. */
.lk-grille-4{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.lk-section-publique{margin:34px 0}
.lk-section-publique h2{font-size:26px;margin:0 0 8px;letter-spacing:-.4px}
.lk-section-publique>p{margin:0 0 22px;color:rgba(255,255,255,.90);font-size:16px}
.lk-carte ul{margin:0;padding-left:18px;color:#43598a;font-size:14px;line-height:1.65}
.lk-carte ul li+li{margin-top:8px}

.lk-hero{text-align:center;padding:56px 0 34px}
.lk-hero h1{font-size:52px;letter-spacing:-1.4px;margin:0 0 12px}
.lk-hero p{margin:0;font-size:19px;color:rgba(255,255,255,.92)}

/* ==========================================================================
   Page de garde publique
   ========================================================================== */

/* La barre se pose SUR la photo : elle sort du flux, et le héros compense sa
   hauteur par son padding. Sticky l'aurait laissée au-dessus, en bandeau
   plein, ce qui coupait l'image en deux. */
.lk-barre-sombre{
    position:absolute;top:0;left:0;right:0;
    background:linear-gradient(180deg,rgba(6,14,35,.72),transparent);
    box-shadow:none;backdrop-filter:none;
    z-index:5;
}
.lk-barre-sombre .lk-nav{justify-content:flex-end;gap:2px;margin-right:8px}
.lk-barre-sombre .lk-nav a{
    font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;
    padding:10px 13px;
}

/* LE REPLI DE LA BARRE SOMBRE VIT ICI, APRES SA REGLE DE BASE — PAS AVANT.
   Il etait dans le bloc des 1100px, plus haut dans la feuille : a specificite
   egale la regle declaree ensuite l'emporte, et position:absolute gagnait donc
   a toute largeur. Sur telephone la barre, deux rangees de haut, restait posee
   sur le titre de l'accueil, des mentions legales, de la confidentialite et de
   la desinscription (capture de FR, 14/09/2026 ; mesure au banc a 375px :
   position absolute, 158px de haut, titre a 60px du bord).
   Des qu'elle prend deux rangees elle doit rentrer dans le flux, au meme
   palier que le repli de la nav. */
@media (max-width:1100px){
    .lk-barre-sombre{position:static;
        background:linear-gradient(90deg,rgba(37,86,193,.92),rgba(31,67,157,.8))}
    .lk-barre-sombre .lk-nav{justify-content:flex-start;margin-right:0}
}

.lk-heros{
    position:relative;
    padding:150px 0 132px;
    color:#fff;
    background:
        linear-gradient(90deg,rgba(6,14,35,.95) 0%,rgba(6,14,35,.78) 42%,rgba(6,14,35,.18) 100%),
        url("../img/intro-bg.jpg") center center/cover no-repeat #060e23;
}
.lk-heros-contenu{width:min(1380px,calc(100% - 64px));margin:0 auto}
.lk-heros h1{
    font-size:clamp(30px,4.4vw,50px);line-height:1.12;letter-spacing:-1.2px;
    margin:0 0 20px;max-width:16em;
}
.lk-heros p{margin:0 0 30px;font-size:17px;line-height:1.6;color:rgba(255,255,255,.86);max-width:34em}
.lk-heros-actions{display:flex;gap:14px;flex-wrap:wrap}
.lk-heros-actions .lk-bouton{padding:14px 22px;font-size:13px;letter-spacing:.06em;text-transform:uppercase}

/* Bandeau de chiffres à cheval sur la photo. */
.lk-chiffres{
    /* AUTANT DE COLONNES QUE DE CARTES, a largeur egale.
       C'etait repeat(5,1fr) en dur : en retirant une carte, la cinquieme
       colonne restait vide et la bande paraissait amputee (FR, 09/08/2026).
       grid-auto-flow:column s'ajuste au nombre reellement rendu, quel qu'il
       soit — la carte disponibilite reviendra sans qu'on y retouche.
       Pas d'auto-fit : a 850px il faisait passer la derniere carte seule a la
       ligne, ce qui donnait un bloc bancal au lieu d'une bande. */
    display:grid;grid-auto-flow:column;grid-auto-columns:1fr;
    background:#fff;color:var(--texte);
    border-radius:var(--rayon);
    box-shadow:var(--ombre);
    margin-top:-78px;position:relative;z-index:2;
    overflow:hidden;
}
.lk-chiffre{padding:30px 18px;text-align:center;border-right:1px solid var(--ligne)}
.lk-chiffre:last-child{border-right:0}
.lk-chiffre-pastille{
    width:52px;height:52px;margin:0 auto 14px;border-radius:50%;
    display:grid;place-items:center;
}
.lk-chiffre-pastille .lk-icone{width:24px;height:24px}
.lk-chiffre-valeur{font-size:27px;font-weight:800;line-height:1;margin-bottom:8px}
.lk-chiffre-nom{font-size:14px;font-weight:600;color:#33507f}
.lk-chiffre-quoi{font-size:12px;color:#8093b4;margin-top:3px}

/* Teintes douces des pastilles de chiffres — fond clair, trait colore. */
.lk-t-bleu  {background:#e8effd;color:#2f62d6}
.lk-t-vert  {background:#e7f7ea;color:#3d8b37}
.lk-t-violet{background:#f0eafb;color:#6c4bd4}
.lk-t-orange{background:#fdf0e2;color:#d9791c}
.lk-t-cyan  {background:#e4f4fb;color:#197dae}

.lk-titre-section{text-align:center;margin:56px 0 34px}
.lk-titre-section h2{font-size:29px;letter-spacing:-.6px;margin:0 0 14px}
.lk-titre-section i{display:block;width:52px;height:3px;border-radius:2px;background:#fff;margin:0 auto;opacity:.85}

/* Atouts : icône à gauche, texte à droite. */
.lk-atouts{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.lk-atout{display:flex;gap:16px;align-items:flex-start;padding:22px;background:var(--panneau);
          border-radius:var(--rayon);box-shadow:var(--ombre);color:var(--texte)}
.lk-atout-vignette{width:46px;height:46px;flex:0 0 46px;border-radius:12px;display:grid;place-items:center}
.lk-atout-vignette .lk-icone{width:22px;height:22px}
.lk-atout h3{font-size:16px;margin:0 0 7px}
.lk-atout p{margin:0;font-size:13.5px;line-height:1.6;color:#5b6f97}

/* Bandeau de confiance : une ligne, quatre garanties. */
.lk-confiance{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    background:var(--panneau);border-radius:var(--rayon);box-shadow:var(--ombre);
    color:var(--texte);margin-top:14px;overflow:hidden;
}
.lk-confiance>div{display:flex;gap:13px;align-items:center;padding:20px 22px;border-right:1px solid var(--ligne)}
.lk-confiance>div:last-child{border-right:0}
.lk-confiance b{display:block;font-size:14px}
.lk-confiance span{font-size:12.5px;color:#7486aa}
.lk-confiance .lk-icone{width:22px;height:22px;color:#2f62d6;flex:0 0 22px}

@media (max-width:900px){
    /* .lk-barre-sombre rentre dans le flux des 1100px — voir plus haut. */
    .lk-heros{padding:60px 0 96px}
    /* En dessous de cette largeur les cartes s'empilent : on rend la main au
       flux par lignes, sans quoi grid-auto-flow:column les garderait toutes
       sur une seule rangee, illisibles. */
    .lk-chiffres{margin-top:-70px;grid-auto-flow:row;
                 grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
    .lk-chiffre{border-bottom:1px solid var(--ligne)}
}

/*
 * Ouvrir une ligne de quota : le signe infini, dans la cellule du maximum.
 *
 * Discret tant qu'on ne le vise pas — c'est une action consequente, elle ne
 * doit pas attirer le clic, mais elle doit rester trouvable.
 */
.lk-ouvrir-ligne {
    border: 0;
    background: none;
    color: var(--texte-doux);
    font-size: 15px;
    line-height: 1;
    padding: 0 4px;
    cursor: pointer;
    opacity: .35;
    transition: opacity .12s, color .12s;
}

.lk-tableau tr:hover .lk-ouvrir-ligne { opacity: .7; }

.lk-ouvrir-ligne:hover,
.lk-ouvrir-ligne:focus {
    opacity: 1;
    color: var(--bleu-700);
}

/*
 * La saisie d'une cible tient dans sa colonne, sans la deformer.
 *
 * Un <input type="number"> a une largeur naturelle bien plus grande que le
 * chiffre qu'il contient, et ses fleches en ajoutent encore : la colonne
 * s'elargissait, et tout le tableau se decalait a chaque clic. min-width:0
 * autorise la cellule a le comprimer, box-sizing garde bordure et marge
 * interieure DANS la largeur, et les fleches disparaissent — on saisit un
 * objectif au clavier, pas en cliquant cent fois.
 */
.lk-cible-saisie {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 2px 6px;
    font: inherit;
    text-align: inherit;
    -moz-appearance: textfield;
}

.lk-cible-saisie::-webkit-outer-spin-button,
.lk-cible-saisie::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/*
 * Les deux colonnes d'objectifs gardent une largeur stable : sans cela, un
 * « illimite » puis un nombre court font respirer le tableau a chaque
 * enregistrement.
 */
.lk-tableau td.lk-cible { width: 130px; }

/*
 * Choix de lignes de quota, pour les reunir en un item groupe.
 *
 * La colonne des cases est etroite et sans titre : elle n'appartient pas aux
 * donnees, elle sert a agir sur elles.
 */
.lk-tableau th.lk-choix-case,
.lk-tableau td.lk-choix-case {
    width: 34px;
    padding-right: 0;
    text-align: center;
}

.lk-choix { cursor: pointer; }
/* La case posee DANS la branche, a partir du troisieme niveau (FR,
   12/09/2026) : elle remplace trois espaces de chasse fixe, d'ou une
   largeur fixee et pas de marge qui casserait l'alignement des filets. */
.lk-choix-arbre{width:14px;height:14px;margin:0 6px 0 2px;vertical-align:-2px}

/* Replier / deplier les sous-lignes d'une ligne du quota (FR, 02/10/2026 :
   « ajouter un +/- pour replier les sous quotas ou les afficher, afficher par
   defaut »). Un petit carre devant le raccourci, en chasse fixe pour que
   « + » et « − » aient la meme largeur : il se lit comme le signe d'un arbre,
   pas comme une action consequente. Une ligne repliee sous une autre porte
   lk-sous-repliee : le collage depuis Excel et le telechargement la
   reconnaissent par cette classe. */
.lk-replier{display:inline-block;width:16px;height:16px;margin:0 6px 0 0;padding:0;border:1px solid var(--ligne);border-radius:3px;background:var(--panneau);color:var(--bleu-700);font:600 12px/14px monospace;text-align:center;cursor:pointer;vertical-align:1px}
.lk-replier:hover,.lk-replier:focus{border-color:var(--bleu-700)}
.lk-tableau tr.lk-sous-repliee{display:none}

/*
 * Une ligne d'une autre fratrie s'efface pendant un choix : elle reste
 * lisible, mais on voit qu'elle n'est pas offerte. Un groupe ne reunit que
 * des modalites d'une meme question.
 */
.lk-tableau tr.lk-hors-choix { opacity: .4; }

.lk-barre-choix {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 14px;
    padding: 12px 14px;
    border-radius: var(--rayon-petit);
    background: rgba(59, 130, 246, .10);
    border: 1px solid #cedaf2;
}

/*
 * Le decompte SUIT les boutons, il ne les repousse pas : l'action doit
 * tomber sous l'oeil au meme endroit, que l'on ait coche deux lignes ou
 * douze. Un texte de longueur variable place a gauche deplacait le bouton
 * a chaque clic.
 */
.lk-barre-choix span {
    color: var(--texte-doux);
    font-size: 13px;
}

/*
 * Defaire un groupe : un vrai bouton, sous le libelle de l'item groupe.
 *
 * Il etait d'abord un simple mot souligne, en gris pale : FR ne l'a pas
 * trouve. Une action qui defait une structure doit se voir — pas dominer la
 * ligne, mais se laisser reperer sans etre cherchee.
 */
.lk-degrouper {
    display: inline-block;
    margin-top: 4px;
    padding: 3px 10px;
    border: 1px solid #cedaf2;
    border-radius: var(--rayon-pilule);
    background: #fff;
    color: var(--bleu-700);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: .15s ease;
}

.lk-degrouper:hover,
.lk-degrouper:focus {
    border-color: var(--bleu-700);
    background: var(--bleu-700);
    color: #fff;
}

.lk-degrouper[disabled] { cursor: default; opacity: .5; }

/*
 * Un maximum deborde : le signe d'ouverture se signale, il repare au lieu
 * d'ouvrir. La valeur stockee chez le fournisseur est alors negative, et personne ne
 * sait comment il la lit — mieux vaut la voir.
 */
.lk-ouvrir-ligne.lk-alerte {
    opacity: 1;
    color: var(--orange);
}

/* ==========================================================================
   Demande au support

   Bouton flottant plutot qu'une entree de menu : la demande part de la page
   ou l'on bute, sans perdre ce qu'on y faisait — et la page en question est
   jointe au message.
   ========================================================================== */
.lk-support-ouvrir {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 50;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1px solid #cedaf2;
    border-radius: var(--rayon-pilule);
    background: #fff;
    color: var(--bleu-700);
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    box-shadow: var(--ombre);
    transition: .18s ease;
}

.lk-support-ouvrir:hover { border-color: var(--bleu-700); background: #f5f8ff; }

/* ==========================================================================
   Discussion avec Logikeo (Nextcloud Talk) — FR, 19/09/2026
   Le bouton se pose AU-DESSUS de celui du support : le courriel reste, le
   chat s'ajoute. Le panneau s'ancre au meme coin, et ne depasse jamais
   l'ecran (telephone compris).
   ========================================================================== */
.lk-discussion-ouvrir {
    position: fixed; right: 18px; bottom: 66px; z-index: 50;
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 16px; border: 1px solid transparent; border-radius: var(--rayon-pilule);
    background: var(--bleu-700); color: #fff; font-weight: 600; font-size: 13px;
    cursor: pointer; box-shadow: var(--ombre); transition: .18s ease;
}
.lk-discussion-ouvrir:hover { background: var(--bleu-800); }

.lk-discussion {
    position: fixed; right: 18px; bottom: 18px; z-index: 55;
    width: min(380px, calc(100vw - 24px)); max-height: min(560px, calc(100vh - 36px));
    display: flex; flex-direction: column;
    background: #fff; color: var(--texte);
    border-radius: var(--rayon); box-shadow: 0 24px 60px rgba(16, 41, 99, .35);
    overflow: hidden;
}
.lk-discussion[hidden] { display: none; }
.lk-discussion-tete {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 8px 10px 14px; background: var(--bleu-700); color: #fff; font-size: 14px;
}
.lk-discussion-tete .lk-bouton-texte { color: #fff; font-size: 20px; line-height: 1; padding: 2px 8px; }
.lk-discussion-choix, .lk-discussion-nouveau { padding: 10px 12px 0; display: grid; gap: 8px; }
.lk-discussion-nouveau[hidden] { display: none; }
.lk-discussion .lk-champ { padding: 9px 12px; font-size: 13px; }
.lk-discussion-messages {
    flex: 1 1 auto; min-height: 160px; overflow-y: auto;
    padding: 10px 12px; display: flex; flex-direction: column; gap: 8px;
}
/* Le membre a droite, l'equipe a gauche : le sens d'un fil de messages. */
.lk-discussion-bulle {
    align-self: flex-end; max-width: 88%;
    padding: 8px 11px; border-radius: 12px 12px 3px 12px;
    background: #e8effd; font-size: 13px; line-height: 1.45;
    white-space: pre-wrap; overflow-wrap: anywhere;
}
.lk-discussion-bulle.equipe { align-self: flex-start; background: #f1f3f7; border-radius: 12px 12px 12px 3px; }
.lk-discussion-qui { display: block; font-size: 11px; color: var(--texte-doux); margin-bottom: 2px; }
/* Les reactions de Talk sous le texte (07/10/2026) : une pastille par emoji. */
.lk-discussion-reactions { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; white-space: normal; }
.lk-discussion-reactions > span:not(.lk-discussion-choix), .lk-discussion-reactions button {
    font: inherit; font-size: 12px; line-height: 1.4; padding: 1px 7px; border-radius: 10px;
    background: #fff; border: 1px solid #d7dde8; color: inherit;
}
.lk-discussion-reactions button { cursor: pointer; }
.lk-discussion-reactions button:hover { border-color: #9fb3d9; }
/* « ☺+ » discret tant qu'on ne le survole pas ; la liste des emojis a cote. */
.lk-discussion-reactions .lk-discussion-reagir { color: var(--texte-doux); opacity: .6; }
.lk-discussion-bulle:hover .lk-discussion-reagir { opacity: 1; }
.lk-discussion-choix { display: inline-flex; gap: 2px; }
.lk-discussion-choix button { border-radius: 8px; padding: 1px 5px; }
.lk-discussion-saisie { display: flex; gap: 8px; align-items: flex-end; padding: 8px 12px; }
.lk-discussion-saisie textarea { resize: none; }

.lk-support-fond {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(16, 41, 99, .38);
}

.lk-support-fond[hidden] { display: none; }

.lk-support-boite {
    width: min(34rem, 92vw);
    max-height: 88vh;
    overflow: auto;
    padding: 22px 26px;
    border-radius: var(--rayon);
    background: #fff;
    box-shadow: 0 24px 60px rgba(16, 41, 99, .3);
}

.lk-support-boite h3 { margin: 0 0 16px; color: var(--texte); }
.lk-support-boite .lk-champ { width: 100%; box-sizing: border-box; min-width: 0; }

/* ==========================================================================
   Bandeau de confirmation
   --------------------------------------------------------------------------
   Remplace les alert() de confirmation. Une boite modale du navigateur
   arrete tout et exige un clic pour annoncer une bonne nouvelle : le bandeau
   dit la meme chose sans rien interrompre, et s'efface seul (FR, 09/08/2026).

   Il ne sert QU'AUX CONFIRMATIONS. Un message d'erreur qui disparait au bout
   de trois secondes est un message qu'on rate — ceux-la restent bloquants.

   aria-live=polite : les lecteurs d'ecran l'annoncent sans couper ce qui est
   en cours de lecture.
   ========================================================================== */
/* LE BANDEAU DE NOTIFICATION S'ADRESSE PAR SON IDENTIFIANT, PAS PAR SA CLASSE.

   Il portait « .lk-bandeau », le meme nom que la bande de mesures declaree
   plus haut (ligne 255) — et comme il vient apres, c'est lui qui gagnait. La
   bande de mesures des pages Statistiques et Tableau de bord se retrouvait
   donc en position:fixed, en bas de l'ecran, a opacite zero : invisible,
   alors que son contenu etait correctement calcule. Constate par FR le
   19/08/2026, la duree mediane valant 00:00:55 dans le HTML sans jamais
   s'afficher.

   L'identifiant est unique par definition — lk_pied() n'en pose qu'un — et
   il l'emporte sur la classe sans avoir a renommer quoi que ce soit ailleurs.
   Le JavaScript continue d'ecrire className = 'lk-bandeau visible' : les
   selecteurs #lk-bandeau.visible et #lk-bandeau.erreur y repondent. */
#lk-bandeau {
    position: fixed;
    left: 50%;
    bottom: 24px;
    transform: translateX(-50%) translateY(12px);
    z-index: 80;
    max-width: min(46rem, 92vw);
    padding: 12px 20px;
    border-radius: var(--rayon-pilule);
    background: #e8f6ea;
    border: 1px solid #b6ddb9;
    color: #245c2a;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 14px 34px rgba(16, 41, 99, .22);
    opacity: 0;
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: none;
}

#lk-bandeau.visible { opacity: 1; transform: translateX(-50%) translateY(0); }

#lk-bandeau.erreur {
    background: #fdeceb;
    border-color: #f0b8b4;
    color: #8a2b23;
}

/* Le champ fichier ne se met pas en forme comme les autres : le navigateur
   dessine son propre bouton. Un cadre en pointilles suffit a le designer
   comme une zone de depot, sans tenter de le deguiser. */
.lk-support-boite input[type="file"] {
    padding: 9px 10px;
    border: 1px dashed #cedaf2;
    border-radius: var(--rayon);
    background: #fbfcff;
    font-size: 13px;
    cursor: pointer;
}

.lk-support-boite input[type="file"]:hover { border-color: var(--bleu-700); }

.lk-support-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
}


/* ==========================================================================
   Prose des pages publiques — mentions legales, confidentialite
   --------------------------------------------------------------------------
   Un texte juridique se lit mal en pleine largeur : l'oeil perd sa ligne.
   On le borne, on aere les titres, et on garde la carte blanche du reste du
   site (FR, 09/08/2026).
   ========================================================================== */
/* Une page de texte n'a pas de bandeau d'accueil pour la separer de la barre
   haute : son titre s'y retrouvait colle (FR, 09/08/2026). On lui donne l'air
   que le bandeau donne aux autres. */
.lk-page-texte{margin-top:64px}
.lk-page-texte .lk-entete-page{margin-bottom:32px}
.lk-page-texte .lk-carte{padding-top:34px;padding-bottom:34px}

.lk-texte{
    max-width:44rem;margin:0 auto;
    color:var(--texte);line-height:1.65;
}
.lk-texte h2{
    margin:28px 0 8px;font-size:17px;color:var(--bleu-700);
}
.lk-texte h2:first-child{margin-top:0}
.lk-texte p{margin:0 0 12px;font-size:14.5px}
.lk-texte a{color:var(--bleu-700)}

/* --------------------------------------------------------------------------
   Panneau d'options replie, sur la carte d'export.

   <details> natif plutot qu'un panneau en JS : il s'ouvre sans script, reste
   accessible au clavier, et l'etat replie est le bon par defaut — « par
   defaut tout est coche », donc personne n'a besoin de l'ouvrir pour obtenir
   l'export complet.
   -------------------------------------------------------------------------- */
.lk-options{margin:0 0 18px}
.lk-options>summary{
    cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:6px;
    font-size:13px;font-weight:600;color:var(--bleu-700);
    padding:6px 10px;border:1px solid var(--ligne);border-radius:8px;
    background:var(--panneau);user-select:none
}
.lk-options>summary::-webkit-details-marker{display:none}
.lk-options>summary::before{content:"\25B8";font-size:11px;transition:transform .15s}
.lk-options[open]>summary::before{transform:rotate(90deg)}
.lk-options>summary:hover{background:rgba(37,99,235,.06)}

.lk-options fieldset{
    border:1px solid var(--ligne);border-radius:10px;
    margin:12px 0 0;padding:12px 14px 14px
}
.lk-options legend{
    font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
    color:var(--texte-doux);padding:0 6px
}
.lk-options label{
    display:flex;align-items:center;gap:8px;
    font-size:13.5px;color:var(--texte);padding:4px 0;cursor:pointer
}
.lk-options label input[type=checkbox]{flex:none;width:15px;height:15px;accent-color:var(--bleu-600)}
/* L'extension de fichier, en gris : elle informe sans peser dans la lecture. */
.lk-options label span{color:var(--texte-doux);font-size:12px}
.lk-options label .lk-select{margin-left:auto;min-width:210px}
/* Sur telephone, APRES la regle ci-dessus et non dans le palier des 700px plus
   haut, ou elle etait ecrasee — le banc responsive l'a releve (14/09/2026). */
@media (max-width:700px){.lk-options label .lk-select{min-width:0}}

/* ---- Listes de questions, bascule et enregistrement ---------------------- */

/* La case de tete se detache des autres : c'est une commande, pas un choix
   de plus dans la liste. */
.lk-options label.lk-tout{
    font-weight:600;color:var(--bleu-700);
    border-bottom:1px solid var(--ligne);margin-bottom:6px;padding-bottom:8px
}
.lk-options label.lk-tout input:indeterminate{opacity:.7}

.lk-questions-barre{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.lk-questions-barre .lk-tout{flex:1;min-width:200px;border:0;margin:0;padding:0}
.lk-questions-chercher{
    flex:none;width:150px;padding:5px 9px;font:inherit;font-size:13px;
    border:1px solid var(--ligne);border-radius:8px;background:var(--panneau);color:var(--texte)
}

/* Une etude porte parfois deux cents questions : la liste defile plutot que
   de pousser le bouton d'action hors de l'ecran. */
.lk-questions-liste{
    max-height:240px;overflow-y:auto;
    border:1px solid var(--ligne);border-radius:8px;padding:6px 10px
}
.lk-questions-liste label{font-size:13px;padding:3px 0}

.lk-memoriser{
    margin-top:14px;padding:7px 12px;font:inherit;font-size:13px;font-weight:600;
    color:var(--bleu-700);background:var(--panneau);
    border:1px solid var(--ligne);border-radius:8px;cursor:pointer
}
.lk-memoriser:hover{background:rgba(37,99,235,.06)}
/* Le nombre d'items d'une boucle, pousse a droite : une information, pas une
   partie du nom. */
.lk-questions-liste label span{margin-left:auto;font-size:11.5px;opacity:.75}

/* --------------------------------------------------------------------------
   Voile d'attente.

   Il couvre la page ENTIERE, barre de navigation comprise. Un export ou un
   tri a plat dure des minutes : changer de page en cours de route perd le
   resultat sans rien dire, et rien n'empechait de lancer un second
   traitement sur la meme etude pendant le premier — ils ecrivent dans le
   meme dossier.

   pointer-events reste actif, contrairement au bandeau : c'est justement le
   role du voile d'intercepter les clics.
   -------------------------------------------------------------------------- */
.lk-voile{
    position:fixed;inset:0;z-index:9000;
    display:flex;align-items:center;justify-content:center;
    background:rgba(15,32,56,.62);backdrop-filter:blur(2px);
    opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s
}
.lk-voile.visible{opacity:1;visibility:visible}

.lk-voile-boite{
    max-width:440px;margin:0 20px;padding:28px 32px;text-align:center;
    background:var(--panneau);border-radius:var(--rayon);box-shadow:var(--ombre)
}
.lk-voile-texte{margin:16px 0 6px;font-size:15px;line-height:1.5;color:var(--texte)}
.lk-voile-note{margin:0;font-size:13px;color:var(--texte-doux)}

/* Un rond qui tourne, sans image ni police : deux bordures suffisent. */
.lk-voile-rond{
    width:34px;height:34px;margin:0 auto;border-radius:50%;
    border:3px solid rgba(37,99,235,.22);border-top-color:var(--bleu-600);
    animation:lk-tourne .8s linear infinite
}
@keyframes lk-tourne{to{transform:rotate(360deg)}}

/* L'attente DANS une tuile de mesure (durees du tableau de bord, FR,
   12/09/2026) : le meme rond, en petit et en ligne, suivi de « calcul… ».
   La page reste utilisable, seule la tuile dit qu'elle attend. */
.lk-mesure-attente{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500;color:var(--texte-doux)}
.lk-mesure-attente .lk-voile-rond{width:16px;height:16px;margin:0;border-width:2px}

/* Le voile D'UNE CARTE (FR, 21/10/2026, Quotas : « quand je change les quotas
   d'etude ici, il faudrait mettre un voile tant que les nouveaux ne sont pas
   arrives ») : les tuiles et le tableau de l'etude precedente restent
   visibles mais voiles, le rond tourne, le reste de la page vit. */
.lk-carte-attente{position:relative}
.lk-carte-attente>.lk-carte-voile{
    position:absolute;inset:0;z-index:6;border-radius:inherit;
    display:flex;align-items:center;justify-content:center;gap:10px;
    background:rgba(255,255,255,.72);font-size:15px;font-weight:500;color:var(--texte-doux)
}
.lk-carte-voile .lk-voile-rond{width:22px;height:22px;margin:0;border-width:3px}

/* Qui a demande moins d'animations n'en recoit pas : le voile reste, le rond
   cesse de tourner. */
@media (prefers-reduced-motion: reduce){
    .lk-voile-rond{animation:none}
    .lk-voile{transition:none}
}

/* --------------------------------------------------------------------------
   Quotas en lecture seule.

   « Le panel ne doit pas avoir acces a la modification / regroupement de
   quota, uniquement la visualisation » (FR, 15/08/2026).

   Le tableau est construit en JavaScript : ses cases a cocher et ses boutons
   n'existent pas dans le HTML, donc PHP ne peut pas les retirer. Le script
   s'arrete deja sur LK_QUOTAS_MODIFIABLE ; ces regles evitent en plus
   d'afficher des commandes qui ne repondraient pas.
   -------------------------------------------------------------------------- */
.lk-lecture-seule .lk-choix,
.lk-lecture-seule .lk-choix-case,
.lk-lecture-seule .lk-degrouper,
.lk-lecture-seule .lk-ouvrir-ligne{display:none}
.lk-lecture-seule td.lk-cible{cursor:default}

/* Le datamap n'est pas un format de plus : c'est le dictionnaire des exports
   codes qui le precedent. Un leger retrait le dit sans un mot. */
.lk-options label.lk-fmt-lie{
    margin-left:22px;padding-top:0;border-left:2px solid var(--ligne);
    padding-left:10px
}
/* Pilotee, donc non cliquable : le curseur le dit avant le clic. */
.lk-options label.lk-fmt-lie{cursor:default}
.lk-options label.lk-fmt-lie input[disabled]{cursor:default}

/* ==========================================================================
   LA VEILLE (02/10/2026, lib/veille.php) : apres 30 minutes sans activite,
   la page se couvre d'un voile flou et d'une carte qui demande le mot de
   passe. Au-dessus de TOUT — chat, bandeaux, voiles d'attente (60 a 80) :
   rien de la page ne doit rester cliquable ni lisible. Les traitements en
   cours continuent derriere.
   ========================================================================== */
.lk-veille{
    position:fixed;inset:0;z-index:10000;
    display:flex;align-items:center;justify-content:center;padding:16px;
    background:rgba(16,41,99,.55);
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.lk-veille[hidden]{display:none}
html.lk-en-veille,html.lk-en-veille body{overflow:hidden}
.lk-veille-carte{
    width:100%;max-width:380px;box-sizing:border-box;
    padding:28px 26px 22px;border-radius:var(--rayon);
    background:#fff;color:var(--texte);box-shadow:var(--ombre);
    display:flex;flex-direction:column;gap:10px;
}
.lk-veille-carte h2{font-size:19px;color:var(--bleu-950)}
.lk-veille-carte p{margin:0;font-size:13px;line-height:1.5;color:var(--texte-doux)}
.lk-veille-carte .lk-veille-qui{font-weight:600;color:var(--texte);font-size:14px}
.lk-veille-carte label{font-size:12px;font-weight:600;color:var(--texte);margin-top:6px}
.lk-veille-carte input[type=password]{
    font:inherit;padding:10px 12px;border:1px solid var(--ligne);border-radius:var(--rayon-petit);
    color:var(--texte);background:#fff;
}
.lk-veille-carte input[type=password]:focus{outline:2px solid var(--bleu-600);outline-offset:1px;border-color:var(--bleu-600)}
.lk-veille-carte .lk-veille-erreur{color:#c0392b;font-weight:600}
.lk-veille-carte .lk-bouton{justify-content:center;margin-top:4px}
.lk-veille-sortir{align-self:center;font-size:12px;color:var(--texte-doux);text-decoration:underline}
.lk-veille-sortir:hover{color:var(--bleu-700)}
/* La page servie pendant la veille : le fond du site, la carte seule. */
body.lk-veille-seule{min-height:100vh;margin:0}

/* ==========================================================================
   L'AIDE (02/10/2026, index_aide.php) : une notice qui se lit, donc des
   lignes courtes (70 caracteres environ), des intertitres nets, et les
   indicateurs en liste de definitions — le terme a gauche, sa definition a
   droite, l'un sous l'autre sur un telephone.
   ========================================================================== */
.lk-notice-sommaire{display:flex;flex-wrap:wrap;gap:8px;padding:16px 18px;margin-bottom:14px}
.lk-notice-sommaire a{
    padding:6px 12px;border-radius:var(--rayon-pilule);border:1px solid var(--ligne);
    color:var(--bleu-700);font-weight:600;font-size:13px;background:#fff;
}
.lk-notice-sommaire a:hover,.lk-notice-sommaire a:focus{border-color:var(--bleu-700)}
.lk-notice{display:flex;flex-direction:column;gap:14px}
/* Nouveautés (FR, 09/10/2026) : un onglet par page, la date en pilule devant chaque entrée. */
.lk-onglets{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 14px;border-bottom:1px solid var(--ligne);padding-bottom:10px}
.lk-onglet{font:inherit;font-size:13px;font-weight:600;padding:6px 12px;border-radius:var(--rayon-pilule);
           border:1px solid var(--ligne);background:#fff;color:var(--bleu-700);cursor:pointer}
.lk-onglet:hover,.lk-onglet:focus{border-color:var(--bleu-700)}
.lk-onglet.courant{background:var(--bleu-700);border-color:var(--bleu-700);color:#fff}
.lk-onglet-nombre{display:inline-block;min-width:18px;padding:0 5px;margin-left:4px;border-radius:9px;
                  background:#eef3ff;color:var(--bleu-700);font-size:11px;text-align:center}
.lk-onglet.courant .lk-onglet-nombre{background:rgba(255,255,255,.25);color:#fff}
.lk-onglet-panneau[hidden]{display:none}
/* Ce qui est nouveau depuis la derniere lecture (17/10/2026) : la pastille orange
   de l'onglet Aide, repetee sur l'onglet de la rubrique et devant chaque entree. */
.lk-onglet .lk-pastille-nouveau{margin-left:6px}
.lk-notice-sommaire .lk-pastille-nouveau{margin-left:6px}
.lk-nouveautes-neuve{display:inline-block;padding:0 7px;border-radius:var(--rayon-pilule);background:var(--orange);
                     color:#fff;font-size:11px;font-weight:700;vertical-align:1px}
.lk-nouveautes-liste{list-style:none;padding-left:0}
.lk-nouveautes-liste li{display:flex;gap:10px;align-items:baseline}
.lk-nouveautes-date{flex:0 0 auto;padding:1px 8px;border-radius:var(--rayon-pilule);background:#eef3ff;
                    color:var(--bleu-700);font-size:12px;font-weight:600;white-space:nowrap}
.lk-notice .lk-carte{scroll-margin-top:16px}
.lk-notice h3{font-size:14px;color:var(--bleu-950);margin:16px 0 6px}
.lk-notice p,.lk-notice ul,.lk-notice dl{max-width:72ch;line-height:1.6;color:var(--texte);font-size:14px}
.lk-notice p{margin:0 0 8px}
.lk-notice ul{margin:0 0 8px;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.lk-notice-termes{display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:6px 18px;margin:8px 0 12px}
.lk-notice-termes dt{font-weight:600;color:var(--bleu-950)}
.lk-notice-termes dd{margin:0;color:var(--texte)}
.lk-notice-adresse{font-weight:600;user-select:all}
@media (max-width:640px){
    .lk-notice-termes{grid-template-columns:1fr;gap:2px}
    .lk-notice-termes dd{margin-bottom:8px}
}

/* La disponibilite des contacts par ligne de quota (18/10/2026) : l'ecran
   Disponibilite des quotas du Superviseur, onglet CATI et Suivi emailing. */
.lk-dispo-boite{max-height:max(320px,calc(100vh - 360px));overflow:auto}
.lk-dispo-table{border-collapse:separate;border-spacing:0;font-size:13px}
.lk-dispo-table thead th{position:sticky;top:0;z-index:1;background:#f4f7fd;white-space:normal;min-width:70px}
.lk-dispo-table td{padding:6px 8px;white-space:nowrap;text-align:right}
.lk-dispo-table td.lk-dispo-libelle{text-align:left;white-space:nowrap}
.lk-dispo-table tr.lk-dispo-p0 td{font-weight:700;background:#fde7d6}
.lk-dispo-table tr.lk-dispo-p1 td{font-weight:600;background:#e4f2e1}
.lk-dispo-table tr.lk-dispo-p2 td{background:#f2f8f0}
.lk-dispo-table tr.lk-dispo-rouge td.lk-dispo-libelle{color:#b42318;font-weight:600}
.lk-dispo-table tr.lk-dispo-orange td.lk-dispo-libelle{color:#b46a00;font-weight:600}
.lk-dispo-point{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:0}
.lk-dispo-point-rouge{background:#d92d20}
.lk-dispo-point-orange{background:var(--orange)}
.lk-dispo-point-vert{background:var(--vert)}
.lk-dispo-bilan{margin:0 0 8px}
.lk-dispo-barre{margin:0 0 10px}