/* ============================================================
   PYROLIS — component styles v2 (scope, filtres, carte,
   assignation, tâches, catalogue, admin)
   ============================================================ */

/* ---------- Personnes / agences / équipes / congés (round 10) ---------- */
.profile-hero { display: flex; align-items: center; gap: 18px; margin-bottom: 14px; }
.profile-hero > .av { flex: none; }
.profile-hero-main { flex: 1; min-width: 200px; }
.profile-hero-main h1 { line-height: 1.15; }
.profile-hero-meta { display: flex; gap: 18px; margin-top: 10px; flex-wrap: wrap; font-size: 13px; color: var(--ink-2); }
.profile-hero-meta a { color: var(--ink-2); }
.profile-hero-meta a:hover { color: var(--fire); }
.profile-hero-actions { display: flex; gap: 8px; align-items: center; }
@media (max-width: 760px) { .profile-hero { flex-wrap: wrap; } .profile-hero-actions { width: 100%; } .profile-hero-actions .btn { flex: 1; } }
/* monthly charge chart */
.mch { display: flex; align-items: flex-end; gap: 6px; height: 130px; padding: 4px 0 0; }
.mch-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; }
.mch-bar-wrap { flex: 1; width: 100%; max-width: 26px; display: flex; align-items: flex-end; background: var(--surface-2); border-radius: 4px 4px 0 0; overflow: hidden; }
.mch-bar { width: 100%; border-radius: 4px 4px 0 0; min-height: 3px; transition: height .3s; }
.mch-lbl { font-size: 10.5px; color: var(--ink-3); }
.mch-col.now .mch-lbl { color: var(--ink); font-weight: 700; }
.mch-col.now .mch-bar-wrap { box-shadow: inset 0 -2px 0 var(--ink-2); }
/* year calendar */
.ycal { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ycal-mo-h { font-size: 12px; font-weight: 700; text-transform: capitalize; margin-bottom: 6px; color: var(--ink); }
.ycal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.ycal-dow { font-size: 8.5px; color: var(--ink-3); text-align: center; }
.ycal-d { font-size: 9.5px; text-align: center; padding: 2px 0; border-radius: 3px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.ycal-d.empty { visibility: hidden; }
.ycal-d.today { outline: 1.5px solid var(--fire); color: var(--fire); font-weight: 700; }
.ycal-d.has { color: #fff; font-weight: 600; }
.ycal-d.has.leave { background: var(--st-teal); } .ycal-d.has.training { background: var(--st-blue); } .ycal-d.has.sick { background: var(--st-red); }
.ycal-d.has.pending { background: var(--st-amber); }
@media (max-width: 900px) { .ycal { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .ycal { grid-template-columns: repeat(2, 1fr); } .kanban { grid-template-columns: 1fr; } .mcal-cell { min-height: 60px; } }
/* kanban */
.kanban { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; align-items: start; }
.kcol { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-3); min-height: 120px; transition: background .12s, border-color .12s; }
.kcol.over { background: var(--fire-soft); border-color: var(--fire); }
.kcol-h { display: flex; align-items: center; gap: 8px; padding: 11px 14px; font-size: 12.5px; font-weight: 600; border-bottom: 1px solid var(--line); }
.kdot { width: 8px; height: 8px; border-radius: 50%; }
.kdot.todo { background: var(--ink-3); } .kdot.doing { background: var(--st-blue); } .kdot.done { background: var(--st-teal); }
.kcount { margin-left: auto; font-size: 11px; color: var(--ink-3); background: var(--surface); border-radius: 10px; padding: 1px 7px; }
.kcol-body { padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.kcard { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); padding: 10px 11px; cursor: grab; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.kcard:hover { border-color: var(--line-strong); }
.kcard:active { cursor: grabbing; }
.kcard .mcal-grip { color: var(--ink-3); cursor: grab; }
.kadd { border: 1px dashed var(--line-strong); background: none; border-radius: var(--r-2); padding: 9px; font: inherit; font-size: 12.5px; color: var(--ink-3); cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 5px; }
.kadd:hover { color: var(--fire); border-color: var(--fire); }
.kempty { text-align: center; font-size: 12px; color: var(--ink-3); padding: 16px 8px; }
/* month calendar */
.mcal-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.mcal-nav { width: 30px; height: 30px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); cursor: pointer; display: grid; place-items: center; color: var(--ink-2); }
.mcal-nav:hover { border-color: var(--fire); color: var(--fire); }
.mcal-today { margin-left: auto; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 5px 11px; font: inherit; font-size: 12px; cursor: pointer; color: var(--ink-2); }
.mcal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.mcal-dow { margin-bottom: 4px; }
.mcal-dowc { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); text-align: center; padding: 2px 0; }
.mcal-cell { min-height: 78px; border: 1px solid var(--line); border-radius: var(--r-2); padding: 5px 6px; background: var(--surface); }
.mcal-cell.empty { border: none; background: none; }
.mcal-cell.we { background: var(--surface-2); }
.mcal-cell.today { border-color: var(--fire); box-shadow: inset 0 0 0 1px var(--fire); }
.mcal-num { font-size: 11.5px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.mcal-cell.today .mcal-num { color: var(--fire); font-weight: 700; }
.mcal-evs { display: flex; flex-direction: column; gap: 3px; margin-top: 4px; }
.mcal-ev { font-size: 10px; color: #fff; border-radius: 4px; padding: 2px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mcal-ev.leave { background: var(--st-teal); } .mcal-ev.training { background: var(--st-blue); } .mcal-ev.sick { background: var(--st-red); }
.mcal-ev.pending { background: repeating-linear-gradient(45deg, var(--st-amber), var(--st-amber) 5px, oklch(0.62 0.12 70) 5px, oklch(0.62 0.12 70) 10px); }
.mcal-more { font-size: 10px; color: var(--ink-3); padding-left: 3px; }
@media (max-width: 560px) { .kanban { grid-template-columns: 1fr; } .mcal-cell { min-height: 60px; } }
.load-track { flex: 1; height: 8px; background: var(--surface-3); border-radius: 20px; overflow: hidden; }
.load-track i { display: block; height: 100%; border-radius: 20px; }
.linklike { border: none; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.linklike:hover { color: var(--fire); }
.reg-foot .dot { width: 9px; height: 9px; border-radius: 3px; display: inline-block; }
.reg-foot .dot.leave { background: var(--st-teal); }
.reg-foot .dot.training { background: var(--st-blue); }
.reg-foot .dot.sick { background: var(--st-red); }
.reg-foot .dot.pending { background: var(--st-amber); }

/* ---------- Bande de mois / obligations (round 12) ---------- */
.mstrip { display: inline-flex; gap: 2px; flex-wrap: wrap; max-width: 100%; }
.mstrip-c { position: relative; border: 1px solid var(--line); background: var(--surface); border-radius: 4px; font: inherit; cursor: pointer; color: var(--ink-3); padding: 0; }
.mstrip.md .mstrip-c { width: 26px; height: 26px; font-size: 11px; font-weight: 600; }
.mstrip.sm .mstrip-c { width: 17px; height: 19px; font-size: 9.5px; font-weight: 700; display: grid; place-items: center; }
.mstrip.sm { gap: 1px; }
.sc-more { border: 1px solid var(--line-strong); background: var(--surface-2); border-radius: 20px; padding: 1px 7px; font: inherit; font-size: 10.5px; font-weight: 700; color: var(--ink-2); cursor: pointer; }
.sc-more:hover { border-color: var(--fire); color: var(--fire); }
.sc-pop { position: absolute; z-index: 40; margin-top: 4px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-2); box-shadow: 0 6px 20px rgba(0,0,0,.14); padding: 8px 10px; font-size: 12px; max-height: 220px; overflow-y: auto; min-width: 180px; }
.sc-pop > div { padding: 3px 0; white-space: nowrap; }
.ct-filters { display: flex; align-items: flex-start; gap: 14px; padding: 12px 14px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.ct-filters .ct-search { flex: 0 0 260px; max-width: 100%; min-width: 0; order: 0; }
.ct-roles { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; min-width: 0; }
@media (max-width: 720px) { .ct-filters .ct-search { flex-basis: 100%; } }
.ct-siteopt { display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 12.5px; cursor: pointer; }
.mstrip.ro .mstrip-c { cursor: default; }
.mstrip-c:hover:not(:disabled) { border-color: var(--fire); color: var(--fire); }
.mstrip-c.on { background: var(--st-blue); border-color: var(--st-blue); color: #fff; }
.mstrip-tick { width: 3px; height: 3px; border-radius: 50%; background: var(--line-strong); display: block; }
/* Suivi compact : 12 colonnes */
.pg12 { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; padding: 16px; }
.pg12-c { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; height: 104px; padding: 6px 2px 5px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface-2); font: inherit; cursor: pointer; overflow: hidden; }
.pg12-c:hover { border-color: var(--ink-2); }
.pg12-c.now { box-shadow: inset 0 -2px 0 var(--ink-2); }
.pg12-fill { position: absolute; left: 0; right: 0; bottom: 0; background: var(--line-strong); transition: height .3s; }
.pg12-c.t-done .pg12-fill { background: var(--st-green-bg, oklch(0.93 0.05 150)); }
.pg12-c.t-now .pg12-fill { background: var(--fire-soft); }
.pg12-c.t-late .pg12-fill { background: var(--st-red-bg, oklch(0.94 0.04 25)); }
.pg12-c.t-todo .pg12-fill { background: oklch(0.94 0.03 250); }
.pg12-c.t-none { background: none; border-style: dashed; }
.pg12-val { position: relative; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink); }
.pg12-c.t-none .pg12-val { color: var(--ink-3); font-weight: 400; }
.pg12-c.t-done .pg12-val { color: var(--st-green); }
.pg12-c.t-late .pg12-val { color: var(--st-red); }
.pg12-mo { position: relative; font-size: 10px; color: var(--ink-3); }
.pg12-c.now .pg12-mo { color: var(--ink); font-weight: 700; }
.pg12-badge { position: absolute; top: 4px; right: 4px; min-width: 15px; height: 15px; border-radius: 20px; background: var(--st-red); color: #fff; font-size: 9.5px; font-weight: 700; display: grid; place-items: center; padding: 0 3px; }
@media (max-width: 900px) { .pg12 { grid-template-columns: repeat(6, 1fr); } }
.mstrip-c.now { box-shadow: inset 0 -2px 0 var(--ink-2); }
.mhead-row i.past { opacity: .45; }
.mhead-row i.mfilter { cursor: pointer; border-radius: 3px; }
.mhead-row i.mfilter:hover { color: var(--fire); background: var(--fire-soft); }
.mhead-row i.mon { color: #fff; background: var(--ink-2); opacity: 1; font-weight: 700; }
.mfilter-bar { display: flex; align-items: center; gap: 8px; padding: 9px 14px; margin-bottom: 10px; background: var(--fire-soft); border: 1px solid var(--fire); border-radius: var(--r-2); font-size: 12.5px; color: var(--fire-deep); }
.mfilter-bar button { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; border: none; background: none; font: inherit; font-size: 12px; color: var(--fire-deep); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.mstrip-c.st-done { background: var(--st-green); border-color: var(--st-green); }
.mstrip-c.st-late { background: var(--st-red); border-color: var(--st-red); }
.mstrip-c.st-todo { background: var(--st-blue); border-color: var(--st-blue); }
.mstrip-badge { display: none; }
.prog-pill { display: inline-flex; align-items: center; gap: 3px; font-size: 9.5px; font-weight: 700; letter-spacing: .04em; border-radius: 20px; padding: 2px 6px; flex: none; background: var(--surface-3); color: var(--ink-3); }
.prog-pill.own { background: var(--st-blue); color: #fff; }
.eqhead { border-bottom: 1px solid var(--line); }
.eqhead-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 16px 12px; flex-wrap: wrap; }
.eqhead-prog { padding: 0 16px 14px; }
.eqhead-lbl { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); }
.eqhead-months { display: flex; gap: 3px; flex-wrap: wrap; }
.eqhead-progrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.eqhead-progrow .eqhead-lbl { width: 62px; flex: none; }
.prog-meta { display: inline-flex; align-items: center; gap: 0; font-size: 12px; color: var(--ink-2); white-space: nowrap; }
.prog-meta b { font-weight: 700; color: var(--ink); }
.prog-meta i { width: 3px; height: 3px; border-radius: 50%; background: var(--line-strong); display: inline-block; margin: 0 8px; }
/* ---------- Cycle de vie équipement + photos ---------- */
.lc { padding-top: 4px; }
.lc-track { position: relative; height: 26px; margin: 26px 12px 0; background: var(--surface-3); border-radius: 20px; }
.lc-elapsed { position: absolute; top: 0; bottom: 0; left: 0; background: var(--st-teal-bg, oklch(0.93 0.05 175)); border-radius: 20px; }
.lc-tick { position: absolute; top: 50%; width: 2px; height: 7px; margin-top: -3.5px; background: var(--line-strong); transform: translateX(-1px); }
.lc-tick.done { background: var(--st-teal); }
.lc-due { position: absolute; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--st-blue); border: 2px solid var(--surface); transform: translateX(-4px); z-index: 3; }
.lc-now { position: absolute; top: -8px; bottom: -8px; width: 2px; background: var(--fire); transform: translateX(-1px); z-index: 4; }
.lc-now i { position: absolute; top: -16px; left: 50%; transform: translateX(-50%); font-size: 9px; font-weight: 700; color: var(--fire); }
.lc-now i::after { content: "AUJ."; }
.lc-evt { position: absolute; top: 50%; transform: translate(-50%, -50%); z-index: 5; }
.lc-evt i { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); border: 2px solid var(--line-strong); color: var(--ink-2); }
.lc-evt.past i { border-color: var(--st-teal); color: var(--st-teal); }
.lc-evt.soon i { border-color: var(--st-amber); color: var(--st-amber); background: var(--st-amber-bg); }
.lc-evt.late i { border-color: var(--st-red); color: var(--st-red); background: var(--st-red-bg); }
.lc-scale { position: relative; height: 16px; margin: 6px 12px 0; }
.lc-scale span { position: absolute; transform: translateX(-50%); font-size: 10.5px; color: var(--ink-3); }
.lc-legend { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 16px; }
.lc-item { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; }
.lc-item-ic { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--surface-2); color: var(--ink-3); }
.lc-item.past .lc-item-ic { background: var(--st-teal-bg, oklch(0.93 0.05 175)); color: var(--st-teal); }
.lc-item.soon .lc-item-ic { background: var(--st-amber-bg); color: var(--st-amber); }
.lc-item.late .lc-item-ic { background: var(--st-red-bg); color: var(--st-red); }
.lc-next { display: flex; align-items: flex-start; gap: 9px; margin-top: 14px; padding: 9px 11px; background: var(--st-amber-bg); border: 1px solid var(--st-amber); border-radius: var(--r-2); font-size: 12px; line-height: 1.5; color: var(--st-amber); }
.lc-next.late { background: var(--st-red-bg); border-color: var(--st-red); color: var(--st-red); }
.lc-next > span { flex: 1; }
.ph-cell { position: relative; }
.ph-cell:hover .ph-del { opacity: 1; }
.ph-del { position: absolute; top: 5px; right: 5px; width: 20px; height: 20px; border: none; border-radius: 50%; background: rgba(0,0,0,.6); color: #fff; cursor: pointer; display: grid; place-items: center; opacity: 0; transition: opacity .12s; }
.ph-del:hover { background: var(--st-red); }
.ph-meta { font-size: 10.5px; color: var(--ink-3); margin-top: 4px; }
.ph-add { aspect-ratio: 4/3; border: 1px dashed var(--line-strong); border-radius: var(--r-2); background: none; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font: inherit; font-size: 11.5px; color: var(--ink-3); }
.ph-add:hover { border-color: var(--fire); color: var(--fire); }
.ph-empty { width: 100%; border: 1px dashed var(--line-strong); border-radius: var(--r-2); background: none; padding: 20px; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 7px; font: inherit; font-size: 12.5px; color: var(--ink-3); }
.ph-empty:hover { border-color: var(--fire); color: var(--fire); }
.card-sub { display: block; font-size: 11.5px; font-weight: 400; color: var(--ink-3); margin-top: 3px; line-height: 1.4; }
.mhead { display: flex; flex-direction: column; gap: 4px; }
.mhead-lbl { font-size: 10.5px; }
.mhead-row { display: inline-flex; gap: 1px; }
.mhead-row i { width: 17px; text-align: center; font-style: normal; font-size: 9px; font-weight: 700; color: var(--ink-3); letter-spacing: 0; }
.mhead-row i.now { color: var(--ink); font-weight: 800; }

.mstrip-c.late { border-color: var(--st-red) !important; }
.pm-cell.pm-late { box-shadow: inset 0 -2px 0 var(--st-red); }
.pm-dots { position: static !important; display: flex; justify-content: center; gap: 2px; }
.pm-dots i { width: 4px; height: 4px; border-radius: 50%; display: block; }
.pm-dots i.ps-obl { background: var(--st-blue); }
.pm-dots i.ps-obl.bad { background: var(--st-red); }
.pm-dots i.ps-plan { background: var(--st-teal); }
/* ---------- ProgStrip (bande 12 mois réutilisable) ---------- */
.ps { display: flex; gap: 3px; flex-wrap: wrap; }
.ps-m { position: relative; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 4px 7px 9px; font-size: 11px; color: var(--ink-3); cursor: default; line-height: 1.1; }
.ps-m.on { background: var(--st-blue-bg); border-color: var(--st-blue); color: var(--st-blue); font-weight: 700; }
.ps-m.now { box-shadow: inset 0 -2px 0 var(--ink-2); }
.ps-m.late { border-color: var(--st-red); }
.ps.compact { gap: 2px; }
.ps.compact .ps-m { padding: 2px 4px; font-size: 10px; min-width: 15px; text-align: center; }
.eqhead-m { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 4px 8px; font: inherit; font-size: 11px; color: var(--ink-2); cursor: pointer; }
.eqhead-warn { display: flex; align-items: flex-start; gap: 9px; margin-top: 10px; padding: 9px 11px; background: var(--st-red-bg); border: 1px solid var(--st-red); border-radius: var(--r-2); font-size: 12px; line-height: 1.5; color: var(--st-red); }
.eqhead-warn > span { flex: 1; }
.eqhead-warn b { font-weight: 700; }
.eqhead-m.ro { cursor: default; }
.eqhead-m:not(.ro):hover { border-color: var(--fire); color: var(--fire); }
.prog-warn { display: flex; gap: 10px; padding: 12px 14px; background: var(--st-amber-bg); border: 1px solid var(--st-amber-line, var(--line)); border-radius: var(--r-2); color: var(--ink); font-size: 12.5px; line-height: 1.55; }
.prog-warn > span:first-child, .prog-warn svg { color: var(--st-amber); flex: none; margin-top: 2px; }
.prog-warn ul { margin: 6px 0 0; padding-left: 17px; display: grid; gap: 4px; }
.prog-reset { display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; border: 1px solid var(--line); background: var(--surface-2); border-radius: var(--r-2); padding: 9px; font: inherit; font-size: 12.5px; color: var(--ink-2); cursor: pointer; }
.prog-reset:hover { border-color: var(--fire); color: var(--fire); }
.eqhead-m.on { background: var(--st-blue); border-color: var(--st-blue); color: #fff; font-weight: 600; }
.eqhead-m.now { box-shadow: inset 0 -2px 0 var(--ink-2); }
.prog-tag { display: none; }
.pm2 { width: 100%; border-collapse: separate; border-spacing: 0; }
.pm2 th { padding: 8px 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3); border-bottom: 1px solid var(--line); text-align: center; cursor: pointer; }
.pm2 th.sticky-l, .pm2 td.sticky-l { position: sticky; left: 0; background: var(--surface); text-align: left; padding-left: 14px; min-width: 150px; z-index: 1; cursor: default; }
.pm2 th.sel { background: var(--fire-soft); color: var(--fire-deep); }
.pm2 th.now, .pm2 td.now { background: var(--surface-2); }
.pm2 th.now { color: var(--ink); box-shadow: inset 0 -2px 0 var(--ink-2); }
.pm2 th.tot, .pm2 td.tot { background: var(--surface-2); text-align: center; min-width: 66px; padding: 7px 8px; border-left: 1px solid var(--line); }
.pm2 td { padding: 7px 6px; border-bottom: 1px solid var(--line); text-align: center; vertical-align: middle; }
.pm2 tbody tr:hover td:not(.sticky-l) { background: var(--surface-2); }
.pm2 tbody tr:hover td.now { background: var(--surface-3); }
.pm2-c { min-width: 62px; cursor: pointer; }
.pm2-fig { font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.1; }
.pm2-fig span { font-weight: 400; color: var(--ink-3); font-size: 11px; }
.pm2-fig.full { color: var(--st-green); }
.pm2-fig.late { color: var(--st-red); }
.pm2-fig.part { color: var(--st-amber); }
.pm2-fig.none { color: var(--ink-2); }
.pm2-bar { height: 3px; border-radius: 2px; background: var(--surface-3); margin-top: 4px; overflow: hidden; }
.pm2-bar i { display: block; height: 100%; border-radius: 2px; background: var(--st-green); }
.pm2-bar.late i { background: var(--st-red); }
.pm2-bar.part i { background: var(--st-amber); }
.pm2-bar.none i { background: var(--ink-3); }
.pm2-void { color: var(--line-strong); font-size: 12px; }
.mstrip-preset { border: 1px solid var(--line); background: var(--surface); border-radius: 20px; padding: 4px 11px; font: inherit; font-size: 11.5px; color: var(--ink-2); cursor: pointer; }
.mstrip-preset:hover { border-color: var(--fire); color: var(--fire); }
.prog-own-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--st-blue); flex: none; }
.ob-dot { width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; flex: none; }
.ob-dot.none { background: var(--surface-3); width: 6px; height: 6px; }
.oblig-filter { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.oblig-fb { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line); background: var(--surface); border-radius: 20px; padding: 5px 11px; font: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer; }
.oblig-fb:hover { border-color: var(--line-strong); }
.oblig-fb.on { background: var(--coal); border-color: var(--coal); color: #fff; }
.oblig-fb.on.done { background: var(--st-green); border-color: var(--st-green); }
.oblig-fb.on.late { background: var(--st-red); border-color: var(--st-red); }
.oblig-fn { font-size: 10.5px; background: var(--surface-3); color: var(--ink-3); border-radius: 10px; padding: 0 5px; }
.oblig-fb.on .oblig-fn { background: rgba(255,255,255,.22); color: #fff; }
.prog-matrix { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px; }
.prog-matrix th { padding: 8px 4px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3); border-bottom: 1px solid var(--line); text-align: center; }
.prog-matrix th.sticky-l, .prog-matrix td.sticky-l { position: sticky; left: 0; background: var(--surface); text-align: left; padding-left: 14px; min-width: 170px; z-index: 1; }
.prog-matrix td { padding: 7px 4px; text-align: center; border-bottom: 1px solid var(--line); }
.prog-matrix tbody tr { cursor: pointer; }
.prog-matrix tbody tr:hover td { background: var(--surface-2); }
.prog-matrix th.now, .prog-matrix td.now { background: var(--surface-2); }
.prog-matrix .pm-cell { min-width: 34px; }
.cs-map { position: relative; height: 380px; background: var(--surface-2); background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 40px 40px; border-radius: var(--r-3) var(--r-3) 0 0; }
.cs-pin { position: absolute; transform: translate(-50%, -100%); width: 26px; height: 26px; border-radius: 50% 50% 50% 2px; border: 2px solid var(--surface); display: grid; place-items: center; cursor: pointer; color: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.2); }
.cs-pin.green { background: var(--st-green); } .cs-pin.red { background: var(--st-red); } .cs-pin.gray { background: var(--ink-3); }
.cs-pin:hover { transform: translate(-50%, -100%) scale(1.15); }
.cs-map-legend { position: absolute; bottom: 10px; left: 10px; display: flex; gap: 12px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); padding: 6px 10px; font-size: 11.5px; }
.cs-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.cs-dot.green { background: var(--st-green); } .cs-dot.red { background: var(--st-red); } .cs-dot.gray { background: var(--ink-3); }
.cs-card { cursor: pointer; }
.cs-card:hover { border-color: var(--line-strong); }

.prog-row { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--line); cursor: pointer; }
.prog-row:hover { background: var(--surface-2); }
.prog-mo { width: 66px; font-size: 12.5px; text-transform: capitalize; flex: none; }
.prog-mo em { font-size: 10.5px; color: var(--fire); font-style: normal; }
.prog-track { flex: 1; height: 9px; background: var(--surface-3); border-radius: 20px; overflow: hidden; }
.prog-track i { display: block; height: 100%; border-radius: 20px; transition: width .3s; }
.prog-count { width: 52px; text-align: right; font-size: 12.5px; color: var(--ink-2); }
.prog-year { display: flex; align-items: center; gap: 14px; }
.prog-year-track { flex: 1; height: 14px; background: var(--surface-3); border-radius: 20px; overflow: hidden; }
.prog-year-track i { display: block; height: 100%; border-radius: 20px; background: linear-gradient(90deg, var(--st-green), var(--st-teal)); }
.prog-year b { font-size: 18px; min-width: 54px; text-align: right; }
.prog-badge { font-size: 10px; font-weight: 600; padding: 1px 6px; border-radius: 20px; background: var(--surface-3); color: var(--ink-3); white-space: nowrap; }
.prog-badge.own { background: var(--st-blue-bg, oklch(0.95 0.03 250)); color: var(--st-blue); }
.prog-node { padding: 10px 0; border-bottom: 1px solid var(--line); }
.prog-node:last-of-type { border-bottom: none; }

