/* La barre de l'instrument : fixe en bas, la page défile normalement derrière.
   Elle ne s'imprime pas, et n'existe pas tant que le script ne l'a pas remplie. */
.instrument {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 10;
  background: var(--fond-zone);
  border-top: 1px solid var(--trait);
  padding: 0.6rem 1.25rem 0.7rem;
}

/* La page se réserve la hauteur de la barre, sinon le dernier article passe
   dessous et devient illisible. */
body.a-instrument { padding-bottom: 6.5rem; }

/* Résidu 2 : l'état du marquage (« Révision du … » / « Texte inchangé
   depuis le … ») n'est plus dans le <h1> ni dans la citation — le serveur ne
   l'y met jamais. C'est une ligne d'info à part, insérée juste après le
   <h1> par instrument.js (mettreAJourEtatMarquage), au même titre discret
   que la mention d'abrogation d'un article. */
.instrument-etat { color: var(--sourdine); font-size: 0.95rem; margin: -0.5rem 0 1.5rem; }

.instrument-ruban { position: relative; height: 22px; max-width: 60rem; margin: 0 auto 0.3rem; }
.instrument-ruban .axe { position: absolute; left: 0; right: 0; top: 10px; height: 1px; background: var(--trait); }
/* Pas de jeton « trait renforcé » dans style.css : le seul trait disponible
   sert donc aussi aux jalons, distingués de l'axe par la taille plutôt que
   par une couleur qui n'existe pas encore. */
.instrument-ruban i { position: absolute; top: 5px; width: 1px; height: 8px; background: var(--trait); }
.instrument-ruban i.change { top: 2px; height: 14px; width: 2px; background: var(--patine); }
.instrument-ruban i.change.coordonnee { background: var(--bronze); }
.instrument-ruban i.ici { top: 0; height: 18px; width: 2px; background: var(--encre); }

.instrument-piste { display: flex; align-items: center; gap: 0.8rem; max-width: 60rem; margin: 0 auto; }
.instrument-piste input[type="range"] { flex: 1 1 auto; }
.instrument-piste button {
  font-family: var(--police-lecture); font-size: 0.9rem;
  color: var(--sourdine); background: var(--fond-champ);
  border: 1px solid var(--trait); border-radius: 0;
  width: 2.2rem; height: 2.2rem; cursor: pointer;
}
.instrument-piste button:disabled { opacity: .35; cursor: default; }

@media print {
  .instrument { display: none; }
  body.a-instrument { padding-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .instrument * { transition: none !important; animation: none !important; }
}