/* Panneau de navigation « barre fine ». Couleurs : --np-a (accent du camion), --np-d (couleur profonde). */
body.np-on #navbar{display:none!important}
.npnl{--a:var(--np-a,#ffb81c);--d:var(--np-d,#141920);--on:var(--np-on,#0B0F14);position:fixed;left:0;right:0;bottom:0;z-index:62;pointer-events:none;color:#F5F6F8}
.npnl[hidden]{display:none}
.npnl>*{pointer-events:auto}
.npb{position:relative;max-width:420px;margin:0 auto 10px;margin-bottom:calc(10px + env(safe-area-inset-bottom));width:calc(100% - 20px);border-radius:30px;padding:10px 12px 8px;display:grid;grid-template-columns:52px 1fr 52px;align-items:center;gap:0 8px;
 background:linear-gradient(180deg,rgba(24,30,38,.84),rgba(10,13,18,.92));-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);
 border:1px solid color-mix(in srgb,var(--a) 55%,#29313B);box-shadow:0 0 22px color-mix(in srgb,var(--a) 20%,transparent),0 12px 34px rgba(0,0,0,.5);animation:npup .5s cubic-bezier(.2,.8,.2,1) both}
@keyframes npup{from{transform:translateY(30px);opacity:0}}
.nprb{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#fff;background:#1d252f;border:1px solid #2c3540;padding:0;transition:transform .12s,filter .12s}
.nprb:active{transform:scale(.94);filter:brightness(.92)}
.nprb.npst{background:linear-gradient(135deg,var(--a),color-mix(in srgb,var(--a) 60%,var(--d)));color:var(--on);border:0;box-shadow:0 5px 14px color-mix(in srgb,var(--a) 35%,transparent)}
.nprb svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.npex svg{transition:transform .3s}.npb.open .npex svg{transform:rotate(180deg)}
.nprb:focus-visible{outline:2px solid var(--a);outline-offset:3px}
.npc{text-align:center;min-width:0}
.npc b{display:block;font:700 40px/1 system-ui,sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:#fff}.npc b small{font-size:19px;margin-left:2px;color:#cfd5dc}
.npc span{display:block;margin-top:4px;font-size:13.5px;color:#C2C9D1}.npc span i{font-style:normal;color:var(--a);font-weight:700}
.npmore{display:none;grid-column:1/-1;border-top:1px solid #2c3540;margin-top:8px;padding-top:10px;grid-template-columns:1fr 1fr 1fr;text-align:center}
.npb.open .npmore{display:grid}
.npmore b{display:block;font:700 20px system-ui,sans-serif;color:#fff}.npmore span{font-size:11.5px;color:#A0A8B2}
.npl{grid-column:1/-1;margin:6px 0 0;font-size:9.5px;line-height:1.3;color:#7f8893;text-align:center}
.npv{position:absolute;left:14px;bottom:var(--np-h,110px);width:62px;height:62px;border-radius:50%;background:rgba(12,16,21,.88);border:2px solid color-mix(in srgb,var(--a) 70%,#29313B);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.45);pointer-events:none}
.npv b{font:700 24px/1 system-ui,sans-serif;font-variant-numeric:tabular-nums;color:#fff}.npv span{font-size:10px;color:#A0A8B2;margin-top:1px}
.npnl b.tick{animation:nptk .35s}
@keyframes nptk{from{opacity:.3;transform:translateY(4px)}}
/* À l'arrêt (itinéraire calculé) : seulement distance, durée, arrivée. */
.npnl.pre .npv,.npnl.pre .npst,.npnl.pre .npex,.npnl.pre .npmore,.npnl.pre .npl{display:none}
.npnl.pre .npb{grid-template-columns:1fr;padding-bottom:10px}
body.np-pre #s-destination .phone{padding-bottom:calc(var(--np-h,110px) + 24px)}
/* Boutons flottants du guidage : au-dessus de la barre. */
body.np-on .nvrec{bottom:calc(var(--np-h,110px) + 10px + env(safe-area-inset-bottom))}
body.np-on .nvov{bottom:calc(var(--np-h,110px) + 66px + env(safe-area-inset-bottom))}
body:not([data-scr="destination"]):not([data-scr="guidage"]) .npnl{display:none!important}
@media(prefers-reduced-motion:reduce){.npb,.npnl b.tick{animation:none}}
/* Guidage : seule la flèche de navigation, calée sur la route (pas le point bleu de position brute). */
body.navfull .xmeloc{display:none!important}