/* Styles des modules séparés (planning.js, …). N'utilise que les jetons définis dans index.html (--accent, --surface, --line, …),
   clair et sombre compris ; rien n'est redéfini. --c = couleur du chantier, posée sur l'élément par planning.js. */

/* Écran Planning : navigation */
.pl-nav{display:flex;align-items:center;gap:8px}
.pl-nav .pl-next svg{transform:scaleX(-1)}
.pl-titre{flex:1;min-width:0;min-height:52px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-family:var(--font-display);font-weight:700;font-size:17px;color:var(--fg);text-transform:capitalize;padding:4px 8px}
.pl-titre span{font-size:12px;font-weight:600;color:var(--accent-text);text-transform:none}

/* Semaine : grille horaire */
.pl-semaine{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.pl-grid-head{display:grid;grid-template-columns:34px repeat(7,1fr);border-bottom:1px solid var(--line)}
.pl-dh button{width:100%;min-height:54px;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:11px;color:var(--muted);font-weight:600;padding:4px 0}
.pl-dh button b{font-size:17px;color:var(--fg);font-family:var(--font-display);line-height:1.1;width:28px;height:28px;display:grid;place-items:center;border-radius:999px}
.pl-dh.auj button b{background:var(--accent);color:var(--accent-fg)}
.pl-grid{display:grid;grid-template-columns:34px repeat(7,1fr);position:relative;padding-bottom:14px}
.pl-heures{position:relative}
.pl-h{position:absolute;left:0;right:4px;transform:translateY(-6px);font-size:10px;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.pl-col{position:relative;border-left:1px solid var(--line)}
.pl-col.auj{background:color-mix(in srgb,var(--accent) 7%,transparent)}
.pl-col i{position:absolute;left:0;right:0;border-top:1px solid var(--line);opacity:.55}
.pl-ev{position:absolute;left:1px;right:1px;border-radius:6px;border:0;padding:3px 3px;background:var(--c);color:#FFFFFF;text-align:left;overflow:hidden;display:flex;flex-direction:column;gap:1px;font-size:10px;line-height:1.15;box-shadow:0 1px 2px rgb(0 0 0 / .18)}
.pl-ev .n{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-ev .t{font-variant-numeric:tabular-nums;opacity:.92;white-space:nowrap;overflow:hidden}
.pl-ev.prevu{background:color-mix(in srgb,var(--c) 16%,var(--surface));color:var(--fg);border:1.5px dashed var(--c);box-shadow:none}

/* Totaux de la période */
.pl-totals .tot.prevu{border-style:dashed}

/* Liste détaillée */
.pl-jour h3{font-family:var(--font-display);font-size:17px;margin:0 0 8px}
.pl-item{border-left:5px solid var(--c)}
.pl-item.prevu{border-left-style:dashed;background:color-mix(in srgb,var(--c) 6%,var(--surface))}
.pl-tag{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--accent-text);background:var(--accent-soft);border-radius:999px;padding:1px 7px;vertical-align:middle}
.pl-fiche{align-self:center;margin-right:10px;flex:none}

/* Mois */
.pl-mois{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px}
.pl-wd{display:grid;grid-template-columns:repeat(7,1fr);font-size:11px;font-weight:600;color:var(--muted);text-align:center;margin-bottom:4px}
.pl-cells{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.pl-cell{min-height:56px;border:1px solid transparent;border-radius:10px;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;padding:5px 2px;color:var(--fg)}
.pl-cell .d{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;width:26px;height:26px;display:grid;place-items:center;border-radius:999px}
.pl-cell.hors .d{color:var(--muted);opacity:.5}
.pl-cell.auj .d{background:var(--accent);color:var(--accent-fg)}
.pl-cell.sel{border-color:var(--accent);background:var(--accent-soft)}
.pl-cell .dots{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;max-width:100%}
.pl-cell .dots i{width:8px;height:8px;border-radius:999px;background:var(--c);display:block;box-sizing:border-box}
.pl-cell .dots i.prevu{background:transparent;border:2px solid var(--c)}
.pl-detail{display:flex;flex-direction:column;gap:10px}

/* Année */
.pl-annee{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pl-mini{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:8px 6px;display:flex;flex-direction:column;gap:6px;min-width:0}
.pl-mini-t{border:0;background:transparent;font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--accent-text);text-align:left;padding:0 2px;min-height:28px;text-transform:capitalize;display:flex;justify-content:space-between;align-items:center}
.pl-mini-t span{font-size:11px;font-weight:700;color:var(--muted);background:var(--sunken);border-radius:999px;padding:0 6px}
.pl-mini-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.pl-mini-g>*{aspect-ratio:1;border-radius:3px;border:0;padding:0;background:var(--sunken);min-width:0;box-sizing:border-box}
.pl-mini-g>span{background:transparent}
.pl-mini-g>button.fait{background:var(--c)}
.pl-mini-g>button.prevu{background:transparent;border:1.5px solid var(--c)}
.pl-mini-g>button.auj{outline:2px solid var(--accent);outline-offset:-1px}

/* Légende des chantiers */
.pl-legende{display:flex;gap:6px;flex-wrap:wrap}
.pl-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;color:var(--fg)}
.pl-chip i{width:10px;height:10px;border-radius:999px;background:var(--c);flex:none}

@media (max-width:380px){.pl-annee{grid-template-columns:repeat(2,1fr)}.pl-cell .d{font-size:14px}}
@media print{.pl-nav,.pl-modes,.pl-legende{display:none!important}}

/* Envoi par e-mail / WhatsApp (envoi.js) */
.en-canal{grid-template-columns:repeat(2,1fr)}
.en-canal label{display:block;position:relative}
.en-canal input{position:absolute;opacity:0;pointer-events:none}
.en-canal span{display:grid;place-items:center;min-height:44px;border-radius:8px;font-size:15px;font-weight:600;color:var(--muted)}
.en-canal input:checked+span{background:var(--accent);color:var(--accent-fg)}
.en-canal input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px}
.en-texte{min-height:180px;line-height:1.4}
.en-apercu{background:var(--sunken);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.en-apercu .kv:first-child{border-top:0;padding-top:0}
.en-apercu .kv b{text-align:right;overflow-wrap:anywhere;min-width:0}
.en-msg{white-space:pre-wrap;font-size:15px;border-top:1px solid var(--line);padding-top:10px;overflow-wrap:anywhere;max-height:260px;overflow-y:auto}
a.btn{text-align:center}

/* =====================================================================================================
   Accueil « Liquid Glass » minimaliste
   Un fond lumineux fixe (halos bleu / sarcelle / indigo + trame de points) passe derrière des panneaux de verre :
   en défilant, le flou et les reflets du verre restent visibles. Tout est limité à l'accueil (.hm, .hm-top, .app-bg).
   ===================================================================================================== */
.app-bg{position:fixed;inset:0 0 -20vh 0;z-index:0;overflow:hidden;pointer-events:none;background:var(--bg)}
.app-bg i{position:absolute;border-radius:50%;width:85vmax;height:85vmax;opacity:var(--orb-o,.55);will-change:transform}
.app-bg i:nth-child(1){left:-38vmax;top:-34vmax;background:radial-gradient(circle,color-mix(in srgb,var(--orb1,#3B6FE0) 60%,transparent) 0,transparent 62%);animation:hm-drift1 26s ease-in-out infinite alternate}
.app-bg i:nth-child(2){right:-42vmax;top:18vh;background:radial-gradient(circle,color-mix(in srgb,var(--orb2,#13908E) 55%,transparent) 0,transparent 60%);animation:hm-drift2 32s ease-in-out infinite alternate}
.app-bg i:nth-child(3){left:-20vmax;bottom:-48vmax;background:radial-gradient(circle,color-mix(in srgb,var(--orb3,#4F46E5) 45%,transparent) 0,transparent 60%);animation:hm-drift1 38s ease-in-out infinite alternate-reverse}
.app-bg::after{content:"";position:absolute;inset:0;background-image:radial-gradient(color-mix(in srgb,var(--fg) 9%,transparent) 1px,transparent 1.3px);background-size:22px 22px;
  -webkit-mask-image:linear-gradient(180deg,#000 0,transparent 75%);mask-image:linear-gradient(180deg,#000 0,transparent 75%)}
@keyframes hm-drift1{to{transform:translate(9vmax,7vmax) scale(1.08)}}
@keyframes hm-drift2{to{transform:translate(-8vmax,10vmax) scale(.94)}}
:root{--orb-o:.42}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--orb-o:.7}}
:root[data-theme="dark"]{--orb-o:.7}

/* Recette du verre de l'accueil : translucide, reflet oblique, liseré clair, ombre douce, flou de l'arrière-plan */
.hm-hero,.hm-tile,.hm .card,.hm .pending-card,.hm .filter,.hm .search,.hm .alerte,.hm .install,.hm .hm-empty,.hm .notice{
  background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),var(--glass-bg);
  border:1px solid var(--glass-border);border-radius:20px;
  box-shadow:inset 0 1px 0 var(--glass-hi),inset 0 -1px 1px var(--glass-edge),var(--glass-shadow);
  -webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%)}

/* En-tête en verre : le contenu défile dessous, flouté */
.hm-top{background:color-mix(in srgb,var(--surface) 50%,transparent);border-bottom:1px solid var(--glass-border);
  -webkit-backdrop-filter:blur(26px) saturate(190%);backdrop-filter:blur(26px) saturate(190%)}
body:has(.hm-top)::before{background:color-mix(in srgb,var(--surface) 50%,transparent);-webkit-backdrop-filter:blur(26px) saturate(190%);backdrop-filter:blur(26px) saturate(190%)}
.hm-top h1{font-size:28px;letter-spacing:-.01em}
.hm-top .sync{background:var(--glass-bg);border-color:var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-hi);min-height:30px;font-size:11px}

.hm{gap:14px;padding-bottom:40px}
.hm .section-head{align-items:center}
.hm .section-head h2{font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.hm .section-head .count{font-size:13px}

/* Bandeau de chiffres */
.hm-hero{padding:14px 16px 16px;display:flex;flex-direction:column;gap:10px;border-radius:24px}
.hm-hero .eyebrow{font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.hm-stats{display:grid;grid-template-columns:1fr 1fr 1.25fr}
.hm-stats>div{display:flex;flex-direction:column;gap:2px;padding:0 12px;min-width:0;border-left:1px solid color-mix(in srgb,var(--fg) 10%,transparent)}
.hm-stats>div:first-child{padding-left:0;border-left:0}
.hm-stats .v{font-family:var(--font-display);font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.01em;
  background:linear-gradient(180deg,var(--fg) 30%,color-mix(in srgb,var(--fg) 55%,var(--accent)));-webkit-background-clip:text;background-clip:text;color:transparent}
.hm-stats .v small{font-size:14px}
.hm-stats .main .v{background:linear-gradient(180deg,var(--accent-text),color-mix(in srgb,var(--accent-text) 60%,var(--supp-text)));-webkit-background-clip:text;background-clip:text}
.hm-stats .l{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

/* Tuiles d'action : icônes en verre teinté avec reflet spéculaire */
.hm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hm-tile{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 14px 13px;text-align:left;color:var(--fg);min-width:0;transition:transform .12s}
.hm-tile:active,.hm .card:active,.hm .pending-card:active{transform:scale(.975)}
.hm-tile .t{font-weight:700;font-size:15px;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.hm-tile .s{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.hm-tile .gi,.hm-add{--tint:var(--accent);position:relative;width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#FFFFFF;
  background:linear-gradient(160deg,color-mix(in srgb,var(--tint) 70%,#FFFFFF) 0,var(--tint) 55%,color-mix(in srgb,var(--tint) 80%,#000000) 100%);
  border:1px solid color-mix(in srgb,#FFFFFF 45%,var(--tint));
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .7),inset 0 -2px 4px rgb(0 0 0 / .18),0 6px 16px color-mix(in srgb,var(--tint) 45%,transparent);overflow:hidden}
.hm-tile .gi::after,.hm-add::after{content:"";position:absolute;left:3px;right:3px;top:2px;height:48%;border-radius:11px 11px 16px 16px;
  background:linear-gradient(180deg,rgb(255 255 255 / .55),rgb(255 255 255 / 0));pointer-events:none}
.hm-tile .gi svg,.hm-add svg{width:22px;height:22px;color:#FFFFFF;filter:drop-shadow(0 1px 1px rgb(0 0 0 / .25));position:relative;z-index:1}
.hm-tile.pl-entree .gi{--tint:var(--supp)}

/* Points importants : lignes rouges en verre, compactes */
.hm .alertes{gap:8px}
.hm .alertes .section-head h2{color:var(--danger)}
.hm-add{--tint:var(--danger);width:36px;height:36px;border-radius:12px;padding:0}
.hm-add svg{width:18px;height:18px}
.hm .alertes .list{gap:6px}
.hm .alerte{min-height:50px;border-radius:16px;
  background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--danger) 13%,var(--glass-bg));
  border-color:color-mix(in srgb,var(--danger) 40%,var(--glass-border))}
.hm .alerte.done{background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),var(--glass-bg);border-color:var(--glass-border);opacity:.75}
.hm .alerte .check{width:48px;border-right:0}
.hm .alerte .check span{width:24px;height:24px;border-radius:999px;border-width:2px}
.hm .alerte .check svg{width:14px;height:14px}
.hm .alerte .item-body{padding:8px 4px;gap:1px}
.hm .alerte .item-title{font-size:15px;font-weight:600}
.hm .alerte .where,.hm .alerte .item-desc{font-size:12px}
.hm .hm-del{width:36px;height:36px;margin-right:8px;color:var(--danger)}
.hm .hm-del svg{width:17px;height:17px;color:var(--danger)}
.hm .hm-del.armed{width:auto;padding:0 12px;font-size:13px;font-weight:700;background:var(--danger);color:#FFFFFF;border-color:var(--danger)}
.hm-empty{margin:0;padding:10px 14px;font-size:14px;color:var(--muted);border-radius:16px!important}

/* Listes en attente, bandeau d'installation, notices */
.hm .pending{gap:6px}
.hm .pending-card{padding:10px 14px;border-radius:16px;border-left:3px solid var(--warn)}
.hm .pending-card b{font-size:15px}
.hm .pending-card span{font-size:13px}
.hm .install{border-left:1px solid var(--glass-border);padding:12px 14px;font-size:14px}
.hm .install b{font-size:15px}
.hm .notice{padding:10px 14px;border-radius:16px}

/* Filtre et recherche */
.hm-list-head{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.hm .filter{border-radius:999px;padding:4px;gap:2px}
.hm .filter button{min-height:38px;border-radius:999px;font-size:14px}
.hm .filter button span{font-size:12px;opacity:.7;font-variant-numeric:tabular-nums;margin-left:2px}
.hm .filter button[aria-pressed="true"]{color:var(--accent-text);
  background:linear-gradient(180deg,var(--glass-gloss),transparent 70%),color-mix(in srgb,var(--accent) 16%,var(--glass-bg));
  box-shadow:inset 0 1px 0 var(--glass-hi),0 2px 8px color-mix(in srgb,var(--accent) 22%,transparent)}
.hm .search{min-height:44px;border-radius:999px;padding:0 18px;font-size:15px}

/* Cartes chantier compactes */
.hm .cards{gap:8px}
.hm .card{flex-direction:row;align-items:center;gap:12px;padding:12px 12px 12px 16px;border-radius:18px;transition:transform .12s}
.cd-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cd-top{display:flex;align-items:center;gap:8px;min-width:0}
.hm .card h2{font-size:17px;line-height:1.2;font-weight:700;margin:0;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm .card .badge{font-size:11px;padding:2px 8px}
.cd-sub,.cd-step{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-step{font-size:12px;color:color-mix(in srgb,var(--muted) 80%,var(--accent-text))}
.cd-ring{position:relative;flex:none;width:46px;height:46px;display:grid;place-items:center}
.cd-ring svg{position:absolute;inset:0;width:100%;height:100%}
.cd-ring circle{fill:none;stroke-width:4.5}
.cd-ring .trk{stroke:color-mix(in srgb,var(--fg) 10%,transparent)}
.cd-ring .val{stroke:var(--accent);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 70%,transparent));transition:stroke-dashoffset .4s}
.cd-ring b{position:relative;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.cd-ring b small{font-size:9px;font-weight:600}

/* Défilement : en-tête qui se densifie, halos en parallaxe, cartes qui apparaissent (navigateurs récents, sinon statique) */
@supports (animation-timeline: scroll()){
  .hm-top{animation:hm-top linear both;animation-timeline:scroll(root);animation-range:0 120px}
  @keyframes hm-top{from{box-shadow:none;border-bottom-color:transparent}to{box-shadow:0 8px 24px rgb(0 0 0 / .12);border-bottom-color:var(--glass-border)}}
  .app-bg{animation:hm-par linear both;animation-timeline:scroll(root)}
  @keyframes hm-par{to{translate:0 -14vh}}
}
@supports (animation-timeline: view()){
  .hm .card,.hm .pending-card,.hm .alerte{animation:hm-in linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  @keyframes hm-in{from{opacity:.45;transform:translateY(14px) scale(.975)}to{opacity:1;transform:none}}
}
@media (prefers-reduced-motion:reduce){.app-bg,.app-bg i,.hm-top,.hm .card,.hm .pending-card,.hm .alerte{animation:none!important}}
@media (max-width:370px){.hm-stats .v{font-size:20px}.hm-tile .t{font-size:14px}}
.cd-warn{color:var(--warn);font-weight:700}

/* =====================================================================================================
   Liquid Glass partout (v3.0) : même langage que l'accueil sur la fiche chantier, les listes d'achat,
   le planning, les paramètres et les formulaires. Le fond lumineux (.app-bg, dans index.html) est commun
   à tous les écrans ; chaque surface devient du verre translucide. Les couleurs de sens (rouge important,
   orange à prévoir, sarcelle suppléments) restent, en teinte de verre.
   ===================================================================================================== */

/* En-têtes de tous les écrans : verre flouté, se densifie au défilement */
.top{background:color-mix(in srgb,var(--surface) 50%,transparent);border-bottom:1px solid var(--glass-border);
  -webkit-backdrop-filter:blur(26px) saturate(190%);backdrop-filter:blur(26px) saturate(190%)}
body::before{background:color-mix(in srgb,var(--surface) 50%,transparent);-webkit-backdrop-filter:blur(26px) saturate(190%);backdrop-filter:blur(26px) saturate(190%)}
.top .sync{background:var(--glass-bg);border-color:var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-hi);min-height:30px;font-size:11px}
@supports (animation-timeline: scroll()){
  .top{animation:hm-top linear both;animation-timeline:scroll(root);animation-range:0 120px}
}

/* Recette du verre pour toutes les surfaces */
.hero-band,.panel,.reminder,.notes-card,.install,.filter,.search,.card,.pending-card,.item,.day,.mat,.contact,.tot,.lsec,.plan,
.alerte,.alerte-empty,.empty,.supp-zone,.pl-semaine,.pl-mois,.pl-mini,.pl-titre,.en-apercu,.lsec-edit{
  background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),var(--glass-bg);
  border-color:var(--glass-border);
  box-shadow:inset 0 1px 0 var(--glass-hi),inset 0 -1px 1px var(--glass-edge),var(--glass-shadow);
  -webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
.panel,.card,.item,.day,.mat,.contact,.lsec,.plan,.reminder,.notes-card,.install,.pending-card,.supp-zone{border-radius:18px}
.tot{border-radius:16px}
/* Les bords de couleur qui ont un sens sont conservés */
.reminder,.pending-card{border-left-color:var(--warn)}
.install{border-left-color:var(--accent)}
.pl-item{border-left-color:var(--c)}
.empty{border-style:dashed;box-shadow:none}

/* Bandeau du chantier : verre, texte foncé (clair) ou blanc (sombre), anneau et curseur lumineux */
.hero-band{--hero-fg:var(--fg);--hero-muted:var(--muted);--hero-track:color-mix(in srgb,var(--fg) 16%,transparent);--hero-chip:color-mix(in srgb,var(--fg) 7%,transparent);
  color:var(--fg);border:1px solid var(--glass-border);border-radius:24px}
.hero-band h2{font-size:25px}
.hero-band .eyebrow{font-weight:700;letter-spacing:.09em}
.hero-band .ring circle+circle{stroke:var(--accent);filter:drop-shadow(0 0 4px color-mix(in srgb,var(--accent) 65%,transparent))}
.hero-band .cursor{--c-fill:var(--accent);--c-thumb:var(--surface);--c-mark:color-mix(in srgb,var(--fg) 25%,transparent)}
.hero-band .cursor .fill{box-shadow:0 0 8px color-mix(in srgb,var(--accent) 60%,transparent)}
.hero-band .cursor .mark.on{background:#FFFFFF;opacity:.6}
.hs{background:color-mix(in srgb,var(--fg) 5%,transparent);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-hi)}
.hs .v{font-family:var(--font-display);
  background:linear-gradient(180deg,var(--fg) 30%,color-mix(in srgb,var(--fg) 55%,var(--accent)));-webkit-background-clip:text;background-clip:text;color:transparent}
.hs:first-child .v{background:linear-gradient(180deg,var(--accent-text),color-mix(in srgb,var(--accent-text) 60%,var(--supp-text)));-webkit-background-clip:text;background-clip:text}
.hs .l{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}

/* Boutons : verre clair ; actions principales en verre teinté (« liquide ») avec reflet */
.btn{background:linear-gradient(180deg,var(--glass-gloss),transparent 60%),var(--glass-bg);border-color:var(--glass-border);
  box-shadow:inset 0 1px 0 var(--glass-hi),inset 0 -1px 1px var(--glass-edge),var(--glass-shadow);
  -webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%);transition:transform .1s}
.btn:active{transform:scale(.98)}
.btn.primary,.btn.supp,.btn.rapport{--tint:var(--accent);color:#FFFFFF;
  background:linear-gradient(180deg,rgb(255 255 255 / .30),rgb(255 255 255 / 0) 55%),linear-gradient(160deg,color-mix(in srgb,var(--tint) 78%,#FFFFFF) 0,var(--tint) 55%,color-mix(in srgb,var(--tint) 82%,#000000) 100%);
  border-color:color-mix(in srgb,#FFFFFF 35%,var(--tint));
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .55),inset 0 -2px 4px rgb(0 0 0 / .16),0 6px 18px color-mix(in srgb,var(--tint) 38%,transparent)}
.btn.supp{--tint:var(--supp)}
.btn.rapport{--tint:color-mix(in srgb,var(--accent) 55%,#1B2C60)}
.btn.primary svg,.btn.supp svg,.btn.rapport svg{filter:drop-shadow(0 1px 1px rgb(0 0 0 / .25))}
.btn.danger-ghost{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 55%,var(--glass-border));
  background:linear-gradient(180deg,var(--glass-gloss),transparent 60%),color-mix(in srgb,var(--danger) 7%,var(--glass-bg))}
.btn.armed{background:var(--warn);border-color:var(--warn);color:#FFFFFF;box-shadow:0 6px 18px color-mix(in srgb,var(--warn) 40%,transparent)}
.btn.danger-ghost.armed{background:var(--danger);border-color:var(--danger);color:#FFFFFF;box-shadow:0 6px 18px color-mix(in srgb,var(--danger) 40%,transparent)}
.btn:disabled{opacity:.45}

/* Totaux des heures : le total principal en verre teinté */
.tot.main,.tot.equipe{--tint:var(--accent);color:#FFFFFF;
  background:linear-gradient(180deg,rgb(255 255 255 / .28),rgb(255 255 255 / 0) 55%),linear-gradient(160deg,color-mix(in srgb,var(--tint) 78%,#FFFFFF) 0,var(--tint) 55%,color-mix(in srgb,var(--tint) 82%,#000000) 100%);
  border-color:color-mix(in srgb,#FFFFFF 35%,var(--tint));box-shadow:inset 0 1px 0 rgb(255 255 255 / .5),0 6px 18px color-mix(in srgb,var(--tint) 35%,transparent)}
.tot.equipe{--tint:var(--supp)}
.tot .v{font-family:var(--font-display)}

/* Points importants de la fiche : verre rouge */
.alerte{background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--danger) 13%,var(--glass-bg));
  border-color:color-mix(in srgb,var(--danger) 40%,var(--glass-border));border-left-color:var(--danger)}
.alerte.done{background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),var(--glass-bg);border-left-color:var(--muted)}
.alerte-empty{background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--danger) 8%,var(--glass-bg))}

/* Zone des travaux complémentaires : verre sarcelle */
.supp-zone{border:1px solid color-mix(in srgb,var(--supp) 50%,var(--glass-border));
  background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--supp) 10%,var(--glass-bg))}

/* Petits éléments : pastilles, interrupteurs, segments, infos, sections des listes */
.chip,.day-head .who,.plan-badge{background:color-mix(in srgb,var(--fg) 6%,transparent);border-color:var(--glass-border)}
.toggle{background:linear-gradient(180deg,var(--glass-gloss),transparent 60%),var(--glass-bg);border-color:var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-hi)}
.seg{background:color-mix(in srgb,var(--fg) 5%,transparent);border-color:var(--glass-border);border-radius:12px}
.info{background:color-mix(in srgb,var(--surface) 40%,transparent);border-color:var(--glass-border);border-radius:14px;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.lsec header{background:color-mix(in srgb,var(--accent) 12%,transparent);border-bottom-color:var(--glass-border)}
.plan-thumb.pdf,.plan-thumb.missing{background:color-mix(in srgb,var(--fg) 5%,transparent)}
.check{border-right-color:var(--glass-border)}

/* Onglets : barre plus translucide, le fond lumineux transparaît */
.tabs{background:color-mix(in srgb,var(--bg) 55%,transparent);-webkit-backdrop-filter:blur(22px) saturate(190%);backdrop-filter:blur(22px) saturate(190%)}

/* Champs de saisie en verre */
.input{background:color-mix(in srgb,var(--surface) 55%,transparent);border-color:var(--glass-border);box-shadow:inset 0 1px 2px rgb(0 0 0 / .06)}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.lsec-edit .input,.lsec-edit .icon-btn,.ltitle .icon-btn{background:color-mix(in srgb,var(--surface) 65%,transparent)}

/* Volets (formulaires) : grand panneau de verre dépoli */
.backdrop{background:rgb(8 12 26 / .38);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.sheet{background:color-mix(in srgb,var(--surface) 74%,transparent);border:1px solid var(--glass-border);border-bottom:0;border-radius:26px 26px 0 0;
  box-shadow:inset 0 1px 0 var(--glass-hi),0 -12px 40px rgb(0 0 0 / .28);
  -webkit-backdrop-filter:blur(34px) saturate(190%);backdrop-filter:blur(34px) saturate(190%)}
.sheet-head,.sheet-foot{border-color:var(--glass-border)}
.sheet-head::before{content:"";position:absolute;left:50%;top:6px;width:38px;height:5px;margin-left:-19px;border-radius:999px;background:color-mix(in srgb,var(--fg) 22%,transparent)}
.sheet-head{position:relative;padding-top:18px}

/* Message bref (toast) en verre sombre */
.toast{background:color-mix(in srgb,var(--fg) 80%,transparent);-webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .18),0 8px 24px rgb(0 0 0 / .25)}

/* Apparition douce des éléments au défilement, partout */
@supports (animation-timeline: view()){
  main .item,main .day,main .contact,main .plan,main .lsec,main .mat,main .pl-item{animation:hm-in linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
}
@media (prefers-reduced-motion:reduce){.app-bg,.app-bg i,.top,main .item,main .day,main .contact,main .plan,main .lsec,main .mat,main .pl-item{animation:none!important}}

/* =====================================================================================================
   Annuaire des intervenants (annuaire.js) : tuile d'accueil, section de la fiche chantier, écran Annuaire.
   ===================================================================================================== */
.hm-tile.an-entree .gi{--tint:#0E7490}
/* Trois tuiles : la troisième occupe toute la largeur, en ligne ; avec quatre on retrouve la grille 2 × 2. */
.hm-actions>:nth-child(3):last-child{grid-column:1/-1;flex-direction:row;align-items:center;gap:12px}
.hm-actions>:nth-child(3):last-child .t{margin-top:0}
.hm-actions>:nth-child(3):last-child .gi+.t+.s{margin-left:auto;text-align:right}
.ann-actions{display:flex;gap:8px;margin-bottom:4px}
.ann-actions .btn{flex:1;min-width:0}
.ann-actions .btn svg{width:18px;height:18px;vertical-align:-4px;margin-right:4px}
.ann-metier{display:flex;align-items:center;gap:8px;margin:12px 0 6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.ann-metier span{font-size:11px;background:var(--sunken);border-radius:999px;padding:0 7px;font-variant-numeric:tabular-nums}
.ann-metier::after{content:"";flex:1;border-top:1px solid var(--line)}
.ann-fiche .ann-obs{font-style:italic}
.ann-fiche .chips{margin-top:4px}
.ann-mail{display:block;padding:4px 12px 2px;font-size:14px;color:var(--accent-text);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text}
.ann-unlink{align-self:flex-start;margin:6px 8px 0}
.ann .search{min-height:44px;border-radius:999px;padding:0 18px;font-size:15px;margin-bottom:8px}
.ann select.input{margin-bottom:8px}
.ann-filtres{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.ann-filtres::-webkit-scrollbar{display:none}
.ann-filtres button{flex:none;min-height:36px;padding:0 13px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-weight:600;font-size:13px}
.ann-filtres button[aria-pressed="true"]{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.ann-count{margin:4px 0 0;font-size:13px;color:var(--muted)}
.ann-bas{margin-top:14px}
.ann-choix{display:flex;flex-direction:column;gap:6px;max-height:42vh;overflow:auto;padding-right:2px}
.ann-choixl span{display:flex;flex-direction:column;gap:1px;min-width:0}
.ann-choixl small{font-size:12px;color:var(--muted);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ann-choixl.dbl{opacity:.75}
.ann-choixl .ann-dbl{color:var(--warn,#B45309)}

/* =====================================================================================================
   Comptes et synchronisation (sync.js) : connexion sur l'écran de code, panneau Équipe, interface par rôle.
   ===================================================================================================== */
.lock-id{width:100%;max-width:254px;min-height:46px;border-radius:14px;border:1px solid rgb(255 255 255 / .35);background:rgb(255 255 255 / .14);color:#FFFFFF;font-size:17px;text-align:center;padding:0 14px;margin-top:4px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lock-id::placeholder{color:rgb(255 255 255 / .6)}
.lock-id:focus{outline:2px solid rgb(255 255 255 / .6);outline-offset:1px}
.lock-id[hidden]{display:none}
.lock-link{margin-top:8px;border:0;background:transparent;color:rgb(255 255 255 / .82);font-size:14px;text-decoration:underline;min-height:40px;padding:0 12px}
.lock-link[hidden]{display:none}
.sy-panel h2 svg{width:20px;height:20px;vertical-align:-4px;margin-right:6px}
.sy-h3{font-size:15px;margin:14px 0 6px;font-family:var(--font-display)}
.sy-ok{color:#15803D}.sy-erreur,.sy-horsligne{color:#B45309}.sy-encours{color:var(--accent-text)}
:root[data-theme="dark"] .sy-ok{color:#4ADE80}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sy-ok{color:#4ADE80}}
/* Intérimaire : les commandes de gestion disparaissent (et le serveur les refuse de toute façon). */
body[data-role="interim"] [data-act="new-chantier"],body[data-role="interim"] [data-act="edit-chantier"],body[data-role="interim"] .del-chantier,
body[data-role="interim"] [data-act="add-etape"],body[data-role="interim"] .reorder,body[data-role="interim"] .tab.supp-tab,body[data-role="interim"] .supp-zone,
body[data-role="interim"] section.contacts,body[data-role="interim"] .en-entree,body[data-role="interim"] .an-entree,body[data-role="interim"] .hm-add,
body[data-role="interim"] [data-act="add-mat"],body[data-role="interim"] [data-act="add-outil"],body[data-role="interim"] [data-act="del-mat"],body[data-role="interim"] [data-act="del-outil"],body[data-role="interim"] .mat .seg,
body[data-role="interim"] [data-act="add-alerte"],body[data-role="interim"] [data-act="del-alerte"],body[data-role="interim"] label[for="plan-file"],
body[data-role="interim"] #settings-form,body[data-role="interim"] #rapport-form,body[data-role="interim"] .panel:has(#new-collegue),body[data-role="interim"] .panel:has([data-act="share-backup"]),
body[data-role="interim"] .panel:has(#import-file),body[data-role="interim"] .panel:has(#recup-code),body[data-role="interim"] .panel:has(#reset-btn),
body[data-role="interim"] .field:has(#f-qui),body[data-role="interim"] .field:has(#f-nouveau){display:none!important}

/* =====================================================================================================
   v3.3 — Icônes en verre teinté (clair comme sombre) et palette « Tendre » en option.
   Recette : fond translucide teinté qui laisse voir les halos (flou + saturation), reflet spéculaire en haut,
   liseré lumineux, ombre interne colorée en bas, glyphe de la couleur de la teinte (blanc lacté en sombre).
   ===================================================================================================== */
:root{--ig-milk:rgb(255 255 255 / .58);--ig-milk2:rgb(255 255 255 / .30);--ig-rim:rgb(255 255 255 / .92);--ig-spec:rgb(255 255 255 / .9);--ig-drop:rgb(18 25 38 / .10);--orb-o:.6}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ig-milk:rgb(255 255 255 / .18);--ig-milk2:rgb(255 255 255 / .07);--ig-rim:rgb(255 255 255 / .42);--ig-spec:rgb(255 255 255 / .5);--ig-drop:rgb(0 0 0 / .4);--orb-o:.7}}
:root[data-theme="dark"]{--ig-milk:rgb(255 255 255 / .18);--ig-milk2:rgb(255 255 255 / .07);--ig-rim:rgb(255 255 255 / .42);--ig-spec:rgb(255 255 255 / .5);--ig-drop:rgb(0 0 0 / .4);--orb-o:.7}

.hm-tile .gi,.hm-add,.tab .gi{position:relative;overflow:hidden;
  background:radial-gradient(130% 80% at 28% -10%,var(--ig-spec) 0,rgb(255 255 255 / 0) 60%),
    linear-gradient(160deg,color-mix(in srgb,var(--tint) 38%,var(--ig-milk)) 0,color-mix(in srgb,var(--tint) 22%,var(--ig-milk2)) 100%);
  border:1px solid color-mix(in srgb,var(--ig-rim) 75%,var(--tint));
  box-shadow:inset 0 1px 1px var(--ig-rim),inset 0 -8px 14px color-mix(in srgb,var(--tint) 32%,transparent),inset 1px 0 0 color-mix(in srgb,var(--ig-rim) 50%,transparent),
    0 8px 22px color-mix(in srgb,var(--tint) 30%,transparent),0 1px 2px var(--ig-drop);
  -webkit-backdrop-filter:blur(14px) saturate(180%);backdrop-filter:blur(14px) saturate(180%)}
.hm-tile .gi::after,.hm-add::after,.tab .gi::after{content:"";position:absolute;left:3px;right:3px;top:2px;height:46%;border-radius:11px 11px 16px 16px;
  background:linear-gradient(180deg,var(--ig-spec),rgb(255 255 255 / 0));pointer-events:none}
.hm-tile .gi svg,.hm-add svg,.tab svg{color:var(--tint-text,var(--accent-text));position:relative;z-index:1;
  filter:drop-shadow(0 1px 0 rgb(255 255 255 / .75)) drop-shadow(0 2px 5px color-mix(in srgb,var(--tint,var(--accent)) 40%,transparent))}
.hm-tile.pl-entree .gi{--tint-text:var(--supp-text)}
.hm-tile.an-entree .gi{--tint:#0E7490;--tint-text:#0B6B7F}
.hm-add{--tint-text:var(--danger)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .hm-tile .gi svg,:root:not([data-theme="light"]) .hm-add svg,:root:not([data-theme="light"]) .tab:not([aria-selected="true"]) svg{color:color-mix(in srgb,var(--tint,var(--accent)) 28%,#FFFFFF);filter:drop-shadow(0 1px 2px rgb(0 0 0 / .35))}}
:root[data-theme="dark"] .hm-tile .gi svg,:root[data-theme="dark"] .hm-add svg,:root[data-theme="dark"] .tab:not([aria-selected="true"]) svg{color:color-mix(in srgb,var(--tint,var(--accent)) 28%,#FFFFFF);filter:drop-shadow(0 1px 2px rgb(0 0 0 / .35))}
/* Boutons ronds des en-têtes : verre clair, presque transparent */
.icon-btn{background:radial-gradient(120% 90% at 30% -10%,var(--ig-spec) 0,rgb(255 255 255 / 0) 60%),var(--ig-milk2);border-color:var(--ig-rim);
  box-shadow:inset 0 1px 1px var(--ig-rim),inset 0 -6px 10px color-mix(in srgb,var(--accent) 12%,transparent),0 6px 16px var(--ig-drop);
  -webkit-backdrop-filter:blur(14px) saturate(180%);backdrop-filter:blur(14px) saturate(180%)}

/* Palette « Tendre » : lavande, sauge, ciel ; déclinée en clair et en sombre. */
:root[data-palette="tendre"]{
  --bg:#F5F3FA;--surface:#FFFFFF;--sunken:#F3F0F8;--fg:#2B2F42;--muted:#6E7290;--line:#E3E0EE;
  --accent:#6B7BD9;--accent-text:#4F5CBF;--accent-fg:#FFFFFF;--accent-soft:#ECEEFB;
  --hero:#4A569F;--supp:#5AA897;--supp-text:#3C8A7A;--supp-fg:#FFFFFF;--supp-soft:#E5F4EF;
  --ok:#4EA874;--ok-soft:#E7F6EE;--warn:#D49A3F;--warn-soft:#FFF5E7;--danger:#D46F6F;--danger-soft:#FBEDED;
  --orb1:#9AA6F2;--orb2:#8FD1C2;--orb3:#C3B5F0;--orb-o:.75}
@media (prefers-color-scheme:dark){:root[data-palette="tendre"]:not([data-theme="light"]){
  --bg:#161826;--surface:#1F2233;--sunken:#272A3D;--fg:#ECEBF6;--muted:#A5A8C4;--line:#353A52;
  --accent:#8B97E6;--accent-text:#B6BEF6;--accent-soft:#2A2F4F;--hero:#2E3466;
  --supp:#63B5A5;--supp-text:#93DACB;--supp-soft:#17312D;
  --ok:#6FCB95;--ok-soft:#14301F;--warn:#F0BA6C;--warn-soft:#2E2518;--danger:#F09090;--danger-soft:#3B1D1D;
  --orb1:#6F7BD6;--orb2:#4FA896;--orb3:#8F7BD9;--orb-o:.6}}
:root[data-palette="tendre"][data-theme="dark"]{
  --bg:#161826;--surface:#1F2233;--sunken:#272A3D;--fg:#ECEBF6;--muted:#A5A8C4;--line:#353A52;
  --accent:#8B97E6;--accent-text:#B6BEF6;--accent-soft:#2A2F4F;--hero:#2E3466;
  --supp:#63B5A5;--supp-text:#93DACB;--supp-soft:#17312D;
  --ok:#6FCB95;--ok-soft:#14301F;--warn:#F0BA6C;--warn-soft:#2E2518;--danger:#F09090;--danger-soft:#3B1D1D;
  --orb1:#6F7BD6;--orb2:#4FA896;--orb3:#8F7BD9;--orb-o:.6}
:root[data-palette="tendre"] .lock{background:radial-gradient(circle at 22% 8%,#7D8BE0 0,transparent 46%),radial-gradient(circle at 88% 92%,#6FB9A8 0,transparent 42%),#3F4786}
:root[data-palette="tendre"] .hm-tile.an-entree .gi{--tint:#5FA3B8;--tint-text:#3C7F93}
:root[data-palette="tendre"] .lock-ok{color:#3F4786}

/* =====================================================================================================
   v3.4 — Tâches par ouvrier : pastilles, barre d'avancement, vue « Mes tâches » de l'intérimaire, planning.
   ===================================================================================================== */
.tk-bar{display:block;height:5px;border-radius:999px;background:color-mix(in srgb,var(--fg) 10%,transparent);margin-top:6px;overflow:hidden}
.tk-bar i{display:block;height:100%;background:var(--accent);border-radius:999px;box-shadow:0 0 6px color-mix(in srgb,var(--accent) 60%,transparent)}
.chip.tk-pct{color:var(--accent-text);background:var(--accent-soft);border-color:transparent}
.chip.tk-bloq{color:#6D28D9;background:color-mix(in srgb,#6D28D9 14%,transparent);border-color:transparent}
.chip.tk-ouv{color:var(--fg);display:inline-flex;align-items:center;gap:4px}
.chip.tk-ouv svg{width:14px;height:14px;color:var(--accent-text)}
.chip.tk-mat{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.item.tk-mine{flex-direction:column;align-items:stretch}
.tk-row{display:flex;align-items:stretch}
.tk-seg{margin:0 10px 10px;grid-template-columns:repeat(5,1fr)}
.tk-seg button{font-size:13px;min-height:40px}
.tk-autres .item{opacity:.78}
.tk-autres .item-body{cursor:default}
.tk-choix{max-height:32vh;margin-bottom:8px}
.tk-range{width:100%;accent-color:var(--accent);margin-top:8px;height:32px}
.pl-item.tache{border-left-style:dotted}
.pl-item.tache.done .item-title{color:var(--muted)}

/* =====================================================================================================
   v3.5 — Pointage (pointage.js) : barre de la fiche, répartition par tâche, corrections, analyse des heures.
   ===================================================================================================== */
.pt-bar{border:1px solid var(--glass-border);border-radius:20px;padding:12px 14px 14px;margin-bottom:12px;
  background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),var(--glass-bg);box-shadow:inset 0 1px 0 var(--glass-hi),var(--glass-shadow);
  -webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%)}
.pt-bar.encours{border-color:color-mix(in srgb,var(--ok) 55%,var(--glass-border));background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--ok) 10%,var(--glass-bg))}
.pt-bar.pause{border-color:color-mix(in srgb,var(--warn) 55%,var(--glass-border));background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--warn) 9%,var(--glass-bg))}
.pt-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pt-head h2{margin:0;font-size:17px}
.pt-qui{width:auto;min-height:38px;padding:0 32px 0 12px;font-size:14px;border-radius:999px}
.pt-etat{margin:8px 0 10px;font-size:15px;color:var(--muted)}
.pt-etat b{color:var(--fg);font-variant-numeric:tabular-nums}
.pt-bar.encours .pt-etat b{color:var(--ok)}
.pt-actions{display:flex;gap:8px}
.pt-actions .btn{flex:1;min-width:0;min-height:50px;font-size:16px}
.pt-btn svg{width:18px;height:18px;vertical-align:-3px;margin-right:4px}
.hm-tile.pt-entree .gi{--tint:var(--ok)}
.hm-tile.pt-entree.pause .gi{--tint:var(--warn)}
.day .row.encours span:last-child{color:var(--ok);font-weight:700}
.day .row.rep .k{color:var(--muted);font-size:13px;padding-left:4px}
.pt-badge{background:var(--ok-soft);color:var(--ok);border-color:transparent}
.pt-corr{margin:0;padding:6px 12px 10px;font-size:12px;color:var(--warn)}
.pt-rep{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.pt-rep label{flex:1;min-width:0;font-size:14px;font-weight:500;overflow-wrap:anywhere}
.pt-rep .input{width:84px;flex:none;text-align:right}
.pt-histo{font-size:12px;line-height:1.5}
.totals.quatre{grid-template-columns:repeat(2,1fr)}
.tot.perdues .v{color:#6D28D9}
.pt-taches .item-desc{font-variant-numeric:tabular-nums}
body[data-role="interim"] .pt-qui{display:none}

/* =====================================================================================================
   v3.6 — Sécurité (securite.js) : EPI, accidents, registre.
   ===================================================================================================== */
.sec-section .section-head h2 svg{width:20px;height:20px;vertical-align:-4px;margin-right:6px;color:var(--ok)}
.sec-oblig{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--warn);background:var(--warn-soft);border-radius:999px;padding:1px 7px;vertical-align:middle}
.sec-ligne.ok{border-left:4px solid var(--ok)}
.sec-ligne.partiel{border-left:4px solid var(--warn)}
.sec-ligne.manque{border-left:4px solid var(--danger)}
.sec-ligne.manque .item-desc{color:var(--danger);font-weight:600}
.sec-vide{font-size:14px}
.sec-requis{margin-top:8px;text-align:left;white-space:normal;line-height:1.3;color:var(--muted)}
.sec-ouinon{grid-template-columns:1fr 1fr}
.sec-ouinon label{position:relative;display:block}
.sec-ouinon input{position:absolute;opacity:0;inset:0;margin:0}
.sec-ouinon span{display:grid;place-items:center;min-height:44px;border-radius:10px;font-weight:600;color:var(--muted)}
.sec-ouinon input:checked+span{background:var(--accent-soft);color:var(--accent-text)}
.sec-ouinon input[value="oui"]:checked+span{background:var(--danger-soft);color:var(--danger)}
.sec-acc-detail{border-left:3px solid var(--danger);padding-left:12px;margin:4px 0 8px}
.sec-texte{margin:8px 0;font-size:15px;white-space:pre-wrap;overflow-wrap:anywhere}
.sec-photo{display:block;max-width:100%;border-radius:14px;margin:8px 0;border:1px solid var(--line)}
.sec-acc-bandeau{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:12px 14px;border-radius:16px;margin-bottom:10px;font-size:15px;color:var(--danger);
  border:1px solid color-mix(in srgb,var(--danger) 50%,var(--glass-border));background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--danger) 14%,var(--glass-bg))}
.sec-acc-bandeau svg{width:22px;height:22px;flex:none}
.sec-acc-bandeau span:nth-child(2){flex:1;min-width:0;color:var(--fg)}
.sec-acc-bandeau .chev{font-weight:700}
.hm-tile.sec-acc-tile{grid-column:1/-1;flex-direction:row;align-items:center;gap:12px;border-color:color-mix(in srgb,var(--danger) 55%,var(--glass-border));
  background:linear-gradient(150deg,var(--glass-gloss) 0,transparent 38%),color-mix(in srgb,var(--danger) 14%,var(--glass-bg))}
.hm-tile.sec-acc-tile .gi{--tint:var(--danger);--tint-text:var(--danger)}
.hm-tile.sec-acc-tile .t{margin-top:0;color:var(--danger);flex:none;overflow:visible}
.hm-tile.sec-acc-tile .s{flex:1;min-width:0;white-space:normal;text-align:left;line-height:1.3}
.sec-eyebrow{margin:0 0 8px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;font-size:12px;color:var(--muted)}
.sec-panel h2 svg{width:20px;height:20px;vertical-align:-4px;margin-right:6px;color:var(--ok)}
.sec-oblig-btn{margin-right:8px;flex:none;min-height:36px;padding:0 10px;font-size:12px}
.sec-oblig-btn[aria-pressed="true"]{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 50%,var(--glass-border))}

/* =====================================================================================================
   v3.7 — Signalements (signalements.js).
   ===================================================================================================== */
.sg-section .section-head h2 svg,.sg-detail .sg-actions h2 svg{width:20px;height:20px;vertical-align:-4px;margin-right:6px;color:var(--warn)}
.chip.sg-prio.basse{color:var(--muted)}
.chip.sg-prio.normale{color:var(--accent-text);background:var(--accent-soft);border-color:transparent}
.chip.sg-prio.haute{color:var(--warn);background:var(--warn-soft);border-color:transparent}
.chip.sg-prio.urgente{color:#FFFFFF;background:var(--danger);border-color:transparent}
.chip.sg-statut{color:var(--fg)}
.chip.sg-statut.resolu,.chip.sg-statut.cloture{color:var(--ok);background:var(--ok-soft);border-color:transparent}
.chip.sg-statut.a_transmettre,.chip.sg-statut.attente{color:var(--warn);background:var(--warn-soft);border-color:transparent}
.chip.sg-relance{color:#FFFFFF;background:var(--warn);border-color:transparent}
.sg-item.urgente{border-left:4px solid var(--danger)}
.sg-item.haute{border-left:4px solid var(--warn)}
.sg-titre{font-size:21px;margin:4px 0 8px}
.sg-bandeau{margin:10px 0;padding:10px 12px;border-radius:12px;background:var(--warn-soft);color:var(--warn);font-weight:600;font-size:14px}
.sg-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.sg-photo{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:var(--sunken)}
.sg-groupe{margin:6px 0 2px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.sg-dest{max-height:38vh}
.sg-filtres{grid-template-columns:repeat(4,1fr);margin-bottom:10px}
.sg-filtres button{font-size:13px}
.sg-histo .item-title{font-weight:500;font-size:14px}
.sg-histo .sg-h-message,.sg-histo .sg-h-relance{color:var(--accent-text)}
.sg-histo .sg-h-reponse{color:var(--ok)}
.sg-histo .sg-h-statut{color:var(--muted)}
.sg-actions .btn{margin-bottom:8px}
.hm-tile.sg-entree .gi{--tint:var(--warn);--tint-text:var(--warn)}

/* =====================================================================================================
   v3.8 — Blocages (blocages.js) : violet, icône pause ; planning, fiche, coût des heures perdues.
   ===================================================================================================== */
.bl-section .section-head h2 svg,.bl-item .item-title svg{width:18px;height:18px;vertical-align:-3px;margin-right:6px;color:#6D28D9}
.bl-item{border-left:4px solid #6D28D9}
.bl-item.done{border-left-color:color-mix(in srgb,#6D28D9 45%,transparent)}
.bl-btns{display:flex;flex-direction:column;gap:6px;justify-content:center;padding:8px 10px 8px 0}
.bl-btns .btn{min-height:36px}
.bl-tache{border:1px solid var(--line);border-radius:12px;padding:8px 10px;margin-bottom:8px}
.bl-date label{font-size:13px;color:var(--muted)}
.bl-date .input{margin-top:4px}
.bl-btn{border-color:color-mix(in srgb,#6D28D9 50%,var(--glass-border));color:#6D28D9}
.bl-taux .item-title{font-variant-numeric:tabular-nums}
.tot .l.cout{display:block;margin-top:2px;font-size:11px;color:#6D28D9;text-transform:none;letter-spacing:0}
/* Planning : bandeau violet en tête de colonne (semaine), point et case violets (mois, année), ligne violette (listes) */
.pl-col{padding-top:0}
.pl-bloc{position:absolute;left:1px;right:1px;top:1px;height:18px;border:0;border-radius:5px;background:var(--c);color:#FFFFFF;display:grid;place-items:center;padding:0;z-index:2;box-shadow:0 1px 2px rgb(0 0 0 / .2)}
.pl-bloc svg{width:12px;height:12px}
.pl-bloc.resolu{opacity:.55}
.pl-cell .dots i.blocage{background:var(--c);border-radius:3px}
.pl-mini-g>button.blocage{background:var(--c)}
.pl-item.blocage{border-left-style:solid}
.pl-item.blocage .item-title svg{width:16px;height:16px;vertical-align:-3px;margin-right:4px;color:#6D28D9}
.pl-tag-bloc{color:#FFFFFF;background:#6D28D9}
.pl-chip-bloc i{background:#6D28D9}

/* =====================================================================================================
   v3.9 — Rapports de période (rapports.js).
   ===================================================================================================== */
.rp-entree svg{width:18px;height:18px;vertical-align:-4px;margin-right:6px}
.hm-tile.rp-tuile .gi{--tint:#475569;--tint-text:#334155}
.rp-types{grid-template-columns:repeat(3,1fr)}
.rp-types label{position:relative;display:block}
.rp-types input{position:absolute;opacity:0;inset:0;margin:0}
.rp-types span{display:grid;place-items:center;min-height:44px;border-radius:10px;font-weight:600;color:var(--muted);font-size:14px}
.rp-types input:checked+span{background:var(--accent-soft);color:var(--accent-text)}
.rp-acc{color:var(--danger)}

/* =====================================================================================================
   v3.10 — Matériel : quantités, ruptures, mouvements (materiel.js).
   ===================================================================================================== */
.mat-q .chip{font-weight:500}
.chip.mat-manq{color:var(--warn);background:var(--warn-soft);border-color:transparent;font-weight:700}
.chip.mat-rupt{color:var(--danger);background:var(--danger-soft);border-color:transparent;font-weight:700}
.mat.rupture{border-left:4px solid var(--danger)}
.mat-actions{display:flex;align-items:center;gap:8px;padding:0 10px 10px}
.mat-actions .btn{min-height:36px}
.mat-histo{margin-left:auto;font-size:12px;color:var(--muted)}
.mat-outils{margin:8px 0 10px}
.mat-manq-txt{color:var(--warn)}

/* =====================================================================================================
   v3.11 — Mode gros chantier (gros.js) et rentabilité optionnelle (rentabilite.js).
   ===================================================================================================== */
.gr-section .section-head h2 svg,.rt-section .section-head h2 svg{width:20px;height:20px;vertical-align:-4px;margin-right:6px;color:var(--accent-text)}
.gr-kpi{margin-bottom:8px}
.gr-chips{margin-bottom:10px}
.gr-chips button.chip{cursor:pointer}
.gr-chef{font-size:12px;font-weight:600;color:var(--muted)}
.gr-equipe .chips{margin-top:4px}
.chip.gr-present{color:var(--ok);background:var(--ok-soft);border-color:transparent;font-weight:700}
.rt-section .section-head h2 .opt{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-left:6px}
.rt-kpi{margin-bottom:8px}
.tot.pos .v{color:var(--ok)}
.tot.neg .v{color:var(--danger)}
.tot.warn .v{color:var(--warn)}
.rt-alerte{margin:8px 0;padding:8px 12px;border-radius:12px;background:var(--warn-soft);color:var(--warn);font-weight:600;font-size:14px}

/* =====================================================================================================
   v3.12 — Assistant IA (ia.js) : tuile, écran de dialogue, import photo / dictée, reformulation.
   ===================================================================================================== */
.ia-entree{--tint:#7C3AED}
.ia-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.ia-btn svg,.ia-entree svg,.ia-settings h2 svg,.ia-prop svg{width:18px;height:18px;flex:none}
.ia-entree{margin-top:8px}
.ia .panel{margin-bottom:12px}
.ia-dictee{position:relative}
.ia-dictee textarea{padding-right:52px;width:100%}
.ia-mic{position:absolute;right:8px;top:8px;width:36px;height:36px}
.ia-mic svg{width:18px;height:18px}
.ia-mic.on{background:var(--danger);color:#fff;animation:ia-pulse 1.2s ease-in-out infinite}
@keyframes ia-pulse{0%,100%{box-shadow:0 0 0 0 rgb(220 38 38 / .45)}50%{box-shadow:0 0 0 8px rgb(220 38 38 / 0)}}
.ia-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:8px 0}
.ia-quota{margin-right:auto;font-size:12px;color:var(--muted)}
.ia-msg{display:flex;gap:10px;margin:0 0 10px;padding:12px 14px;border-radius:18px;background:var(--surface);border:1px solid var(--glass-border)}
.ia-msg p{margin:0;white-space:pre-wrap;word-break:break-word;line-height:1.45}
.ia-msg.q{margin-left:28px;background:var(--accent-soft, color-mix(in srgb,var(--accent) 12%,var(--surface)));font-weight:600}
.ia-msg.r{margin-right:16px}
.ia-msg.r>svg{width:22px;height:22px;flex:none;color:#7C3AED;margin-top:2px}
.ia-msg.r>div{min-width:0;flex:1}
.ia-msg.pending p{color:var(--muted)}
.ia-msg.err{background:var(--danger-soft);color:var(--danger);font-weight:600}
.ia-props{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ia-props .btn{min-height:38px}
.ia-props small{flex-basis:100%;color:var(--muted);font-size:12px}
.ia-photo{margin-bottom:12px}
.ia-photo .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.ia-photo .btn svg{width:18px;height:18px}
.ia-photo-apercu{display:flex;align-items:center;gap:10px;margin-top:8px;padding:8px;border-radius:14px;background:var(--surface);border:1px solid var(--glass-border)}
.ia-photo-apercu img{width:56px;height:56px;object-fit:cover;border-radius:10px;background:#fff}
.ia-photo-apercu span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.ia-reform{margin:4px 0 10px}
.ia-reform-apercu{margin-top:10px;padding:12px;border-radius:14px;background:var(--surface);border:1px dashed var(--glass-border)}
.ia-reform-apercu .lbl{display:block;margin-bottom:6px}
.ia-prop-texte{white-space:pre-wrap;margin:0 0 10px;line-height:1.45}
.ia-settings .kv b{word-break:break-word}
body[data-role="interim"] .ia-barre,body[data-role="interim"] .ia-entree,body[data-role="interim"] [data-ia-import],body[data-role="interim"] .ia-reform{display:none !important}
.ia-cap ul{margin:6px 0 10px;padding-left:18px}
.ia-cap li{margin:0 0 6px;line-height:1.4}
.ia-code .ia-dictee input{width:100%}

/* v3.16 — Assistant IA : barre pleine largeur en tête de l'accueil (sous « Mes chantiers », avant la carte du jour). */
.ia-barre{display:flex;align-items:center;gap:12px;width:100%;margin:0 0 12px;padding:12px 14px;border-radius:20px;border:1px solid rgb(255 255 255 / .3);
  background:linear-gradient(135deg,#6D28D9 0%,#4F46E5 55%,#0E7490 100%);color:#FFFFFF;text-align:left;position:relative;overflow:hidden;cursor:pointer;
  box-shadow:0 12px 26px -14px rgb(79 70 229 / .65),inset 0 1px 0 rgb(255 255 255 / .35);transition:transform .12s}
.ia-barre::before{content:"";position:absolute;inset:0;background:radial-gradient(140px 70px at 88% 0%,rgb(255 255 255 / .28),transparent 70%),radial-gradient(90px 50px at 10% 110%,rgb(255 255 255 / .12),transparent 70%);pointer-events:none}
.ia-barre:active{transform:scale(.985)}
.ia-barre .gi{width:42px;height:42px;border-radius:14px;flex:none;display:grid;place-items:center;background:rgb(255 255 255 / .18);box-shadow:inset 0 1px 0 rgb(255 255 255 / .45),0 2px 6px rgb(0 0 0 / .15);position:relative}
.ia-barre .gi svg{width:22px;height:22px;color:#FFFFFF;filter:drop-shadow(0 1px 1px rgb(0 0 0 / .25))}
.ia-barre .tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;position:relative}
.ia-barre .t{font-weight:700;font-size:16px;letter-spacing:-.01em}
.ia-barre .s{font-size:12px;opacity:.88;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ia-barre .chev{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgb(255 255 255 / .14);position:relative}
.ia-barre .chev svg{width:18px;height:18px;opacity:.9}
html[data-palette="tendre"] .ia-barre{background:linear-gradient(135deg,#6B7BD9 0%,#5AA897 100%);box-shadow:0 12px 26px -14px rgb(107 123 217 / .6),inset 0 1px 0 rgb(255 255 255 / .35)}
/* Le passage sans compte est un vrai bouton, pas une petite ligne : aucune équipe n'est obligatoire. */
#lock-local{display:block;width:100%;min-height:50px;margin-top:12px;border:1px solid rgb(255 255 255 / .55);border-radius:999px;background:rgb(255 255 255 / .14);color:#FFFFFF;font-weight:700;text-decoration:none}
#lock-local[hidden]{display:none}