@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
  *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
  :root{
    --ink:#161616;--grey-1:#86868b;--grey-2:#a1a1a6;
    --line:#ededef;--line-2:#e3e3e6;--bg:#fbfbfb;--card:#fff;--fill:#f4f4f2;
    --accent:#62b616;--accent-dk:#4f9211;--accent-soft:#e9f5db;
    --green:#2f7d4f;--amber:#d98b00;
    --grade-a:#62b616;--grade-b:#d98b00;--grade-c:#e0683a;
    --vendor:#62b616;--tech:#7c4dff;--manager:#0a7d8c;--admin:#e0683a;
    --radius:18px;
    --shadow:0 2px 10px rgba(0,0,0,.04),0 1px 3px rgba(0,0,0,.05);
    --shadow-lg:0 12px 48px rgba(0,0,0,.16);
    --topbar-bg:rgba(251,251,253,.82);
  }
  /* ===== Thèmes d'affichage (préférence par utilisateur, users.theme) =====
     Chaque thème ne fait que redéfinir les variables neutres : tout ce qui
     utilise var(--bg/--card/--ink/…) suit automatiquement. Les couleurs
     sémantiques (accent vert, badges d'agenda, grades) restent volontairement
     stables d'un thème à l'autre. */
  /* Sombre — d'après GitHub Primer (dark default), croisé Material 3 / Tailwind zinc.
     Fond quasi-noir (jamais #000), texte quasi-blanc (jamais #fff). Texte principal
     16:1 sur le fond, secondaires ≥4.6:1 (WCAG AA). Le vert de marque #62b616 passe
     AA sur fond sombre (7.4:1) → conservé ; --accent-dk éclairci pour le texte vert. */
  :root[data-theme="dark"]{
    --ink:#e6edf3;--grey-1:#9198a1;--grey-2:#7d8590;
    --line:#30363d;--line-2:#444c56;--bg:#0d1117;--card:#161b22;--fill:#21262d;
    --accent:#62b616;--accent-dk:#7ee23a;--accent-soft:#1c2b12;
    --shadow:0 2px 10px rgba(0,0,0,.4),0 1px 3px rgba(0,0,0,.5);
    --shadow-lg:0 16px 50px rgba(0,0,0,.6);
    --topbar-bg:rgba(13,17,23,.82);
    color-scheme:dark;
  }
  /* Sépia — d'après le mode lecture Kindle (crème #fbf0d9) et Apple Books. Texte
     brun foncé (9.5:1 sur le fond, WCAG AA large). Vert de marque assombri à
     #3f720f pour rester lisible en texte sur le crème (5.1:1). */
  :root[data-theme="sepia"]{
    --ink:#4a3b2e;--grey-1:#7a6a55;--grey-2:#96876f;
    --line:#e4d5b7;--line-2:#d3c09b;--bg:#fbf0d9;--card:#fff8ea;--fill:#f1e4c9;
    --accent:#5a9e17;--accent-dk:#3f720f;--accent-soft:#e6edc9;
    --shadow:0 2px 10px rgba(90,70,30,.07),0 1px 3px rgba(90,70,30,.09);
    --shadow-lg:0 14px 48px rgba(90,70,30,.22);
    --topbar-bg:rgba(251,240,217,.85);
  }
  /* Jamais de scroll horizontal de page : le contenu large scrolle dans son propre
     conteneur. Corrige aussi Safari iOS, où les tiroirs garés hors écran à droite
     (translateX(100%)) agrandissent la zone de scroll. « clip » (sans conteneur de
     scroll, position:sticky préservé) avec repli « hidden » pour anciens navigateurs. */
  html,body{overflow-x:hidden;overflow-x:clip;}
  body{font-family:'Manrope',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;letter-spacing:-.011em;min-height:100vh;}
  /* ---- Barre du haut : logo, recherche, boutique, compte. Tous les contrôles
         partagent la même hauteur (38px) et le même arrondi (12px). ---- */
  .topbar{background:var(--topbar-bg);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line);height:60px;position:sticky;top:0;z-index:50;}
  .topbar::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--accent);}
  /* Contenu de la barre aligné sur la même colonne (1120px) que .wrap, tout en gardant le fond pleine largeur. */
  .topbar-in{display:flex;align-items:center;gap:12px;height:100%;max-width:1120px;margin:0 auto;padding:0 24px;}
  .brand{display:flex;align-items:center;gap:10px;cursor:pointer;flex-shrink:0;}
  .brand-logo{height:32px;width:auto;display:block;}
  /* Logo « Coral » : le lettrage est en #161616 (foncé) dans le SVG → invisible
     sur le fond sombre. On le recolore en thème sombre (le point vert et le blanc
     du SVG gardent leurs propres couleurs). */
  :root[data-theme="dark"] .brand-logo g[fill="#161616"]{fill:var(--ink);}
  .brand-tag{font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--grey-2);border-left:1px solid var(--line-2);padding-left:10px;line-height:1;}
  /* Logo « texte » du mode démo (remplace le SVG quand une enseigne est configurée). */
  .brand-wordmark{font-size:20px;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1;white-space:nowrap;}
  .login-wordmark{display:block;text-align:center;font-size:26px;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1;margin:0 auto 14px;}
  .tb-spacer{flex:1;}
  /* Bloc de droite : actions groupées, séparateurs, boutons d'icône unifiés. */
  .tb-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
  .tb-ico{position:relative;width:38px;height:38px;border-radius:12px;border:none;background:var(--fill);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;color:var(--ink);flex-shrink:0;transition:background .15s;}
  .tb-ico .lc{font-size:18px;}
  @media(hover:hover){ .tb-ico:hover{background:var(--line-2);} }
  .tb-ico:active{transform:scale(.96);}
  .tb-ico.logout{font-size:15px;color:var(--grey-1);}
  .tb-ico.logout:hover{background:#fdeee6;color:#e0683a;}
  .tb-user{display:flex;align-items:center;gap:9px;height:38px;padding:0 8px 0 4px;border-radius:12px;cursor:pointer;position:relative;transition:background .15s;}
  @media(hover:hover){ .tb-user:hover{background:var(--fill);} }
  .tb-user.open{background:var(--fill);}
  .tb-av{width:30px;height:30px;border-radius:9px;color:#fff;font-size:11.5px;font-weight:800;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;background:var(--accent);flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);}
  .tb-user-tx{line-height:1.15;min-width:0;}
  .tb-name{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px;}
  .tb-role{font-size:10.5px;color:var(--grey-2);font-weight:600;margin-top:1px;}
  .tb-caret{font-size:15px;color:var(--grey-2);transition:transform .18s;}
  .tb-user.open .tb-caret{transform:rotate(180deg);}
  /* Voile derrière les menus en feuille (mobile), posé par syncTbScrim(). */
  .tb-scrim{display:none;}
  /* Recherche globale (topbar) */
  .tb-search{position:relative;flex:1;max-width:380px;min-width:0;}
  .gs-kbd{position:absolute;right:9px;top:50%;transform:translateY(-50%);font:inherit;font-size:11px;font-weight:700;color:var(--grey-2);border:1px solid var(--line-2);border-radius:6px;min-width:20px;height:20px;padding:0 5px;display:flex;align-items:center;justify-content:center;background:var(--card);pointer-events:none;transition:opacity .15s;}
  .tb-search:focus-within .gs-kbd{opacity:0;}
  .gs-mbtn{display:none;}
  /* Mobile : le champ intégré est remplacé par un bouton 🔎 qui ouvre une
     recherche PLEIN ÉCRAN (gs-mov) — pas de champ compressé, pas de zoom iOS. */
  @media(max-width:768px){
    .tb-search{display:none;}
    .gs-mbtn{display:flex;}
    /* Aucun champ sous 16px sur petit écran, connexion comprise : en dessous,
       Safari iOS zoome la page au focus et le zoom reste ensuite. */
    input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:max(16px,1em);}
  }
  .gs-mov{position:fixed;inset:0;z-index:120;background:var(--bg);display:none;flex-direction:column;}
  .gs-mov.show{display:flex;}
  .gs-mhead{display:flex;align-items:center;gap:8px;padding:10px 12px;padding-top:calc(10px + env(safe-area-inset-top,0px));background:var(--card);border-bottom:1px solid var(--line);}
  .gs-mfield{flex:1;position:relative;min-width:0;}
  .gs-mfield .lc{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--grey-2);pointer-events:none;}
  /* 16px minimum : en dessous, iOS Safari zoome toute la page au focus. */
  .gs-mhead input{width:100%;height:42px;min-width:0;font:inherit;font-size:16px;font-weight:500;padding:0 14px 0 42px;border-radius:12px;border:1px solid transparent;background:var(--fill);color:var(--ink);outline:none;}
  .gs-mhead input:focus{border-color:var(--accent);background:var(--card);box-shadow:0 0 0 3px var(--accent-soft);}
  .gs-mbox{flex:1;overflow-y:auto;overflow-x:hidden;background:var(--card);}
  .gs-mbox .ac-item{padding:13px 16px;font-size:14px;}
  .gs-mbox .gs-h{padding:12px 16px 5px;}
  .gs-mbox .ac-empty{padding:18px 16px;}
  .tb-search .gs-ic{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:17px;color:var(--grey-2);pointer-events:none;transition:color .15s;}
  .tb-search:focus-within .gs-ic{color:var(--accent-dk);}
  .tb-search input{width:100%;height:38px;font:inherit;font-size:13.5px;font-weight:500;padding:0 40px 0 38px;border-radius:12px;border:1px solid transparent;background:var(--fill);color:var(--ink);outline:none;transition:border-color .15s,background .15s,box-shadow .15s;}
  .tb-search input::placeholder{color:var(--grey-2);}
  .tb-search input:focus{border-color:var(--accent);background:var(--card);box-shadow:0 0 0 3px var(--accent-soft);}
  .tb-search .ac-box{max-height:min(430px,70vh);}
  .gs-h{display:flex;align-items:center;gap:6px;padding:9px 13px 4px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--grey-2);background:var(--fill);}
  .gs-h .lc{font-size:13px;}
  /* ---- Boutique de travail : bouton en pastille, menu dessiné comme le menu
     du compte ; le <select> natif reste dans la page mais invisible (lu par
     les modules, il porte le changement). */
  .shop-pick{position:relative;}
  .shop-native{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;overflow:hidden;}
  .shop-btn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 9px 0 11px;border-radius:12px;border:none;background:var(--fill);color:var(--ink);font:inherit;font-size:13px;font-weight:700;cursor:pointer;max-width:240px;transition:background .15s;}
  .shop-btn.open{background:var(--line-2);}
  .shop-btn .lc{font-size:17px;color:var(--grey-1);}
  .shop-btn .shop-caret{font-size:15px;transition:transform .18s;}
  .shop-btn.open .shop-caret{transform:rotate(180deg);}
  .shop-btn #shop-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  @media(hover:hover){ .shop-btn:not(:disabled):hover{background:var(--line-2);} }
  .shop-btn.fixed{cursor:default;padding-right:13px;}
  .shop-btn.fixed .shop-caret{display:none;}
  .shop-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:236px;max-width:88vw;background:var(--card);border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--shadow-lg);z-index:200;overflow:hidden;padding:6px;display:flex;flex-direction:column;animation:tbmenu-in .16s ease-out;}
  .shop-menu::after{content:"";display:none;order:-1;width:40px;height:5px;border-radius:3px;background:var(--line-2);margin:2px auto 10px;flex-shrink:0;}
  @keyframes tbmenu-in{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
  @keyframes tbsheet-in{from{transform:translateY(100%);}to{transform:none;}}
  @keyframes tbscrim-in{from{opacity:0;}to{opacity:1;}}
  .shop-opt{width:100%;display:flex;align-items:center;gap:10px;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);background:none;border:none;border-radius:9px;padding:10px 11px;cursor:pointer;text-align:left;transition:background .14s;}
  @media(hover:hover){ .shop-opt:hover{background:var(--fill);} }
  .shop-opt .so-dot{width:8px;height:8px;border-radius:50%;background:var(--line-2);flex-shrink:0;}
  .shop-opt.on .so-dot{background:var(--accent);}
  .shop-opt .so-tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .shop-opt .so-ck{font-size:16px;color:var(--accent-dk);}
  .shop-opt .lc{font-size:16px;color:var(--grey-1);}
  .shop-opt.add{color:var(--grey-1);margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 9px 9px;padding-top:12px;}
  @media(hover:hover){ .shop-opt.add:hover{color:var(--ink);} }
  .role-sw{display:flex;align-items:center;gap:7px;}
  .role-sw .lbl{font-size:11px;color:var(--grey-2);font-weight:600;}
  .role-pills{display:flex;background:var(--fill);border-radius:980px;padding:3px;gap:1px;}
  .role-pills button{font:inherit;font-size:12px;font-weight:600;color:var(--grey-1);padding:6px 11px;border:none;background:none;cursor:pointer;border-radius:980px;transition:all .15s;display:flex;align-items:center;gap:5px;}
  .role-pills button .rd{width:6px;height:6px;border-radius:50%;}
  .role-pills button.active{background:var(--card);color:var(--ink);box-shadow:var(--shadow);}
  .wrap{max-width:1120px;margin:0 auto;padding:42px 26px 90px;}
  .view{display:none;}
  .view.active{display:block;animation:rise .4s cubic-bezier(.16,1,.3,1);}
  @keyframes rise{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
  /* Tactile : pas d'animation d'entrée de vue. Le transform animé sur une grande vue,
     combiné au retour arrière depuis le bas de page, faisait planter le repaint de
     Safari iOS (moitié d'écran vide jusqu'au scroll). Purement cosmétique sur mobile. */
  @media(hover:none){ .view.active{animation:none;} }
  /* ===================================================================
     ACCUEIL — bandeau à la couleur de la société, onglets, cartes, pile.
     Icônes : sprite SVG Lucide (partials/icons.php), classe .lc.
     =================================================================== */
  .lc{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;display:inline-block;vertical-align:-.15em;}
  /* Texte posé sur la couleur société : sombre sur le vert Coral ; theme.js le
     passe en blanc si la société choisit une couleur foncée (--accent-ink). */
  :root{--accent-ink:#141a16;--alert:#c0561f;--alert-soft:#fdeee6;--amber:#b87400;--amber-soft:#fff4dc;
        --todo-eyebrow:#c0561f;}
  :root[data-theme="dark"]{--alert:#f08a5d;--alert-soft:#3a2016;--amber:#f0b440;--amber-soft:#33270f;--todo-eyebrow:#f08a5d;}
  :root[data-theme="sepia"]{--alert-soft:#f8e1d2;--amber-soft:#f4e6c2;}
  /* ---- En-tête : le bonjour sur le fond de page, un seul clin d'œil à la
     marque (le point final du bonjour, vert comme celui du logo), puis les
     onglets soulignés d'un trait à la couleur société. */
  .band{margin:0;padding:0;}
  .hello h1{font-size:36px;font-weight:800;letter-spacing:-.03em;line-height:1.08;color:var(--ink);}
  .hello h1 .dot{color:var(--accent);}
  .hello p{font-size:16px;margin-top:9px;font-weight:500;color:var(--grey-1);line-height:1.6;}
  .hello #hello-sub b{color:var(--ink);font-weight:700;}
  .hello #hello-sub b.late{color:var(--alert);}
  /* ---- Onglets : une rangée fine, le trait vert sous l'onglet ouvert. */
  /* Défilement horizontal seulement : overflow-y caché + overscroll contenu, sinon
     Safari iOS laisse la rangée rebondir verticalement sous le doigt. */
  .folders{display:flex;gap:2px;margin-top:26px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;overscroll-behavior-y:none;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;scrollbar-width:none;position:relative;border-bottom:1px solid var(--line);}
  .folders::-webkit-scrollbar{display:none;}
  .fo{font:inherit;border:0;background:none;border-radius:10px 10px 0 0;padding:10px 14px 13px;font-weight:700;font-size:14px;cursor:pointer;white-space:nowrap;display:inline-flex;gap:8px;align-items:center;color:var(--grey-1);flex:0 0 auto;position:relative;transition:color .15s,background .15s;}
  .fo .fo-ic{font-size:17px;}
  .fo::after{content:'';position:absolute;left:12px;right:12px;bottom:0;height:2.5px;border-radius:2px;background:transparent;transition:background .15s;}
  .fo[aria-selected="true"]{color:var(--ink);}
  .fo[aria-selected="true"]::after{background:var(--accent);}
  .fo[aria-selected="true"] .fo-ic{color:var(--accent-dk);}
  @media(hover:hover){ .fo:not([aria-selected="true"]):hover{color:var(--ink);background:var(--fill);} }
  .tdot{min-width:20px;height:20px;border-radius:10px;background:var(--fill);color:var(--grey-1);font-size:11px;font-weight:800;display:inline-grid;place-items:center;padding:0 6px;font-variant-numeric:tabular-nums;}
  .fo[aria-selected="true"] .tdot{background:var(--ink);color:var(--card);}
  .apps-panel{padding:22px 0 0;}
  .apps-panel .grp-title{margin:0 0 14px;display:flex;align-items:center;}
  /* ---- Grille de cartes : 4 par rangée au large, 2 sur téléphone. auto-fill
     (pas auto-fit) : les colonnes vides sont conservées, toutes les cartes ont
     la même largeur quel que soit leur nombre. */
  .tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:16px;}
  #apps{row-gap:26px;}   /* place pour les cartes qui dépassent sous la pile */
  :root{--tile-h:176px;}
  /* Toutes les cartes ont la même hauteur, quelle que soit la rangée : la pile
     « À traiter » (plus de contenu) est compactée pour tenir dans la même boîte. */
  .tile{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 18px 16px;height:var(--tile-h);cursor:pointer;position:relative;display:flex;flex-direction:column;gap:12px;transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s,border-color .22s;}
  @media(hover:hover){ .tile:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(20,26,22,.08);border-color:var(--line-2);} }
  .tile.locked{cursor:default;opacity:.6;}
  .tile.locked:hover{transform:none;box-shadow:none;border-color:var(--line);}
  /* Pastille d'icône : icône blanche sur la couleur du module (ci-dessous). */
  .tile-ic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;background:var(--grey-2);font-size:22px;flex-shrink:0;}
  .tile-ic .lc{stroke-width:2.1;}
  .tile h3{font-size:15.5px;font-weight:700;letter-spacing:-.015em;line-height:1.2;}
  .tile p{display:none;}   /* la description n'est plus affichée : le chiffre suffit */
  .tile-meta{margin-top:auto;display:flex;align-items:baseline;gap:7px;font-size:12.5px;color:var(--grey-1);font-weight:500;font-variant-numeric:tabular-nums;min-height:26px;}
  .tile-meta>span:first-child{display:flex;align-items:baseline;gap:7px;min-width:0;}
  .tile-meta b{color:var(--accent-dk);}
  .tile-n{font-size:26px;font-weight:800;color:var(--accent-dk);line-height:1;letter-spacing:-.03em;}
  .tile-nl{font-size:12.5px;color:var(--grey-1);font-weight:500;}
  /* Flèche : discrète, elle n'apparaît qu'au survol (pas sur tactile). */
  .tile-meta .arrow{position:absolute;right:14px;bottom:14px;width:28px;height:28px;border-radius:50%;background:var(--fill);color:var(--grey-1);font-size:14px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s,background .16s,color .16s;}
  @media(hover:hover){ .tile:hover .tile-meta .arrow{opacity:1;} }
  /* Couleur de chaque module, partagée par la tuile de l'accueil et les lignes
     de la fenêtre « À traiter ». Réparation prend la couleur société. */
  :root{--mod-repair:var(--accent);--mod-orders:#f28c28;--mod-sav:#0ea5a0;--mod-clients:#3b82f6;--mod-buyback:#d4a017;--mod-rent:#7c4dff;--mod-messages:#2563eb;--mod-agenda:#ef4444;--mod-hours:#ec4899;--mod-recond:#10b981;--mod-itv:#f97316;--mod-dev:#475569;--mod-loan:#8b5cf6;--mod-desk:#f59e0b;--mod-labels:#14b8a6;--mod-dash:#0ea5e9;--mod-payments:#a855f7;--mod-supply:#ea580c;--mod-users:#64748b;--mod-onboarding:#22c55e;--mod-kb:#0891b2;--mod-feedback:#d946ef;--mod-pos:#334155;--mod-assist:#a3e635;}
  #t-repair .tile-ic,.tm-row[data-mod="repair"] .tm-ic{background:var(--mod-repair);}
  #t-orders .tile-ic,.tm-row[data-mod="orders"] .tm-ic{background:var(--mod-orders);}
  #t-sav .tile-ic,.tm-row[data-mod="sav"] .tm-ic{background:var(--mod-sav);}
  #t-clients .tile-ic,.tm-row[data-mod="clients"] .tm-ic{background:var(--mod-clients);}
  #t-buyback .tile-ic,.tm-row[data-mod="buyback"] .tm-ic{background:var(--mod-buyback);}
  #t-rent .tile-ic,.tm-row[data-mod="rent"] .tm-ic{background:var(--mod-rent);}
  #t-messages .tile-ic,.tm-row[data-mod="messages"] .tm-ic{background:var(--mod-messages);}
  #t-agenda .tile-ic,.tm-row[data-mod="agenda"] .tm-ic{background:var(--mod-agenda);}
  #t-hours .tile-ic,.tm-row[data-mod="hours"] .tm-ic{background:var(--mod-hours);}
  #t-recond .tile-ic,.tm-row[data-mod="recond"] .tm-ic{background:var(--mod-recond);}
  #t-itv .tile-ic,.tm-row[data-mod="itv"] .tm-ic{background:var(--mod-itv);}
  #t-dev .tile-ic,.tm-row[data-mod="dev"] .tm-ic{background:var(--mod-dev);}
  #t-loan .tile-ic,.tm-row[data-mod="loan"] .tm-ic{background:var(--mod-loan);}
  #t-desk .tile-ic,.tm-row[data-mod="desk"] .tm-ic{background:var(--mod-desk);}
  #t-labels .tile-ic,.tm-row[data-mod="labels"] .tm-ic{background:var(--mod-labels);}
  #t-dash .tile-ic,.tm-row[data-mod="dash"] .tm-ic{background:var(--mod-dash);}
  #t-payments .tile-ic,.tm-row[data-mod="payments"] .tm-ic{background:var(--mod-payments);}
  #t-supply .tile-ic,.tm-row[data-mod="supply"] .tm-ic{background:var(--mod-supply);}
  #t-users .tile-ic,.tm-row[data-mod="users"] .tm-ic{background:var(--mod-users);}
  #t-onboarding .tile-ic,.tm-row[data-mod="onboarding"] .tm-ic{background:var(--mod-onboarding);}
  #t-kb .tile-ic,.tm-row[data-mod="kb"] .tm-ic{background:var(--mod-kb);}
  #t-feedback .tile-ic,.tm-row[data-mod="feedback"] .tm-ic{background:var(--mod-feedback);}
  #t-pos .tile-ic,.tm-row[data-mod="pos"] .tm-ic{background:var(--mod-pos);}
  #t-assist .tile-ic,.tm-row[data-mod="assist"] .tm-ic{background:var(--mod-assist);}
  /* Étiquettes de coin (réservées aux tuiles verrouillées « Bientôt »). */
  .tag{position:absolute;top:14px;right:14px;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:4px 9px;border-radius:980px;background:var(--fill);color:var(--grey-2);}
  .tag.on{display:none;}
  .tag.ro{background:#f0ecff;color:#5b35d6;}
  .tag.alert{background:var(--alert-soft);color:var(--alert);}
  /* ---- Pile « À traiter » : une carte claire comme les autres, et dessous
     deux fiches de la même taille qui dépassent en diagonale (bas-droite),
     comme un paquet de fiches posé sur le comptoir. Au survol, le paquet
     s'étale un peu. ---- */
  .pw{position:relative;display:flex;min-width:0;}
  .pw>.tile{flex:1;position:relative;}
  .deckg{position:absolute;inset:0;border-radius:16px;pointer-events:none;background:var(--card);border:1px solid var(--line-2);box-shadow:0 1px 2px rgba(20,26,22,.05);transition:transform .35s cubic-bezier(.16,1,.3,1);}
  .deckg.g1{transform:translate(5px,5px);}
  .deckg.g2{transform:translate(10px,10px);background:var(--fill);}
  @media(hover:hover){
    .pw:hover .deckg.g1{transform:translate(7px,7px);}
    .pw:hover .deckg.g2{transform:translate(14px,14px);}
  }
  .tile-todo{border-color:var(--line-2);box-shadow:0 6px 18px rgba(20,26,22,.10),0 1px 2px rgba(20,26,22,.05);}
  @media(hover:hover){ .tile-todo:hover{border-color:var(--line-2);box-shadow:0 12px 26px rgba(20,26,22,.14);} }
  .tile-todo{gap:8px;padding:16px 16px 14px;}
  .tile-todo .tile-ic{background:var(--alert);color:#fff;width:32px;height:32px;border-radius:10px;font-size:17px;}
  .tile-todo .todo-n{position:absolute;top:14px;right:14px;min-width:24px;height:24px;padding:0 7px;border-radius:12px;background:var(--alert);color:#fff;font-size:12.5px;font-weight:800;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums;}
  .tile-todo .todo-eyebrow{display:flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--todo-eyebrow);margin:0 0 -4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums;}
  .tile-todo h3{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .tile-todo p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:12.5px;color:var(--grey-1);line-height:1.35;font-weight:500;margin:0;}
  .tile-todo p .kt{font-weight:800;}
  .tile-todo .tile-meta{min-height:22px;}
  .tile-todo .tile-meta .arrow{opacity:1;width:26px;height:26px;right:12px;bottom:12px;}
  .tile-todo.done .tile-ic{background:var(--accent);}
  .tile-todo.done .todo-eyebrow{color:var(--accent);}
  .d{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block;}
  .d.red{background:var(--alert);} .d.amber{background:var(--amber);} .d.green{background:var(--accent);}
  .kt.red{color:var(--alert);} .kt.amber{color:var(--amber);} .kt.green{color:var(--accent-dk);}
  /* ---- En-tête de la fenêtre « À traiter » */
  .todo-mh-ic{width:40px;height:40px;border-radius:11px;margin:0;background:var(--alert);font-size:19px;}
  /* ---- Téléphone : bandeau collé aux bords, cartes sur deux colonnes. */
  @media(max-width:768px){
    .folders{margin:20px -18px 0;padding:0 18px;}
    .fo{padding:9px 12px 12px;font-size:13.5px;}
  }
  @media(max-width:640px){
    .tiles{grid-template-columns:1fr 1fr;gap:12px;}
    #apps{row-gap:20px;}
    :root{--tile-h:168px;}
    .tile{padding:14px;gap:10px;border-radius:14px;}
    .tile-ic{width:36px;height:36px;border-radius:11px;font-size:19px;}
    .tile h3{font-size:14px;}
    .tile-n{font-size:22px;}
    .tile-meta .arrow{display:none;}
    .tile-todo{padding:13px 13px 12px;gap:7px;}
    .tile-todo .tile-ic{width:30px;height:30px;}
    .tile-todo h3{font-size:14.5px;}
    .tile-todo p{font-size:12px;}
    .tile-todo .todo-eyebrow{font-size:10px;letter-spacing:.05em;}
    .tile-todo .tile-meta .arrow{display:flex;}
    .deckg{border-radius:14px;}
    .deckg.g1{transform:translate(4px,4px);}
    .deckg.g2{transform:translate(8px,8px);}
  }
  @media(max-width:480px){
    .folders{margin:18px -14px 0;padding:0 14px;}
  }
  .proto-pill{display:inline-flex;align-items:center;gap:6px;background:var(--fill);color:var(--grey-1);font-size:11.5px;font-weight:600;padding:5px 11px;border-radius:980px;margin-bottom:18px;}
  .proto-pill .pd{width:6px;height:6px;border-radius:50%;background:var(--amber);}
  .role-banner{display:flex;align-items:center;gap:11px;border-radius:14px;padding:13px 16px;margin-top:18px;font-size:13px;font-weight:600;}
  .role-banner .rb-ic{width:30px;height:30px;border-radius:9px;color:#fff;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;}
  .role-banner .rb-txt span{font-weight:700;}
  .grp-title{font-size:13px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin:30px 0 13px;}
  /* Aide discrète dans un titre de rubrique (ex. Favoris). */
  .grp-hint{font-weight:600;text-transform:none;letter-spacing:0;color:var(--grey-2);opacity:.75;}
  @media(max-width:560px){ .grp-hint{display:none;} }
  .kt.red{color:var(--alert);} .kt.amber{color:var(--amber);} .kt.green{color:var(--accent-dk);}
  .d{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block;}
  .d.red{background:var(--alert);} .d.amber{background:var(--amber);} .d.green{background:var(--accent);}
  /* ---- Fenêtre « À traiter » : les priorités d'abord (barre en tête), puis
     les tâches en bandes de couleur ; la première est « à faire maintenant ». */
  .todo-modal{width:640px;}
  /* Pas de flou derrière cette fenêtre : avec un flou d'arrière-plan, chaque
     survol d'une ligne force le navigateur à redessiner tout ce qu'il y a
     derrière, et l'accueil scintille. Un voile un peu plus sombre suffit. */
  #todo-ov{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(0,0,0,.42);}
  .todo-mh{display:flex;align-items:center;gap:12px;}
  .todo-modal .modal-h{padding-bottom:14px;border-bottom:0;}
  .todo-modal .modal-b{padding:6px 22px 22px;background:var(--bg);}
  .todo-modal .modal-f{justify-content:space-between;}
  .todo-mf-hint{font-size:12.5px;color:var(--grey-1);font-weight:500;}
  .todo-bar{padding:0 26px 16px;border-bottom:1px solid var(--line);}
  .tb-track{display:flex;gap:3px;height:8px;border-radius:4px;overflow:hidden;}
  .tb-seg{display:block;height:100%;border-radius:4px;}
  .tb-seg.red{background:var(--alert);} .tb-seg.amber{background:var(--amber);} .tb-seg.green{background:var(--accent);}
  .tb-keys{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap;}
  .tb-key{font:inherit;display:inline-flex;align-items:center;gap:7px;padding:6px 11px 6px 9px;border-radius:980px;border:0;cursor:pointer;font-size:12.5px;font-weight:700;background:var(--fill);color:var(--ink);}
  .tb-key b{font-weight:800;font-variant-numeric:tabular-nums;}
  .tb-key.red{background:var(--alert-soft);color:var(--alert);} .tb-key.amber{background:var(--amber-soft);color:var(--amber);} .tb-key.green{background:var(--accent-soft);color:var(--accent-dk);}
  .tb-key.off{opacity:.45;cursor:default;}
  @media(hover:hover){ .tb-key:not(.off):hover{filter:brightness(.95);} }
  .tm-sec{margin-top:16px;scroll-margin-top:8px;}
  .tm-grp{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-radius:10px;margin-bottom:8px;}
  .tm-grp.red{color:var(--alert);background:var(--alert-soft);} .tm-grp.amber{color:var(--amber);background:var(--amber-soft);} .tm-grp.green{color:var(--accent-dk);background:var(--accent-soft);}
  .tm-grp .n{margin-left:auto;font-variant-numeric:tabular-nums;}
  .tm-row{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:14px;padding:11px 12px 11px 12px;background:var(--card);cursor:pointer;margin-top:6px;transition:border-color .15s,box-shadow .15s;}
  @media(hover:hover){ .tm-row:hover{border-color:var(--line-2);box-shadow:var(--shadow);} }
  .tm-row:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .tm-ic{width:40px;height:40px;border-radius:11px;background:var(--grey-2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0;}
  .tm-ic .lc{font-size:19px;color:#fff;stroke-width:2.1;}
  .tm-tx{flex:1;min-width:0;font-size:14.5px;font-weight:800;line-height:1.25;}
  .tm-tx b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .tm-tx small{display:block;color:var(--grey-1);font-weight:600;font-size:12.5px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .tm-tx em{display:block;font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--alert);margin-bottom:3px;}
  .tm-w{font-size:11.5px;font-weight:700;color:var(--grey-1);background:var(--fill);border-radius:980px;padding:4px 9px;white-space:nowrap;text-align:right;line-height:1.3;}
  .tm-w.red{color:var(--alert);background:var(--alert-soft);}
  .tm-go{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 8px;border-radius:980px;color:var(--grey-2);font-size:12.5px;font-weight:700;flex-shrink:0;transition:background .15s,color .15s;}
  .tm-go .lc{font-size:16px;}
  @media(hover:hover){ .tm-row:hover .tm-go{background:var(--ink);color:var(--card);} }
  /* La tâche à faire maintenant : carte plus haute, ombre, bouton « Traiter » plein. */
  .tm-row.next{padding:14px 12px 14px 14px;border-color:var(--line-2);box-shadow:0 8px 22px rgba(20,26,22,.09);}
  .tm-row.next .tm-ic{width:46px;height:46px;border-radius:13px;}
  .tm-row.next .tm-tx{font-size:16px;}
  .tm-row.next .tm-go{background:var(--accent);color:#fff;padding:0 12px 0 14px;height:36px;}
  @media(hover:hover){ .tm-row.next:hover .tm-go{background:var(--accent-dk);color:#fff;} }
  .todo-empty{padding:34px 15px;text-align:center;color:var(--ink);font-size:14px;font-weight:500;display:flex;flex-direction:column;align-items:center;gap:8px;}
  .todo-empty .lc{font-size:28px;color:var(--accent-dk);background:var(--accent-soft);border-radius:50%;padding:10px;width:48px;height:48px;}
  .todo-empty b{font-size:16px;font-weight:800;}
  .todo-empty span{color:var(--grey-1);max-width:34ch;}
  @media(max-width:480px){
    .tm-w{display:none;} .todo-mf-hint{display:none;}
    .todo-bar{padding:0 18px 14px;} .todo-modal .modal-b{padding:4px 14px 18px;}
    .tm-go span,.tm-row.next .tm-go{padding:0 8px;} .tm-row.next .tm-go{font-size:0;gap:0;} .tm-row.next .tm-go .lc{font-size:16px;}
  }
  .crumb{display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--grey-2);margin-bottom:18px;font-weight:600;}
  .crumb a{color:var(--accent);cursor:pointer;}
  .crumb a:hover{text-decoration:underline;}
  .phead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-bottom:18px;}
  .phead h2{font-size:29px;font-weight:800;letter-spacing:-.03em;}
  .phead .sub{color:var(--grey-1);font-size:14px;margin-top:4px;font-weight:500;}
  .ro-banner{display:flex;align-items:center;gap:9px;background:#f0ecff;border:1px solid #ddd2ff;border-radius:12px;padding:11px 15px;font-size:12.5px;color:#5b35d6;font-weight:600;margin-bottom:22px;}
  .btn{font:inherit;font-size:14px;font-weight:600;padding:11px 20px;border-radius:980px;border:none;cursor:pointer;transition:transform .12s,background .15s,opacity .15s;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;}
  .btn:active{transform:scale(.96);}
  .btn-primary{background:var(--accent);color:#fff;}
  .btn-primary:hover{background:var(--accent-dk);}
  .btn-soft{background:var(--fill);color:var(--ink);}
  .btn-soft:hover{background:var(--line-2);}
  /* Action de retrait (annuler une commande) : lisible mais sans dramatiser —
     l'annulation se défait, elle ne mérite pas un rouge d'alerte plein écran. */
  .btn-danger{background:#fdeee6;color:#c0561f;}
  .btn-danger:hover{background:#f8ded1;}
  .btn[disabled]{opacity:.4;cursor:not-allowed;}
  .btn[disabled]:active{transform:none;}
  .seg{display:inline-flex;background:var(--fill);border-radius:11px;padding:3px;margin-bottom:26px;gap:2px;flex-wrap:wrap;}
  .seg button{font:inherit;font-size:13.5px;font-weight:600;color:var(--grey-1);padding:8px 16px;border:none;background:none;cursor:pointer;border-radius:9px;transition:all .15s;}
  .seg button.active{background:var(--card);color:var(--ink);box-shadow:var(--shadow);}
  /* Un seul onglet visible (ex. SAV, Rachat, Messages côté employé) : la barre ne sert à
     rien, on la masque. La création passe par le bouton vert, le retour par « Annuler ». */
  .seg:not(:has(> button:not(.hide) ~ button:not(.hide))){display:none;}
  .seg button[disabled]{opacity:.4;cursor:not-allowed;}
  /* Dissociation informatique / téléphonie : filtre posé au-dessus des tableaux
     (Réparation, SAV, Commandes, Reconditionnement). Il ne touche pas aux
     colonnes — seules les cartes de l'autre activité s'effacent. */
  .catf{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 15px;}
  .catf-b{font:inherit;font-size:12px;font-weight:600;padding:6px 12px;border-radius:980px;border:1px solid var(--line-2);background:var(--card);cursor:pointer;color:var(--grey-1);transition:all .13s;}
  .catf-b:hover{border-color:var(--grey-2);}
  .catf-b.on{background:var(--ink);color:#fff;border-color:var(--ink);}
  .catf-b .n{opacity:.55;font-weight:700;margin-left:3px;}
  /* Activité de la fiche : pastille discrète sur la carte, à côté du numéro. */
  .ci-cat{font-size:11px;line-height:1;}
  /* Activité dans le tiroir : deux puces cliquables. Les rôles en lecture seule
     n'ont pas de puces du tout — ils lisent le libellé (voir catPickerHtml). */
  .catpick{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;}
  .catpick .cp{font:inherit;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:980px;border:1px solid var(--line-2);background:var(--card);color:var(--grey-1);cursor:pointer;transition:all .13s;}
  .catpick .cp:hover{border-color:var(--grey-2);}
  .catpick .cp.on{background:var(--ink);color:#fff;border-color:var(--ink);}
  .panel{display:none;}
  .panel.active{display:block;animation:rise .3s cubic-bezier(.16,1,.3,1);}
  .board{display:grid;gap:11px;}
  .board.c5{grid-template-columns:repeat(5,1fr);}
  .board.c4{grid-template-columns:repeat(4,1fr);}
  .board.c3{grid-template-columns:repeat(3,1fr);}
  .board.c2{grid-template-columns:repeat(2,1fr);}
  /* Téléphones de prêt : le parc en grille de fiches (loans.js). */
  .loan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:11px;}
  .loan-grid .card-item{margin-bottom:0;display:flex;gap:12px;align-items:flex-start;}
  .lp-thumb{width:56px;height:56px;border-radius:9px;object-fit:cover;flex:none;background:var(--fill);display:flex;align-items:center;justify-content:center;font-size:24px;}
  .lp-body{flex:1;min-width:0;}
  .lp-st{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:980px;margin-top:6px;}
  .lp-st.available{background:#e6f5da;color:#3d7a0c;}
  .lp-st.loaned{background:#fff1d6;color:#8a5a00;}
  .lp-st.retired{background:var(--fill);color:var(--grey-1);}
  .ln-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 4px;}
  .pp-thumb.ln-sig{width:180px;background:#fff;}
  .pp-thumb.ln-sig img{object-fit:contain;}
  .lane{background:var(--fill);border-radius:14px;padding:10px;min-height:170px;}
  .lane-h{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;padding:4px 5px 10px;}
  .lane-h .ld{width:8px;height:8px;border-radius:50%;}
  .lane-h .lc{margin-left:auto;background:var(--card);font-size:11px;padding:1px 7px;border-radius:980px;color:var(--grey-1);}
  .card-item{background:var(--card);border-radius:11px;padding:13px;margin-bottom:8px;cursor:pointer;border:1px solid transparent;transition:transform .14s,box-shadow .14s,border-color .14s;}
  /* Glisser-déposer des cartes entre colonnes (voir enableBoardDnD dans app.js).
     Affordance : poignée à points (grip) en haut à droite, comme les listes
     réordonnables d'iOS/macOS — signale d'emblée que la carte se déplace. */
  .card-item[data-id]{cursor:grab;position:relative;padding-right:24px;}
  .card-item[data-id]::after{content:'';position:absolute;top:12px;right:11px;width:8px;height:13px;
    background-image:radial-gradient(currentColor 1.1px,transparent 1.2px);background-size:4px 4px;
    color:var(--grey-2);opacity:.35;transition:opacity .15s;pointer-events:none;}
  .card-item[data-id]:hover::after{opacity:.7;}
  .card-item.dnd-src{opacity:.4;}
  .card-item.dnd-ghost{cursor:grabbing;box-shadow:var(--shadow-lg);border-color:var(--line-2);transform:rotate(1.5deg);opacity:.97;}
  .lane.dnd-over{outline:2px dashed var(--accent);outline-offset:-2px;background:var(--accent-soft);}
  /* ---- Réparation › Historique ----
     La liste complète des dossiers, filtrable. Le tableau d'atelier s'arrête à
     « Prêt » : c'est ici qu'on retrouve les dossiers restitués, et qu'on repère
     ceux laissés sans suite. Les pastilles de filtre réutilisent .catf/.catf-b. */
  .rh-bar{display:flex;flex-direction:column;gap:9px;margin:0 0 15px;}
  /* 16px minimum : en dessous, iOS Safari zoome toute la page au focus. */
  .rh-search{font:inherit;font-size:16px;font-weight:500;width:100%;max-width:430px;padding:10px 15px;border-radius:980px;border:1px solid var(--line-2);background:var(--card);color:var(--ink);outline:none;}
  .rh-search:focus{border-color:var(--accent);}
  .rh-bar .catf{margin:0;}
  /* Plage libre « du … au … » : remplace la période prédéfinie tant qu'elle est remplie. */
  .rh-dates{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:12.5px;font-weight:600;color:var(--grey-1);}
  .rh-dates label{display:inline-flex;align-items:center;gap:7px;}
  .rh-dates input{font:inherit;font-size:16px;padding:6px 11px;border-radius:980px;border:1px solid var(--line-2);background:var(--card);color:var(--ink);}
  .rh-dates input:focus{outline:none;border-color:var(--accent);}
  .rh-head,.rh-row{display:grid;grid-template-columns:112px 1.3fr 1.1fr 118px 132px;gap:14px;padding:13px 24px;align-items:center;}
  .rh-head{font-size:11.5px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line);}
  .rh-sort{cursor:pointer;user-select:none;}
  .rh-sort:hover{color:var(--grey-1);}
  .rh-sort.on{color:var(--ink);}
  .rh-sort.on::after{content:' ↓';}
  .rh-row{font-size:13px;cursor:pointer;border-bottom:1px solid var(--line);}
  .rh-row:last-child{border-bottom:none;}
  .rh-row:hover{background:var(--fill);}
  .rh-sub{color:var(--grey-1);font-size:11px;}
  /* État du dossier : pastille neutre + point aux couleurs des colonnes du
     tableau d'atelier, pour qu'on relie les deux écrans sans effort. */
  .rh-st{display:inline-block;font-size:11px;font-weight:700;padding:4px 9px;border-radius:980px;background:var(--fill);color:var(--grey-1);white-space:nowrap;}
  .rh-st .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:middle;}
  /* Dossier sans la moindre activité depuis longtemps : c'est précisément ce
     qu'on vient chercher ici, autant que ça se voie. */
  .rh-stale{color:var(--amber);font-weight:700;}
  .rh-foot{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:15px;font-size:12.5px;font-weight:600;color:var(--grey-1);}
  @media(max-width:768px){
    /* Cinq colonnes ne tiennent pas : la ligne s'empile et l'en-tête, qui ne
       légenderait plus rien, s'efface. */
    .rh-head{display:none;}
    .rh-row{grid-template-columns:1fr;gap:3px;padding:14px 18px;}
  }
  /* Messagerie : message non lu mis en avant. */
  .msg-item.msg-unread{border-color:var(--accent);background:var(--accent-soft);}
  .msg-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:8px;vertical-align:middle;}
  /* Agenda : semaine 7 jours, look calendrier. */
  .ag-legend{display:flex;flex-wrap:wrap;gap:7px 14px;margin-bottom:14px;}
  .ag-legend span{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--grey-1);}
  .ag-legend i{width:10px;height:10px;border-radius:3px;display:inline-block;}
  .ag-week{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;}
  .ag-day{background:var(--card);border:1px solid var(--line);border-radius:15px;overflow:hidden;min-height:150px;display:flex;flex-direction:column;transition:border-color .15s;}
  .ag-day.weekend{background:var(--fill);}
  .ag-day[onclick]{cursor:pointer;}
  .ag-day[onclick]:hover{border-color:var(--line-2);}
  .ag-day.today{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);}
  .ag-day-h{padding:10px 12px 8px;border-bottom:1px solid var(--line);display:flex;align-items:baseline;justify-content:space-between;}
  .ag-day-h .dn{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--grey-2);}
  .ag-day-h .dd{font-size:17px;font-weight:800;letter-spacing:-.02em;}
  .ag-day.today .ag-day-h{background:var(--accent-soft);}
  .ag-day.today .ag-day-h .dn,.ag-day.today .ag-day-h .dd{color:var(--accent-dk);}
  .ag-day-b{padding:8px;flex:1;}
  .ag-empty{color:var(--grey-2);font-size:20px;text-align:center;padding:16px 0;opacity:.4;}
  .ag-ev{border-radius:10px;padding:8px 10px 8px 11px;margin-bottom:7px;border-left:3px solid var(--grey-2);background:var(--fill);}
  .ag-ev[onclick]{cursor:pointer;transition:transform .12s,box-shadow .12s;}
  .ag-ev[onclick]:hover{transform:translateY(-1px);box-shadow:var(--shadow);}
  .ag-ev-t{font-size:10.5px;font-weight:800;letter-spacing:.02em;opacity:.85;}
  .ag-ev-n{font-size:13px;font-weight:700;margin:2px 0 1px;line-height:1.25;}
  .ag-ev-a{font-size:11px;color:var(--grey-2);}
  .ag-ev-by{font-size:10.5px;color:var(--grey-2);margin-top:2px;font-style:italic;}
  .ag-view-row{display:flex;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
  .ag-view-row:last-child{border-bottom:0;}
  .ag-view-row span{width:80px;flex:none;color:var(--grey-2);font-weight:600;}
  .ag-view-row b{font-weight:600;}
  .ag-view-row i{color:var(--grey-2);font-weight:500;}
  .ag-ev.t-shift{border-left-color:#62b616;background:#eef6e3;} .ag-ev.t-shift .ag-ev-t{color:#4e8f12;}
  .ag-ev.t-rdv{border-left-color:#2d8fed;background:#e7f2fd;} .ag-ev.t-rdv .ag-ev-t{color:#1d6fc0;}
  .ag-ev.t-reunion{border-left-color:#8b5cf6;background:#f0ecff;} .ag-ev.t-reunion .ag-ev-t{color:#6b3fd4;}
  .ag-ev.t-conge{border-left-color:#d98b00;background:#fff4d6;} .ag-ev.t-conge .ag-ev-t{color:#a86b00;}
  .ag-ev.t-absence{border-left-color:#e0683a;background:#fdeee6;} .ag-ev.t-absence .ag-ev-t{color:#c0561f;}
  .ag-ev.t-fermeture,.ag-ev.t-autre{border-left-color:#a1a1a6;background:var(--fill);} .ag-ev.t-fermeture .ag-ev-t,.ag-ev.t-autre .ag-ev-t{color:var(--grey-1);}
  /* Événement sur plusieurs jours : jours de continuation atténués, bord gauche pointillé. */
  .ag-ev.cont{opacity:.8;}
  .ag-ev.multi.cont{border-left-style:dashed;}
  .ag-mchip.cont{opacity:.7;}
  .ag-bar{height:6px;border-radius:980px;background:var(--line);overflow:hidden;margin-top:5px;max-width:150px;}
  .ag-bar i{display:block;height:100%;border-radius:980px;}
  @media(max-width:900px){ .ag-week{grid-template-columns:1fr;} .ag-day{min-height:0;} .ag-day.today{box-shadow:none;} }
  /* Vue mois : grille calendaire (semaines × 7 jours). */
  .ag-mhead{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px;}
  .ag-mhead span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--grey-2);text-align:center;}
  .ag-mgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
  .ag-mcell{background:var(--card);border:1px solid var(--line);border-radius:11px;min-height:96px;padding:6px 6px 5px;display:flex;flex-direction:column;gap:3px;}
  .ag-mcell[onclick]{cursor:pointer;}
  .ag-mcell.out{background:var(--fill);opacity:.55;}
  .ag-mcell.weekend{background:var(--fill);}
  .ag-mcell.today{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);}
  .ag-mday{font-size:12.5px;font-weight:800;color:var(--grey-1);text-align:right;padding:0 2px;}
  .ag-mcell.today .ag-mday{color:var(--accent-dk);}
  .ag-mchip{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--ink);background:var(--fill);border-radius:6px;padding:2px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .ag-mchip .dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--grey-2);}
  .ag-mchip[onclick]{cursor:pointer;}
  .ag-mchip.t-shift{background:#eef6e3;} .ag-mchip.t-shift .dot{background:#62b616;}
  .ag-mchip.t-rdv{background:#e7f2fd;} .ag-mchip.t-rdv .dot{background:#2d8fed;}
  .ag-mchip.t-reunion{background:#f0ecff;} .ag-mchip.t-reunion .dot{background:#8b5cf6;}
  .ag-mchip.t-conge{background:#fff4d6;} .ag-mchip.t-conge .dot{background:#d98b00;}
  .ag-mchip.t-absence{background:#fdeee6;} .ag-mchip.t-absence .dot{background:#e0683a;}
  .ag-mchip.t-fermeture .dot,.ag-mchip.t-autre .dot{background:#a1a1a6;}
  .ag-mmore{font-size:10.5px;font-weight:700;color:var(--grey-2);padding-left:3px;}
  @media(max-width:640px){ .ag-mcell{min-height:64px;} .ag-mchip{font-size:0;gap:0;padding:2px;} .ag-mchip .dot{width:8px;height:8px;} }
  .card-item:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--line-2);}
  .ci-id{font-size:10.5px;color:var(--grey-2);font-weight:700;letter-spacing:.03em;display:flex;align-items:center;gap:6px;}
  .ci-alert{font-size:10px;font-weight:800;color:#b23b00;background:#ffe9dd;padding:1px 6px;border-radius:980px;letter-spacing:0;}
  .card-item.has-alert{border-color:#ffcbb0;box-shadow:0 0 0 1px #ffddc9 inset;}
  .ci-title{font-size:14px;font-weight:700;margin:4px 0 2px;}
  .ci-sub{font-size:12.5px;color:var(--grey-1);font-weight:500;}
  .ci-foot{margin-top:10px;padding-top:9px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--grey-2);font-weight:600;}
  /* Personnes affectées à un dossier : pastille d'initiales sur la carte du board,
     puce nommée dans le tiroir, sélecteur d'équipe replié sous la puce. */
  .ci-asg{display:flex;gap:3px;}
  .asg-av{width:20px;height:20px;border-radius:50%;background:var(--accent-soft);color:var(--accent-dk);font-size:9.5px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
  .asg-row{display:flex;flex-wrap:wrap;gap:7px;align-items:center;padding:2px 0 4px;}
  .asg-chip{display:inline-flex;align-items:center;gap:7px;background:var(--fill);border:1px solid var(--line-2);border-radius:980px;padding:4px 5px 4px 5px;font-size:12.5px;font-weight:600;}
  .asg-x{background:none;border:none;color:var(--grey-2);font:inherit;font-size:11px;cursor:pointer;padding:0 5px 0 0;line-height:1;}
  .asg-x:hover{color:#e0683a;}
  .asg-none{font-size:12.5px;color:var(--grey-2);font-weight:500;}
  .asg-add{background:var(--card);border:1px dashed var(--line-2);border-radius:980px;padding:5px 13px;font:inherit;font-size:12.5px;font-weight:700;color:var(--grey-1);cursor:pointer;transition:border-color .14s,color .14s;}
  .asg-add:hover{border-color:var(--accent);color:var(--accent-dk);}
  .asg-pick{border:1px solid var(--line-2);border-radius:12px;overflow:hidden;margin:4px 0 8px;background:var(--card);}
  .asg-pick-i{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;border-bottom:1px solid var(--line);padding:9px 12px;font:inherit;font-size:13px;color:var(--ink);cursor:pointer;text-align:left;}
  .asg-pick-i:last-child{border-bottom:none;}
  .asg-pick-i:hover{background:var(--fill);}
  .asg-pick-i.on{font-weight:700;}
  .asg-pick-n{flex:1;min-width:0;}
  .asg-pick-c{color:var(--accent-dk);font-weight:800;}
  .grade{width:22px;height:22px;border-radius:7px;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;}
  .ci-chip{font-size:10px;font-weight:700;padding:2px 7px;border-radius:980px;}
  .ci-chip.rep{background:var(--accent-soft);color:var(--accent-dk);}
  .ci-chip.dev{background:#eaf6ec;color:var(--green);}
  .ci-chip.acc{background:#fdeee6;color:#c0561f;}
  .ci-chip.warn{background:#fff0d6;color:#9a6c10;}
  .ci-chip.ok{background:#eaf6ec;color:var(--green);}
  /* Registre des rachats : colonnes partagées par l'en-tête et les lignes. */
  #view-buyback{--bb-cols:90px 1.3fr 1.2fr 120px 125px 130px;}
  .catf-l{font-size:11.5px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;min-width:72px;}
  .bbf-sum{font-size:12.5px;font-weight:600;color:var(--grey-1);}
  .bbf-sum b{color:var(--ink);}
  .bb-paybtn{font-size:11px;font-weight:600;padding:3px 8px;margin-top:5px;border:1px solid var(--line-2);border-radius:8px;background:var(--fill);color:var(--ink);cursor:pointer;}
  .bb-paybtn:hover{border-color:var(--accent);color:var(--accent-dk);}
  .bb-inline{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end;}
  .bb-inline input{width:90px;padding:5px 8px;font-size:12.5px;}
  .fcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .fsec{padding:24px 28px;border-bottom:1px solid var(--line);}
  .fsec:last-of-type{border-bottom:none;}
  .fsec-h{display:flex;align-items:center;gap:10px;margin-bottom:17px;}
  .fsec-h .n{width:26px;height:26px;border-radius:8px;background:var(--fill);font-size:12.5px;font-weight:800;color:var(--grey-1);display:flex;align-items:center;justify-content:center;}
  .fsec-h h4{font-size:15.5px;font-weight:700;letter-spacing:-.02em;}
  .g2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
  .g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;}
  .fld{margin-bottom:14px;}
  .fld:last-child{margin-bottom:0;}
  .fld label{display:block;font-size:12.5px;font-weight:600;color:var(--grey-1);margin-bottom:7px;}
  .fld label .r{color:var(--accent);}
  .fld label .hint{color:var(--grey-2);font-weight:500;font-size:11.5px;}
  /* Bandeau « nouvelle version disponible » (déploiement détecté pendant l'usage). */
  /* Pilule flottante façon Apple : matière translucide floutée, sobre, détachée du bord. */
  .ver-banner{position:fixed;top:14px;left:50%;transform:translate(-50%,-180%);z-index:200;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 8px;background:rgba(28,28,30,.72);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);color:#fff;padding:7px 9px 7px 17px;border-radius:999px;border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 28px rgba(0,0,0,.34);font-size:13px;font-weight:600;letter-spacing:-.01em;transition:transform .42s cubic-bezier(.16,1,.3,1),opacity .42s;max-width:calc(100% - 24px);}
  .ver-banner.show{transform:translate(-50%,0);}
  .ver-banner>span{padding-right:2px;}
  .ver-reload{font:inherit;font-weight:700;background:#fff;color:#161616;border:none;border-radius:999px;padding:6px 15px;cursor:pointer;transition:background .15s,transform .12s;white-space:nowrap;}
  .ver-reload:hover{background:#efefef;}
  .ver-reload:active{transform:scale(.97);}
  .ver-news{font:inherit;font-weight:600;background:transparent;color:rgba(255,255,255,.88);border:none;border-radius:999px;padding:6px 9px;cursor:pointer;white-space:nowrap;transition:color .15s;}
  .ver-news:hover{color:#fff;}
  /* Mobile : la pilule ne tient pas sur une ligne → carte arrondie en bas d'écran,
     sans recouvrir la barre du haut ; texte sur sa ligne, boutons alignés dessous. */
  @media(max-width:560px){
    .ver-banner{top:auto;bottom:16px;left:12px;right:12px;max-width:none;transform:translateY(calc(100% + 24px));border-radius:20px;justify-content:flex-start;gap:10px;padding:14px 16px;}
    .ver-banner.show{transform:translateY(0);}
    .ver-banner>span{flex:1 1 100%;padding-right:0;}
    .ver-reload{padding:8px 18px;}
    .ver-close{margin-left:auto;}
  }
  .fld input,.fld select,.fld textarea{width:100%;font:inherit;font-size:14px;color:var(--ink);padding:11px 13px;border:1px solid var(--line-2);border-radius:11px;background:var(--card);outline:none;transition:border-color .14s,box-shadow .14s;}
  .fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);}
  /* Select autonome (hors .fld) : même habillage soigné que les champs de formulaire. */
  .sel{font:inherit;font-size:13px;font-weight:500;color:var(--ink);padding:8px 34px 8px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--card);cursor:pointer;outline:none;transition:border-color .14s,box-shadow .14s;}
  .sel:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
  /* Chevron maison sur tous les selects (formulaire + autonomes) — apparence cohérente. */
  .fld select,.sel{-webkit-appearance:none;appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23a1a1a6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 12px center;background-size:11px;}
  .fld select{padding-right:34px;}
  /* iOS/iPadOS : les champs date/heure natifs prennent une largeur intrinsèque et un
     habillage propre → dans une grille .g2 ils débordent et « se touchent ». On neutralise
     l'apparence native (ils respectent alors width:100%), on les laisse rétrécir, et on
     aligne la valeur à gauche comme les autres champs (iOS la centre par défaut). */
  .fld input[type="date"],.fld input[type="time"]{-webkit-appearance:none;appearance:none;min-width:0;}
  .fld input[type="date"]::-webkit-date-and-time-value,
  .fld input[type="time"]::-webkit-date-and-time-value{text-align:left;margin:0;}
  .fld input[type="date"]::-webkit-datetime-edit,
  .fld input[type="time"]::-webkit-datetime-edit{padding:0;}
  /* Enfants d'une grille : autoriser le rétrécissement sous leur largeur intrinsèque
     (sinon un champ date/heure iOS trop large déborde et chevauche le voisin). */
  .g2>*,.g3>*{min-width:0;}
  .fld textarea{resize:vertical;min-height:66px;}
  .fhint{font-size:11.5px;color:var(--grey-2);margin-top:6px;font-weight:500;line-height:1.45;}
  .chips{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .chips.c3{grid-template-columns:1fr 1fr 1fr;}
  .chip{display:flex;align-items:center;gap:9px;padding:11px 13px;border:1px solid var(--line-2);border-radius:11px;background:var(--card);cursor:pointer;font-size:13px;font-weight:500;transition:all .13s;}
  .chip:hover{border-color:var(--grey-2);}
  .chip.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-dk);font-weight:600;}
  .chip .bx{width:18px;height:18px;border-radius:6px;border:1.6px solid var(--grey-2);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;transition:all .13s;}
  .chip.on .bx{background:var(--accent);border-color:var(--accent);}
  .chip.on .bx::after{content:"✓";}   /* coche via CSS : jamais dans le textContent collecté */
  .grades{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
  .gopt{border:1.6px solid var(--line-2);border-radius:13px;padding:14px;cursor:pointer;text-align:center;transition:all .14s;}
  .gopt:hover{border-color:var(--grey-2);}
  .gopt.on{border-color:var(--accent);background:var(--accent-soft);}
  .gopt .gl{width:34px;height:34px;border-radius:10px;margin:0 auto 8px;color:#fff;font-size:16px;font-weight:800;display:flex;align-items:center;justify-content:center;}
  .gopt .gt{font-size:13px;font-weight:700;}
  .gopt .gd{font-size:11px;color:var(--grey-1);margin-top:2px;font-weight:500;}
  .drop{border:1.6px dashed var(--line-2);border-radius:13px;padding:22px;text-align:center;cursor:pointer;transition:all .14s;}
  .drop:hover{border-color:var(--accent);background:var(--accent-soft);}
  .drop .di{font-size:23px;}
  .drop .dt{font-size:13.5px;font-weight:600;color:var(--grey-1);margin-top:6px;}
  .drop .ds{font-size:11.5px;color:var(--grey-2);margin-top:2px;font-weight:500;}
  .legal{display:flex;gap:10px;background:#fff8ec;border:1px solid #f3e2bf;border-radius:12px;padding:12px 14px;font-size:12px;color:#8a6510;line-height:1.5;font-weight:500;margin-top:4px;}
  .legal .li{flex-shrink:0;}
  .lock-note{display:flex;gap:9px;align-items:center;background:var(--accent-soft);border-radius:12px;padding:12px 14px;font-size:12px;color:var(--accent-dk);font-weight:600;}
  .ffoot{padding:18px 28px;background:var(--fill);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;}
  .ffoot .fn{font-size:12px;color:var(--grey-1);font-weight:500;}
  .ro-form.locked input,.ro-form.locked select,.ro-form.locked textarea{pointer-events:none;background:var(--fill);color:var(--grey-1);}
  .ro-form.locked .chip,.ro-form.locked .gopt,.ro-form.locked .drop,.ro-form.locked .sigpad,.ro-form.locked .lock-tab,.ro-form.locked .pattern{pointer-events:none;opacity:.65;}
  .lock-tabs{display:flex;gap:8px;margin-bottom:14px;}
  .lock-tab{flex:1;border:1.6px solid var(--line-2);border-radius:11px;padding:10px;text-align:center;font-size:13px;font-weight:600;cursor:pointer;color:var(--grey-1);transition:all .13s;}
  .lock-tab:hover{border-color:var(--grey-2);}
  .lock-tab.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-dk);}
  .lock-body{display:none;}
  .lock-body.on{display:block;animation:rise .25s ease;}
  .pattern-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;}
  .pattern{position:relative;width:188px;height:188px;background:var(--fill);border-radius:16px;padding:24px;cursor:pointer;user-select:none;}
  .pattern svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
  .pgrid{position:relative;width:100%;height:100%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);}
  .pnode{display:flex;align-items:center;justify-content:center;}
  .pdot{width:18px;height:18px;border-radius:50%;background:var(--line-2);transition:all .14s;}
  .pnode.act .pdot{background:var(--accent);transform:scale(1.35);box-shadow:0 0 0 6px var(--accent-soft);}
  .pattern-info{font-size:12px;color:var(--grey-1);font-weight:600;}
  .pattern-info b{color:var(--accent);}
  .sigpad{border:1.6px solid var(--line-2);border-radius:13px;background:#fff;cursor:crosshair;display:block;width:100%;touch-action:none;}
  .sigpad-wrap{position:relative;}
  .sigpad-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--grey-2);font-size:13px;font-style:italic;pointer-events:none;}
  .sigpad-bar{display:flex;justify-content:space-between;align-items:center;margin-top:7px;}
  .sigclear{font:inherit;font-size:12px;font-weight:600;color:var(--accent);background:none;border:none;cursor:pointer;}
  .sigclear:hover{text-decoration:underline;}
  .toggle-row{display:flex;align-items:center;gap:12px;background:var(--fill);border-radius:12px;padding:12px 15px;}
  .toggle{width:44px;height:26px;border-radius:980px;background:var(--line-2);position:relative;cursor:pointer;flex-shrink:0;transition:background .18s;}
  .toggle .kn{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:var(--shadow);transition:left .18s;}
  .toggle.on{background:var(--green);}
  .toggle.on .kn{left:21px;}
  .toggle-tx{font-size:13px;font-weight:600;}
  .toggle-tx .ts{font-size:11.5px;color:var(--grey-1);font-weight:500;}
  /* ---- À COMMANDER ---- */
  .deadline-banner{display:flex;align-items:center;gap:14px;border-radius:16px;padding:16px 18px;margin-bottom:22px;}
  .deadline-banner.urgent{background:#fdeee6;border:1px solid #f3cdb8;}
  .deadline-banner.clear{background:#eaf6ec;border:1px solid #c4e6cc;}
  .db-ic{width:44px;height:44px;border-radius:12px;flex-shrink:0;color:#fff;display:flex;align-items:center;justify-content:center;font-size:21px;}
  .deadline-banner.urgent .db-ic{background:#e0683a;}
  .deadline-banner.clear .db-ic{background:var(--green);}
  .db-tx{flex:1;}
  .db-tx .db-t{font-size:14.5px;font-weight:800;}
  .db-tx .db-s{font-size:12.5px;color:var(--grey-1);font-weight:500;margin-top:2px;}
  .db-count{text-align:center;background:var(--card);border-radius:12px;padding:9px 16px;flex-shrink:0;}
  .db-count .dc-n{font-size:21px;font-weight:800;line-height:1;}
  .deadline-banner.urgent .dc-n{color:#e0683a;}
  .deadline-banner.clear .dc-n{color:var(--green);}
  .db-count .dc-l{font-size:10px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin-top:3px;}
  .shop-block{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:14px;overflow:hidden;}
  .shop-block-h{display:flex;align-items:center;gap:10px;padding:15px 20px;border-bottom:1px solid var(--line);background:var(--fill);}
  .shop-block-h .sb-dot{width:9px;height:9px;border-radius:50%;background:var(--green);}
  .shop-block-h .sb-name{font-size:14.5px;font-weight:800;}
  .shop-block-h .sb-meta{margin-left:auto;font-size:12px;font-weight:700;color:var(--grey-1);}
  .shop-block-h .sb-meta b{color:#e0683a;}
  .supply-row{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--line);transition:background .15s;}
  .supply-row:last-child{border-bottom:none;}
  .supply-row.done{background:#fafdfb;}
  .supply-check{width:24px;height:24px;border-radius:8px;border:2px solid var(--line-2);flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff;transition:all .14s;}
  .supply-check:hover{border-color:var(--green);}
  .supply-check.on{background:var(--green);border-color:var(--green);}
  .supply-main{flex:1;min-width:0;}
  .supply-name{font-size:14px;font-weight:700;}
  .supply-row.done .supply-name{text-decoration:line-through;color:var(--grey-2);}
  .supply-from{font-size:11.5px;color:var(--grey-1);font-weight:600;margin-top:2px;}
  .supply-qty{font-size:13px;font-weight:800;background:var(--fill);padding:5px 11px;border-radius:980px;flex-shrink:0;}
  .supply-origin{font-size:10px;font-weight:700;padding:3px 9px;border-radius:980px;flex-shrink:0;}
  .supply-origin.rep{background:var(--accent-soft);color:var(--accent-dk);}
  .supply-origin.cmd{background:#f3edff;color:#5b35d6;}
  .supply-origin.stk{background:#fff0d6;color:#9a6c10;}
  .supply-done-h{padding:10px 20px;border-top:1px solid var(--line);font-size:12px;font-weight:700;color:var(--grey-1);cursor:pointer;user-select:none;}
  .supply-done-h:hover{color:var(--ink);}
  .supply-urgent{font-size:10px;font-weight:700;color:#e0683a;flex-shrink:0;}
  .ov{position:fixed;inset:0;background:rgba(0,0,0,.32);opacity:0;pointer-events:none;transition:opacity .28s;z-index:90;backdrop-filter:blur(2px);}
  .ov.show{opacity:1;pointer-events:auto;}
  /* ---- Détail d'un dossier : une fenêtre centrée ----
     Le nom « drw » (drawer, tiroir) est resté de l'époque où cette fiche sortait
     du bord droit sur une colonne de 438 px. Elle s'ouvre désormais au milieu de
     l'écran, bien plus large, et se referme par la croix en haut à droite ou en
     touchant le fond. Fermée, elle n'est ni visible ni cliquable (opacity /
     pointer-events) : elle reste au centre plutôt que d'être garée hors écran. */
  .drw{position:fixed;top:50%;left:50%;width:min(760px,94vw);height:auto;max-height:88vh;background:var(--card);
       border-radius:22px;overflow:hidden;box-shadow:none;z-index:100;opacity:0;pointer-events:none;
       transform:translate(-50%,-50%) scale(.96);
       transition:opacity .2s,transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s;
       display:flex;flex-direction:column;}
  .drw.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1);box-shadow:var(--shadow-lg);}
  .drw-h{padding:22px 24px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start;}
  .drw-h h3{font-size:21px;font-weight:800;letter-spacing:-.02em;}
  .drw-h .hid{font-size:12.5px;color:var(--grey-2);margin-top:3px;font-weight:600;}
  .xb{width:32px;height:32px;border-radius:50%;border:none;background:var(--fill);cursor:pointer;font-size:15px;color:var(--grey-1);display:flex;align-items:center;justify-content:center;}
  .xb:hover{background:var(--line-2);}
  /* Sans min-height:0, le corps refuse de rétrécir sous sa hauteur naturelle :
     il déborderait de la fenêtre au lieu de défiler à l'intérieur. */
  .drw-b{padding:22px 24px;overflow-y:auto;flex:1;min-height:0;}
  .row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
  .row .k{color:var(--grey-1);font-weight:500;}
  .row .v{font-weight:600;text-align:right;}
  .mini-h{font-size:11.5px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin:22px 0 8px;}
  .quote-kind.firm{color:var(--accent);}
  /* Reconditionnement : points de contrôle OK / KO */
  .ckp{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
  .ckp-l{color:var(--ink);font-weight:600;}
  .ckp-b{display:flex;gap:6px;flex-shrink:0;}
  .ckp-b button{font:inherit;font-size:12px;font-weight:700;padding:4px 10px;border-radius:980px;border:1px solid var(--line);
                background:var(--card);color:var(--grey-1);cursor:pointer;}
  .ckp-b button.on.ok{background:var(--green);border-color:var(--green);color:#fff;}
  .ckp-b button.on.ko{background:#d93b3b;border-color:#d93b3b;color:#fff;}
  .ckp-b button:disabled{cursor:default;opacity:.6;}
  /* Interventions : aperçu SMS + total estimé */
  .itv-sms-preview{margin-top:10px;padding:11px 13px;border-radius:12px;background:var(--accent-soft);font-size:13px;line-height:1.45;color:var(--ink);white-space:pre-wrap;}
  .itv-sms-preview b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--grey-1);margin-bottom:4px;}
  .itv-sms-preview:empty{display:none;}
  .itv-total{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0 2px;border-top:1px solid var(--line);font-weight:700;}
  .itv-total b{font-size:20px;color:var(--accent);}
  /* Dépannage comptoir */
  .desk-new .fsec{padding-bottom:18px;}
  .desk-go{width:100%;padding:14px;font-size:15px;margin-top:16px;}
  .desk-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-top:14px;}
  .desk-card.run{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset;}
  .desk-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;}
  .desk-who{font-weight:800;font-size:16px;}
  .desk-what{font-size:13.5px;color:var(--ink);margin-top:2px;}
  .desk-meta{font-size:11.5px;color:var(--grey-2);font-weight:600;margin-top:4px;}
  .desk-state{font-size:12px;font-weight:700;white-space:nowrap;color:var(--grey-1);}
  .desk-card.run .desk-state{color:var(--accent);}
  .desk-nums{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:16px 0;flex-wrap:wrap;}
  .desk-clock{font-size:44px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1;}
  .desk-amount{font-size:30px;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;}
  .desk-btns{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;}
  .desk-row{padding-left:18px;padding-right:18px;}
  .desk-row small{color:var(--grey-2);font-weight:600;}
  /* Mobile : champs empilés, boutons du chrono sur deux lignes (le bouton rond de
     la messagerie, fixé en bas à droite, ne vient plus recouvrir « Annuler »). */
  @media(max-width:640px){
    .desk-new .g3{grid-template-columns:1fr;gap:0;}
    .desk-btns{grid-template-columns:1fr 1fr;}
    .desk-btns .btn-danger{grid-column:1 / -1;}
    #view-desk{padding-bottom:70px;}
  }
  .rc-addpart{display:flex;gap:8px;margin-top:8px;}
  .rc-addpart input{flex:1;min-width:0;border:1px solid var(--line-2);border-radius:9px;padding:9px 11px;font:inherit;font-size:13px;background:var(--card);color:inherit;}
  .step{display:flex;align-items:center;gap:11px;margin:5px 0;}
  .step .sd{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
  .step .stx{font-size:13px;}
  .step.done .stx{font-weight:600;}
  .step.todo .stx{color:var(--grey-2);}
  /* Notes atelier : fil d'événements + zone de saisie. */
  .ev{padding:9px 11px;border-radius:9px;background:var(--fill);margin-bottom:6px;border:1px solid var(--line);}
  .ev-step{background:transparent;border-color:transparent;padding:5px 0;margin-bottom:2px;}
  .ev-alert{background:#fff4ec;border-color:#ffd6bf;}
  .ev-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
  .ev-tx{font-size:13px;line-height:1.45;white-space:pre-wrap;}
  .ev-step .ev-tx{font-size:12.5px;color:var(--grey-1);font-weight:600;}
  .ev-meta{font-size:11px;color:var(--grey-2);font-weight:600;margin-top:4px;}
  /* ---- Correction d'une note ----
     « Modifier » reste effacé jusqu'au survol de la note (sur tactile il est
     toujours là, faute de survol) : le journal se lit d'abord, il se corrige
     ensuite. La mention « modifié » est en revanche visible par tous, toujours. */
  .ev-editbtn{border:none;background:transparent;color:var(--grey-2);font:inherit;font-size:11px;
              font-weight:700;cursor:pointer;padding:2px 4px;border-radius:6px;flex-shrink:0;opacity:0;
              transition:opacity .15s,color .15s,background .15s;}
  @media(hover:hover){ .ev:hover .ev-editbtn{opacity:1;} .ev-editbtn:hover{background:var(--card);color:var(--ink);} }
  @media(hover:none){ .ev-editbtn{opacity:.75;} }
  .ev-editbtn:focus-visible{opacity:1;outline:2px solid var(--accent);outline-offset:1px;}
  .ev-edited{margin-left:6px;padding:1px 6px;border-radius:980px;background:var(--line);color:var(--grey-1);
             font-size:10px;font-weight:700;font-style:italic;}
  .ev-edit{margin-top:8px;}
  .ev-edit-ta{width:100%;font:inherit;font-size:13px;line-height:1.45;color:var(--ink);background:var(--card);
              border:1px solid var(--line-2);border-radius:9px;padding:9px 10px;resize:vertical;min-height:64px;}
  .ev-edit-ta:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:transparent;}
  .ev-edit-bar{display:flex;justify-content:flex-end;gap:8px;margin-top:7px;}
  .ev-edit-bar .btn{padding:6px 14px;font-size:12.5px;}
  .ev-flag{font-size:11px;font-weight:800;color:#b23b00;white-space:nowrap;}
  .ev-ack{font-size:11px;font-weight:700;color:var(--green);white-space:nowrap;}
  .ev-ackbtn{font-size:11px;font-weight:700;color:#fff;background:var(--green);border:0;border-radius:980px;padding:4px 10px;cursor:pointer;white-space:nowrap;}
  .ev-ackbtn:hover{filter:brightness(.95);}
  .note-compose{margin-top:9px;}
  .note-compose textarea{width:100%;border:1px solid var(--line-2);border-radius:9px;padding:9px 11px;font:inherit;font-size:13px;resize:vertical;background:var(--card);color:inherit;box-sizing:border-box;}
  .note-compose-b{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:7px;flex-wrap:wrap;}
  .step .sx{margin-left:auto;font-size:11px;color:var(--grey-2);font-weight:600;}
  /* Le pied de page revient à la ligne dès qu'il manque de place. Sans cela, le
     dernier bouton (« Étape suivante », le plus utile) sortait du tiroir : le pied
     mesure toujours 438 px quelle que soit la taille de l'écran, une bascule au
     nombre de pixels de l'ÉCRAN ne pouvait donc pas décider à sa place. */
  .drw-f{padding:16px 24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:9px;}
  .drw-f .btn{flex:1;justify-content:center;}
  /* « Étape précédente » et « Étape suivante » : même dessin, couleur différente
     (grise pour reculer, verte pour avancer). L'action contextuelle, à gauche,
     se réduit à son icône. */
  .drw-f .btn.drw-ico{flex:0 0 auto;min-width:46px;padding-left:14px;padding-right:14px;font-size:17px;}
  .drw-f .btn.drw-prev:disabled{opacity:.45;cursor:default;}
  /* « Annuler la commande » ne s'étire pas comme les boutons d'étape : c'est une
     sortie de route, elle reste discrète à côté du chemin normal. */
  .drw-f .btn.drw-cancel{flex:0 0 auto;font-size:13px;padding-left:15px;padding-right:15px;}
  /* Coupure explicite : les actions secondaires (appeler, annuler) sur une ligne,
     le chemin des étapes sur la suivante. Le rendu ne dépend alors plus de la
     longueur des libellés — « Étape suivante » est à sa place partout. */
  /* Menu « ⋯ » : les actions rares et risquées (annuler) sortent du chemin du doigt. */
  .drw-more{position:relative;display:flex;}
  .drw-menu{display:none;position:absolute;left:0;bottom:calc(100% + 6px);z-index:5;min-width:210px;padding:6px;background:var(--card);border:1px solid var(--line-2);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.14);}
  .drw-menu.open{display:block;}
  .drw-menu button{display:block;width:100%;text-align:left;font:inherit;font-size:14px;font-weight:600;padding:10px 12px;border:0;border-radius:8px;background:none;color:var(--ink);cursor:pointer;}
  .drw-menu button:hover{background:var(--fill);}
  .drw-menu .drw-menu-danger{color:#c0341d;}
  .drw-f-break{flex:0 0 100%;height:0;margin:-4px 0;}
  .drw-ro{padding:12px 24px;background:#f0ecff;font-size:12px;color:#5b35d6;font-weight:600;text-align:center;}
  /* Téléphone : plein écran plutôt qu'une carte flottante — chaque pixel compte. */
  @media(max-width:600px){
    .drw{width:100vw;height:100%;max-height:none;border-radius:0;}
  }
  .modal-ov{position:fixed;inset:0;background:rgba(0,0,0,.34);opacity:0;pointer-events:none;transition:opacity .25s;z-index:110;backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;}
  .modal-ov.show{opacity:1;pointer-events:auto;}
  .modal{background:var(--card);border-radius:22px;width:540px;max-width:100%;box-shadow:var(--shadow-lg);overflow:hidden;transform:scale(.94);transition:transform .28s cubic-bezier(.16,1,.3,1);max-height:90vh;display:flex;flex-direction:column;}
  .modal-ov.show .modal{transform:scale(1);}
  .modal-h{padding:24px 26px 18px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start;}
  .modal-h h3{font-size:20px;font-weight:800;letter-spacing:-.02em;}
  .modal-h p{font-size:13px;color:var(--grey-1);margin-top:3px;font-weight:500;}
  .modal-b{padding:22px 26px;overflow-y:auto;}
  .modal-f{padding:18px 26px;background:var(--fill);display:flex;justify-content:space-between;align-items:center;gap:12px;}
  .opt-label{font-size:12.5px;font-weight:700;color:var(--grey-1);margin-bottom:9px;}
  /* Case à cocher de formulaire (première du projet : « Urgent » sur À commander). */
  .chk{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;user-select:none;}
  .chk input{width:17px;height:17px;accent-color:var(--accent);cursor:pointer;flex-shrink:0;}
  /* Ligne de saisie d'une pièce à commander (modale « Attente pièce »). */
  .part-row{display:grid;grid-template-columns:1fr 84px auto;gap:9px;align-items:center;margin-bottom:9px;}
  .part-row input[type=text],.part-row .pr-label,.part-row .pr-qty{font:inherit;font-size:14px;color:var(--ink);padding:10px 12px;border:1px solid var(--line-2);border-radius:11px;background:var(--card);outline:none;width:100%;transition:border-color .14s,box-shadow .14s;}
  .part-row .pr-label:focus,.part-row .pr-qty:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);}
  @media(max-width:480px){ .part-row{grid-template-columns:1fr 70px auto;gap:6px;} }
  .month-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px;}
  .month-opt{border:1.6px solid var(--line-2);border-radius:11px;padding:11px 8px;text-align:center;cursor:pointer;font-size:13px;font-weight:600;transition:all .13s;}
  .month-opt:hover{border-color:var(--grey-2);}
  .month-opt.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-dk);}
  .fmt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px;}
  .fmt-opt{border:1.6px solid var(--line-2);border-radius:13px;padding:15px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:all .13s;}
  .fmt-opt:hover{border-color:var(--grey-2);}
  .fmt-opt.on{border-color:var(--accent);background:var(--accent-soft);}
  .fmt-ic{width:38px;height:38px;border-radius:10px;flex-shrink:0;color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;}
  .fmt-tx .ft{font-size:13.5px;font-weight:700;}
  .fmt-tx .fd{font-size:11.5px;color:var(--grey-1);font-weight:500;margin-top:1px;}
  .preview{background:var(--fill);border-radius:12px;padding:14px 16px;}
  .preview-h{font-size:11.5px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;}
  .preview-row{display:flex;justify-content:space-between;font-size:12.5px;padding:5px 0;font-weight:500;}
  .preview-row.tot{border-top:1px solid var(--line-2);margin-top:6px;padding-top:9px;font-weight:700;}
  .preview-row .pv{color:var(--grey-1);}
  .toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(90px);background:var(--ink);color:#fff;padding:13px 22px;border-radius:980px;font-size:13.5px;font-weight:600;z-index:120;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:8px;transition:transform .34s cubic-bezier(.32,.72,.3,1);}
  .toast.show{transform:translateX(-50%) translateY(0);}
  .toast .tk{color:#5edb84;}
  /* ---- TABLEAU DE BORD PILOTAGE ---- */
  .kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-bottom:14px;}
  .kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;}
  .kpi-top{display:flex;align-items:center;gap:9px;margin-bottom:12px;}
  .kpi-ic{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px;}
  .kpi-label{font-size:12px;font-weight:700;color:var(--grey-1);}
  .kpi-val{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1;}
  .kpi-sub{font-size:12px;font-weight:600;margin-top:7px;}
  .kpi-sub.up{color:var(--green);}
  .kpi-sub.down{color:#e0683a;}
  .kpi-sub.flat{color:var(--grey-2);}
  .dash-sectitle{font-size:13px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin:26px 0 13px;}
  .compare{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .compare-h{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:12px;padding:13px 22px;font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line);}
  .compare-r{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:12px;padding:15px 22px;font-size:13.5px;align-items:center;border-bottom:1px solid var(--line);}
  .compare-r:last-child{border-bottom:none;}
  .compare-r .shop{font-weight:700;display:flex;align-items:center;gap:8px;}
  .compare-r .shop .cd{width:8px;height:8px;border-radius:50%;background:var(--green);}
  .compare-r .num{font-weight:700;}
  .compare-r.tot{background:var(--fill);font-weight:800;}
  .bar-track{height:7px;background:var(--fill);border-radius:980px;overflow:hidden;margin-top:5px;}
  .bar-fill{height:100%;border-radius:980px;}
  /* ---- bloc suivi client (drawer) ---- */
  .client-link{background:#eef6e3;border:1px solid #d4e7b8;border-radius:12px;padding:13px 15px;}
  .client-link .cl-h{font-size:12px;font-weight:700;color:var(--accent-dk);display:flex;align-items:center;gap:7px;}
  .client-link .cl-url{font-size:12px;font-weight:600;color:var(--accent-dk);background:var(--card);border-radius:8px;padding:8px 11px;margin-top:8px;word-break:break-all;font-family:monospace;}
  .client-link .cl-actions{display:flex;gap:8px;margin-top:9px;}
  .cl-btn{flex:1;font:inherit;font-size:12px;font-weight:600;padding:8px;border-radius:8px;border:none;cursor:pointer;background:var(--card);color:var(--accent-dk);}
  .cl-btn:hover{background:#d4e6f8;}
  .cl-note{font-size:11px;color:var(--grey-1);font-weight:500;margin-top:8px;line-height:1.45;}
  /* ---- PLANNING ---- */
  .planning{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .pl-grid{display:grid;grid-template-columns:160px repeat(7,1fr);}
  .pl-cell{padding:12px 10px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);min-height:64px;}
  .pl-cell:nth-child(8n){border-right:none;}
  .pl-head{background:var(--fill);font-size:12px;font-weight:700;text-align:center;color:var(--grey-1);min-height:auto;padding:11px 8px;}
  .pl-head.today{color:var(--accent);}
  .pl-emp{display:flex;align-items:center;gap:9px;background:var(--fill);}
  .pl-emp .pe-av{width:30px;height:30px;border-radius:50%;color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .pl-emp .pe-tx{line-height:1.25;}
  .pl-emp .pe-n{font-size:13px;font-weight:700;}
  .pl-emp .pe-r{font-size:10.5px;color:var(--grey-2);font-weight:600;}
  .shift{border-radius:8px;padding:6px 8px;font-size:11.5px;font-weight:700;text-align:center;line-height:1.3;}
  .shift.work{background:var(--accent-soft);color:var(--accent-dk);}
  .shift.off{background:var(--fill);color:var(--grey-2);font-weight:600;}
  .shift.leave{background:#fff0d6;color:#9a6c10;}
  .shift.repl{background:#eaf6ec;color:var(--green);}
  .shift .sh-tag{font-size:9.5px;font-weight:700;display:block;margin-top:2px;opacity:.8;}
  .pl-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;padding:0 4px;}
  .pl-leg{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--grey-1);}
  .pl-leg .lg-sw{width:14px;height:14px;border-radius:5px;}
  .week-nav{display:flex;align-items:center;gap:10px;}
  .week-nav button{width:32px;height:32px;border-radius:9px;border:1px solid var(--line-2);background:var(--card);cursor:pointer;font-size:14px;color:var(--grey-1);}
  .week-nav button:hover{border-color:var(--accent);color:var(--accent);}
  .week-nav .wk-label{font-size:13.5px;font-weight:700;}
  /* ---- DIAGNOSTIC GUIDÉ ---- */
  .diag-step{margin-bottom:18px;}
  .diag-step:last-child{margin-bottom:0;}
  .diag-label{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:9px;display:flex;align-items:center;gap:8px;}
  .diag-label .dn{width:20px;height:20px;border-radius:6px;background:var(--accent);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;}
  .diag-label.muted .dn{background:var(--line-2);color:var(--grey-2);}
  .diag-label.muted{color:var(--grey-2);}
  .brand-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;}
  .brand-opt{border:1.6px solid var(--line-2);border-radius:12px;padding:14px 8px;text-align:center;cursor:pointer;transition:all .13s;}
  .brand-opt:hover{border-color:var(--grey-2);}
  .brand-opt.on{border-color:var(--accent);background:var(--accent-soft);}
  .brand-opt .bo-logo{font-size:22px;}
  .brand-opt .bo-name{font-size:12.5px;font-weight:700;margin-top:5px;}
  .symptom-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
  .symptom-opt{display:flex;align-items:center;gap:11px;border:1.6px solid var(--line-2);border-radius:12px;padding:12px 14px;cursor:pointer;transition:all .13s;}
  .symptom-opt:hover{border-color:var(--grey-2);}
  .symptom-opt.on{border-color:var(--accent);background:var(--accent-soft);}
  .symptom-opt .sy-ic{width:34px;height:34px;border-radius:9px;background:var(--fill);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;}
  .symptom-opt.on .sy-ic{background:var(--card);}
  .symptom-opt .sy-tx{font-size:13px;font-weight:700;line-height:1.3;}
  .symptom-opt .sy-tx span{display:block;font-size:11px;color:var(--grey-1);font-weight:500;}
  .diag-checklist{border:1px solid var(--line);border-radius:14px;overflow:hidden;}
  .diag-cl-head{display:flex;align-items:center;gap:8px;padding:11px 15px;font-size:12px;font-weight:700;}
  .diag-cl-head.constat{background:var(--accent-soft);color:var(--accent-dk);}
  .diag-cl-head.test{background:#eaf6ec;color:var(--green);}
  .diag-q{display:flex;align-items:center;gap:12px;padding:13px 15px;border-top:1px solid var(--line);}
  .diag-q .dq-tx{flex:1;font-size:13px;font-weight:600;}
  .diag-q .dq-tx span{display:block;font-size:11px;color:var(--grey-1);font-weight:500;margin-top:1px;}
  .triple{display:flex;gap:5px;flex-shrink:0;}
  .tri-btn{font:inherit;font-size:11px;font-weight:700;padding:6px 10px;border-radius:8px;border:1.5px solid var(--line-2);background:var(--card);cursor:pointer;color:var(--grey-1);transition:all .12s;}
  .tri-btn:hover{border-color:var(--grey-2);}
  .tri-btn.on-ok{background:#eaf6ec;border-color:var(--green);color:var(--green);}
  .tri-btn.on-ko{background:#fdeee6;border-color:#e0683a;color:#e0683a;}
  .tri-btn.on-na{background:var(--fill);border-color:var(--grey-2);color:var(--grey-1);}
  .diag-empty{padding:22px 15px;text-align:center;color:var(--grey-2);font-size:12.5px;font-weight:500;}
  .diag-summary{background:#f3edff;border:1px solid #ddd2ff;border-radius:12px;padding:13px 15px;margin-top:14px;}
  .diag-summary .ds-h{font-size:12px;font-weight:700;color:#5b35d6;display:flex;align-items:center;gap:7px;}
  .diag-summary .ds-c{font-size:12px;color:#5b35d6;font-weight:600;margin-top:6px;line-height:1.5;}
  /* ---- BADGE ORIGINE ---- */
  .origin-box{border-radius:13px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start;}
  .origin-box.match{background:#eaf6ec;border:1px solid #c4e6cc;}
  .origin-box.none{background:var(--fill);border:1px solid var(--line-2);}
  /* À vérifier (rachat : pièces déjà remplacées, appareil déjà vu) : ambre. */
  .origin-box.warn{background:#fff6e6;border:1px solid #f2d59a;}
  .origin-box.warn .origin-ic{background:var(--amber);}
  .origin-box.warn .ot-t{color:#8a5a00;}
  .origin-ic{width:38px;height:38px;border-radius:10px;flex-shrink:0;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;}
  .origin-box.match .origin-ic{background:var(--green);}
  .origin-box.none .origin-ic{background:var(--grey-2);}
  .origin-tx{flex:1;}
  .origin-tx .ot-t{font-size:13.5px;font-weight:800;}
  .origin-box.match .ot-t{color:var(--green);}
  .origin-tx .ot-s{font-size:12px;color:var(--grey-1);font-weight:500;margin-top:3px;line-height:1.5;}
  .origin-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px;}
  .origin-tag{font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:980px;background:var(--card);color:var(--green);}
  /* ---- VENDEUR ASSISTÉ ---- */
  .ai-intro{background:linear-gradient(135deg,#1d1d1f,#3a3a40);color:#fff;border-radius:var(--radius);padding:22px 24px;margin-bottom:22px;display:flex;gap:15px;align-items:center;}
  .ai-intro .ai-orb{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,#62b616,#2f7d4f);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;}
  .ai-intro .ai-tx h3{font-size:16px;font-weight:800;}
  .ai-intro .ai-tx p{font-size:12.5px;color:#b8b8bd;font-weight:500;margin-top:3px;line-height:1.5;}
  .demo-pill{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.12);color:#fff;font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:980px;margin-top:7px;}
  .cmp-pick{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;margin-bottom:18px;}
  .cmp-slot{border:1.6px solid var(--line-2);border-radius:13px;padding:14px;background:var(--card);}
  .cmp-slot label{font-size:11.5px;font-weight:700;color:var(--grey-1);display:block;margin-bottom:7px;}
  .cmp-slot select{width:100%;font:inherit;font-size:14px;font-weight:600;color:var(--ink);padding:10px 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--fill);outline:none;}
  .cmp-vs{width:38px;height:38px;border-radius:50%;background:var(--ink);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;}
  .cmp-result{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
  .cmp-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;}
  .cmp-card-h{padding:14px 16px;background:var(--fill);border-bottom:1px solid var(--line);}
  .cmp-card-h .cc-n{font-size:15px;font-weight:800;}
  .cmp-card-h .cc-p{font-size:12.5px;color:var(--accent);font-weight:700;margin-top:2px;}
  .cmp-spec{display:flex;justify-content:space-between;gap:12px;padding:10px 16px;font-size:12.5px;border-bottom:1px solid var(--line);}
  .cmp-spec:last-of-type{border-bottom:none;}
  .cmp-spec .cs-k{color:var(--grey-1);font-weight:500;}
  .cmp-spec .cs-v{font-weight:700;text-align:right;}
  .cmp-spec .cs-v.win{color:var(--green);}
  .cmp-args{padding:13px 16px;background:#f3edff;}
  .cmp-args .ca-h{font-size:11px;font-weight:800;color:#5b35d6;text-transform:uppercase;letter-spacing:.03em;margin-bottom:7px;}
  .cmp-args ul{margin:0;padding-left:16px;}
  .cmp-args li{font-size:12px;color:#4a2bb8;font-weight:600;margin:4px 0;line-height:1.4;}
  .verdict{background:#eef6e3;border:1px solid #d4e7b8;border-radius:13px;padding:14px 16px;margin-top:14px;}
  .verdict .vd-h{font-size:12px;font-weight:800;color:var(--accent-dk);display:flex;align-items:center;gap:7px;}
  .verdict .vd-c{font-size:13px;color:var(--accent-dk);font-weight:600;margin-top:6px;line-height:1.55;}
  .ask-box{border:1px solid var(--line);border-radius:14px;overflow:hidden;}
  .ask-feed{padding:18px;min-height:120px;}
  .ask-msg{margin-bottom:14px;}
  .ask-msg:last-child{margin-bottom:0;}
  .ask-q{display:flex;gap:9px;justify-content:flex-end;}
  .ask-q .aq-b{background:var(--accent);color:#fff;font-size:13px;font-weight:600;padding:10px 14px;border-radius:14px 14px 4px 14px;max-width:80%;}
  .ask-a{display:flex;gap:10px;}
  .ask-a .aa-orb{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#62b616,#2f7d4f);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:14px;}
  .ask-a .aa-b{background:var(--fill);font-size:13px;font-weight:500;padding:11px 14px;border-radius:14px 14px 14px 4px;line-height:1.55;color:var(--ink);}
  .ask-a .aa-b b{font-weight:800;}
  .ask-suggest{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 14px;}
  .ask-chip{font:inherit;font-size:12px;font-weight:600;padding:8px 13px;border-radius:980px;border:1px solid var(--line-2);background:var(--card);cursor:pointer;color:var(--accent-dk);transition:all .13s;}
  .ask-chip:hover{border-color:var(--accent);background:var(--accent-soft);}
  .ask-bar{display:flex;gap:9px;padding:13px 16px;border-top:1px solid var(--line);background:var(--fill);}
  .ask-bar input{flex:1;font:inherit;font-size:13.5px;padding:11px 13px;border:1px solid var(--line-2);border-radius:11px;background:var(--card);outline:none;}
  .ask-bar input:focus{border-color:var(--accent);}
  /* ---- ÉCRAN DE CONNEXION ---- */
  .login-screen{position:fixed;inset:0;background:var(--bg);z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;overflow-y:auto;}
  .login-screen.hide{display:none;}
  /* Tant qu'on n'est pas connecté : RIEN de l'app n'existe derrière le login (ni contenu
     de maquette, ni données résiduelles d'une session précédente). Seul l'écran de login
     est rendu → impossible d'apercevoir ou de scroller vers l'interface. */
  body.pre-auth > *:not(#login-screen){display:none !important;}
  .login-card{width:400px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-lg);overflow:hidden;}
  .login-top{padding:32px 32px 24px;text-align:center;border-bottom:1px solid var(--line);}
  .login-logo{height:38px;width:auto;display:block;margin:0 auto 14px;}
  .login-top p{font-size:13px;color:var(--grey-1);font-weight:500;margin-top:5px;}
  .login-body{padding:26px 32px;}
  .login-fld{margin-bottom:15px;}
  .login-fld label{display:block;font-size:12.5px;font-weight:700;color:var(--grey-1);margin-bottom:7px;}
  .login-fld input{width:100%;font:inherit;font-size:14px;padding:12px 14px;border:1px solid var(--line-2);border-radius:11px;background:var(--fill);outline:none;transition:border-color .14s,box-shadow .14s,background .14s;}
  .login-fld input:focus{border-color:var(--accent);background:var(--card);box-shadow:0 0 0 3.5px var(--accent-soft);}
  .login-err{background:#fdecec;color:#c0341d;border:1px solid #f4c9c2;border-radius:11px;padding:11px 14px;font-size:12.5px;font-weight:600;margin-bottom:14px;line-height:1.4;}
  .login-err[hidden]{display:none;}
  /* Encart d'aide « Problème de connexion ? ». Le toast est inutilisable ici (il passe derrière l'overlay du login). */
  .login-info{background:var(--accent-soft);color:var(--accent-dk);border:1px solid #d3e8b6;border-radius:11px;padding:11px 14px;font-size:12.5px;font-weight:600;margin-bottom:14px;line-height:1.45;}
  .login-info::before{content:'ⓘ ';font-weight:700;}
  .login-info[hidden]{display:none;}
  .login-btn{width:100%;font:inherit;font-size:14.5px;font-weight:700;padding:13px;border-radius:12px;border:none;background:var(--accent);color:#fff;cursor:pointer;transition:background .15s,transform .12s;margin-top:4px;}
  .login-btn:hover{background:var(--accent-dk);}
  .login-btn:active{transform:scale(.98);}
  .login-btn:disabled{opacity:.6;cursor:progress;transform:none;}

  /* Module Employés */
  .emp-row{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:var(--card);margin-bottom:9px;flex-wrap:wrap;}
  .emp-main{flex:1;min-width:160px;}
  .emp-name{font-size:14px;font-weight:700;}
  .emp-sub{font-size:12px;color:var(--grey-2);font-weight:600;margin-top:2px;}
  .emp-me{font-size:10.5px;font-weight:700;color:var(--accent-dk);background:var(--accent-soft);padding:1px 6px;border-radius:6px;margin-left:4px;}
  .emp-badge{font-size:11px;font-weight:700;color:var(--amber);white-space:nowrap;}
  .emp-actions{display:flex;gap:8px;flex-wrap:wrap;}
  .emp-off{opacity:.55;}

  /* Photos : aperçu au formulaire + pièces jointes dans le détail */
  .photo-preview{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
  .pp-thumb{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;border:1px solid var(--line);}
  .pp-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  .pp-rm{position:absolute;top:2px;right:2px;width:18px;height:18px;border:none;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:10px;line-height:1;cursor:pointer;padding:0;}
  #d-files{display:flex;gap:10px;flex-wrap:wrap;margin:4px 0 2px;}
  .d-file{display:block;width:84px;text-align:center;font-size:10.5px;color:var(--grey-2);font-weight:600;text-decoration:none;}
  .d-file img{width:84px;height:84px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block;margin-bottom:3px;}
  /* Visionneuse de photo : la pièce jointe s'ouvrait dans un onglet du navigateur,
     d'où l'on ne pouvait pas revenir au dossier sur mobile (onglet neuf = pas de
     bouton Précédent). Elle s'affiche maintenant par-dessus l'app, avec une croix,
     un clic sur le fond et la touche Échap pour en sortir. */
  .photo-ov{position:fixed;inset:0;background:rgba(0,0,0,.95);opacity:0;pointer-events:none;transition:opacity .22s;z-index:130;display:flex;align-items:center;justify-content:center;padding:56px 16px 24px;}
  .photo-ov.show{opacity:1;pointer-events:auto;}
  .photo-ov img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;}
  .photo-x{position:absolute;top:calc(12px + env(safe-area-inset-top));right:14px;width:44px;height:44px;border-radius:50%;border:none;background:rgba(255,255,255,.16);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
  .photo-x:hover{background:rgba(255,255,255,.28);}
  .photo-cap{position:absolute;left:0;right:0;bottom:calc(14px + env(safe-area-inset-bottom));text-align:center;color:rgba(255,255,255,.82);font-size:12.5px;font-weight:600;pointer-events:none;}
  .imei-hist{margin-top:8px;display:flex;flex-direction:column;gap:5px;}
  .imei-hist-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;font-weight:600;color:var(--grey-1);}
  .login-forgot{text-align:center;margin-top:13px;}
  .login-forgot a{font-size:12.5px;color:var(--accent-dk);font-weight:600;cursor:pointer;}
  .login-forgot a:hover{text-decoration:underline;}
  .login-demo{background:var(--fill);padding:18px 32px 24px;}
  .login-demo-h{font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:11px;text-align:center;}
  .demo-accounts{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .demo-acc{display:flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line-2);border-radius:11px;padding:9px 11px;cursor:pointer;transition:border-color .13s,transform .12s;}
  .demo-acc:hover{border-color:var(--accent);transform:translateY(-1px);}
  .demo-acc .da-av{width:30px;height:30px;border-radius:50%;color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .demo-acc .da-tx{line-height:1.25;min-width:0;}
  .demo-acc .da-n{font-size:12.5px;font-weight:700;}
  .demo-acc .da-r{font-size:10.5px;color:var(--grey-2);font-weight:600;}
  .login-note{font-size:11px;color:var(--grey-2);font-weight:500;text-align:center;margin-top:13px;line-height:1.5;}
  /* bouton déconnexion topbar */
  .logout-btn{width:34px;height:34px;border-radius:9px;border:1px solid var(--line-2);background:var(--card);cursor:pointer;font-size:15px;color:var(--grey-1);display:flex;align-items:center;justify-content:center;transition:all .14s;}
  .logout-btn:hover{border-color:#e0683a;color:#e0683a;}
  /* ---- FICHE CLIENT ---- */
  .client-search{display:flex;gap:10px;margin-bottom:20px;}
  .client-search input{flex:1;font:inherit;font-size:14px;padding:12px 15px;border:1px solid var(--line-2);border-radius:12px;background:var(--card);outline:none;transition:border-color .14s,box-shadow .14s;}
  .client-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);}
  .client-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;}
  .client-row{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;cursor:pointer;display:flex;align-items:center;gap:13px;transition:transform .14s,box-shadow .14s,border-color .14s;}
  .client-row:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line-2);}
  .client-av{width:44px;height:44px;border-radius:50%;background:var(--accent-soft);color:var(--accent-dk);font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .client-row .cr-tx{min-width:0;flex:1;}
  .client-row .cr-n{font-size:14.5px;font-weight:700;}
  .client-row .cr-s{font-size:12px;color:var(--grey-1);font-weight:500;margin-top:2px;}
  .client-row .cr-badge{font-size:10px;font-weight:700;padding:3px 8px;border-radius:980px;background:var(--accent-soft);color:var(--accent-dk);}
  /* fiche détail */
  .cf-header{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:flex;gap:18px;align-items:center;margin-bottom:16px;flex-wrap:wrap;}
  .cf-av{width:64px;height:64px;border-radius:50%;background:var(--accent);color:#fff;font-size:23px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
  .cf-id h2{font-size:23px;font-weight:800;letter-spacing:-.02em;}
  .cf-id .cf-contact{font-size:13px;color:var(--grey-1);font-weight:600;margin-top:3px;}
  .cf-badges{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px;}
  .cf-badge{font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:980px;}
  .cf-badge.coral{background:var(--accent-soft);color:var(--accent-dk);}
  .cf-badge.vip{background:#fff0d6;color:#9a6c10;}
  .cf-stats{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap;}
  .cf-stat{text-align:center;background:var(--fill);border-radius:12px;padding:10px 16px;}
  .cf-stat .cs-n{font-size:20px;font-weight:800;line-height:1;}
  .cf-stat .cs-l{font-size:10.5px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;margin-top:4px;}
  /* Note d'équipe partagée (fiche client). */
  .cf-note{margin-top:16px;margin-bottom:16px;}
  .cf-note-box{background:#fff8ec;border:1px solid #f3e2bf;border-radius:14px;padding:14px 16px;}
  .cf-note-h{display:flex;align-items:center;justify-content:space-between;color:#8a6510;font-size:13px;margin-bottom:6px;}
  .cf-note-btn{background:none;border:none;color:#8a6510;font:inherit;font-size:12px;font-weight:700;cursor:pointer;padding:0;}
  .cf-note-txt{font-size:13px;color:#6b4f0a;line-height:1.55;white-space:pre-wrap;}
  .cf-note-input{width:100%;font:inherit;font-size:13.5px;color:var(--ink);padding:11px 13px;border:1px solid #e6cf95;border-radius:11px;background:var(--card);outline:none;min-height:90px;resize:vertical;}
  .cf-note-input:focus{border-color:#d9a63a;}
  .cf-note-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:10px;}
  .cf-note-add{background:var(--card);border:1px dashed var(--line-2);border-radius:12px;padding:12px 16px;width:100%;font:inherit;font-size:13px;font-weight:600;color:var(--grey-1);cursor:pointer;transition:border-color .14s,color .14s;}
  .cf-note-add:hover{border-color:var(--accent);color:var(--accent-dk);}
  /* Actions rapides « créer pour ce client » (fiche) */
  .cf-actions{margin-bottom:16px;}
  .cf-actions-h{font-size:11.5px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px;}
  .cf-actions-row{display:flex;flex-wrap:wrap;gap:9px;}
  .cf-action{display:inline-flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line-2);border-radius:11px;padding:10px 15px;font:inherit;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;transition:border-color .14s,color .14s,transform .14s,box-shadow .14s;}
  .cf-action:hover{border-color:var(--accent);color:var(--accent-dk);transform:translateY(-1px);box-shadow:var(--shadow);}
  .cf-action .cfa-ic{font-size:15px;}
  .timeline{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .tl-filters{display:flex;gap:6px;padding:14px 18px;border-bottom:1px solid var(--line);flex-wrap:wrap;}
  .tl-filter{font:inherit;font-size:12px;font-weight:600;padding:6px 12px;border-radius:980px;border:1px solid var(--line-2);background:var(--card);cursor:pointer;color:var(--grey-1);transition:all .13s;}
  .tl-filter:hover{border-color:var(--grey-2);}
  .tl-filter.on{background:var(--ink);color:#fff;border-color:var(--ink);}
  .tl-event{display:flex;gap:14px;padding:15px 18px;border-bottom:1px solid var(--line);}
  .tl-event:last-child{border-bottom:none;}
  .tl-ic{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;}
  .tl-ic.rep{background:var(--accent-soft);}
  .tl-ic.buy{background:#eef6e3;}
  .tl-ic.sav{background:#fdeee6;}
  .tl-ic.rachat{background:#f0ecff;}
  .tl-ic.cmd{background:#fff0d6;}
  .tl-body{flex:1;min-width:0;}
  .tl-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline;}
  .tl-title{font-size:13.5px;font-weight:700;}
  .tl-date{font-size:11.5px;color:var(--grey-2);font-weight:600;flex-shrink:0;}
  .tl-desc{font-size:12.5px;color:var(--grey-1);font-weight:500;margin-top:3px;line-height:1.5;}
  .tl-tag{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:980px;margin-top:7px;}
  .tl-tag.done{background:#eaf6ec;color:var(--green);}
  .tl-tag.ongoing{background:var(--accent-soft);color:var(--accent-dk);}
  /* ---- PAIEMENTS EN ATTENTE ---- */
  .pay-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px;}
  .pay-kpi{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;}
  .pay-kpi .pk-l{font-size:12px;font-weight:700;color:var(--grey-1);}
  .pay-kpi .pk-n{font-size:24px;font-weight:800;letter-spacing:-.02em;margin-top:6px;}
  .pay-kpi.due .pk-n{color:#e0683a;}
  .pay-table{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .pay-head{display:grid;grid-template-columns:1.5fr 1.6fr 90px 110px 110px;gap:14px;padding:13px 22px;font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line);}
  .pay-row{display:grid;grid-template-columns:1.5fr 1.6fr 90px 110px 110px;gap:14px;padding:15px 22px;font-size:13px;align-items:center;border-bottom:1px solid var(--line);}
  .pay-row:last-child{border-bottom:none;}
  .pay-row .pr-debtor{font-weight:700;}
  .pay-row .pr-sub{font-size:11px;color:var(--grey-1);font-weight:500;margin-top:2px;}
  .pay-row .pr-amount{font-weight:800;}
  .pay-row .pr-date{font-weight:600;color:var(--grey-1);}
  .pay-row .pr-date.late{color:#e0683a;font-weight:700;}
  .pay-status{font-size:11px;font-weight:700;padding:4px 10px;border-radius:980px;text-align:center;}
  .pay-status.wait{background:var(--accent-soft);color:var(--accent-dk);}
  .pay-status.late{background:#fdeee6;color:#c0561f;}
  .pay-status.paid{background:#eaf6ec;color:var(--green);}
  .pay-row.done .pr-debtor,.pay-row.done .pr-amount{color:var(--grey-2);}
  /* ---- LOCATION SMARTPHONE ---- */
  .rent-formula{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
  .rent-f{border:1.6px solid var(--line-2);border-radius:13px;padding:14px;cursor:pointer;transition:all .14s;}
  .rent-f:hover{border-color:var(--grey-2);}
  .rent-f.on{border-color:var(--accent);background:var(--accent-soft);}
  .rent-f .rf-n{font-size:13.5px;font-weight:800;}
  .rent-f .rf-d{font-size:11.5px;color:var(--grey-1);font-weight:500;margin-top:3px;line-height:1.4;}
  .rent-sim{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
  .rent-sim-grid{display:grid;grid-template-columns:1fr 1fr;}
  .rent-inputs{padding:24px;border-right:1px solid var(--line);}
  .rent-result{padding:24px;background:var(--fill);}
  .rent-result-h{font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.04em;margin-bottom:13px;}
  .rent-big{font-size:32px;font-weight:800;letter-spacing:-.03em;line-height:1;}
  .rent-big.pos{color:var(--green);}
  .rent-big.neg{color:#e0683a;}
  .rent-big-l{font-size:12px;font-weight:600;color:var(--grey-1);margin-top:5px;}
  .rent-detail{margin-top:18px;border-top:1px solid var(--line-2);padding-top:14px;}
  .rent-detail-row{display:flex;justify-content:space-between;font-size:12.5px;padding:4px 0;font-weight:500;}
  .rent-detail-row .rdv{font-weight:700;}
  .rent-detail-row.tot{border-top:1px solid var(--line-2);margin-top:7px;padding-top:9px;font-weight:700;}
  .rent-ratio{margin-top:14px;}
  .rent-ratio-bar{height:8px;background:var(--line-2);border-radius:980px;overflow:hidden;margin-top:6px;}
  .rent-ratio-fill{height:100%;background:var(--accent);border-radius:980px;transition:width .35s ease;}
  .rent-list{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:22px;}
  .rent-head{display:grid;grid-template-columns:1.3fr 1.4fr 90px 110px 100px;gap:14px;padding:13px 22px;font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line);}
  .rent-row{display:grid;grid-template-columns:1.3fr 1.4fr 90px 110px 100px;gap:14px;padding:15px 22px;font-size:13px;align-items:center;border-bottom:1px solid var(--line);}
  .rent-row:last-child{border-bottom:none;}
  .rent-row .rr-n{font-weight:700;}
  .rent-row .rr-s{font-size:11px;color:var(--grey-1);font-weight:500;margin-top:2px;}
  .rent-row .rr-amount{font-weight:800;}
  .legal-strong{display:flex;gap:10px;background:#fff8ec;border:1px solid #f3e2bf;border-radius:12px;padding:13px 15px;font-size:12px;color:#8a6510;line-height:1.5;font-weight:500;margin-bottom:18px;}
  .hide{display:none !important;}
  @media(max-width:880px){
    .cmp-pick{grid-template-columns:1fr;}
    .cmp-vs{margin:0 auto;}
    .cmp-result{grid-template-columns:1fr;}
    .brand-grid{grid-template-columns:1fr 1fr;}
    .symptom-grid{grid-template-columns:1fr;}
    .pl-grid{grid-template-columns:120px repeat(7,minmax(74px,1fr));}
    .planning{overflow-x:auto;}
    .board.c5,.board.c4,.board.c3{grid-template-columns:1fr 1fr;}
    .board.c2{grid-template-columns:1fr;}
    .g2,.g3,.chips,.chips.c3{grid-template-columns:1fr;}
    /* Colonnes empilées : le dernier champ d'une ligne perdait sa marge
       (.fld:last-child) et collait au champ suivant (« Nom » contre « Téléphone »).
       Un seul espacement vertical, celui des champs. */
    .g2,.g3{gap:0;}
    .g2>.fld:last-child,.g3>.fld:last-child{margin-bottom:14px;}
    .hello h1{font-size:29px;}
    .phead{flex-direction:column;}
    .role-sw .lbl{display:none;}
    .deadline-banner{flex-wrap:wrap;}
    /* Tableaux : scroll horizontal encapsulé au lieu de déborder la page */
    .pay-table,.rent-list,.compare{overflow-x:auto;}
    .pay-head,.pay-row{min-width:640px;}
    .rent-head,.rent-row{min-width:560px;}
    .compare-h,.compare-r{min-width:560px;}
    #buyback-reg .fcard{overflow-x:auto;}
    #buyback-reg .fcard>div{min-width:600px;}
    /* Intégration employés + Base de connaissances : même traitement */
    #onboarding-list .fcard,#kb-list .fcard{overflow-x:auto;}
    #onb-rows{min-width:620px;}
    #kb-rows{min-width:560px;}
    /* Simulateur de location : colonnes empilées */
    .rent-sim-grid{grid-template-columns:1fr;}
    .rent-inputs{border-right:none;border-bottom:1px solid var(--line);}
  }
  @media(max-width:768px){
    .topbar-in{padding:0 18px;gap:10px;}
    .shop-btn{max-width:170px;}
    .wrap{padding:30px 18px 80px;}
    .fmt-grid,.rent-formula{grid-template-columns:1fr;}
  }
  @media(max-width:480px){
    .topbar{height:56px;}
    .topbar-in{padding:0 12px;gap:6px;}
    .brand-logo{height:28px;}
    .brand-tag{display:none;}
    .tb-user{padding:0 3px;gap:4px;}
    .tb-user-tx{display:none;}
    .tb-user .tb-caret{display:none;}
    .shop-btn{max-width:150px;padding:0 7px 0 9px;gap:6px;}
    .wrap{padding:22px 14px 72px;}
    .hello h1{font-size:24px;}
    .phead h2{font-size:24px;}
    .pay-summary{grid-template-columns:1fr;}
    .demo-accounts{grid-template-columns:1fr;}
    .modal-ov{padding:14px;}
  }

  /* Cloche « À traiter » (topbar) + panneau déroulant */
  /* Messagerie : bouton rond flottant (FAB) en bas à droite. */
  .msg-fab{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:50%;border:none;background:var(--accent);color:#fff;font-size:23px;cursor:pointer;box-shadow:var(--shadow-lg);z-index:90;display:flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s;}
  .msg-fab:hover{transform:translateY(-2px) scale(1.04);}
  .msg-fab:active{transform:scale(.96);}
  .msg-fab .tb-badge{top:0;right:0;}
  /* Messages non lus : halo pulsant + légère bascule, pour attirer l'œil. */
  .msg-fab.has-unread{animation:fabBob 2.4s ease-in-out infinite;}
  .msg-fab.has-unread::after{content:'';position:absolute;inset:0;border-radius:50%;z-index:-1;animation:fabPulse 1.9s ease-out infinite;}
  @keyframes fabPulse{0%{box-shadow:0 0 0 0 rgba(98,182,22,.55);}70%{box-shadow:0 0 0 18px rgba(98,182,22,0);}100%{box-shadow:0 0 0 0 rgba(98,182,22,0);}}
  @keyframes fabBob{0%,88%,100%{transform:translateY(0);}92%{transform:translateY(-4px);}96%{transform:translateY(-1px);}}
  @media(prefers-reduced-motion:reduce){ .msg-fab.has-unread,.msg-fab.has-unread::after{animation:none;} .msg-fab.has-unread{box-shadow:0 0 0 4px rgba(98,182,22,.35),var(--shadow-lg);} }
  @media(max-width:768px){ .msg-fab{right:16px;bottom:16px;width:54px;height:54px;} }
  /* ---- « Mes outils » : rangement personnel de l'accueil ----
     Bouton Ranger, croix de retrait, repli des outils écartés. */
  #apps-head{display:flex;align-items:center;gap:12px;}
  .edit-btn{position:relative;margin-left:auto;display:inline-flex;align-items:center;gap:6px;
            border:1px solid var(--line);background:var(--card);color:var(--grey-1);
            border-radius:980px;padding:6px 15px 6px 12px;font:inherit;font-size:11.5px;font-weight:700;
            text-transform:none;letter-spacing:0;cursor:pointer;transition:background .15s,color .15s,border-color .15s;}
  @media(hover:hover){ .edit-btn:hover{border-color:var(--line-2);color:var(--ink);} }
  .edit-btn.on{background:var(--accent);border-color:var(--accent);color:#fff;}
  /* ⠿ = la poignée de déplacement. Elle se dandine au survol : le bouton annonce
     ce qu'il fait avant même qu'on clique. */
  .eb-ic{display:inline-block;font-size:13px;line-height:1;}
  @keyframes gripNudge{0%,100%{transform:translateX(0);}30%{transform:translateX(-1.5px);}70%{transform:translateX(1.5px);}}
  @media(hover:hover){ .edit-btn:hover .eb-ic{animation:gripNudge .5s ease-in-out;} }
  /* Première visite seulement : un halo part du bouton, trois fois, puis plus jamais
     (mémorisé sur l'appareil). Juste de quoi attirer l'œil une fois. */
  .edit-btn.attention::after{content:'';position:absolute;inset:0;border-radius:980px;pointer-events:none;
                             animation:ebPulse 2s ease-out 3;}
  @keyframes ebPulse{0%{box-shadow:0 0 0 0 var(--accent);opacity:.5;}70%{box-shadow:0 0 0 9px var(--accent);opacity:0;}100%{opacity:0;}}
  @media(prefers-reduced-motion:reduce){ .edit-btn.attention::after,.edit-btn:hover .eb-ic{animation:none;} }
  .apps-hint{font-size:12.5px;color:var(--grey-2);font-weight:600;margin:-4px 0 13px;}
  /* Croix de retrait (mode rangement) et « + » de remise en place. */
  .tile-x{position:absolute;top:11px;right:11px;width:26px;height:26px;border-radius:50%;border:none;
          background:var(--fill);color:var(--grey-1);font-size:12px;font-weight:800;line-height:1;cursor:pointer;
          display:flex;align-items:center;justify-content:center;z-index:2;transition:background .15s,color .15s;}
  @media(hover:hover){ .tile-x:hover{background:var(--ink);color:var(--card);} }
  .tile-x.add{background:var(--accent-soft);color:var(--accent-dk);font-size:15px;}
  @media(hover:hover){ .tile-x.add:hover{background:var(--accent);color:#fff;} }
  /* Pendant le rangement : la tuile se saisit, elle ne s'ouvre pas. Et elle
     frémit, comme les applications d'un iPhone qu'on réorganise — personne n'a
     besoin qu'on lui explique ce qui se passe. Trois durées et trois décalages
     légèrement différents (2n / 3n) pour que la grille ne batte pas au garde-à-vous. */
  @keyframes tileWobble{0%{transform:rotate(-.5deg);}50%{transform:rotate(.55deg);}100%{transform:rotate(-.5deg);}}
  .tiles.sorting .tile{cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;
                       animation:tileWobble .29s ease-in-out infinite;}
  .tiles.sorting .tile:nth-child(2n){animation-duration:.33s;animation-delay:-.09s;}
  .tiles.sorting .tile:nth-child(3n){animation-duration:.26s;animation-delay:-.17s;}
  .tiles.sorting .tile:active{cursor:grabbing;}
  .tiles.sorting .tile.dnd-src{animation:none;}   /* celle qu'on tient ne tremble pas */
  @media(prefers-reduced-motion:reduce){ .tiles.sorting .tile{animation:none;} }
  .tiles.sorting .tile .tile-meta .arrow{opacity:.35;}
  .tile.dnd-src{opacity:.35;}
  .tile.dnd-ghost{cursor:grabbing;box-shadow:var(--shadow-lg);border-color:var(--line-2);transform:rotate(1.2deg);opacity:.97;}
  /* Repli « Autres outils » */
  /* ☆ / ★ sur les tuiles des rubriques : ajouter ou retirer des favoris */
  .tile-x.star{background:var(--card);border:1px solid var(--line-2);color:var(--grey-2);font-size:14px;}
  .tile-x.star.on{background:var(--amber-soft);border-color:transparent;color:var(--amber);}
  @media(hover:hover){ .tile-x.star:hover{background:var(--amber-soft);color:var(--amber);border-color:transparent;} }
  .tb-badge{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;padding:0 4px;border-radius:980px;background:#e0683a;color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;}
  /* ---- Menu compte (avatar topbar) : identité, thème, accès ---- */
  .account-menu{position:absolute;top:calc(100% + 8px);right:0;width:276px;max-width:88vw;background:var(--card);border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--shadow-lg);z-index:200;overflow:hidden;cursor:default;text-align:left;animation:tbmenu-in .16s ease-out;}
  .am-grip{display:none;width:40px;height:5px;border-radius:3px;background:var(--line-2);margin:8px auto 2px;}
  .account-menu-h{display:flex;align-items:center;gap:11px;padding:14px 14px 12px;}
  .am-av{width:40px;height:40px;border-radius:12px;font-size:14px;}
  .am-id{min-width:0;}
  .account-menu-h .am-name{font-size:14px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .account-menu-h .am-role{font-size:12px;font-weight:600;color:var(--grey-2);margin-top:1px;}
  .am-theme{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:0 10px 10px;}
  .account-menu .am-th{flex-direction:row;gap:6px;padding:8px 4px;border-radius:10px;border:1px solid var(--line);background:var(--fill);font-size:12px;font-weight:700;color:var(--grey-1);transform:none;transition:border-color .14s,color .14s,background .14s;}
  .account-menu .am-th .lc{font-size:15px;}
  @media(hover:hover){ .account-menu .am-th:hover{color:var(--ink);transform:none;} }
  .account-menu .am-th.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-dk);}
  .theme-opts{display:flex;gap:8px;}
  .theme-opt{flex:1;border:1.6px solid var(--line-2);background:var(--card);border-radius:11px;padding:9px 4px 7px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;font:inherit;font-size:11px;font-weight:700;color:var(--grey-1);transition:border-color .14s,color .14s,transform .12s;}
  .theme-opt:hover{transform:translateY(-1px);}
  .theme-opt.active{border-color:var(--accent);color:var(--ink);}
  .theme-opt .tsw{width:100%;height:26px;border-radius:7px;border:1px solid rgba(0,0,0,.08);position:relative;overflow:hidden;}
  .theme-opt .tsw::after{content:"";position:absolute;right:5px;bottom:5px;width:11px;height:11px;border-radius:50%;background:#62b616;box-shadow:0 0 0 2px rgba(255,255,255,.55);}
  .tsw-light{background:#fbfbfb;}
  .tsw-dark{background:#0d1117;}
  .tsw-sepia{background:#fbf0d9;}
  .account-menu-foot{border-top:1px solid var(--line);padding:6px;}
  .account-menu-foot button{width:100%;text-align:left;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);background:none;border:none;border-radius:10px;padding:8px 10px 8px 8px;cursor:pointer;display:flex;align-items:center;gap:11px;transition:background .14s;}
  @media(hover:hover){ .account-menu-foot button:hover{background:var(--fill);} }
  .amf-ic{width:30px;height:30px;border-radius:9px;background:var(--fill);display:flex;align-items:center;justify-content:center;color:var(--ink);flex-shrink:0;}
  .amf-ic .lc{font-size:16px;}
  .amf-ic-new{color:var(--accent-dk);background:var(--accent-soft);}
  .amf-ic-out{color:#e0683a;background:rgba(224,104,58,.12);}
  .amf-go{margin-left:auto;font-size:15px;color:var(--grey-2);}
  .amf-out{color:#d0582b;}
  @media(hover:hover){ .account-menu-foot .amf-out:hover{background:rgba(224,104,58,.1);} }
  /* Mobile : les deux menus de la barre deviennent des feuilles en bas d'écran,
     avec un voile, une poignée et des lignes hautes faciles à toucher. */
  @media(max-width:560px){
    /* Pas de flou de fond sur mobile : un flou (backdrop-filter) ferait de la barre
       le repère des éléments « fixed », et les feuilles ne pourraient plus se poser
       en bas de l'écran. La barre passe au-dessus du reste tant qu'une feuille est ouverte. */
    .topbar{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--card);}
    .topbar.sheet-open{z-index:300;}
    .tb-scrim.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:150;animation:tbscrim-in .18s ease-out;}
    .shop-menu,.account-menu{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-width:none;min-width:0;border-radius:22px 22px 0 0;border-bottom:0;animation:tbsheet-in .24s cubic-bezier(.2,.8,.2,1);padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));}
    .shop-menu{padding:8px 10px calc(10px + env(safe-area-inset-bottom,0px));}
    .shop-menu::after{display:block;}
    .am-grip{display:block;}
    .shop-opt{padding:14px 12px;font-size:15px;border-radius:12px;}
    .shop-opt.add{border-radius:0 0 12px 12px;}
    .account-menu-h{padding:12px 14px;}
    .am-av{width:46px;height:46px;font-size:16px;}
    .account-menu-h .am-name{font-size:16px;}
    .am-theme{padding:2px 10px 12px;}
    .account-menu .am-th{padding:11px 4px;font-size:13px;}
    .account-menu-foot{padding:8px 10px 4px;}
    .account-menu-foot button{padding:11px 10px 11px 8px;font-size:15px;}
    .amf-ic{width:34px;height:34px;border-radius:10px;}
  }
  /* ---- Page Réglages (liste verticale de cartes pleine largeur, uniformes :
         à gauche le titre + description, à droite le réglage) ---- */
  .set-list{display:flex;flex-direction:column;gap:16px;}
  .set-card{display:flex;gap:40px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px;box-shadow:0 1px 2px rgba(16,16,16,.03);}
  .set-side{flex:0 0 300px;max-width:300px;}
  .set-side h3{font-size:16px;font-weight:800;color:var(--ink);}
  .set-side p{font-size:13.5px;color:var(--grey-1);margin-top:5px;font-weight:500;line-height:1.5;}
  .set-main{flex:1;min-width:0;}
  .set-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-top:1px solid var(--line);font-size:14px;}
  .set-row:first-child{border-top:none;padding-top:2px;}
  .set-row .set-k{color:var(--grey-1);font-weight:600;}
  .set-row .set-v{color:var(--ink);font-weight:700;text-align:right;}
  .set-actions{margin-top:18px;}
  @media(max-width:760px){
    /* En colonne, align-items gère l'axe horizontal : il faut « stretch » pour que
       les enfants (dont set-main) occupent toute la largeur, sinon ils se réduisent
       à la largeur de leur contenu (ex. le bouton) et laissent un vide à droite. */
    .set-card{flex-direction:column;gap:16px;align-items:stretch;}
    .set-side{flex-basis:auto;max-width:none;}
  }
  /* Vignettes de thème : grille de 3 colonnes égales (remplit toujours la largeur,
     contrairement à flex qui pouvait laisser des vignettes étroites). Aperçu à ratio
     paysage constant via le hack padding-bottom (compatible partout). */
  .theme-opts-lg{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%;max-width:420px;}
  .theme-opts-lg .theme-opt{padding:12px 8px 10px;font-size:12.5px;gap:9px;}
  .theme-opts-lg .tsw{width:100%;height:0;padding-bottom:60%;}
  /* Mobile (cartes empilées) : les groupes de réglage occupent toute la largeur. */
  @media(max-width:760px){
    .theme-opts-lg{max-width:none;}
    .accent-opts{max-width:none;}
  }
  /* Couleur d'accentuation (pastilles) */
  .accent-opts{display:flex;flex-wrap:wrap;gap:12px;max-width:340px;}
  .accent-opt{width:40px;height:40px;border-radius:50%;border:none;background:var(--sw);cursor:pointer;position:relative;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);transition:transform .12s;outline:2px solid transparent;outline-offset:2px;}
  .accent-opt:hover{transform:scale(1.08);}
  .accent-opt.active{outline-color:var(--sw);}
  .accent-opt.active::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:800;text-shadow:0 1px 2px rgba(0,0,0,.4);}
  .accent-lock{display:flex;gap:8px;background:var(--fill);border:1px solid var(--line-2);border-radius:12px;padding:11px 14px;font-size:12.5px;color:var(--grey-1);font-weight:600;margin-bottom:14px;max-width:360px;}
  .set-card.is-locked .accent-opts{opacity:.5;filter:grayscale(.3);}
  .set-card.is-locked .accent-opt{cursor:not-allowed;}
  .set-card.is-locked .accent-opt:hover{transform:none;}
  .demo-links{display:flex;flex-wrap:wrap;gap:10px;}
  /* Nouveautés — page dédiée (historique des évolutions) */
  /* ---- Nouveautés ----
     Chaque ligne se lit en trois temps : une étiquette (de quoi s'agit-il ?), un
     titre en gras (quoi de neuf ?), puis l'explication en gris (qu'est-ce que ça
     change ?). On peut ainsi parcourir la page en ne lisant que les gras. */
  .chlog-page{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px 30px;max-width:760px;display:flex;flex-direction:column;gap:30px;box-shadow:0 1px 2px rgba(16,16,16,.03);}
  .chlog-entry{position:relative;padding-left:18px;}
  .chlog-entry::before{content:"";position:absolute;left:0;top:5px;bottom:2px;width:3px;border-radius:3px;background:var(--accent);opacity:.55;}
  .chlog-date{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--grey-2);margin-bottom:14px;}
  .chlog-items{list-style:none;display:flex;flex-direction:column;}
  /* Filet fin entre deux nouveautés : elles ne se touchent plus. */
  .chlog-items li{padding:14px 0;}
  .chlog-items li + li{border-top:1px solid var(--line);}
  .chlog-items li:first-child{padding-top:0;}
  .chlog-items li:last-child{padding-bottom:0;}
  .ch-tag{display:inline-block;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
          padding:3px 9px;border-radius:980px;margin-bottom:7px;}
  .ch-new{background:var(--accent-soft);color:var(--accent-dk);}
  .ch-up{background:#e3f4f4;color:#0a6f7d;}
  .ch-fix{background:#fdeee6;color:#c0561f;}
  .ch-lead{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ink);line-height:1.4;}
  /* 68 caractères par ligne environ : au-delà, l'œil perd le début de la ligne suivante. */
  .ch-tx{font-size:14px;line-height:1.6;color:var(--grey-1);font-weight:500;margin-top:4px;max-width:62ch;}
  .ch-lead + .ch-tx{margin-top:5px;}
  .ch-tx.solo{font-size:14.5px;color:var(--ink);}   /* pas de titre : le texte porte la ligne */
  /* Sombre et sépia : les deux étiquettes non vertes ont un fond en dur, on le
     rattrape pour qu'elles restent lisibles. */
  :root[data-theme="dark"] .ch-up{background:#10333a;color:#7fd4e0;}
  :root[data-theme="dark"] .lp-st.available{background:#1f3a12;color:#9fdc6a;}
  :root[data-theme="dark"] .lp-st.loaned{background:#3d2e0a;color:#f0c35a;}
  :root[data-theme="dark"] .origin-box.warn{background:#2e2410;border-color:#5a4415;}
  :root[data-theme="dark"] .origin-box.warn .ot-t{color:#f0c35a;}
  :root[data-theme="dark"] .ch-fix{background:#3a1f14;color:#f0a884;}
  @media(max-width:560px){ .chlog-page{padding:20px 18px;} .ch-tx{font-size:13.5px;} }
  .ver-close{background:none;border:none;color:rgba(255,255,255,.55);font-size:12px;cursor:pointer;padding:4px 8px;line-height:1;border-radius:999px;transition:color .15s,background .15s;}
  .ver-close:hover{color:#fff;background:rgba(255,255,255,.12);}

  /* Autocomplétion « client déjà connu » (pré-remplissage depuis PrestaShop) */
  /* overflow-x caché : overflow-y:auto rendrait l'axe X scrollable aussi, et un
     texte insécable (long e-mail…) créerait un petit scroll horizontal interne. */
  .ac-box{position:absolute;left:0;right:0;top:100%;z-index:40;background:var(--card);border:1px solid var(--line-2);border-radius:11px;box-shadow:var(--shadow-lg);margin-top:5px;max-height:250px;overflow-y:auto;overflow-x:hidden;}
  .ac-item{padding:9px 13px;cursor:pointer;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px;font-size:13px;overflow-wrap:anywhere;}
  .ac-item:last-child{border-bottom:none;}
  .ac-item:hover{background:var(--fill);}
  .ac-item span{color:var(--grey-1);font-size:11.5px;}
  .ac-empty{padding:11px 13px;color:var(--grey-2);font-size:12.5px;}

  /* ===== Interventions à domicile ===== */
  /* Barre de navigation du planning (‹ jour ›). */
  .itv-plan-bar{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
  .itv-plan-label{font-weight:800;font-size:14px;margin:0 4px;}
  /* Choix de la vue (jour → mois) et du technicien affiché. */
  .itv-plan-views{display:flex;flex-direction:column;gap:8px;margin-bottom:10px;}
  .itv-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle;}
  /* Semaine : colonnes-jours plus étroites. */
  .itv-grid.narrow .itv-col{flex:1 0 120px;min-width:120px;}
  .itv-dayh{text-transform:capitalize;font-weight:700;color:var(--grey-1);}
  .itv-dayh b{color:var(--ink);font-size:14px;}
  .itv-dayh.today b{color:#fff;background:var(--accent);border-radius:980px;padding:1px 7px;}
  /* Mois : grille de 6 semaines. */
  .itv-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;}
  .itv-mh{padding:8px 6px;font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;text-align:center;border-bottom:1px solid var(--line);}
  .itv-mday{min-height:96px;padding:5px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);cursor:pointer;overflow:hidden;}
  .itv-mday:nth-child(7n){border-right:none;}
  @media(hover:hover){ .itv-mday:hover{background:var(--fill);} }
  .itv-mday.out{background:var(--fill);}
  .itv-mday.out .itv-mnum{color:var(--grey-2);}
  .itv-mnum{font-size:12px;font-weight:800;margin-bottom:3px;}
  .itv-mday.today .itv-mnum{display:inline-block;color:#fff;background:var(--accent);border-radius:980px;padding:0 7px;}
  .itv-mitem{font-size:11px;line-height:1.3;padding:2px 5px;margin-bottom:2px;border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .itv-mmore{font-size:10.5px;color:var(--grey-1);font-weight:700;padding-left:4px;}
  @media(max-width:640px){ .itv-mday{min-height:64px;padding:3px;} .itv-mitem{font-size:9.5px;padding:1px 3px;} .itv-mitem b{display:none;} }
  /* Planning jour : colonnes par technicien, défilement horizontal sur téléphone. */
  .itv-plan-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);}
  /* --slot : hauteur d'un créneau de 30 min, posée par itv.js (28 px, 44 px au
     doigt). Tout le quadrillage en dépend, donc rien à régler à deux endroits. */
  .itv-grid{display:flex;min-width:max-content;--slot:28px;}
  /* La colonne des heures reste visible quand on fait défiler les techniciens
     latéralement : sans elle, on lit un rendez-vous sans savoir à quelle heure. */
  .itv-gutter{flex:0 0 52px;border-right:1px solid var(--line);position:sticky;left:0;z-index:4;background:var(--card);}
  .itv-col{flex:1 0 170px;min-width:170px;border-right:1px solid var(--line);}
  .itv-col:last-child{border-right:none;}
  .itv-col-h{padding:9px 10px;font-size:12px;font-weight:800;border-bottom:1px solid var(--line);background:var(--card);display:flex;align-items:center;gap:7px;white-space:nowrap;overflow:hidden;}
  .itv-col-h .asg-av{flex:0 0 auto;}
  /* Corps d'une colonne : lignes de 30 min dessinées en dégradé répété. */
  .itv-col-b{position:relative;background:repeating-linear-gradient(to bottom,transparent,transparent calc(var(--slot) - 1px),var(--line) calc(var(--slot) - 1px),var(--line) var(--slot));}
  .itv-hour{height:calc(var(--slot) * 2);font-size:10.5px;font-weight:700;color:var(--grey-2);text-align:right;padding:2px 7px 0 0;box-sizing:border-box;}
  .itv-slot{position:absolute;left:0;right:0;height:var(--slot);cursor:pointer;}
  /* Survol réservé à la souris ; au doigt, c'est l'appui qui donne le retour. */
  @media(hover:hover){ .itv-slot:hover{background:var(--accent-soft);opacity:.55;} }
  .itv-slot:active{background:var(--accent-soft);opacity:.7;}
  /* Bloc d'intervention (hauteur = durée) + marge de déplacement hachurée. */
  .itv-block{position:absolute;left:4px;right:4px;border-radius:9px;padding:4px 7px;font-size:11px;line-height:1.3;overflow:hidden;cursor:pointer;background:var(--accent-soft);border:1px solid var(--accent);color:var(--ink);z-index:2;box-sizing:border-box;}
  .itv-block b{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .itv-block .ib-sub{display:block;color:var(--grey-1);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .itv-block.st-terminee{background:#fff0d6;border-color:var(--amber);}
  .itv-block.st-cloturee{background:#eaf6ec;border-color:var(--green);}
  .itv-travel{position:absolute;left:4px;right:4px;border-radius:7px;z-index:1;pointer-events:none;background:repeating-linear-gradient(45deg,transparent,transparent 4px,rgba(128,128,128,.14) 4px,rgba(128,128,128,.14) 8px);}
  /* Conflits signalés à la planification (jamais bloquants). */
  .itv-conflict{margin-top:8px;background:#fff0d6;color:#9a6c10;border-radius:9px;padding:8px 11px;font-size:12px;font-weight:600;}
  /* File des SMS préparés dans le tiroir. */
  .iv-sms{border:1px solid var(--line);border-radius:10px;padding:8px 11px;margin-bottom:7px;font-size:12px;background:var(--fill);}
  .iv-sms .sm-h{display:flex;align-items:center;gap:7px;font-weight:700;margin-bottom:3px;}
  .iv-sms .sm-st{margin-left:auto;font-size:10.5px;font-weight:800;padding:1px 8px;border-radius:980px;background:var(--accent-soft);color:var(--accent-dk);}
  .iv-sms .sm-st.cancelled{background:var(--fill);color:var(--grey-2);text-decoration:line-through;}
  .iv-sms .sm-st.sent{background:#eaf6ec;color:var(--green);}
  .iv-sms .sm-st.delivered{background:#eaf6ec;color:var(--green);}
  .iv-sms .sm-st.failed{background:#fdeee6;color:#c0561f;}
  .iv-sms .sm-b{color:var(--grey-1);}
  /* Projection des interventions dans l'agenda partagé (lecture seule). */
  .ag-ev.t-itv{border-left-color:#0d9488;background:#e3f4f4;} .ag-ev.t-itv .ag-ev-t{color:#0b7a70;}
  .ag-mchip.t-itv{background:#e3f4f4;} .ag-mchip.t-itv .dot{background:#0d9488;}
  /* Catalogue des types : une ligne éditable par type. */
  .itv-type-row{display:grid;grid-template-columns:1fr 120px 110px 90px 110px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);}
  .itv-type-row:last-child{border-bottom:none;}
  @media(max-width:768px){ .itv-type-row{grid-template-columns:1fr 1fr;} }
  /* ---- Interventions sur téléphone ----------------------------------------
     Ce module est le seul qu'on utilise EN MOBILITÉ : le technicien lit sa
     tournée dans la voiture et rédige son compte rendu chez le client, debout,
     à une main. Les colonnes se resserrent pour en montrer deux à l'écran,
     et les blocs restent lisibles malgré la largeur. */
  @media(max-width:880px){
    .itv-col{flex:1 0 148px;min-width:148px;}
    .itv-block{font-size:12px;padding:5px 8px;}
    .itv-block b{font-size:12px;}
    .itv-block .ib-sub{font-size:11px;}
    .itv-plan-bar{flex-wrap:wrap;}
    .itv-plan-label{flex:1 0 100%;order:-1;margin:0 0 2px;}
    /* Le pied du tiroir peut porter 3 boutons : qu'ils passent à la ligne
       plutôt que de se comprimer en cibles intouchables. */
    .drw-f{flex-wrap:wrap;}
  }
  /* Commandes de tiroir au doigt : le ✕ qui retire une personne affectée mesure
     11 px de haut, le « Modifier » d'une note 19 px — on les vise mal debout chez
     un client. On les épaissit UNIQUEMENT sur écran tactile : au pointeur fin, le
     rendu ne change pas d'un pixel. Communes aux réparations, au SAV et aux
     commandes, qui se consultent aussi sur téléphone. */
  @media(pointer:coarse){
    .asg-x{padding:8px 10px;font-size:13px;}
    .asg-add{padding:9px 15px;}
    .ev-editbtn{padding:8px 10px;font-size:12px;opacity:.9;}
    /* Cases à cocher : le libellé entier bascule la case, mais il ne fait que
       18 px de haut — on l'aère pour en faire une vraie bande cliquable.
       « À signaler au client » se coche chez le client, souvent d'une main. */
    .chk{padding:7px 0;}
    .chk input{width:20px;height:20px;}
  }
  /* iOS Safari ZOOME toute la page dès qu'un champ fait moins de 16 px, et ne
     dézoome pas tout seul : on se retrouve à faire défiler latéralement pour
     lire ce qu'on tape. La règle est déjà appliquée à la recherche mobile
     (.gs-mhead input) — elle vaut pour tous les formulaires, à commencer par le
     compte rendu d'intervention, saisi sur le terrain. */
  @media(max-width:880px){
    .fld input,.fld select,.fld textarea{font-size:16px;}
  }

  /* --- Fenêtre de confirmation d'envoi de SMS (réparations, commandes) --- */
  .sms-to{font-weight:700;font-size:15px;letter-spacing:-.01em;}
  .sms-count{margin-top:6px;font-size:11.5px;color:var(--grey-1);font-weight:600;}
  /* Deux segments = deux SMS facturés. On le dit au moment où c'est corrigeable. */
  .sms-count.warn{color:var(--amber);}
  .sms-warn{margin-top:14px;padding:10px 12px;border-radius:12px;background:var(--fill);
            font-size:12.5px;font-weight:600;color:var(--grey-1);line-height:1.45;}

  /* --- Réglages → onglet SMS (gérant) --- */
  /* L'interrupteur existant (.toggle) employé comme vrai bouton : focus clavier compris. */
  button.toggle{border:none;padding:0;font:inherit;}
  button.toggle:focus-visible{outline:none;box-shadow:0 0 0 3.5px var(--accent-soft);}
  .sms-status{margin-top:12px;font-size:12.5px;color:var(--grey-1);font-weight:500;line-height:1.5;}
  .sms-status b{color:var(--ink);font-weight:700;}
  .sms-status.live b{color:var(--green);}
  .sms-tpl{padding:16px 0;border-top:1px solid var(--line);transition:opacity .15s;}
  .sms-tpl:first-child{padding-top:0;border-top:none;}
  .sms-tpl:last-child{padding-bottom:0;}
  .sms-tpl-h{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
  .sms-tpl-t{flex:1;min-width:0;display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
  .sms-tpl-t b{font-size:14px;font-weight:700;color:var(--ink);margin-right:3px;}
  .sms-pill{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:980px;background:var(--fill);color:var(--grey-1);}
  .sms-pill.auto{background:var(--accent-soft);color:var(--accent-dk);}
  .sms-tpl textarea{width:100%;font:inherit;font-size:14px;line-height:1.45;color:var(--ink);padding:11px 13px;border:1px solid var(--line-2);border-radius:11px;background:var(--card);outline:none;resize:vertical;min-height:66px;transition:border-color .14s,box-shadow .14s;}
  .sms-tpl textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3.5px var(--accent-soft);}
  .sms-vars{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:8px;font-size:11.5px;color:var(--grey-1);font-weight:600;}
  .sms-var{font:inherit;font-size:11.5px;font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;padding:3px 8px;border-radius:7px;border:1px solid var(--line-2);background:var(--card);color:var(--ink);cursor:pointer;transition:border-color .13s;}
  .sms-var:hover{border-color:var(--accent);}
  .sms-prev{margin-top:10px;padding:9px 12px;border-radius:11px;background:var(--fill);font-size:12.5px;color:var(--grey-1);line-height:1.45;overflow-wrap:anywhere;}
  .sms-tpl-f{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .sms-tpl-f .sms-count{flex:1;}
  .sms-reset{margin-top:6px;font:inherit;font-size:11.5px;font-weight:600;color:var(--grey-1);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:2px;}
  .sms-reset:hover{color:var(--ink);}
  /* Type coupé : on garde le texte lisible et modifiable, mais on montre qu'il ne part pas. */
  .sms-tpl.is-off textarea,.sms-tpl.is-off .sms-prev,.sms-tpl.is-off .sms-vars,.sms-tpl.is-off .sms-tpl-f{opacity:.5;}
  /* Coupure générale : toutes les cartes de types s'estompent. */
  #sms-types.sms-off .set-card{opacity:.55;}
  .sms-savebar{position:sticky;bottom:16px;display:flex;align-items:center;justify-content:flex-end;gap:14px;padding:12px 16px;border-radius:14px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);}
  .sms-dirty{font-size:12.5px;font-weight:600;color:var(--amber);}

  /* ===== Développement : prise d'informations au comptoir =====
     Le formulaire est volontairement maigre. Ces quelques règles servent
     seulement à donner au champ libre le poids qu'il a dans le métier (c'est
     LUI le brief), et à replier tout ce qui est facultatif. */

  /* Le texte du client et les photos côte à côte : les deux seules choses qui
     comptent, elles se valent — donc elles font exactement la même hauteur.
     La légende du champ libre occupe sa propre rangée (rangée 2, colonne 1) :
     laissée dans la même cellule, elle allongeait la ligne et la zone photo
     dépassait le bas de la zone de texte. Sous 880 px, tout s'empile, et la
     légende reste collée au champ qu'elle commente. */
  .dev-g{display:grid;grid-template-columns:1fr 250px;gap:7px 18px;align-items:stretch;}
  .dev-g .fld{grid-column:1;grid-row:1;display:flex;flex-direction:column;margin:0;}
  .dev-g .dev-ph{grid-column:2;grid-row:1;display:flex;flex-direction:column;}
  .dev-g .dev-hint{grid-column:1;grid-row:2;margin:0;}
  /* La zone de dépôt occupe toute la hauteur libre et centre son contenu ;
     quand des photos sont ajoutées, l'aperçu prend sa place sous elle. */
  .dev-g .drop{flex:1;display:flex;flex-direction:column;align-items:center;
               justify-content:center;cursor:pointer;}
  /* Tant qu'aucune photo n'est déposée, l'aperçu est vide : sans ceci sa marge
     haute de 10 px subsiste et la zone de dépôt s'arrête 10 px trop tôt. */
  .dev-g .photo-preview:empty{display:none;}
  @media(max-width:880px){
    .dev-g{grid-template-columns:1fr;}
    .dev-g .fld{grid-column:1;grid-row:1;}
    .dev-g .dev-hint{grid-column:1;grid-row:2;}
    .dev-g .dev-ph{grid-column:1;grid-row:3;margin-top:8px;}
    .dev-g .drop{flex:0 0 auto;}
  }
  /* Plus grand que les autres zones de texte : on invite à écrire, pas à résumer.
     Sélecteur volontairement aussi précis que `.fld textarea` (ligne ~418), qui
     impose min-height:66px et font-size:14px — une simple classe perdrait.
     flex:1 pour que le champ remplisse la cellule que sa hauteur minimale a créée. */
  .fld textarea.dev-libre{flex:1;min-height:190px;font-size:16px;line-height:1.6;}

  /* Bloc « Ajouter des précisions », replié par défaut. */
  .dev-more{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;
            font:inherit;font-size:14px;font-weight:700;color:var(--grey-1);cursor:pointer;
            padding:0;text-align:left;}
  .dev-more:hover{color:var(--ink);}
  .dev-more .ch{display:inline-block;transition:transform .2s;}
  .dev-more.open .ch{transform:rotate(90deg);}
  .dev-more .opt{font-weight:500;color:var(--grey-2);}
  .dev-more-b{display:none;padding-top:18px;}
  .dev-more-b.open{display:block;}

  /* Dans le tiroir : les mots du vendeur, en grand et en premier. */
  .dev-quote{background:var(--fill);border-radius:14px;padding:14px 16px;font-size:15px;
             line-height:1.6;white-space:pre-wrap;font-weight:500;}

  /* ===== ÉTIQUETTES PRIX (labels.js) — le gabarit mm de l'étiquette est dans views/labels.php ===== */
  #view-labels{padding-bottom:110px;}
  .lb-tabs{margin-bottom:14px;flex-wrap:wrap;}
  .lb-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px;}
  .lb-tools input{flex:1;min-width:200px;max-width:440px;padding:10px 14px;border:1px solid var(--line-2);border-radius:22px;font:inherit;background:var(--card);color:var(--ink);}
  .lb-card{max-width:none;padding:2px 18px;}
  .lb-row{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);}
  .lb-row:last-child{border-bottom:none;}
  .lb-row.on{background:linear-gradient(90deg,var(--accent-soft),transparent 70%);margin:0 -18px;padding-left:18px;padding-right:18px;}
  .lb-chk input{width:20px;height:20px;accent-color:var(--accent);cursor:pointer;}
  .lb-mini{width:calc(82mm * .42);height:calc(52mm * .42);overflow:hidden;flex:none;border-radius:3px;box-shadow:0 0 0 1px #000;background:#fff;}
  .lb-mini-in{width:82mm;height:52mm;transform:scale(.42);transform-origin:top left;}
  .lb-info{flex:1;min-width:0;}
  .lb-info b{font-size:14.5px;}
  .lb-sub{font-size:12px;color:var(--grey-1);margin-top:2px;overflow:hidden;text-overflow:ellipsis;}
  .lb-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;}
  .lb-tag{font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px;background:var(--accent-soft);color:var(--accent-dk);}
  .lb-tag.grey{background:var(--fill);color:var(--grey-1);}
  .lb-tag.warn{background:#fff4dc;color:#a86b00;}
  .lb-tag.blue{background:#e7f0ff;color:#2257c9;}
  .lb-tag.red{background:#fdecea;color:#c0392b;}
  .lb-inputs{display:flex;gap:10px;flex:none;}
  .lb-inputs label{display:flex;flex-direction:column;font-size:11px;font-weight:700;color:var(--grey-2);text-transform:uppercase;letter-spacing:.03em;gap:3px;}
  .lb-inputs span{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--grey-1);text-transform:none;letter-spacing:0;font-weight:600;}
  .lb-inputs input{width:66px;padding:7px 8px;border:1px solid var(--line-2);border-radius:8px;font:inherit;font-weight:700;color:var(--ink);background:var(--card);text-align:right;}
  .lb-price{font-weight:800;font-size:15px;flex:none;}
  .lb-acts{display:flex;gap:8px;flex:none;}
  .lb-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:40;width:min(760px,calc(100vw - 32px));display:flex;align-items:center;gap:10px;
    background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 14px 12px 18px;box-shadow:var(--shadow-lg);}
  .lb-bar.empty{display:none;}
  .lb-bar-sub{font-size:12.5px;color:var(--grey-1);}
  /* Tiroir « modifier » */
  .lbe-check{display:flex;gap:8px;align-items:center;font-weight:600;font-size:14px;margin:4px 0 14px;cursor:pointer;}
  .lbe-check input{width:auto;}
  .lbe-dim{opacity:.4;pointer-events:none;}
  .lb-prev{background:var(--fill);border-radius:14px;padding:16px;display:flex;justify-content:center;}
  .lb-prev .lbl{box-shadow:0 0 0 1px #000,0 4px 14px rgba(0,0,0,.12);}
  .lbe-size{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:14px;}
  .lbe-size b{flex:1;font-weight:600;}
  .lbe-warn{font-size:11.5px;color:#a86b00;font-weight:700;}
  .lbe-step{display:flex;align-items:center;border:1px solid var(--line-2);border-radius:20px;overflow:hidden;}
  .lbe-step button{width:36px;border:none;background:none;font:inherit;font-weight:800;color:var(--grey-1);padding:5px 0;cursor:pointer;}
  .lbe-step em{font-style:normal;font-weight:700;min-width:56px;text-align:center;border-left:1px solid var(--line-2);border-right:1px solid var(--line-2);padding:5px 0;}
  .lbe-auto{font:inherit;font-size:12px;font-weight:700;padding:4px 10px;border-radius:12px;border:1px solid var(--line-2);color:var(--grey-1);background:none;cursor:pointer;}
  .lbe-auto.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-dk);}
  /* Tiroir « aperçu avant impression » */
  .drw.lb-wide{width:min(1060px,96vw);}
  .lbp-wrap{display:flex;gap:26px;align-items:flex-start;}
  .lbp-side{width:250px;flex:none;}
  .lbp-slots{display:grid;grid-template-columns:1fr 1fr;gap:6px;width:150px;}
  .lbp-slots button{height:40px;border:2px solid var(--line-2);border-radius:6px;background:var(--card);font:inherit;font-weight:800;font-size:13px;color:var(--grey-1);cursor:pointer;}
  .lbp-slots .x{background:repeating-linear-gradient(-45deg,#eee 0 5px,#ddd 5px 10px);color:#999;text-decoration:line-through;}
  .lbp-slots .f{border-color:#000;color:#000;}
  .lbp-note{background:var(--fill);border-radius:12px;padding:11px 13px;font-size:13px;color:var(--grey-1);margin-top:14px;}
  .lbp-sheets{flex:1;display:flex;flex-wrap:wrap;gap:22px;min-width:0;}
  .lbp-pn{font-size:12px;font-weight:700;color:var(--grey-1);margin-bottom:6px;}
  .lbp-scale{width:calc(210mm * .5);height:calc(297mm * .5);overflow:hidden;box-shadow:0 2px 16px rgba(0,0,0,.16);}
  .lbp-scale .lb-sheet{transform:scale(.5);transform-origin:top left;}
  .lbp-scale .lb-slot[onclick]{cursor:pointer;}
  .lbp-scale .lb-slot[onclick]:hover{outline:3mm solid var(--accent);outline-offset:-3mm;}
  .lb-free,.lb-used{display:flex;align-items:center;justify-content:center;font:600 13pt Manrope,sans-serif;color:#b5b5b5;}
  .lb-free{background:repeating-linear-gradient(45deg,#fafafa 0 8px,#f2f2f2 8px 16px);}
  .lb-used{background:repeating-linear-gradient(-45deg,#eee 0 6px,#ddd 6px 12px);color:#999;}
  @media (max-width:760px){
    .lb-row{flex-wrap:wrap;gap:10px;}
    .lb-info{flex-basis:calc(100% - 190px);}
    .lb-inputs{margin-left:34px;}
    .lb-edit{margin-left:auto;}
    .lb-acts{width:100%;justify-content:flex-end;}
    .lb-bar{bottom:12px;padding:10px 12px;left:16px;transform:none;width:calc(100vw - 112px);}
    .lb-bar .lb-bar-sub{display:none;}
    .lb-bar #lb-go{padding-left:14px;padding-right:14px;}
    .lb-bar #lb-clear{display:none;}
    .lbp-wrap{flex-direction:column;}
    .lbp-side{width:100%;}
    .lbp-scale{width:calc(210mm * .4);height:calc(297mm * .4);}
    .lbp-scale .lb-sheet{transform:scale(.4);}
    .lb-prev{padding:10px;}
    .lb-prev .lbl{zoom:.86;}
  }
  .lb-tools .seg{margin:0;}
  .lb-tools input{height:44px;box-sizing:border-box;}