/* T414b (03/11/2026) — page « Classement » complète (#/classement/<code>), parité StandingsRow / ClassementDeLaRencontreView.
   DA « Le Point » : aucune couleur vive (le rouge ne dit que le direct), rang au CHIFFRE, zones en niveaux de gris,
   chiffres en Chivo Mono tabulaire, noms en Chivo casse normale, filet 1 px, rayon 5, aucune ombre. */
.contenu > .cl-page { grid-column:1/-1; min-width:0; }
.cl-page { display:grid; gap:8px; min-width:0; }
.cl-tete { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 12px; }
.cl-tete .cl-titre { margin:0; }
.cl-lien-competition { color:var(--secondaire); font-size:12.5px; text-decoration:underline; text-underline-offset:3px; border-radius:5px; padding:4px 2px; }
.cl-lien-competition:active { background:var(--voile); }

.cl-choix { display:inline-grid; grid-auto-flow:column; justify-self:start; border:1px solid var(--filet); border-radius:5px; overflow:hidden; background:var(--bloc); }
.cl-choix-lien { min-height:36px; display:flex; align-items:center; padding:0 14px; color:var(--texte); text-decoration:none; font-size:13px; transition:background-color 140ms ease; }
.cl-choix-lien + .cl-choix-lien { border-left:1px solid var(--filet); }
.cl-choix-actif { background:var(--inverse-fond); color:var(--inverse-texte); font-weight:700; }
.cl-choix-lien:active { background:var(--voile); }