/* ---------- Tournée board (multi-jours × multi-techniciens) ---------- */
.tour-avs { display: inline-flex; }
.tour-avs .av { margin-left: -8px; border: 2px solid var(--surface); }
.tour-avs .av:first-child { margin-left: 0; }
.tb-wrap { display: grid; grid-template-columns: 1fr 224px; gap: 14px; align-items: start; }
.tb-grid { display: grid; gap: 6px; overflow-x: auto; }
.tb-corner { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); padding: 8px; display: flex; align-items: flex-end; }
.tb-dayhead { padding: 8px 10px; border-radius: var(--r-2); background: var(--surface-2); }
.tb-dayhead.today { background: var(--fire-soft); }
.tb-dayname { font-size: 12.5px; font-weight: 600; text-transform: capitalize; }
.tb-dayname .num { color: var(--ink-3); font-weight: 400; }
.tb-daybar { height: 5px; background: var(--surface-3); border-radius: 20px; overflow: hidden; margin: 5px 0 3px; }
.tb-daybar i { display: block; height: 100%; border-radius: 20px; }
.tb-daykpi { font-size: 10.5px; color: var(--ink-3); }
.tb-techcell { display: flex; align-items: center; gap: 9px; padding: 8px; background: var(--surface-2); border-radius: var(--r-2); position: sticky; left: 0; }
.tb-techname { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tb-techskills { font-size: 10px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tb-techload { margin-left: auto; font-size: 11px; color: var(--ink-2); font-weight: 600; }
.tb-cell { border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface); min-height: 74px; padding: 5px; display: flex; flex-direction: column; gap: 5px; }
.tb-cell.over { border-color: var(--fire); background: var(--fire-soft); }
.tb-cell.overload { border-color: var(--st-red); }
.tb-empty { color: var(--line-strong); text-align: center; font-size: 13px; margin: auto; }
.tb-cellsum { text-align: right; font-size: 10px; color: var(--ink-3); }
.tb-cellsum.over { color: var(--st-red); font-weight: 700; }
.tb-card { border: 1px solid var(--line); border-left: 3px solid var(--line-strong); border-radius: 5px; background: var(--surface); padding: 6px 8px; cursor: grab; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.tb-card:hover { border-color: var(--line-strong); }
.tb-card.bad { border-color: var(--st-red); border-left-color: var(--st-red); background: var(--st-red-bg); }
.tb-card.urgent { border-left-color: var(--st-red); }
.tb-card-h { display: flex; align-items: center; gap: 6px; }
.tb-card-t { flex: 1; font-size: 11.5px; font-weight: 500; line-height: 1.25; }
.tb-h { font-size: 10.5px; color: var(--ink-3); }
.tb-card-sub { font-size: 10px; color: var(--ink-3); margin-top: 2px; }
.tb-dot { width: 8px; height: 8px; border-radius: 2px; flex: none; display: inline-block; }
.tb-dot.st-fire { background: var(--fire); } .tb-dot.st-amber { background: var(--st-amber); } .tb-dot.st-teal { background: var(--st-teal); } .tb-dot.st-blue { background: var(--st-blue); } .tb-dot.st-violet { background: var(--st-violet); } .tb-dot.st-gray { background: var(--ink-3); }
.tb-backlog { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface-2); position: sticky; top: 12px; display: flex; flex-direction: column; }
.tb-backlog.over { border-color: var(--fire); background: var(--fire-soft); }
.tb-backlog-h { display: flex; align-items: center; gap: 7px; padding: 11px 12px; font-size: 12.5px; font-weight: 600; border-bottom: 1px solid var(--line); }
.tb-count { margin-left: auto; font-size: 11px; background: var(--surface); color: var(--ink-3); border-radius: 10px; padding: 1px 7px; }
.tb-backlog-body { padding: 8px; display: flex; flex-direction: column; gap: 6px; min-height: 60px; }
.tb-backlog-foot { padding: 9px 12px; font-size: 10.5px; color: var(--ink-3); border-top: 1px solid var(--line); }
.tb-legend { display: flex; gap: 14px; align-items: center; margin-top: 10px; font-size: 11.5px; color: var(--ink-2); flex-wrap: wrap; }
@media (max-width: 900px) { .tb-wrap { grid-template-columns: 1fr; } .tb-backlog { position: static; } }
/* ---------- Détail dépôt ---------- */
.wh-bar { display: flex; gap: 8px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.wh-low { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); cursor: pointer; margin-left: auto; }
.wh-foot { padding: 11px 14px; font-size: 12px; color: var(--ink-2); border-top: 1px solid var(--line); }

/* ---------- Composeur : modèles & clauses ---------- */
.tpl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.tpl-card { text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-3); padding: 13px; cursor: pointer; color: var(--ink); }
.tpl-card:hover { border-color: var(--line-strong); }
.tpl-card.on { border-color: var(--fire); box-shadow: inset 0 0 0 1px var(--fire); background: var(--fire-soft); }
.tpl-check { width: 18px; height: 18px; border-radius: 50%; background: var(--fire); color: #fff; display: grid; place-items: center; }
.clause-row { display: flex; gap: 12px; align-items: flex-start; padding: 12px 2px; border-bottom: 1px solid var(--line); }
.clause-n { width: 22px; height: 22px; border-radius: 50%; background: var(--surface-2); color: var(--ink-2); font-size: 11px; display: grid; place-items: center; flex: none; font-variant-numeric: tabular-nums; }
.clause-pick { display: flex; gap: 10px; align-items: flex-start; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 10px; cursor: pointer; color: var(--ink); width: 100%; }
.clause-pick:hover { border-color: var(--line-strong); }
.clause-pick.on { border-color: var(--fire); background: var(--fire-soft); }
.clause-tick { width: 17px; height: 17px; border-radius: 5px; border: 1.5px solid var(--line-strong); flex: none; display: grid; place-items: center; color: #fff; margin-top: 1px; }
.clause-tick.on { background: var(--fire); border-color: var(--fire); }

.reg-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.reg-table th { text-align: left; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); padding: 8px 14px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.reg-table td { padding: 9px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; white-space: nowrap; }
.reg-table tr:last-child td { border-bottom: none; }
.reg-table td.b { font-weight: 600; }
.reg-metier-ic { width: 28px; height: 28px; border-radius: var(--r-2); display: grid; place-items: center; flex: none; background: var(--fire-soft); color: var(--fire-deep); }
.reg-metier-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.reg-metier-tab { display: flex; align-items: center; gap: 7px; border: 1px solid var(--line); background: var(--surface); border-radius: 20px; padding: 6px 13px; font: inherit; font-size: 12.5px; color: var(--ink-2); cursor: pointer; }
.reg-metier-tab:hover { border-color: var(--line-strong); }
.reg-metier-tab.on { background: var(--coal); color: white; border-color: var(--coal); }
.reg-metier-n { font-size: 10.5px; background: var(--surface-3); color: var(--ink-3); border-radius: 10px; padding: 0 6px; }
.reg-metier-tab.on .reg-metier-n { background: rgba(255,255,255,.2); color: white; }
.reg-edit-row { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-bottom: 1px solid var(--line); }
.reg-num { width: 20px; text-align: center; font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; flex: none; }
.reg-inp { flex: 1; min-width: 120px; border: 1px solid transparent; background: none; border-radius: var(--r-1); padding: 5px 8px; font: inherit; font-size: 13px; color: var(--ink); }
.reg-inp:hover:not(:disabled) { border-color: var(--line); }
.reg-inp:focus { border-color: var(--fire); background: var(--surface); outline: none; }
.reg-inp:disabled { color: var(--ink); cursor: default; }
.reg-sel { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 5px 8px; font: inherit; font-size: 12px; color: var(--ink-2); flex: none; }
.reg-sel:disabled { color: var(--ink-3); background: var(--surface-2); }
.reg-del { border: none; background: none; cursor: pointer; color: var(--ink-3); display: flex; padding: 4px; border-radius: var(--r-1); flex: none; }
.reg-del:hover:not(:disabled) { background: var(--st-red-bg); color: var(--st-red); }
.reg-del:disabled { opacity: .25; cursor: not-allowed; }
.reg-foot { padding: 10px 14px; font-size: 11.5px; color: var(--ink-3); line-height: 1.5; }
.reg-search { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: var(--r-2); padding: 3px 9px; color: var(--ink-3); }
.reg-search input { border: none; background: none; font: inherit; font-size: 12.5px; color: var(--ink); outline: none; width: 110px; }
.reg-filters { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px 14px; border-bottom: 1px solid var(--line); align-items: center; background: var(--surface-2); }
.reg-facet { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 5px 9px; font: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer; max-width: 190px; }
.reg-facet.on { border-color: var(--fire); color: var(--fire-deep); background: var(--fire-soft); font-weight: 600; }
.reg-clear { border: none; background: none; cursor: pointer; color: var(--ink-3); font: inherit; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; padding: 5px 6px; }
.reg-clear:hover { color: var(--fire); }
.reg-link { border: none; background: none; padding: 0; font: inherit; font-size: inherit; color: var(--fire); font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 640px) {
  .reg-edit-row { flex-wrap: wrap; }
  .reg-sel { order: 3; }
}

.ged-crumbs { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; font-size: 13px; color: var(--ink-3); flex-wrap: wrap; }
.ged-crumbs button { border: none; background: none; font: inherit; font-size: 13px; color: var(--ink-2); cursor: pointer; padding: 0; }
.ged-crumbs button:hover { color: var(--fire); }
.ged-crumbs span:last-child { color: var(--ink); font-weight: 600; }
.ged-folder-search { display: flex; align-items: center; gap: 8px; padding: 0 12px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); min-height: 36px; margin-bottom: 12px; color: var(--ink-3); }
.ged-folder-search input { flex: 1; border: none; background: none; font: inherit; font-size: 13px; color: var(--ink); outline: none; }
.ged-folders { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.ged-folder { display: flex; align-items: center; gap: 11px; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); cursor: pointer; text-align: left; font: inherit; }
.ged-folder:hover { border-color: var(--line-strong); background: var(--surface-2); }
.ged-folder-ic { width: 38px; height: 38px; border-radius: var(--r-2); display: grid; place-items: center; flex: none; background: var(--fire-soft); color: var(--fire); }
.ged-folder-ic.alt { background: var(--surface-2); color: var(--ink-2); }
.ged-cmt { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; color: var(--ink-3); font-weight: 600; }
.ged-cmt-row { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.avatar.xs { width: 26px; height: 26px; font-size: 10px; flex: none; }
.mention { color: var(--fire); font-weight: 600; }
.ged-compose { margin-top: 12px; border: 1px solid var(--line); border-radius: var(--r-3); padding: 10px; background: var(--surface-2); }
.ged-compose textarea { width: 100%; border: 1px solid var(--line); border-radius: var(--r-2); padding: 9px 11px; font: inherit; font-size: 13px; resize: vertical; outline: none; background: var(--surface); box-sizing: border-box; }
.ged-compose textarea:focus { border-color: var(--fire); }
.mention-pop { position: absolute; left: 0; right: 0; top: 100%; margin-top: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); box-shadow: var(--sh-pop); z-index: 30; overflow: hidden; }
.mention-opt { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; border: none; background: none; cursor: pointer; font: inherit; }
.mention-opt:hover { background: var(--fire-soft); }


/* ---------- Scope switcher ---------- */
.scope { position: relative; }
.scope-btn {
  display: inline-flex; align-items: center; gap: 7px; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r-2); padding: 6px 10px;
  font: 500 12.5px var(--font-sans); color: var(--ink); cursor: pointer; max-width: 240px;
}
.scope-btn:hover { border-color: var(--line-strong); }
.scope-lbl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.scope-menu {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 120; width: 300px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-3);
  box-shadow: var(--sh-pop); overflow: hidden; animation: pop var(--t-fast) var(--ease);
}
.scope-menu-h { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-3); padding: 10px 14px 4px; font-weight: 600; }
.scope-opt { display: flex; align-items: center; gap: 10px; width: 100%; border: none; background: none; padding: 8px 14px; cursor: pointer; text-align: left; font: inherit; color: var(--ink); }
.scope-opt:hover { background: var(--surface-2); }
.scope-opt.on { background: var(--fire-soft); }
.scope-opt.in { padding-left: 30px; }
.scope-opt b { font-size: 13px; font-weight: 500; display: block; }
.scope-sub { font-size: 11px; color: var(--ink-3); }
.scope-chk { margin-left: auto; color: var(--fire); }
.scope-menu-f { font-size: 11px; color: var(--ink-3); padding: 8px 14px; border-top: 1px solid var(--line); background: var(--surface-2); }
@container vp (max-width: 720px) { .scope-lbl { display: none; } .scope-btn { max-width: none; } }

