/* =========================================================
   Système visuel · neutres froids, bleu d'action, ambre réservé aux alertes
   ========================================================= */
:root{
  /* --- Chantier : beton froid, graphite, ambre de gyrophare.
         Rien de creme, rien de pastel : les etats sont des rectangles pleins. --- */
  --ground:#ffffff; --panel:#ffffff; --panel-2:#f4f4f2; --panel-3:#e9e9e6;   /* 13 sept. 2026 : fond blanc, le gris sert aux surfaces secondaires et aux traits */
  --ink:#1d1d1f; --ink-2:#45454b; --ink-3:#52525a;   /* 13 sept. 2026 : plus foncees, 8:1 et 6,5:1 sur le fond */
  --line:#cfcfca; --line-2:#a9a9a2;
  --act:#e1e352; --act-2:#cfd145; --act-soft:#f7f8dc; --act-txt:#585a00; --act-ink:#14140a;
  --pri:#e1e352; --pri-soft:#f7f8dc; --pri-ink:#14140a; --pri-txt:#585a00;
  --ok:#156a3f;  --ok-soft:#cdeedd;  --ok-fill:#156a3f;  --ok-on:#ffffff;
  --warn:#7a4f00; --warn-soft:#f7f8dc; --warn-fill:#e1e352; --warn-on:#14140a;
  --crit:#b82a22; --crit-soft:#ffd9d5; --crit-fill:#b82a22; --crit-on:#ffffff;
  --info:#0062c4; --info-soft:#dbe7f3; --info-fill:#0062c4; --info-on:#ffffff;
  --beacon:#6a5300; --beacon-soft:#f7f8dc; --beacon-fill:#e1e352;
  --beacon-pill:#e1e352; --beacon-on:#14140a;
  --nav:#1c1c1e; --nav-2:#2c2c2e; --nav-ink:#f5f5f7; --nav-ink-2:#b4b4b9;
  /* trois ombres, pas quatorze */
  --sh-1:none;
  --sh-2:0 4px 16px -6px rgba(0,0,0,.14);
  --sh-3:0 24px 60px -28px rgba(0,0,0,.34);
  /* trois rayons, tous petits : du materiel de travail */
  --r:10px; --r2:8px; --r3:6px;
  /* une seule échelle d'espacement */
  --sp1:4px; --sp2:8px; --sp3:12px; --sp4:20px; --sp5:32px; --sp6:48px;
  /* six tailles de texte */
  --t1:12.5px; --t2:14px; --t3:15px; --t4:18px; --t5:24px; --t6:34px;
}
/* Sur un téléphone, le bureau se lit à bout de bras, souvent dehors :
   les petits textes montent de deux crans, et les champs restent à 16 px,
   la taille en dessous de laquelle iPhone zoome tout seul. */
@media(max-width:700px){
  :root{ --t1:13.5px; --t2:15px; --t3:16px; --t4:19px; }
  input,select,textarea{ font-size:16px !important; }
  label>span{ letter-spacing:.06em; }
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ground:#0e1114; --panel:#171c21; --panel-2:#1d242a; --panel-3:#262f37;
  --ink:#e9edf0; --ink-2:#b0bac2; --ink-3:#98a3ad;
  --line:#2a333b; --line-2:#4b5761;
  --act:#6fb0e8; --act-2:#8cc3f2; --act-soft:#16293a; --act-txt:#8cc3f2; --act-ink:#08131f;
  --pri:#ff9426; --pri-soft:#33200a; --pri-ink:#14140a; --pri-txt:#8cc3f2;
  --ok:#3fc584;  --ok-soft:#0e2a1e;  --ok-fill:#3fc584;  --ok-on:#062218;
  --warn:#e9a25c; --warn-soft:#33240f; --warn-fill:#e9a25c; --warn-on:#2b1c05;
  --crit:#ff8079; --crit-soft:#361a18; --crit-fill:#ff8079; --crit-on:#360e0a;
  --info:#6fb0e8; --info-soft:#16293a; --info-fill:#6fb0e8; --info-on:#06192c;
  --beacon:#e6e86a; --beacon-soft:#2e3010; --beacon-fill:#e1e352;
  --beacon-pill:#e1e352; --beacon-on:#14140a;
  --nav:#0a0d10; --nav-2:#161c22; --nav-ink:#c3ccd4; --nav-ink-2:#98989d;
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 1px 2px rgba(0,0,0,.45), 0 10px 26px -16px #000;
  --sh-3:0 26px 64px -26px #000;
}}
:root[data-theme="dark"]{
  --ground:#0e1114; --panel:#171c21; --panel-2:#1d242a; --panel-3:#262f37;
  --ink:#e9edf0; --ink-2:#b0bac2; --ink-3:#98a3ad;
  --line:#2a333b; --line-2:#4b5761;
  --act:#6fb0e8; --act-2:#8cc3f2; --act-soft:#16293a; --act-txt:#8cc3f2; --act-ink:#08131f;
  --pri:#ff9426; --pri-soft:#33200a; --pri-ink:#14140a; --pri-txt:#8cc3f2;
  --ok:#3fc584;  --ok-soft:#0e2a1e;  --ok-fill:#3fc584;  --ok-on:#062218;
  --warn:#e9a25c; --warn-soft:#33240f; --warn-fill:#e9a25c; --warn-on:#2b1c05;
  --crit:#ff8079; --crit-soft:#361a18; --crit-fill:#ff8079; --crit-on:#360e0a;
  --info:#6fb0e8; --info-soft:#16293a; --info-fill:#6fb0e8; --info-on:#06192c;
  --beacon:#e6e86a; --beacon-soft:#2e3010; --beacon-fill:#e1e352;
  --beacon-pill:#e1e352; --beacon-on:#14140a;
  --nav:#0a0d10; --nav-2:#161c22; --nav-ink:#c3ccd4; --nav-ink-2:#98989d;
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 1px 2px rgba(0,0,0,.45), 0 10px 26px -16px #000;
  --sh-3:0 26px 64px -26px #000;
}

*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:15px;line-height:1.52;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  font-feature-settings:"kern" 1,"liga" 1,"calt" 1;letter-spacing:-.006em;
  text-rendering:optimizeLegibility}
/* les chiffres s'alignent en colonne, partout où ça compte */
.kpi .v,.num,td,th,.delay,.tin,.clock,.money,.estline .v,.esttot .v,.wchrono,.pp-top b,.ph-total b
  {font-variant-numeric:tabular-nums}
h1,h2,h3{text-wrap:balance}
p,.sub2,.hint,.note{text-wrap:pretty}
button{font:inherit;cursor:pointer;color:inherit}
a{color:var(--pri-txt)}
:focus-visible{outline:2px solid var(--pri);outline-offset:2px;border-radius:var(--r3)}
::selection{background:var(--pri-soft)}

/* ---------- structure ---------- */
/* 100dvh suit la hauteur RÉELLEMENT visible : sans ça, sur iPhone, la page
   dépasse toujours l'écran de la hauteur de la barre d'adresse et il faut
   faire défiler pour rien. Le 100vh reste pour les vieux navigateurs. */
.app{display:grid;grid-template-columns:258px 1fr;min-height:100vh;min-height:100dvh}
@media(max-width:900px){.app{grid-template-columns:1fr}}

nav.side{background:var(--nav);color:var(--nav-ink);padding:0 0 24px;display:flex;flex-direction:column}
@media(max-width:900px){nav.side{position:sticky;top:0;z-index:40}}
.brand{display:flex;align-items:center;gap:13px;padding:24px 22px 20px}
.mark{width:38px;height:38px;border-radius:var(--r);background:var(--pri);color:#0b0c0a;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t3);display:grid;place-items:center;
  letter-spacing:-.02em;flex:none;box-shadow:var(--sh-1)}
.brand b{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:17px;color:#fff;
  line-height:1.15;display:block;letter-spacing:-.02em;font-weight:700}
.brand span{font-size:var(--t1);color:var(--nav-ink-2);letter-spacing:.06em;text-transform:uppercase}
.navsec{font-size:10px;letter-spacing:.19em;text-transform:uppercase;color:var(--nav-ink-2);
  padding:26px 22px 9px;font-weight:600}
.navbtn{display:grid;grid-template-columns:20px 1fr auto auto;gap:13px;align-items:center;
  background:none;border:0;color:var(--nav-ink);text-align:left;padding:12px 14px;margin:2px 12px;
  width:calc(100% - 24px);border-radius:var(--r2);font-size:var(--t3);transition:background .12s,color .12s}
