/* Page du match (notes des fans, pronostic, avant et après-match), après scoutarium.css : ces règles ne pèsent que sur elle. */
.fiche-match::before { content: ""; display: block; height: 4px; background: linear-gradient(90deg, var(--club-1) 50%, var(--club-2) 50%); }
.fiche-match .point-direct { display: inline-block; margin-right: 6px; vertical-align: 1px; }
/* Notes des fans */
.fenetre-notes { margin-top: 16px; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; border-color: var(--bronze); }
.fenetre-notes h2 { margin: 0 0 4px; font-size: 24px; }
.fenetre-notes p { margin: 0; }
.compteur { font: 14px/1.3 var(--f-texte); color: var(--brume); text-align: right; }
.compteur b { display: block; font: 800 40px/1 var(--f-display); color: var(--or-clair); font-variant-numeric: tabular-nums; }
.vote-hdm { display: grid; gap: 8px; }
.vote-hdm fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 6px; }
.confirmation { margin: 0; font-size: 15px; color: var(--or-clair); }
/* Noter | Verdict (audit design du 4 octobre) */
.bascule-notes { display: inline-flex; margin: 0 0 12px; border: 1px solid var(--bronze); border-radius: var(--r-pilule); overflow: hidden; }
.bascule-notes a { display: flex; align-items: center; min-height: 44px; padding: 0 18px; font: 600 15px/1 var(--f-display); letter-spacing: .1em; text-transform: uppercase; color: var(--brume); text-decoration: none; }
.bascule-notes [aria-current] { background: var(--or); color: var(--nuit); }
.bascule-notes a:focus-visible { outline-offset: -3px; }
.note-contexte .btn { margin-bottom: 8px; }
.etat-notes { display: flex; align-items: center; gap: 8px; margin: 0; font: 14px/1 var(--f-texte); color: var(--or-clair); }
.point-ouvert { width: 8px; height: 8px; border-radius: 50%; background: var(--bande-3); }
.equipe-notes { margin: 16px 0 8px; font-size: 16px; letter-spacing: .08em; text-transform: uppercase; color: var(--or); }
.carte-note { position: relative; min-width: 0; margin: 0 0 8px; padding: 10px 12px; background: var(--ardoise); border: 1px solid var(--cadre); border-radius: var(--r-md); }
.carte-note-tete { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.nom-joueur { display: flex; flex: 1; align-items: center; min-width: 0; }
.nom-joueur > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.carte-note .min, .sans-note, .enregistree, .votants, .tableau-verdict td small { font: 14px/1 var(--f-texte); letter-spacing: 0; text-transform: none; color: var(--brume); }
.carte-note .min, .votants, .tableau-verdict td small { font-family: var(--f-data); }
.pastilles { display: grid; grid-template-columns: repeat(10, minmax(0, 44px)); gap: 2px; }
.carte-note input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; }
.pastilles label { display: grid; place-items: center; height: 44px; border: 1px solid var(--cadre); border-radius: var(--r-sm); background: var(--nuit); font: 600 16px/1 var(--f-data); color: var(--parchemin); cursor: pointer; }
.pastilles label:hover { border-color: var(--bronze); }
.pastilles input:checked + label { background: var(--or); border-color: var(--or); color: var(--nuit); }
.carte-note input:focus-visible + label { outline: 2px solid var(--iris); outline-offset: 2px; }
.sans-note { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; }
.carte-note input:checked + .sans-note { color: var(--parchemin); text-decoration: underline; text-underline-offset: 4px; }
.enregistree { display: inline-block; margin-top: 10px; }
html:has(.barre-notes) { scroll-padding-bottom: calc(var(--barre-basse-h) + 120px); }
.barre-notes { position: sticky; bottom: var(--barre-basse-h); z-index: 20; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; padding: 8px 12px; background: var(--ardoise-2); border: 1px solid var(--bronze); border-radius: var(--r-md); }
.barre-notes p { margin: 0; font: 14px/1.2 var(--f-texte); color: var(--brume); }
.barre-notes b { font: 800 24px/1 var(--f-display); color: var(--or-clair); }
.barre-notes .btn { min-height: 48px; }
.barre-notes .confirmation { position: absolute; bottom: 100%; left: 8px; margin-bottom: 6px; padding: 6px 10px; background: var(--ardoise-2); border: 1px solid var(--or); border-radius: var(--r-sm); }
.votants { margin: 0 0 10px; }
.tableau-verdict { margin-bottom: 12px; }
.tableau-verdict table { table-layout: fixed; }
.tableau-verdict caption { padding: 12px 12px 4px; text-align: left; font: 600 15px/1 var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--or); }
.tableau-verdict th { width: 64px; }
.tableau-verdict th:first-child { width: auto; text-align: left; }
.tableau-verdict th.fans { width: 92px; }
.tableau-verdict td small { margin-left: 4px; }
.ecart { display: inline-block; min-width: 44px; padding: 4px 6px; border: 1px solid var(--bronze); border-radius: var(--r-sm); color: var(--or-clair); text-align: center; }
.ecart-fort { border: 2px solid var(--or); font-weight: 700; }
.echelle { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
@media (min-width: 480px) { .pastilles { gap: 4px; } }
@media (max-width: 479px) {
  .carte-note { padding-inline: 3px; }
  .carte-note-tete, .sans-note, .enregistree { margin-inline: 9px; }
  .tableau-verdict .portrait { display: none; }
  .tableau-verdict th { width: 58px; }
  .tableau-verdict th.fans { width: 86px; }
  .barre-notes { flex-wrap: nowrap; padding-inline: 10px; }
  .barre-notes b { display: block; }
  .barre-notes .btn { padding-inline: 12px; letter-spacing: .04em; }
}
/* Pronostic et absents (A3.3) */
.prono-form { display: grid; gap: 8px; max-width: 520px; }
.prono-score { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font: 700 15px/1.2 var(--f-display); }
.prono-score input[type="number"] { width: 64px; font: 800 22px/1 var(--f-display); text-align: center; }
.prono-score label { display: flex; align-items: center; gap: 8px; }
.absents { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 12px 24px; }
.absents h3 { margin: 0 0 6px; font-size: 15px; }
.absents ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.fiche-avant-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 12px 24px; }
.fiche-avant-chiffres h3 { margin: 0 0 6px; font-size: 15px; }
.fiche-avant-chiffres ul { margin: 0 0 6px; padding-left: 18px; display: grid; gap: 4px; }
.fiche-avant-chiffres .forme { margin: 0 0 6px; font: 600 15px/1.2 var(--f-data); letter-spacing: .08em; }
.fiche-avant h2 { margin-top: 0; }
.fil-avant { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-bottom: 0; }
.resume-apres h2 { margin-top: 0; }
.resume-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 12px 24px; }
.resume-chiffres h3 { margin: 0 0 6px; font-size: 15px; }
.resume-chiffres ol, .resume-chiffres ul { margin: 0 0 6px; padding-left: 18px; display: grid; gap: 4px; }
.verdict-fans { margin-top: 20px; border-top: 1px solid var(--trait); padding-top: 16px; }
.verdict-fans h2 { margin-top: 0; }
.verdict-fans h3 { margin: 0 0 6px; font-size: 15px; }
.verdict-fans ol, .verdict-fans ul { margin: 0 0 10px; padding-left: 18px; display: grid; gap: 4px; }
.lien-debrief { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin: 16px 0 0; }
.resume-collaboratif { margin-top: 20px; border-top: 1px solid var(--trait); padding-top: 16px; }
.resume-collaboratif h2 { margin-top: 0; }
.corrections-resume h3 { margin: 0 0 6px; font-size: 15px; }
.corrections-resume ul { margin: 0; padding-left: 18px; }
.corrections-match { margin-top: 16px; }
.corrections-match h3 { margin: 0 0 6px; font-size: 15px; }
.corrections-match ul { margin: 0 0 6px; padding-left: 18px; }
@media (max-width: 760px) {
  .compteur { text-align: left; }
  /* Téléphone : les notes, puis les sondages, puis les commentaires. */
  .match-grille > .colonne:first-child { display: contents; }
  #commentaires { order: 1; }
}
@media (prefers-reduced-motion: no-preference) {
  .pastilles label { transition: background .15s ease, border-color .15s ease; }
}
.fiche-match .fraicheur { margin: 4px 0 0; text-align: center; font: 600 14px/1.3 var(--f-display); letter-spacing: .1em; text-transform: uppercase; color: var(--brume); }
.fiche-match .fraicheur.etat-ouvert, .fiche-match .fraicheur.etat-direct { color: var(--or-clair); }
