/* =====================================================================
   RECORDS · HALL OF FAME v5 — sous l'en-tête, sur pierre claire.
   Le premier record est un MONOLITHE noir posé sur la pierre : le chiffre gravé en géant (la
   seule touche de lime de la page : la valeur du premier), le portrait du détenteur, le soir
   où il est tombé ; un rocher et sa mousse débordent du socle. Les autres records sont des
   lignes réglées, les tournois joués une frise graduée, le film vit dans les lettres de la
   bande de nuit. Rien ici ne dépend d'une feuille d'origine.
   ===================================================================== */
.hf5,.hf5-frise,.hf5-suite{position:relative;color:#0a0a0a}
.hf5{overflow-x:clip;padding:clamp(40px,5vw,84px) 0 clamp(26px,3vw,44px)}
.hf5 .v5-rel,.hf5-frise .v5-rel,.hf5-suite .v5-rel{color:rgba(10,10,10,.62)}
.hf5 .v5-rel b,.hf5-frise .v5-rel b,.hf5-suite .v5-rel b{color:#0a0a0a}

/* ------------------------------------------------------------ le fil de section */
.hf5-fil{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0 0 clamp(20px,2.6vw,36px)}
.hf5-fil .v5-rel{font-size:10.5px;white-space:nowrap}
.hf5-fil__trait{flex:1;min-width:36px;height:1.5px;background:#0a0a0a;transform-origin:0 50%}

/* ------------------------------------------------------------ la plaque de verre clair
   Le monde 3D passe derrière la page : tout texte de lecture se pose sur un OBJET. Ici une
   dalle de verre dépoli (la roche et la mousse se devinent au travers), un angle franc. */
.hf5-verre{position:relative;isolation:isolate;padding:clamp(18px,2.4vw,34px) clamp(16px,2.4vw,36px) clamp(20px,2.6vw,38px);
  border-radius:clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px) 8px;
  background:linear-gradient(180deg,rgba(243,244,241,.9),rgba(226,228,224,.84));-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),inset 0 -2px 0 rgba(10,10,10,.06),0 0 0 1px rgba(10,10,10,.08),0 40px 60px -46px rgba(0,0,0,.5)}
.hf5-verre::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--v5-grain);filter:invert(1);opacity:.16;pointer-events:none}
.hf5-verre--b{border-radius:8px clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px)}
.hf5-verre--c{border-radius:clamp(22px,2.6vw,34px) 8px clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px)}
.hf5-verre > .hf5-fil:first-child{margin-bottom:clamp(14px,1.8vw,24px)}
.hf5 > .wrap > .hf5-fil{padding:9px 14px;border-radius:12px 12px 12px 4px;background:rgba(243,244,241,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 0 0 1px rgba(10,10,10,.08)}

/* ------------------------------------------------------------ le monolithe */
.hf5-mono{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,.68fr);
  min-height:clamp(430px,45vw,630px);border-radius:clamp(24px,2.8vw,38px) clamp(24px,2.8vw,38px) clamp(24px,2.8vw,38px) 8px;color:#f1f1ec;
  background:url("/static/players/roche.webp") center/520px,linear-gradient(168deg,#1b1b1b,#060606 62%);background-blend-mode:soft-light,normal;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.09),inset 0 1px 0 rgba(255,255,255,.14),0 0 0 6px rgba(10,10,10,.06),0 70px 90px -60px rgba(0,0,0,.8);
  transform:perspective(1600px) rotateX(calc(var(--rx,0deg)*.3)) rotateY(calc(var(--ry,0deg)*.3));transition:transform 320ms cubic-bezier(.2,.7,.2,1)}
.hf5-mono .v5-rel{color:rgba(241,241,236,.6)}
.hf5-mono .v5-rel b{color:#f1f1ec}
.hf5-mono__fant{position:absolute;inset:0;z-index:0;display:flex;align-items:flex-end;overflow:hidden;border-radius:inherit;pointer-events:none;
  font-size:clamp(90px,15.5vw,236px);line-height:.72;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(241,241,236,.1)}
.hf5-mono__g{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:18px;min-width:0;padding:clamp(20px,2.6vw,38px) clamp(20px,2.8vw,42px) clamp(14px,1.8vw,26px)}
.hf5-mono__cat{display:flex;align-items:baseline;gap:12px;margin:0;font-size:11px}
.hf5-mono__cat b{font-family:var(--f-chiffre);font-weight:800;font-size:26px;line-height:1;letter-spacing:.01em}
.hf5-mono__val{position:relative;align-self:flex-start;display:inline-block;margin-left:clamp(0px,6vw,92px);line-height:.74}
/* le réticule et la règle graduée : la couche de relevé posée sur le monolithe */
.hf5-mono__g::before{content:"";position:absolute;z-index:0;left:clamp(20px,2.8vw,42px);right:clamp(20px,2.8vw,42px);top:clamp(58px,5.4vw,84px);height:9px;pointer-events:none;
  background:linear-gradient(rgba(241,241,236,.34),rgba(241,241,236,.34)) 0 0/100% 1px no-repeat,repeating-linear-gradient(90deg,rgba(241,241,236,.34) 0 1px,transparent 1px 14px) 0 1px/100% 8px no-repeat}
.hf5-mono__g::after{content:"";position:absolute;z-index:0;right:6%;top:50%;width:min(62%,430px);aspect-ratio:1;border-radius:50%;pointer-events:none;transform:translateY(-38%);
  background:radial-gradient(circle,transparent 0 calc(50% - 1px),rgba(241,241,236,.16) calc(50% - 1px) 50%,transparent 50%) center/100% 100%,
    radial-gradient(circle,transparent 0 calc(50% - 1px),rgba(241,241,236,.1) calc(50% - 1px) 50%,transparent 50%) center/62% 62% no-repeat,
    linear-gradient(rgba(241,241,236,.14),rgba(241,241,236,.14)) center/100% 1px no-repeat,linear-gradient(rgba(241,241,236,.14),rgba(241,241,236,.14)) center/1px 100% no-repeat}
.hf5-mono__n,.hf5-mono__fil{display:block;font-family:var(--f-chiffre);font-weight:800;font-size:clamp(220px,36vw,530px);line-height:.74;letter-spacing:-.015em;font-variant-numeric:tabular-nums}
.hf5-mono--long .hf5-mono__n,.hf5-mono--long .hf5-mono__fil{font-size:clamp(96px,15vw,216px)}
.hf5-mono--long .hf5-mono__val{margin-left:0}
.hf5-mono__n{position:relative;z-index:1;color:var(--v5-lime)}
.hf5-mono__fil{position:absolute;left:.035em;top:.03em;z-index:4;color:transparent;-webkit-text-stroke:1.5px rgba(241,241,236,.55);pointer-events:none}
.hf5-mono__u{position:absolute;left:calc(100% + 16px);bottom:.9em;font-size:11px;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
.hf5-mono__d{position:relative;z-index:5;display:flex;flex-direction:column;gap:16px;min-width:0;padding:clamp(14px,1.6vw,22px);
  border-left:1px solid rgba(241,241,236,.13)}
.hf5-mono__por{position:relative;flex:1;display:grid;place-items:center;min-height:210px;overflow:hidden;border-radius:22px 22px 22px 6px;background:radial-gradient(90% 90% at 50% 20%,#232323,#0a0a0a);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.hf5-mono__por img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.14) brightness(.82);transform:scale(1.03);
  transition:filter 700ms var(--v5-masse),transform 900ms var(--v5-masse)}
.hf5-mono:hover .hf5-mono__por img{filter:none;transform:scale(1.08)}
.hf5-mono__por b{font-family:var(--f-mega);font-weight:900;font-stretch:125%;font-size:clamp(60px,8vw,120px);letter-spacing:-.05em;color:rgba(241,241,236,.9)}
/* le cadre de relevé : quatre équerres sur le portrait */
.hf5-mono__por::before,.hf5-mono__por::after{content:"";position:absolute;z-index:2;width:22px;height:22px;pointer-events:none;border:1.5px solid rgba(241,241,236,.8)}
.hf5-mono__por::before{left:12px;top:12px;border-right:0;border-bottom:0}
.hf5-mono__por::after{right:12px;bottom:12px;border-left:0;border-top:0}
.hf5-mono__det{display:grid;gap:5px;min-width:0;padding:0 4px 6px}
.hf5-mono__qui{font-family:var(--f-mega);font-weight:900;font-stretch:125%;font-size:clamp(24px,2.7vw,40px);line-height:.94;letter-spacing:-.045em;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hf5-mono__qui a{color:inherit;text-decoration:none}
.hf5-mono__x1{right:calc(34% + 14px);top:22px}
.hf5-mono__x2{left:clamp(20px,2.8vw,42px);bottom:22px}
.hf5-mono__roche,.hf5-mono__mousse{position:absolute;height:auto;pointer-events:none;will-change:transform;transform:translate3d(0,var(--fy,0px),0) rotate(var(--rot,0deg))}
.hf5-mono__roche{z-index:3;left:-5.5%;bottom:-17%;width:clamp(170px,23vw,330px);--rot:-12deg;filter:drop-shadow(0 30px 26px rgba(0,0,0,.45))}
.hf5-mono__mousse{z-index:3;left:8%;bottom:-11%;width:clamp(90px,11vw,170px);--rot:8deg}

/* le soir du record : date en chiffres, tournoi, manche */
.hf5-soir{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;min-width:0;margin-top:4px}
.hf5-soir b{font-family:var(--f-chiffre);font-weight:800;font-size:21px;line-height:1;letter-spacing:.01em}
.hf5-soir a,.hf5-soir i{font-family:var(--f-mono);font-weight:600;font-style:normal;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:inherit;opacity:.66;text-decoration:none}
.hf5-soir a:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}

/* ------------------------------------------------------------ les autres records : lignes réglées */
.hf5 .hf5-verre{margin-top:clamp(64px,7.4vw,112px)}
.hf5-lignes{list-style:none;margin:0;padding:0;border-bottom:1.5px solid #0a0a0a}
.hf5-l{position:relative;isolation:isolate;display:grid;grid-template-columns:clamp(96px,11vw,150px) minmax(0,1.25fr) minmax(0,1fr) auto;align-items:center;
  gap:clamp(14px,2vw,30px);padding:clamp(18px,2.1vw,30px) clamp(8px,1.2vw,18px);border-top:1.5px solid #0a0a0a;color:#0a0a0a;transition:color 420ms var(--v5-masse)}
.hf5-l::before{content:"";position:absolute;inset:0;z-index:-1;background:#0a0a0a;transform:scaleY(0);transform-origin:50% 100%;transition:transform 520ms var(--v5-masse)}
.hf5-l:hover{color:#f1f1ec}
.hf5-l:hover::before{transform:scaleY(1)}
.hf5-l .v5-rel{transition:color 420ms var(--v5-masse)}
.hf5-l:hover .v5-rel{color:rgba(241,241,236,.62)}
.hf5-l__rang{font-family:var(--f-chiffre);font-weight:800;font-size:clamp(64px,8vw,112px);line-height:.8;color:transparent;-webkit-text-stroke:1.5px currentColor;
  -webkit-text-stroke-color:#0a0a0a;transition:-webkit-text-stroke-color 420ms var(--v5-masse)}
.hf5-l:hover .hf5-l__rang{-webkit-text-stroke-color:#f1f1ec}
.hf5-l__c{display:grid;gap:4px;min-width:0}
.hf5-l__cat{font-family:var(--f-display);font-weight:700;font-size:clamp(17px,1.9vw,26px);line-height:1.04;letter-spacing:-.02em;text-transform:uppercase}
.hf5-l__h{display:flex;align-items:center;gap:14px;min-width:0}
.hf5-l__por{position:relative;flex:none;display:grid;place-items:center;width:58px;height:58px;overflow:hidden;border-radius:15px 15px 15px 4px;color:#f1f1ec;background:#0a0a0a;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.hf5-l__por img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1);transition:filter 500ms var(--v5-masse)}
.hf5-l:hover .hf5-l__por img{filter:none}
.hf5-l__por b{font-family:var(--f-display);font-weight:760;font-size:19px;letter-spacing:-.02em}
.hf5-l__hb{display:grid;gap:2px;min-width:0}
.hf5-l__qui{font-family:var(--f-display);font-weight:700;font-size:clamp(16px,1.6vw,21px);line-height:1.05;letter-spacing:-.02em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hf5-l__qui a{color:inherit;text-decoration:none}
.hf5-l__v{display:flex;align-items:baseline;gap:10px;justify-content:flex-end;text-align:right}
.hf5-l__v b{font-family:var(--f-chiffre);font-weight:800;font-size:clamp(58px,7.2vw,108px);line-height:.8;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.hf5-l__v i{font-style:normal}

/* ------------------------------------------------------------ état vide */
.hf5-vide{display:grid;justify-items:start;gap:16px;max-width:760px;padding:clamp(22px,3vw,40px) 0;border-top:1.5px solid #0a0a0a;border-bottom:1.5px solid #0a0a0a}
.hf5-vide p{margin:0;font-family:var(--f-display);font-weight:500;font-size:clamp(18px,2vw,26px);line-height:1.28;letter-spacing:-.015em;color:#0a0a0a}

/* ------------------------------------------------------------ la frise : une règle graduée, un cran par tournoi joué */
.hf5-frise{padding:clamp(34px,4.6vw,76px) 0 clamp(20px,2.4vw,36px)}
.hf5-rail{list-style:none;margin:0;padding:0 0 14px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(248px,1fr);overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#0a0a0a transparent}
.hf5-rail:focus-visible{outline:2px solid #0a0a0a;outline-offset:6px}
.hf5-cran{scroll-snap-align:start;min-width:0}
.hf5-cran a{display:grid;align-content:start;gap:8px;height:100%;padding:0 clamp(16px,2vw,28px) 6px 0;color:#0a0a0a;text-decoration:none}
.hf5-cran__date{display:flex;align-items:baseline;font-family:var(--f-chiffre);font-weight:800;line-height:.8;transition:transform 520ms var(--v5-masse)}
.hf5-cran__date b{font-size:clamp(72px,7.4vw,108px);letter-spacing:-.01em}
.hf5-cran__date i{font-style:normal;font-size:clamp(28px,2.8vw,40px);opacity:.42}
.hf5-cran a:hover .hf5-cran__date{transform:translate3d(0,-6px,0)}
/* la règle : un trait plein, ses graduations, et le cran du tournoi */
.hf5-cran__noeud{position:relative;display:block;height:19px;margin:8px 0 6px;
  background:linear-gradient(#0a0a0a,#0a0a0a) 0 0/100% 1.5px no-repeat,repeating-linear-gradient(90deg,rgba(10,10,10,.5) 0 1px,transparent 1px 12px) 0 1.5px/100% 7px no-repeat}
.hf5-cran__noeud::before{content:"";position:absolute;left:0;top:-5px;width:12px;height:12px;border-radius:3px 3px 3px 0;background:#0a0a0a;
  transition:background 300ms var(--v5-masse),transform 520ms var(--v5-masse)}
.hf5-cran a:hover .hf5-cran__noeud::before,.hf5-cran a:focus-visible .hf5-cran__noeud::before{background:var(--v5-lime);box-shadow:0 0 0 1.5px #0a0a0a;transform:scale(1.25)}
.hf5-cran__nom{font-family:var(--f-display);font-weight:700;font-size:clamp(17px,1.7vw,22px);line-height:1.04;letter-spacing:-.02em;text-transform:uppercase}
.hf5-cran__l{display:grid;gap:1px;min-width:0;margin-top:4px}
.hf5-cran__l b{font-family:var(--f-display);font-weight:700;font-size:15px;line-height:1.2;letter-spacing:-.015em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hf5-cran__l em{font-family:var(--f-chiffre);font-style:normal;font-weight:800;font-size:22px;line-height:.8;margin-left:4px}

/* ------------------------------------------------------------ la bande de nuit : le film n'existe que dans les lettres */
.hf5-nuit{display:grid;align-items:end}
.hf5-nuit__piece{position:absolute;inset:0;z-index:0;overflow:hidden;border-radius:inherit}
.hf5-nuit__film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(1.5)}
.hf5-nuit__piece::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(232,233,228,.34);pointer-events:none}
.hf5-nuit__pochoir{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-start;gap:clamp(4px,.8vw,12px);padding:clamp(26px,3.4vw,54px) clamp(14px,2vw,32px) 0;
  color:#fff;background:#050505;mix-blend-mode:multiply;z-index:2}
.hf5-nuit__ligne{width:60%}
.hf5-nuit__ligne--b{margin-left:auto;text-align:right}
.hf5-nuit__ligne .v5-mega{font-size:19vw;line-height:.8;white-space:nowrap}
.hf5-nuit__ligne .v5-mega > span{display:inline-block}
.hf5-nuit__piece::after{content:"";position:absolute;inset:0;z-index:3;background:var(--v5-grain);opacity:.1;mix-blend-mode:overlay;pointer-events:none}
.hf5-nuit__in{position:relative;z-index:1;width:100%;padding-top:clamp(250px,33.5vw,500px);padding-bottom:clamp(22px,3vw,44px)}
.hf5-nuit__k{margin:0 0 14px;font-size:10.5px}
.hf5-nuit__t{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hf5-nuit__txt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(18px,2.4vw,36px);border-top:1px solid rgba(241,241,236,.22)}
.hf5-nuit__txt p{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;margin:0;padding:18px 0 0;
  font-family:var(--f-ui);font-size:clamp(15px,1.3vw,18px);line-height:1.45;color:rgba(241,241,236,.72)}
.hf5-nuit__txt i{font-family:var(--f-chiffre);font-style:normal;font-weight:800;font-size:30px;line-height:.9;color:rgba(241,241,236,.4)}
.hf5-nuit__txt strong{font-weight:650;color:#fff}

/* ------------------------------------------------------------ poursuivre : trois lignes qui se retournent */
.hf5-suite{padding:clamp(34px,4.6vw,76px) 0 clamp(40px,5vw,80px)}
.hf5-menu{border-bottom:1.5px solid #0a0a0a}
.hf5-menu__l{position:relative;isolation:isolate;display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:clamp(12px,2vw,28px);
  padding:clamp(14px,1.6vw,22px) clamp(8px,1.2vw,18px);border-top:1.5px solid #0a0a0a;color:#0a0a0a;text-decoration:none;transition:color 420ms var(--v5-masse)}
.hf5-menu__l::before{content:"";position:absolute;inset:0;z-index:-1;background:#0a0a0a;transform:scaleY(0);transform-origin:50% 100%;transition:transform 520ms var(--v5-masse)}
.hf5-menu__l:hover,.hf5-menu__l:focus-visible{color:#f1f1ec}
.hf5-menu__l:hover::before,.hf5-menu__l:focus-visible::before{transform:scaleY(1)}
.hf5-menu__n{font-family:var(--f-chiffre);font-weight:800;font-size:26px;line-height:1;opacity:.5}
.hf5-menu__nom{font-family:var(--f-display);font-weight:600;font-size:clamp(26px,3.6vw,54px);line-height:.98;letter-spacing:-.025em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:transform 520ms var(--v5-masse)}
.hf5-menu__l:hover .hf5-menu__nom{transform:translate3d(14px,0,0)}
.hf5-menu .v5-rond{background:#0a0a0a;color:#f1f1ec}
.hf5-menu__l:hover .v5-rond,.hf5-menu__l:focus-visible .v5-rond{background:var(--v5-lime);color:#0a0a0a}

/* ------------------------------------------------------------ téléphone */
@media (max-width:860px){
  .hf5-mono{grid-template-columns:1fr;min-height:0}
  .hf5-mono__g{padding-bottom:6px}
  .hf5-mono__g::before,.hf5-mono__fant,.hf5-mono__mousse{display:none}
  .hf5-mono__cat{padding-right:30%}
  .hf5-mono__val{margin:12px 0 0}
  .hf5-mono__n,.hf5-mono__fil{font-size:clamp(170px,56vw,300px)}
  .hf5-mono__d{flex-direction:row;align-items:flex-end;border-left:0;border-top:1px solid rgba(241,241,236,.13);padding:14px}
  .hf5-mono__por{flex:none;width:112px;height:132px;min-height:0;border-radius:18px 18px 18px 5px}
  .hf5-mono__por b{font-size:44px}
  .hf5-mono__det{flex:1}
  .hf5-mono__x1{right:18px;top:20px}
  .hf5-mono__x2{display:none}
  .hf5-mono__roche{left:auto;right:-9%;bottom:auto;top:-11%;width:36vw;--rot:14deg}
  .hf5 .hf5-verre{margin-top:26px}
  .hf5-l{grid-template-columns:auto minmax(0,1fr);row-gap:12px}
  .hf5-l__v{grid-column:2;grid-row:1}
  .hf5-l__c,.hf5-l__h{grid-column:1 / -1}
  .hf5-rail{grid-auto-columns:74vw}
  .hf5-nuit__ligne{width:86%}
  .hf5-nuit__in{padding-top:clamp(230px,62vw,360px)}
  .hf5-nuit__txt{grid-template-columns:1fr;border-top:0}
  .hf5-nuit__txt p{border-top:1px solid rgba(241,241,236,.22);padding:14px 0}
  .hf5-menu__l{grid-template-columns:34px minmax(0,1fr) auto}
  .hf5-menu__nom{font-size:clamp(21px,6.2vw,34px);white-space:normal;overflow:visible}
}
/* ------------------------------------------------------------ mouvement
   Au survol du monolithe, le filet du chiffre saute en tranches de parasites puis se recale. */
@keyframes hf5-parasite{
  0%{clip-path:inset(12% 0 70% 0);transform:translateX(-16px)}
  20%{clip-path:inset(58% 0 22% 0);transform:translateX(12px)}
  40%{clip-path:inset(34% 0 50% 0);transform:translateX(-8px)}
  60%{clip-path:inset(80% 0 6% 0);transform:translateX(14px)}
  80%{clip-path:inset(4% 0 86% 0);transform:translateX(-10px)}
  100%{clip-path:inset(0);transform:none}}
.hf5-mono:hover .hf5-mono__fil{animation:hf5-parasite 460ms steps(1) 1}
@media (prefers-reduced-motion:reduce){
  .hf5-mono,.hf5-menu__nom,.hf5-cran__date{transition:none;transform:none}
  .hf5-mono:hover .hf5-mono__fil{animation:none}
}

/* contraste (audit du 07/10/2026) : le mois des dates du palmarès, 2,8:1 pour un grand chiffre (3:1 demandé) */
.hf5-cran__date i{opacity:.56}