/* Scope switcher — variante sidebar (sous le nom du tenant) */
.bo-scope-wrap { padding: 0 12px 12px; }
.scope-side { display: block; }
.scope-side .scope-btn {
  width: 100%; max-width: none; background: oklch(0.28 0.012 45); border-color: oklch(0.34 0.014 45);
  color: oklch(0.9 0.005 70); padding: 8px 11px; justify-content: flex-start;
}
.scope-side .scope-btn:hover { background: oklch(0.32 0.014 45); border-color: oklch(0.4 0.02 45); }
.scope-side .scope-lbl { flex: 1; display: block; text-align: left; }
.scope-side .scope-btn .ic:last-child { opacity: 0.6; }
.scope-side .scope-menu { width: calc(100% - 0px); left: 0; right: 0; }

/* ---------- Assignee ---------- */
.assignee { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; }
.assignee-ic { width: 22px; height: 22px; border-radius: 6px; background: var(--st-teal-bg); color: var(--st-teal); display: inline-grid; place-items: center; flex: none; }
.assign-pop, .filter-pop {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 130; width: 300px;
  background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-3);
  box-shadow: var(--sh-pop); padding: 10px; animation: pop var(--t-fast) var(--ease);
}
.assign-list { max-height: 240px; overflow-y: auto; display: flex; flex-direction: column; gap: 1px; }
.assign-opt { display: flex; align-items: center; gap: 9px; width: 100%; border: none; background: none; padding: 7px 8px; border-radius: var(--r-2); cursor: pointer; font: inherit; }
.assign-opt:hover { background: var(--surface-2); }

/* ---------- Filter bar ---------- */
.filterbar { margin-bottom: 12px; }
.fchip.add { border-style: dashed; color: var(--ink-2); }
.fchip.clear { color: var(--st-red); border-color: transparent; }
.filter-pop { width: 320px; }
.filter-row { display: flex; gap: 6px; margin-bottom: 6px; }
.filter-row .select:first-child { flex: 1; }
.filter-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.filter-chip {
  display: inline-flex; align-items: center; gap: 5px; background: var(--coal); color: var(--ink-inv);
  border-radius: var(--r-full); padding: 3px 6px 3px 11px; font-size: 11.5px;
}
.filter-chip .op { opacity: 0.6; }
.filter-chip button { border: none; background: oklch(0.4 0.02 45); color: white; width: 17px; height: 17px; border-radius: 50%; cursor: pointer; display: grid; place-items: center; }

/* ---------- Map panel ---------- */
.mappanel { position: relative; border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; background: oklch(0.95 0.01 190); }
.map-bg { position: absolute; inset: 0;
  background-image:
    linear-gradient(oklch(0.9 0.02 150 / 0.5) 0, transparent 1px),
    radial-gradient(circle at 30% 40%, oklch(0.9 0.03 150) 0 22%, transparent 23%),
    radial-gradient(circle at 72% 60%, oklch(0.92 0.02 90) 0 18%, transparent 19%),
    repeating-linear-gradient(38deg, transparent 0 34px, oklch(0.88 0.01 60 / 0.5) 34px 36px),
    repeating-linear-gradient(-52deg, transparent 0 60px, oklch(0.88 0.01 60 / 0.4) 60px 61px);
  background-color: oklch(0.955 0.012 160);
}
.map-attr { position: absolute; bottom: 6px; right: 8px; font-family: var(--font-mono); font-size: 9.5px; color: var(--ink-3); background: oklch(1 0 0 / 0.6); padding: 1px 6px; border-radius: 4px; }
.map-pin { position: absolute; transform: translate(-50%, -100%); border: none; background: none; cursor: pointer; display: flex; flex-direction: column; align-items: center; }
.map-pin .pin-dot { width: 15px; height: 15px; border-radius: 50% 50% 50% 0; transform: rotate(45deg); background: var(--st-blue); box-shadow: var(--sh-2); border: 2px solid white; }
.map-pin.red .pin-dot { background: var(--st-red); } .map-pin.amber .pin-dot { background: var(--st-amber); }
.map-pin.green .pin-dot { background: var(--st-green); } .map-pin.violet .pin-dot { background: var(--st-violet); }
.map-pin .pin-n { position: absolute; top: 0; color: white; font-size: 9px; font-weight: 700; width: 15px; height: 15px; display: grid; place-items: center; }
.map-pin .pin-label { font-size: 10.5px; background: var(--surface); border: 1px solid var(--line); border-radius: 5px; padding: 1px 6px; margin-top: 3px; white-space: nowrap; opacity: 0; transition: opacity var(--t-fast); box-shadow: var(--sh-1); pointer-events: none; }
.map-pin:hover .pin-label, .map-pin.sel .pin-label { opacity: 1; }
.map-pin.sel .pin-dot { outline: 3px solid var(--fire-line); outline-offset: 1px; }

/* ---------- Tasks ---------- */
.task-row { display: flex; gap: 11px; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--line); font-size: 13px; cursor: pointer; }
.task-row:hover { background: var(--surface-2); }
.task-check { width: 18px; height: 18px; border-radius: 5px; border: 1.5px solid var(--line-strong); flex: none; cursor: pointer; display: grid; place-items: center; background: var(--surface); color: transparent; }
.task-check.done { background: var(--st-green); border-color: var(--st-green); color: white; }
.task-row.done .task-title { text-decoration: line-through; color: var(--ink-3); }
.task-title { flex: 1; }
.prio-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.prio-high { background: var(--st-red); } .prio-med { background: var(--st-amber); } .prio-low { background: var(--line-strong); }

/* calendar */
.cal { display: grid; grid-template-columns: 52px repeat(5, 1fr); border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; background: var(--surface); }
.cal-h { padding: 8px; text-align: center; font-size: 12px; font-weight: 600; background: var(--surface-2); border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); }
.cal-h.today { background: var(--fire-soft); color: var(--fire-deep); }
.cal-h .d { display: block; font-size: 10.5px; color: var(--ink-3); font-weight: 500; }
.cal-time { font-size: 10.5px; color: var(--ink-3); text-align: right; padding: 4px 6px; border-bottom: 1px solid var(--line); font-family: var(--font-mono); }
.cal-cell { border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); min-height: 44px; padding: 2px; position: relative; }
.cal-cell.today-col { background: oklch(0.97 0.012 50); }
.cal-ev { border-radius: var(--r-1); padding: 3px 6px; font-size: 10.5px; line-height: 1.25; border-left: 3px solid; margin-bottom: 2px; background: var(--surface); box-shadow: var(--sh-1); }
.cal-ev.task { border-left-color: var(--st-violet); background: var(--st-violet-bg); }
.cal-ev.mission { border-left-color: var(--st-blue); }

/* ---------- Catalogue / admin bits ---------- */
.seg { display: inline-flex; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-2); padding: 2px; gap: 2px; }
.seg button { border: none; background: none; font: 500 12.5px var(--font-sans); padding: 5px 12px; border-radius: 5px; cursor: pointer; color: var(--ink-2); }
.seg button.on { background: var(--surface); color: var(--ink); box-shadow: var(--sh-1); }
.perm-matrix { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.perm-matrix th { text-align: center; padding: 8px 6px; font-size: 11px; color: var(--ink-2); border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--surface); }
.perm-matrix th.first, .perm-matrix td.first { text-align: left; width: 46%; }
.perm-matrix td { padding: 7px 6px; border-bottom: 1px solid var(--line); text-align: center; }
.perm-matrix tr:hover { background: var(--surface-2); }
.perm-grp td { background: var(--surface-2); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-3); }
.tick { width: 20px; height: 20px; border-radius: 5px; display: inline-grid; place-items: center; cursor: pointer; }
.tick.on { background: var(--st-green-bg); color: var(--st-green); }
.tick.off { background: var(--surface-3); color: transparent; }
.toggle { width: 38px; height: 22px; border-radius: 12px; background: var(--surface-3); border: none; cursor: pointer; position: relative; transition: background var(--t-fast); flex: none; }
.toggle.on { background: var(--st-green); }
.toggle::after { content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: white; transition: left var(--t-fast); box-shadow: var(--sh-1); }
.toggle.on::after { left: 18px; }
.split-price { display: grid; grid-template-columns: 1fr auto auto; gap: 8px 14px; align-items: center; font-size: 13px; }

/* margin bar */
.margin-bar { height: 6px; border-radius: 4px; background: var(--surface-3); overflow: hidden; min-width: 60px; }
.margin-bar i { display: block; height: 100%; }

/* ---------- GED (document management) ---------- */
.ged-layout { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: 16px; align-items: start; }
.ged-layout:has(.ged-detail) { grid-template-columns: 232px minmax(0, 1fr) 340px; }
.ged-side { position: sticky; top: 12px; }
.ged-side-grp { display: flex; flex-direction: column; gap: 1px; margin-bottom: 6px; }
.ged-side-lbl { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); padding: 10px 10px 5px; }
.ged-src { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; border: none; background: none; border-radius: var(--r-2); font: inherit; font-size: 13px; color: var(--ink); cursor: pointer; text-align: left; }
.ged-src:hover { background: var(--surface-2); }
.ged-src.on { background: var(--fire-soft); color: var(--fire); font-weight: 600; }
.ged-count { font-size: 11px; font-weight: 600; color: var(--ink-3); background: var(--surface-3); border-radius: 20px; padding: 1px 7px; }
.ged-src.on .ged-count { background: var(--fire-line); color: var(--fire); }
.ged-site { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); padding: 5px 10px 5px 30px; cursor: pointer; border-radius: var(--r-2); }
.ged-site:hover { background: var(--surface-2); }
.ged-main { min-width: 0; }
.ged-bar { display: flex; gap: 10px; margin-bottom: 10px; }
.ged-searchbox { flex: 1; display: flex; align-items: center; gap: 8px; padding: 0 12px; min-height: 40px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-3); color: var(--ink-3); }
.ged-searchbox input { flex: 1; border: none; background: none; font: inherit; font-size: 13.5px; color: var(--ink); outline: none; }
.ged-x { border: none; background: none; cursor: pointer; color: var(--ink-3); display: flex; padding: 2px; }
.ged-view { display: flex; border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; }
.ged-view button { border: none; background: var(--surface); padding: 0 11px; cursor: pointer; color: var(--ink-3); display: flex; align-items: center; }
.ged-view button.on { background: var(--fire-soft); color: var(--fire); }
.ged-types { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.ged-types button { border: 1px solid var(--line); background: var(--surface); border-radius: 20px; padding: 4px 12px; font: inherit; font-size: 12.5px; color: var(--ink-2); cursor: pointer; display: flex; align-items: center; gap: 6px; }
.ged-types button span { font-size: 11px; color: var(--ink-3); background: var(--surface-3); border-radius: 20px; padding: 0 6px; }
.ged-types button.on { background: var(--coal); color: white; border-color: var(--coal); }
.ged-types button.on span { background: rgba(255,255,255,.22); color: white; }
.ged-row { display: flex; align-items: center; gap: 12px; padding: 10px 14px; cursor: pointer; }
.ged-row:hover { background: var(--surface-2); }
.ged-row.on { background: var(--fire-soft); }
.ged-tags { display: flex; gap: 5px; }
.ged-ico { width: 30px; height: 30px; flex: none; border-radius: var(--r-2); display: grid; place-items: center; background: var(--surface-3); color: var(--ink-2); }
.ged-ico.t-cr, .ged-ico.t-attest { background: var(--st-green-bg); color: var(--st-green); }
.ged-ico.t-facture, .ged-ico.t-devis { background: var(--st-blue-bg); color: var(--st-blue); }
.ged-ico.t-contrat { background: var(--fire-soft); color: var(--fire); }
.ged-ico.t-photo { background: oklch(0.95 0.04 300); color: oklch(0.5 0.14 300); }
.ged-ico.t-plan { background: var(--st-amber-bg); color: var(--st-amber); }
.ged-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.ged-card { border: 1px solid var(--line); border-radius: var(--r-3); padding: 12px; cursor: pointer; background: var(--surface); transition: box-shadow var(--t-fast), border-color var(--t-fast); }
.ged-card:hover { box-shadow: var(--sh-1); }
.ged-card.on { border-color: var(--fire); box-shadow: 0 0 0 1px var(--fire); }
.ged-thumb { position: relative; height: 88px; border-radius: var(--r-2); display: grid; place-items: center; background: var(--surface-3); color: var(--ink-2); }
.ged-thumb.t-cr, .ged-thumb.t-attest { background: var(--st-green-bg); color: var(--st-green); }
.ged-thumb.t-facture, .ged-thumb.t-devis { background: var(--st-blue-bg); color: var(--st-blue); }
.ged-thumb.t-contrat { background: var(--fire-soft); color: var(--fire); }
.ged-thumb.t-photo { background: oklch(0.95 0.04 300); color: oklch(0.5 0.14 300); }
.ged-thumb.t-plan { background: var(--st-amber-bg); color: var(--st-amber); }
.ged-ver { position: absolute; top: 6px; right: 6px; font-size: 10px; font-weight: 700; background: var(--coal); color: white; border-radius: 20px; padding: 1px 6px; }
.ged-detail { position: sticky; top: 12px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); overflow: hidden; max-height: calc(100vh - 24px); display: flex; flex-direction: column; }
.ged-detail-h { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border-bottom: 1px solid var(--line); }
.ged-detail-b { padding: 14px; overflow-y: auto; }
.ged-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 12px; background: var(--surface-2); border-radius: var(--r-2); }
@media (max-width: 1180px) {
  .ged-layout, .ged-layout:has(.ged-detail) { grid-template-columns: 1fr; }
  .ged-side { position: static; display: flex; overflow-x: auto; gap: 6px; margin-bottom: 6px; padding-bottom: 4px; -webkit-overflow-scrolling: touch; }
  .ged-side-grp { flex-direction: row; flex: none; margin-bottom: 0; gap: 6px; }
  .ged-src { white-space: nowrap; width: auto; border: 1px solid var(--line); }
  .ged-src.on { border-color: var(--fire); }
  .ged-side-lbl, .ged-side .well { display: none; }
  .ged-detail { position: fixed; inset: 0; max-height: none; height: 100dvh; border-radius: 0; z-index: 70; box-shadow: none; }
  .ged-detail-h { position: sticky; top: 0; background: var(--surface); z-index: 1; }
  .ged-detail .placeholder-img { min-height: 130px !important; }
  .ged-detail .tabs { overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
  .ged-detail .tabs button { white-space: nowrap; }
}
@media (max-width: 640px) {
  .ged-bar { flex-wrap: wrap; }
  .ged-searchbox { min-width: 100%; order: 2; }
  .ged-view { order: 1; }
  .ged-folders { grid-template-columns: 1fr; }
  .ged-crumbs { font-size: 12px; }
  .ged-row { flex-wrap: wrap; gap: 6px 10px; }
  .ged-row .ged-tags { display: none; }
  .ged-detail { max-height: 88vh; }
}

/* ---------- En-tête d'onglet embarqué ---------- */
.tabhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 14px; flex-wrap: wrap; }
.tabhead > div:first-child { flex: 1 1 0; min-width: 0; }
.tabhead-t { margin: 0; font-size: 17px; font-weight: 600; }
.tabhead-s { margin: 3px 0 0; font-size: 12.5px; color: var(--ink-2); max-width: 100ch; line-height: 1.45; text-wrap: pretty; }

/* ---------- Cellule contact ---------- */
.ct-namecell { display: flex; align-items: center; gap: 9px; min-width: 0; }
.ct-namecell > .av { flex: 0 0 auto; }
.ct-nametxt { display: flex; align-items: baseline; gap: 6px; min-width: 0; flex-wrap: nowrap; }
.ct-primary { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; }
.ct-table td[data-th="Téléphone"], .ct-table td[data-th="E-mail"] { white-space: nowrap; }
.ct-nametxt b { font-weight: 500; white-space: nowrap; }

