/* theme/actualites-sports.css — la page /des-actualites (copie de l’aperçu _apercus/flux/commun/scores.css, intégrée le 30 octobre 2026 ;
   l’aperçu reste le banc d’essai). */
/*
 * scores.css — « des sports », la barre du fil (commun/scores.js). Chaque direction
 * l'habille en donnant ses variables à .sc-place :
 *   --sc-police, --sc-fond, --sc-fond-plein, --sc-encre, --sc-pale, --sc-filet,
 *   --sc-survol, --sc-direct, --sc-carte (le menu et le panneau ; --sc-fond-plein
 *   à défaut) ; au besoin
 *   --sc-rouge (les défaites, la relégation : le rouge du direct par défaut) et
 *   --sc-titre (le score en grand de la feuille : la police de la barre par défaut).
 * La disposition est celle du bandeau d'ESPN : une piste qui défile, la compétition
 * en tête de ses matchs, chaque match en deux lignes (une par équipe, son logo), le
 * vainqueur en gras avec sa flèche, le perdant éteint. Le direct passe devant.
 */
.sc-place {
    --sc-police: inherit;
    --sc-titre: var(--sc-police);
    --sc-fond: transparent;
    --sc-encre: currentColor;
    --sc-pale: color-mix(in srgb, currentColor 52%, transparent);
    --sc-filet: color-mix(in srgb, currentColor 14%, transparent);
    --sc-survol: color-mix(in srgb, currentColor 5%, transparent);
    --sc-direct: #d0021b;
    --sc-rouge: var(--sc-direct);
    --sc-carte: var(--sc-fond-plein, Canvas);   /* le menu et le panneau : le fond plein de la barre, à défaut */
    --sc-carton-jaune: #f2c200;          /* les cartons : la couleur de l'objet, de jour comme de nuit */
    --sc-carton-rouge: #d81f1f;
    --sc-haut: 4.6rem;
    position: relative;
    z-index: 40;
    background: var(--sc-fond);
    color: var(--sc-encre);
    font-family: var(--sc-police);
    border-bottom: 1px solid var(--sc-filet);
}
@media (prefers-color-scheme: dark) {
    :root:not([data-fond="clair"]) .sc-place { --sc-carton-rouge: #ee3a32; }
}
:root[data-fond="noir"] .sc-place { --sc-carton-rouge: #ee3a32; }
.sc-place[hidden] { display: none; }
.sc { position: relative; display: flex; align-items: stretch; height: var(--sc-haut); }
.sc-pale { color: var(--sc-pale); }
.sc button { font: inherit; color: inherit; }
.sc-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Le menu « des sports » */
.sc-menu { position: relative; flex: none; display: flex; border-right: 1px solid var(--sc-filet); }
.sc-titre {
    display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: .3rem;
    margin: 0; padding: 0 1.1rem 0 1rem; border: 0; background: none; cursor: pointer; text-align: left;
    font-size: .8rem; line-height: 1.1;
}
.sc-titre:hover, .sc-titre[aria-expanded="true"] { background: var(--sc-survol); }
.sc-titre:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
.sc-titre-nom { display: inline-flex; align-items: center; gap: .35rem; font-weight: 600; white-space: nowrap; }
.sc-titre-nom i, .sc-nom i {
    width: .38rem; height: .38rem; border-right: 1.3px solid currentColor; border-bottom: 1.3px solid currentColor;
    transform: translateY(-.12rem) rotate(45deg); flex: none;
}
.sc-titre[aria-expanded="true"] .sc-titre-nom i, .sc-nom[aria-expanded="true"] i { transform: translateY(.08rem) rotate(-135deg); }
.sc-titre .sc-pale { font-size: .7rem; }
.sc-direct { display: inline-flex; align-items: center; gap: .3rem; color: var(--sc-direct); font-size: .7rem; }
.sc-direct i, .sc-vif i, .sc-nom-direct span i, .sc-vif-point {
    width: .42rem; height: .42rem; border-radius: 50%; background: var(--sc-direct); display: inline-block; flex: none;
    animation: sc-pouls 1.6s ease-in-out infinite;
}
@keyframes sc-pouls { 50% { opacity: .25; } }

.sc-choix {
    position: absolute; top: calc(100% + 1px); left: 0; z-index: 5; width: 17rem; max-height: min(70vh, 32rem); overflow: auto;
    padding: .9rem 1rem .7rem; background: var(--sc-carte); color: var(--sc-encre);
    border: 1px solid var(--sc-filet); box-shadow: 0 12px 36px rgba(0, 0, 0, .16);
    font-size: .82rem;
}
.sc-choix[hidden] { display: none; }
.sc-choix-tete { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 .5rem; font-weight: 600; }
.sc-tout { border: 0; background: none; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; font-weight: 400; color: var(--sc-pale); }
.sc-choix fieldset { margin: 0 0 .6rem; padding: .5rem 0 0; border: 0; border-top: 1px solid var(--sc-filet); }
.sc-choix legend { padding: 0; float: left; width: 100%; margin-bottom: .2rem; font-size: .72rem; color: var(--sc-pale); }
.sc-choix label { display: flex; align-items: center; gap: .5rem; padding: .18rem 0; cursor: pointer; clear: both; }
.sc-choix label .sc-pale { margin-left: auto; font-size: .72rem; font-variant-numeric: tabular-nums; }
.sc-choix input { accent-color: var(--sc-encre); margin: 0; }
.sc-choix-pied { margin: .3rem 0 0; font-size: .7rem; color: var(--sc-pale); }
.sc-choix-pied a, .sc-credit a { color: inherit; text-underline-offset: 2px; }
.sc-credit { margin: 1rem 0 0; font-size: .72rem; color: var(--sc-pale); }

/* La piste */
.sc-defile { position: relative; flex: 1; min-width: 0; display: flex; }
.sc-piste {
    flex: 1; min-width: 0; display: flex; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x proximity; scrollbar-width: none; overscroll-behavior-x: contain;
}
.sc-piste::-webkit-scrollbar { display: none; }
@media (pointer: fine) { .sc-piste { cursor: grab; } .sc-piste.sc-glisse { cursor: grabbing; scroll-snap-type: none; user-select: none; } }
.sc-piste:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }
.sc-rien { margin: auto 1rem; font-size: .8rem; color: var(--sc-pale); }

.sc-ligue { flex: none; display: flex; align-items: stretch; scroll-snap-align: start; }
.sc-nom {
    display: flex; align-items: center; gap: .4rem; margin: 0; padding: 0 .9rem; cursor: pointer;
    border: 0; border-right: 1px solid var(--sc-filet); background: var(--sc-survol);
    font-size: .78rem; font-weight: 600; white-space: nowrap;
}
.sc-nom:hover, .sc-nom[aria-expanded="true"] { background: color-mix(in srgb, var(--sc-encre) 9%, transparent); }
.sc-nom:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
.sc-nom i { opacity: .55; width: .32rem; height: .32rem; }
.sc-nom-seul, .sc-nom-seul:hover { cursor: default; background: var(--sc-survol); }
.sc-matchs { display: flex; margin: 0; padding: 0; list-style: none; }
.sc-match { position: relative; flex: none; width: 9.6rem; border-right: 1px solid var(--sc-filet); }
.sc-match > a, .sc-ouvrir, .sc-carte {
    display: flex; flex-direction: column; justify-content: center; gap: .12rem; height: 100%; width: 100%; margin: 0;
    padding: 0 .85rem; color: inherit; text-decoration: none; background: none; border: 0; text-align: left; cursor: pointer;
}
.sc-match > a:hover, .sc-ouvrir:hover, .sc-carte:hover { background: var(--sc-survol); }
.sc-match > a:focus-visible, .sc-ouvrir:focus-visible, .sc-carte:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
/* La carte dont la feuille est ouverte : un filet d'encre en haut, comme un onglet. */
.sc-carte[aria-expanded="true"], .sc-ouvrir[aria-expanded="true"] {
    background: color-mix(in srgb, var(--sc-encre) 7%, transparent); box-shadow: inset 0 2px 0 var(--sc-encre);
}
.sc-vide { display: flex; align-items: center; padding: 0 .9rem; width: auto; font-size: .76rem; color: var(--sc-pale); }

.sc-tete { display: flex; align-items: baseline; gap: .45rem; min-width: 0; font-size: .68rem; line-height: 1.2; margin-bottom: .12rem; }
.sc-etat { flex: none; font-weight: 600; }
.sc-avant .sc-etat { font-weight: 400; color: var(--sc-pale); }
.sc-vif { display: inline-flex; align-items: center; gap: .3rem; color: var(--sc-direct); }
.sc-plus { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--sc-pale); }
.sc-chaine { margin-left: auto; padding-left: .3rem; flex: 0 1 auto; min-width: 0; max-width: 5.6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .62rem; color: var(--sc-pale); letter-spacing: .01em; }

