/* Track Record 1.7 — molette contrôlée, retours stables et états cartographiques. */
body[data-page="track-record"] #bar{width:100%!important;transform-origin:left center}
body[data-page="track-record"] .map-stage{
  height:max(42rem,var(--viewport-h));min-height:620px;max-height:none;isolation:isolate;
  background:radial-gradient(circle at 60% 35%,#1d2630,#08090c 68%)
}
body[data-page="track-record"] #glmap{touch-action:pan-y;overscroll-behavior:auto;filter:saturate(.98) contrast(1.035)}
body[data-page="track-record"] .map-stage:not(.map-ready) #glmap{opacity:.72}
body[data-page="track-record"] .map-stage.map-ready #glmap{opacity:1;transition:opacity .7s ease}
body[data-page="track-record"] .map-stage::before{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  background:linear-gradient(125deg,rgba(255,255,255,.045),transparent 24%,transparent 70%,rgba(46,124,199,.04));
  mix-blend-mode:screen
}
body[data-page="track-record"] .map-stage::after{
  content:"";position:absolute;inset:-18%;z-index:4;pointer-events:none;opacity:0;
  background:linear-gradient(112deg,transparent 30%,rgba(112,206,255,.045) 46%,rgba(255,238,171,.035) 52%,transparent 68%);
  transform:translate3d(-18%,0,0);transition:opacity .45s
}
body[data-page="track-record"] .map-stage.motion-running::after{opacity:1;animation:trMapSweep 8s ease-in-out infinite alternate}
body[data-page="track-record"] .map-stage.motion-paused::after{animation-play-state:paused;opacity:.15}
@keyframes trMapSweep{to{transform:translate3d(18%,2%,0)}}
body[data-page="track-record"] .map-stage.water-live{
  box-shadow:inset 0 -1px 0 rgba(59,151,225,.25),0 22px 80px rgba(0,0,0,.4)
}
body[data-page="track-record"] .map-head{
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.025) 48%,rgba(255,213,98,.035)),rgba(7,8,11,.56);
  border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(23px) saturate(155%);backdrop-filter:blur(23px) saturate(155%);
  box-shadow:0 24px 68px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.15)
}
/* Après la prise en main, le contexte reste visible sous une forme compacte. */
body[data-page="track-record"] .map-stage .map-head.dim{
  opacity:1;transform:none;width:auto;max-width:min(32rem,calc(100vw - 2 * var(--pad-x)));
  padding:.62rem .9rem;border-radius:999px
}
body[data-page="track-record"] .map-head.dim h1,
body[data-page="track-record"] .map-head.dim p{display:none}
body[data-page="track-record"] .map-head.dim .eyebrow{
  margin:0;opacity:1;animation:none;font-size:.64rem;letter-spacing:.22em;white-space:nowrap
}
body[data-page="track-record"] .map-head.dim .eyebrow::before{width:24px}
body[data-page="track-record"] .map-style-switch{gap:.18rem;flex-wrap:wrap;justify-content:flex-end;max-width:min(48rem,calc(100vw - 2 * var(--pad-x)))}
body[data-page="track-record"] .map-camera-tools{
  position:absolute;z-index:8;right:var(--pad-x);top:50%;transform:translateY(-42%);
  display:flex;flex-direction:column;gap:.42rem;padding:.5rem;border:1px solid rgba(255,255,255,.17);border-radius:18px;
  background:linear-gradient(150deg,rgba(255,255,255,.11),rgba(255,255,255,.025) 62%),rgba(5,7,10,.78);
  -webkit-backdrop-filter:blur(18px) saturate(155%);backdrop-filter:blur(18px) saturate(155%);
  box-shadow:0 18px 48px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.15)
}
body[data-page="track-record"] .map-camera-tools button{
  width:86px;min-height:50px;display:grid;grid-template-columns:28px 1fr;align-items:center;gap:.45rem;
  padding:.45rem .55rem;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.035);
  color:#eef2f6;cursor:pointer;text-align:left;transition:transform .25s var(--ease),background .25s,border-color .25s,color .25s
}
body[data-page="track-record"] .map-camera-tools button:hover,body[data-page="track-record"] .map-camera-tools button:focus-visible{transform:translateX(-2px);background:rgba(255,213,98,.13);border-color:rgba(255,213,98,.52)}
body[data-page="track-record"] .map-camera-tools button.active{background:linear-gradient(145deg,#ffe99d,#e3b33b);border-color:#fff0ae;color:#151006;box-shadow:0 8px 20px rgba(255,213,98,.22)}
body[data-page="track-record"] .map-camera-tools strong{font:700 1.05rem/1 var(--display);text-align:center}
body[data-page="track-record"] .map-camera-tools span{font:600 .62rem/1.15 var(--text);letter-spacing:.03em}
body[data-page="track-record"] .map-foot-actions{display:flex;align-items:center;gap:.8rem;pointer-events:auto}
/* V1.11 — plus de bouton de mode : simple consigne passive intégrée aux contrôles. */
body[data-page="track-record"] .map-gesture-hint{display:flex;align-items:center;min-height:42px;margin:0;padding:.48rem .78rem;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(5,7,10,.72);color:#c9ccd3;font:500 .64rem/1.3 var(--text);letter-spacing:.02em;backdrop-filter:blur(12px);pointer-events:none;white-space:nowrap}
body[data-page="track-record"] .map-gesture-hint b{color:var(--gold);font-weight:600;margin-right:.28em}
.map-gesture-hint .hint-coarse{display:none}
@media(pointer:coarse){.map-gesture-hint .hint-fine{display:none}.map-gesture-hint .hint-coarse{display:inline}}
/* P0.3 — l'écran des gestes coopératifs MapLibre a été retiré (mécanisme supprimé). */
body[data-page="track-record"] #projets{scroll-margin-top:5rem}
body[data-page="track-record"] .map-tool-btn{
  min-height:44px;padding:.6rem 1rem;border:0;border-radius:30px;background:transparent;color:var(--grey);
  display:inline-flex;align-items:center;
  font:600 .74rem/1 var(--text);letter-spacing:.025em;cursor:pointer;transition:.3s var(--ease)
}
body[data-page="track-record"] .map-tool-btn:hover,body[data-page="track-record"] .map-tool-btn:focus-visible{color:var(--ink);background:rgba(255,255,255,.09)}
body[data-page="track-record"] .map-tool-btn[aria-pressed="false"]{color:#ffc878;background:rgba(255,177,69,.1)}
body[data-page="track-record"] #trmapmotion.is-running{color:#dff7ff;background:rgba(66,172,231,.14);box-shadow:inset 0 0 0 1px rgba(108,201,250,.24)}
body[data-page="track-record"] .motion-running .sw-water{animation:trWaterSwatch 1.15s ease-in-out infinite alternate}
@keyframes trWaterSwatch{to{transform:translateY(-2px) scale(1.16);background:#77cfff;box-shadow:0 0 14px rgba(91,193,248,.9)}}
body[data-page="track-record"] .map-live-status{
  position:absolute;z-index:7;top:calc(9.4rem + env(safe-area-inset-top));right:var(--pad-x);display:flex;align-items:center;gap:.6rem;
  margin:0;padding:.52rem .76rem;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(7,8,11,.62);
  color:#c8cbd2;font:500 .65rem/1.15 var(--text);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);
  box-shadow:0 10px 30px rgba(0,0,0,.32);pointer-events:none
}
body[data-page="track-record"] .map-live-status span{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(255,213,98,.5);animation:trStatusPulse 1.7s ease-out infinite}
body[data-page="track-record"] .map-live-status.ready span{background:#42d993;animation:none;box-shadow:0 0 14px rgba(66,217,147,.68)}
body[data-page="track-record"] .map-live-status.degraded span{background:#ffb65e;animation:none;box-shadow:0 0 13px rgba(255,182,94,.52)}
@keyframes trStatusPulse{70%{box-shadow:0 0 0 11px rgba(255,213,98,0)}100%{box-shadow:0 0 0 0 rgba(255,213,98,0)}}
body[data-page="track-record"] .motion-paused .gl-pin,body[data-page="track-record"] .motion-paused .gl-hq .puck{animation-play-state:paused}
body[data-page="track-record"] .mapboxgl-ctrl-group,body[data-page="track-record"] .maplibregl-ctrl-group{border:1px solid rgba(255,255,255,.14);background:rgba(8,8,11,.66);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 10px 26px rgba(0,0,0,.32)}
body[data-page="track-record"] .mapboxgl-ctrl-group button,body[data-page="track-record"] .maplibregl-ctrl-group button{filter:invert(1) grayscale(1);opacity:.86}
body[data-page="track-record"] .map-stage.is-expanded{position:fixed;inset:max(.7rem,env(safe-area-inset-top)) max(.7rem,env(safe-area-inset-right)) max(.7rem,env(safe-area-inset-bottom)) max(.7rem,env(safe-area-inset-left));z-index:1200;width:auto;height:auto;min-height:0;border:1px solid rgba(255,255,255,.16);border-radius:24px;overflow:hidden;box-shadow:0 36px 120px rgba(0,0,0,.72)}
body[data-page="track-record"] .map-stage.is-expanded .map-head{max-width:min(600px,66vw)}
html.track-map-expanded,html.track-map-expanded body{overflow:hidden}
html.dialog-open,html.dialog-open body{overflow:hidden}
/* 1.8 — Verrous modaux : compense la largeur de la barre de défilement stylée pour
   éviter le décalage horizontal du contenu et du bandeau de navigation. */
html.dialog-open body,html.track-map-expanded body{padding-right:var(--scrollbar-comp,0px)}
html.dialog-open nav,html.track-map-expanded nav{right:var(--scrollbar-comp,0px)}
/* 1.8 — Anti-éclair d'arrivée : voile opaque au-dessus de la page, sous les fiches
   (nav z100 < voile z2000 < tiroir z1620 relevé ci-dessous < fiche z1650). */
html.deep-open-pending body::before{content:"";position:fixed;inset:0;z-index:1600;background:var(--bg,#050506);pointer-events:none}
body[data-page="track-record"] .map-drawer{max-height:calc(var(--viewport-h) - 2rem);overflow-y:auto;overscroll-behavior:contain}
body[data-page="track-record"] .gl-pin:focus-visible,
body[data-page="track-record"] .gl-hq:focus-visible{outline:2px solid #fff;outline-offset:5px}
body[data-page="track-record"] .focus-box{transition:transform .34s var(--ease),opacity .28s}
body[data-page="track-record"] .focus-back{transition:opacity .32s}
body[data-page="track-record"] .focus-arrows button{min-width:44px;min-height:44px;box-shadow:0 8px 24px rgba(0,0,0,.3)}
body[data-page="track-record"] .focus-body{scrollbar-gutter:stable}
/* En mode focus cartographique, la fiche doit passer au-dessus de la carte. */
body[data-page="track-record"] .focus{z-index:1650}
body[data-page="track-record"] .transactions-index{margin:1.5rem 0 2rem;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}
body[data-page="track-record"] .transactions-index summary{padding:1rem 1.2rem;color:var(--gold);font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
body[data-page="track-record"] .transactions-index ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0;padding:0 1.2rem 1.2rem;list-style-position:inside}
body[data-page="track-record"] .transactions-index li{padding:.75rem;border-top:1px solid rgba(255,255,255,.07);color:#777780;font-size:.8rem}
body[data-page="track-record"] .transactions-index li::marker{color:var(--gold)}
body[data-page="track-record"] .transactions-index b,body[data-page="track-record"] .transactions-index span{display:block}
body[data-page="track-record"] .transactions-index b{margin:.2rem 0;color:#e9e9ed;font-size:.9rem}

@media(max-width:1023px){
  body[data-page="track-record"] .map-stage{height:max(44rem,var(--viewport-h));min-height:680px}
  body[data-page="track-record"] .map-head{top:calc(8.1rem + env(safe-area-inset-top));max-width:min(35rem,calc(100vw - 2.5rem))}
  body[data-page="track-record"] .map-stage .map-head.dim{max-width:calc(100vw - 2.5rem)}
  body[data-page="track-record"] .map-style-switch{top:calc(4.25rem + env(safe-area-inset-top));left:1.25rem;right:1.25rem;max-width:none;justify-content:flex-start}
  body[data-page="track-record"] .map-live-status{top:calc(7.75rem + env(safe-area-inset-top));right:1.25rem}
  body[data-page="track-record"] .map-foot{padding-left:1.25rem;padding-right:1.25rem}
  body[data-page="track-record"] .map-camera-tools{right:1.25rem;top:52%}
  body[data-page="track-record"] .map-gesture-hint{font-size:.58rem}
}
@media(max-width:680px){
  body[data-page="track-record"] .map-stage{height:max(47rem,var(--viewport-h));min-height:740px}
  body[data-page="track-record"] .map-head{top:calc(10.7rem + env(safe-area-inset-top));left:.75rem;max-width:calc(100vw - 1.5rem);padding:.88rem 1rem}
  body[data-page="track-record"] .map-stage .map-head.dim{top:calc(10.35rem + env(safe-area-inset-top));padding:.55rem .72rem;max-width:calc(100vw - 1.5rem)}
  body[data-page="track-record"] .map-head.dim .eyebrow{font-size:.58rem;letter-spacing:.16em}
  body[data-page="track-record"] .map-head h1{font-size:clamp(1.65rem,8.5vw,2.35rem)}
  body[data-page="track-record"] .map-head p{font-size:.78rem;line-height:1.5}
  body[data-page="track-record"] .map-style-switch{top:calc(4.15rem + env(safe-area-inset-top));left:.75rem;right:.75rem;padding:.28rem;border-radius:18px}
  body[data-page="track-record"] .mss-btn,body[data-page="track-record"] .map-tool-btn{padding:.45rem .68rem;font-size:.66rem;flex:1 1 auto}
  body[data-page="track-record"] .map-live-status{top:calc(8.05rem + env(safe-area-inset-top));left:.75rem;right:auto;max-width:calc(100vw - 1.5rem)}
  body[data-page="track-record"] .map-foot{padding:.8rem .75rem calc(.9rem + env(safe-area-inset-bottom));gap:.6rem}
  body[data-page="track-record"] .map-legend{max-width:calc(100vw - 1.5rem)}
  body[data-page="track-record"] .map-foot .btn-ghost{font-size:.68rem;padding:.62rem .78rem}
  body[data-page="track-record"] .map-stage.is-expanded{inset:0;border:0;border-radius:0}
  body[data-page="track-record"] .map-stage.is-expanded .map-head{max-width:calc(100vw - 1.5rem)}
  body[data-page="track-record"] .transactions-index ol{grid-template-columns:1fr}
  body[data-page="track-record"] .map-camera-tools{right:.65rem;top:51%;padding:.32rem;gap:.3rem;border-radius:15px}
  body[data-page="track-record"] .map-camera-tools button{width:48px;min-height:46px;display:flex;justify-content:center;padding:.35rem}
  body[data-page="track-record"] .map-camera-tools button span{display:none}
  body[data-page="track-record"] .map-camera-tools strong{font-size:.92rem}
  body[data-page="track-record"] .map-foot-actions{width:100%;justify-content:flex-end}
  body[data-page="track-record"] .map-gesture-hint{white-space:normal;max-width:15rem;text-align:left}
}
@media(prefers-reduced-motion:reduce){body[data-page="track-record"] .map-live-status span{animation:none}}

/* ================= 1.8.2 → V1.11 ================= */
/* Tactile : hors mode focus, un doigt fait défiler la page (les gestes coopératifs
   MapLibre gèrent le reste) ; en plein écran, la carte reprend tous les gestes. */
@media(pointer:coarse){
  .map-stage:not(.is-expanded) .maplibregl-canvas,
  .map-stage:not(.is-expanded) .maplibregl-canvas-container{touch-action:pan-y!important}
}

/* Visite vidéo : appel franc — pastille or pleine, anneau respirant sobre,
   vignette légèrement voilée pour détacher le bouton, cartouche centré lisible. */
.vfacade img{opacity:.62}
.vfacade::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 32%,rgba(0,0,0,.38));pointer-events:none}
.vfacade .play{width:76px;height:76px;background:var(--gold);border:0;z-index:1;
  box-shadow:0 12px 34px rgba(0,0,0,.55);transition:transform .3s var(--ease),background .3s}
.vfacade .play::before{content:"";position:absolute;inset:-7px;border-radius:50%;
  border:2px solid rgba(255,213,98,.55);animation:vplay-ring 2.6s var(--ease) infinite}
.vfacade .play svg{width:27px;height:27px;fill:#000;margin-left:4px}
.vfacade:hover .play{transform:scale(1.07)}
.vfacade:hover .play svg,.vfacade .play svg{fill:#000}
.vfacade .cap{left:50%;transform:translateX(-50%);bottom:.95rem;white-space:nowrap;
  background:rgba(5,5,6,.74);border:1px solid rgba(255,213,98,.42);padding:.42rem .95rem;
  border-radius:30px;font-weight:600;letter-spacing:.14em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:1}
@keyframes vplay-ring{0%{transform:scale(.88);opacity:.9}70%,100%{transform:scale(1.42);opacity:0}}
@media(prefers-reduced-motion:reduce){.vfacade .play::before{animation:none;opacity:0}}

/* ============ V1.12 · carte passive : indication statique du contrat de molette ============ */
/* Voyant discret bas-centre, non interactif (aria-hidden), cliquable au travers.
   Texte statique unique : « Molette : la page défile — Mode focus pour explorer la carte ».
   Plus aucun état « armé » (mécanisme supprimé en V1.12, cf. P0.3). Le nom historique
   .map-arm-cue est conservé pour ne pas casser les recettes ; il ne désigne plus un armement. */
.map-arm-cue{
  position:absolute;left:50%;bottom:4.4rem;transform:translateX(-50%);z-index:7;
  margin:0;padding:.5rem 1.05rem;border-radius:999px;pointer-events:none;
  font:600 .74rem/1.2 var(--text);letter-spacing:.05em;color:#e9edf2;white-space:nowrap;
  background:rgba(7,8,11,.72);border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 10px 30px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.12);
  opacity:0;transition:opacity .45s ease,transform .45s var(--ease)
}
/* P0.3 — indication statique du contrat de molette : visible au pointeur fin,
   carte prête, hors mode focus. Plus d'état « armé » (mécanisme supprimé). */
@media(pointer:fine){
  .map-stage.map-ready:not(.is-expanded) .map-arm-cue{opacity:.9}
}
@media(max-width:700px){.map-arm-cue{display:none}}

/* ============ Lot B (commit B) · densité mobile de la carte ============ */
/* Bureau : la légende reste en ligne, le bouton « Repères » est masqué. */
.map-legend-toggle{display:none}
@media(max-width:700px){
  /* La légende se replie derrière un seul bouton ≥ 44 px : moins de commandes
     simultanées, cibles tactiles franches, plus de rangée écrasée (CR #8). */
  .map-legend-toggle{
    display:inline-flex;align-items:center;gap:.45rem;min-height:44px;padding:.55rem 1rem;
    border-radius:999px;border:1px solid rgba(255,255,255,.2);cursor:pointer;
    background:linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02)),rgba(6,7,10,.72);
    -webkit-backdrop-filter:blur(14px) saturate(145%);backdrop-filter:blur(14px) saturate(145%);
    color:#eef2f6;font:600 .78rem/1 var(--text);letter-spacing:.04em
  }
  .map-legend-toggle[aria-expanded="true"] span{transform:rotate(180deg)}
  .map-legend-toggle span{transition:transform .3s var(--ease)}
  .map-legend{display:none}
  .map-legend.open{
    display:flex;flex-direction:column;align-items:stretch;gap:.3rem;
    position:absolute;left:var(--pad-x);bottom:calc(100% + .5rem);z-index:9;
    padding:.55rem;border-radius:16px;border:1px solid rgba(255,255,255,.16);
    background:linear-gradient(160deg,rgba(18,19,24,.9),rgba(7,8,11,.86));
    -webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);
    box-shadow:0 18px 48px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.1);
    max-height:46svh;overflow-y:auto
  }
  .map-legend.open .leg{min-height:44px;justify-content:flex-start}
  .mf-left{position:relative}
}