/* ---------- Multi-select de sites ---------- */
.sp { border: 1px solid var(--line); border-radius: var(--r-2); overflow: hidden; }
.sp-all { display: flex; align-items: center; gap: 8px; padding: 10px 12px; font-size: 13px; cursor: pointer; background: var(--surface-2); }
.sp-allhint { font-size: 11.5px; color: var(--ink-3); margin-left: auto; }
.sp-bar { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-top: 1px solid var(--line); }
.sp-search { flex: 1; display: flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid var(--line); border-radius: var(--r-1); min-height: 32px; color: var(--ink-3); background: var(--surface); }
.sp-search input { flex: 1; border: none; background: none; font: inherit; font-size: 12.5px; color: var(--ink); outline: none; min-width: 0; }
.sp-count { font-size: 11.5px; color: var(--ink-3); white-space: nowrap; }
.sp-chips { display: flex; flex-wrap: wrap; gap: 5px; padding: 0 10px 9px; }
.sp-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; background: var(--fire-soft); color: var(--fire-deep); border-radius: 20px; padding: 3px 5px 3px 9px; }
.sp-chip button { border: none; background: none; padding: 0; display: flex; cursor: pointer; color: inherit; opacity: .6; }
.sp-chip button:hover { opacity: 1; }
.sp-list { max-height: 210px; overflow-y: auto; border-top: 1px solid var(--line); }
.sp-opt { display: flex; align-items: center; gap: 9px; padding: 7px 12px; font-size: 12.5px; cursor: pointer; border-bottom: 1px solid var(--line); }
.sp-opt:last-child { border-bottom: none; }
.sp-opt:hover { background: var(--surface-2); }
.sp-opt.on { background: var(--fire-soft); }
.sp-optname { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-optmeta { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.sp-empty { padding: 18px 12px; text-align: center; font-size: 12px; color: var(--ink-3); }

/* ---------- Assistant d'import (round 14) ---------- */
.iw-steps { display: flex; gap: 4px; margin-bottom: 18px; flex-wrap: wrap; }
.iw-step { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 7px 14px 7px 10px; font: inherit; font-size: 12.5px; color: var(--ink-3); cursor: pointer; }
.iw-step:disabled { cursor: default; opacity: .55; }
.iw-step-n { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--surface-3); color: var(--ink-3); flex: none; }
.iw-step.cur { border-color: var(--fire); background: var(--fire-soft); color: var(--fire-deep); font-weight: 600; }
.iw-step.cur .iw-step-n { background: var(--fire); color: #fff; }
.iw-step.done { color: var(--ink); }
.iw-step.done .iw-step-n { background: var(--st-green-bg); color: var(--st-green); }
.iw-kinds { display: grid; gap: 6px; }
.iw-kind { display: flex; align-items: center; gap: 11px; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 10px 12px; font: inherit; font-size: 13px; cursor: pointer; color: var(--ink); }
.iw-kind:hover { border-color: var(--line-strong); }
.iw-kind.on { border-color: var(--fire); background: var(--fire-soft); }
.iw-kind-ic { width: 30px; height: 30px; border-radius: var(--r-2); display: grid; place-items: center; background: var(--surface-2); color: var(--ink-2); flex: none; }
.iw-kind.on .iw-kind-ic { background: var(--fire); color: #fff; }
.iw-kind-sub { display: block; font-size: 11.5px; color: var(--ink-3); font-weight: 400; margin-top: 1px; }
.iw-drop { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 32px 20px; border: 2px dashed var(--line-strong); border-radius: var(--r-3); background: var(--surface-2); font: inherit; cursor: pointer; color: var(--ink-3); }
.iw-drop:hover { border-color: var(--fire); color: var(--fire); background: var(--fire-soft); }
.iw-drop b { font-size: 14px; color: var(--ink); }
.iw-drop span { font-size: 12px; }
.iw-help { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 12.5px; }
.iw-help p { margin: 5px 0 10px; color: var(--ink-2); line-height: 1.5; }
.iw-file { display: flex; align-items: center; gap: 11px; padding: 11px 12px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface-2); }
.iw-file-ic { width: 34px; height: 34px; border-radius: var(--r-2); display: grid; place-items: center; background: var(--st-green-bg); color: var(--st-green); flex: none; }
.iw-preview { margin-top: 14px; }
.iw-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.iw-table th { text-align: left; padding: 6px 9px; border-bottom: 1px solid var(--line); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); white-space: nowrap; }
.iw-table td { padding: 6px 9px; border-bottom: 1px solid var(--line); white-space: nowrap; color: var(--ink-2); }
.iw-table.wide { font-size: 12px; }
.iw-table.wide td { color: var(--ink); }
.iw-ok { display: flex; align-items: center; gap: 7px; margin-top: 12px; font-size: 12.5px; color: var(--st-green); }
.iw-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; flex-wrap: wrap; }
.iw-bar { display: flex; align-items: center; gap: 14px; padding: 11px 14px; margin-bottom: 12px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-2); font-size: 12.5px; flex-wrap: wrap; }
.iw-bar-track { flex: 1; min-width: 120px; height: 6px; background: var(--surface-3); border-radius: 20px; overflow: hidden; }
.iw-bar-track i { display: block; height: 100%; background: var(--st-green); border-radius: 20px; }
.iw-map { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.iw-map th { text-align: left; padding: 8px 14px; border-bottom: 1px solid var(--line); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); white-space: nowrap; }
.iw-map td { padding: 7px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.iw-map tr.off td { opacity: .5; }
.iw-map tr:last-child td { border-bottom: none; }
.iw-sample { color: var(--ink-3); font-size: 11.5px; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.iw-arrow { color: var(--ink-3); width: 24px; }
.iw-sel { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 5px 8px; font: inherit; font-size: 12px; color: var(--ink); max-width: 230px; }
.iw-sel:focus { border-color: var(--fire); outline: none; }
.iw-foot { padding: 11px 14px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-2); }
.iw-check { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.iw-check input { accent-color: var(--fire); }
.iw-alert { display: flex; gap: 10px; align-items: flex-start; padding: 11px 14px; border-radius: var(--r-2); font-size: 12.5px; margin-bottom: 14px; line-height: 1.5; }
.iw-alert.block { background: var(--st-red-bg); color: var(--st-red); }
.iw-alert.ok { background: var(--st-green-bg); color: var(--st-green); }
.iw-alert.info { background: var(--st-blue-bg); color: var(--st-blue); }
.iw-issue { border-bottom: 1px solid var(--line); }
.iw-issue:last-child { border-bottom: none; }
.iw-issue.done { background: color-mix(in oklch, var(--st-green-bg) 40%, transparent); }
.iw-issue-h { display: flex; align-items: center; gap: 11px; width: 100%; padding: 11px 14px; border: none; background: none; font: inherit; text-align: left; cursor: pointer; }
.iw-issue-h:hover { background: var(--surface-2); }
.iw-issue-t { flex: 1; min-width: 0; font-size: 13px; }
.iw-issue-t .sub-cell { display: block; }
.iw-chev { color: var(--ink-3); display: flex; transition: transform .18s; }
.iw-chev.open { transform: rotate(90deg); }
.iw-issue-b { padding: 0 14px 14px 14px; }
.iw-why { margin: 0 0 10px; font-size: 12.5px; color: var(--ink-2); line-height: 1.55; max-width: 70ch; }
.iw-rows { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.iw-rows span { font-size: 11px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-1); padding: 2px 7px; color: var(--ink-2); }
.iw-choice { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-2); }
.iw-choice.col { flex-direction: column; align-items: flex-start; gap: 8px; }
.iw-maprow { display: flex; align-items: center; gap: 9px; font-size: 12.5px; }
.iw-decided { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--st-green); flex-wrap: wrap; }
.iw-undo { border: none; background: none; font: inherit; font-size: 12px; color: var(--ink-3); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.iw-undo:hover { color: var(--fire); }
.iw-simstart { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 28px 20px; text-align: center; color: var(--ink-3); }
.iw-simstart b { font-size: 15px; color: var(--ink); }
.iw-simstart span { font-size: 12.5px; max-width: 380px; line-height: 1.5; }
.iw-diff { display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-bottom: 1px solid var(--line); font-size: 12.5px; }
.iw-diff:last-of-type { border-bottom: none; }
.iw-diff.add { color: var(--st-green); }
.iw-diff.upd { color: var(--st-blue); }
.iw-diff.skip { color: var(--ink-3); }
.iw-diff.none { color: var(--ink-2); }
.iw-done { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 18px 12px 6px; }
.iw-done-ic { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--st-green-bg); color: var(--st-green); }
.iw-done-stats { display: flex; gap: 30px; margin-top: 20px; flex-wrap: wrap; justify-content: center; }
.iw-done-stats div { display: flex; flex-direction: column; }
.iw-done-stats b { font-size: 20px; }
.iw-done-stats span { font-size: 11.5px; color: var(--ink-3); }
.iw-next-n { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--fire-soft); color: var(--fire-deep); flex: none; }
@media (max-width: 640px) { .iw-steps { gap: 3px; } .iw-step-l { display: none; } .iw-step { padding: 7px 9px; } }

/* ---------- Fiche site : mise en page + réglementaire par règle ---------- */
.site-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 16px; align-items: start; }
.site-layout > div:first-child { display: grid; gap: 14px; align-content: start; }
@media (max-width: 1100px) { .site-layout { grid-template-columns: 1fr; } }
.sr-tabs { display: flex; gap: 2px; padding: 8px 10px 0; border-bottom: 1px solid var(--line); overflow-x: auto; }
.sr-tab { border: none; background: none; font: inherit; font-size: 11.5px; font-weight: 600; color: var(--ink-3); padding: 6px 9px 8px; cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; }
.sr-tab:hover { color: var(--ink); }
.sr-tab.on { color: var(--fire); border-bottom-color: var(--fire); }
.sr-body { padding: 12px 14px 4px; }
.sr-head { display: flex; flex-direction: column; gap: 1px; margin-bottom: 10px; }
.sr-head b { font-size: 12.5px; }
.sr-ref { font-size: 10.5px; color: var(--ink-3); }
.sr-kv { display: grid; grid-template-columns: 1fr auto; gap: 0; margin: 0; font-size: 12px; }
.sr-kv dt { color: var(--ink-2); padding: 5px 0; border-bottom: 1px solid var(--line); }
.sr-kv dd { margin: 0; padding: 5px 0 5px 10px; text-align: right; border-bottom: 1px solid var(--line); }
.sr-kv dt.hl, .sr-kv dd.hl { background: var(--surface-2); font-weight: 600; }
.sr-kv dt.hl { padding-left: 6px; border-radius: var(--r-1) 0 0 var(--r-1); }
.sr-kv dd.hl { padding-right: 6px; border-radius: 0 var(--r-1) var(--r-1) 0; }
.sr-inactive { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 10px 14px; border-top: 1px solid var(--line); font-size: 11px; color: var(--ink-3); }
.sr-off { border: 1px dashed var(--line-strong); border-radius: 20px; padding: 1px 8px; }
.sr-empty { font-size: 12.5px; color: var(--ink-3); line-height: 1.5; }
.sr-note { display: flex; gap: 6px; align-items: flex-start; margin-top: 10px; font-size: 11.5px; color: var(--ink-3); line-height: 1.45; }
/* installations sous contrat */
.inst-row { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: none; background: none; font: inherit; padding: 10px 14px; cursor: pointer; border-bottom: 1px solid var(--line); }
.inst-row:last-of-type { border-bottom: none; }
.inst-row:hover { background: var(--surface-2); }
.inst-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.inst-top { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.inst-top b { font-size: 12.5px; font-weight: 500; }
.inst-meta { display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--ink-3); }
.inst-meta i { width: 3px; height: 3px; border-radius: 50%; background: var(--line-strong); display: block; }
.inst-right { display: flex; align-items: center; gap: 8px; color: var(--ink-3); flex: none; }
.inst-n { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.1; }
.inst-n b { font-size: 13px; color: var(--ink); }
.inst-n span { font-size: 9.5px; color: var(--ink-3); }
/* choix d'entité de facturation */
.ent-pick { display: grid; gap: 6px; }
.ent-opt { display: flex; align-items: flex-start; gap: 10px; border: 1px solid var(--line); border-radius: var(--r-2); padding: 10px 12px; cursor: pointer; font-size: 12.5px; }
.ent-opt:hover { border-color: var(--line-strong); }
.ent-opt.on { border-color: var(--fire); background: var(--fire-soft); }
.ent-opt input { accent-color: var(--fire); margin-top: 2px; }

.sr-alert { display: flex; gap: 7px; align-items: flex-start; margin: 10px 0 2px; padding: 9px 10px; background: var(--st-red-bg); color: var(--st-red); border-radius: var(--r-2); font-size: 11.5px; line-height: 1.45; }
.sct-row { display: flex; align-items: center; gap: 9px; padding: 9px 14px; border-bottom: 1px solid var(--line); }
.sct-row:last-of-type { border-bottom: none; }
.sct-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sct-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sct-top b { font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.sct-meta { font-size: 11px; color: var(--ink-3); }
.sct-call { width: 28px; height: 28px; border-radius: var(--r-2); border: 1px solid var(--line); display: grid; place-items: center; color: var(--ink-2); flex: none; }
.sct-call:hover { border-color: var(--fire); color: var(--fire); background: var(--fire-soft); }
.sct-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--line); }

/* ---------- Tiroir historique & discussion du site ---------- */
.sd-timeline { display: flex; flex-direction: column; }
.sd-item { display: flex; gap: 11px; align-items: flex-start; padding: 12px 2px; border-bottom: 1px solid var(--line); }
.sd-item:last-child { border-bottom: none; }
.sd-item.link { cursor: pointer; }
.sd-item.link:hover { background: var(--surface-2); }
.sd-dot { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.sd-dot.c-green { background: var(--st-green-bg, var(--surface-2)); color: var(--st-green, var(--ink-2)); }
.sd-dot.c-red { background: var(--st-red-bg); color: var(--st-red); }
.sd-dot.c-blue { background: var(--st-blue-bg, var(--surface-2)); color: var(--st-blue); }
.sd-dot.c-violet { background: var(--st-violet-bg, var(--surface-2)); color: var(--st-violet); }
.sd-dot.c-amber { background: var(--st-amber-bg); color: var(--st-amber); }
.sd-dot.c-teal { background: var(--st-teal-bg, var(--surface-2)); color: var(--st-teal); }
.sd-dot.c-gray { background: var(--surface-3); color: var(--ink-3); }
.sd-body { flex: 1; min-width: 0; }
.sd-t { font-size: 13px; font-weight: 500; }
.sd-sub { font-size: 12px; color: var(--ink-2); margin-top: 1px; }
.sd-who { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 11px; color: var(--ink-3); }
.sd-who .av { width: 18px; height: 18px; font-size: 8px; }
.sd-who i { width: 3px; height: 3px; border-radius: 50%; background: var(--line-strong); }
.sd-thread { display: flex; flex-direction: column; gap: 14px; }
.sd-hint { display: flex; gap: 6px; align-items: flex-start; font-size: 11.5px; color: var(--ink-3); background: var(--surface-2); padding: 8px 10px; border-radius: var(--r-2); line-height: 1.45; }
.sd-msg { display: flex; gap: 10px; }
.sd-msg-h { display: flex; align-items: baseline; gap: 8px; }
.sd-msg-h b { font-size: 12.5px; }
.sd-msg-h span { font-size: 10.5px; color: var(--ink-3); }
.sd-msg-t { font-size: 12.5px; line-height: 1.5; margin-top: 2px; }
.sd-compose { display: flex; gap: 8px; align-items: flex-end; width: 100%; }
.sd-compose textarea { flex: 1; resize: none; }
.drawer.wide { width: 620px; max-width: 100vw; }

/* ---------- Select avec recherche ---------- */
.ss { position: relative; }
.ss-btn { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); padding: 8px 11px; font: inherit; font-size: 13px; color: var(--ink); cursor: pointer; min-height: 40px; }
.ss-btn:hover { border-color: var(--line-strong); }
.ss-btn.open { border-color: var(--fire); box-shadow: 0 0 0 3px var(--fire-soft); }
.ss-cur { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ss-cur b { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-ph { color: var(--ink-3); }
.ss-sub { font-size: 11px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.ss-pop { position: absolute; z-index: 60; top: calc(100% + 4px); left: 0; right: 0; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-2); box-shadow: 0 10px 28px rgba(0,0,0,.16); overflow: hidden; }
.ss-search { display: flex; align-items: center; gap: 7px; padding: 8px 11px; border-bottom: 1px solid var(--line); color: var(--ink-3); }
.ss-search input { flex: 1; border: none; background: none; font: inherit; font-size: 12.5px; color: var(--ink); outline: none; }
.ss-list { max-height: 260px; overflow-y: auto; }
.ss-opt { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: none; background: none; font: inherit; padding: 8px 11px; cursor: pointer; color: var(--ink); border-bottom: 1px solid var(--line); }
.ss-opt:last-child { border-bottom: none; }
.ss-opt:hover { background: var(--surface-2); }
.ss-opt.on { background: var(--fire-soft); color: var(--fire-deep); }
.ss-opt-t { display: flex; align-items: center; gap: 6px; }
.ss-opt-t b { font-size: 12.5px; font-weight: 500; }
.ss-empty { padding: 16px 11px; font-size: 12.5px; color: var(--ink-3); text-align: center; }
.ss-foot { padding: 6px 11px; border-top: 1px solid var(--line); font-size: 10.5px; color: var(--ink-3); text-align: right; }
/* colonne de gauche un peu plus large, pleine largeur en mobile */
.site-layout { grid-template-columns: 320px minmax(0, 1fr); }
@media (max-width: 1100px) {
  .site-layout { grid-template-columns: 1fr; }
  .site-layout > div:first-child { width: 100%; }
  .site-layout > div:first-child > .card { width: 100%; }
}

/* ---------- Éditeur d'arborescence (tiroir) ---------- */
.te-intro { font-size: 12.5px; color: var(--ink-2); line-height: 1.55; margin: 0 0 14px; }
.te-list { border: 1px solid var(--line); border-radius: var(--r-2); overflow: hidden; }
.te-row { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-bottom: 1px solid var(--line); position: relative; padding-left: calc(10px + var(--d) * 18px); }
.te-row:last-child { border-bottom: none; }
.te-row:hover { background: var(--surface-2); }
.te-row.root { background: var(--surface-2); }
.te-row.new { background: var(--st-green-bg); }
.te-rail { position: absolute; left: calc(10px + (var(--d) - 1) * 18px + 7px); top: 0; bottom: 0; width: 1px; background: var(--line-strong); }
.te-row.root .te-rail, .te-row[style*="--d: 0"] .te-rail { display: none; }
.te-name { flex: 1; min-width: 0; border: 1px solid transparent; background: none; border-radius: var(--r-1); padding: 4px 7px; font: inherit; font-size: 13px; color: var(--ink); }
.te-name:hover { border-color: var(--line); background: var(--surface); }
.te-name:focus { border-color: var(--fire); background: var(--surface); outline: none; }
.te-name-static { flex: 1; display: flex; align-items: center; gap: 7px; font-size: 13px; padding: 4px 0; color: var(--ink-2); }
.te-kind { flex: none; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 3px 6px; font: inherit; font-size: 11px; color: var(--ink-2); }
.te-count { flex: none; width: 68px; text-align: right; font-size: 11.5px; color: var(--ink-3); white-space: nowrap; }
.te-count i { font-style: normal; opacity: .7; }
.te-acts { flex: none; display: flex; gap: 1px; }
.te-ic { width: 24px; height: 24px; display: grid; place-items: center; border: none; background: none; border-radius: var(--r-1); color: var(--ink-3); cursor: pointer; }
.te-ic:hover:not(:disabled) { background: var(--surface-3); color: var(--ink); }
.te-ic.danger:hover:not(:disabled) { background: var(--st-red-bg); color: var(--st-red); }
.te-ic:disabled { opacity: .2; cursor: not-allowed; }
.te-add { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 10px; padding: 9px; border: 1px dashed var(--line-strong); border-radius: var(--r-2); background: none; font: inherit; font-size: 12.5px; color: var(--ink-3); cursor: pointer; }
.te-add:hover { border-color: var(--fire); color: var(--fire); }
@media (max-width: 560px) {
  .te-row { flex-wrap: wrap; }
  .te-count { width: auto; }
}

/* glisser-déposer dans l'arborescence */
.te-grip { flex: none; display: grid; place-items: center; width: 16px; color: var(--ink-3); cursor: grab; }
.te-row[draggable="true"]:active { cursor: grabbing; }
.te-row.dragging { opacity: .4; }
.te-row.drop-before { box-shadow: inset 0 2px 0 var(--fire); }
.te-row.drop-inside { background: var(--fire-soft); box-shadow: inset 2px 0 0 var(--fire); }

.te-row.drop-no { background: var(--st-red-bg); box-shadow: inset 0 0 0 1px var(--st-red); cursor: not-allowed; }
.te-refused { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 9px 12px; background: var(--st-red-bg); border: 1px solid var(--st-red); border-radius: var(--r-2); font-size: 12px; color: var(--st-red); line-height: 1.45; }
.te-refused button { margin-left: auto; flex: none; border: none; background: none; color: inherit; cursor: pointer; display: flex; padding: 2px; }
.te-rules { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 11px; color: var(--ink-3); }
.te-rules b { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; width: 100%; margin-bottom: 2px; }
.te-rules i { font-style: normal; font-weight: 600; color: var(--ink-2); }
.te-ic:disabled { opacity: .18; cursor: not-allowed; }

/* ---------- Déplacer des équipements ---------- */
.mv-eq { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 14px; }
.mv-list { border: 1px solid var(--line); border-radius: var(--r-2); max-height: 260px; overflow-y: auto; }
.mv-opt { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: none; border-bottom: 1px solid var(--line); background: none; font: inherit; cursor: pointer; color: var(--ink); padding: 8px 11px; padding-left: calc(11px + var(--d) * 16px); }
.mv-opt:last-child { border-bottom: none; }
.mv-opt:hover:not(:disabled) { background: var(--surface-2); }
.mv-opt.on { background: var(--fire-soft); color: var(--fire-deep); }
.mv-opt:disabled { opacity: .5; cursor: not-allowed; }
.mv-opt-t { flex: 1; min-width: 0; display: flex; align-items: center; gap: 7px; }
.mv-opt-t b { font-size: 12.5px; font-weight: 500; }
.mv-note { display: flex; gap: 7px; margin: 12px 0 0; font-size: 11.5px; color: var(--ink-3); line-height: 1.5; }

/* ---------- Pagination des tables ---------- */
.dt-pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-3); flex-wrap: wrap; }
.dt-pager b { color: var(--ink); }
.dt-pager-nav { display: flex; align-items: center; gap: 4px; }
.dt-pager-nav button { display: inline-flex; align-items: center; width: 28px; height: 26px; justify-content: center; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); color: var(--ink-2); cursor: pointer; }
.dt-pager-nav button svg { margin: 0 -3px; }
.dt-pager-nav button:hover:not(:disabled) { border-color: var(--fire); color: var(--fire); }
.dt-pager-nav button:disabled { opacity: .35; cursor: not-allowed; }
.dt-pager-cur { padding: 0 8px; white-space: nowrap; }
.ti { position: relative; }
.ti-x { border: none; background: none; padding: 0 2px; display: inline-flex; color: var(--ink-3); cursor: pointer; }
.ti-x:hover { color: var(--fire); }

