/* ============================================================================
   SKLD · ONGLETS PAR ANCRES (.t5-ong) — page d'un tournoi.

   Chaque onglet est un lien vers l'id de son panneau : l'onglet TIENT DANS L'URL.
   Sans script, la feuille choisit le panneau avec :target (le panneau visé, ou celui
   qui contient la cible ; à défaut, .t5-pan--defaut). Avec skld-tabs.js, la racine
   reçoit .is-js et ce sont les classes .is-actif / .is-on qui décident (un
   history.replaceState ne met pas :target à jour).
   Un navigateur sans :has() montre tous les panneaux à la suite : rien n'est caché.
   ========================================================================= */
.t5-ong{position:relative;margin-top:clamp(26px,3.4vw,52px)}
.t5-ong__colle{position:sticky;top:76px;z-index:30;pointer-events:none}
.t5-ong__barre{pointer-events:auto;display:flex;gap:4px;width:max-content;max-width:100%;padding:6px;overflow-x:auto;scrollbar-width:none;border-radius:20px 20px 20px 7px;
  background:rgba(10,10,10,.93);-webkit-backdrop-filter:blur(20px) saturate(1.3);backdrop-filter:blur(20px) saturate(1.3);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.09),inset 0 1px 0 rgba(255,255,255,.12),0 22px 44px -24px rgba(0,0,0,.7)}
.t5-ong__barre::-webkit-scrollbar{display:none}
.t5p .t5-ong__barre a{position:relative;display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 18px;border-radius:14px 14px 14px 5px;flex:none;
  font-family:var(--f-ui);font-size:14.5px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;text-decoration:none;color:rgba(241,241,236,.62);
  transition:color 240ms var(--v5-masse),background 240ms var(--v5-masse)}
.t5p .t5-ong__barre a:hover{color:#f1f1ec}
.t5-ong__barre a b{font-family:var(--f-chiffre);font-weight:800;font-size:17px;line-height:1;opacity:.7}
.t5-ong__barre a:focus-visible{outline:2px solid #f1f1ec;outline-offset:-3px}
.t5-pan{display:none;padding-top:clamp(26px,3.2vw,46px);scroll-margin-top:136px}
.t5-pan :target,.t5-pan [id]{scroll-margin-top:150px}
/* sans script : l'ancre choisit le panneau (le panneau lui-même, ou celui qui contient la cible) */
.t5-pan:target,.t5-pan:has(:target){display:block}
.t5-ong:not(:has(.t5-pan:target,.t5-pan :target)) .t5-pan--defaut{display:block}
.t5p .t5-ong:not(.is-js):not(:has(.t5-pan:target,.t5-pan :target)) .t5-ong__barre a[href="#apercu"],
.t5p .t5-ong:not(.is-js):has(#apercu:target,#apercu :target) .t5-ong__barre a[href="#apercu"],
.t5p .t5-ong:not(.is-js):has(#classement:target,#classement :target) .t5-ong__barre a[href="#classement"],
.t5p .t5-ong:not(.is-js):has(#equipes:target,#equipes :target) .t5-ong__barre a[href="#equipes"],
.t5p .t5-ong:not(.is-js):has(#regles:target,#regles :target) .t5-ong__barre a[href="#regles"],
.t5p .t5-ong:not(.is-js):has(#staff:target,#staff :target) .t5-ong__barre a[href="#staff"],
.t5p .t5-ong.is-js .t5-ong__barre a.is-on{color:#060606;background:linear-gradient(180deg,#fff,#dedfd9);box-shadow:inset 0 -2px 0 rgba(0,0,0,.14)}
/* avec script : les classes décident (history.replaceState ne met pas :target à jour) */
.t5-ong.is-js .t5-pan,.t5-ong.is-js .t5-pan:target,.t5-ong.is-js .t5-pan:has(:target){display:none}
.t5-ong.is-js .t5-pan.is-actif{display:block;animation:t5-pan 520ms var(--v5-sortie) both}
@keyframes t5-pan{from{opacity:0;transform:translate3d(0,14px,0);filter:blur(6px)}}
@supports not selector(:has(a)){
  .t5-ong:not(.is-js) .t5-pan{display:block}
}