/* Préloader tracteur — palette : sol #4a3322, sillons #7a5535, ciel #e3ece6, texte #3b2a1d */
html.tp-lock{overflow:hidden}
.tp-overlay{position:fixed;inset:0;z-index:999999;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(#e3ece6 0,#e3ece6 55%,#d3e0d4 100%);color:#3b2a1d;overflow:hidden;
  opacity:1;visibility:visible;transition:opacity .5s ease .75s,visibility 0s linear 1.25s}
.tp-overlay.tp-done{opacity:0;visibility:hidden}
.tp-overlay.tp-gone{display:none}

.tp-scene{width:100%;display:flex;flex-direction:column;align-items:center}
.tp-tractor{position:relative;z-index:2;width:min(541px,82vw);margin-bottom:-5px;
  transition:transform .9s cubic-bezier(.55,0,.85,.5)}
.tp-done .tp-tractor{transform:translateX(120vw)}
.tp-tractor img{display:block;width:100%;height:auto;transform-origin:50% 100%;
  animation:tp-bob .14s ease-in-out infinite alternate}
@keyframes tp-bob{from{transform:translateY(0) rotate(0)}to{transform:translateY(-1.6px) rotate(-.18deg)}}

/* fumée d'échappement (au-dessus du tuyau) */
.tp-puff{position:absolute;left:73.5%;top:3%;width:2.6%;aspect-ratio:1;border-radius:50%;
  background:rgba(70,78,72,.55);opacity:0;animation:tp-puff 1.3s ease-out infinite}
.tp-puff:nth-of-type(2){animation-delay:.43s}
.tp-puff:nth-of-type(3){animation-delay:.86s}
@keyframes tp-puff{0%{opacity:.7;transform:translate(0,0) scale(.6)}
  100%{opacity:0;transform:translate(-210%,-420%) scale(3.2)}}

/* poussière derrière les disques */
.tp-dust{position:absolute;left:12%;bottom:3%;width:3.4%;aspect-ratio:1;border-radius:50%;
  background:#7a5535;opacity:0;animation:tp-dust .9s ease-out infinite}
.tp-dust:nth-of-type(5){animation-delay:.3s;left:15%}
.tp-dust:nth-of-type(6){animation-delay:.6s;left:9%}
@keyframes tp-dust{0%{opacity:.8;transform:translate(0,0) scale(.5)}
  100%{opacity:0;transform:translate(-260%,-170%) scale(1.8)}}

/* sol : mottes + cailloux qui défilent vers la gauche */
.tp-ground{position:relative;z-index:1;width:100%;height:64px;background-color:#4a3322;
  background-image:
    radial-gradient(3px 2px at 20px 22px,#2f2015 0 98%,transparent),
    radial-gradient(4px 3px at 78px 40px,#6a4a30 0 98%,transparent),
    radial-gradient(3px 2px at 112px 16px,#2f2015 0 98%,transparent);
  background-size:132px 64px;animation:tp-scroll-l .9s linear infinite}
.tp-ground::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:12px;
  background:radial-gradient(24px 12px at 50% 100%,#7a5535 0 98%,transparent) 0 0/48px 12px repeat-x;
  animation:tp-scroll-m .36s linear infinite}
@keyframes tp-scroll-l{to{background-position-x:-132px}}
@keyframes tp-scroll-m{to{background-position-x:-48px}}

.tp-counter{margin-top:26px;text-align:center;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
.tp-pct{display:block;font-size:2.4rem;font-weight:800;line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.tp-label{display:block;margin-top:6px;font-size:.95rem;font-weight:500;opacity:.75}

@media (prefers-reduced-motion:reduce){
  .tp-tractor img,.tp-ground,.tp-ground::before,.tp-puff,.tp-dust{animation:none}
  .tp-puff,.tp-dust{display:none}
  .tp-done .tp-tractor{transform:none}
}