/* ---------- Carte Programme de maintenance (fiche site) ---------- */
.progcard-strip { display: flex; align-items: center; gap: 16px; padding: 14px; flex-wrap: wrap; }
.progcard-strip .prog-meta { margin-left: auto; }
@media (max-width: 720px) { .progcard-strip .prog-meta { margin-left: 0; } }

/* ---------- Ligne d'avancement mensuel sous le programme annuel ---------- */
.pm2-foot td { border-top: 2px solid var(--line-strong); background: var(--surface-2); }
.pm2-foot .sticky-l { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); white-space: nowrap; }
.pm2-late { display: block; margin-top: 3px; font-size: 9.5px; font-weight: 700; color: var(--st-red); white-space: nowrap; }
.pm2-fig.todo { color: var(--ink-3); }
.pm2-bar.todo i { background: var(--line-strong); }

/* ---------- Navigation de semaine (planning) ---------- */
.weeknav { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.weeknav-b { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); color: var(--ink-2); cursor: pointer; }
.weeknav-b:hover { border-color: var(--fire); color: var(--fire); }
.weeknav-lbl { font-size: 14px; text-transform: capitalize; }
.weeknav-today { border: none; background: none; font: inherit; font-size: 12px; color: var(--fire); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.weeknav-sem { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--ink-3); background: var(--surface-2); border: 1px solid var(--line); border-radius: 20px; padding: 2px 9px; }

/* ---------- Poste de dispatch / optimiseur de tournées ---------- */
.dsp { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 14px; align-items: start; }
.dsp-pool { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); position: sticky; top: 12px; max-height: calc(100vh - 120px); display: flex; flex-direction: column; }
.dsp-pool-h { display: flex; align-items: center; gap: 8px; padding: 12px 12px 10px; }
.dsp-pool-f { display: flex; gap: 5px; flex-wrap: wrap; padding: 0 10px 10px; border-bottom: 1px solid var(--line); }
.dsp-pool-b { overflow-y: auto; padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.dsp-card { border: 1px solid var(--line); border-radius: var(--r-2); padding: 9px 10px; cursor: grab; background: var(--surface); }
.dsp-card:hover { border-color: var(--line-strong); }
.dsp-card.late { border-left: 3px solid var(--st-red); }
.dsp-card.sel { border-color: var(--fire); box-shadow: 0 0 0 2px var(--fire-soft); }
.dsp-card-t { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.dsp-card-t b { font-size: 12.5px; font-weight: 600; }
.dsp-card-m { display: flex; align-items: center; gap: 8px; margin-top: 7px; font-size: 11px; color: var(--ink-3); flex-wrap: wrap; }
.dsp-card-act { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--line); }
.dsp-assign { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line); background: var(--surface-2); border-radius: 20px; padding: 3px 9px 3px 4px; font: inherit; font-size: 11px; cursor: pointer; color: var(--ink-2); }
.dsp-assign:hover:not(:disabled) { border-color: var(--fire); color: var(--fire); }
.dsp-assign:disabled { opacity: .35; cursor: not-allowed; }
.dsp-main { min-width: 0; }
.dsp-lanes { display: flex; flex-direction: column; gap: 12px; }
.dsp-days { display: flex; gap: 6px; flex-wrap: wrap; }
.dsp-day { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 6px 12px; font: inherit; font-size: 12.5px; color: var(--ink-2); cursor: pointer; }
.dsp-day span { font-size: 10.5px; color: var(--ink-3); }
.dsp-day.today { border-color: var(--ink-2); }
.dsp-day.on { background: var(--coal); color: #fff; border-color: var(--coal); }
.dsp-day.on span { color: rgba(255,255,255,.7); }
.dsp-lane { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); transition: background .12s, border-color .12s; }
.dsp-lane.over { border-color: var(--fire); background: var(--fire-soft); }
.dsp-lane.full { border-color: var(--st-red); }
.dsp-lane-h { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.dsp-dot { width: 8px; height: 26px; border-radius: 3px; flex: none; }
.dsp-dot.st-blue { background: var(--st-blue); } .dsp-dot.st-teal { background: var(--st-teal); } .dsp-dot.st-amber { background: var(--st-amber); } .dsp-dot.st-violet { background: var(--st-violet); } .dsp-dot.st-green { background: var(--st-green); }
.dsp-gauge { display: flex; align-items: center; gap: 8px; }
.dsp-gauge-track { width: 110px; height: 7px; background: var(--surface-3); border-radius: 20px; overflow: hidden; }
.dsp-gauge-track i { display: block; height: 100%; border-radius: 20px; }
.dsp-gauge .num { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.dsp-lane-warn { display: flex; align-items: center; gap: 7px; padding: 7px 12px; background: var(--st-red-bg); color: var(--st-red); font-size: 11.5px; }
.dsp-stops { padding: 8px; display: flex; flex-direction: column; gap: 5px; }
.dsp-stop { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface-2); cursor: grab; }
.dsp-stop b { font-size: 12.5px; font-weight: 500; }
.dsp-seq { width: 20px; height: 20px; border-radius: 50%; background: var(--coal); color: #fff; font-size: 10.5px; font-weight: 700; display: grid; place-items: center; flex: none; }
.dsp-x { border: none; background: none; color: var(--ink-3); cursor: pointer; display: flex; padding: 3px; border-radius: var(--r-1); flex: none; }
.dsp-x:hover { background: var(--st-red-bg); color: var(--st-red); }
.dsp-drop { text-align: center; padding: 14px; font-size: 12px; color: var(--ink-3); border: 1px dashed var(--line-strong); border-radius: var(--r-2); }
.dsp-lane-f { display: flex; gap: 8px; justify-content: flex-end; padding: 0 10px 10px; }
.dsp-legend { display: flex; gap: 16px; margin-top: 10px; font-size: 11.5px; color: var(--ink-2); flex-wrap: wrap; }
.dsp-legend .dot { width: 9px; height: 9px; border-radius: 2px; display: inline-block; margin-right: 5px; }
.dsp-legend .dot.st-blue { background: var(--st-blue); } .dsp-legend .dot.st-teal { background: var(--st-teal); } .dsp-legend .dot.st-amber { background: var(--st-amber); } .dsp-legend .dot.st-violet { background: var(--st-violet); } .dsp-legend .dot.st-green { background: var(--st-green); } .dsp-legend .dot.st-gray { background: var(--ink-3); }
.dsp-applied { display: flex; align-items: center; gap: 9px; margin-bottom: 14px; background: var(--st-green-bg); border-color: transparent; font-size: 12.5px; color: var(--st-green); }
.dsp-diff { border: 1px solid var(--fire); border-radius: var(--r-3); background: var(--surface); margin-bottom: 14px; overflow: hidden; }
.dsp-diff-h { display: flex; align-items: center; gap: 10px; padding: 11px 13px; background: var(--fire-soft); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.dsp-diff-b { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; padding: 13px; }
.dsp-diff-stops { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.dsp-diff-stops li { font-size: 12px; display: flex; align-items: baseline; gap: 6px; }
.dsp-diff-add { color: var(--st-green); font-weight: 700; }
.dsp-diff-no { color: var(--st-red); font-weight: 700; }
@media (max-width: 1100px) { .dsp { grid-template-columns: 1fr; } .dsp-pool { position: static; max-height: none; } }
.dsp-assign.warn { border-color: var(--st-amber); color: var(--st-amber); }

/* carte et lanes simultanées */
.dsp.with-map { grid-template-columns: 290px minmax(0, 1fr) 340px; }
.dsp-map { position: sticky; top: 12px; }
.weeknav-map { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 6px 11px; font: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer; }
.weeknav-map.on { background: var(--coal); color: #fff; border-color: var(--coal); }
@media (max-width: 1400px) { .dsp.with-map { grid-template-columns: 280px minmax(0, 1fr); } .dsp.with-map .dsp-map { grid-column: 1 / -1; position: static; } }
@media (max-width: 1100px) { .dsp, .dsp.with-map { grid-template-columns: 1fr; } .dsp-pool { position: static; max-height: none; } }

/* ---------- Dispatch v2 : backlog | carte large + planning ---------- */
.dsp2 { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 14px; align-items: start; }
.dsp-right { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.dsp-mapbig { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); overflow: hidden; }
.dsp-mapbig .dsp-legend { padding: 10px 12px; margin: 0; border-top: 1px solid var(--line); }
.dsp-leg { display: inline-flex; align-items: center; border: 1px solid var(--line); background: var(--surface); border-radius: 20px; padding: 3px 10px; font: inherit; font-size: 11.5px; color: var(--ink-2); cursor: pointer; }
.dsp-leg.on { border-color: var(--fire); color: var(--fire-deep); background: var(--fire-soft); font-weight: 600; }
.dsp-leg.static { border-color: transparent; cursor: default; }
.dsp-tally { font-size: 12px; color: var(--ink-2); }
.dsp-tally-late { color: var(--st-red); font-weight: 600; }
/* planning des créneaux */
.dsp-board { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); overflow: hidden; }
.dsp-board-h, .dsp-brow { display: grid; }
.dsp-board-h { background: var(--surface-2); border-bottom: 1px solid var(--line); }
.dsp-bh { padding: 8px 10px; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); border-left: 1px solid var(--line); }
.dsp-bh:first-child { border-left: none; }
.dsp-bh span { text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--ink-3); }
.dsp-bh.today { color: var(--ink); background: var(--surface-3); }
.dsp-brow { border-bottom: 1px solid var(--line); }
.dsp-brow:last-child { border-bottom: none; }
.dsp-btech { display: flex; align-items: center; gap: 8px; padding: 9px 10px; }
.dsp-cell { border-left: 1px solid var(--line); padding: 7px; min-height: 76px; display: flex; flex-direction: column; gap: 4px; transition: background .12s; }
.dsp-cell.over { background: var(--fire-soft); box-shadow: inset 0 0 0 1px var(--fire); }
.dsp-cell.full { background: var(--st-red-bg); }
.dsp-cell-empty { color: var(--line-strong); text-align: center; margin: auto; font-size: 13px; }
.dsp-cell-h { display: flex; align-items: center; gap: 5px; }
.dsp-cell-h .num { font-size: 9.5px; color: var(--ink-3); white-space: nowrap; }
.dsp-cell-h .dsp-gauge-track { width: 34px; flex: none; }
.dsp-mini { border: none; background: none; color: var(--ink-3); cursor: pointer; padding: 1px; display: flex; margin-left: auto; }
.dsp-mini:hover:not(:disabled) { color: var(--fire); }
.dsp-mini:disabled { opacity: .25; cursor: not-allowed; }
.dsp-chip { display: flex; align-items: center; gap: 5px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-1); padding: 3px 4px; cursor: grab; }
.dsp-chip-t { flex: 1; min-width: 0; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dsp-chip .dsp-seq { width: 15px; height: 15px; font-size: 9px; }
.dsp-cell-warn { display: flex; align-items: center; gap: 4px; font-size: 9.5px; font-weight: 700; color: var(--st-red); }
@media (max-width: 1100px) { .dsp2 { grid-template-columns: 1fr; } .dsp-pool { position: static; max-height: none; } }
@media (max-width: 760px) { .dsp-board-h, .dsp-brow { grid-template-columns: 1fr !important; } .dsp-cell { border-left: none; border-top: 1px solid var(--line); } }

/* ---------- Équipe affectée (client / site) ---------- */
.asg-row { display: flex; align-items: center; gap: 10px; padding: 9px 14px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.asg-row:last-child { border-bottom: none; }
.asg-lbl { font-size: 11.5px; color: var(--ink-3); width: 150px; flex: none; }
.asg-people { display: flex; gap: 5px; flex-wrap: wrap; flex: 1; min-width: 0; }
.asg-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--surface-2); border-radius: 20px; padding: 2px 10px 2px 3px; font: inherit; font-size: 12px; color: var(--ink); cursor: pointer; }
.asg-chip:hover { border-color: var(--fire); color: var(--fire); }
.asg-head { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.asg-hint { font-size: 11.5px; color: var(--ink-3); margin: 2px 0 7px; line-height: 1.45; }
.asg-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px; }
.asg-opt { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 6px 9px; font: inherit; cursor: pointer; text-align: left; color: var(--ink); }
.asg-opt:hover { border-color: var(--line-strong); }
.asg-opt.on { border-color: var(--fire); background: var(--fire-soft); color: var(--fire-deep); }
.asg-opt b { font-size: 12.5px; font-weight: 500; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.asg-clear { margin-top: 7px; display: inline-flex; align-items: center; gap: 4px; border: none; background: none; font: inherit; font-size: 11.5px; color: var(--ink-3); cursor: pointer; }
.asg-clear:hover { color: var(--fire); }

/* Équipe affectée — tuiles par rôle */
.asg-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1px; background: var(--line); }
.asg-tile { background: var(--surface); padding: 11px 13px 12px; min-width: 0; }
.asg-tile.vacant { background: var(--surface-2); }
.asg-tile-h { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 9px; }
.asg-tile-h span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asg-own { font-style: normal; font-size: 9px; letter-spacing: .04em; color: var(--st-blue); background: var(--st-blue-bg); border-radius: 20px; padding: 1px 6px; flex: none; }
.asg-list { display: flex; flex-direction: column; gap: 7px; }
.asg-person { display: flex; align-items: center; gap: 9px; border: none; background: none; padding: 0; font: inherit; cursor: pointer; text-align: left; color: var(--ink); min-width: 0; }
.asg-person b { font-size: 12.5px; font-weight: 500; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.asg-person .sub-cell { display: block; }
.asg-person:hover b { color: var(--fire); }
.asg-add { display: inline-flex; align-items: center; gap: 5px; border: 1px dashed var(--line-strong); background: none; border-radius: var(--r-2); padding: 6px 10px; font: inherit; font-size: 11.5px; color: var(--ink-3); cursor: pointer; }
.asg-add:hover { border-color: var(--fire); color: var(--fire); }

/* pile d'avatars (colonnes de liste) */
.avstack { display: inline-flex; align-items: center; }
.avstack-i { display: inline-flex; margin-left: -7px; }
.avstack-i:first-child { margin-left: 0; }
.avstack-i .av { border: 2px solid var(--surface); }
.avstack-more { margin-left: -7px; width: 24px; height: 24px; border-radius: 50%; background: var(--surface-3); border: 2px solid var(--surface); color: var(--ink-2); font-size: 9.5px; font-weight: 700; display: grid; place-items: center; }
/* sélecteur de personnes */
.pp-sel { display: flex; gap: 5px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
.pp-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--fire-soft); border: 1px solid var(--fire); color: var(--fire-deep); border-radius: 20px; padding: 2px 4px 2px 3px; font-size: 11.5px; }
.pp-chip button { border: none; background: none; color: inherit; cursor: pointer; display: flex; padding: 2px; border-radius: 50%; }
.pp-chip button:hover { background: rgba(0,0,0,.08); }
.pp-count { font-size: 11px; color: var(--ink-3); }
.pp-search { margin-bottom: 7px; }
.pp-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 5px; max-height: 200px; overflow-y: auto; }
.pp-opt { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 6px 9px; font: inherit; cursor: pointer; text-align: left; color: var(--ink); }
.pp-opt:hover { border-color: var(--line-strong); }
.pp-opt.on { border-color: var(--fire); background: var(--fire-soft); color: var(--fire-deep); }
.pp-opt b { font-size: 12.5px; font-weight: 500; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pp-opt .sub-cell { display: block; }
/* variante compacte de la carte (fiche client) */
.asg-grid.compact { grid-template-columns: 1fr; }
.asg-grid.compact .asg-tile { padding: 9px 12px; display: grid; grid-template-columns: 118px 1fr; align-items: center; gap: 10px; }
.asg-grid.compact .asg-tile-h { margin: 0; }

/* tiroir d'affectation resserré */
.asgd { border: 1px solid var(--line); border-radius: var(--r-2); overflow: visible; }
.asgd-row { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 14px; padding: 12px 13px; border-bottom: 1px solid var(--line); align-items: start; }
.asgd-row:last-child { border-bottom: none; }
.asgd-lbl b { font-size: 12.5px; display: block; }
.asgd-lbl span { font-size: 11px; color: var(--ink-3); line-height: 1.4; display: block; margin-top: 2px; }
.asgd-val { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; min-width: 0; }
.asgd-chips { display: flex; gap: 5px; flex-wrap: wrap; }
.asgd-inh { display: flex; gap: 7px; align-items: center; flex-wrap: wrap; }
.asgd-ghost { display: inline-flex; align-items: center; gap: 6px; border: 1px dashed var(--line-strong); border-radius: 20px; padding: 2px 10px 2px 3px; font-size: 11.5px; color: var(--ink-3); }
.psel { position: relative; }
.psel-btn { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line-strong); background: var(--surface); border-radius: var(--r-2); padding: 5px 11px; font: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer; }
.psel-btn:hover { border-color: var(--fire); color: var(--fire); }
.psel-pop { position: absolute; z-index: 70; top: calc(100% + 4px); left: 0; width: 268px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-2); box-shadow: 0 10px 28px rgba(0,0,0,.16); overflow: hidden; }
.psel-search { display: flex; align-items: center; gap: 7px; padding: 8px 11px; border-bottom: 1px solid var(--line); color: var(--ink-3); }
.psel-search input { flex: 1; border: none; background: none; font: inherit; font-size: 12.5px; color: var(--ink); outline: none; }
.psel-list { max-height: 230px; overflow-y: auto; }
.psel-opt { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: none; background: none; font: inherit; padding: 7px 11px; cursor: pointer; color: var(--ink); border-bottom: 1px solid var(--line); }
.psel-opt:last-child { border-bottom: none; }
.psel-opt:hover { background: var(--fire-soft); }
.psel-opt b { font-size: 12.5px; font-weight: 500; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.psel-opt .sub-cell { display: block; }
@media (max-width: 620px) { .asgd-row { grid-template-columns: 1fr; gap: 8px; } }

/* la grille de tuiles tient aussi dans une colonne étroite */
@container (max-width: 340px) { .asg-grid { grid-template-columns: 1fr; } }
.asg-card-wrap { container-type: inline-size; }

.pp-chip-role { font-style: normal; font-size: 10px; opacity: .7; padding-left: 2px; }
.psel-grp { padding: 7px 11px 4px; font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); background: var(--surface-2); border-bottom: 1px solid var(--line); }

