/* 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}
body[data-page="track-record"] .map-scroll-hint{display:flex;align-items:center;gap:.5rem;min-height:42px;padding:.48rem .72rem;border:1px solid rgba(255,255,255,.15);border-radius:999px;background:rgba(5,7,10,.72);color:#e2e4e8;font:600 .65rem/1.25 var(--text);letter-spacing:.025em;cursor:pointer;backdrop-filter:blur(12px);transition:.25s var(--ease)}
body[data-page="track-record"] .map-scroll-hint>span{width:8px;height:8px;border-radius:50%;background:#9da1aa;box-shadow:0 0 0 4px rgba(157,161,170,.1)}
body[data-page="track-record"] .map-scroll-hint:hover,body[data-page="track-record"] .map-scroll-hint:focus-visible{border-color:rgba(255,213,98,.55);color:#fff}
body[data-page="track-record"] .wheel-zoom-active .map-scroll-hint{border-color:rgba(255,213,98,.58);background:rgba(255,213,98,.13);color:#fff}
body[data-page="track-record"] .wheel-zoom-active .map-scroll-hint>span{background:var(--gold);box-shadow:0 0 0 5px rgba(255,213,98,.16),0 0 16px rgba(255,213,98,.6)}
body[data-page="track-record"] .wheel-zoom-active #glmap{cursor:zoom-in}
/* 1.8.3 — Ordinateur : consigne passive façon 1.0 à la place du bouton d'armement,
   et curseur de carte standard (le zoom molette est permanent, pas un mode). */
body[data-page="track-record"] .map-wheel-hint{color:var(--grey);font-size:.85rem;font-weight:300;letter-spacing:.01em;white-space:nowrap;pointer-events:none}
body[data-page="track-record"] .map-wheel-hint b{color:var(--gold);font-weight:600}
@media(hover:hover) and (pointer:fine){
  body[data-page="track-record"] .wheel-zoom-active #glmap{cursor:auto}
}
body[data-page="track-record"] #projets{scroll-margin-top:5rem}
body[data-page="track-record"] .map-tool-btn{
  min-height:34px;padding:.48rem 1rem;border:0;border-radius:30px;background:transparent;color:var(--grey);
  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,
body[data-page="track-record"] .dd-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,
body[data-page="track-record"] .deal-drawer{scrollbar-gutter:stable}
/* En mode focus cartographique, les fiches doivent passer au-dessus de la carte. */
body[data-page="track-record"] .dd-back{z-index:1619}
body[data-page="track-record"] .deal-drawer{z-index:1620}
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-scroll-hint{font-size:.61rem}
}
@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-scroll-hint{max-width:12.5rem;text-align:left}
}
@media(prefers-reduced-motion:reduce){body[data-page="track-record"] .map-live-status span{animation:none}}

/* ================= 1.8.2 ================= */
/* Tactile : tant que la carte n'est pas activée, le doigt fait défiler la page.
   En mode armé ou en plein écran, la carte reprend tous les gestes. */
@media(pointer:coarse){
  .map-stage:not(.wheel-zoom-active):not(.is-expanded) .maplibregl-canvas,
  .map-stage:not(.wheel-zoom-active):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}}