.cl-classement { min-width:0; padding:12px; background:var(--bloc); border:1px solid var(--filet); border-radius:5px; display:grid; gap:4px; }
.cl-saison { margin:0; color:var(--secondaire); font-size:11px; font-variant-numeric:tabular-nums; }
.cl-etat-titre { margin:0; font-weight:700; }
.cl-vide { margin:0; color:var(--secondaire); }
.cl-lecteur { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* Titre de groupe (poule, conférence) : un NOM, casse normale, sans aplat, un filet au-dessus (TitreDeGroupeDeClassement). */
.cl-groupe { min-width:0; }
.cl-groupe + .cl-groupe { margin-top:8px; border-top:1px solid var(--filet); }
.cl-groupe-titre { margin:0; padding:10px 0 4px; font-size:12.5px; font-weight:700; letter-spacing:-.01em; color:var(--texte); }

/* Au téléphone : la table défile dans son cadre (horizontal ET vertical), l'en-tête reste collé en haut,
   le rang et le nom restent collés à gauche. */
.cl-defile { overflow:auto; max-height:max(320px, calc(100dvh - 190px)); overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; border-radius:5px; }
.cl-defile:focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
.cl-table { width:100%; border-collapse:separate; border-spacing:0; font-size:14px; }
.cl-table th,.cl-table td { padding:0 6px; height:44px; border-bottom:1px solid var(--filet); text-align:right; white-space:nowrap; background:var(--bloc); }
.cl-table tbody tr:last-child > * { border-bottom:0; }
.cl-table thead th { position:sticky; top:0; z-index:2; height:32px; color:var(--secondaire); font-size:11px; font-weight:400; font-family:"Chivo Mono",ui-monospace,monospace; text-transform:uppercase; }
.cl-table thead th.cl-nom-cellule { font-family:Chivo,system-ui,sans-serif; text-transform:none; font-size:12px; }
.cl-table abbr { text-decoration:none; cursor:help; }
.cl-table { --cl-largeur-rang:40px; }
.cl-table .cl-rang { position:sticky; left:0; z-index:1; box-sizing:border-box; width:var(--cl-largeur-rang); min-width:var(--cl-largeur-rang); max-width:var(--cl-largeur-rang); padding-right:8px; }
.cl-table .cl-nom-cellule { position:sticky; left:var(--cl-largeur-rang); z-index:1; text-align:left; font-weight:400; width:100%; max-width:15em; }
.cl-table thead .cl-rang,.cl-table thead .cl-nom-cellule { z-index:3; }
td.cl-rang { font-family:Chivo,system-ui,sans-serif; font-weight:900; font-size:17px; color:var(--secondaire); font-variant-numeric:tabular-nums; }
td.cl-rang-tete { color:var(--texte); }
.cl-participant { display:flex; align-items:center; gap:8px; min-height:44px; color:var(--texte); text-decoration:none; min-width:0; }
.cl-logo { width:20px; height:20px; object-fit:contain; flex:none; }
.cl-noms { display:grid; min-width:0; }
.cl-nom { overflow:hidden; text-overflow:ellipsis; font-weight:700; font-size:15px; }
.cl-nom-court { display:none; }
.cl-ecurie { overflow:hidden; text-overflow:ellipsis; color:var(--secondaire); font-size:11px; }
.cl-chiffre { font-family:"Chivo Mono",ui-monospace,monospace; font-variant-numeric:tabular-nums; color:var(--secondaire); font-size:13px; min-width:2.2em; }
td.cl-fort { color:var(--texte); font-weight:700; font-size:14px; }

/* Ligne touchable : tout appui se voit (voile gris, jamais de rouge, ≤ 200 ms). */
.cl-ligne[data-href] { cursor:pointer; }
.cl-ligne > * { transition:background-color 140ms ease; }
.cl-ligne:active > *,.cl-ligne:has(.cl-participant:active) > * { background:color-mix(in srgb, var(--texte) 9%, var(--bloc)); }
@media (hover:hover) { .cl-ligne[data-href]:hover > * { background:color-mix(in srgb, var(--texte) 4%, var(--bloc)); } }
.cl-participant:focus-visible { outline:2px solid var(--focus); outline-offset:-2px; border-radius:5px; }

/* Équipe suivie : gras partout et lavis gris (le lavis de ClassementDeLaRencontreView, opacité 0,07). */
.cl-suivie > * { background:color-mix(in srgb, var(--texte) 7%, var(--bloc)); }
.cl-suivie .cl-nom,.cl-suivie td.cl-chiffre { color:var(--texte); font-weight:700; }
.cl-suivie .cl-nom { font-weight:900; }
.cl-note-suivie { margin:4px 0 0; display:flex; align-items:center; gap:8px; color:var(--secondaire); font-size:12px; }
.cl-marque-suivie { width:14px; height:11px; border-radius:2px; background:color-mix(in srgb, var(--texte) 7%, var(--bloc)); border:1px solid var(--filet); }

/* Zones de qualification / relégation : liseré de 3 px en NIVEAU DE GRIS sur le rang, légende identique. */
.cl-zone-0 { --cl-zone:1; } .cl-zone-1 { --cl-zone:.62; } .cl-zone-2 { --cl-zone:.38; } .cl-zone-3 { --cl-zone:.22; }
.cl-zone > td.cl-rang { --cl-trait:color-mix(in srgb, var(--texte) calc(var(--cl-zone,1) * 100%), transparent); background-image:linear-gradient(var(--cl-trait), var(--cl-trait)); background-size:3px calc(100% - 10px); background-position:0 50%; background-repeat:no-repeat; }
.cl-legende { list-style:none; margin:8px 0 0; padding:8px 0 0; border-top:1px solid var(--filet); display:flex; flex-wrap:wrap; gap:6px 16px; }
.cl-legende-zone { display:flex; align-items:center; gap:8px; color:var(--secondaire); font-size:12px; }
.cl-zone-marque { width:3px; height:12px; border-radius:1px; background:color-mix(in srgb, var(--texte) calc(var(--cl-zone,1) * 100%), transparent); }

/* Forme récente : victoire pleine, nul grisé, défaite en contour (StandingsRow.formDots). */
.cl-forme-pastilles { display:inline-flex; gap:3px; vertical-align:middle; }
.cl-pastille { width:7px; height:7px; border-radius:50%; box-sizing:border-box; }
.cl-pastille-v { background:var(--texte); }
.cl-pastille-n { background:var(--secondaire); }
.cl-pastille-d { border:1px solid var(--secondaire); }

.cl-attribution { justify-self:start; margin-top:8px; color:var(--secondaire); font-size:12px; }

/* Hors connexion : les chiffres ne sont plus vérifiés, la table passe en secondaire (jamais de rouge). */
.cl-fige .cl-table td,.cl-fige .cl-nom { color:var(--secondaire); }

@media (max-width:600px) {
  .cl-classement { padding:8px 0; border-inline:0; border-radius:0; margin-inline:calc(-1 * var(--gouttiere, 16px)); }
  .cl-classement > :not(.cl-groupe),.cl-groupe-titre { padding-inline:var(--gouttiere, 16px); }
  .cl-table th,.cl-table td { padding:0 4px; }
  .cl-table { --cl-largeur-rang:calc(var(--gouttiere, 16px) + 30px); }
  .cl-table .cl-rang { padding-left:var(--gouttiere, 16px); padding-right:6px; }
  .cl-table .cl-nom-cellule { min-width:7.5em; max-width:9.5em; width:auto; border-right:1px solid var(--filet); padding-right:8px; }
  .cl-zone > td.cl-rang { background-position:calc(var(--gouttiere, 16px) - 8px) 50%; }
  .cl-nom-long { display:none; }
  .cl-nom-court { display:block; }
  .cl-nom { font-size:14px; }
  td.cl-rang { font-size:15px; }
  .cl-chiffre { min-width:1.9em; }
}

/* Au-delà du téléphone, un nom long passe sur deux lignes plutôt que d'être coupé (« New Orleans Pelicans »). */
@media (min-width:601px) {
  .cl-table .cl-nom-cellule { white-space:normal; }
  .cl-nom { white-space:normal; overflow-wrap:anywhere; }
}

/* Grand écran : la table tient en largeur ; elle quitte son cadre et l'en-tête colle au haut de la fenêtre. */
@media (min-width:1024px) {
  .cl-defile { overflow:visible; max-height:none; }
  .cl-table .cl-nom-cellule { max-width:none; }
}