/* ---------- Plan de site : localisation des équipements ---------- */
.plan-wrap2 { display: flex; flex-direction: column; gap: 9px; }
.plan { position: relative; border: 1px solid var(--line-strong); border-radius: var(--r-2); overflow: hidden; background: var(--surface-2); }
.plan.placing { cursor: crosshair; box-shadow: inset 0 0 0 2px var(--fire); }
.plan-bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.plan-hint { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-3); background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 3px 11px; white-space: nowrap; }
.plan-pin { position: absolute; transform: translate(-50%, -50%); width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--surface); background: var(--st-teal); color: #fff; font-size: 8.5px; font-weight: 800; letter-spacing: -.02em; display: grid; place-items: center; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.28); transition: transform .12s, opacity .12s; }
.plan-pin:hover { transform: translate(-50%, -50%) scale(1.14); z-index: 4; }
.plan-pin.bad { background: var(--st-red); }
.plan-pin.dim { opacity: .34; width: 22px; height: 22px; font-size: 7.5px; }
.plan-pin.on { background: var(--fire); width: 38px; height: 38px; font-size: 10px; z-index: 6; box-shadow: 0 0 0 6px var(--fire-soft), 0 2px 8px rgba(0,0,0,.3); }
.plan-pin-lbl { position: absolute; top: calc(100% + 5px); left: 50%; transform: translateX(-50%); font-style: normal; font-family: var(--font-mono); font-size: 10px; font-weight: 700; color: var(--fire-deep); background: var(--surface); border: 1px solid var(--fire); border-radius: 20px; padding: 1px 7px; white-space: nowrap; }
.plan-crosshair { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 9px; background: var(--coal); color: #fff; font-size: 12px; border-radius: var(--r-2); padding: 6px 12px; z-index: 8; }
.plan-crosshair button { border: none; background: rgba(255,255,255,.18); color: #fff; font: inherit; font-size: 11px; border-radius: var(--r-1); padding: 2px 8px; cursor: pointer; }
.plan-foot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.plan-legend { display: flex; align-items: center; gap: 14px; font-size: 11.5px; color: var(--ink-2); flex-wrap: wrap; }
.plan-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--st-teal); display: inline-block; margin-right: 5px; }
.plan-dot.bad { background: var(--st-red); }
.plan-tag { width: 30px; flex: none; font-family: var(--font-mono); font-size: 9px; font-weight: 800; color: var(--ink-2); background: var(--surface-3); border-radius: var(--r-1); padding: 3px 0; text-align: center; }

.tree-plan { padding: 4px 12px 12px 26px; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.plan-flag { flex: none; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--surface-3); color: var(--ink-3); }
.plan-flag.ok { background: var(--st-teal-bg, var(--st-green-bg)); color: var(--st-teal); }

.tree-plan { padding: 10px 12px 12px; background: var(--surface-2); border-top: 1px solid var(--line); }
.tree-plan-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.plan-drop { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 22px 16px; border: 1px dashed var(--line-strong); border-radius: var(--r-2); background: var(--surface); text-align: center; cursor: pointer; }
.plan-drop:hover { border-color: var(--fire); }
.plan-drop b { font-size: 12.5px; }
.plan-drop i { font-style: normal; font-size: 11.5px; color: var(--ink-3); line-height: 1.45; }
.plan-drop i span { color: var(--fire); text-decoration: underline; text-underline-offset: 2px; }
.plan-drop em { font-style: normal; font-size: 10.5px; color: var(--ink-3); margin-top: 4px; }

/* ---------- Carte GPS du site (repères de bâtiments) ---------- */
.geomap { position: relative; border: 1px solid var(--line-strong); border-radius: var(--r-2); overflow: hidden; background: var(--surface-2); }
.geomap-parcel { position: absolute; top: 8px; left: 10px; font-family: var(--font-mono); font-size: 9.5px; color: var(--ink-3); }
.geo-pin { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 3px; border: none; background: none; cursor: pointer; padding: 0; }
.geo-pin > span:first-child, .geo-pin svg { }
.geo-pin i { font-style: normal; font-size: 10px; font-weight: 600; color: var(--ink-2); background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 1px 7px; white-space: nowrap; }
.geo-pin::before { content: ""; position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); width: 30px; height: 30px; border-radius: 50%; background: var(--st-teal); border: 2px solid var(--surface); box-shadow: 0 1px 4px rgba(0,0,0,.26); }
.geo-pin svg { position: relative; z-index: 2; color: #fff; }
.geo-pin.on::before { width: 40px; height: 40px; background: var(--fire); box-shadow: 0 0 0 7px var(--fire-soft), 0 2px 8px rgba(0,0,0,.3); }
.geo-pin.on i { color: var(--fire-deep); border-color: var(--fire); font-weight: 700; margin-top: 8px; }
.geo-pin.dim { opacity: .45; }
.geo-pin:hover { z-index: 5; }

.plan-scope { display: flex; gap: 7px; align-items: flex-start; margin-bottom: 8px; font-size: 11.5px; color: var(--ink-2); background: var(--st-blue-bg); border-radius: var(--r-2); padding: 7px 10px; line-height: 1.45; }
.plan-pin.scoped { box-shadow: 0 0 0 4px var(--fire-soft), 0 1px 4px rgba(0,0,0,.28); background: var(--fire); z-index: 5; }
.plan-pin.scoped.bad { background: var(--st-red); box-shadow: 0 0 0 4px var(--st-red-bg), 0 1px 4px rgba(0,0,0,.28); }

/* ---------- Tiroir d'affectation : une carte par rôle ---------- */
.asgd { display: grid; gap: 10px; border: none; }
.asgc { border: 1px solid var(--line); border-radius: var(--r-3); padding: 12px 14px 13px; background: var(--surface); }
.asgc.empty { background: var(--surface-2); border-style: dashed; }
.asgc.set { border-left: 3px solid var(--fire); }
.asgc-h { display: flex; align-items: center; gap: 8px; }
.asgc-t { font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); flex: 1; min-width: 0; }
.asgc-n { font-size: 10.5px; font-weight: 700; color: var(--fire); background: var(--fire-soft); border-radius: 20px; padding: 1px 8px; }
.asgc-hint { margin: 4px 0 11px; font-size: 11.5px; color: var(--ink-3); line-height: 1.45; }
.asgc-people { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.asgc-p { display: inline-flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 30px; padding: 3px 6px 3px 3px; background: var(--surface); min-width: 0; }
.asgc-p b { font-size: 12.5px; font-weight: 500; display: block; white-space: nowrap; }
.asgc-p i { font-style: normal; font-size: 10.5px; color: var(--ink-3); display: block; white-space: nowrap; }
.asgc-p button { flex: none; border: none; background: none; color: var(--ink-3); cursor: pointer; display: flex; padding: 4px; border-radius: 50%; }
.asgc-p button:hover { background: var(--st-red-bg); color: var(--st-red); }
.asgc-p.ghost { border-style: dashed; opacity: .72; }
.asgc-people .psel-btn { border-style: dashed; border-radius: 30px; padding: 8px 13px; }

.avstack-more { flex: none; box-sizing: content-box; min-width: 24px; line-height: 1; white-space: nowrap; padding: 0; }
.avstack { flex-wrap: nowrap; white-space: nowrap; }

.avstack { display: inline-flex; flex-wrap: nowrap; align-items: center; white-space: nowrap; }
.avstack-i { flex: 0 0 auto; }
.avstack-more { flex: 0 0 auto; box-sizing: border-box; width: 26px; height: 26px; min-width: 26px; max-width: 26px; padding: 0; line-height: 26px; text-align: center; display: inline-block; overflow: visible; word-break: keep-all; hyphens: none; }
td[data-th="Équipe"] { white-space: nowrap; min-width: 96px; }

/* ---------- Campagnes de vérification ---------- */
.cp-bar { display: flex; height: 7px; border-radius: 20px; overflow: hidden; background: var(--surface-3); gap: 1px; }
.cp-bar.lg { height: 10px; }
.cp-bar i { display: block; }
.cp-bar .seg-todo { background: var(--line-strong); }
.cp-bar .seg-draft { background: var(--ink-3); }
.cp-bar .seg-planned { background: var(--st-blue); }
.cp-bar .seg-field { background: var(--st-violet); }
.cp-bar .seg-done { background: var(--st-teal); }
.cp-bar .seg-validated { background: var(--st-green); }
.cp-head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.cp-prog { flex: 1; min-width: 220px; }
.cp-prog-t { display: block; margin-top: 6px; font-size: 12px; color: var(--ink-2); }
.cp-kb { display: grid; grid-template-columns: repeat(6, minmax(168px, 1fr)); gap: 10px; align-items: start; overflow-x: auto; padding-bottom: 6px; }
.cp-col { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-3); min-height: 120px; }
.cp-col.over { background: var(--fire-soft); border-color: var(--fire); }
.cp-col-h { display: flex; align-items: center; gap: 8px; padding: 9px 11px; border-bottom: 1px solid var(--line); }
.cp-col-h .num { margin-left: auto; font-size: 11.5px; color: var(--ink-3); }
.cp-col-b { padding: 8px; display: flex; flex-direction: column; gap: 7px; }
.cp-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); padding: 8px 9px; cursor: grab; }
.cp-card:hover { border-color: var(--line-strong); }
.cp-card.late { border-left: 3px solid var(--st-red); }
.cp-card b { font-size: 12.5px; font-weight: 600; display: block; margin: 3px 0 1px; }
.cp-card-h { display: flex; align-items: center; gap: 6px; }
.cp-card-h .num { font-size: 10.5px; color: var(--ink-3); }
.cp-nomis { font-size: 10px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--ink-3); }
.cp-card-f { display: flex; align-items: center; gap: 6px; margin-top: 7px; flex-wrap: wrap; }
.cp-empty { text-align: center; color: var(--line-strong); padding: 14px 0; }
.cp-add { border: 1px dashed var(--line-strong); background: none; border-radius: var(--r-2); padding: 8px; font: inherit; font-size: 11.5px; color: var(--ink-3); cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 5px; }
.cp-add:hover { color: var(--fire); border-color: var(--fire); }
@media (max-width: 1100px) { .cp-kb { grid-template-columns: repeat(6, 168px); } }
.cp-next { margin-left: auto; flex: none; width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); color: var(--ink-3); cursor: pointer; }
.cp-next:hover { border-color: var(--fire); color: var(--fire); }

.cp-head { margin-bottom: 12px; }
.cp-filters { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.cp-filters .cp-search { flex: 0 0 250px; max-width: 100%; min-width: 0; min-height: 34px; }
.cp-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; flex: 1; min-width: 0; }
.cp-chips .fchip { min-height: 34px; display: inline-flex; align-items: center; }
@media (max-width: 720px) { .cp-filters .cp-search { flex-basis: 100%; } }