.sc-equipe {
    display: grid; grid-template-columns: 1.15rem minmax(0, 1fr) auto .5rem; align-items: center; column-gap: .45rem;
    font-size: .84rem; line-height: 1.32; font-variant-numeric: tabular-nums;
}
.sc-logo { width: 1.15rem; height: 1.15rem; object-fit: contain; display: block; }
.sc-couleur { width: .62rem; height: .62rem; margin-left: .26rem; border-radius: 1px; background: var(--sc-c, transparent); }
.sc-couleur[data-sans] { box-shadow: inset 0 0 0 1px var(--sc-pale); }
.sc-qui { display: flex; align-items: center; gap: .32rem; min-width: 0; }
.sc-abrev { text-decoration: none; letter-spacing: .02em; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-score { text-align: right; }
.sc-gagne { font-weight: 700; }
.sc-gagne::after { content: ""; justify-self: end; border: .26rem solid transparent; border-right: .32rem solid currentColor; border-left: 0; }
.sc-perd { color: var(--sc-pale); }
.sc-perd .sc-logo { opacity: .55; }
.sc-but { margin-top: .08rem; font-size: .66rem; line-height: 1.2; color: var(--sc-direct); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Les cartons rouges : un petit rectangle par carton, à côté de l'abréviation. */
.sc-rouges { display: inline-flex; gap: 2px; flex: none; }
.sc-rouges i { width: .34rem; height: .5rem; border-radius: 1px; background: var(--sc-carton-rouge); }

/* Le trait fin d'un match en direct : la part jouée, au pied de la carte. */
/* Une carte en direct se resserre : le dernier but tient au-dessus du trait. */
.sc-pendant > .sc-carte, .sc-pendant > a { gap: .04rem; }
.sc-pendant .sc-tete { margin-bottom: .04rem; }
.sc-pendant .sc-equipe { line-height: 1.2; }
.sc-trait { position: absolute; left: .85rem; right: .85rem; bottom: 1px; height: 2px; overflow: hidden; background: var(--sc-filet); border-radius: 1px; }
.sc-trait i { position: absolute; inset: 0; background: var(--sc-direct); transform-origin: left center; }

/* La section « en direct » : en tête de piste, dans le rouge. */
.sc-en-direct { background: color-mix(in srgb, var(--sc-direct) 5%, transparent); }
.sc-nom-direct, .sc-nom-direct:hover {
    flex-direction: column; justify-content: center; align-items: flex-start; gap: .22rem; cursor: default;
    color: var(--sc-direct); background: color-mix(in srgb, var(--sc-direct) 7%, transparent);
}
.sc-nom-direct b { font-size: 1.35rem; font-weight: 600; line-height: .9; font-variant-numeric: tabular-nums; }
.sc-nom-direct span { display: inline-flex; align-items: center; gap: .3rem; font-size: .7rem; font-weight: 600; }
.sc-en-direct .sc-match { width: 10.6rem; border-right-color: color-mix(in srgb, var(--sc-direct) 16%, transparent); }
.sc-en-direct .sc-tennis { width: calc(11rem + var(--sc-n, 3) * .8rem); }
.sc-compet { flex-shrink: 0; color: var(--sc-encre); font-weight: 600; letter-spacing: .01em; }

/* Le tennis : le drapeau, le nom, les jeux de chaque set en colonnes. */
.sc-tennis { width: calc(10.4rem + var(--sc-n, 3) * .8rem); }
.sc-joueur { grid-template-columns: 1rem minmax(0, 1fr) auto .5rem; font-size: .8rem; }
.sc-drapeau-joueur { width: 1rem; height: .69rem; object-fit: cover; display: block; box-shadow: 0 0 0 .5px var(--sc-filet); }
span.sc-drapeau-joueur { background: var(--sc-filet); }
.sc-sets { display: grid; grid-auto-flow: column; grid-auto-columns: .8rem; text-align: center; }
.sc-set { color: var(--sc-pale); font-weight: 400; }
.sc-set-gagne { color: var(--sc-encre); font-weight: 700; }
.sc-set-cours { color: var(--sc-direct); font-weight: 600; }
.sc-joueur.sc-gagne .sc-set:not(.sc-set-gagne) { font-weight: 400; }
.sc-joueur.sc-perd .sc-drapeau-joueur { opacity: .6; }
.sc-tete-serie { flex: none; font-size: .62rem; color: var(--sc-pale); font-weight: 400; letter-spacing: 0; }

/* Un score qui change s'allume */
.sc-change { animation: sc-allume 2.6s ease-out; }
@keyframes sc-allume { 0%, 30% { background: color-mix(in srgb, var(--sc-direct) 22%, transparent); } 100% { background: transparent; } }

/* La F1 */
.sc-f1 .sc-match { width: 11.4rem; }
.sc-f1 .sc-match > a, .sc-f1 .sc-ouvrir { padding: 0 1.15rem; }
.sc-en-direct .sc-f1-case { width: 11.4rem; }
.sc-drapeau { width: 1rem; height: .69rem; object-fit: cover; flex: none; align-self: center; margin-right: .35rem; box-shadow: 0 0 0 .5px var(--sc-filet); }
.sc-course .sc-drapeau { display: inline-block; vertical-align: -.05rem; }
.sc-ecurie-couleur { width: .2rem; height: .78rem; border-radius: 1px; background: var(--sc-c); align-self: center; }
.sc-pilote {
    display: grid; grid-template-columns: .8rem .2rem auto 1fr; align-items: baseline; column-gap: .42rem;
    font-size: .8rem; line-height: 1.32; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.sc-pilote abbr { text-decoration: none; font-weight: 600; letter-spacing: .03em; }
.sc-pos { color: var(--sc-pale); text-align: right; font-variant-numeric: tabular-nums; }
.sc-ecurie { color: var(--sc-pale); font-size: .7rem; overflow: hidden; text-overflow: ellipsis; }
.sc-pilote .sc-score { justify-self: end; }
.sc-course { font-size: .86rem; line-height: 1.3; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-seance { font-size: .74rem; line-height: 1.32; color: var(--sc-pale); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Les flèches de la piste */
.sc-fleche {
    position: absolute; top: 0; bottom: 0; z-index: 2; width: 3.2rem; padding: 0; border: 0; cursor: pointer;
    color: inherit; font: inherit; font-size: 1.6rem; line-height: 1;
}
.sc-fleche[hidden] { display: none; }
.sc-gauche { left: 0; text-align: left; padding-left: .7rem; background: linear-gradient(to right, var(--sc-fond-plein, Canvas) 55%, transparent); }
.sc-droite { right: 0; text-align: right; padding-right: .7rem; background: linear-gradient(to left, var(--sc-fond-plein, Canvas) 55%, transparent); }
.sc-fleche:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }

/* ==========================================================================
   Le panneau, sous la barre : un classement, la F1, une feuille de match.
   ========================================================================== */
.sc-tableau {
    position: absolute; top: 100%; left: 0; right: 0; z-index: 4; max-height: min(74vh, 44rem); overflow: auto;
    overscroll-behavior: contain;
    padding: 1rem 1.2rem 1.4rem; background: var(--sc-carte); color: var(--sc-encre);
    border-bottom: 1px solid color-mix(in srgb, var(--sc-encre) 26%, transparent); box-shadow: 0 16px 40px rgba(0, 0, 0, .14);
    font-size: .82rem; font-variant-numeric: tabular-nums;
}
.sc-tableau[hidden] { display: none; }
.sc-tableau button { font: inherit; color: inherit; }
.sc-fermer { position: absolute; top: .55rem; right: .8rem; border: 0; background: none; cursor: pointer; font-size: 1.4rem !important; line-height: 1; color: var(--sc-pale) !important; padding: .1rem .3rem; }
.sc-fermer:hover { color: var(--sc-encre) !important; }
.sc-tableau :focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.sc-tableau-tete { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .7rem; margin: 0 2rem 1rem 0; }
.sc-tableau-tete strong { font-size: .95rem; }
.sc-tableau-tete a { margin-left: auto; color: inherit; text-underline-offset: 3px; }
.sc-vers {
    border: 0; background: none; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px;
    text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
}
.sc-vers:hover { text-decoration-color: currentColor; }
.sc-attente { margin: .4rem 0; color: var(--sc-pale); }
.sc-attente-seule { text-align: center; margin: .2rem 0 1rem; }

.sc-tableau-corps { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 2.4rem; align-items: start; }
.sc-groupes { display: grid; grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); gap: 1.2rem 2.4rem; }
.sc-fiche { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1.4rem 2rem; align-content: start; }
.sc-fiche:empty { display: none; }
.sc-bloc h3 { margin: 0 0 .4rem; padding-bottom: .3rem; border-bottom: 1px solid var(--sc-encre); font: inherit; font-weight: 600; }
.sc-bloc ul, .sc-bloc ol { margin: 0; padding: 0; list-style: none; }
.sc-meneurs { counter-reset: rang; }
.sc-meneurs li { display: flex; justify-content: space-between; gap: .6rem; padding: .3rem 0; border-bottom: 1px solid var(--sc-filet); counter-increment: rang; }
.sc-meneurs li::before { content: counter(rang); width: 1.1rem; color: var(--sc-pale); font-variant-numeric: tabular-nums; }
.sc-meneurs li span { flex: 1; }
.sc-nouvelles li { border-bottom: 1px solid var(--sc-filet); }
.sc-nouvelles a { display: block; padding: .4rem 0; color: inherit; text-decoration: none; line-height: 1.3; }
.sc-nouvelles a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sc-nouvelles .sc-pale { display: block; font-size: .7rem; margin-bottom: .1rem; }

/* Les tables du classement */
.sc-groupe h3 { margin: 0 0 .35rem; font: inherit; font-weight: 600; }
.sc-groupe table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.sc-groupe th { font-weight: 400; color: var(--sc-pale); text-align: right; padding: .2rem .3rem; border-bottom: 1px solid var(--sc-filet); white-space: nowrap; }
.sc-groupe th:nth-child(2) { text-align: left; }
.sc-groupe td { text-align: right; padding: .22rem .3rem; border-bottom: 1px solid var(--sc-filet); white-space: nowrap; }
.sc-groupe th:first-child, .sc-groupe td:first-child { padding-left: .55rem; }
.sc-groupe td:first-child { color: var(--sc-pale); width: 1.9rem; }
.sc-groupe td:nth-child(2) { text-align: left; width: 99%; max-width: 0; }
.sc-groupe .sc-col-fort { font-weight: 600; }
.sc-nom-equipe { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.sc-nom-equipe > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.sc-nom-equipe .sc-logo { width: 1rem; height: 1rem; flex: none; }
.sc-nom-equipe .sc-couleur { flex: none; margin: 0 .19rem; }
.sc-col-forme, .sc-col-serie { padding-left: .9rem !important; }
.sc-groupe th.sc-col-forme { text-align: left; }
/* Les zones : un fin liseré en marge de la ligne, et la légende sous le tableau. */
.sc-en-zone td:first-child { box-shadow: inset 3px 0 0 var(--sc-zone); }
.sc-legende { display: flex; flex-wrap: wrap; gap: .35rem 1.2rem; margin: .75rem 0 0; padding: 0 0 0 .55rem; list-style: none; font-size: .72rem; color: var(--sc-pale); }
.sc-legende li { display: inline-flex; align-items: center; gap: .45rem; }
.sc-legende i { width: 3px; height: .9rem; background: var(--sc-zone); flex: none; }
/* La NFL : deux conférences de quatre divisions. */
.sc-conferences { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1.4rem 2.2rem; align-items: start; }
.sc-conference { display: grid; gap: 1rem; }
.sc-conference-nom { margin: 0; padding-bottom: .3rem; border-bottom: 1px solid var(--sc-encre); font: inherit; font-size: .9rem; font-weight: 600; letter-spacing: .04em; }
.sc-conference .sc-groupe h3 { color: var(--sc-pale); font-weight: 400; margin-bottom: .1rem; }

/* La forme : cinq pastilles, du plus ancien au plus récent ; V à l'encre, N gris, D rouge. */
.sc-forme { display: inline-flex; gap: 2px; vertical-align: middle; }
.sc-forme-vide { width: calc(5 * .95rem + 8px); height: .95rem; }
.sc-r {
    width: .95rem; height: .95rem; display: inline-grid; place-items: center; flex: none; border-radius: 2px;
    font-style: normal; font-size: .54rem; font-weight: 600; line-height: 1; letter-spacing: 0;
}
.sc-r-v { background: var(--sc-encre); color: var(--sc-carte); }
.sc-r-n { background: color-mix(in srgb, var(--sc-encre) 17%, transparent); color: var(--sc-encre); }
.sc-r-d { background: var(--sc-rouge); color: var(--sc-carte); }
.sc-r-x { box-shadow: inset 0 0 0 1px var(--sc-filet); color: var(--sc-pale); }
.sc-serie { display: inline-flex; align-items: center; gap: .3rem; font-weight: 600; }

/* La journée (ou les prochaines rencontres) : ‹ 9e journée › puis les matchs, jour par jour. */
.sc-journee { grid-column: 1 / -1; }
.sc-journee-tete { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; }
.sc-journee-nom { min-width: 5.6rem; text-align: center; }
.sc-journee-nom:focus { outline: none; }
.sc-journee-dates { font-weight: 400; color: var(--sc-pale); font-size: .74rem; }
.sc-journee-tete .sc-vers { margin-left: auto; font-weight: 400; font-size: .74rem; }
.sc-pas {
    display: inline-grid; place-items: center; width: 1.45rem; height: 1.45rem; padding: 0 0 .1rem; cursor: pointer;
    border: 1px solid var(--sc-filet); border-radius: 50%; background: none; font-size: .95rem !important; line-height: 1;
}
.sc-pas:hover:not(:disabled) { border-color: var(--sc-encre); }
.sc-pas:disabled { opacity: .3; cursor: default; }
.sc-jour { margin: .75rem 0 .1rem; font: inherit; font-size: .72rem; color: var(--sc-pale); }
.sc-jour:first-of-type { margin-top: .4rem; }
.sc-jligne {
    display: grid; grid-template-columns: minmax(0, 1fr) 4.4rem minmax(0, 1fr) 5.2rem; align-items: center; column-gap: .6rem;
    width: 100%; margin: 0; padding: .34rem .25rem; border: 0; border-bottom: 1px solid var(--sc-filet);
    background: none; text-align: left; line-height: 1.25;
}
button.sc-jligne { cursor: pointer; }
button.sc-jligne:hover { background: var(--sc-survol); }
.sc-j-equipe { display: flex; align-items: center; gap: .45rem; min-width: 0; }
.sc-j-a { justify-content: flex-end; text-align: right; }
.sc-j-equipe .sc-logo { width: 1rem; height: 1rem; flex: none; }
.sc-j-equipe .sc-couleur { flex: none; margin: 0 .19rem; }
.sc-j-nom { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-j-gagne { font-weight: 600; }
.sc-j-perd { color: var(--sc-pale); }
.sc-j-centre { display: flex; flex-direction: column; align-items: center; gap: .05rem; text-align: center; }
.sc-j-score { display: inline-flex; gap: .35rem; font-weight: 600; font-size: .9rem; }
.sc-j-score i { font-style: normal; font-weight: 400; color: var(--sc-pale); }
.sc-pendant .sc-j-score { color: var(--sc-direct); }
.sc-j-heure { color: var(--sc-pale); }
.sc-j-etat { font-size: .66rem; font-weight: 600; }
.sc-j-plus { display: flex; flex-direction: column; align-items: flex-end; min-width: 0; font-size: .68rem; color: var(--sc-pale); }
.sc-j-plus span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-retard { color: var(--sc-rouge); }

/* --- La feuille de match ----------------------------------------------------- */
.sc-feuille { max-width: 66rem; margin: 0 auto; }
.sc-affiche {
    display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: start; column-gap: 2.4rem;
    max-width: 46rem; margin: 0 auto 1.6rem;
}
.sc-cote { display: flex; flex-direction: column; align-items: center; gap: .5rem; min-width: 0; text-align: center; }
.sc-cote .sc-logo { width: 3.2rem; height: 3.2rem; }
.sc-cote .sc-couleur { width: 1.5rem; height: 1.5rem; margin: .85rem 0; border-radius: 2px; }
.sc-cote-nom { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .4rem; font-size: 1.08rem; font-weight: 600; line-height: 1.2; }
.sc-cote-perd .sc-cote-nom { font-weight: 400; color: var(--sc-pale); }
.sc-cote-perd .sc-logo { opacity: .7; }
.sc-cote .sc-rouges i { width: .46rem; height: .66rem; }
.sc-marque { display: flex; flex-direction: column; align-items: center; gap: .32rem; min-width: 9rem; padding-top: .2rem; }
.sc-marque-score {
    display: flex; align-items: baseline; gap: .38em; font-family: var(--sc-titre); font-size: 3.1rem; font-weight: 500;
    line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}
.sc-marque-score i { font-style: normal; font-weight: 300; color: var(--sc-pale); }
.sc-marque-perd { color: var(--sc-pale); }
.sc-marque-heure { font-family: var(--sc-titre); font-size: 1.5rem; font-weight: 500; line-height: 1.2; margin-top: .6rem; text-align: center; }
.sc-marque-etat { font-size: .78rem; font-weight: 600; }
.sc-marque-chaine, .sc-marque-note { font-size: .72rem; color: var(--sc-pale); text-align: center; }
.sc-trait-grand { position: relative; left: auto; right: auto; bottom: auto; width: 100%; margin-top: .3rem; }
.sc-lieu { grid-column: 1 / -1; margin: 1.1rem 0 0; text-align: center; font-size: .74rem; color: var(--sc-pale); }

.sc-feuille-corps { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2.6rem; align-items: start; }
.sc-feuille-corps > .sc-feuille-cote:only-child { grid-column: 1 / -1; max-width: 34rem; width: 100%; justify-self: center; }
.sc-feuille-fil, .sc-feuille-cote { display: grid; gap: 1.5rem; align-content: start; min-width: 0; }

/* Le fil du match : deux côtés, la minute au milieu, sur un fil. */
.sc-fil-tete, .sc-stats-tete { display: flex; justify-content: space-between; margin: 0 0 .2rem; font-size: .7rem; color: var(--sc-pale); }
.sc-fil {
    background: linear-gradient(var(--sc-filet), var(--sc-filet)) center top / 1px 100% no-repeat;
}
.sc-fait { display: grid; grid-template-columns: minmax(0, 1fr) 3.4rem minmax(0, 1fr); align-items: start; padding: .28rem 0; }
.sc-fait-cote { display: flex; align-items: flex-start; gap: .5rem; min-width: 0; }
.sc-fait-a .sc-fait-cote { justify-content: flex-end; text-align: right; }
.sc-fait-m { display: flex; flex-direction: column; align-items: center; text-align: center; }
.sc-fait-texte { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.sc-fait-nom { font-weight: 500; overflow-wrap: anywhere; }
.sc-fait-marquant .sc-fait-nom { font-weight: 600; }
.sc-fait-plus { font-size: .72rem; color: var(--sc-pale); overflow-wrap: anywhere; }
.sc-fait-action { font-size: .7rem; }
.sc-fait-minute { display: flex; flex-direction: column; align-items: center; gap: .12rem; }
.sc-fait-temps {
    display: inline-block; min-width: 2.3rem; padding: .08rem .3rem; border-radius: 99px; text-align: center;
    background: var(--sc-carte); box-shadow: inset 0 0 0 1px var(--sc-filet); color: var(--sc-pale); font-size: .7rem; line-height: 1.3;
}
.sc-fait-marquant .sc-fait-temps { background: var(--sc-encre); color: var(--sc-carte); box-shadow: none; font-weight: 600; }
.sc-fait-marque { padding: 0 .2rem; background: var(--sc-carte); font-size: .74rem; font-weight: 600; white-space: nowrap; }
.sc-fait-periode { display: flex; align-items: center; gap: .7rem; padding: .55rem 0 .35rem; font-size: .7rem; color: var(--sc-pale); }
.sc-fait-periode::before, .sc-fait-periode::after { content: ""; flex: 1; border-top: 1px solid var(--sc-filet); }
.sc-fait-periode span { padding: .05rem .5rem; background: var(--sc-carte); border-radius: 99px; box-shadow: inset 0 0 0 1px var(--sc-filet); }
.sc-fait-sortie { color: var(--sc-pale); }

/* Les icônes faites main (16 × 16, au trait de la couleur du texte). */
.sc-icone { width: 1rem; height: 1rem; flex: none; margin-top: .05rem; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.sc-icone .sc-i-plein { fill: currentColor; stroke: none; }
.sc-icone .sc-i-pale { opacity: .45; }
.sc-icone .sc-i-jaune { fill: var(--sc-carton-jaune); stroke: none; }
.sc-icone .sc-i-rouge { fill: var(--sc-carton-rouge); stroke: none; }
.sc-icone .sc-i-entre { stroke: var(--sc-encre); }
.sc-icone .sc-i-sort { stroke: var(--sc-pale); }
.sc-icone-csc { color: var(--sc-rouge); }

/* Les statistiques en barres opposées : chaque côté part du milieu. */
.sc-stat { display: grid; grid-template-columns: 4rem minmax(0, 1fr) 4rem; align-items: baseline; row-gap: .28rem; padding: .32rem 0; }
.sc-stat-a { text-align: left; }
.sc-stat-b { text-align: right; }
.sc-stat-nom { text-align: center; color: var(--sc-pale); font-size: .74rem; }
.sc-devant { font-weight: 600; }
.sc-stat-barres { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
.sc-demi { display: flex; height: 5px; overflow: hidden; background: var(--sc-filet); }
.sc-demi-a { justify-content: flex-end; border-radius: 3px 0 0 3px; }
.sc-demi-b { border-radius: 0 3px 3px 0; }
.sc-demi i { background: color-mix(in srgb, var(--sc-encre) 32%, transparent); }
.sc-demi.sc-devant i { background: var(--sc-encre); }

/* Les meilleurs du match, face à face. */
.sc-duel li { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: .8rem; padding: .38rem 0; border-bottom: 1px solid var(--sc-filet); }
.sc-duel-a, .sc-duel-b { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.sc-duel-a { justify-content: flex-end; text-align: right; }
.sc-duel-joueur { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.sc-duel-joueur .sc-pale { font-size: .7rem; }
.sc-duel-val { font-size: 1.05rem; font-weight: 600; }
.sc-duel-nom { min-width: 4.4rem; text-align: center; font-size: .72rem; color: var(--sc-pale); }
.sc-liens { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin: 0; }
.sc-liens a { color: inherit; text-underline-offset: 3px; }
.sc-feuille > .sc-liens { justify-content: center; }

/* --- La F1 : le championnat en écarts, le prochain circuit, le calendrier ------------- */
.sc-f1-corps { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .95fr) minmax(0, 1fr); gap: 2.4rem; align-items: start; }
.sc-f1-champ { display: grid; gap: 1.5rem; }
.sc-ecarts li {
    display: grid; grid-template-columns: 1.1rem .2rem minmax(7.6rem, 9rem) minmax(0, 1fr) 2.4rem 2.6rem; align-items: center; column-gap: .5rem;
    padding: .26rem 0; border-bottom: 1px solid var(--sc-filet);
}
.sc-ecart-nom { display: flex; align-items: baseline; gap: .45rem; min-width: 0; white-space: nowrap; overflow: hidden; }
.sc-ecart-nom abbr { text-decoration: none; font-weight: 600; letter-spacing: .03em; }
.sc-ecart-nom .sc-pale { overflow: hidden; text-overflow: ellipsis; }
.sc-ecart-barre { position: relative; height: .42rem; overflow: hidden; background: var(--sc-filet); }
.sc-ecart-barre i { position: absolute; inset: 0; background: var(--sc-encre); transform-origin: left center; }
.sc-ecarts li:not(:first-child) .sc-ecart-barre i { background: color-mix(in srgb, var(--sc-encre) 62%, transparent); }
.sc-ecart-pts { text-align: right; font-weight: 600; }
.sc-ecart-diff { text-align: right; font-size: .74rem; color: var(--sc-pale); }

.sc-circuit-gp { display: flex; align-items: center; flex-wrap: wrap; gap: .1rem .5rem; margin: .5rem 0 0; }
.sc-circuit-gp strong { font-size: .95rem; }
.sc-circuit-gp .sc-drapeau { margin-right: 0; }
.sc-trace { display: block; width: 100%; max-width: 15.5rem; height: auto; aspect-ratio: 1; margin: .8rem auto .6rem; overflow: visible; }
.sc-trace polygon { fill: none; stroke-linejoin: round; stroke-linecap: round; }
.sc-trace-fond { stroke: var(--sc-filet); stroke-width: .045; }
.sc-trace-ligne { stroke: var(--sc-encre); stroke-width: .011; stroke-dasharray: 1; stroke-dashoffset: 0; }
@media (prefers-reduced-motion: no-preference) {
    .sc-trace-ligne { animation: sc-tracer 2.4s cubic-bezier(.45, .05, .25, 1) .15s both; }
}
@keyframes sc-tracer { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.sc-circuit-nom { display: flex; flex-direction: column; align-items: center; margin: 0 0 .8rem; text-align: center; font-weight: 500; }
.sc-circuit-nom .sc-pale { font-weight: 400; font-size: .74rem; }
.sc-seances li { display: grid; grid-template-columns: minmax(0, 1fr) auto 5.6rem; column-gap: .6rem; padding: .26rem 0; border-bottom: 1px solid var(--sc-filet); }
.sc-seances li span:last-child { text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-seances li span:first-child { display: inline-flex; align-items: center; gap: .35rem; }
.sc-seance-passee { color: var(--sc-pale); }
.sc-seance-vive { color: var(--sc-direct); font-weight: 600; }
.sc-circuit .sc-credit { margin-top: .6rem; font-size: .66rem; }

.sc-gp { display: grid; grid-template-columns: 1.3rem 1rem minmax(0, 1fr) auto; column-gap: .5rem; align-items: center; padding: .24rem 0 .24rem .5rem; border-bottom: 1px solid var(--sc-filet); }
.sc-gp .sc-drapeau { margin-right: 0; }
.sc-gp-manche { color: var(--sc-pale); text-align: right; font-size: .74rem; }
.sc-gp-nom { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-gp-nom .sc-pale { font-size: .74rem; }
.sc-gp-date { font-size: .76rem; }
.sc-gp-passe { color: var(--sc-pale); }
.sc-gp-passe .sc-drapeau { filter: grayscale(1); opacity: .45; }
.sc-gp-prochain { box-shadow: inset 3px 0 0 var(--sc-direct); font-weight: 600; background: color-mix(in srgb, var(--sc-direct) 5%, transparent); }
.sc-gp-prochain .sc-gp-date { color: var(--sc-direct); }

@media (max-width: 1180px) {
    .sc-f1-corps { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .sc-calendrier-bloc { grid-column: 1 / -1; }
    .sc-calendrier { columns: 2; column-gap: 2rem; }
    .sc-gp { break-inside: avoid; }
}
@media (max-width: 960px) {
    .sc-tableau-corps, .sc-feuille-corps { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .sc-direct i, .sc-vif i, .sc-nom-direct span i, .sc-vif-point { animation: none; }
    .sc-change { animation: none; outline: 2px solid var(--sc-direct); outline-offset: -2px; }
}
@media (max-width: 640px) {
    .sc-place { --sc-haut: 4.4rem; }
    .sc-titre { padding: 0 .7rem; }
    .sc-titre .sc-pale, .sc-titre .sc-direct { font-size: .64rem; }
    .sc-match { width: 8.6rem; }
    .sc-en-direct .sc-match { width: 9.6rem; }
    .sc-tennis { width: calc(9.4rem + var(--sc-n, 3) * .78rem); }
    .sc-en-direct .sc-tennis { width: calc(9.8rem + var(--sc-n, 3) * .78rem); }
    .sc-sets { grid-auto-columns: .78rem; }
    .sc-pendant .sc-but { display: none; }       /* le dernier but : dans la feuille, au téléphone */
    .sc-nom-direct { padding: 0 .75rem; }
    .sc-nom-direct b { font-size: 1.15rem; }
    .sc-nom-direct span { font-size: .64rem; }
    .sc-fleche { display: none; }
    .sc-choix { position: fixed; top: auto; bottom: 0; left: 0; right: 0; width: auto; max-height: 75vh; border-radius: 12px 12px 0 0; }
    .sc-tableau { position: fixed; top: auto; bottom: 0; max-height: 82vh; border-radius: 12px 12px 0 0; padding: 1rem 1rem calc(1.4rem + env(safe-area-inset-bottom)); }
    .sc-tableau-tete { margin-right: 1.8rem; }
    .sc-tableau-tete a { margin-left: 0; flex-basis: 100%; }
    /* Le classement : on garde J, diff., pts et la forme. */
    .sc-col-detail { display: none; }
    .sc-groupe th, .sc-groupe td { padding-left: .22rem; padding-right: .22rem; }
    .sc-col-forme, .sc-col-serie { padding-left: .5rem !important; }
    .sc-r { width: .8rem; height: .8rem; font-size: .5rem; }
    .sc-forme-vide { width: calc(5 * .8rem + 8px); height: .8rem; }
    .sc-fiche { grid-template-columns: 1fr; }
    .sc-jligne { grid-template-columns: minmax(0, 1fr) 3.6rem minmax(0, 1fr); column-gap: .45rem; }
    .sc-j-plus { grid-column: 1 / -1; flex-direction: row; justify-content: center; gap: .6rem; }
    .sc-j-plus:empty { display: none; }
    /* La feuille */
    .sc-affiche { column-gap: .7rem; margin-bottom: 1.2rem; }
    .sc-cote .sc-logo { width: 2.5rem; height: 2.5rem; }
    .sc-cote-nom { font-size: .9rem; }
    .sc-marque { min-width: 0; }
    .sc-marque-score { font-size: 2.4rem; }
    .sc-marque-heure { font-size: 1.15rem; }
    .sc-fait { grid-template-columns: minmax(0, 1fr) 2.9rem minmax(0, 1fr); }
    .sc-fait-cote { gap: .35rem; }
    .sc-fait-nom { font-size: .78rem; }
    .sc-stat { grid-template-columns: 3.4rem minmax(0, 1fr) 3.4rem; }
    .sc-f1-corps { grid-template-columns: 1fr; }
    .sc-calendrier { columns: 1; }
    .sc-ecarts li { grid-template-columns: 1.1rem .2rem minmax(5.8rem, 7rem) minmax(0, 1fr) 2.2rem 2.4rem; column-gap: .4rem; }
}