.navbtn .ni{display:grid;place-items:center;opacity:.75}
.navbtn .nl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.navbtn:hover{background:var(--nav-2);color:#fff}
.navbtn[aria-current="true"]{background:var(--nav-2);color:#fff;font-weight:600}
.navbtn[aria-current="true"]{box-shadow:inset 3px 0 0 var(--pri)}
.navbtn[aria-current="true"] .ni{opacity:1;color:var(--pri)}
.cnt{font-size:var(--t1);background:rgba(255,255,255,.10);padding:1px 8px;border-radius:999px;color:#dce6ee;font-weight:600}
/* flèche de dépliage des sections dans le tiroir du téléphone */
.nch{font-size:19px;line-height:1;opacity:.55;transform:rotate(90deg);transition:transform .18s;display:inline-block}
.nch.ouv{transform:rotate(-90deg);opacity:.95}
.cnt.hot{background:var(--pri);color:#0b0c0a}
.side .foot{margin-top:auto;padding:16px 20px 0;font-size:var(--t1);letter-spacing:.1em;
  text-transform:uppercase;color:var(--nav-ink-2)}

main{min-width:0;display:flex;flex-direction:column}
.topbar{background:var(--panel);border-bottom:1px solid var(--line);padding:14px 40px;
  display:flex;align-items:center;gap:var(--sp3);flex-wrap:wrap;position:sticky;top:0;z-index:30}
@media(max-width:1100px){.topbar{padding:var(--sp3) var(--sp4)}}
.topbar>label{display:flex;align-items:center;gap:9px}
.topbar>label>span{font-size:var(--t1);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.sel{background:var(--panel-2);border:1px solid var(--line-2);border-radius:var(--r2);padding:8px 12px;
  font:inherit;font-size:var(--t3);color:var(--ink)}
.clock{font-family:inherit;font-size:var(--t2);color:var(--ink-3);
  font-variant-numeric:tabular-nums;margin-left:auto}
.pill-live{display:inline-flex;align-items:center;gap:8px;font-size:var(--t2);color:var(--ink-3)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px var(--ok-soft)}
.bell{position:relative;background:none;border:0;font-size:var(--t4);padding:4px 6px;line-height:1;border-radius:var(--r3)}
.bell:hover{background:var(--panel-3)}
.bell i{position:absolute;top:-2px;right:-3px;background:var(--crit);color:#fff;font-style:normal;
  font-family:inherit;font-size:10.5px;font-weight:600;border-radius:999px;padding:1px 6px}
.content{padding:0;display:block}

/* ---------- en-tête de page ---------- */
.pagetop{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--sp4);flex-wrap:wrap;
  padding:40px 40px 0}
@media(max-width:1100px){.pagetop{padding:var(--sp5) var(--sp4) 0}}
.ptleft{min-width:0}
.crumb{font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
h1.page{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;
  font-size:clamp(27px,2.9vw,40px);letter-spacing:-.032em;margin:10px 0 var(--sp2);text-wrap:balance;line-height:1.02;
  font-feature-settings:"ss01" 1}
@media(max-width:900px){.page{font-size:28px}}
.pagetop p{margin:0;color:var(--ink-3);font-size:var(--t3);max-width:76ch}
.ptacts{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.tabs{display:flex;gap:var(--sp1);padding:var(--sp4) var(--sp5) 0;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{background:none;border:0;border-bottom:2.5px solid transparent;padding:10px 14px;font-size:var(--t3);
  color:var(--ink-3);display:flex;gap:8px;align-items:center;white-space:nowrap;margin-bottom:-1px;
  border-radius:var(--r3) var(--r3) 0 0}
.tab:hover{color:var(--ink);background:var(--panel-2)}
.tab.on{color:var(--ink);border-bottom-color:var(--act);font-weight:700}
.tn{font-size:var(--t1);background:var(--panel-3);color:var(--ink-2);padding:1px 8px;border-radius:999px;font-weight:600}
.tab.on .tn{background:var(--pri-soft);color:var(--pri-txt)}
.tn.hot{background:var(--crit);color:#fff}
.viewbody{padding:var(--sp5) 40px 72px;display:flex;flex-direction:column;gap:var(--sp5)}
@media(max-width:1100px){.viewbody{padding:var(--sp4) var(--sp4) var(--sp6)}}
@media(max-width:640px){.pagetop,.tabs{padding-left:16px;padding-right:16px}.viewbody{padding:18px 16px 40px}
  h1.page{font-size:var(--t5)}}
.pagehead{display:none}

/* ---------- cartes ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);overflow:hidden}
.card>header{display:flex;align-items:baseline;gap:var(--sp3);padding:26px 26px 14px;border-bottom:1px solid var(--line);background:var(--panel-2);flex-wrap:wrap}
.card>header+.tw table tr:first-child th{border-top:1px solid var(--line)}
.card>header h2{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:20px;
  font-weight:600;margin:0;letter-spacing:-.02em;line-height:1.2}
.card>header .sp{margin-left:auto;display:flex;gap:var(--sp2);align-items:center;flex-wrap:wrap}
.split{display:grid;gap:var(--sp4);grid-template-columns:1.5fr 1fr;align-items:start}
@media(max-width:1000px){.split{grid-template-columns:1fr}}
.note{background:var(--panel-2);border-left:2px solid var(--line-2);padding:var(--sp3) var(--sp4);
  border-radius:0 var(--r3) var(--r3) 0;font-size:var(--t2);color:var(--ink-2);line-height:1.55}
.note p{margin:0}
.hint{font-size:var(--t2);color:var(--ink-3);margin-top:5px}
.sub2{color:var(--ink-3);font-size:var(--t2)}
.empty{padding:var(--sp6) var(--sp4);text-align:center;color:var(--ink-3);font-size:var(--t3)}

/* ---------- KPI ---------- */
.kpis{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(158px,1fr))}
.kpi{background:var(--panel);border:0;border-radius:14px;padding:22px 20px 20px;box-shadow:var(--sh-1);
  display:flex;flex-direction:column;min-height:148px}
.kpi .k{font-size:var(--t1);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-weight:700}
.kpi .v{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;
  font-size:clamp(26px,2.5vw,38px);line-height:1;margin-top:auto;padding-top:14px;
  font-variant-numeric:tabular-nums;letter-spacing:-.038em;color:var(--ink);
  overflow-wrap:anywhere}
.kpi .m{font-size:12.5px;color:var(--ink-3);margin-top:10px;line-height:1.45}
.eta{margin-top:4px;font-size:12px;color:var(--ink-2)}
.pe-pause{display:block;width:100%;margin:0 0 8px;padding:12px;border:1.5px solid var(--line-2);border-radius:12px;background:var(--panel);color:var(--ink);font-size:15px;font-weight:600}
.kpis.mini{gap:8px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.kpis.mini .kpi{padding:9px 12px 8px;min-height:0;border-radius:10px;flex-direction:row;align-items:baseline;gap:8px;flex-wrap:wrap}
.kpis.mini .kpi .k{font-size:10.5px;letter-spacing:.06em}
.kpis.mini .kpi .v{font-size:19px;margin:0;padding:0;letter-spacing:-.02em}
.kpis.mini .kpi .m{font-size:11px;margin:0;width:100%;line-height:1.3}
.kpi.kalert{border-color:var(--crit);background:linear-gradient(180deg,var(--crit-soft),transparent 62%)}
.kpi.good .v{color:var(--ok)}

/* ---------- tableaux ---------- */
.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:700px}
th,td{padding:16px var(--sp3);text-align:left;border-bottom:1px solid var(--line);vertical-align:top;font-size:var(--t3)}
td:first-child{padding-left:var(--sp4)} td:last-child{padding-right:var(--sp4)}
th:first-child{padding-left:var(--sp4)} th:last-child{padding-right:var(--sp4)}
td .btnrow{justify-content:flex-end}
thead th{font-size:var(--t1);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2);font-weight:700;
  background:var(--panel-2);white-space:nowrap;position:sticky;top:0;border-bottom:2px solid var(--line-2);
  padding-top:12px;padding-bottom:12px}
tbody tr:nth-child(even){background:var(--panel-2)}
tbody tr:hover{background:var(--act-soft)}
tbody tr:last-child td{border-bottom:0}
tbody tr:last-child td{border-bottom:none}
td.num,th.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{color:var(--ink)}
th .sa{margin-left:5px;color:var(--pri-txt)}
.callno{font-family:inherit;font-weight:700;color:var(--ink);background:none;border:0;
  padding:0;font-size:var(--t3);font-variant-numeric:tabular-nums;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.callno:hover{text-decoration:underline}

/* ---------- pastilles ---------- */
.b{display:inline-block;font-size:var(--t1);letter-spacing:.03em;padding:3px 9px;border-radius:999px;
  white-space:nowrap;font-weight:600;background:var(--panel-3);color:var(--ink-2)}
.b.n{background:var(--panel-3);color:var(--ink-2)}
.b.beacon{background:var(--beacon-soft);color:var(--beacon)}
.b.ok{background:var(--ok-soft);color:var(--ok)}
.b.info{background:var(--info-soft);color:var(--info)}
.b.crit{background:var(--crit-soft);color:var(--crit)}
.b.warn{background:var(--warn-soft);color:var(--warn)}
.delay{font-family:inherit;font-variant-numeric:tabular-nums;font-size:var(--t3);font-weight:600}
.delay.w{color:var(--warn)}
.delay.c{color:var(--crit)}
.tsp{display:inline-flex;gap:6px;align-items:center;font-size:var(--t2);padding:3px 10px;border-radius:999px;
  font-family:inherit;justify-self:start;width:fit-content;font-weight:600}
.tsp.ok{background:var(--ok-soft);color:var(--ok)}
.tsp.beacon{background:var(--beacon-soft);color:var(--beacon)}
.tsp.crit{background:var(--crit-soft);color:var(--crit)}

/* ---------- boutons ---------- */
.btn{border:1px solid var(--line);background:var(--panel);color:var(--ink-2);border-radius:var(--r2);
  padding:9px 15px;font-size:var(--t3);font-weight:500;white-space:nowrap;box-shadow:none;
  transition:background .12s,border-color .12s,color .12s}
.btn:hover{background:var(--panel-2);border-color:var(--line-2);color:var(--ink)}
.btn:active{transform:translateY(1px)}
.btn.pri{background:var(--act);border-color:var(--act);color:var(--act-ink);font-weight:600}
.btn.carte-btn{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:700;font-size:var(--t3);
  padding:10px 18px;display:inline-flex;align-items:center;gap:8px}
.btn.carte-btn:hover{background:#000}
.btn.pri:hover{background:var(--act-2);border-color:var(--act-2);color:var(--act-ink)}
.btn.go{background:var(--ok);border-color:var(--ok);color:#fff;font-weight:600}
.btn.go:hover{filter:brightness(1.12);color:#fff}
.btn.urg{background:var(--pri);border-color:var(--pri);color:var(--pri-ink);font-weight:700}
.btn.urg:hover{filter:brightness(.95);color:var(--pri-ink)}
.btn.gh{background:none;border-color:transparent;color:var(--ink-3);box-shadow:none}
.btn.gh:hover{background:var(--panel-2);border-color:transparent;color:var(--ink-2)}
.btn.sm{padding:6px 11px;font-size:var(--t2)}
.btn[disabled]{cursor:not-allowed}
.btnrow{display:flex;gap:var(--sp2);flex-wrap:wrap;align-items:center}
.gpslink{display:inline-block;margin-left:9px;font-size:var(--t2);color:var(--pri-txt);text-decoration:none;
  border:1px solid var(--line-2);border-radius:999px;padding:2px 11px;white-space:nowrap;font-weight:500}
.gpslink:hover{border-color:var(--pri-txt);background:var(--pri-soft)}
.chip{border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:7px 15px;
  font-size:var(--t3);box-shadow:var(--sh-1)}
.chip:hover{background:var(--panel-2)}
.chip.on{background:var(--ink);color:var(--panel);border-color:var(--ink);font-weight:600}
.chip.ring{border-color:var(--beacon-fill);box-shadow:0 0 0 3px var(--beacon-soft)}

/* ---------- formulaires ---------- */
label{display:block}
label>span{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
  margin-bottom:7px;font-weight:600}
input,select,textarea{width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r2);
  padding:11px 13px;font:inherit;font-size:var(--t3);color:var(--ink);transition:background .12s,border-color .12s}
input:hover,select:hover,textarea:hover{border-color:var(--line-2)}
input:focus,select:focus,textarea:focus{background:var(--panel);border-color:var(--act);outline:none;
  box-shadow:0 0 0 3px var(--act-soft)}
input::placeholder,textarea::placeholder{color:var(--ink-3);opacity:.75}
input:focus,select:focus,textarea:focus{border-color:var(--pri);outline:none;box-shadow:0 0 0 3px var(--pri-soft)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form{display:grid;gap:var(--sp4);grid-template-columns:1fr 1fr 340px;align-items:start}
@media(max-width:1120px){.form{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.form{grid-template-columns:1fr}}
.fset{background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1)}
.fset>h3{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:0;
  padding:20px 20px 0;border-bottom:0;font-weight:600}
.fbody{padding:20px;display:grid;gap:16px}
.tin{width:112px;text-align:right;font-family:inherit;font-variant-numeric:tabular-nums;padding:6px 10px}

/* ---------- estimation ---------- */
.est{position:sticky;top:80px;display:grid;gap:13px}
.estbox{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-2);padding:16px}
.estbox h3{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t3);margin:0 0 3px}
.estline{display:flex;justify-content:space-between;gap:12px;font-size:var(--t3);padding:5px 0;border-bottom:1px dashed var(--line)}
.estline:last-of-type{border-bottom:0}
.estline .l{color:var(--ink-2)}
.estline .v{font-family:inherit;font-variant-numeric:tabular-nums}
.esttot{display:flex;justify-content:space-between;align-items:baseline;margin-top:10px;padding-top:10px;
  border-top:2px solid var(--ink)}
.esttot .v{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t5);font-variant-numeric:tabular-nums}
.marge{display:flex;justify-content:space-between;font-size:var(--t2);color:var(--ink-3);margin-top:7px}
.marge b{color:var(--ok)}
.chartebox{border-left:3px solid var(--beacon)}
.chartebox .ctop{display:flex;justify-content:space-between;align-items:baseline;gap:9px;flex-wrap:wrap}
.chartebox .ctag{font-size:var(--t1);letter-spacing:.08em;text-transform:uppercase;background:var(--beacon-soft);
  color:var(--beacon);padding:3px 9px;border-radius:999px;font-weight:700}
.chartebox .czone{font-size:var(--t2);color:var(--ink-3)}
.chartebox .cgrid{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin-top:10px;font-size:var(--t2);
  padding-top:10px;border-top:1px dashed var(--line)}
.chartebox .cgrid span{color:var(--ink-3)}
.chartebox .cgrid b{font-family:inherit;font-weight:600}
.legs{display:grid;gap:4px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r3);padding:11px 13px}
.leg{display:flex;justify-content:space-between;gap:12px;font-size:var(--t2);color:var(--ink-2)}
.leg .v{font-family:inherit;font-variant-numeric:tabular-nums}
.leg.tot{border-top:1px solid var(--line);margin-top:4px;padding-top:6px;font-weight:600;color:var(--ink)}

/* ---------- alertes et fil ---------- */
.alerts{display:grid;gap:var(--sp1)}
.alert{display:grid;grid-template-columns:88px 1fr auto;gap:var(--sp3);align-items:center;background:var(--panel);
  border:0;border-left:3px solid var(--line-2);border-radius:var(--r3);
  padding:var(--sp2) var(--sp4);box-shadow:var(--sh-1);min-height:38px}
.alert .ai{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:700}
.alert .at{font-size:var(--t2);color:var(--ink-2)}
.alert.ok{border-left-color:var(--ok)}
.alert.crit{border-left-color:var(--crit);background:var(--crit-soft)}
.alert.crit .at,.alert.crit .ai{color:var(--crit)}
.alert.warn{border-left-color:var(--beacon-fill)}
.fins{display:grid;gap:9px}
.fin{display:grid;grid-template-columns:30px 1fr auto;gap:var(--sp3);align-items:center;background:var(--ok-soft);
  border:0;border-left:3px solid var(--ok);border-radius:var(--r3);padding:var(--sp3) var(--sp4)}
.finic{width:30px;height:30px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;font-size:var(--t3)}
.fin b{display:block;font-size:var(--t3);color:var(--ok)}
.finx{font-size:var(--t3);color:var(--ink-2)}
.finb{display:flex;gap:7px;flex-wrap:wrap}
.nt{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:8px 0;
  border-bottom:1px solid var(--line);font-size:var(--t3)}
.nt:last-child{border-bottom:none}
.nth{font-family:inherit;font-size:var(--t2);color:var(--ink-3)}
.nt.ok .ntt{color:var(--ok)}
.nt.crit .ntt{color:var(--crit)}
.nt.info .ntt{color:var(--info)}
.nt.fin .ntt{font-weight:600}
.raps{margin-top:6px;font-size:var(--t2);color:var(--crit);font-weight:600}

/* ---------- avancement ---------- */
.av{display:grid;gap:6px;margin-top:5px}
.avtop{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:var(--t2)}
.avtop b{font-weight:600;color:var(--ink)}
.avtop b.late{color:var(--crit)}
.avtop span{color:var(--ink-3);font-family:inherit;font-size:var(--t2);white-space:nowrap}
.avbar{position:relative;height:7px;background:var(--panel-3);border-radius:999px;overflow:visible}
.avbar>span{display:block;height:100%;border-radius:999px;background:var(--pri);transition:width .5s}
.avbar>span.late{background:var(--crit)}
.avbar>i{position:absolute;top:-3px;width:13px;height:13px;border-radius:50%;background:var(--panel);
  border:2px solid var(--line-2);transform:translateX(-50%)}
.avbar>i.ok{background:var(--ok);border-color:var(--ok)}
.avfoot{font-size:var(--t1);color:var(--ink-3)}

/* ---------- listes et planning ---------- */
.plan{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(232px,1fr))}
.lane{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-2);min-height:130px}
.lane>h3{margin:0;padding:12px 15px;border-bottom:1px solid var(--line);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:var(--t3);display:flex;justify-content:space-between;align-items:center;gap:9px}
.lane>h3 small{font-family:inherit;font-size:var(--t1);color:var(--ink-3);font-weight:400}
.lane .jobs{padding:10px;display:grid;gap:8px}
.job{border:1px solid var(--line);border-left:3px solid var(--pri);border-radius:var(--r3);padding:10px 12px;background:var(--panel-2)}
.job b{font-family:inherit;font-size:var(--t2);color:var(--pri-txt)}
.job div{font-size:var(--t2);color:var(--ink-2)}
.lane .free{padding:18px 14px;color:var(--ink-3);font-size:var(--t2);text-align:center}
.agdays{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.agday{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-2)}
.agday>h3{margin:0;padding:11px 14px;border-bottom:1px solid var(--line);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:var(--t3);display:flex;justify-content:space-between;align-items:baseline}
.agday>h3 small{font-family:inherit;font-size:var(--t1);color:var(--ink-3);font-weight:400}
.agday.today{border-color:var(--pri);box-shadow:0 0 0 3px var(--pri-soft),var(--sh-2)}
.agday.today>h3{color:var(--ink);background:var(--pri-soft)}
.agitems{padding:10px;display:grid;gap:8px;min-height:70px}
.agit{border:1px solid var(--line);border-left:3px solid var(--info);border-radius:var(--r3);padding:9px 11px;background:var(--panel-2)}
.agit b{font-family:inherit;font-size:var(--t2);color:var(--info)}
.agit .h{font-family:inherit;font-size:var(--t2);color:var(--ink);float:right;font-weight:600}
.agit div{font-size:var(--t2);color:var(--ink-2)}
.agempty{color:var(--ink-3);font-size:var(--t2);text-align:center;padding:18px 6px}
/* Deux paires étiquette / valeur par ligne : on n'était pas obligé
   d'empiler une valeur courte (Anthony, 17 sept. 2026). Les champs longs
   (adresses, documents…) portent .large et reprennent la ligne en entier. */
/* Anthony, 17 sept. 2026 : les lignes de séparation rendaient la fiche
   dure à lire. L'option facile : pas de trait, juste de l'espace entre
   les champs. */
.kv{display:grid;grid-template-columns:110px 1fr 110px 1fr;gap:12px var(--sp3);font-size:var(--t3);padding:var(--sp4)}
.kv>dt.large,.kv>dd.large{grid-column:1/-1}
.kv>dt,.kv>dd{padding:0}
.kv dt{font-size:var(--t1);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);padding-top:3px;font-weight:600}
.kv dd{margin:0}
.kv dd.clic{cursor:pointer;border-radius:6px;margin:0 -6px;padding-left:6px;padding-right:6px}
.kv dd.clic:hover{background:var(--panel-2)}
/* À facturer : bandes amincies deux fois, puis encore 25 % (Anthony, 17 sept. 2026).
   Le vrai coupable des bandes épaisses était l'adresse qui retombait sur
   5-6 lignes : .tronc la tient sur une seule, l'adresse complète reste
   au survol (title). */
table.serre th,table.serre td{padding-top:6px;padding-bottom:6px}
table.serre td.tronc,table.serre td .tronc{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}
.verif{display:grid;grid-template-columns:20px 1fr auto;gap:10px;align-items:center;font-size:var(--t3);
  padding:6px 0;border-bottom:1px solid var(--line)}
.verif:last-child{border-bottom:none}
.verif .ok{color:var(--ok);font-weight:700}
.verif .no{color:var(--crit);font-weight:700}
.verif b{font-family:inherit;font-size:var(--t2);font-weight:500;color:var(--ink-2)}
.drvpick{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.perms{display:grid;gap:var(--sp2);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
@media(max-width:640px){.perms{grid-template-columns:1fr}}
.perm{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:var(--r2);
  padding:11px 13px;background:var(--panel-2);font-size:var(--t3)}
.perm input{width:auto;margin-top:3px}
.perm b{display:block;font-weight:600}
.perm span{font-size:var(--t2);color:var(--ink-3)}
.pjs{display:grid;gap:8px}
.pj{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:var(--r2);
  padding:10px 13px;background:var(--panel-2);font-size:var(--t3)}
.pj input{width:auto}
.pj.on{border-color:var(--ok);background:var(--ok-soft)}
.gal{display:flex;gap:8px;flex-wrap:wrap}
.galt{padding:0;border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;background:none;
  width:70px;height:70px;position:relative}
.gal.dark .galt{border-color:#2b3944}
.galt img{width:100%;height:100%;object-fit:cover;display:block}
.galt.sel{outline:2.5px solid var(--pri);outline-offset:-2px}
.galck{position:absolute;right:3px;bottom:3px;background:var(--pri);color:var(--pri-ink);border-radius:var(--r3);
  font-size:var(--t1);padding:0 5px;font-weight:700}
.clo{display:grid;gap:5px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r2);padding:13px 15px}
.clor{display:flex;justify-content:space-between;gap:12px;font-size:var(--t3);color:var(--ink-2)}
.clor b{color:var(--ink);font-weight:600}
.clor.tot{border-top:1px solid var(--line);margin-top:5px;padding-top:7px;font-size:var(--t3)}
.basebox{border:1px solid var(--beacon-fill);border-left:3px solid var(--beacon-fill);background:var(--beacon-soft);
  border-radius:var(--r2);padding:14px 16px}
.basebox.ok{border-color:var(--ok);border-left-color:var(--ok);background:var(--ok-soft)}
.basetitle{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t3)}
.geobox{border:1px solid var(--line);border-left:3px solid var(--ok);border-radius:var(--r2);padding:15px 17px;background:var(--panel-2)}
.geotitle{font-weight:600;font-size:var(--t3)}
.geocoord{font-family:inherit;font-size:var(--t4);margin:5px 0 3px}
.smsbox{border:1px solid var(--line);border-radius:var(--r2);background:var(--panel-2);padding:14px 16px}
.smsfrom{font-size:var(--t1);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.smsmsg{font-size:var(--t3);margin-top:6px;line-height:1.55}
.smslink{color:var(--pri);text-decoration:underline}
.smsfine{font-size:var(--t2);color:var(--ink-3)}
.clientview{border:1px solid var(--line-2);border-radius:var(--r);padding:18px;background:var(--panel)}
.cvtitle{font-size:var(--t1);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:9px;font-weight:600}
.ptdiv{text-align:center;font-size:var(--t1);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);
  margin:6px 0 -2px;font-weight:600}

/* ---------- barres horizontales ---------- */
.hbars{display:grid;gap:11px}
.hb{display:grid;grid-template-columns:minmax(92px,164px) 1fr auto;gap:12px;align-items:center}
.hb .hl{font-size:var(--t2);color:var(--ink-2);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb .ht{background:var(--panel-3);border-radius:999px;height:17px;overflow:hidden}
.hb .hf{display:block;height:100%;border-radius:999px;transition:width .3s}
.hb .hv{font-family:inherit;font-size:var(--t2);color:var(--ink);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.hb .hv em{font-style:normal;color:var(--ink-3)}

/* ---------- graphiques ---------- */
.viz{--s1:#1857c4;--s2:#c2410c;--s3:#0a7d5a;--gridc:#e3e9ef;--axis:#9aa8b5}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .viz{--s1:#6ba5ff;--s2:#e8813f;--s3:#3fbe8d;--gridc:#26323d;--axis:#6d7f8e}}
/* Écran d'accueil : rien d'autre que le nom, l'identifiant et le mot de passe */
.scrim.accueil{background:linear-gradient(160deg,var(--nav) 0%,var(--nav-2) 62%,var(--act-2) 100%)}
.accueil .modal{border:0;box-shadow:var(--sh-3)}
.marque{margin:0 0 6px}
.marquetxt{font-size:27px;font-weight:800;letter-spacing:-.02em;color:var(--ink);line-height:1.12}
/* Le jaune du logo sur du blanc ne fait que 1,37:1 : ecrit tel quel,
   le « 360 » s'efface. On lui rend sa construction d'origine — noir sur
   jaune, comme sur l'enseigne — ce qui donne 13,5:1 et fonctionne
   aussi bien sur fond clair que sur fond sombre. */
.marquetxt span{color:var(--act-ink);background:var(--act);
  padding:0 .16em;border-radius:.16em}
.accueil label{margin-top:10px}
@media(max-width:700px){ .accueil .modal{width:100%;border-radius:var(--r)} .marquetxt{font-size:34px} }
:root[data-theme="dark"] .viz{--s1:#6ba5ff;--s2:#e8813f;--s3:#3fbe8d;--gridc:#26323d;--axis:#6d7f8e}
.viz svg{display:block;width:100%;height:auto;overflow:visible}
.viz .gl{stroke:var(--gridc);stroke-width:1}
.viz .lbl{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t1);fill:var(--ink-3)}
.viz .val{font-family:inherit;font-size:var(--t1);fill:var(--ink-3)}
.viz rect.mk{transition:opacity .12s}
.viz:hover rect.mk{opacity:.5}
.viz rect.mk:hover{opacity:1}
.legendv{display:flex;gap:16px;flex-wrap:wrap;font-size:var(--t2);color:var(--ink-2);padding:0 18px 14px}
.legendv i{width:11px;height:11px;border-radius:var(--r3);display:inline-block;margin-right:7px;vertical-align:-1px}
.chip.off{opacity:.55}
.drvname{font-size:var(--t3);font-weight:700;color:var(--ink);display:block;line-height:1.25}
.ph-cam{background:none;border:1px solid var(--p-line);color:var(--p-txt3);border-radius:999px;padding:3px 11px;
  font-size:var(--t1);font-family:inherit}
.ph-cam:hover{border-color:var(--p-acc);color:var(--p-acc-txt)}

/* ===== appli chauffeur : onglets et rangées ===== */
.ph-tabs{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--p-line2);background:var(--p-bar)}
.ph-tab{position:relative;background:none;border:0;color:var(--p-mut2);display:grid;justify-items:center;gap:3px;
  padding:10px 2px 12px;font-size:10.5px;line-height:1.2;text-align:center}
.ph-tab span{display:block}
.ph-tab.on{color:var(--p-acc-txt)}
.ph-tab.on:after{content:"";position:absolute;top:0;left:18%;right:18%;height:2.5px;background:var(--p-acc);border-radius:0 0 3px 3px}
.ph-pt{position:absolute;top:7px;right:26%;width:7px;height:7px;border-radius:50%;background:var(--p-crit)}
.ph-pn{position:absolute;top:5px;right:20%;background:var(--p-acc);color:var(--p-ink-acc);font-style:normal;
  font-size:9.5px;font-weight:700;border-radius:999px;padding:0 5px}
.ph-cli{font-size:var(--t2);color:var(--p-mut);margin-top:4px}
.ph-body{max-height:min(560px,58vh);overflow:auto}
.ph-call{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;border:1px solid var(--p-line);
  background:var(--p-carte);border-radius:var(--r);padding:12px 14px;text-decoration:none;color:inherit}
.ph-call b{display:block;font-size:var(--t3);color:var(--p-fort)}
.ph-call span span{font-size:var(--t2);color:var(--p-mut)}
.ph-callic{width:36px;height:36px;border-radius:50%;background:var(--p-ok);color:var(--p-ink-ok);display:grid;place-items:center;font-size:var(--t3)}
.ph-row{display:grid;grid-template-columns:26px 1fr auto;gap:12px;align-items:center;width:100%;text-align:left;
  border:1px solid var(--p-line);background:var(--p-carte);color:var(--p-txt3);border-radius:var(--r);padding:13px 14px;
  text-decoration:none;font-size:var(--t3)}
.ph-row:hover{border-color:var(--p-line-h)}
.ph-row b{display:block;color:var(--p-txt);font-weight:600}
.ph-row span span{font-size:var(--t2);color:var(--p-mut2)}
.ph-row.ok{border-color:var(--p-ok-bd2);background:var(--p-ok-bg)}
.ph-row.ok b{color:var(--p-ok-txt)}
.ph-chev{color:var(--p-mut3);font-size:var(--t4)}
.ph-shoot{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;cursor:pointer;
  border:1.5px dashed var(--p-line-h);background:var(--p-carte);border-radius:var(--r);padding:16px}
.ph-shoot b{display:block;font-size:var(--t3);color:var(--p-fort)}
.ph-shoot span span{font-size:var(--t2);color:var(--p-mut)}
.ph-shoot>span,.ph-scan>span{text-transform:none;letter-spacing:0;font-weight:400;color:var(--p-txt3)}
.ph-shootic{font-size:var(--t5);text-align:center;color:var(--p-txt3)}
.ph-vide{text-align:center;color:var(--p-mut2);font-size:var(--t2);padding:16px}
.ph-total{display:flex;justify-content:space-between;align-items:baseline;background:var(--p-acc);color:var(--p-ink-acc);
  border-radius:var(--r);padding:14px 16px}
.ph-total span{font-size:var(--t2);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.ph-total b{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t5);font-weight:700}
.ph-chip{font-size:var(--t2);color:var(--p-mut);text-align:center}
.apercu{background:#fff;color:#111;border:1px solid var(--line-2);border-radius:var(--r3);padding:16px;
  font-size:var(--t1);line-height:1.45;max-height:430px;overflow:auto}
.ap-hd{display:flex;gap:10px;align-items:flex-start;border-bottom:2px solid #111;padding-bottom:9px;margin-bottom:9px}
.ap-logo{width:40px;height:40px;object-fit:contain;background:#e1e352;color:#14140a;border-radius:var(--r3);display:grid;place-items:center;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t1);flex:none}
.ap-ent{font-size:10.5px;color:#333}
.ap-tt{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t3);margin-bottom:7px}
.ap-cl{margin-bottom:7px}
.ap-l{color:#444;margin-bottom:3px}
.ap-sm{font-size:10px;color:#777}
.ap-t{width:100%;min-width:0;border-collapse:collapse;margin:9px 0}
.ap-t td{padding:4px 0;border-bottom:1px solid #e5e5e5;font-size:var(--t1);color:#222}
.ap-t .ap-tot td{font-weight:700;border-top:2px solid #111;border-bottom:none}
.ap-pd{border-top:1px solid #ddd;margin-top:9px;padding-top:8px;color:#555;font-size:10.5px}
.carte{padding:16px;background:var(--panel-2)}
.carte svg{display:block;width:100%;height:auto;border-radius:var(--r3);overflow:visible}
.c-fond{fill:var(--panel);stroke:var(--line);stroke-width:1;rx:8}
.c-fleuve{fill:none;stroke:var(--info-soft);stroke-width:14;stroke-linecap:round;stroke-linejoin:round}
.c-route{fill:none;stroke:var(--line-2);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.c-rtxt{font-family:inherit;font-size:10px;fill:var(--ink-3)}
.c-ville{fill:var(--line-2)}
.c-vtxt{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:10px;fill:var(--ink-3)}
.c-base rect{fill:var(--ink);stroke:var(--panel);stroke-width:2}
.c-bt{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:10px;font-weight:700;fill:var(--pri);text-anchor:middle}
.c-trajet{fill:none;stroke:var(--pri);stroke-width:1.5;stroke-dasharray:5 4;opacity:.65}
.c-ori{fill:var(--beacon-fill);stroke:var(--panel);stroke-width:2}
.c-des{fill:var(--ok);stroke:var(--panel);stroke-width:2}
.c-num{font-family:inherit;font-size:8.5px;font-weight:700;fill:#0b0c0a;text-anchor:middle}
.c-cam circle{fill:var(--ink);stroke:var(--panel);stroke-width:2.5}
.c-cam.roule circle{fill:var(--info)}
.c-halo{fill:var(--info);opacity:.16;stroke:none}
@media(prefers-reduced-motion:no-preference){.c-cam.roule .c-halo{animation:ping 1.8s ease-out infinite}}
@keyframes ping{0%{r:10;opacity:.35}100%{r:22;opacity:0}}
.c-ct{font-family:inherit;font-size:9.5px;font-weight:700;fill:#fff;text-anchor:middle}
.c-cs{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:9.5px;fill:#8ea0b0}
.c-cn{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t1);font-weight:600;fill:var(--ink)}
.mk-l{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.mk-l.cam{background:var(--info)}.mk-l.ori{background:var(--beacon-fill)}
.mk-l.des{background:var(--ok)}.mk-l.bas{background:var(--ink);border-radius:var(--r3)}
.ph-msg{position:relative;background:none;border:1px solid var(--p-line);color:var(--p-txt3);border-radius:999px;
  padding:3px 11px;font-size:var(--t2)}
.ph-msg.on{border-color:var(--p-crit);color:var(--p-crit-txt2)}
.ph-msg i{position:absolute;top:-5px;right:-5px;background:var(--p-crit);color:var(--p-ink-crit);font-style:normal;
  font-size:9.5px;font-weight:700;border-radius:999px;padding:0 5px}
tr.rowclic,[data-rowfour]{cursor:pointer}
tr.rowclic:hover,tr[data-rowfour]:hover{background:var(--pri-soft)}
.agit.rowclic,.job.rowclic{cursor:pointer;transition:border-color .12s,transform .06s}
.agit.rowclic:hover,.job.rowclic:hover{border-color:var(--pri);transform:translateX(1px)}
.ph-seq{display:grid;gap:8px}
.ph-sq{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:center;width:100%;text-align:left;
  border:1px solid var(--p-line);background:var(--p-carte);color:var(--p-txt4);border-radius:var(--r);padding:12px 13px;font-size:var(--t3)}
.ph-sq .nu{width:26px;height:26px;border-radius:50%;border:2px solid var(--p-line6);display:grid;place-items:center;
  font-family:inherit;font-size:var(--t1);font-weight:700}
.ph-sq .tx b{display:block;color:var(--p-txt2);font-weight:600;font-size:var(--t3)}
.ph-sq .tx span{font-size:var(--t2);color:var(--p-mut2)}
.ph-sq .hh{font-family:inherit;font-size:var(--t1);color:var(--p-mut2)}
.ph-sq.fait{background:var(--p-ok-bg);border-color:var(--p-ok-bd)}
.ph-sq.fait .nu{background:var(--p-ok);border-color:var(--p-ok);color:var(--p-ink-ok)}
.ph-sq.fait .tx b{color:var(--p-ok-txt)}
.ph-sq.ici{border-color:var(--p-line-nx);background:var(--p-carte-ici)}
.ph-sq.ici .nu{border-color:var(--p-mut);color:var(--p-txt2)}
.ph-sq.act{background:var(--p-acc);border-color:var(--p-acc);padding:18px 15px}
.ph-sq.act .nu{background:var(--p-acc-ink);border-color:var(--p-acc-ink);color:var(--p-acc-txt)}
.ph-sq.act .tx b{color:var(--p-acc-ink);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t4);line-height:1.2}
.ph-sq.act .tx span,.ph-sq.act .hh{color:var(--p-acc-sub);font-weight:600}
.ph-sq.act.fin{background:var(--p-ok);border-color:var(--p-ok)}
.ph-sq.act.fin .nu{background:var(--p-ok-ink);border-color:var(--p-ok-ink);color:var(--p-ok-txt2)}
.ph-sq.act.fin .tx b{color:var(--p-fort)}
.ph-sq.act.fin .tx span,.ph-sq.act.fin .hh{color:var(--p-ok-sub)}
.ph-sq.futur{opacity:.5}
.ph-sq.act.bloq{background:var(--p-crit-bg);border-color:var(--p-crit-bd)}
.ph-sq.act.bloq .nu{background:var(--p-crit);border-color:var(--p-crit);color:var(--p-ink-crit)}
.ph-sq.act.bloq .tx b{color:var(--p-crit-txt)}
.ph-sq.act.bloq .tx span,.ph-sq.act.bloq .hh{color:var(--p-crit-sub);font-weight:500}
.ph-bloq{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:var(--p-crit-bg2);border:1px solid var(--p-crit-bd2);
  border-radius:var(--r);padding:9px 12px;margin-top:-3px;font-size:var(--t2);color:var(--p-crit-sub)}
.ph-bloq span{white-space:nowrap}
.ph-bloq .ph-rapb{margin-left:auto;background:var(--p-crit);color:var(--p-ink-crit);font-weight:600}
/* ===== document imprimable ===== */
#docprint{display:none}
.doc{--doc-ink:#141414;--doc-2:#5a5a5a;--doc-3:#8a8a8a;--doc-line:#dcdcdc;--doc-fill:#f4f4f1;--doc-acc:#0e2740;
  background:#fff;color:var(--doc-ink);padding:34px 40px 28px;font-size:12.5px;line-height:1.45;max-width:820px;margin:0 auto;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,Helvetica,Arial,sans-serif;font-variant-numeric:tabular-nums}
.doc-hd{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding-bottom:16px;border-bottom:3px solid var(--doc-acc)}
.doc-id{display:flex;gap:14px;align-items:flex-start}
.doc-logo{width:72px;height:72px;object-fit:contain;flex:none;border-radius:6px;background:var(--doc-fill);color:var(--doc-acc);display:grid;place-items:center;font-weight:800;font-size:28px}
.doc-co{font-weight:800;font-size:17px;letter-spacing:-.01em;color:var(--doc-acc);margin-bottom:2px}
.doc-sm{font-size:11.5px;color:var(--doc-2)}
.doc-ent{margin-top:4px;color:var(--doc-3)}
.doc-meta{text-align:right;flex:none}
.doc-ty{font-weight:800;font-size:26px;letter-spacing:.06em;color:var(--doc-acc);line-height:1;margin-bottom:8px}
.doc table{width:auto;min-width:0}
.doc tbody tr,.doc tbody tr:hover,.doc tbody tr:nth-child(even){background:none;transition:none}
.doc td,.doc th{padding:0;border:0;font-size:inherit;background:none}
.doc-mt{border-collapse:collapse;font-size:12px;width:auto}
.doc-meta .doc-mt{margin-left:auto}
.doc .doc-mt td{padding:2px 0 2px 14px;vertical-align:top}
.doc .doc-mt td:first-child{color:var(--doc-3);padding-left:0;white-space:nowrap}
.doc-meta .doc-mt td:first-child{text-align:right}
.doc-2col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.doc-blocs{margin:18px 0 14px}
.doc-panel{background:var(--doc-fill);border-radius:6px;padding:12px 14px;min-height:88px;min-width:0;overflow:hidden}
.doc-lb{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--doc-3);font-weight:700;margin-bottom:5px}
.doc-bd{font-weight:700;font-size:14px;margin-bottom:2px}
.doc-ligne{display:flex;gap:14px;align-items:baseline;padding:8px 0;border-top:1px solid var(--doc-line)}
.doc-ligne .doc-lb{margin:0;flex:none;width:110px}
.doc-trajet{padding:10px 0;border-top:1px solid var(--doc-line)}
.doc-span{grid-column:1/-1}
.doc-temps{padding:10px 0;border-top:1px solid var(--doc-line)}
.doc-tt{width:100%}
.doc .doc-tt td{padding:3px 0}
.doc-tt td:nth-child(2),.doc-tt td:nth-child(4){text-align:right;padding-right:28px;white-space:nowrap}
.doc-tt td:nth-child(3){color:var(--doc-3);padding-left:14px}
.doc .doc-t{width:100%;min-width:0;border-collapse:collapse;margin:18px 0 0}
.doc .doc-t th{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--doc-acc);text-align:left;padding:8px 10px;font-weight:700}
.doc-t th.r{text-align:right}
.doc .doc-t td{padding:8px 10px;border-bottom:1px solid var(--doc-line);font-size:12.5px;color:var(--doc-ink);vertical-align:top}
.doc-t tbody tr:nth-child(even) td{background:#fafaf8}
.doc-t .r{text-align:right;white-space:nowrap}
.doc-cd{color:var(--doc-3);font-size:11px;width:72px;white-space:nowrap}
.doc-totaux{margin:6px 0 0 auto;width:300px;padding-top:6px}
.doc-tx{display:flex;justify-content:space-between;gap:16px;padding:4px 10px}
.doc-tx.doc-tot{margin-top:6px;padding:10px;background:var(--doc-acc);color:#fff;font-weight:800;font-size:15px;border-radius:6px}
.doc-note{margin-top:16px;padding:10px 14px;background:var(--doc-fill);border-left:3px solid var(--doc-acc);font-style:italic}
.doc-paie{margin-top:12px;padding:10px 14px;background:#eef8f1;border-left:3px solid #177a52}
.doc-ph{display:flex;gap:6px;flex-wrap:wrap;margin-top:5px}
.doc-ph img{width:78px;height:78px;object-fit:cover;border:1px solid var(--doc-line);border-radius:4px}
.doc-pd{margin-top:26px;padding-top:12px;border-top:1px solid var(--doc-line);color:var(--doc-2);font-size:11.5px}
.doc-merci{font-size:12.5px;color:var(--doc-ink);margin-bottom:4px}
.docbox{border:1px solid var(--line);border-radius:var(--r3);overflow:auto;max-height:600px;background:#fff}
.docbox .doc{padding:26px 28px}
@media print{
  /* On ne cache l'ecran et on ne sort la zone « document » que s'il y a
     vraiment un document dedans. Sans ce garde-fou, un Ctrl+P donnait une
     page blanche (Maxime, 21 sept. 2026). */
  body.imprime-doc>*{display:none !important}
  body.imprime-doc #docprint{display:block !important}
  .doc{max-width:none;padding:0}
  .doc-t th,.doc-tx.doc-tot{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
.cartewrap{position:relative;border-radius:var(--r3);overflow:hidden;background:var(--panel)}
#cartehote{width:100%;height:min(72vh,640px);border-radius:var(--r3);overflow:hidden;background:var(--panel-3)}
#cartehote .gm-style img{max-width:none}
.carteavis{padding:18px;text-align:center;color:var(--ink-2);font-size:13.5px}
.cartewrap svg{cursor:grab}
.cartewrap svg:active{cursor:grabbing}
.c-route.maj{stroke-width:4;stroke:var(--line-2)}
.c-trace{fill:none;stroke:var(--info);stroke-width:2;opacity:.4;stroke-linecap:round;stroke-dasharray:2 4}
.c-cam.sel circle:not(.c-halo){stroke:var(--pri);stroke-width:3.5}
.c-cam{cursor:pointer}
.c-ech line{stroke:var(--ink-3);stroke-width:1.5}
.c-etxt{font-family:inherit;font-size:10.5px;fill:var(--ink-3);text-anchor:middle}
.c-ctrl{position:absolute;top:12px;right:12px;display:grid;gap:6px}
.c-btn{width:34px;height:34px;border-radius:var(--r2);border:1px solid var(--line-2);background:var(--panel);
  color:var(--ink);font-size:var(--t4);line-height:1;box-shadow:var(--sh-1)}
.c-btn:hover{background:var(--panel-3)}
.c-info{position:absolute;left:12px;bottom:12px;width:250px;background:var(--panel);border:1px solid var(--line-2);
  border-radius:var(--r);padding:14px;box-shadow:var(--sh-3)}
.c-fermer{position:absolute;top:8px;right:8px;background:none;border:0;color:var(--ink-3);font-size:var(--t3)}
.c-itt{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t3)}
.c-irow{display:flex;justify-content:space-between;gap:10px;font-size:var(--t2);padding:3px 0;border-bottom:1px solid var(--line)}
.c-irow:last-of-type{border-bottom:none}
.c-pied{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;padding:12px 2px 0}
.code{background:var(--panel-3);border:1px solid var(--line);border-radius:var(--r3);padding:13px 15px;
  font-family:inherit;font-size:var(--t1);line-height:1.6;overflow-x:auto;margin:0;color:var(--ink-2);
  white-space:pre}
.fsep{font-size:var(--t1);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:700;
  padding-top:6px;border-top:1px solid var(--line);margin-top:2px}
.unitrow{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.legendrow{display:flex;gap:16px;flex-wrap:wrap;font-size:var(--t2);color:var(--ink-3);align-items:center}
details.data{padding:0 18px 14px}
details.data summary{font-size:var(--t2);color:var(--ink-3);cursor:pointer}
details.data table{margin-top:10px;min-width:0}
.vtip{position:fixed;pointer-events:none;background:var(--nav);color:#fff;padding:7px 11px;border-radius:var(--r3);
  font-size:var(--t2);z-index:90;white-space:nowrap;box-shadow:var(--sh-3)}

/* ---------- autocomplétion ---------- */
.acwrap{position:relative;display:block}
.aclist{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:60;background:var(--panel);
  border:1px solid var(--line-2);border-radius:var(--r2);box-shadow:var(--sh-3);max-height:310px;overflow:auto}
.acitem{display:grid;grid-template-columns:30px 1fr auto;gap:11px;align-items:center;padding:10px 13px;
  cursor:pointer;border-bottom:1px solid var(--line)}
.acitem:last-child{border-bottom:none}
.acitem:hover,.acitem.on{background:var(--pri-soft)}
.acitem .ico{width:26px;height:26px;border-radius:var(--r3);display:grid;place-items:center;font-size:var(--t1);
  background:var(--panel-3);color:var(--ink-3)}
.acitem.fav .ico{background:var(--beacon-soft);color:var(--beacon)}
.acitem.libre .ico{background:var(--info-soft);color:var(--info)}
.acitem.gg .ico{background:var(--act-soft);color:var(--act-txt)}
.acitem .l1{font-size:var(--t3);line-height:1.3;display:block}
.acitem .l1 b{font-weight:700;color:var(--pri-txt)}
.acitem .l2{font-size:var(--t2);color:var(--ink-3);display:block}
.acitem .km{font-family:inherit;font-size:var(--t1);color:var(--ink-3);white-space:nowrap}
.acfoot{padding:8px 13px;font-size:var(--t1);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);
  background:var(--panel-2);border-top:1px solid var(--line);font-weight:600}

/* ---------- recherche globale ---------- */
.gwrap{position:relative;flex:1 1 240px;max-width:360px}
.gwrap input{background:var(--panel-2);border-radius:999px;padding:9px 16px}
.gres{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:70;background:var(--panel);
  border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--sh-3);max-height:380px;overflow:auto;
  width:min(460px,88vw)}
.gres .gi{padding:11px 14px;border-bottom:1px solid var(--line);cursor:pointer;display:grid;
  grid-template-columns:1fr auto;gap:10px;align-items:center}
.gres .gi:last-child{border-bottom:none}
.gres .gi:hover{background:var(--pri-soft)}
.gres .g1{font-size:var(--t3)}
.gres .g2{font-size:var(--t2);color:var(--ink-3)}
.gres .gempty{padding:20px;text-align:center;color:var(--ink-3);font-size:var(--t3)}

/* ---------- modales ---------- */
.scrim{position:fixed;inset:0;background:rgba(10,17,24,.55);backdrop-filter:blur(3px);
  display:grid;place-items:center;padding:22px;z-index:80}
.modal{background:var(--panel);border:0;border-radius:var(--r);width:min(580px,100%);
  max-height:88vh;overflow:auto;box-shadow:var(--sh-3)}
/* « À facturer » : ligne verte quand le prix est vérifié (Anthony, 23 sept. 2026) */
table tr.verifie td{background:color-mix(in srgb,var(--ok) 28%,var(--panel)) !important}
table tr.verifie td:first-child{box-shadow:inset 5px 0 0 var(--ok)}
/* état de compte d un client : une page complète (Anthony, 23 sept. 2026) */
.scrim.plein{padding:0;place-items:stretch}
.modal.plein{width:100%;max-width:none;height:100vh;max-height:100vh;border-radius:0;display:flex;flex-direction:column}
.modal.plein .mbody{flex:1;overflow:auto;align-content:start}
.modal>header{padding:var(--sp4);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:var(--sp3)}
.modal>header h2{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t4);margin:0;font-weight:700}
.modal .mbody{padding:var(--sp4);display:grid;gap:var(--sp3)}
.modal footer{padding:var(--sp3) var(--sp4);border-top:1px solid var(--line);display:flex;gap:var(--sp2);
  justify-content:flex-end;background:var(--panel-2);flex-wrap:wrap}
.pick{display:grid;gap:8px}
.opt{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:11px 14px;
  border:1px solid var(--line);border-radius:var(--r2);background:var(--panel-2);cursor:pointer}
.opt:hover{border-color:var(--line-2)}
.opt.sel{border-color:var(--pri);background:var(--pri-soft);box-shadow:0 0 0 2px var(--pri-soft)}
.opt .nm{font-weight:600;font-size:var(--t3);display:block}
.opt .dt{font-size:var(--t2);color:var(--ink-3);display:block}
.opt .rk{font-family:inherit;font-size:var(--t2);color:var(--ink-3);text-align:right}
.opt>span{text-transform:none;letter-spacing:0;color:inherit;font-weight:400}
.opt .nm{color:var(--ink)}
.opt.danger{border-color:#c9756f}
.opt.danger.sel{border-color:var(--crit);background:rgba(180,60,50,.09);box-shadow:0 0 0 2px rgba(180,60,50,.14)}
.reco{background:var(--ok-soft);color:var(--ok);font-size:var(--t1);letter-spacing:.06em;text-transform:uppercase;
  padding:2px 8px;border-radius:999px;font-weight:700}
.sigpad{border:1.5px dashed var(--line-2);border-radius:var(--r2);background:var(--panel-2);touch-action:none;
  width:100%;display:block}


/* ---------- menu du camion, ronde, bris, inventaire ---------- */
.ph-menu{display:grid;grid-template-columns:38px 1fr 14px;gap:14px;align-items:center;width:100%;
  border:1px solid var(--p-line);background:var(--p-carte);border-radius:var(--r);padding:18px 15px;min-height:74px;
  color:inherit;text-align:left;font:inherit;cursor:pointer}
.ph-menu:active{background:var(--p-carte-h)}
.ph-menu.chaud{border-color:var(--p-acc);box-shadow:inset 3px 0 0 var(--p-acc)}
.ph-menu.rouge{border-color:#c8442f;box-shadow:inset 3px 0 0 #c8442f}
.ph-menu .pm-ic{font-size:25px;line-height:1;text-align:center}
.ph-menu .pm-t b{display:block;font-size:17px;color:var(--p-fort);font-weight:600;line-height:1.3}
.ph-menu .pm-t i{display:block;font-style:normal;font-size:12.5px;color:var(--p-mut);margin-top:3px;line-height:1.35}
.ph-menu .pm-go{font-size:19px;color:var(--p-mut);text-align:right}
.ph-ret{width:34px;height:34px;flex:none;border-radius:50%;border:1px solid var(--p-line);
  background:var(--p-carte);color:var(--p-fort);font-size:21px;line-height:1;cursor:pointer}
.ph-grp{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--p-mut);
  font-weight:700;margin:14px 0 -4px}
.ph-liste{display:grid;gap:6px}
.ph-li{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;min-height:54px;
  border:1px solid var(--p-line);background:var(--p-carte);border-radius:10px;padding:14px 13px;
  color:var(--p-txt);font:inherit;text-align:left;font-size:14px;line-height:1.35}
.ph-li.tap{cursor:pointer}
.ph-li.tap:active{background:var(--p-carte-h)}
.ph-li i{font-style:normal;font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  font-weight:700;color:var(--p-mut);flex:none}
.ph-li.mineur{border-color:#c08a2e;background:rgba(192,138,46,.10)}
.ph-li.mineur i{color:#e0a94a}
.ph-li.majeur{border-color:#c8442f;background:rgba(200,68,47,.12)}
.ph-li.majeur i{color:#ff8f7a}
.ph-etat{border-radius:var(--r);padding:14px;display:grid;gap:4px;border:1px solid var(--p-line);background:var(--p-carte)}
.ph-etat b{font-size:16px;color:var(--p-fort)}
.ph-etat span{font-size:12.5px;color:var(--p-mut)}
.ph-etat.ok{border-color:#2f7d52;background:rgba(47,125,82,.12)}
.ph-etat.att{border-color:#c08a2e;background:rgba(192,138,46,.12)}
.ph-etat.crit{border-color:#c8442f;background:rgba(200,68,47,.14)}
.ph-choix{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.ph-ch{border:1px solid var(--p-line);background:var(--p-carte);border-radius:10px;padding:11px 9px;
  color:var(--p-txt);font:inherit;font-size:13px;cursor:pointer;line-height:1.3}
.ph-ch.on{border-color:var(--p-acc);background:rgba(255,198,26,.14);color:var(--p-fort);font-weight:600}
.ph-cpt{display:flex;align-items:center;gap:6px;flex:none}
.ph-pm{width:34px;height:34px;border-radius:9px;border:1px solid var(--p-line);background:var(--p-carte);
  color:var(--p-fort);font-size:18px;line-height:1;cursor:pointer}
.ph-cpt input{width:48px;text-align:center;border:1px solid var(--p-line);background:var(--p-bg);
  color:var(--p-fort);border-radius:9px;padding:8px 4px;font:inherit;font-size:15px}
.ph-go{width:100%;border:0;border-radius:var(--r);padding:15px;margin-top:6px;
  background:var(--p-acc);color:var(--p-acc-ink,#101418);font:inherit;font-size:15.5px;font-weight:700;cursor:pointer}
.ph-go:active{filter:brightness(.94)}

/* ---------- fil IA ---------- */
.bulle{max-width:88%;padding:11px 14px;border-radius:var(--r);font-size:var(--t3);line-height:1.5}
.bulle .qui{display:block;font-size:var(--t1);letter-spacing:.1em;text-transform:uppercase;opacity:.7;
  margin-bottom:3px;font-weight:600}
.bulle.ia{background:var(--panel-3);color:var(--ink);border-bottom-left-radius:4px;justify-self:start}
.bulle.cl{background:var(--pri);color:var(--pri-ink);border-bottom-right-radius:4px;justify-self:end}
.bulle.typing{background:var(--panel-3);display:flex;gap:5px;padding:14px;justify-self:start}
.bulle.typing span{width:7px;height:7px;border-radius:50%;background:var(--ink-3)}
@media(prefers-reduced-motion:no-preference){
  .bulle.typing span{animation:blink 1.1s infinite}
  .bulle.typing span:nth-child(2){animation-delay:.18s}
  .bulle.typing span:nth-child(3){animation-delay:.36s}}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}
.iaf{display:grid;grid-template-columns:150px 1fr;gap:3px 12px;padding:9px 0;border-bottom:1px solid var(--line)}
.iaf:last-child{border-bottom:none}
.iaf .ial{font-size:var(--t1);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);padding-top:2px;font-weight:600}
.iaf .iav{font-size:var(--t3);color:var(--ink-3)}
.iaf.ok .iav{color:var(--ink);font-weight:600}
.iaf .iac{grid-column:2;height:4px;background:var(--panel-3);border-radius:999px;overflow:hidden;max-width:190px}
.iaf .iac b{display:block;height:100%;background:var(--ok)}
.iaf .ias{grid-column:2;font-family:inherit;font-size:var(--t1);color:var(--ink-3)}


/* =====================================================================
   Version mobile du bureau : tiroir de navigation, barre du bas,
   tableaux transformés en cartes. Rien ne disparaît, tout se réorganise.
   ===================================================================== */
.mbtn,.mtitre,.btabs,.navscrim,.mchercher{display:none}

@media(max-width:900px){
  .app{grid-template-columns:1fr}

  /* --- le menu devient un tiroir --- */
  nav.side{position:fixed;top:0;left:0;bottom:0;width:min(86vw,330px);z-index:70;
    transform:translateX(-102%);transition:transform .24s cubic-bezier(.3,.7,.3,1);
    overflow-y:auto;overscroll-behavior:contain;box-shadow:0 0 40px rgba(0,0,0,.5);padding-bottom:32px}
  body.navouv nav.side{transform:none}
  .navscrim{display:block;position:fixed;inset:0;background:rgba(9,12,16,.55);z-index:60;
    opacity:0;pointer-events:none;transition:opacity .2s}
  body.navouv .navscrim{opacity:1;pointer-events:auto}
  body.navouv{overflow:hidden}
  nav.side .foot{padding-bottom:20px}

  /* --- barre du haut compacte --- */
  .topbar{padding:8px 12px;gap:8px;flex-wrap:nowrap;min-height:56px}
  .mbtn{display:grid;place-items:center;width:40px;height:40px;flex:none;background:none;border:0;
    border-radius:var(--r2);color:var(--ink)}
  .mbtn:active{background:var(--panel-3)}
  .mbtn svg{width:21px;height:21px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}
  .mtitre{display:block;min-width:0;flex:1;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;
    font-size:15.5px;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mtitre span{display:block;font-family:"Inter",sans-serif;font-weight:500;font-size:10.5px;letter-spacing:.12em;
    text-transform:uppercase;color:var(--ink-3);line-height:1.5}
  .topbar>label,.topbar .clock,.topbar .pill-live,.topbar .gwrap{display:none!important}
  /* le « + » remplace le bouton de la bande du bas */
  .topbar #newCallBtn{display:grid;place-items:center;width:40px;height:40px;flex:none;
    padding:0;min-height:0;border-radius:999px;font-size:0}
  .topbar #newCallBtn::before{content:"+";font-size:25px;line-height:1;font-weight:600}
  .topbar .who .wn{display:none}
  .topbar .who{padding:6px;border-radius:999px}
  .bell{width:40px;height:40px;display:grid;place-items:center}

  /* filtre de compagnie déplacé dans le tiroir */
  #navco{padding:4px 20px 0}
  #navco>label{display:flex!important;flex-direction:column;align-items:stretch!important;gap:6px}
  #navco>label>span{color:var(--nav-ink-2)!important}
  #navco .sel{width:100%;background:var(--nav-2);border-color:transparent;color:#fff;min-height:42px}

  /* barre de recherche dépliable */
  .mchercher{display:none;position:sticky;top:56px;z-index:29;background:var(--panel);
    border-bottom:1px solid var(--line);padding:10px 12px}
  body.rechouv .mchercher{display:block}
  .mchercher .gwrap{width:100%}
  .mchercher input{width:100%}

  /* --- barre du bas --- */
  .navnotifb .ph-row{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
  /* Anthony n'en veut pas : elle couvrait le bas des écrans et il fallait
     faire défiler pour voir les pastilles. Le menu ☰ et le bouton + de la
     barre du haut font le même travail sans rien cacher. */
  .btabs{display:none!important}
  .bt{position:relative;background:none;border:0;display:grid;justify-items:center;gap:2px;
    padding:8px 2px 9px;color:var(--ink-3);font-size:10px;line-height:1.25;text-align:center}
  .bt svg{width:21px;height:21px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .bt.on{color:var(--act-txt);font-weight:700}
  .bt.on:before{content:"";position:absolute;top:0;left:26%;right:26%;height:2.5px;background:var(--act);border-radius:0 0 3px 3px}
  .bt.plus{color:var(--pri-txt)}
  .bt .bn{position:absolute;top:4px;right:calc(50% - 22px);background:var(--crit);color:#fff;
    font-size:9.5px;font-weight:700;border-radius:999px;padding:0 5px;line-height:1.5}
  .bt .bn.calme{background:var(--panel-3);color:var(--ink-2)}

  /* --- le menu au doigt : des boutons qu'on touche sans viser --- */
  nav.side{width:min(90vw,360px)}
  /* Les écrans d'abord : le sélecteur de compagnie et le pied de page
     descendent en bas, pour ne pas voler la première hauteur d'écran. */
  nav.side .brand{order:0;padding:12px 18px 6px}
  nav.side .brand .mark,nav.side .brand .mark img{width:32px;height:32px}
  nav.side .brand>div>b{font-size:16px}
  #navzones{order:1}
  #navnotif{order:2}
  #navco{order:3;padding-top:16px}
  nav.side .foot{order:4}
  /* Assez gros pour le pouce, assez serré pour que les dix sections tiennent
     dans un écran : au-delà, il faut faire défiler pour trouver son écran. */
  .navbtn{padding:12px 16px;font-size:16px;min-height:50px;gap:14px;
    grid-template-columns:24px 1fr auto auto;margin:1px 10px;width:calc(100% - 20px)}
  .navbtn .ni svg{width:22px;height:22px}
  .navbtn .nl{white-space:normal;line-height:1.25}
  .cnt{font-size:12px;padding:2px 9px}
  .nch{font-size:24px}
  .navsub{padding-left:22px;gap:3px;margin:2px 0 12px}
  .navs{font-size:15px;padding:12px 12px 12px 13px;min-height:46px;line-height:1.3}
  .navs span{white-space:normal}
  .navsec{font-size:10.5px;padding:12px 20px 4px}

  /* --- la barre du bas descend jusqu'au bord de l'appareil --- */


  /* --- contenu --- */
  .viewbody{padding:16px 14px calc(22px + env(safe-area-inset-bottom,0px));gap:var(--sp4)}
  /* le titre vit dans la barre du haut : pas besoin de le répéter */
  .pagetop{padding:14px 14px 0;gap:var(--sp3)}
  .pagetop p,.pagetop .crumb,.pagetop h1.page{display:none}
  .pagetop:has(.ptacts){padding-top:12px}
  .pagetop:not(:has(.ptacts)){padding:0}
  .tabs{padding:12px 14px 0;gap:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{padding:9px 11px;font-size:var(--t2)}
  .ptacts{width:100%}
  .ptacts .btn{flex:1 1 auto;min-width:0}

  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:14px 13px 13px;min-height:0;border-radius:12px}
  .kpi .v{font-size:26px;padding-top:8px}
  .kpi .k{font-size:9.5px;letter-spacing:.12em}
  .kpi .m{font-size:11px;margin-top:6px}

  .card{border-radius:12px}
  .card>header{padding:16px 15px 10px;gap:10px}
  .card>header h2{font-size:16.5px}
  .card>header .sp{width:100%;margin:0}
  .btn{min-height:38px;padding:9px 13px}
  .btn.sm{min-height:34px}

  /* --- tableaux en cartes --- */
  .tw{overflow:visible;max-height:none!important}
  /* les largeurs minimales écrites à même le balisage doivent céder sur un téléphone */
  table.tcards,table.tcards td,table.tcards th,table.tcards tr{min-width:0!important;max-width:100%}
  table.tcards{width:100%;border-collapse:separate;border-spacing:0;display:block}
  table.tcards thead{display:none}
  table.tcards tbody,table.tcards tr,table.tcards td{display:block;width:auto}
  table.tcards tbody{padding:0 13px 13px}
  table.tcards tr{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r2);
    margin:0 0 9px;padding:11px 13px}
  table.tcards tr:last-child{margin-bottom:0}
  table.tcards td{border:0;padding:4px 0;display:flex;gap:12px;align-items:baseline;
    justify-content:space-between;text-align:right;white-space:normal}
  table.tcards td>*{min-width:0;max-width:100%}
  table.tcards td>.tv{flex:1 1 auto;text-align:right}
  table.tcards td>.tv>*{max-width:100%}
  table.tcards td>.tv .btnrow,table.tcards td>.tv .sp{justify-content:flex-end}
  table.tcards td[data-l]:before{content:attr(data-l);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
    color:var(--ink-3);font-weight:600;text-align:left;flex:0 0 40%;white-space:normal;line-height:1.5}
  table.tcards td:not([data-l]){justify-content:flex-end}
  table.tcards td.vide{display:none}
  table.tcards td .btnrow,table.tcards td .sp{justify-content:flex-end}
  table.tcards td[colspan]{justify-content:flex-start;text-align:left}
  table.tcards tr.rowclic:after{content:"toucher pour ouvrir";display:block;font-size:10px;
    letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-top:7px;text-align:right}

  /* --- fenêtres en feuille du bas --- */
  .scrim{place-items:end center;padding:0}
  .modal{width:100%!important;max-width:none;max-height:94vh;border-radius:16px 16px 0 0;
    display:flex;flex-direction:column;overflow:hidden}
  .modal>header{padding:14px 16px;position:relative}
  .modal>header:before{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);
    width:38px;height:4px;border-radius:999px;background:var(--line-2);opacity:.5}
  .modal .mbody{overflow:auto;padding:16px;flex:1}
  .modal footer{padding:11px 14px calc(11px + env(safe-area-inset-bottom,0px));flex-wrap:nowrap}
  .modal footer .btn{flex:1;min-height:44px}
  .modal footer .btn.gh{flex:0 0 auto}
  /* les choix de chauffeur, de mode, etc. : le libellé prend toute la largeur */
  .opt{grid-template-columns:auto 1fr;gap:10px 12px;padding:12px 13px}
  .opt>*{min-width:0}
  .opt>:nth-child(3){grid-column:2;text-align:right;margin-top:2px}

  /* --- divers --- */
  .split,.form,.impg,.perms{grid-template-columns:1fr}
  .alert{grid-template-columns:1fr auto;gap:4px var(--sp3);padding:11px 14px}
  .alert .ai{grid-column:1/-1}
  .alert .at{grid-column:1;min-width:0}
  .alert>.btn{grid-column:2;grid-row:2}
  .fin{grid-template-columns:30px 1fr;gap:4px var(--sp3);padding:12px 14px}
  .fin>span:nth-child(2){min-width:0}
  .finb{grid-column:1/-1;margin-top:6px}
  .finb .btn{flex:1 1 auto}
  .kv{grid-template-columns:1fr;gap:0;padding:14px 15px 16px;font-size:var(--t2)}
  .kv dt{padding-top:11px;font-size:9.5px;letter-spacing:.11em}
  .kv dt:first-child{padding-top:0}
  .kv dd{margin:2px 0 0}
  .kv dd .sub2{font-size:11.5px}
  .phone{max-width:100%;border-width:6px}
  .depot{padding:30px 14px}
  .toast{left:12px;right:12px;bottom:calc(20px + env(safe-area-inset-bottom,0px));max-width:none;transform:none}
  /* sans « top:auto », les alertes gardaient le haut fixé à 104 px ET le bas à 78 px :
     chaque carte s'étirait sur toute la hauteur et cachait l'écran */
  .pops{left:10px;right:10px;bottom:calc(20px + env(safe-area-inset-bottom,0px));top:auto;width:auto;max-height:52vh;align-content:end}
  .docapercu{width:100%}
  .hbars .hb{grid-template-columns:minmax(70px,110px) 1fr auto}
  .viz svg{min-width:0}
  /* rien ne dépasse : ni une adresse courriel, ni un badge, ni une barre d'avancement */
  .viewbody{overflow-wrap:break-word}
  .av,.avtop,.avbar,.avfoot,.raps{min-width:0;max-width:100%}
  .avtop>span,.avfoot{white-space:normal}
  table.tcards td>.b,table.tcards td .b{white-space:normal}
  .gwrap,.gwrap input{max-width:100%}
  /* les rangées de pastilles défilent au doigt au lieu de dépasser */
  :has(>.chip){flex-wrap:nowrap!important;overflow-x:auto;max-width:100%;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;padding-bottom:2px}
  :has(>.chip)::-webkit-scrollbar{display:none}
  .chip{flex:none;padding:8px 14px}
  .btnrow{overflow-x:auto;scrollbar-width:none;max-width:100%}
  .btnrow::-webkit-scrollbar{display:none}
}
@media(max-width:360px){
  .kpis{grid-template-columns:1fr}
  .bt{font-size:9px}
}

/* ---------- import de documents PDF ---------- */
.depot{border:2px dashed var(--line-2);border-radius:var(--r);background:var(--panel-2);padding:var(--sp6) var(--sp4);
  text-align:center;display:grid;gap:var(--sp2);justify-items:center;cursor:pointer;transition:border-color .15s,background .15s}
.depot:hover,.depot.survol{border-color:var(--act);background:var(--act-soft)}
.depot .di{font-size:var(--t6);line-height:1}
.depot b{font-size:var(--t4);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700}
.depot span{font-size:var(--t2);color:var(--ink-3)}
.imp{border:1px solid var(--line);border-radius:var(--r);background:var(--panel);overflow:hidden}
.imp>header{display:flex;gap:var(--sp3);align-items:center;padding:var(--sp3) var(--sp4);border-bottom:1px solid var(--line);
  background:var(--panel-2);flex-wrap:wrap}
.imp>header b{font-size:var(--t3)}
.imp .ib{padding:var(--sp4);display:grid;gap:var(--sp3)}
.impg{display:grid;gap:var(--sp3);grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.impt{font-family:inherit;font-size:var(--t1);
  white-space:pre-wrap;background:var(--panel-3);border-radius:var(--r2);padding:var(--sp3);max-height:230px;overflow:auto;color:var(--ink-2)}
.docrow{display:grid;grid-template-columns:26px 1fr auto;gap:var(--sp3);align-items:center;border:1px solid var(--line);
  border-radius:var(--r2);padding:var(--sp3);background:var(--panel-2)}
.docrow.signe{border-color:var(--ok);background:var(--ok-soft,var(--panel-2))}
.docapercu{width:100%;border:1px solid var(--line);border-radius:var(--r2);background:#fff;display:block}

/* ---------- téléphone du chauffeur : palettes nuit et jour ---------- */
/* NUIT — la palette d'origine, pensée pour la cabine le soir */
:root{
  --p-bg:#000000;--p-cadre:#2c2c2e;--p-bar:#000000;--p-bar2:#1c1c1e;
  --p-carte:#1c1c1e;--p-carte-h:#2c2c2e;--p-fond2:#121214;--p-fond3:#161618;
  --p-carte-ici:#222224;--p-carte-h2:#2c2c2e;--p-rond:#2c2c2e;
  --p-line:#2c2c2e;--p-line2:#242426;--p-line3:#3a3a3c;--p-line4:#323234;
  --p-line5:#48484a;--p-line6:#545456;--p-line-h:#636366;--p-line-nx:#7c7c80;
  --p-acc:#e1e352;--p-acc-txt:#e6e86a;--p-acc-ink:#14140a;--p-acc-sub:#5c5e14;
  --p-acc-bg:#26270d;--p-acc-bd:#4a4c16;--p-acc-bg2:#2e3010;--p-ink-acc:#14140a;
  --p-warn-bg:#2e3010;--p-warn-bd:#4a4c16;--p-warn-txt:#e6e86a;
  --p-ok:#1d7f4e;--p-ok-ink:#eafff5;--p-ok-bg:#0e2a1e;--p-ok-bd:#1c4633;--p-ok-bd2:#24553e;
  --p-ok-txt:#7fdcaf;--p-ok-txt2:#30d158;--p-ok2:#30d158;--p-ok2-txt:#30d158;
  --p-ok-sub:#e2f7ec;--p-ink-ok:#eafff5;
  --p-crit:#ff453a;--p-crit-txt:#ff8079;--p-crit-txt2:#ff453a;--p-crit-sub:#e59a94;
  --p-crit-bg:#361a18;--p-crit-bg2:#281312;--p-crit-bd:#5a2b28;--p-crit-bd2:#48211f;
  --p-ink-crit:#281312;
  --p-fort:#ffffff;--p-txt:#f5f5f7;--p-txt2:#e5e5ea;--p-txt3:#c7c7cc;--p-txt4:#aeaeb2;
  --p-mut:#98989d;--p-mut2:#6a6a70;--p-mut3:#7c7c80;
}
/* JOUR — fond clair, texte foncé : lisible en plein soleil, pare-brise ou pas */
.phone[data-mode="jour"]{--p-cgo-ink:#ffffff;--p-rapb:rgba(255,255,255,.8);--p-rapb-h:rgba(255,255,255,.95);
  --p-bg:#ebebe8;--p-cadre:#d2d2d7;--p-bar:#ffffff;--p-bar2:#f6f6f3;
  --p-carte:#ffffff;--p-carte-h:#f6f6f3;--p-fond2:#ffffff;--p-fond3:#f6f6f3;
  --p-carte-ici:#f7f8dc;--p-carte-h2:#e5e5e0;--p-rond:#e5e5e0;
  --p-line:#dadad5;--p-line2:#e6e6e1;--p-line3:#c6c6c0;--p-line4:#c6c6c0;
  --p-line5:#c7c7cc;--p-line6:#c7c7cc;--p-line-h:#b0b0b5;--p-line-nx:#a0a0a5;
  --p-acc:#e1e352;--p-acc-txt:#6b6d00;--p-acc-ink:#14140a;--p-acc-sub:#4f5100;
  --p-acc-bg:#f7f8dc;--p-acc-bd:#c9cb45;--p-acc-bg2:#f0f2c4;--p-ink-acc:#14140a;
  --p-warn-bg:#f7f8dc;--p-warn-bd:#c9cb45;--p-warn-txt:#7a6000;
  --p-ok:#1d7f4e;--p-ok-ink:#ffffff;--p-ok-bg:#d9f2e4;--p-ok-bd:#9fd8bd;--p-ok-bd2:#8ccfae;
  --p-ok-txt:#14663d;--p-ok-txt2:#1d7f4e;--p-ok2:#1d7f4e;--p-ok2-txt:#14663d;
  --p-ok-sub:#e7f7ef;--p-ink-ok:#ffffff;
  --p-crit:#d0342c;--p-crit-txt:#b02a22;--p-crit-txt2:#d0342c;--p-crit-sub:#8a221c;
  --p-crit-bg:#ffe0dd;--p-crit-bg2:#ffe9e6;--p-crit-bd:#f0b8b2;--p-crit-bd2:#f5ccc7;
  --p-ink-crit:#ffffff;
  --p-fort:#1d1d1f;--p-txt:#1d1d1f;--p-txt2:#2a2a2c;--p-txt3:#48484c;--p-txt4:#5a5a5f;
  --p-mut:#5a5a60;--p-mut2:#6a6a70;--p-mut3:#7a7a80;
}
/* bouton jour/nuit de la barre d'état */
.ph-mode{background:none;border:1px solid var(--p-line3);color:var(--p-mut);border-radius:999px;white-space:nowrap;
  padding:2px 9px;font-size:10.5px;letter-spacing:.02em;display:inline-flex;gap:5px;align-items:center;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.ph-mode:hover{border-color:var(--p-acc);color:var(--p-acc-txt)}
.ph-mode i{font-style:normal;font-size:11px}

/* ---------- téléphone du chauffeur ---------- */
.phone{box-sizing:border-box;max-width:400px;margin:0 auto;background:var(--p-bg);border:10px solid var(--p-cadre);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--sh-3);color:var(--p-txt);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.ph-top{display:flex;justify-content:space-between;align-items:center;gap:8px 6px;flex-wrap:wrap;
  padding:11px 14px 8px;min-width:0;max-width:100%;white-space:nowrap;
  font-family:inherit;font-size:var(--t1);color:var(--p-mut);letter-spacing:.05em}
.ph-top>span{display:flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap;justify-content:flex-end}
.ph-top .ph-cam{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ph-hd{padding:5px 18px 14px;border-bottom:1px solid var(--p-line2)}
.ph-hd .no{font-family:inherit;font-size:var(--t2);color:var(--p-acc-txt);letter-spacing:.07em;font-weight:600}
.ph-hd h3{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t4);margin:3px 0 0;color:var(--p-fort);letter-spacing:-.01em}
.ph-body{padding:16px 18px 20px;display:grid;gap:13px}
.ph-nav{display:grid;grid-template-columns:14px 1fr auto;gap:12px;align-items:center;border:1px solid var(--p-line);
  background:var(--p-carte);border-radius:var(--r);padding:13px 14px;text-decoration:none;color:inherit}
.ph-nav:hover{border-color:var(--p-line-h);background:var(--p-carte-h)}
.ph-nav .a1{display:block;font-size:var(--t3);color:var(--p-fort);line-height:1.35}
.ph-nav .a2{display:block;font-size:var(--t1);color:var(--p-mut);text-transform:uppercase;letter-spacing:.1em;
  margin-bottom:2px;font-weight:600}
.ph-nav .pin{width:10px;height:10px;border-radius:50%;background:var(--p-acc)}
.ph-nav.dest .pin{background:var(--p-ok2)}
.ph-nav .go{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--p-rond);color:var(--p-ok2-txt);font-size:var(--t3)}
.ph-nav.dest .go{color:var(--p-acc-txt)}
.ph-leg{display:grid;grid-template-columns:14px 1fr;gap:12px;align-items:start}
.ph-leg .pin{width:10px;height:10px;border-radius:50%;background:var(--p-acc);margin-top:7px}
.ph-leg.dest .pin{background:var(--p-ok2)}
.ph-leg .a1{font-size:var(--t3);color:var(--p-fort);line-height:1.35;display:block}
.ph-leg .a2{display:block;font-size:var(--t1);color:var(--p-mut);text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.ph-gpsrow{display:flex;gap:7px;align-items:center;flex-wrap:wrap;font-size:var(--t2);color:var(--p-mut2)}
.ph-gps{border:1px solid var(--p-line3);background:var(--p-carte);color:var(--p-txt4);border-radius:999px;padding:5px 12px;font-size:var(--t2)}
.ph-gps.on{background:var(--p-acc);border-color:var(--p-acc);color:var(--p-ink-acc);font-weight:600}
.ph-cap{background:var(--p-carte);border:1px solid var(--p-line3);border-left:4px solid var(--p-acc);border-radius:var(--r);
  padding:15px 16px 13px;display:grid;gap:9px}
.ph-cap.dest{border-left-color:var(--p-ok2)}
.ph-cap .cl{font-size:var(--t1);letter-spacing:.11em;text-transform:uppercase;color:var(--p-acc-txt);font-weight:700}
.ph-cap.dest .cl{color:var(--p-ok2-txt)}
.ph-cap .ca{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t4);line-height:1.2;color:var(--p-fort);
  letter-spacing:-.015em}
.ph-cap .cgo{display:block;text-align:center;background:var(--p-acc);color:var(--p-ink-acc);border-radius:var(--r);
  padding:13px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t3);text-decoration:none}
.ph-cap.dest .cgo{background:var(--p-ok2);color:var(--p-cgo-ink,var(--p-ink-acc))}
.ph-suite{border-top:1px solid var(--p-line);padding-top:9px;display:grid;gap:7px}
.ph-suite .sui{display:grid;grid-template-columns:22px 1fr 22px;gap:9px;align-items:center;text-decoration:none;
  color:var(--p-txt3);font-size:var(--t2)}
.ph-suite .sui .n{width:20px;height:20px;border-radius:50%;background:var(--p-line);color:var(--p-mut);
  display:grid;place-items:center;font-size:var(--t1);font-family:inherit}
.ph-suite .sui b{font-weight:500;line-height:1.3}
.ph-suite .sui .go{color:var(--p-ok2-txt)}
.ph-suite .sui .sub2{grid-column:2;font-size:var(--t1);color:var(--p-mut2)}
.ph-cap .cadd{border:1px dashed var(--p-line5);background:none;color:var(--p-mut);border-radius:var(--r);padding:10px;
  font-size:var(--t2);width:100%}
.ph-cap .cadd:hover{color:var(--p-acc-txt);border-color:var(--p-acc-bd)}
.ph-big{width:100%;border:0;border-radius:var(--r);background:var(--p-acc);color:var(--p-ink-acc);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-weight:700;font-size:var(--t4);padding:18px 12px}
.ph-big:active{filter:brightness(.94)}
.ph-big.done{background:var(--p-ok);color:var(--p-ink-ok)}
.ph-refuse{width:100%;border:1px solid var(--p-line5);background:transparent;color:var(--p-txt4);border-radius:var(--r);padding:14px;font-size:var(--t3)}
.ph-ring{background:var(--p-acc);color:var(--p-ink-acc);padding:20px 18px;text-align:center}
.ph-ringtop{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t4)}
.ph-cd{font-family:inherit;font-size:var(--t2);margin-top:4px}
.ph-cd b{font-size:var(--t4)}
@media(prefers-reduced-motion:no-preference){.ph-ring{animation:pulse 1.5s ease-in-out infinite}}
@keyframes pulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.13)}}
.ph-steps{display:grid;gap:6px}
.ph-step{display:grid;grid-template-columns:24px 1fr auto;gap:12px;align-items:center;text-align:left;
  border:1px solid var(--p-line);background:var(--p-carte);color:var(--p-txt4);border-radius:var(--r);padding:12px 13px;font-size:var(--t3);width:100%}
.ph-step .mk{width:18px;height:18px;border-radius:50%;border:2px solid var(--p-line6);
  display:grid;place-items:center;font-size:var(--t1)}
.ph-step b{display:block;color:var(--p-txt2);font-weight:600}
.ph-step span.dd{font-size:var(--t2);color:var(--p-mut2)}
.ph-step .hh{font-family:inherit;font-size:var(--t1);color:var(--p-mut2)}
.ph-step.done{background:var(--p-ok-bg);border-color:var(--p-ok-bd)}
.ph-step.done .mk{background:var(--p-ok);border-color:var(--p-ok);color:var(--p-ink-ok)}
.ph-step.done b{color:var(--p-ok-txt)}
.ph-step.now{border-color:var(--p-acc);background:var(--p-acc-bg)}
.ph-step.now .mk{border-color:var(--p-acc);background:var(--p-acc);color:var(--p-ink-acc)}
.ph-step.now b{color:var(--p-acc-txt)}
.ph-step.next{border-color:var(--p-line-nx)}
.ph-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.ph-btn{border:1px solid var(--p-line);background:var(--p-carte);color:var(--p-txt3);border-radius:var(--r);padding:13px 8px;
  font-size:var(--t3);display:grid;gap:3px;justify-items:center;text-decoration:none}
.ph-btn b{font-size:var(--t1);color:var(--p-mut2);font-family:inherit;letter-spacing:.05em}
.ph-btn.act{border-color:var(--p-ok-bd2);background:var(--p-ok-bg);color:var(--p-ok-txt)}
.ph-edits{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.ph-ed{border:1px solid var(--p-line);background:var(--p-fond3);color:var(--p-txt4);border-radius:var(--r);padding:11px 4px;font-size:var(--t2)}
.ph-ed:hover{color:var(--p-acc-txt);border-color:var(--p-acc-bd)}
.ph-gpsask{width:100%;border:1px solid var(--p-line);background:var(--p-carte);color:var(--p-txt4);border-radius:var(--r);padding:13px;font-size:var(--t3)}
.ph-gpsask:hover{color:var(--p-acc-txt);border-color:var(--p-acc-bd)}
.ph-money{background:var(--p-carte);border:1px solid var(--p-line);border-radius:var(--r);padding:13px 15px}
.ph-money .r{display:flex;justify-content:space-between;font-size:var(--t3);color:var(--p-txt4);padding:3px 0}
.ph-paie{background:var(--p-carte);border:1px solid var(--p-line);border-left:4px solid var(--p-line5);border-radius:var(--r);
  padding:14px 15px;display:grid;gap:11px}
.ph-paie.ok{border-left-color:var(--p-ok2)}
.ph-paie.att{border-left-color:var(--p-acc)}
.pp-top{display:flex;justify-content:space-between;align-items:baseline}
.pp-top span{font-size:var(--t1);letter-spacing:.11em;text-transform:uppercase;color:var(--p-mut2);font-weight:600}
.pp-top b{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t5);color:var(--p-fort)}
.pp-btns{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.pp-b{border:1px solid var(--p-line3);background:var(--p-fond2);color:var(--p-txt4);border-radius:var(--r);padding:15px 8px;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t3)}
.pp-b.on{background:var(--p-ok);border-color:var(--p-ok);color:var(--p-ink-ok)}
.pp-b.att.on{background:var(--p-acc);border-color:var(--p-acc);color:var(--p-ink-acc)}
.pp-env{border-top:1px solid var(--p-line);padding-top:10px;display:grid;gap:8px}
.pp-envb{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.pp-e{border:1px solid var(--p-line3);background:var(--p-fond2);color:var(--p-txt4);border-radius:var(--r2);padding:10px 6px;font-size:var(--t2)}
.pp-e.on{background:var(--p-acc);border-color:var(--p-acc);color:var(--p-ink-acc);font-weight:600}
.ph-money .r.mod{width:100%;border:0;background:none;color:inherit;font:inherit;text-align:left;
  border-radius:var(--r2);padding:6px 7px;margin:0 -7px;display:flex;justify-content:space-between;gap:10px}
.ph-money .r.mod:hover,.ph-money .r.mod:active{background:var(--p-carte-h2);color:var(--p-txt)}
.ph-money .r.mod:after{content:"✎";color:var(--p-mut2);font-size:var(--t1);margin-left:6px}
.ph-money .r.conv2{color:var(--p-txt3);font-weight:600;border-top:1px dashed var(--p-line);margin-top:6px;padding-top:8px}
.ph-money .t{display:flex;justify-content:space-between;border-top:1px solid var(--p-line);margin-top:8px;
  padding-top:8px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t4);color:var(--p-fort)}
.ph-none{padding:44px 22px;text-align:center;color:var(--p-mut)}
.ph-back{background:none;border:0;color:var(--p-mut);font-size:var(--t3);text-align:left;padding:0 0 4px}
.ph-sec{font-size:var(--t1);letter-spacing:.11em;text-transform:uppercase;color:var(--p-mut2);margin-top:8px;font-weight:600}
.ph-sechead{display:flex;justify-content:space-between;align-items:baseline;gap:9px}
.ph-sechead span{font-size:var(--t1);letter-spacing:.11em;text-transform:uppercase;color:var(--p-mut2);font-weight:600}
.ph-f{display:block}
.ph-f span{display:block;font-size:var(--t1);letter-spacing:.08em;text-transform:uppercase;color:var(--p-mut2);
  margin-bottom:4px;font-weight:600}
.ph-f input{background:var(--p-fond2);border:1px solid var(--p-line4);color:var(--p-txt);border-radius:var(--r2);padding:11px;font-size:var(--t3);width:100%}
.ph-f input:focus{border-color:var(--p-acc);outline:none;box-shadow:none}
.ph-2{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.ph-chk{display:flex;gap:10px;align-items:center;color:var(--p-txt3);font-size:var(--t3)}
.ph-chk input{width:auto}
.ph-x{background:none;border:0;color:var(--p-crit-txt2);font-size:var(--t2);padding:0 5px;cursor:pointer}
.ph-note{font-size:var(--t2);color:var(--p-mut2);text-align:center}
.ph-scan{border:1px dashed var(--p-line5);background:var(--p-fond3);color:var(--p-txt4);border-radius:var(--r);padding:14px 8px;
  font-size:var(--t2);text-align:center;cursor:pointer;display:block}
.ph-scan:hover{border-color:var(--p-acc);color:var(--p-acc-txt)}
.ph-scan.ok{border-style:solid;border-color:var(--p-ok-bd2);background:var(--p-ok-bg);color:var(--p-ok-txt)}
.ph-scanrow{display:flex;gap:9px}
.ph-scanv{border:1px solid var(--p-line);background:var(--p-fond3);border-radius:var(--r);padding:6px;display:grid;gap:4px;
  justify-items:center;color:var(--p-mut);font-size:var(--t1);flex:1}
.ph-scanv img{width:100%;height:62px;object-fit:cover;border-radius:var(--r2)}
.ph-rap{display:grid;gap:7px}
.ph-rapl{display:grid;grid-template-columns:18px 1fr auto;gap:10px;align-items:center;border-radius:var(--r);
  padding:11px 13px;font-size:var(--t2);line-height:1.4}
.ph-rapl.crit{background:var(--p-crit-bg);color:var(--p-crit-txt);border:1px solid var(--p-crit-bd)}
.ph-rapl.warn{background:var(--p-warn-bg);color:var(--p-warn-txt);border:1px solid var(--p-warn-bd)}
.ph-rapb{border:0;background:var(--p-rapb,rgba(0,0,0,.25));color:inherit;border-radius:var(--r2);padding:6px 11px;
  font-size:var(--t2);white-space:nowrap}
.ph-rapb:hover{background:var(--p-rapb-h,rgba(0,0,0,.36))}
.ph-body .acwrap .aclist{background:var(--p-carte);border-color:var(--p-line3)}
.ph-body .acitem{border-bottom-color:var(--p-line2)}
.ph-body .acitem .l1{color:var(--p-txt)}
.ph-body .acitem .l1 b{color:var(--p-acc-txt)}
.ph-body .acitem .l2,.ph-body .acitem .km,.ph-body .acfoot{color:var(--p-mut)}
.ph-body .acitem:hover,.ph-body .acitem.on{background:var(--p-carte-h2)}
.ph-body .acitem .ico{background:var(--p-line);color:var(--p-mut)}
.ph-body .acitem.fav .ico{background:var(--p-acc-bg2);color:var(--p-acc-txt)}
.ph-body .acfoot{background:var(--p-bar2);border-top-color:var(--p-line2)}

.tnum{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--nav);
  color:var(--pri);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t2)}
.vbar{height:8px;border-radius:999px;background:var(--panel-3);overflow:hidden}
.vbar i{display:block;height:100%;background:var(--pri);border-radius:999px}
tr.annulee td{opacity:.55}
tr.annulee td:first-child{border-left:3px solid var(--crit)}
.ph-f select{background:var(--p-fond2);border:1px solid var(--p-line4);color:var(--p-txt);border-radius:var(--r2);
  padding:11px;font-size:var(--t3);width:100%;font-family:inherit}
.ph-f select:focus{border-color:var(--p-acc);outline:none}
.ph-chip2{background:var(--p-carte);border:1px solid var(--p-line);border-radius:var(--r2);padding:9px 12px;
  font-size:var(--t2);color:var(--p-txt4)}
.prixtab{width:100%;border-collapse:collapse;min-width:760px}
/* Sept colonnes dans une fenetre, ca se chevauche vite. On donne a
   chacune sa largeur et on laisse le tableau defiler plutot que de
   tasser les champs les uns sur les autres. */
.prixtab th:nth-child(1),.prixtab td:nth-child(1){width:96px}
.prixtab th:nth-child(3),.prixtab td:nth-child(3){width:118px}
.prixtab th:nth-child(4),.prixtab td:nth-child(4){width:104px}
.prixtab th:nth-child(5),.prixtab td:nth-child(5){width:112px}
.prixtab th:nth-child(6),.prixtab td:nth-child(6){width:104px}
.prixtab th:last-child,.prixtab td:last-child{width:44px}
.prixtab .hint{font-size:10px;line-height:1.25;margin-top:2px}
.prixtab select{width:100%;padding:6px 7px;font-size:var(--t2)}
.prixtab td,.prixtab th{padding:7px 6px;border-bottom:1px solid var(--line);vertical-align:middle}
.prixtab th{font-size:var(--t1);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);text-align:left}
.prixtab input{width:100%;padding:7px 8px;font-size:var(--t2)}
.prixtab .num{text-align:right}
.prixtab .tt{font-family:inherit;font-variant-numeric:tabular-nums;white-space:nowrap}
.danger{border-color:#8c2f2b !important;color:#ff9d95 !important}
.danger.pri{background:#a2332d !important;border-color:#a2332d !important;color:#fff !important}

.faqrow{display:grid;grid-template-columns:1fr 34px;gap:8px;align-items:start;
  border:1px solid var(--line);border-radius:var(--r);padding:11px 12px;background:var(--panel-2)}
.faqrow .faqq{grid-column:1;font-weight:600}
.faqrow textarea{grid-column:1;font-size:var(--t2)}
.faqrow button{grid-column:2;grid-row:1/3}
pre.code{background:var(--nav);color:#c9d5c0;border-radius:var(--r);padding:13px 15px;overflow:auto;
  font-family:inherit;font-size:var(--t2);line-height:1.6;margin:0}
.mono{font-family:inherit;font-size:var(--t2);background:var(--panel-3);padding:1px 6px;border-radius:var(--r3)}
ol.etapes{margin:0;padding-left:20px;display:grid;gap:9px;font-size:var(--t3);line-height:1.5}
ol.etapes li::marker{color:var(--pri-txt);font-weight:700}
.logorow{display:grid;grid-template-columns:104px 1fr;gap:14px;align-items:start}
.logoprev{width:104px;height:104px;border:1px dashed var(--line-2);border-radius:var(--r);display:grid;
  place-items:center;background:var(--panel-2);overflow:hidden}
.logoprev img{width:100%;height:100%;object-fit:contain}

.who{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--panel);
  border-radius:999px;padding:4px 12px 4px 4px;cursor:pointer}
.who:hover{border-color:var(--line-2)}
.who .wi{width:26px;height:26px;border-radius:50%;background:var(--panel-3);color:var(--ink-2);
  display:grid;place-items:center;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t1)}
.who.on .wi{background:var(--pri);color:#0b0c0a}
.who .wn{font-size:var(--t2);color:var(--ink-2);white-space:nowrap}
.who.on .wn{color:var(--ink);font-weight:500}

.navsub{display:grid;gap:1px;margin:2px 0 8px 0;padding-left:34px}
.navs{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  background:none;border:0;color:var(--nav-ink-2);font-size:var(--t2);padding:6px 12px 6px 10px;
  text-align:left;border-left:2px solid transparent;border-radius:0 7px 7px 0;font-family:inherit}
.navs:hover{color:var(--nav-ink);background:rgba(255,255,255,.04)}
.navs.on{color:var(--pri);border-left-color:var(--pri);background:rgba(214,212,47,.09);font-weight:600}
.navs i{font-style:normal;font-size:10.5px;font-family:inherit;
  background:rgba(255,255,255,.09);color:var(--nav-ink-2);border-radius:999px;padding:1px 7px}
.navs i.hot{background:var(--crit);color:#fff}
.navs.on i{background:var(--pri);color:#0b0c0a}
/* le nom d'un groupe, replié par défaut ; ses écrans en dessous, un cran plus loin */
.navs.navgrp{font-weight:600;color:var(--nav-ink)}
.navgrpsub{display:grid;gap:1px;padding-left:14px;margin:1px 0 4px}

.mtabs{display:flex;gap:2px;padding:0 18px;border-bottom:1px solid var(--line);background:var(--panel-2);
  overflow-x:auto}
.mtab{background:none;border:0;border-bottom:2px solid transparent;padding:11px 13px;font-size:var(--t2);
  color:var(--ink-3);font-family:inherit;white-space:nowrap;margin-bottom:-1px}
.mtab:hover{color:var(--ink-2)}
.mtab.on{color:var(--ink);border-bottom-color:var(--pri);font-weight:600}

/* ---------- poste de répartiteur ---------- */
.pops{position:fixed;top:104px;right:18px;z-index:120;display:grid;gap:9px;width:min(370px,calc(100vw - 36px));
  max-height:calc(100vh - 130px);max-height:calc(100dvh - 130px);overflow:auto;align-content:start;
  /* le conteneur est plus haut que ses cartes : sans ceci, il avale les touchers
     sur tout ce qu'il recouvre, même là où il n'y a rien à voir */
  pointer-events:none}
.pops .pop{pointer-events:auto}
.pop{display:grid;grid-template-columns:auto 1fr auto;gap:11px;align-items:start;padding:12px 13px;
  border-radius:var(--r);background:var(--panel);border:1px solid var(--line);box-shadow:var(--sh-3)}
.pop .pi{width:30px;height:30px;border-radius:var(--r2);display:grid;place-items:center;font-weight:700;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:var(--t3);background:var(--info-soft);color:var(--info)}
.pop.n2{border-left:4px solid var(--beacon-fill)} .pop.n2 .pi{background:var(--beacon-soft);color:var(--beacon)}
.pop.n3{border-left:4px solid var(--crit)}       .pop.n3 .pi{background:var(--crit-soft);color:var(--crit)}
.pop.n1{border-left:4px solid var(--info)}
.pop .pt{font-size:var(--t2);line-height:1.4;color:var(--ink)}
.pop .pk{display:block;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);font-weight:700;margin-bottom:2px}
.pop .px{display:grid;gap:5px}
@media(prefers-reduced-motion:no-preference){.pop{animation:popin .2s ease-out}}
@keyframes popin{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

.watch{display:grid;grid-template-columns:repeat(auto-fill,minmax(292px,1fr));gap:12px;padding:14px}
.wcard{border:1px solid var(--line);border-radius:var(--r);padding:13px 14px;background:var(--panel-2);display:grid;gap:9px}
.wcard.n1{border-color:var(--info)} .wcard.n2{border-color:var(--beacon-fill);background:var(--beacon-soft)}
.wcard.n3{border-color:var(--crit);background:var(--crit-soft)}
.wtop{display:flex;justify-content:space-between;align-items:baseline;gap:9px}
.wtop .wno{font-family:inherit;font-size:var(--t2);font-weight:600}
.wchrono{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;font-size:var(--t6);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;line-height:1}
.wcard.n2 .wchrono{color:var(--warn)} .wcard.n3 .wchrono{color:var(--crit)}
.wsub{font-size:var(--t2);color:var(--ink-2);line-height:1.4}
.wbar{height:6px;border-radius:999px;background:var(--panel-3);overflow:hidden}
.wbar i{display:block;height:100%;background:var(--ok);transition:width .4s}
.wcard.n1 .wbar i{background:var(--info)} .wcard.n2 .wbar i{background:var(--beacon-fill)}
.wcard.n3 .wbar i{background:var(--crit)}
.wseuils{display:flex;justify-content:space-between;font-size:var(--t1);color:var(--ink-3);
  font-family:inherit}
.alrow{display:grid;grid-template-columns:74px 1fr auto;gap:12px;align-items:center;padding:10px 0;
  border-bottom:1px solid var(--line)}
.alrow:last-child{border-bottom:0}
.alrow .an{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;text-align:center;
  padding:4px 0;border-radius:999px}
.alrow.n1 .an{background:var(--info-soft);color:var(--info)}
.alrow.n2 .an{background:var(--beacon-soft);color:var(--beacon)}
.alrow.n3 .an{background:var(--crit-soft);color:var(--crit)}
.alrow.ok .an{background:var(--ok-soft);color:var(--ok)}
.alrow .at2{font-size:var(--t3);line-height:1.4}
.alrow .am{font-size:var(--t2);color:var(--ink-3)}
.pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--crit);margin-right:6px}
@media(prefers-reduced-motion:no-preference){.pulse{animation:blip 1.1s ease-in-out infinite}}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.25}}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--nav);color:#fff;
  padding:13px 20px;border-radius:var(--r);font-size:var(--t3);box-shadow:var(--sh-3);z-index:95;max-width:90vw}
.toast b{color:var(--pri)}
@media(prefers-reduced-motion:no-preference){.toast{animation:rise .22s ease-out}}
@keyframes rise{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}

/* ---------- fil chronologique ---------- */
.tl{display:grid;gap:0;padding:6px 0}
.tl .ev{display:grid;grid-template-columns:18px 1fr auto;gap:14px;padding:8px 0;align-items:start}
.tl .rail{position:relative;width:18px;height:100%}
.tl .rail i{position:absolute;left:5px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.tl .ev.done .rail i{background:var(--ok)}
.tl .ev.now .rail i{background:var(--beacon-fill);box-shadow:0 0 0 4px var(--beacon-soft)}
.tl .rail:after{content:"";position:absolute;left:9px;top:16px;bottom:-8px;width:1.5px;background:var(--line)}
.tl .ev:last-child .rail:after{display:none}
.tl .lab{font-size:var(--t3);font-weight:500}
.tl .meta{font-size:var(--t2);color:var(--ink-3)}
.tl .when{font-family:inherit;font-size:var(--t2);color:var(--ink-3);
  font-variant-numeric:tabular-nums;white-space:nowrap}
/* Mode chauffeur : il ne reste que l'écran de travail, en plein écran.
   La barre latérale, la barre du haut et les onglets du bas disparaissent. */
body.chauffeur .side,
body.chauffeur .topbar,
body.chauffeur .btabs,
body.chauffeur .navscrim,
body.chauffeur .drvpick,
body.chauffeur .actions,
body.chauffeur .pagetop,
body.chauffeur .pops,
body.chauffeur #view > .note { display:none !important }
body.chauffeur .app{display:block;min-height:100dvh}
body.chauffeur main{padding:0;max-width:none}
body.chauffeur #view,
body.chauffeur .viewbody{padding:0;margin:0;max-width:none}
/* le fond de la page doit être celui du téléphone, sinon une bande claire
   dépasse autour de l'écran du chauffeur */
/* le fond de la page suit le mode jour/nuit du téléphone,
   sinon une bande sombre dépasse autour de l'écran clair */
body.chauffeur{background:#0d1319}
body.chauffeur:has(.phone[data-mode="jour"]){background:#e8ecf0}
body.chauffeur .phone{max-width:none;margin:0;border:0;border-radius:0;min-height:100dvh;box-shadow:none;
  padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
body.chauffeur .ph-none{min-height:70dvh}
/* =====================================================================
   Finition 2026 : de la profondeur, de la rondeur, un peu de mouvement.
   Ce bloc passe par-dessus le reste : il ne change aucune structure,
   seulement la façon dont les choses se posent à l'écran.
   ===================================================================== */

/* --- respiration --- */
.card{border-radius:16px;box-shadow:0 1px 2px rgba(16,26,38,.05),0 12px 28px -20px rgba(16,26,38,.28)}
.card>header{padding:24px 26px 12px}
.card>header h2{letter-spacing:-.025em}

/* --- les tuiles de chiffres : un filet de couleur et un chiffre qui pèse --- */
.kpi{border-radius:16px;position:relative;overflow:hidden;
  box-shadow:0 1px 2px rgba(16,26,38,.05),0 12px 28px -22px rgba(16,26,38,.30);
  transition:transform .16s ease, box-shadow .16s ease}
.kpi::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;
  background:linear-gradient(90deg,var(--act),var(--act) 55%,var(--pri));opacity:.85}
.kpi.good::before{background:linear-gradient(90deg,var(--ok),var(--ok) 60%,var(--pri))}
.kpi.kalert::before{background:linear-gradient(90deg,var(--crit),var(--warn))}
.kpi:hover{transform:translateY(-2px);
  box-shadow:0 2px 4px rgba(16,26,38,.06),0 20px 38px -22px rgba(16,26,38,.38)}
.kpi .v{letter-spacing:-.045em}
.kpi .k{color:var(--ink-2)}

/* --- boutons : plus ronds, un peu de relief, une réaction au survol --- */
.btn{border-radius:10px;transition:background .14s,border-color .14s,color .14s,
  transform .12s ease,box-shadow .14s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.pri{box-shadow:0 1px 2px rgba(11,83,176,.22),0 8px 18px -10px rgba(11,83,176,.55)}
.btn.pri:hover{box-shadow:0 2px 5px rgba(11,83,176,.26),0 14px 26px -12px rgba(11,83,176,.6)}
.btn.go{box-shadow:0 1px 2px rgba(11,124,77,.22),0 8px 18px -10px rgba(11,124,77,.5)}
.btn.gh:hover{transform:none}
.chip{border-radius:999px;transition:background .14s,border-color .14s,transform .12s ease}
.chip:hover{transform:translateY(-1px)}
.chip.on{background:var(--act);border-color:var(--act);color:#fff}

/* --- la barre latérale : un dégradé plutôt qu'un aplat, un onglet actif en pastille --- */
.side{background:linear-gradient(178deg,var(--nav) 0%,var(--nav) 46%,var(--nav-2) 100%)}
.navbtn{border-radius:0 999px 999px 0;margin-right:12px;transition:background .14s,color .14s}
.navbtn[aria-current="true"]{background:linear-gradient(90deg,var(--nav-2),rgba(255,255,255,.06))}
.navsub{padding-left:30px}
.navs{border-radius:8px;padding-left:10px}
.navs.on{background:rgba(255,198,26,.12)}

/* --- la barre du haut se décolle du contenu --- */
.topbar{border-bottom:1px solid var(--line);
  background:color-mix(in srgb, var(--panel) 88%, transparent);
  backdrop-filter:saturate(1.4) blur(10px)}

/* --- le titre de page respire --- */
.pagetop h1.page{letter-spacing:-.035em}
.crumb{letter-spacing:.15em}

/* --- tableaux : entête qui colle, ligne qui s'allume --- */
thead th{background:color-mix(in srgb, var(--panel) 92%, transparent);
  backdrop-filter:blur(8px);z-index:2}
tbody tr{transition:background .12s}
tbody tr:hover{background:var(--act-soft)}

/* --- champs : un seul anneau de focus, bleu, pas jaune --- */
input:focus,select:focus,textarea:focus{border-color:var(--act);outline:none;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--act) 26%, transparent)}
input,select,textarea{border-radius:10px}
.sel{border-radius:10px}

/* --- les encadrés d'explication : un filet de couleur, pas une boîte grise --- */
.note{border-left-width:3px;border-left-color:var(--act);border-radius:0 10px 10px 0;
  background:linear-gradient(90deg,var(--act-soft),transparent 78%)}

/* --- fenêtres --- */
.modal{border-radius:16px}
.scrim{backdrop-filter:blur(3px)}

/* --- registre : des lignes serrées, pour en lire beaucoup d'un coup --- */
#view .card table td.regt{width:56px;white-space:nowrap;font-variant-numeric:tabular-nums;
  color:var(--ink-3);font-family:"JetBrains Mono",inherit;font-size:var(--t2)}
#view .card table td.regt ~ td{padding-top:9px;padding-bottom:9px}
#view .card td.regt{padding-top:9px;padding-bottom:9px}

#view details summary{cursor:pointer;list-style:none}
#view details summary::-webkit-details-marker{display:none}
#view details summary::before{content:'▸ ';color:var(--ink-3)}
#view details[open] summary::before{content:'▾ '}

/* --- l'écran d'accueil se pose au centre, même sur un téléphone --- */
.scrim.accueil{align-items:center !important;justify-content:center !important;padding:20px}
.scrim.accueil .modal{margin:auto;border-radius:18px !important;max-height:none}
@media(max-width:700px){ .scrim.accueil .modal{width:100% !important} }

/* --- passer du camion au bureau sur le meme telephone --- */
.bascules{position:fixed;left:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:70;
  display:flex;flex-direction:column;gap:7px;align-items:flex-start}
/* Le bouton flottant ne doit jamais couvrir le menu quand le tiroir est ouvert :
   il cachait « Vue d'ensemble » dans la section Facturation. */
body.navouv .bascules{display:none}
@media(max-width:900px){
  /* dans le tiroir : une rangée de boutons comme les autres, pas un calque */
  nav.side .bascules{position:static;display:flex;flex-direction:column;gap:8px;
    padding:14px 16px 4px;order:3;bottom:auto;left:auto}
  body.navouv nav.side .bascules{display:flex}
  nav.side .bascule{width:100%;justify-content:center}
}
body:not(.chauffeur) .bascules{bottom:calc(14px + env(safe-area-inset-bottom))}
@media(min-width:901px){ body:not(.chauffeur) .bascules{display:none} }
.bascule{position:static;z-index:70;
  background:var(--act);color:#fff;text-decoration:none;font-size:var(--t2);font-weight:600;
  padding:9px 15px;border-radius:999px;box-shadow:0 6px 18px -6px rgba(11,83,176,.7)}
.bascule:hover{background:var(--act-2);color:#fff}

/* --- rien ne transparaît derrière l'écran d'accueil --- */
body.avantsession .app,
body.avantsession .btabs,
body.avantsession .pops,
body.avantsession .topbar,
body.avantsession .navscrim{display:none !important}
body.avantsession{background:var(--nav)}

/* --- personne n'aime les animations imposées --- */
@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important}
  .btn:hover,.kpi:hover,.chip:hover{transform:none}
}
/* =====================================================================
   Chantier · cette couche passe APRES « Finition 2026 » et annule ce
   qu'elle ajoutait de rondeur et de profondeur. Un poste de repartition
   n'est pas une application grand public : des filets, des angles nets,
   des etats pleins qui se lisent au soleil dans un camion.
   ===================================================================== */

/* --- les blocs sont delimites par un filet, pas par une ombre --- */
.card,.kpi,.fset{border-radius:var(--r);box-shadow:none;
  border:1px solid var(--line);background:var(--panel)}
.kpi::before{display:none}
.card>header{border-bottom:2px solid var(--ink);padding:13px 18px}
@media(max-width:900px){.card,.kpi{border-radius:var(--r)}}

/* --- les titres : la graisse fait la hierarchie, pas les capitales.
       Un mot en majuscules perd sa forme et se lit plus lentement. --- */
h1.page,.card>header h2,.modal>header h2,.lane>h3,.agday>h3{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  letter-spacing:-.022em;font-weight:700}
h1.page{line-height:1.06;letter-spacing:-.03em}
.kpi .v{letter-spacing:0}

/* --- angles nets partout ou « Finition 2026 » avait arrondi --- */
.btn,input,select,textarea,.sel,.modal,.note,.navs,.scrim.accueil .modal{
  border-radius:var(--r2) !important}

/* Le jaune du logo est tres clair : un bouton plein ne se detache du
   panneau blanc qu'a 1,37:1 — son contour disparait purement et
   simplement. Un filet olive lui rend un bord a 3,15:1, le minimum
   exige pour qu'on voie ou finit un bouton. */
.btn.pri,.btn.urg,.chip.on{border:1px solid #94962b}
/* Et ces puces ecrivaient en blanc sur le fond d'action : 1,37:1,
   illisible des que l'action est jaune. */
.chip.on{color:var(--act-ink)}
.note{border-radius:0 var(--r2) var(--r2) 0 !important}

/* --- les etats : pleins et satures, mais en pastille ronde et en
       minuscules. Le remplissage dit « ceci demande une action » ;
       les capitales n'ajoutaient que du bruit. --- */
.b,.tsp,.reco,.alrow .an,.cnt,.tn,.chip,.gpslink,.chartebox .ctag{
  border-radius:99px}
.b{letter-spacing:0;text-transform:none;font-weight:600;font-size:12.5px;padding:4px 10px}
.b.n{background:var(--panel-3);color:var(--ink-2)}
.b.ok{background:var(--ok-fill);color:var(--ok-on)}
.b.info{background:var(--info-fill);color:var(--info-on)}
.b.crit{background:var(--crit-fill);color:var(--crit-on)}
.b.warn{background:var(--warn-fill);color:var(--warn-on)}
.b.beacon{background:var(--beacon-pill);color:var(--beacon-on)}
.tsp.ok{background:var(--ok-fill);color:var(--ok-on)}
.tsp.crit{background:var(--crit-fill);color:var(--crit-on)}
.tsp.beacon{background:var(--beacon-pill);color:var(--beacon-on)}
.alrow.n1 .an{background:var(--info-fill);color:var(--info-on)}
.alrow.n2 .an{background:var(--beacon-pill);color:var(--beacon-on)}
.alrow.n3 .an{background:var(--crit-fill);color:var(--crit-on)}
.alrow.ok .an{background:var(--ok-fill);color:var(--ok-on)}
.reco{background:var(--ok-fill);color:var(--ok-on)}
.pop .pi{background:var(--info-fill);color:var(--info-on)}
.pop.n2 .pi{background:var(--beacon-pill);color:var(--beacon-on)}
.pop.n3 .pi{background:var(--crit-fill);color:var(--crit-on)}

/* --- la barre laterale : graphite, marqueur ambre --- */
.navbtn[aria-current="true"]{box-shadow:inset 3px 0 0 var(--pri)}
.mark{border-radius:var(--r2)}

/* --- ce qui reste rond le reste : jauges et pastilles de presence --- */
.avbar,.avbar>span,.dot,.finic,.galck{border-radius:999px}
.galck{border-radius:var(--r2)}
.dot,.finic{border-radius:50%}
/* =====================================================================
   Appli du chauffeur sur un vrai telephone
   ===================================================================== */

/* --- Le contenu prend toute la hauteur qui reste.
       .ph-body etait plafonne a min(560px,58vh) : une regle ecrite pour
       la maquette de telephone affichee dans le bureau. En plein ecran
       elle enfermait le travail du chauffeur dans un tiers d'ecran, avec
       son propre ascenseur, pendant que le reste ne servait a rien. --- */
body.chauffeur .phone{display:flex;flex-direction:column}
body.chauffeur .ph-body{max-height:none;flex:1 1 auto;overflow-y:auto;
  overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
body.chauffeur .ph-tabs{flex:none;position:sticky;bottom:0;z-index:5}

/* --- La barre du bas mange moins de hauteur --- */
body.chauffeur .ph-tab{padding:7px 2px 8px;font-size:10px}
body.chauffeur .ph-tab svg{width:19px;height:19px}

/* --- Les boutons du haut restent affiches en permanence :
       ils doivent se toucher sans viser, avec des gants. --- */
body.chauffeur .ph-top{padding:12px 14px 10px;gap:10px 8px}
body.chauffeur .ph-cam,
body.chauffeur .ph-msg{font-size:var(--t3);padding:9px 15px;min-height:40px;
  display:inline-flex;align-items:center;justify-content:center;font-weight:600}
body.chauffeur .ph-msg i{top:-6px;right:-6px;font-size:11px;padding:1px 6px}
/* --- La fiche du client, en tete de l'onglet Trajet --- */
.ph-client{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;
  border:1px solid var(--p-line);background:var(--p-carte);border-radius:var(--r);
  padding:13px 14px;margin-bottom:12px}
.ph-client b{display:block;font-size:var(--t4);color:var(--p-fort);line-height:1.2;font-weight:700}
.ph-client .l{display:block;font-size:var(--t2);color:var(--p-mut);margin-top:3px}
.ph-client .pc-cond{display:inline-block;margin-top:7px;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;font-weight:700;padding:3px 8px;border-radius:var(--r2);
  background:var(--p-acc);color:var(--p-ink-acc)}
.pc-tel{width:52px;height:52px;border-radius:50%;background:var(--p-ok);color:var(--p-ink-ok);
  display:grid;place-items:center;font-size:24px;text-decoration:none;flex:none}
.pc-tel.vide{background:var(--p-line);color:var(--p-mut2)}

/* --- Les messages remontes dans le dossier du compte --- */
.clmsgs{display:grid;gap:7px;max-height:260px;overflow:auto;padding-right:2px}
.clmsg{display:grid;gap:2px;background:var(--panel-2);border-left:3px solid var(--act);
  border-radius:0 var(--r2) var(--r2) 0;padding:9px 12px}
.clmsg .cm-t{font-family:inherit;font-size:var(--t1);color:var(--ink-3)}
.clmsg .cm-q{font-size:var(--t1);letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);font-weight:700}
.clmsg .cm-x{font-size:var(--t3);color:var(--ink);line-height:1.45}
/* =====================================================================
   Le camion parle la meme langue que le bureau : angles nets, pastilles
   pleines, jaune du logo. Meme systeme que l'ecran du bureau.
   ===================================================================== */
.phone{border-radius:var(--r)}
.ph-mode,.ph-cam,.ph-msg,.ph-chip,.ph-chip2,.ph-rapb,.pc-cond{border-radius:var(--r2)}
.ph-row,.ph-sq,.ph-call,.ph-big,.ph-back,.ph-gpsask,.ph-shoot,.ph-total,
.ph-f input,.ph-f select,.ph-f textarea{border-radius:var(--r2)}
.ph-hd h3{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  letter-spacing:-.02em;font-weight:700}
/* « MON CAMION » redevient « Mon camion » : meme raison que sur le
   tableau du bureau, un mot en capitales perd sa forme. Le petit
   intitule de section, lui, reste en capitales — c'est une etiquette,
   pas un titre, et iOS fait pareil. */
.ph-sec{letter-spacing:.08em;text-transform:uppercase;font-weight:600}
/* le rond du bouton d'appel reste rond : c'est un bouton de telephone */
.pc-tel,.ph-callic,.ph-sq .nu{border-radius:50%}

/* Le facturable du jour, tout a droite de la barre. Chiffres a largeur
   fixe : le montant change toutes les minutes et il ne doit pas faire
   sautiller le nom a cote. */
.tbmontant{display:flex;flex-direction:column;align-items:flex-end;
  line-height:1.06;white-space:nowrap;padding-left:6px;flex:none}
.tbmontant i{font-style:normal;font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);font-weight:600}
.tbmontant b{font-size:17px;font-weight:700;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;color:var(--ink)}
@media(max-width:760px){
  .tbmontant i{display:none}
  .tbmontant b{font-size:15px}
}
/* =====================================================================
   La pastille d'etat du chauffeur
   ===================================================================== */
.ph-etat{background:var(--p-acc);color:var(--p-ink-acc);border-radius:var(--r);
  padding:16px 18px 14px;margin-bottom:12px}
.ph-etat .pe-haut{display:flex;align-items:baseline;gap:12px}
.ph-etat .pe-l{flex:1;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-weight:700;font-size:30px;line-height:1;text-transform:uppercase;letter-spacing:.01em}
.ph-etat .pe-h{font-family:inherit;font-size:var(--t3);
  font-weight:600;color:var(--p-acc-sub)}
.ph-etat .pe-pas{display:flex;gap:5px;margin-top:12px}
.ph-etat .pe-pas i{flex:1;height:4px;border-radius:2px;background:var(--p-acc-sub);opacity:.35}
.ph-etat .pe-pas i.ok{opacity:1}
.ph-etat .pe-pas i.ici{opacity:1;box-shadow:0 0 0 2px var(--p-ink-acc)}
.ph-etat .pe-trace{margin-top:9px;font-size:var(--t2);color:var(--p-acc-sub);
  font-weight:600;line-height:1.4}

/* Elle s'eteint et se rallume, mais seulement quand le statut change :
   la classe « change » n'est posee qu'a ce moment-la. */
@media(prefers-reduced-motion:no-preference){
  .ph-etat.change{animation:pe-bascule .55s ease}
}
@keyframes pe-bascule{
  0%   {opacity:1}
  35%  {opacity:.15; transform:scale(.985)}
  36%  {opacity:.15}
  100% {opacity:1; transform:none}
}

/* Le geste du chauffeur : un seul bouton, gros. */
.pe-fin{width:100%;border:0;border-radius:var(--r2);background:var(--p-ok);color:var(--p-ink-ok);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;
  font-size:23px;text-transform:uppercase;letter-spacing:.02em;padding:17px 14px;
  min-height:60px;cursor:pointer}
.pe-fin.bloq{background:var(--p-crit-bg);color:var(--p-crit-txt);
  border:1px solid var(--p-crit-bd);font-size:var(--t3);text-transform:none;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;letter-spacing:0;min-height:0;padding:13px 14px}
.pe-fix{width:100%;margin-top:8px;border:1px solid var(--p-line);background:var(--p-carte);
  color:var(--p-txt3);border-radius:var(--r2);padding:11px;font:inherit;font-size:var(--t3);
  font-weight:600;cursor:pointer}

/* L'avance manuelle : repliee, pour les camions sans boitier. */
.pe-man{margin-top:12px}
.pe-man summary{font-size:var(--t2);color:var(--p-mut);cursor:pointer;padding:4px 0}
.pe-manb{width:100%;margin-top:7px;border:1px solid var(--p-line-h);background:var(--p-carte);
  color:var(--p-txt2);border-radius:var(--r2);padding:12px;font:inherit;font-size:var(--t3);
  font-weight:600;cursor:pointer}
.pe-mant{font-size:var(--t1);color:var(--p-mut2);margin-top:5px}
/* --- La barre du bas ne bouge plus jamais ---
   Deux choses la faisaient partir avec le contenu :
     · le telephone avait min-height:100dvh, donc il pouvait DEPASSER
       l'ecran et c'est la page entiere qui defilait ;
     · .ph-body est un enfant flex, et un enfant flex refuse de retrecir
       sous la taille de son contenu tant qu'on ne lui met pas
       min-height:0. Sans ca il debordait au lieu de defiler.
   Maintenant le telephone fait exactement la hauteur de l'ecran, seul
   le contenu defile, et la barre reste posee en bas. */
body.chauffeur{overflow:hidden}
body.chauffeur .phone{height:100dvh;max-height:100dvh;overflow:hidden}
body.chauffeur .ph-body{min-height:0}
body.chauffeur .ph-tabs{flex:0 0 auto}

/* --- L'odometre de la ronde --- */
.ph-f.odo input{font-size:19px;font-weight:700;
  font-family:inherit;letter-spacing:.04em}
.ph-f.odo.mauvais input{border-color:var(--p-crit);background:var(--p-crit-bg)}
.odo-ref{font-size:var(--t2);color:var(--p-mut);margin:-6px 0 4px}
.odo-ref b{color:var(--p-txt2);font-family:inherit}
.odo-mal{background:var(--p-crit-bg);border:1px solid var(--p-crit-bd);border-radius:var(--r2);
  padding:10px 12px;font-size:var(--t2);color:var(--p-crit-txt);line-height:1.45;margin:-2px 0 4px}
.odo-mal span{display:block;margin-top:5px;color:var(--p-crit-sub)}
.odo-mal .odo-ok2{color:var(--p-acc-txt);font-weight:600}

/* --- Les pastilles du haut : rondes et colorees --- */
body.chauffeur .ph-top{gap:9px 7px}
body.chauffeur .ph-cam,
body.chauffeur .ph-msg,
body.chauffeur .ph-mode{border-radius:999px;border:0;min-height:38px;
  padding:8px 16px;font-size:var(--t3);font-weight:700;
  display:inline-flex;align-items:center;gap:6px}
body.chauffeur .ph-cam{background:var(--p-acc);color:var(--p-ink-acc)}
body.chauffeur .ph-msg{background:var(--p-rond);color:var(--p-txt2)}
body.chauffeur .ph-msg.on{background:var(--p-crit);color:var(--p-ink-crit)}
body.chauffeur .ph-mode{background:var(--p-rond);color:var(--p-txt3)}
body.chauffeur .ph-msg i{top:-4px;right:-4px}
/* --- Ecran Prix : le paiement porte le montant et la decision --- */
.ph-paie .pp-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.ph-paie .pp-top b{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-weight:700;font-size:31px;line-height:1}
/* les deux pastilles collees sous le montant, pas perdues plus bas */
.ph-paie .pp-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 10px}
.ph-paie .pp-b{border-radius:999px;min-height:46px;font-size:var(--t3);font-weight:700}

/* « Ajouter une charge » colle au detail, sans le poids d'un gros bouton */
.ph-ajout{width:100%;margin:-4px 0 4px;border:1px dashed var(--p-line-h);
  background:none;color:var(--p-txt3);border-radius:var(--r2);
  padding:12px;font:inherit;font-size:var(--t3);font-weight:600;cursor:pointer}
.ph-ajout:hover{border-color:var(--p-acc);color:var(--p-acc-txt)}
/* --- La barre du haut : un seul bouton ambre, celui qui compte ---
   Cinq boutons portaient la classe .ph-cam (camion, menu, bureau,
   session). Les passer tous en ambre donnait une rangee orange.
   L'ambre est desormais reserve au camion ; le reste est neutre. */
body.chauffeur .ph-cam{background:var(--p-rond);color:var(--p-txt2)}
body.chauffeur .ph-cam[data-camswap]{background:var(--p-acc);color:var(--p-ink-acc)}

/* --- Le menu, dans le coin gauche --- */
.ph-burger{background:none;border:0;color:var(--p-txt3);font-size:21px;line-height:1;
  padding:6px 10px;margin-left:-4px;border-radius:var(--r2);cursor:pointer;flex:none}
.ph-burger:hover{background:var(--p-rond);color:var(--p-txt)}
.ph-burger.vide{display:block;width:37px;height:33px}
.ph-heure{flex:none}
/* --- Recapitulatif client et vehicule, en tete de l onglet Prix --- */
.ph-recap{background:var(--p-carte);border:1px solid var(--p-line);border-radius:var(--r);
  padding:14px 15px;margin-bottom:12px}
.ph-recap .rc-t{font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--p-mut2);font-weight:700;margin:14px 0 5px}
.ph-recap .rc-t:first-child{margin-top:0}
.ph-recap .rc-l{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.ph-recap .rc-l b{font-size:var(--t4);color:var(--p-fort);font-weight:700;line-height:1.25}
.ph-recap .rc-s{font-size:var(--t2);color:var(--p-mut);margin-top:2px;line-height:1.45}
.ph-recap .rc-s.mono{font-family:inherit;font-size:var(--t1)}
.ph-recap .rc-tel{color:var(--p-ok-txt);text-decoration:none;font-weight:700;
  font-size:var(--t3);white-space:nowrap}
.ph-recap .rc-b{display:inline-block;margin-top:8px;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;font-weight:700;padding:3px 9px;border-radius:var(--r2);
  background:var(--p-acc);color:var(--p-ink-acc)}
/* --- Un lien externe deguise en tuile de menu --- */
.ph-menu.ph-lien{text-decoration:none;color:inherit}
.ph-menu.ph-lien .pm-go{font-size:16px}
/* --- Les icones du menu sont maintenant des traces, pas des emojis --- */
.ph-menu .pm-ic{display:grid;place-items:center;color:var(--p-txt3)}
.ph-menu .pm-ic svg{display:block}
.ph-menu.chaud .pm-ic{color:var(--p-acc-txt)}
.ph-menu.rouge .pm-ic{color:var(--p-crit-txt)}
/* =====================================================================
   Les icones de l'application
   Un emoji n'est pas dessine par nous : chaque telephone a le sien, dans
   son style et ses couleurs. Ici c'est un trace, pose en masque, qui
   prend donc la couleur du texte qui l'entoure — y compris quand une
   tuile passe en ambre ou en rouge.
   ===================================================================== */
i[class^="ic-"]{display:inline-block;width:1.05em;height:1.05em;vertical-align:-.16em;
  background-color:currentColor;flex:none;
  -webkit-mask:var(--d) center/contain no-repeat;mask:var(--d) center/contain no-repeat}
.ic-antenne{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 12a1.7 1.7 0 1 0 3.4 0a1.7 1.7 0 1 0-3.4 0'/%3E%3Cpath d='M7.8 8a6 6 0 0 0 0 8.4'/%3E%3Cpath d='M16.2 8a6 6 0 0 1 0 8.4'/%3E%3Cpath d='M4.9 5.1a10 10 0 0 0 0 14.2'/%3E%3Cpath d='M19.1 5.1a10 10 0 0 1 0 14.2'/%3E%3C/svg%3E")}
.ic-appareil{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7.5h4L8.5 5h7L17 7.5h4v12H3z'/%3E%3Cpath d='M8.5 13.5a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0-7 0'/%3E%3C/svg%3E")}
.ic-attention{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.2L1.6 20.8h20.8z'/%3E%3Cpath d='M12 9.5v4.6'/%3E%3Cpath d='M12 17.6v.01'/%3E%3C/svg%3E")}
.ic-auto{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='M12 3a9 9 0 0 1 0 18z'/%3E%3C/svg%3E")}
.ic-billet{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 6h20v12H2z'/%3E%3Cpath d='M9 12a3 3 0 1 0 6 0a3 3 0 1 0-6 0'/%3E%3Cpath d='M5.5 9.5v.01'/%3E%3Cpath d='M18.5 14.5v.01'/%3E%3C/svg%3E")}
.ic-bureau{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V4.5h9V21'/%3E%3Cpath d='M13 21V9.5h7V21'/%3E%3Cpath d='M7 8v.01'/%3E%3Cpath d='M10 8v.01'/%3E%3Cpath d='M7 12v.01'/%3E%3Cpath d='M10 12v.01'/%3E%3Cpath d='M7 16v.01'/%3E%3Cpath d='M16.5 13v.01'/%3E%3Cpath d='M16.5 17v.01'/%3E%3C/svg%3E")}
.ic-cadenas{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10.5V8a5 5 0 0 1 10 0v2.5'/%3E%3Cpath d='M5 10.5h14v9.5H5z'/%3E%3Cpath d='M12 14.5v2'/%3E%3C/svg%3E")}
.ic-camion{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 16.5V7.5h10v9'/%3E%3Cpath d='M12 16.5v-5h3.6L19 15v1.5'/%3E%3Cpath d='M5.1 18.5a1.9 1.9 0 1 0 3.8 0a1.9 1.9 0 1 0-3.8 0'/%3E%3Cpath d='M14.6 18.5a1.9 1.9 0 1 0 3.8 0a1.9 1.9 0 1 0-3.8 0'/%3E%3C/svg%3E")}
.ic-cle{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.2 5.5a4.5 4.5 0 0 1-5.9 5.9L6 19.7a2.1 2.1 0 1 1-3-3l8.3-8.3a4.5 4.5 0 0 1 5.9-5.9l-2.9 2.9.7 2.6 2.6.7z'/%3E%3C/svg%3E")}
.ic-clef{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.5 3.5a5.5 5.5 0 1 0-4.4 8.8L3.5 20v.5h4V18h2.5v-2.5h2.2a5.5 5.5 0 0 0 3.3-12z'/%3E%3Cpath d='M17.5 7.5v.01'/%3E%3C/svg%3E")}
.ic-cloche{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9.5a6 6 0 1 0-12 0c0 5.5-2.5 7-2.5 7h17s-2.5-1.5-2.5-7'/%3E%3Cpath d='M13.8 20a2.1 2.1 0 0 1-3.6 0'/%3E%3C/svg%3E")}
.ic-clochemuette{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9.5a6 6 0 0 0-8.4-5.5'/%3E%3Cpath d='M6 9.5c0 5.5-2.5 7-2.5 7h13'/%3E%3Cpath d='M13.8 20a2.1 2.1 0 0 1-3.6 0'/%3E%3Cpath d='M3 3l18 18'/%3E%3C/svg%3E")}
.ic-combine{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 3.5h3l1.6 4-2 1.5a12 12 0 0 0 5.9 5.9l1.5-2 4 1.6v3a2 2 0 0 1-2.2 2C11.4 19 5 12.6 4.5 5.7A2 2 0 0 1 6.5 3.5z'/%3E%3C/svg%3E")}
.ic-courriel{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6.5h18v11H3z'/%3E%3Cpath d='M3 7l9 6.4L21 7'/%3E%3C/svg%3E")}
.ic-document{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2.5h8l4.5 4.5V21.5H6z'/%3E%3Cpath d='M14 2.5V7h4.5'/%3E%3Cpath d='M9 12h6'/%3E%3Cpath d='M9 16h6'/%3E%3C/svg%3E")}
.ic-eclair{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.5 2.5L5 13.5h5.5L9.5 21.5 19 10.5h-5.5z'/%3E%3C/svg%3E")}
.ic-engrenage{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 12a3 3 0 1 0 6 0a3 3 0 1 0-6 0'/%3E%3Cpath d='M19.4 14.5l1.8 1-2 3.5-2-.8a7.6 7.6 0 0 1-1.8 1L15 21.5H9l-.4-2.3a7.6 7.6 0 0 1-1.8-1l-2 .8-2-3.5 1.8-1a7.6 7.6 0 0 1 0-2l-1.8-1 2-3.5 2 .8a7.6 7.6 0 0 1 1.8-1L9 2.5h6l.4 2.3a7.6 7.6 0 0 1 1.8 1l2-.8 2 3.5-1.8 1a7.6 7.6 0 0 1 0 2z'/%3E%3C/svg%3E")}
.ic-etiquette{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 11.5l9-9h9v9l-9 9z'/%3E%3Cpath d='M16 8v.01'/%3E%3C/svg%3E")}
.ic-etoile{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.7 5.9 6.3.7-4.7 4.4 1.3 6.2L12 17.2l-5.6 3 1.3-6.2L3 9.6l6.3-.7z'/%3E%3C/svg%3E")}
.ic-horloge{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='M12 7.2v5.1l3.6 2.1'/%3E%3C/svg%3E")}
.ic-imprimante{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 8.5V3.5h10v5'/%3E%3Cpath d='M4.5 8.5h15v8h-3v5h-9v-5h-3z'/%3E%3Cpath d='M17 11.5v.01'/%3E%3C/svg%3E")}
.ic-interdit{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='M5.6 5.6l12.8 12.8'/%3E%3C/svg%3E")}
.ic-lune{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 14.6A9 9 0 1 1 9.4 3.5a7 7 0 0 0 11.1 11.1z'/%3E%3C/svg%3E")}
.ic-message{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9.5L5.5 19.5V16H4z'/%3E%3C/svg%3E")}
.ic-mobile{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 2.5h11v19h-11z'/%3E%3Cpath d='M10.5 18.5h3'/%3E%3C/svg%3E")}
.ic-module{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4.5h7v7H4z'/%3E%3Cpath d='M13 4.5h7v7h-7z'/%3E%3Cpath d='M4 13.5h7v7H4z'/%3E%3Cpath d='M13 13.5h7v7h-7z'/%3E%3C/svg%3E")}
.ic-note{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h10'/%3E%3Cpath d='M4 10h10'/%3E%3Cpath d='M4 15h6'/%3E%3Cpath d='M17.5 12.5l4 4-5.2 1.2 1.2-5.2z'/%3E%3C/svg%3E")}
.ic-oeil{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.6 12S5.6 5.2 12 5.2 22.4 12 22.4 12 18.4 18.8 12 18.8 1.6 12 1.6 12z'/%3E%3Cpath d='M9 12a3 3 0 1 0 6 0a3 3 0 1 0-6 0'/%3E%3C/svg%3E")}
.ic-personne{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a4 4 0 1 0 8 0a4 4 0 1 0-8 0'/%3E%3Cpath d='M4 21c0-4.4 3.6-7 8-7s8 2.6 8 7'/%3E%3C/svg%3E")}
.ic-plus{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.5v15'/%3E%3Cpath d='M4.5 12h15'/%3E%3C/svg%3E")}
.ic-position{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5s7-6.3 7-11.5a7 7 0 1 0-14 0c0 5.2 7 11.5 7 11.5z'/%3E%3Cpath d='M9.6 10a2.4 2.4 0 1 0 4.8 0a2.4 2.4 0 1 0-4.8 0'/%3E%3C/svg%3E")}
.ic-presse{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 3.5h6v3H9z'/%3E%3Cpath d='M7.5 5H6a1 1 0 0 0-1 1v14.5h14V6a1 1 0 0 0-1-1h-1.5'/%3E%3Cpath d='M8.5 11h7'/%3E%3Cpath d='M8.5 15h7'/%3E%3C/svg%3E")}
.ic-prise{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 2.5v6'/%3E%3Cpath d='M15 2.5v6'/%3E%3Cpath d='M5.5 8.5h13v3a6.5 6.5 0 0 1-13 0z'/%3E%3Cpath d='M12 18v3.5'/%3E%3C/svg%3E")}
.ic-recu{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 2.5h14v19l-2.3-1.5-2.4 1.5-2.3-1.5-2.4 1.5L7.3 20 5 21.5z'/%3E%3Cpath d='M8.5 8h7'/%3E%3Cpath d='M8.5 12h7'/%3E%3C/svg%3E")}
.ic-sanssignal{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18'/%3E%3Cpath d='M5 12.5a10 10 0 0 1 4-2.4'/%3E%3Cpath d='M2 8.8A15 15 0 0 1 8 5.4'/%3E%3Cpath d='M16 5.4a15 15 0 0 1 6 3.4'/%3E%3Cpath d='M15 10.1a10 10 0 0 1 4 2.4'/%3E%3Cpath d='M12 19.5v.01'/%3E%3C/svg%3E")}
.ic-signature{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20c3-1 4.5-4 7.5-4s3 2 5.5 2 3.5-2 5-5.5'/%3E%3Cpath d='M16.5 3.5l4 4-8.5 8.5-5 1 1-5z'/%3E%3C/svg%3E")}
.ic-soleil{--d:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 12a4 4 0 1 0 8 0a4 4 0 1 0-8 0'/%3E%3Cpath d='M12 2v2.5'/%3E%3Cpath d='M12 19.5V22'/%3E%3Cpath d='M2 12h2.5'/%3E%3Cpath d='M19.5 12H22'/%3E%3Cpath d='M5 5l1.8 1.8'/%3E%3Cpath d='M17.2 17.2L19 19'/%3E%3Cpath d='M19 5l-1.8 1.8'/%3E%3Cpath d='M6.8 17.2L5 19'/%3E%3C/svg%3E")}
/* --- Un champ mal rempli se signale sans redessiner la page --- */
.saisie-mauvaise{border-color:var(--crit) !important}
.saisie-avis{font-size:var(--t2);color:var(--crit);margin-top:5px;line-height:1.4}
.ph-f .saisie-avis{color:var(--p-crit-txt)}
.ph-f .saisie-mauvaise{border-color:var(--p-crit) !important}
/* --- Ce qui manque avant le premier appel --- */
.ph-prealable{background:var(--p-crit-bg);border:1px solid var(--p-crit-bd);
  border-radius:var(--r);padding:14px 16px;margin-bottom:10px}
.ph-prealable b{display:block;font-size:var(--t4);color:var(--p-crit-txt);
  font-weight:700;line-height:1.25}
.ph-prealable span{display:block;font-size:var(--t3);color:var(--p-crit-sub);margin-top:4px}
.ph-big.prealable{background:var(--p-carte);color:var(--p-txt);
  border:1px solid var(--p-line-h);margin-bottom:8px}
/* --- Le diagnostic des notifications --- */
.notif-diag{background:var(--p-carte,var(--panel-2));border:1px solid var(--p-line,var(--line));
  border-radius:var(--r2);padding:12px 14px;margin-top:8px}
.notif-diag>b{display:block;font-size:10px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--p-mut2,var(--ink-3));font-weight:700;margin-bottom:7px}
.notif-diag .nd{display:flex;justify-content:space-between;gap:12px;font-size:var(--t2);
  padding:3px 0;color:var(--p-mut,var(--ink-3))}
.notif-diag .nd i{font-style:normal;font-weight:700;color:var(--p-txt2,var(--ink));
  font-family:inherit;text-align:right}
/* =====================================================================
   Compactage de l ecran du chauffeur
   Il travaille debout, une main sur le telephone : chaque centimetre
   qu'il n'a pas a faire defiler est du temps gagne. On resserre les
   marges sans toucher a la taille du texte ni a celle des boutons —
   un bouton plus petit se rate avec des gants.
   ===================================================================== */

/* L'entete colle a la barre du haut : « APPEL #3341 · VERS ORIGINE »
   remonte contre les icones au lieu de flotter au milieu. */
body.chauffeur .ph-top{padding:8px 13px 5px}
body.chauffeur .ph-hd{padding:2px 14px 9px}
body.chauffeur .ph-hd h3{margin-top:1px}
body.chauffeur .ph-cli{margin-top:2px}

/* Le corps : moins de marge autour, moins d'air entre les blocs. */
body.chauffeur .ph-body{padding:10px 14px 14px;gap:9px}

/* Les blocs eux-memes respirent moins, mais restent lisibles. */
body.chauffeur .ph-money{padding:10px 12px}
body.chauffeur .ph-money .r{padding:2px 0}
body.chauffeur .ph-recap{padding:11px 13px;margin-bottom:9px}
body.chauffeur .ph-recap .rc-t{margin:10px 0 4px}
body.chauffeur .ph-paie{padding:11px 13px}
body.chauffeur .ph-sec{margin-top:3px}
body.chauffeur .ph-row{padding:11px 12px}
body.chauffeur .ph-note{margin:2px 0}

/* La pastille d'etat et le bouton Terminer gardent leur presence :
   ce sont les deux choses qu'il vise du pouce. */
body.chauffeur .ph-etat{padding:12px 14px 11px;margin-bottom:9px}
body.chauffeur .ph-etat .pe-pas{margin-top:9px}
body.chauffeur .ph-etat .pe-trace{margin-top:7px}
body.chauffeur .pe-fin{min-height:54px;padding:14px}

/* Le client et le vehicule, plus serres. */
body.chauffeur .ph-client{padding:11px 13px;margin-bottom:9px}
/* --- L'avertissement de notifications, impossible a manquer --- */
.notif-cri{background:var(--p-crit-bg);border:1px solid var(--p-crit-bd);
  border-left:4px solid var(--p-crit);border-radius:var(--r);
  margin:0 14px 10px;padding:13px 15px}
.notif-cri b{display:block;font-size:var(--t4);color:var(--p-crit-txt);
  font-weight:700;line-height:1.25}
.notif-cri span{display:block;font-size:var(--t3);color:var(--p-crit-sub);
  margin-top:4px;line-height:1.45}
.notif-cri-b{width:100%;margin-top:11px;border:0;border-radius:var(--r2);
  background:var(--p-acc);color:var(--p-ink-acc);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-weight:700;
  font-size:19px;text-transform:uppercase;letter-spacing:.02em;
  padding:14px;min-height:50px;cursor:pointer}
.notif-cri-b[disabled]{opacity:.6}

/* inventaire : lignes qu'on glisse, titres de coffre */
.invrow{touch-action:pan-x}.invpoignee{cursor:grab;touch-action:none}.invrow.glisse{opacity:.4}
body.inv-glisse{cursor:grabbing;user-select:none}body.inv-glisse .invrow{cursor:grabbing}
.invfantome{position:fixed;z-index:9999;pointer-events:none;padding:6px 12px;border-radius:8px;background:var(--pri);color:var(--pri-txt,#fff);font-weight:600;box-shadow:var(--sh-2)}
.invpoignee{width:34px;color:var(--ink-3);font-size:18px;white-space:nowrap;user-select:none}
.invfl{display:inline-flex;flex-direction:column;vertical-align:middle;margin-left:4px}.invfl .btn{padding:0 4px;line-height:14px;font-size:9px}
.invgrp td{background:var(--panel-2);padding-top:10px}
.invcible td{box-shadow:inset 0 3px 0 var(--pri)}
.ph-grp{font-weight:700;font-size:13px;opacity:.75;margin:12px 0 4px;text-transform:uppercase;letter-spacing:.04em}
/* signaler un problème à Claude, dans le menu de gauche */
.navsig{padding:10px 14px 0}
.navsigb{width:100%;display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:10px;border:1px dashed var(--nav-ink-2);background:transparent;color:var(--nav-ink);font:inherit;font-size:12.5px;cursor:pointer;text-align:left}
.navsigb:hover{background:var(--nav-2)}
/* deux appels en main : on passe de l un a l autre */
.ph-multi{display:flex;gap:7px;padding:10px 14px 0;flex-wrap:wrap}.ph-multi .ph-gps{text-align:left;line-height:1.2}.ph-multi small{opacity:.7;font-weight:400}
/* menu ⋯ au bout des lignes du tableau de répartition */
.menu-ligne{display:inline-block}.ml-btn{font-weight:800;letter-spacing:.05em;min-width:34px}.ml-btn.on{background:var(--panel-2)}
.ml-pop{position:fixed;z-index:120;min-width:230px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);padding:6px;display:grid;gap:3px}
.ml-pop .btn{width:100%;justify-content:flex-start;text-align:left;border-color:transparent;background:transparent}.ml-pop .btn:hover{background:var(--panel-2)}
.ml-pop .btn.danger{color:var(--crit)}
/* impression d une liste (data-listeprint) */
.doc table.liste, .doc>table{width:100%;border-collapse:collapse;font-size:12px}.doc>table th,.doc>table td{border-bottom:1px solid #ccc;padding:5px 7px;text-align:left;vertical-align:top}.doc>table th{background:#eee}.doc>table .sub2{font-size:11px;color:#555}
.notecompta{font-size:12.5px;background:var(--warn-soft);border-left:3px solid var(--warn);padding:5px 8px;border-radius:6px;white-space:pre-wrap}
th.trier{cursor:pointer;user-select:none;white-space:nowrap}th.trier .fl{opacity:.35;font-size:10px}th.trier.on{color:var(--pri-txt,var(--ink))}th.trier.on .fl{opacity:1}th.trier:hover .fl{opacity:.8}

/* a-facturer (Anthony, 28 sept. 2026 : « je dois toujours descendre jusqu en bas pour tasser la page ») :
   le tableau a la hauteur de l ecran ; la barre de cote reste visible et les titres restent en haut */
@media(min-width:901px){.tw.twhaut{max-height:calc(100vh - 190px);overflow:auto}}