/* backlog + kanban */
.cp-layout { display: grid; grid-template-columns: 268px minmax(0, 1fr); gap: 12px; align-items: start; }
.cp-backlog { border: 1px solid var(--line-strong); border-radius: var(--r-3); background: var(--surface); position: sticky; top: 12px; }
.cp-backlog.over { border-color: var(--fire); background: var(--fire-soft); }
.cp-backlog-h { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.cp-backlog-h b { font-size: 13px; }
.cp-backlog-b { padding: 8px; display: flex; flex-direction: column; gap: 7px; max-height: 560px; overflow-y: auto; }
.cp-card.bl { border-style: dashed; }
.cp-kb { grid-template-columns: repeat(5, minmax(158px, 1fr)); }
@media (max-width: 1240px) { .cp-layout { grid-template-columns: 1fr; } .cp-backlog { position: static; } .cp-kb { grid-template-columns: repeat(5, 158px); } }

/* ---------- Campagnes du mois (programme de maintenance) ---------- */
.mc-h { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 14px 16px; }
.mc { border-top: 1px solid var(--line); }
.mc-lbl { padding: 10px 16px 6px; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.mc-empty { display: flex; align-items: center; gap: 12px; padding: 4px 16px 14px; flex-wrap: wrap; color: var(--ink-3); }
.mc-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 16px; border: none; border-top: 1px solid var(--line); background: none; font: inherit; color: var(--ink); cursor: pointer; }
.mc-row:hover { background: var(--surface-2); }
.mc-row b { font-size: 13px; font-weight: 500; }
.mc-dot { flex: none; width: 8px; height: 26px; border-radius: 3px; background: var(--fire); }
.mc-new { display: flex; align-items: center; gap: 8px; padding: 10px 16px 14px; flex-wrap: wrap; border-top: 1px solid var(--line); }
.mc-add { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; padding: 11px; border: none; border-top: 1px dashed var(--line-strong); background: none; font: inherit; font-size: 12.5px; color: var(--fire); cursor: pointer; }
.mc-add:hover { background: var(--fire-soft); }
.reg-metier-tab { display: inline-flex; width: auto; vertical-align: middle; }
.fchip { vertical-align: middle; }

/* périmètre de campagne : boutons-bascule */
.mc-new { display: block; padding: 12px 16px 14px; }
.mc-scope-h { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.mc-scope-lbl { flex: 1; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.mc-all { border: none; background: none; font: inherit; font-size: 11.5px; color: var(--fire); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.mc-scope { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 7px; }
.mc-tog { display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 8px 11px; font: inherit; color: var(--ink); cursor: pointer; text-align: left; }
.mc-tog:hover { border-color: var(--line-strong); }
.mc-tog.on { border-color: var(--fire); background: var(--fire-soft); color: var(--fire-deep); }
.mc-tog b { display: block; font-size: 12.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mc-tog i { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.mc-tog.on i { color: var(--fire-deep); opacity: .8; }
.mc-tog-ck { flex: none; width: 17px; height: 17px; border: 1.5px solid var(--line-strong); border-radius: 5px; display: grid; place-items: center; background: var(--surface); }
.mc-tog.on .mc-tog-ck { background: var(--fire); border-color: var(--fire); color: #fff; }
.mc-new-f { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.mc-new-f .sub-cell { flex: 1; min-width: 140px; }

/* ---------- Campagne : cycle de vie & statistiques ---------- */
.cp-state { display: flex; align-items: center; gap: 9px; padding: 10px 14px; border-radius: var(--r-2); margin-bottom: 12px; font-size: 12.5px; }
.cp-state.done { background: var(--st-teal-bg, var(--st-green-bg)); color: var(--st-teal); }
.cp-state.archived { background: var(--surface-2); color: var(--ink-2); border: 1px solid var(--line); }
.cp-refresh { display: flex; align-items: center; gap: 8px; padding: 9px 13px; border-radius: var(--r-2); margin-bottom: 12px; font-size: 12.5px; background: var(--surface-2); color: var(--ink-2); border: 1px solid var(--line); }
.cp-refresh.new { background: var(--st-blue-bg); border-color: transparent; color: var(--st-blue); }
.cp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 10px; margin-bottom: 14px; }
.cp-stat { border: 1px solid var(--line); border-radius: var(--r-3); padding: 11px 13px; background: var(--surface); display: flex; flex-direction: column; gap: 2px; }
.cp-stat.ok { border-color: var(--st-teal); }
.cp-stat.bad { border-color: var(--st-red); background: var(--st-red-bg); }
.cp-stat-v { font-size: 24px; font-weight: 600; line-height: 1.05; font-variant-numeric: tabular-nums; }
.cp-stat-v i { font-style: normal; font-size: 13px; color: var(--ink-3); font-weight: 500; }
.cp-stat-l { font-size: 11.5px; color: var(--ink-2); }
.cp-stat-s { font-size: 10.5px; color: var(--ink-3); }
.cp-stat-bar { display: block; height: 4px; border-radius: 20px; background: var(--surface-3); overflow: hidden; margin-top: 5px; }
.cp-stat-bar i { display: block; height: 100%; border-radius: 20px; }

/* ---------- Interventions : stats & rattachement campagne ---------- */
.mi-stats { display: flex; align-items: center; gap: 8px; margin: 10px 0 12px; flex-wrap: wrap; }
.mi-stat { display: inline-flex; align-items: baseline; gap: 6px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 6px 12px; font: inherit; cursor: pointer; color: var(--ink); }
.mi-stat:hover { border-color: var(--fire); }
.mi-stat b { font-size: 16px; font-variant-numeric: tabular-nums; }
.mi-stat span { font-size: 11.5px; color: var(--ink-2); }
.mi-stat.bad { border-color: var(--st-red); background: var(--st-red-bg); }
.mi-stat.bad b, .mi-stat.bad span { color: var(--st-red); }
.mi-stat-tot { margin-left: auto; font-size: 11.5px; color: var(--ink-3); }
.cp-tag { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--st-teal); background: var(--st-teal-bg, var(--st-green-bg)); color: var(--st-teal); border-radius: 20px; padding: 1px 8px 1px 6px; font: inherit; font-size: 10.5px; font-weight: 600; cursor: pointer; max-width: 100%; }
.cp-tag:hover { background: var(--st-teal); color: #fff; }

/* ---------- Mission : pipeline, parc, campagnes ---------- */
.mis-pipe { display: flex; align-items: center; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); margin-bottom: 14px; overflow-x: auto; }
.mis-pipe.off { gap: 10px; background: var(--st-red-bg); border-color: transparent; color: var(--st-red); font-size: 12.5px; }
.mis-step { display: flex; align-items: center; gap: 7px; padding: 0 12px 0 0; flex: none; position: relative; }
.mis-step:not(:last-child)::after { content: ""; width: 18px; height: 1px; background: var(--line-strong); margin-left: 4px; }
.mis-dot { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 10.5px; font-weight: 700; background: var(--surface-3); color: var(--ink-3); flex: none; }
.mis-lbl { font-size: 11.5px; color: var(--ink-3); white-space: nowrap; }
.mis-step.past .mis-dot { background: var(--st-teal); color: #fff; }
.mis-step.past .mis-lbl { color: var(--ink-2); }
.mis-step.on .mis-dot { background: var(--fire); color: #fff; box-shadow: 0 0 0 4px var(--fire-soft); }
.mis-step.on .mis-lbl { color: var(--fire-deep); font-weight: 600; }
.mis-parc { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; }
.mis-fam { display: inline-flex; align-items: baseline; gap: 6px; border: 1px solid var(--line); border-radius: var(--r-2); padding: 5px 11px; font-size: 11.5px; color: var(--ink-2); }
.mis-fam b { font-size: 14px; color: var(--ink); }
.mis-parc-warn { display: flex; align-items: center; gap: 7px; padding: 9px 16px; border-top: 1px solid var(--line); background: var(--st-amber-bg); color: var(--st-amber); font-size: 12px; }
.cp-tagdot { width: 8px; height: 8px; border-radius: 2px; background: var(--st-blue); flex: none; }
.mis-attach { padding: 11px 16px 13px; border-top: 1px solid var(--line); background: var(--surface-2); }
.mis-attach-o { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 7px 10px; font: inherit; font-size: 12.5px; color: var(--ink); cursor: pointer; margin-bottom: 5px; }
.mis-attach-o:hover { border-color: var(--fire); color: var(--fire-deep); }
.mis-attach-o b { flex: 1; min-width: 0; font-weight: 500; }

.mis-doc-ic { width: 28px; height: 28px; border-radius: var(--r-2); display: grid; place-items: center; flex: none; background: var(--surface-2); color: var(--ink-2); }
.mis-doc-ic.invoice { background: var(--st-blue-bg); color: var(--st-blue); }
.mis-doc-ic.doc { background: var(--st-green-bg); color: var(--st-teal); }
.mis-doc-ic.quote { background: var(--surface-3); }

/* ---------- Prise de dépannage ---------- */
.dep { display: grid; grid-template-columns: minmax(0, 1.35fr) 340px; gap: 14px; align-items: start; padding-bottom: 70px; }
.dep-timer { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 20px; padding: 5px 12px; font-size: 12.5px; color: var(--ink-2); }
.dep-timer i { width: 7px; height: 7px; border-radius: 50%; background: var(--st-red); animation: dep-pulse 1.6s ease-in-out infinite; }
@keyframes dep-pulse { 0%, 100% { opacity: 1 } 50% { opacity: .25 } }
.dep-form { display: grid; gap: 12px; min-width: 0; }
.dep-step { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); padding: 14px 16px 16px; opacity: .55; transition: opacity .15s, border-color .15s; }
.dep-step.on, .dep-step.done { opacity: 1; }
.dep-step.on { border-color: var(--fire); box-shadow: 0 0 0 3px var(--fire-soft); }
.dep-step > header { display: flex; align-items: center; gap: 9px; margin-bottom: 12px; }
.dep-step > header b { font-size: 14px; }
.dep-n { width: 22px; height: 22px; border-radius: 50%; background: var(--surface-3); color: var(--ink-3); font-size: 11.5px; font-weight: 700; display: grid; place-items: center; flex: none; }
.dep-step.on .dep-n { background: var(--fire); color: #fff; }
.dep-step.done .dep-n { background: var(--st-teal); color: #fff; }
.dep-change { margin-left: auto; border: none; background: none; font: inherit; font-size: 12px; color: var(--fire); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
/* recherche client */
.dep-search { position: relative; display: flex; align-items: center; gap: 10px; border: 1px solid var(--line-strong); border-radius: var(--r-2); padding: 0 14px; background: var(--surface); color: var(--ink-3); }
.dep-search:focus-within { border-color: var(--fire); box-shadow: 0 0 0 3px var(--fire-soft); }
.dep-search input { flex: 1; border: none; background: none; font: inherit; font-size: 16px; padding: 13px 0; color: var(--ink); outline: none; }
.dep-res { position: absolute; z-index: 30; top: calc(100% + 5px); left: -1px; right: -1px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-2); box-shadow: 0 12px 30px rgba(0,0,0,.16); overflow: hidden; }
.dep-res-o { display: flex; align-items: center; gap: 9px; width: 100%; border: none; background: none; font: inherit; padding: 10px 13px; cursor: pointer; color: var(--ink); border-bottom: 1px solid var(--line); }
.dep-res-o:last-child { border-bottom: none; }
.dep-res-o:hover, .dep-res-o.first { background: var(--fire-soft); }
.dep-res-o b { font-size: 13px; font-weight: 500; display: block; }
.dep-res-o .sub-cell { display: block; }
.dep-kbd { flex: none; font-family: var(--font-mono); font-size: 11px; border: 1px solid var(--line-strong); border-bottom-width: 2px; border-radius: 4px; padding: 1px 6px; color: var(--ink-3); background: var(--surface); }
.dep-none { padding: 12px 13px; font-size: 12.5px; color: var(--ink-2); }
.dep-client { display: flex; align-items: center; gap: 11px; background: var(--surface-2); border-radius: var(--r-2); padding: 10px 12px; }
.dep-av { width: 34px; height: 34px; border-radius: var(--r-2); background: var(--coal); color: #fff; font-size: 12px; font-weight: 700; display: grid; place-items: center; flex: none; }
.dep-client b { font-size: 13.5px; display: block; }
.dep-client .sub-cell { display: block; }
.dep-tel { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--fire); }
.dep-site, .dep-caller { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
/* motifs */
.dep-motifs { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 7px; margin-bottom: 10px; }
.dep-motif { position: relative; display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 11px 12px; font: inherit; color: var(--ink); cursor: pointer; text-align: left; }
.dep-motif:hover:not(:disabled) { border-color: var(--line-strong); }
.dep-motif.on { border-color: var(--fire); background: var(--fire-soft); color: var(--fire-deep); }
.dep-motif:disabled { opacity: .5; cursor: not-allowed; }
.dep-motif b { font-size: 12.5px; font-weight: 500; }
.dep-u { position: absolute; top: -6px; right: 8px; font-style: normal; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #fff; background: var(--st-red); border-radius: 20px; padding: 1px 6px; }
/* créneaux */
.dep-slots { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 7px; margin-bottom: 12px; }
.dep-slot { position: relative; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 9px 11px; font: inherit; cursor: pointer; text-align: left; color: var(--ink); }
.dep-slot b { display: block; font-size: 12.5px; font-weight: 500; }
.dep-slot i { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.dep-slot.on { border-color: var(--fire); background: var(--fire-soft); color: var(--fire-deep); }
.dep-slot:disabled { opacity: .5; cursor: not-allowed; }
.dep-tight { position: absolute; top: -7px; left: 8px; font-size: 9px; font-weight: 700; text-transform: uppercase; color: var(--st-amber); background: var(--surface); padding: 0 5px; }
/* techniciens */
.dep-techs { display: grid; gap: 6px; }
.dep-tech { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 8px 11px; font: inherit; cursor: pointer; color: var(--ink); }
.dep-tech b { display: block; font-size: 12.5px; font-weight: 500; }
.dep-tech .sub-cell { display: block; }
.dep-tech.on { border-color: var(--fire); background: var(--fire-soft); }
.dep-tech:disabled { opacity: .5; cursor: not-allowed; }
.dep-eta { flex: none; display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-2); background: var(--surface-2); border-radius: 20px; padding: 3px 9px; }
/* dossier & récap */
.dep-side { display: grid; gap: 12px; position: sticky; top: 12px; }
.dep-empty { border: 1px dashed var(--line-strong); border-radius: var(--r-3); padding: 26px 20px; text-align: center; display: grid; gap: 5px; justify-items: center; color: var(--ink-3); }
.dep-empty b { font-size: 13px; color: var(--ink-2); }
.dep-empty span { font-size: 11.5px; line-height: 1.5; }
.dep-alert { display: flex; gap: 9px; align-items: flex-start; background: var(--st-red-bg); color: var(--st-red); border-radius: var(--r-2); padding: 11px 13px; font-size: 12px; line-height: 1.45; }
.dep-kv { display: grid; grid-template-columns: 92px 1fr; gap: 8px 10px; padding: 13px 15px; font-size: 12.5px; align-items: baseline; }
.dep-kv > span { color: var(--ink-3); font-size: 11.5px; }
.dep-astuce { display: flex; gap: 7px; padding: 9px 15px; border-top: 1px solid var(--line); background: var(--st-amber-bg); color: var(--st-amber); font-size: 11.5px; line-height: 1.45; }
.dep-recap { padding: 6px 0; }
.dep-r { display: flex; align-items: baseline; gap: 10px; padding: 7px 15px; font-size: 12.5px; }
.dep-r > span { width: 78px; flex: none; color: var(--ink-3); font-size: 11.5px; }
.dep-r > b { flex: 1; min-width: 0; font-weight: 500; }
.dep-todo { font-style: normal; color: var(--ink-3); font-weight: 400; }
.dep-after { display: flex; gap: 8px; padding: 11px 15px; border-top: 1px solid var(--line); background: var(--surface-2); font-size: 11.5px; color: var(--ink-2); line-height: 1.5; }
/* barre d'action */
.dep-bar { position: sticky; bottom: 12px; display: flex; align-items: center; gap: 9px; padding: 12px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-3); box-shadow: 0 6px 22px rgba(0,0,0,.1); flex-wrap: wrap; }
.dep-bar-s { flex: 1; min-width: 160px; font-size: 12.5px; color: var(--ink-2); }
/* confirmation */
.dep-done { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); padding: 34px 24px; text-align: center; max-width: 620px; margin: 0 auto; }
.dep-done-ic { width: 56px; height: 56px; margin: 0 auto 14px; border-radius: 16px; background: var(--st-green-bg); color: var(--st-green); display: grid; place-items: center; }
.dep-say { display: inline-flex; gap: 8px; align-items: flex-start; text-align: left; background: var(--surface-2); border-radius: var(--r-2); padding: 11px 14px; font-size: 13px; color: var(--ink-2); margin: 12px auto 18px; max-width: 480px; line-height: 1.5; }
.dep-done-a { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 1100px) { .dep { grid-template-columns: 1fr; } .dep-side { position: static; } }

.dep-map { position: relative; margin-bottom: 10px; }
.dep-map-h { display: block; margin-top: 6px; font-size: 11px; color: var(--ink-3); }
.dep-near { font-style: normal; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--st-teal); background: var(--st-green-bg); border-radius: 20px; padding: 1px 7px; margin-left: 7px; }
.cp-arch { font-size: 10.5px; font-weight: 600; color: var(--ink-3); background: var(--surface-2); border: 1px dashed var(--line-strong); border-radius: 20px; padding: 1px 8px; white-space: nowrap; }

/* ---------- Implantations ---------- */
.impl { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.impl:last-of-type { border-bottom: none; }
.impl-h { display: flex; align-items: center; gap: 9px; }
.impl-edit { flex: none; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 4px 6px; color: var(--ink-3); cursor: pointer; display: flex; }
.impl-edit:hover { border-color: var(--fire); color: var(--fire); }
.impl-nodes { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0 7px; }
.impl-node { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line); border-radius: 20px; padding: 2px 9px; }
.impl-f { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-3); flex-wrap: wrap; }
.impl-gap { display: flex; align-items: center; gap: 9px; padding: 11px 14px; border-top: 1px solid var(--line); background: var(--st-amber-bg); color: var(--st-amber); font-size: 12px; line-height: 1.45; }
.impl-pick { display: grid; gap: 4px; max-height: 230px; overflow-y: auto; border: 1px solid var(--line); border-radius: var(--r-2); padding: 6px; }
.impl-opt { display: flex; align-items: center; gap: 9px; border: 1px solid transparent; background: none; border-radius: var(--r-2); padding: 7px 10px; font: inherit; color: var(--ink); cursor: pointer; }
.impl-opt:hover:not(:disabled) { background: var(--surface-2); }
.impl-opt.on { background: var(--fire-soft); border-color: var(--fire); color: var(--fire-deep); }
.impl-opt:disabled { opacity: .45; cursor: not-allowed; }
.impl-opt b { display: block; font-size: 12.5px; font-weight: 500; }
.impl-opt i { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.impl-ck { flex: none; width: 16px; height: 16px; border: 1.5px solid var(--line-strong); border-radius: 4px; display: grid; place-items: center; }
.impl-opt.on .impl-ck { background: var(--fire); border-color: var(--fire); color: #fff; }
.impl-sum { margin-top: 7px; font-size: 11.5px; color: var(--ink-2); }
.impl-m { width: 26px; height: 26px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); font: inherit; font-size: 11px; color: var(--ink-2); cursor: pointer; }
.impl-m.on { background: var(--fire); border-color: var(--fire); color: #fff; font-weight: 700; }
.impl-sel { display: flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-1); padding: 4px 8px; font: inherit; font-size: 11.5px; color: var(--ink); cursor: pointer; max-width: 190px; }
.impl-sel b { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.impl-sel i { font-style: normal; color: var(--ink-3); font-size: 10.5px; white-space: nowrap; }

/* couverture physique dans l'arborescence */
.cov-dots { flex: none; display: inline-flex; gap: 3px; }
.cov-dot { width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--line-strong); background: transparent; display: inline-block; }
.cov-dot.on { background: var(--st-teal); border-color: var(--st-teal); }
.cov-dot.m-ext.on { background: var(--fire); border-color: var(--fire); }
.cov-dot.m-baes.on { background: var(--st-amber); border-color: var(--st-amber); }
.cov-dot.m-ria.on { background: var(--st-blue); border-color: var(--st-blue); }
.cov-dot.m-ssi.on { background: var(--st-violet); border-color: var(--st-violet); }
.cov-legend { display: flex; align-items: center; gap: 12px; padding: 8px 12px; border-top: 1px solid var(--line); font-size: 10.5px; color: var(--ink-3); flex-wrap: wrap; }
.cov-legend span { display: inline-flex; align-items: center; gap: 5px; }
.progline { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.progline:last-child { border-bottom: none; }
.progline-h { display: flex; align-items: center; gap: 9px; }

.impl { padding: 0; }
.impl.on { background: var(--surface-2); }
.impl-row { display: flex; align-items: center; gap: 9px; width: 100%; border: none; background: none; font: inherit; color: var(--ink); cursor: pointer; padding: 11px 14px; }
.impl-row b { display: block; font-size: 12.5px; font-weight: 500; }
.impl-row i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); margin-top: 1px; }
.impl-body { padding: 0 14px 13px; }
.impl-body .impl-nodes { margin-top: 0; }

.impl-ic { flex: none; width: 30px; height: 30px; border-radius: var(--r-2); display: grid; place-items: center; background: var(--surface-3); color: var(--ink-2); }
.impl-ic.m-ext { background: var(--fire-soft); color: var(--fire); }
.impl-ic.m-baes { background: var(--st-amber-bg); color: var(--st-amber); }
.impl-ic.m-ria { background: var(--st-blue-bg); color: var(--st-blue); }
.impl-ic.m-ssi { background: var(--st-violet-bg, var(--surface-3)); color: var(--st-violet); }
.impl-mois { flex: none; display: inline-flex; gap: 1px; }
.impl-mois i { width: 11px; height: 15px; font-style: normal; font-size: 8px; font-weight: 700; color: var(--line-strong); display: grid; place-items: center; border-radius: 2px; }
.impl-mois i.on { background: var(--fire); color: #fff; }
.impl-warn { flex: none; color: var(--st-red); }

/* ---------- Plan en plein écran, zoomable ---------- */
.plan-expand { position: absolute; top: 8px; right: 8px; z-index: 5; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line); background: var(--surface); border-radius: 20px; padding: 4px 10px; font: inherit; font-size: 11px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.plan-expand:hover { border-color: var(--fire); color: var(--fire); }
.pzx { position: fixed; inset: 0; z-index: 200; background: var(--paper); display: flex; flex-direction: column; }
.pzx-top { flex: none; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--surface); }
.pzx-top b { font-size: 14px; }
.pzx-stage { flex: 1; position: relative; overflow: hidden; background: var(--surface-2); display: grid; place-items: center; padding: 24px; }
.pzx-inner { position: relative; width: min(100%, 1100px); aspect-ratio: 100 / 62; max-height: 100%; transform-origin: center center; will-change: transform; }
.pzx-zoom { display: flex; align-items: center; gap: 6px; }
.pzx-zoom button { width: 32px; height: 32px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); font: inherit; font-size: 17px; line-height: 1; color: var(--ink-2); cursor: pointer; }
.pzx-zoom button:disabled { opacity: .35; cursor: not-allowed; }
.pzx-zoom b { min-width: 44px; text-align: center; font-size: 12px; }
.pzx-zoom .pzx-fit { width: auto; padding: 0 11px; font-size: 12px; }

/* ---------- Portail : boutique & commandes ---------- */
.soft-wrap { max-width: 940px; margin: 0 auto; padding: 4px 0 40px; }
.soft-h1 { font-size: 26px; margin: 0 0 6px; }
.soft-lead { color: var(--ink-2); font-size: 14px; line-height: 1.55; margin: 0 0 18px; max-width: 620px; }
.shop-note { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--r-3); background: var(--st-green-bg); color: var(--st-teal); font-size: 13px; line-height: 1.5; margin-bottom: 16px; }
.shop-note.quote { background: var(--st-blue-bg); color: var(--st-blue); }
.shop-bar { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.shop-search { display: flex; align-items: center; gap: 9px; flex: 1 1 260px; min-width: 200px; border: 1px solid var(--line-strong); border-radius: 30px; padding: 0 15px; background: var(--surface); color: var(--ink-3); }
.shop-search input { flex: 1; border: none; background: none; font: inherit; font-size: 14px; padding: 11px 0; color: var(--ink); outline: none; }
.soft-chip { border: 1px solid var(--line); background: var(--surface); border-radius: 30px; padding: 8px 15px; font: inherit; font-size: 13px; color: var(--ink-2); cursor: pointer; }
.soft-chip.on { background: var(--coal); color: #fff; border-color: var(--coal); }
.shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 14px; }
.shop-card { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); overflow: hidden; display: flex; flex-direction: column; }
.shop-card.in { border-color: var(--fire); box-shadow: 0 0 0 3px var(--fire-soft); }
.shop-img { height: 96px; background: repeating-linear-gradient(135deg, var(--surface-2) 0 8px, var(--surface-3) 8px 16px); display: grid; place-items: center; font-family: var(--font-mono); font-size: 10.5px; color: var(--ink-3); }
.shop-body { padding: 13px 14px 14px; display: flex; flex-direction: column; flex: 1; }
.shop-body b { font-size: 14px; }
.shop-body p { font-size: 12.5px; color: var(--ink-2); line-height: 1.5; margin: 5px 0 9px; flex: 1; }
.shop-meta { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 11px; }
.shop-foot { display: flex; align-items: center; gap: 10px; }
.shop-price { flex: 1; min-width: 0; }
.shop-price b { display: block; font-size: 17px; }
.shop-price b.ask { font-size: 13.5px; color: var(--st-blue); }
.shop-price i { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.shop-qty { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--fire); border-radius: 30px; overflow: hidden; }
.shop-qty button { width: 32px; height: 32px; border: none; background: var(--fire-soft); font: inherit; font-size: 17px; line-height: 1; color: var(--fire-deep); cursor: pointer; }
.shop-qty b { min-width: 30px; text-align: center; font-size: 13.5px; }
.shop-qty.sm button { width: 26px; height: 26px; font-size: 15px; }
.shop-cart { position: sticky; bottom: 16px; display: flex; align-items: center; gap: 12px; width: 100%; margin-top: 20px; padding: 14px 18px; border: none; border-radius: 30px; background: var(--coal); color: #fff; font: inherit; font-size: 14px; cursor: pointer; box-shadow: 0 8px 26px rgba(0,0,0,.22); }
.shop-cart-n { width: 26px; height: 26px; border-radius: 50%; background: var(--fire); font-size: 12.5px; font-weight: 700; display: grid; place-items: center; }
.soft-empty { grid-column: 1 / -1; text-align: center; padding: 40px 0; color: var(--ink-3); font-size: 13.5px; }
.cart-lines { border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; }
.cart-line { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-bottom: 1px solid var(--line); }
.cart-line:last-child { border-bottom: none; }
.cart-line b { font-size: 13px; }
.cart-sum { width: 84px; text-align: right; font-size: 13.5px; font-weight: 500; }
.cart-opt { display: flex; gap: 11px; align-items: flex-start; padding: 12px 13px; border-radius: var(--r-2); background: var(--surface-2); }
.cart-opt input { margin-top: 2px; width: 18px; height: 18px; accent-color: var(--fire); flex: none; }
.cart-opt b { display: block; font-size: 13px; }
.cart-opt i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-2); line-height: 1.45; }
.cart-tot { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.cart-tot > div { display: flex; align-items: baseline; gap: 10px; padding: 4px 0; font-size: 13px; }
.cart-tot > div > span { flex: 1; color: var(--ink-2); }
.cart-tot .big { padding-top: 8px; margin-top: 4px; border-top: 1px solid var(--line); font-size: 15px; }
.cart-tot .big b { font-size: 19px; }
.cart-legal { font-size: 11.5px; color: var(--ink-3); line-height: 1.5; margin: 12px 0 0; }
.soft-done { text-align: center; padding: 34px 20px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); }
.soft-done-ic { width: 56px; height: 56px; margin: 0 auto 14px; border-radius: 18px; background: var(--st-green-bg); color: var(--st-green); display: grid; place-items: center; }
.soft-flow { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; }
.soft-step { font-size: 11.5px; color: var(--ink-3); border: 1px solid var(--line); border-radius: 20px; padding: 4px 11px; }
.soft-step.on { border-color: var(--fire); color: var(--fire-deep); background: var(--fire-soft); font-weight: 600; }
.ord { border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); margin-bottom: 10px; overflow: hidden; }
.ord.on { border-color: var(--line-strong); }
.ord-h { display: flex; align-items: center; gap: 12px; width: 100%; border: none; background: none; font: inherit; color: var(--ink); cursor: pointer; padding: 14px 16px; }
.ord-h b { display: block; font-size: 14px; }
.ord-h i { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); margin-top: 2px; }
.ord-b { padding: 0 16px 16px; }
.ord-flow { display: flex; gap: 4px; flex-wrap: wrap; padding: 4px 0 14px; }
.ord-step { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-3); }
.ord-step i { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--line-strong); }
.ord-step.past i { background: var(--st-teal); border-color: var(--st-teal); }
.ord-step.past { color: var(--ink-2); }
.ord-step.on i { background: var(--fire); border-color: var(--fire); box-shadow: 0 0 0 3px var(--fire-soft); }
.ord-step.on { color: var(--fire-deep); font-weight: 600; }
.ord-step:not(:last-child)::after { content: ""; width: 14px; height: 1px; background: var(--line-strong); margin-left: 2px; }
.ord-act { display: flex; align-items: center; gap: 10px; padding: 12px 13px; border-radius: var(--r-2); background: var(--st-amber-bg); flex-wrap: wrap; }
.ord-act b { display: block; font-size: 13px; }
.ord-act i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-2); }
.ord-docs { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-2); margin-top: 12px; overflow: hidden; }
.ord-doc { display: flex; align-items: center; gap: 9px; background: var(--surface); padding: 10px 12px; font-size: 12.5px; }
.ord-doc.off { color: var(--ink-3); }
.ord-eta { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: var(--r-2); background: var(--st-blue-bg); color: var(--st-blue); font-size: 12.5px; }

