/* UpTrainer · correctif 05 (01/10/2026) · bouton « remonter en haut », option A choisie par Steeve (« Moi je ferai l'option A »).
   Feuille séparée, chargée après les feuilles existantes. Toutes les règles sont sous .upt-rh : aucune autre règle de la page n'est
   touchée. Un rond de verre en bas à droite (40 px au téléphone, 44 px à l'ordinateur), une flèche « jusqu'en haut », un fin anneau
   rouge qui se remplit avec la page. Source du design : ~/Claude/business/remonter-design/src/remonter.css (option A). */
.upt-rh{position:fixed;z-index:94;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));
  box-sizing:border-box;display:grid;place-items:center;width:40px;height:40px;min-width:0;min-height:0;margin:0;padding:0;border:0;
  border-radius:50%;color:#f7f4f2;cursor:pointer;font:inherit;line-height:1;text-transform:none;letter-spacing:0;
  -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
  background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.035)),rgba(12,12,14,.58);
  -webkit-backdrop-filter:blur(14px) saturate(180%);backdrop-filter:blur(14px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.08),
    0 2px 4px rgba(0,0,0,.3),0 10px 24px -10px rgba(0,0,0,.75);
  visibility:hidden;opacity:0;pointer-events:none;transform:translateY(12px) scale(.86);
  transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1),visibility 0s linear .45s}
.upt-rh.on{visibility:visible;opacity:1;pointer-events:auto;transform:none;
  transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1),visibility 0s}
.upt-rh.on:active{transform:scale(.94)}
.upt-rh:focus{outline:none}
.upt-rh:focus-visible{outline:2px solid #f9293e;outline-offset:3px}
.upt-rh .upt-rh-ico{position:relative;z-index:1;display:block;width:16px;height:16px;transition:transform .32s cubic-bezier(.22,1,.36,1)}
/* l'anneau d'avancée : un trait rouge de 2 px sur le bord du rond */
.upt-rh .upt-rh-anneau{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none;overflow:visible}
.upt-rh .upt-rh-anneau circle{fill:none;stroke-width:2}
.upt-rh .upt-rh-piste{stroke:rgba(255,255,255,.07)}
.upt-rh .upt-rh-fait{stroke:#f9293e;stroke-linecap:round}
/* la bulle « Tout en haut » (ordinateur, au survol et au clavier) */
.upt-rh::after{content:attr(data-bulle);position:absolute;z-index:2;right:calc(100% + 10px);top:50%;white-space:nowrap;pointer-events:none;
  opacity:0;transform:translate(6px,-50%);padding:7px 11px;border-radius:999px;
  font:500 12.5px/1 var(--font,"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif);letter-spacing:.01em;color:rgba(247,244,242,.74);
  background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.03)),rgba(12,12,14,.72);
  -webkit-backdrop-filter:blur(14px) saturate(170%);backdrop-filter:blur(14px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.07),0 10px 24px -10px rgba(0,0,0,.8);
  transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .32s cubic-bezier(.22,1,.36,1)}
@media (hover:none),(pointer:coarse){.upt-rh::after{display:none}}
/* ordinateur : un peu plus grand, à 24 px des bords (pas collé à la barre de défilement) ; discret au repos (56 %), net quand on
   remonte, au survol et au clavier */
@media (hover:hover) and (pointer:fine){
  .upt-rh{width:44px;height:44px;right:24px;bottom:24px}
  .upt-rh .upt-rh-ico{width:17px;height:17px}
  .upt-rh.on{opacity:.56}
  .upt-rh.on.vif,.upt-rh.on:hover,.upt-rh.on:focus-visible{opacity:1}
  .upt-rh.on:hover{transform:translateY(-2px);background:linear-gradient(180deg,rgba(255,255,255,.19),rgba(255,255,255,.05)),rgba(14,14,16,.62)}
  .upt-rh.on:hover .upt-rh-ico{transform:translateY(-1px)}
  .upt-rh.on:hover::after,.upt-rh.on:focus-visible::after{opacity:1;transform:translate(0,-50%)}
}
/* le titre du haut, qui reçoit le focus après une remontée au clavier */
.upt-rh-cible:focus{outline:none}
/* mouvement réduit : il paraît et disparaît en fondu, sans bouger */
@media (prefers-reduced-motion:reduce){
  .upt-rh,.upt-rh.on{transform:none!important}
  .upt-rh .upt-rh-ico,.upt-rh::after{transition:none}
}