.pub-row { display: flex; align-items: center; gap: 11px; padding: 12px 13px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface-2); }
.pub-ic { flex: none; width: 32px; height: 32px; border-radius: var(--r-2); background: var(--surface); color: var(--st-teal); display: grid; place-items: center; }
.pub-row b { display: block; font-size: 13px; }
.pub-row i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-2); line-height: 1.45; }
.pub-sub { margin-top: 12px; padding: 13px; border-left: 3px solid var(--st-teal); background: var(--surface-2); border-radius: 0 var(--r-2) var(--r-2) 0; }
.oc-list { border: 1px solid var(--line); border-radius: var(--r-2); max-height: 260px; overflow-y: auto; }
.oc-row { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border-bottom: 1px solid var(--line); }
.oc-row:last-child { border-bottom: none; }
.oc-row.on { background: var(--fire-soft); }
.oc-row b { display: block; font-size: 12.5px; font-weight: 500; }
.oc-row i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); }

/* ---------- Portail client : coque responsive ---------- */
.pshell { min-height: 100vh; background: var(--paper); container-type: inline-size; container-name: vp; }
.pshell-top { background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 30; }
.pshell-bar { max-width: 1040px; margin: 0 auto; padding: 12px 20px; display: flex; gap: 12px; align-items: center; }
.pshell-id { flex: 1; min-width: 0; }
.pshell-id b { display: block; font-size: 14px; }
.pshell-id span { display: block; font-size: 11.5px; color: var(--ink-3); }
.pshell-av { display: none; flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--surface-3); color: var(--ink-2); font-size: 12px; font-weight: 700; place-items: center; }
.pshell-tabs { max-width: 1040px; margin: 0 auto; padding: 0 20px 2px; display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.pshell-tabs::-webkit-scrollbar { display: none; }
.pshell-tab { flex: none; padding: 9px 13px; font-size: 13px; color: var(--ink-2); border-bottom: 2px solid transparent; white-space: nowrap; }
.pshell-tab:hover { color: var(--ink); }
.pshell-tab.on { color: var(--fire-deep); border-bottom-color: var(--fire); font-weight: 600; }
.pshell-main { max-width: 1040px; margin: 0 auto; padding: 24px 20px 80px; }
.pshell-bottom { display: none; }
@container vp (max-width: 720px) {
  .pshell-bar { padding: 10px 14px; }
  .pshell-who { display: none; }
  .pshell-av { display: grid; }
  .pshell-tabs { padding: 0 14px 2px; }
  .pshell-main { padding: 18px 14px 92px; }
  .pshell-bottom { display: flex; position: sticky; bottom: 0; z-index: 40; background: var(--surface); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
  .pshell-bt { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 9px 4px 8px; font-size: 10.5px; color: var(--ink-3); min-height: 52px; }
  .pshell-bt.on { color: var(--fire); font-weight: 700; }
  /* Le contenu suit : une colonne, cibles ≥ 44 px, plus de débordement latéral. */
  .soft-h1 { font-size: 21px; }
  .soft-lead { font-size: 13.5px; }
  .shop-grid { grid-template-columns: 1fr; }
  .shop-bar { gap: 6px; }
  .shop-search { flex-basis: 100%; }
  .shop-cart { bottom: calc(62px + env(safe-area-inset-bottom)); z-index: 35; padding: 13px 16px; }
  .shop-qty button { width: 44px; height: 44px; }
  .shop-qty b { min-width: 36px; font-size: 15px; }
  .shop-qty.sm button { width: 44px; height: 44px; }
  .ord-h { flex-wrap: wrap; gap: 8px; padding: 12px 14px; }
  .ord-h b.num { order: 3; }
  .ord-b { padding: 0 14px 14px; }
  .ord-flow { gap: 8px; }
  .ord-step:not(:last-child)::after { display: none; }
  .ord-act { flex-direction: column; align-items: stretch; }
  .ord-act .btn { width: 100%; }
  .cart-line { flex-wrap: wrap; }
  .cart-sum { width: auto; margin-left: auto; }
  .soft-done { padding: 26px 16px; }
}
.ord-eta.partial { background: var(--st-amber-bg); color: var(--st-amber); }
.ord-sign { display: flex; align-items: center; gap: 7px; margin-top: 10px; font-size: 12px; color: var(--st-teal); }

/* politique de prix (fiche client) */
.pricing-opt { display: flex; align-items: flex-start; gap: 10px; width: 100%; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-2); padding: 10px 12px; font: inherit; color: var(--ink); cursor: pointer; }
.pricing-opt.on { border-color: var(--fire); background: var(--fire-soft); }
.pricing-opt b { display: block; font-size: 12.5px; }
.pricing-opt i { display: block; font-style: normal; font-size: 11px; color: var(--ink-2); line-height: 1.45; margin-top: 1px; }
.pricing-radio { flex: none; width: 16px; height: 16px; margin-top: 2px; border: 1.5px solid var(--line-strong); border-radius: 50%; display: grid; place-items: center; }
.pricing-opt.on .pricing-radio { border-color: var(--fire); }
.pricing-radio i { width: 8px; height: 8px; border-radius: 50%; background: var(--fire); }
.pricing-rem { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 12.5px; }

/* ---------- Espace client : accueil, site, rapports, demandes ---------- */
.soft-h2 { font-size: 15px; margin: 26px 0 11px; }
.soft-back { display: inline-flex; align-items: center; gap: 6px; border: none; background: none; font: inherit; font-size: 12.5px; color: var(--ink-3); cursor: pointer; padding: 0 0 12px; }
.soft-back:hover { color: var(--fire); }
.soft-note { font-size: 12px; color: var(--ink-3); margin: 10px 0 0; }
.ph-hero { display: flex; align-items: center; gap: 24px; padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); flex-wrap: wrap; }
.ph-ring { flex: none; width: 118px; height: 118px; border-radius: 50%; display: grid; place-items: center; text-align: center;
  background: conic-gradient(var(--st-teal) calc(var(--p) * 1%), var(--surface-3) 0); position: relative; }
.ph-ring::after { content: ""; position: absolute; inset: 11px; border-radius: 50%; background: var(--surface); }
.ph-ring b { position: relative; z-index: 2; font-size: 27px; line-height: 1; }
.ph-ring b i { font-style: normal; font-size: 14px; color: var(--ink-3); }
.ph-ring span { position: relative; z-index: 2; display: block; font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }
.ph-facts { flex: 1; min-width: 200px; display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 14px; }
.ph-facts > div b { display: block; font-size: 24px; line-height: 1.1; }
.ph-facts > div span { display: block; font-size: 12px; color: var(--ink-2); }
.ph-facts > div.bad b { color: var(--st-red); }
.ph-alert { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 14px 16px; border-radius: var(--r-3); background: var(--st-amber-bg); flex-wrap: wrap; }
.ph-alert-ic { flex: none; width: 36px; height: 36px; border-radius: 11px; background: var(--surface); color: var(--st-amber); display: grid; place-items: center; }
.ph-alert b { display: block; font-size: 14px; }
.ph-alert i { display: block; font-style: normal; font-size: 12.5px; color: var(--ink-2); line-height: 1.45; }
.ph-next { display: grid; gap: 8px; }
.ph-visit { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); font: inherit; color: var(--ink); cursor: pointer; }
.ph-visit:hover { border-color: var(--fire); }
.ph-when { flex: none; width: 48px; text-align: center; }
.ph-when b { display: block; font-size: 20px; line-height: 1; }
.ph-when i { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.ph-visit > span b { display: block; font-size: 14px; }
.ph-visit > span i { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); }
.ph-sites { display: grid; gap: 8px; }
.ph-site { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); font: inherit; color: var(--ink); cursor: pointer; }
.ph-site:hover { border-color: var(--line-strong); }
.ph-site b { display: block; font-size: 14px; }
.ph-site i { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); }
.ph-bar { display: block; height: 5px; border-radius: 20px; background: var(--surface-3); overflow: hidden; margin-top: 8px; max-width: 260px; }
.ph-bar i { display: block; height: 100%; border-radius: 20px; }
.ps-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
.ps-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; }
.ps-facts > div { background: var(--surface); padding: 13px 15px; }
.ps-facts b { display: block; font-size: 21px; line-height: 1.15; text-transform: capitalize; }
.ps-facts span { display: block; font-size: 11.5px; color: var(--ink-2); margin-top: 2px; }
.ps-facts > div.bad b { color: var(--st-red); }
.ps-visit { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 12px 15px; border-radius: var(--r-3); background: var(--st-blue-bg); color: var(--st-blue); font-size: 13px; flex-wrap: wrap; }
.ps-eq { border: 1px solid var(--line); border-radius: var(--r-3); overflow: hidden; }
.ps-row { display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-bottom: 1px solid var(--line); }
.ps-row:last-child { border-bottom: none; }
.ps-row.ko { background: var(--st-red-bg); }
.ps-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--st-red); }
.ps-dot.ok { background: var(--st-teal); }
.ps-row b { display: block; font-size: 13.5px; }
.ps-row i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-3); }
.ps-due { flex: none; text-align: right; }
.ps-due b { font-size: 12px; }
.ps-docs { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px; margin-top: 22px; }
.ps-docs button { display: flex; align-items: center; gap: 11px; padding: 14px 15px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); font: inherit; color: var(--ink); cursor: pointer; text-align: left; }
.ps-docs button:hover { border-color: var(--fire); }
.ps-docs b { display: block; font-size: 13.5px; }
.ps-docs i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-3); }
.ps-docs span { flex: 1; min-width: 0; }
.pr-list { display: grid; gap: 8px; }
.pr-row { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); flex-wrap: wrap; }
.pr-ic { flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--surface-2); color: var(--ink-2); display: grid; place-items: center; }
.pr-row b { display: block; font-size: 13.5px; }
.pr-row i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-3); }
.pr-ask { display: flex; align-items: center; gap: 11px; margin-top: 18px; padding: 13px 15px; border-radius: var(--r-3); background: var(--surface-2); font-size: 12.5px; color: var(--ink-2); flex-wrap: wrap; }
.pq-kinds { display: grid; grid-template-columns: repeat(auto-fit, minmax(216px, 1fr)); gap: 10px; }
.pq-kind { padding: 15px 16px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); font: inherit; color: var(--ink); cursor: pointer; text-align: left; }
.pq-kind:hover, .pq-kind.on { border-color: var(--fire); }
.pq-ic { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--fire-soft); color: var(--fire); margin-bottom: 10px; }
.pq-kind b { display: block; font-size: 14px; }
.pq-kind i { display: block; font-style: normal; font-size: 12px; color: var(--ink-2); line-height: 1.45; margin-top: 3px; }
.pq-row { padding: 13px 15px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); }
.pq-row-h { display: flex; align-items: center; gap: 10px; }
.pq-row-h b { font-size: 13.5px; }
.pq-row > i { display: block; font-style: normal; font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.pq-row p { margin: 9px 0 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.5; padding-top: 9px; border-top: 1px solid var(--line); }
.pq-contact { display: flex; align-items: center; gap: 12px; margin-top: 22px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-3); background: var(--surface); flex-wrap: wrap; }
.pq-contact b { display: block; font-size: 14px; }
.pq-contact i { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); }
@media (max-width: 720px) {
  .ph-hero { gap: 16px; padding: 16px; }
  .ph-ring { width: 96px; height: 96px; }
  .soft-h2 { margin: 22px 0 10px; }
  .ps-row { flex-wrap: wrap; }
  .ps-due { text-align: left; width: 100%; padding-left: 20px; }
}

.ph-hero { display: block; }
.ph-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.ph-eyebrow { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.ph-big { display: block; font-size: 22px; line-height: 1.2; margin-top: 3px; }
.ph-big span { font-size: 14px; font-weight: 400; color: var(--ink-2); }
.ph-track { position: relative; height: 10px; border-radius: 20px; background: var(--surface-3); overflow: visible; margin: 0 0 22px; }
.ph-track > i { display: block; height: 100%; border-radius: 20px; background: var(--st-teal); }
.ph-track > span { position: absolute; top: 15px; transform: translateX(-50%); font-size: 11px; font-weight: 700; color: var(--st-teal); white-space: nowrap; }
.ph-year { display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; }
.ph-m { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 7px 0 6px; border-radius: var(--r-2); background: var(--surface-2); border: 1px solid transparent; }
.ph-m i { font-style: normal; font-size: 13px; font-weight: 600; line-height: 1; min-height: 13px; color: var(--ink-3); }
.ph-m em { font-style: normal; font-size: 10px; font-weight: 700; color: var(--ink-3); }
.ph-m.done { background: var(--st-green-bg); } .ph-m.done i, .ph-m.done em { color: var(--st-teal); }
.ph-m.todo { background: var(--st-amber-bg); } .ph-m.todo i, .ph-m.todo em { color: var(--st-amber); }
.ph-m.now { background: var(--st-amber-bg); } .ph-m.now i, .ph-m.now em { color: var(--st-amber); }
.ph-m.late { background: var(--st-red-bg); } .ph-m.late i, .ph-m.late em { color: var(--st-red); }
.ph-m.current { border-color: var(--ink-2); }
.ph-leg { display: flex; align-items: center; gap: 14px; margin-top: 10px; font-size: 11px; color: var(--ink-3); flex-wrap: wrap; }
.ph-leg span { display: inline-flex; align-items: center; gap: 5px; }
.ph-leg .d { width: 9px; height: 9px; border-radius: 3px; }
.ph-leg .d.done { background: var(--st-teal); } .ph-leg .d.todo { background: var(--st-amber); } .ph-leg .d.late { background: var(--st-red); }
.ps-badge { flex: none; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: var(--surface-2); color: var(--ink-2); }
.ps-badge.ok { background: var(--st-green-bg); color: var(--st-teal); }
.ps-badge.ko { background: var(--st-red-bg); color: var(--st-red); }
.ps-badge.part, .ps-badge.todo { background: var(--st-amber-bg); color: var(--st-amber); }
@media (max-width: 720px) {
  .ph-year { grid-template-columns: repeat(6, 1fr); }
  .ph-big { font-size: 19px; }
}
.eqno-code { font-size: 10.5px; color: var(--ink-3); font-weight: 400; margin-left: 5px; }
.ps-no { flex: none; min-width: 26px; height: 26px; padding: 0 6px; border-radius: 8px; background: var(--surface-2); color: var(--ink-2); font-size: 12px; font-weight: 700; display: grid; place-items: center; }