/* Duplibridge — feuille de style commune */

:root {
    --vert: #1f5d45;          /* tapis de jeu */
    --vert-fonce: #154532;
    --creme: #f6f1e6;
    --papier: #fffdf8;
    --encre: #1d2421;
    --encre-douce: #5b6660;
    --rouge: #b3263a;
    --bordure: #e3dccb;
    --ok: #2e7d4f;
    --ko: #b3263a;
    --rayon: 12px;
    --ombre: 0 1px 2px rgba(0, 0, 0, .05), 0 6px 20px rgba(0, 0, 0, .06);
    --police-titre: Georgia, "Times New Roman", serif;
    --police-texte: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }

html, body { margin: 0; }

body {
    background: var(--creme);
    color: var(--encre);
    font-family: var(--police-texte);
    font-size: 16px;
    line-height: 1.55;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main { flex: 1; }

a { color: var(--vert); }

.conteneur {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 16px;
}

/* En-tête */
.entete {
    background: var(--papier);
    border-bottom: 1px solid var(--bordure);
}
.entete__contenu {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 64px;
    gap: 16px;
}
.marque {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding: 4px 0;
    text-decoration: none;
    color: var(--vert);
}
/* Logo inspiré de duplibridge.com : les quatre couleurs au-dessus du nom */
.marque__couleurs {
    display: inline-flex;
    font-family: "Segoe UI Symbol", "Apple Symbols", "DejaVu Sans", Arial, sans-serif;
    font-size: 36px;
    line-height: .85;
    font-variant-emoji: text;
}
.marque__couleur { color: var(--encre); }
.marque__couleur--rouge { color: #d4202c; }
.marque:hover .marque__couleurs { transform: translateY(-1px); }
.marque__nom {
    font-family: var(--police-texte);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: .01em;
    color: var(--vert);
}
@media (max-width: 600px) {
    .marque__couleurs { font-size: 28px; }
    .marque__nom { font-size: 17px; }
}
.navigation {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 16px;
}
.navigation__lien { color: var(--encre-douce); }
.navigation__lien--inactif { cursor: default; opacity: .6; }

/* Boutons */
.bouton {
    display: inline-block;
    padding: 10px 18px;
    border-radius: 999px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
}
.bouton--principal { background: var(--vert); color: var(--creme); }
.bouton--principal:hover { background: var(--vert-fonce); }
.bouton--discret { border-color: var(--bordure); color: var(--encre); background: transparent; }
.bouton--inactif { opacity: .55; cursor: not-allowed; }

/* Accroche */
.accroche {
    background: var(--vert);
    color: var(--creme);
    padding: 64px 0 56px;
    position: relative;
    overflow: hidden;
}
.accroche__contenu { position: relative; }
.accroche__sur-titre {
    margin: 0 0 12px;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 13px;
    opacity: .8;
}
.accroche__titre {
    margin: 0 0 16px;
    font-family: var(--police-titre);
    font-size: clamp(28px, 5vw, 46px);
    line-height: 1.15;
    max-width: 18em;
}
.accroche__texte {
    margin: 0 0 28px;
    max-width: 38em;
    font-size: 18px;
    opacity: .92;
}
.accroche__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
}
.accroche .bouton--principal { background: var(--creme); color: var(--vert-fonce); }
.accroche__mention { font-size: 14px; opacity: .8; }

.couleurs {
    position: absolute;
    right: 16px;
    top: -10px;
    display: flex;
    gap: 6px;
    font-size: 64px;
    opacity: .14;
    pointer-events: none;
}
.couleur--rouge { color: #ffb3bd; }
.couleur--noire { color: var(--creme); }

/* Cartes d'atouts */
.atouts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
    margin-top: -28px;
    margin-bottom: 40px;
    position: relative;
}
.carte {
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    padding: 22px;
    box-shadow: var(--ombre);
}
.carte p { margin: 0; color: var(--encre-douce); }
.carte__titre {
    margin: 0 0 8px;
    font-family: var(--police-titre);
    font-size: 20px;
}

/* État technique */
.etat {
    background: var(--papier);
    border: 1px dashed var(--bordure);
    border-radius: var(--rayon);
    padding: 20px 22px;
    margin-bottom: 48px;
}
.etat__titre {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    font-size: 16px;
}
.etat__pastille {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--encre-douce);
}
.etat--ok .etat__pastille { background: var(--ok); }
.etat--ko .etat__pastille { background: var(--ko); }
.etat__liste {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin: 0;
}
.etat__liste dt { font-size: 13px; color: var(--encre-douce); }
.etat__liste dd { margin: 2px 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.etat__note { margin: 14px 0 0; font-size: 13px; color: var(--encre-douce); }

/* Page d'erreur */
.erreur { padding: 64px 16px; text-align: center; }
.erreur__code {
    margin: 0;
    font-family: var(--police-titre);
    font-size: 72px;
    color: var(--vert);
}
.erreur h1 { font-family: var(--police-titre); }

/* Pied de page */
.pied {
    border-top: 1px solid var(--bordure);
    background: var(--papier);
    color: var(--encre-douce);
    font-size: 14px;
}
.pied__contenu {
    display: flex;
    justify-content: space-between;
    padding-top: 16px;
    padding-bottom: 16px;
}

/* Sélecteur de langue */
.langues {
    display: flex;
    gap: 2px;
    margin: 0;
    padding: 2px;
    list-style: none;
    border: 1px solid var(--bordure);
    border-radius: 999px;
}
.langues__lien {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .04em;
    text-decoration: none;
    color: var(--encre-douce);
}
.langues__lien:hover { color: var(--encre); }
.langues__lien--active { background: var(--vert); color: var(--creme); }
.langues__lien--active:hover { color: var(--creme); }

/* --- v0.3 : utilisateur connecté --- */
.navigation__utilisateur { font-weight: 600; }
.navigation__deconnexion { margin: 0; }
button.bouton { font: inherit; font-weight: 600; cursor: pointer; }

/* Mises en page des pages de contenu */
.page-etroite { max-width: 520px; padding-top: 40px; padding-bottom: 56px; }
.page-large { padding-top: 32px; padding-bottom: 56px; }
.page__titre {
    margin: 0 0 8px;
    font-family: var(--police-titre);
    font-size: clamp(26px, 4vw, 34px);
    line-height: 1.2;
}
.page__intro { margin: 0 0 24px; color: var(--encre-douce); }
.page__pied { margin: 20px 0 0; color: var(--encre-douce); font-size: 15px; }

/* Formulaires */
.formulaire {
    display: flex;
    flex-direction: column;
    gap: 16px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    padding: 22px;
    box-shadow: var(--ombre);
}
.champs-cote-a-cote {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
}
.champ { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.champ label { font-weight: 600; font-size: 15px; }
.champ input, .champ select {
    width: 100%;
    font: inherit;
    padding: 10px 12px;
    border: 1px solid var(--bordure);
    border-radius: 8px;
    background: #fff;
    color: var(--encre);
}
.champ input:focus, .champ select:focus {
    outline: 2px solid var(--vert);
    outline-offset: 1px;
    border-color: var(--vert);
}
.champ--erreur { border-color: var(--ko) !important; }
.champ--code {
    font-size: 26px !important;
    letter-spacing: .4em;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.champ__aide { margin: 0; font-size: 13px; color: var(--encre-douce); }
.champ__libelle { font-weight: 600; font-size: 15px; }
.champ__valeur { margin: 0; padding: 10px 12px; border-radius: 8px; background: var(--creme); font-weight: 600; }
[hidden] { display: none !important; }
.champ__erreur { margin: 0; font-size: 14px; color: var(--ko); }
.bouton--large { width: 100%; padding: 12px 18px; }
.bouton--petit { padding: 6px 12px; font-size: 14px; }
.bouton--danger { background: transparent; color: var(--ko); border-color: currentColor; }
.bouton--danger:hover { background: var(--ko); color: #fff; }
.lien {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: var(--vert);
    text-decoration: underline;
    cursor: pointer;
}

/* Alertes */
.alerte {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid;
    font-size: 15px;
}
.alerte--info { background: #eaf4ee; border-color: #b9d8c5; color: #1c4a33; }
.alerte--erreur { background: #fbeaec; border-color: #eab8c0; color: #7d1a28; }
.alerte--avertissement { background: #fdf5e2; border-color: #ead7a4; color: #6b4e0f; }

/* Administration */
.onglets {
    display: flex;
    gap: 4px;
    margin: 16px 0 24px;
    border-bottom: 1px solid var(--bordure);
    overflow-x: auto;
}
.onglets__lien {
    padding: 10px 14px;
    text-decoration: none;
    color: var(--encre-douce);
    font-weight: 600;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px;
    white-space: nowrap;
}
.onglets__lien--actif { color: var(--vert); border-bottom-color: var(--vert); }
.bloc { margin-bottom: 36px; }
.bloc__titre { margin: 0 0 6px; font-family: var(--police-titre); font-size: 22px; }
.bloc__intro { margin: 0 0 16px; color: var(--encre-douce); }
.tableau-defilant {
    /* positionné : les libellés cachés (.visuellement-cache) restent dans le cadre défilant au lieu d'élargir la page */
    position: relative;
    overflow-x: auto;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
}
.tableau { width: 100%; border-collapse: collapse; font-size: 15px; }
.tableau th, .tableau td {
    text-align: left;
    padding: 10px 14px;
    border-bottom: 1px solid var(--bordure);
    vertical-align: middle;
}
.tableau th { font-size: 13px; color: var(--encre-douce); font-weight: 600; background: var(--creme); }
.tableau tbody tr:last-child td { border-bottom: 0; }
/* Tableau dense (scores du tournoi) : beaucoup de colonnes, cellules resserrées */
.tableau--dense { font-size: 14px; }
.tableau--dense th, .tableau--dense td { padding: 8px 8px; }
.tableau--dense .tableau__nombre { white-space: nowrap; }
.tableau__actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.tableau__actions form { margin: 0; }
/* Sur une cellule, la mise en page flex la sortirait du tableau (bordure décalée) : elle reste une cellule */
td.tableau__actions { display: table-cell; text-align: right; white-space: nowrap; vertical-align: middle; }
td.tableau__actions > * { display: inline-block; vertical-align: middle; }
td.tableau__actions > * + * { margin-left: 8px; }
.tableau__date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pastille {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 999px;
    background: var(--creme);
    border: 1px solid var(--bordure);
    font-size: 12px;
    color: var(--encre-douce);
}
.visuellement-cache {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* --- v0.4 : packs de tables --- */
.section__titre {
    margin: 0 0 6px;
    font-family: var(--police-titre);
    font-size: clamp(24px, 3.5vw, 30px);
}
.section__intro { margin: 0 0 20px; color: var(--encre-douce); max-width: 42em; }
.packs-accueil { margin-bottom: 40px; }
.packs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 18px;
}
.pack {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    padding: 22px 20px 20px;
    box-shadow: var(--ombre);
}
.pack--promotion { border: 2px solid var(--rouge); }
.pack__badge {
    position: absolute;
    top: -12px;
    left: 18px;
    margin: 0;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--rouge);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.pack p { margin: 0; }
.pack__libelle { margin: 0; font-family: var(--police-titre); font-size: 22px; }
.pack__tables { font-weight: 600; color: var(--vert); }
.pack__prix { display: flex; align-items: baseline; gap: 8px; margin: 6px 0 !important; }
.pack__prix-actuel { font-size: 30px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pack--promotion .pack__prix-actuel { color: var(--rouge); }
.pack__prix-normal { color: var(--encre-douce); }
.pack__validite, .pack__fin-vente { font-size: 14px; color: var(--encre-douce); }
.pack__fin-vente { font-weight: 600; }
.pack__bouton { margin-top: auto; text-align: center; }
.pack__validite + .pack__bouton, .pack__fin-vente + .pack__bouton { margin-top: 14px; }
.packs__mention { margin: 14px 0 0; font-size: 13px; color: var(--encre-douce); }

/* Administration : en-têtes de bloc, formulaires longs, tableaux */
.bloc__entete {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}
.bloc--formulaire { max-width: 760px; }
.groupe-champs {
    margin: 0;
    padding: 14px 16px 16px;
    border: 1px solid var(--bordure);
    border-radius: 8px;
    min-width: 0;
}
.groupe-champs legend { padding: 0 6px; font-weight: 700; font-size: 15px; }
.groupe-champs .champ__aide { margin-bottom: 10px; }
.series-mi-temps > summary { cursor: pointer; font-weight: 700; font-size: 15px; margin-bottom: 8px; }
.champ--case { flex-direction: row; align-items: center; gap: 10px; align-self: end; padding-bottom: 10px; }
.champ--case input { width: 20px; height: 20px; accent-color: var(--vert); }
.formulaire__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.tableau__nombre { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.texte-discret { color: var(--encre-douce); font-size: 13px; margin-left: 6px; }
.pastille--ok { background: #eaf4ee; border-color: #b9d8c5; color: #1c4a33; margin-left: 0; }
.pastille--ko { background: #f3efe6; color: var(--encre-douce); margin-left: 0; }
.pastille--promotion { background: #fbeaec; border-color: #eab8c0; color: #7d1a28; }

/* --- v0.5 : création d'un groupe, groupes, factures --- */
.page-moyenne { max-width: 760px; padding-top: 32px; padding-bottom: 56px; }
.etape__titre { margin: 8px 0 6px; font-family: var(--police-titre); font-size: 24px; }
.fil-ariane { margin: 0 0 10px; font-size: 14px; color: var(--encre-douce); }

/* Fil d'étapes */
.etapes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 14px 0 22px;
    padding: 0;
    list-style: none;
    counter-reset: etape;
}
.etapes__etape {
    counter-increment: etape;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px 5px 6px;
    border-radius: 999px;
    border: 1px solid var(--bordure);
    background: var(--papier);
    font-size: 13px;
    color: var(--encre-douce);
}
.etapes__etape::before {
    content: counter(etape);
    display: inline-grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--creme);
    font-weight: 700;
    font-size: 12px;
}
.etapes__etape a { color: inherit; }
.etapes__etape.etape-faite { color: var(--vert); border-color: #b9d8c5; }
.etapes__etape.etape-faite::before { content: "✓"; background: #eaf4ee; }
.etapes__etape.etape-courante { color: var(--creme); background: var(--vert); border-color: var(--vert); font-weight: 600; }
.etapes__etape.etape-courante::before { background: var(--creme); color: var(--vert); }

/* Choix du pack */
.choix-packs { display: grid; gap: 10px; margin-bottom: 12px; }
.choix-pack {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    cursor: pointer;
}
.choix-pack:has(input:checked) { border: 2px solid var(--vert); padding: 13px 15px; }
.choix-pack--promotion { border-color: #eab8c0; }
.choix-pack input { width: 20px; height: 20px; accent-color: var(--vert); flex: none; }
.choix-pack__contenu { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; flex: 1; }
.choix-pack__libelle { font-family: var(--police-titre); font-size: 19px; font-weight: 700; }
.choix-pack__detail { color: var(--encre-douce); font-size: 14px; }
.choix-pack__prix { margin-left: auto; font-weight: 700; font-size: 18px; white-space: nowrap; }

/* Choix d'un type (équipe, client) */
.choix-type { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.choix-type__option {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    border: 1px solid var(--bordure);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
}
.choix-type__option:has(input:checked) { border-color: var(--vert); box-shadow: 0 0 0 1px var(--vert); }
.choix-type__option input { margin-top: 3px; accent-color: var(--vert); }
.choix-type__option .champ__aide { display: block; }

/* Récapitulatif et paiement */
.recapitulatif {
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    padding: 18px 20px;
    margin-bottom: 18px;
}
.recapitulatif__liste { display: grid; gap: 10px; margin: 0 0 8px; }
.recapitulatif__liste div { display: grid; grid-template-columns: 140px 1fr; gap: 12px; }
.recapitulatif__liste dt { color: var(--encre-douce); font-size: 14px; }
.recapitulatif__liste dd { margin: 0; }
.recapitulatif__total { padding-top: 10px; border-top: 1px solid var(--bordure); font-size: 20px; font-weight: 700; }
.recapitulatif__total dt { font-size: 16px; color: var(--encre); align-self: center; }
#dropin-container { min-height: 60px; }
.case-cgv { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.case-cgv input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--vert); flex: none; }
.paiement__attente { margin: 0; color: var(--encre-douce); text-align: center; }

/* Confirmation */
.confirmation { text-align: center; padding: 24px 0; }
.confirmation__icone {
    display: inline-grid;
    place-items: center;
    width: 64px;
    height: 64px;
    margin: 0 0 8px;
    border-radius: 16px;
    background: var(--vert);
    color: var(--creme);
    font-size: 38px;
}
.confirmation p { margin: 8px 0 18px; }

/* Groupes */
.liste-groupes { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.liste-groupes__groupe {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
}
.liste-groupes__groupe a { font-family: var(--police-titre); font-size: 19px; font-weight: 700; text-decoration: none; }
.pastille--manager { background: var(--vert); border-color: var(--vert); color: var(--creme); }
.vide { padding: 24px; text-align: center; background: var(--papier); border: 1px dashed var(--bordure); border-radius: var(--rayon); }
.groupe__entete { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 20px; }
.groupe__entete .page__titre { margin: 0; }
.groupe__entete .pastille { margin-left: 0; }
.groupe__colonnes { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 0 28px; }
.liste-simple { margin: 0 0 12px; padding: 0; list-style: none; display: grid; gap: 8px; }
.liste-simple li { padding: 10px 12px; background: var(--papier); border: 1px solid var(--bordure); border-radius: 8px; }
.stock { margin: 0 0 6px; }
.stock__nombre { font-size: 40px; font-weight: 700; color: var(--vert); font-variant-numeric: tabular-nums; }

/* Parcours : formulaire + résumé */
.page-parcours { max-width: 1080px; padding-top: 32px; padding-bottom: 56px; }
.parcours { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: start; }
.resume {
    position: sticky;
    top: 16px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    padding: 18px;
    font-size: 14px;
}
.resume__titre { margin: 0 0 10px; font-family: var(--police-titre); font-size: 18px; }
.resume__vide { margin: 0; color: var(--encre-douce); }
.resume__liste { margin: 0; }
.resume__liste dt {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--bordure);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--encre-douce);
}
.resume__liste dt:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.resume__liste dt a { text-transform: none; letter-spacing: 0; font-weight: 600; }
.resume__liste dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.resume__liste .texte-discret { margin-left: 0; }
.resume__total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 14px 0 0;
    padding-top: 12px;
    border-top: 2px solid var(--encre);
}
.resume__total strong { font-size: 22px; }
.resume__abandon { margin: 14px 0 0; font-size: 13px; text-align: center; }
@media (max-width: 880px) {
    .parcours { grid-template-columns: 1fr; }
    .resume { position: static; order: -1; }
}

/* CGV */
.texte-juridique h2 { font-family: var(--police-titre); font-size: 20px; margin: 28px 0 8px; }
.texte-juridique p, .texte-juridique li { color: var(--encre); }
.texte-juridique ul, .texte-juridique ol { padding-left: 22px; }

/* Facture */
.facture-page { background: #fff; border: 1px solid var(--bordure); border-radius: var(--rayon); padding: 28px; }
@media print {
    .entete, .pied, .ne-pas-imprimer { display: none !important; }
    body { background: #fff; }
    .facture-page { border: 0; padding: 0; }
}

.alertes-accueil { padding-top: 16px; }

@media (max-width: 600px) {
    .navigation__lien--inactif, .navigation__lien--secondaire { display: none; }
    .navigation { gap: 10px; }
    .accroche { padding: 44px 0 48px; }
    .couleurs { font-size: 44px; }
}

/* v0.6 : membres, managers et invitations du groupe */
.bloc__sous-titre { margin: 28px 0 10px; font-family: var(--police-titre); font-size: 18px; }
.role-icone { display: inline-block; width: 1.2em; color: var(--encre-douce); text-align: center; }
.role-icone--manager { color: var(--vert); }
.formulaire--ligne { flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.formulaire--ligne .champ { margin-bottom: 0; }
.formulaire--ligne .champ:first-child { flex: 1 1 260px; }
.champ--bouton { flex: 0 0 auto; }

/* v0.6 : réponse à une invitation */
.invitation { background: var(--papier); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: 20px; margin-bottom: 24px; }
.invitation__groupe { margin: 0 0 6px; font-family: var(--police-titre); font-size: 24px; }
.invitation__detail { margin: 0; color: var(--encre-douce); }
.invitation__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 18px; }
.invitation__actions form { margin: 0; }
.choix-equipe { margin: 0; padding: 0; border: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; }
.choix-equipe legend { padding: 0; margin-bottom: 6px; font-weight: 600; font-size: 15px; }
.choix-equipe label { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.choix-equipe input { accent-color: var(--vert); }
.liste-groupes__infos { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.liste-groupes__equipes { font-size: 14px; color: var(--encre-douce); }
.liste-simple li.equipe--mienne { border-color: var(--vert); }

/* v0.6.1 : lien « Mon compte » dans l'en-tête */
a.navigation__utilisateur { color: inherit; text-decoration: none; }
a.navigation__utilisateur:hover { text-decoration: underline; }

/* v0.7 : équipes, présentation et réglages du groupe */
.groupe__reglages { margin-left: auto; }
.groupe__presentation { background: var(--papier); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: 18px 20px; }
.presentation { margin: 0 0 12px; white-space: pre-line; }
.groupe__adresse { font-style: normal; display: flex; flex-direction: column; gap: 2px; color: var(--encre-douce); margin-bottom: 12px; }
.groupe__adresse strong { color: var(--encre); }
.formulaire--compact { margin-top: 16px; padding: 16px; gap: 12px; }
.formulaire__titre { margin: 0; font-weight: 700; }
.ligne-action { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.ligne-action form { margin: 0; }
.champ textarea { width: 100%; font: inherit; padding: 10px 12px; border: 1px solid var(--bordure); border-radius: 8px; background: #fff; resize: vertical; }

/* v0.7 : recherche des groupes */
.resultats { margin-top: 28px; }
.liste-resultats { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.resultat { padding: 14px 16px; background: var(--papier); border: 1px solid var(--bordure); border-radius: var(--rayon); }
.resultat__entete { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.resultat__entete .pastille { margin-left: 0; }
.resultat__nom { font-family: var(--police-titre); font-size: 19px; font-weight: 700; text-decoration: none; }
.resultat__lieu { margin: 4px 0 0; color: var(--encre-douce); font-size: 15px; }
.resultat__extrait { margin: 6px 0 0; font-size: 15px; }

/* v0.8 : championnats */
.fiche { margin: 0; display: grid; gap: 10px; }
.fiche > div { display: grid; grid-template-columns: minmax(160px, 240px) 1fr; gap: 12px; padding: 10px 14px; background: var(--papier); border: 1px solid var(--bordure); border-radius: 8px; }
.fiche dt { font-weight: 600; }
.fiche dd { margin: 0; }
.actions-statut { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; }
.actions-statut form { margin: 0; }
.ligne-liens { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin: 12px 0 0; }
@media (max-width: 560px) { .fiche > div { grid-template-columns: 1fr; gap: 2px; } }

/* v0.9 : grilles de mouvement */
.filtres { margin-bottom: 18px; }
.filtres .champ:first-child { flex: 0 1 220px; }
.resume-grille { margin-bottom: 4px; }
.grille-plan { border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; background: var(--papier); }
.grille-plan th, .grille-plan td { border: 1px solid var(--bordure); padding: 4px 8px; text-align: center; vertical-align: middle; }
.grille-plan thead th { background: var(--creme); font-size: 13px; color: var(--encre-douce); font-weight: 600; white-space: nowrap; }
.grille-plan tbody th { background: var(--creme); font-weight: 700; }
.grille-plan__set { display: block; font-weight: 700; color: var(--vert); }
.grille-plan__equipes { display: block; white-space: nowrap; }
.grille-plan .case-vide { background: #f3efe6; }
.grille-saisie td { padding: 4px; }
.grille-saisie input {
    width: 3.4em; padding: 3px 4px; font: inherit; font-size: 13px; text-align: center;
    border: 1px solid var(--bordure); border-radius: 6px; background: #fff;
    -moz-appearance: textfield; appearance: textfield;
}
.grille-saisie input::-webkit-outer-spin-button, .grille-saisie input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.grille-saisie input:focus { outline: 2px solid var(--vert); outline-offset: 0; border-color: var(--vert); }
.grille-saisie .grille-saisie__set { display: block; margin: 0 auto 4px; border-color: #b9d8c5; background: #eaf4ee; font-weight: 700; }
.grille-saisie__places { display: flex; gap: 3px; justify-content: center; }
.grille-import { margin-top: 18px; }
.grille-import summary { cursor: pointer; font-weight: 600; color: var(--vert); }
.texte-code { width: 100%; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 13px; padding: 8px; border: 1px solid var(--bordure); border-radius: 8px; background: #fff; tab-size: 6; }
.controles__liste { margin: 0 0 12px; padding: 0; list-style: none; display: grid; gap: 6px; }
.controles__liste li { padding: 8px 12px; border-radius: 8px; border: 1px solid var(--bordure); background: var(--papier); }
.controles__liste .controle-bloquant { border-color: #eab8c0; background: #fbeaec; }
.controles__genre { display: inline-block; min-width: 110px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--encre-douce); }
.controles__liste .controle-bloquant .controles__genre { color: var(--ko); }
.controles__ok { margin: 0 0 12px; padding: 8px 12px; border-radius: 8px; background: #eaf4ee; border: 1px solid #b9d8c5; color: #1c4a33; }

/* v0.10 : tournois */
.tour { margin-top: 22px; }
.tour__entete { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.tour__titre { margin: 0; font-family: var(--police-titre); font-size: 18px; }
.tour__horaire { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0; }
.tour__horaire input,
.placement select,
.placement input {
    padding: 6px 10px;
    border: 1px solid var(--bordure);
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-size: 14px;
}
.placement select { min-width: 200px; }
.placement input { width: 100%; min-width: 180px; }
.mouvements .mouvements__debut td,
.mouvements .mouvements__debut th { border-top: 2px solid var(--bordure); }
.mouvements tbody th { font-weight: 700; color: var(--encre); background: transparent; font-size: 15px; }

/* v0.11 : saisie des scores à la table */
.liens-saisie { margin: 0 0 20px; }
.mouvements-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 16px; }
.mouvements-nav__titre { font-size: 13px; color: var(--encre-douce); margin-right: 4px; }
.mouvements-nav__lien {
    min-width: 34px; padding: 4px 8px; text-align: center; border-radius: 8px;
    border: 1px solid var(--bordure); background: var(--papier); color: var(--encre); text-decoration: none;
}
.mouvements-nav__lien--actif { background: var(--vert); border-color: var(--vert); color: #fff; font-weight: 700; }
.donne {
    margin: 0 0 16px; padding: 14px 16px; background: var(--papier);
    border: 1px solid var(--bordure); border-radius: var(--rayon);
}
.donne__entete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-bottom: 8px; }
.donne__titre { margin: 0; font-family: var(--police-titre); font-size: 19px; }
.donne__infos { font-size: 14px; color: var(--encre-douce); }
.donne__score { font-size: 17px; margin: 6px 0; display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: baseline; }
.donne__autre { margin: 6px 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.donne__action { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; }
.donne__saisie { margin-top: 8px; }
.donne__saisie summary { cursor: pointer; font-weight: 600; color: var(--vert); padding: 4px 0; }
.donne__rang { margin: 12px 0 8px; font-weight: 600; }
.contrat { white-space: nowrap; font-weight: 600; }
.symbole--rouge { color: var(--rouge); }
.symbole--noir { color: var(--encre); }
/* ♥ ♦ ♠ ♣ en caractères (et non en emoji) pour que la couleur s'applique, y compris sur mobile */
.contrat, .entame, .saisie__champs select { font-variant-emoji: text; }
/* liste déroulante : la couleur choisie (cœur, carreau) s'affiche en rouge, liste fermée comme ouverte */
.saisie__champs select:has(option.symbole--rouge:checked) { color: var(--rouge); }
.saisie__champs select option { color: var(--encre); }
.saisie__champs select option.symbole--rouge { color: var(--rouge); }
.saisie { margin-top: 8px; }
.saisie__champs { display: grid; gap: 10px; margin-bottom: 10px; }
.saisie__contrat { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.saisie__contrat label { display: flex; flex-direction: column; gap: 4px; }
.saisie__libelle { font-size: 12px; color: var(--encre-douce); font-weight: 600; }
.saisie__entame { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.saisie__champs select {
    font: inherit; font-size: 17px; padding: 8px 6px; border: 1px solid var(--bordure);
    border-radius: 8px; background: #fff; min-height: 44px;
}
.saisie__passe { display: flex; gap: 6px; align-items: center; margin-left: auto; }
.resultats-donne td, .resultats-donne th { padding: 6px 10px; white-space: nowrap; }
.resultats-donne--ns .col-ns, .resultats-donne--eo .col-eo { background: #eaf4ee; font-weight: 700; }
.resultats-donne__ma-table td { font-weight: 700; }
.filtres-liens { display: flex; gap: 14px; margin: 0 0 14px; flex-wrap: wrap; }
.filtres-liens__actif { font-weight: 700; text-decoration: none; color: var(--encre); }
.saisies-lignes { display: grid; gap: 10px; }
.saisies-lignes__ligne { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.saisies-lignes__ligne form { margin: 0; }
@media (max-width: 560px) {
    .saisie__contrat { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .saisie__passe { margin-left: 0; }
}
.bouton:disabled { opacity: .45; cursor: not-allowed; }
.saisie__champs select:disabled { background: var(--creme); color: var(--encre-douce); }

/* Remplissage des mouvements de la table */
.mouvements-nav__lien { display: inline-flex; align-items: center; justify-content: center; gap: 2px; }
.mouvements-nav__lien.mouvement-complet { background: #eaf4ee; border-color: #b9d8c5; color: #1c4a33; }
.mouvements-nav__lien.mouvement-partiel { background: #fdf5e2; border-color: #ead7a4; color: #6b4e0f; }
.mouvements-nav__lien.mouvement-vide { background: var(--papier); }
.mouvements-nav__lien.mouvement-actif { background: var(--vert); border-color: var(--vert); color: #fff; box-shadow: 0 0 0 2px var(--creme), 0 0 0 4px var(--vert); }
.mouvements-nav__marque { font-size: 12px; font-weight: 700; }
/* Tournoi en plusieurs mi-temps (10.11) : repère de la mi-temps dans la navigation de la table */
.mouvements-nav__mi-temps {
    margin-left: 8px; padding: 2px 6px; border-radius: 6px; font-size: 12px; font-weight: 700;
    color: var(--encre-douce); background: var(--creme); border: 1px dashed var(--bordure);
}
.mouvements-nav__mi-temps:first-of-type { margin-left: 0; }
.liste-avertissements { margin: 0 0 12px; padding-left: 28px; }
.liste-avertissements li + li { margin-top: 4px; }
.placement-mi-temps { margin: 0 0 12px; }
.placement-mi-temps > summary { cursor: pointer; color: var(--vert); font-weight: 600; margin-bottom: 8px; }
.champs-limites { flex-wrap: wrap; }
.choix-echange { outline: 2px solid var(--vert); outline-offset: 1px; transition: outline-color .3s; }
.mouvements-legende { display: flex; flex-wrap: wrap; gap: 12px; margin: -8px 0 16px; font-size: 12px; color: var(--encre-douce); }
.mouvements-legende__item { padding: 1px 8px; border-radius: 999px; border: 1px solid var(--bordure); }
.mouvements-legende__item--complet { background: #eaf4ee; border-color: #b9d8c5; color: #1c4a33; }
.mouvements-legende__item--partiel { background: #fdf5e2; border-color: #ead7a4; color: #6b4e0f; }
.mouvements-legende__item--vide { background: var(--papier); }

/* Mes tournois */
.navigation__badge {
    display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 2px; border-radius: 999px;
    background: var(--vert); color: #fff; font-size: 12px; font-weight: 700; text-align: center; line-height: 20px;
}
.mes-tournois { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mes-tournois__tournoi {
    display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px;
    padding: 14px 16px; background: var(--papier); border: 1px solid var(--bordure); border-radius: var(--rayon);
}
.mes-tournois__infos .texte-discret { margin-left: 0; display: block; }
.formulaire-bouton { margin: 0; }
.mes-tournois__participants { margin-top: 6px; font-size: 14px; }
.mes-tournois__participants summary { cursor: pointer; color: var(--vert); }
.mes-tournois__liste { margin: 6px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
.mes-tournois__liste li { padding: 2px 10px; border-radius: 999px; background: var(--creme); border: 1px solid var(--bordure); }
.mes-tournois__liste .mes-tournois__mienne { background: #eaf4ee; border-color: #b9d8c5; font-weight: 700; }

/* Dates interdites (règles de gestion, 10.8) */
.texte-discret--bloc { display: block; margin: 0 0 12px; }
.dates-interdites .texte-discret { display: block; margin-left: 0; }
.formulaire--date-interdite { margin-top: 12px; }
.choix-type--compact { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.choix-type--compact .choix-type__option { padding: 10px 12px; }
.pastille--alerte { background: #fdf5e2; border-color: #ead7a4; color: #6b4e0f; margin-left: 0; }
.incompatibilites { display: block; }
.incompatibilites p { margin: 4px 0; }
.incompatibilites ul { margin: 6px 0 0; padding-left: 20px; }
.champ--interdit { border-color: #c99a2e !important; box-shadow: 0 0 0 1px #c99a2e; }

.calendrier-dates { margin: 8px 0 12px; }
.calendrier-dates__alerte { margin: 0 0 8px; }
.calendrier-dates__details > summary { cursor: pointer; font-weight: 600; color: var(--vert); padding: 4px 0; }
.calendrier-dates__grille { max-width: 340px; margin-top: 8px; }
.calendrier__entete { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.calendrier__mois { font-weight: 700; text-transform: capitalize; }
.calendrier__nav {
    border: 1px solid var(--bordure); background: var(--papier); border-radius: 8px;
    width: 34px; height: 30px; font-size: 18px; line-height: 1; cursor: pointer; color: var(--encre);
}
.calendrier__nav:hover { border-color: var(--vert); }
.calendrier__jours { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.calendrier__nom-jour { font-size: 11px; text-align: center; color: var(--encre-douce); text-transform: capitalize; padding-bottom: 2px; }
.calendrier__jour {
    aspect-ratio: 1 / 1; border: 1px solid var(--bordure); background: var(--papier); border-radius: 6px;
    font: inherit; font-size: 13px; cursor: pointer; color: var(--encre); padding: 0;
}
.calendrier__jour:hover { border-color: var(--vert); }
.calendrier__jour--passe { color: var(--encre-douce); opacity: .6; }
.calendrier__jour--aujourdhui { font-weight: 700; border-color: var(--vert); }
.calendrier__jour--interdit { background: #fbeaec; border-color: #eab8c0; color: #7d1a28; text-decoration: line-through; }
.calendrier__jour--choisi { background: var(--vert); border-color: var(--vert); color: var(--creme); text-decoration: none; }
.calendrier__jour--choisi.calendrier__jour--interdit { background: #b3263a; border-color: #b3263a; color: #fff; }
.tour .calendrier-dates { margin: 0 0 10px; }

/* Feuilles de marque à imprimer (règles de gestion, 11.6) : une feuille par donne, autant de feuilles par page que la
   hauteur le permet, sans couper une feuille ; les feuilles sont découpées par donne, donc chacune porte le logo et
   le nom de Duplibridge, et le barème des IMP. */
.feuille-marque { background: #fff; border: 1px solid var(--bordure); border-radius: var(--rayon); padding: 20px; margin-bottom: 24px; }
.feuille-marque__entete { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
.feuille-marque__logo { display: flex; flex-direction: column; align-items: center; flex: none; color: var(--vert); }
.feuille-marque__logo .marque__couleurs { font-size: 22px; }
.feuille-marque__nom { font-family: var(--police-texte); font-size: 13px; font-weight: 700; }
.feuille-marque__infos { flex: 1; }
/* Barème des IMP : les tranches reviennent à la ligne dans la largeur de la feuille */
.feuille-marque__bareme { display: flex; flex-wrap: wrap; column-gap: .45em; margin: 6px 0 0; font-size: 10px; line-height: 1.4; color: var(--encre-douce); max-width: 100%; }
.feuille-marque__bareme-titre { font-weight: 600; margin-right: 4px; }
.feuille-marque__tranche { white-space: nowrap; }
.feuille-marque__tranche:not(:last-child)::after { content: " ·"; }
.feuille-marque__tournoi { margin: 0; font-weight: 600; }
.feuille-marque__type { margin: 0; color: var(--encre-douce); font-size: 14px; }
.feuille-marque__donne { text-align: right; }
.feuille-marque__donne h2 { margin: 0; font-family: var(--police-titre); font-size: 28px; }
.feuille-marque__donne p { margin: 0; font-size: 14px; }
.feuille-marque__tableau td { height: 34px; }
.feuille-marque__tableau th, .feuille-marque__centre { text-align: center !important; }
.feuille-marque__tableau td.feuille-marque__points { vertical-align: top; }
/* Numéros des équipes de la ligne, en petit, en haut à droite de la case des points */
.feuille-marque__rappel { display: block; text-align: right; font-size: 9px; line-height: 1; color: var(--encre-douce); font-variant-numeric: tabular-nums; }
.feuille-marque__case { width: 11%; }
.feuille-marque__case--etroite { width: 7%; }
@media screen and (max-width: 700px) {
    .feuille-marque { overflow-x: auto; }
    .feuille-marque__tableau { min-width: 640px; }
}
@media print {
    @page { size: A4 portrait; margin: 12mm; }
    .feuille-marque { border: 0; border-radius: 0; padding: 0 0 5mm; margin: 0 0 5mm; border-bottom: 1px dashed #000;
                      break-inside: avoid; page-break-inside: avoid; }
    .feuille-marque:last-of-type { border-bottom: 0; margin-bottom: 0; }
    .feuille-marque__entete { margin-bottom: 2mm; }
    .feuille-marque__logo { color: #000; }
    .feuille-marque__bareme { margin-top: 1mm; font-size: 8px; line-height: 1.35; color: #000; }
    .feuille-marque__donne h2 { font-size: 20px; }
    .feuille-marque__tableau { font-size: 11px; table-layout: fixed; }
    .feuille-marque__tableau th, .feuille-marque__tableau td,
    .feuille-marque__tableau tbody tr:last-child td { border: 1px solid #000; background: #fff; color: #000;
                                                      padding: 0.5mm 1.5mm; line-height: 1.2; }
    .feuille-marque__tableau th { font-size: 10px; }
    .feuille-marque__tableau th.feuille-marque__etroite { width: 6%; }
    .feuille-marque__tableau tbody td.feuille-marque__points { padding: 0.3mm 0.8mm; }
    .feuille-marque__rappel { font-size: 7px; color: #000; }
    .feuille-marque__tableau td { height: 7mm; overflow: hidden; }
    .conteneur.page-large { max-width: none; padding: 0; }
}

/* Classements (règles de gestion, 9 et 10.4) : l'équipe classée première en gras */
.classement__premier td { font-weight: 700; }

/* Série de tournois créée à partir d'une répartition (règles de gestion, 9.4) */
.liste-tournois-serie { display: grid; gap: 14px; margin-bottom: 18px; }
.liste-tournois-serie .bloc { margin: 0; }
.liste-equipes-serie { margin: 8px 0 12px; padding-left: 1.6em; display: grid; gap: 2px; }
.liste-equipes-serie .pastille { margin-left: 6px; }
.ligne-liens--entete { margin: 0; gap: 8px; }
.tournois-tour-serie { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 24px; }
.tournoi-serie__titre { margin: 8px 0 0; font-size: 15px; }
.calendrier__jour--depart { border: 2px dashed var(--vert); }

/* Liste des tournois d'un championnat : équipes de chaque tournoi, résultats affichés à la demande */
.ligne-tournoi { cursor: pointer; }
.ligne-tournoi:hover > td, .ligne-tournoi[aria-expanded="true"] > td { background: var(--creme); }
.ligne-tournoi:focus-visible { outline: 2px solid var(--vert); outline-offset: -2px; }
.ligne-tournoi__equipes { font-size: 13px; color: var(--encre-douce); min-width: 14em; }
.apercu-ligne > td { background: var(--creme); padding: 8px 12px 14px; }
.apercu-tournoi .tableau-defilant { margin: 0; }
.apercu-tournoi__mention { margin: 0 0 6px; font-size: 13px; color: var(--encre-douce); }
.apercu-tournoi__liens { margin: 8px 0 0; }

/* Report d'une feuille de saisie (11.6) : mode détaillé, classique (codes courts) ou score seul */
.modes-saisie { display: flex; flex-wrap: wrap; gap: 6px 16px; border: 0; padding: 0; margin: 0 0 12px; }
.modes-saisie legend { font-weight: 700; margin-bottom: 6px; }
.modes-saisie__option { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.saisie__codes { display: flex; flex-wrap: wrap; gap: 10px 14px; }
.saisie__codes label, .saisie__score label { display: flex; flex-direction: column; gap: 4px; }
.saisie__codes input, .saisie__score input { text-transform: uppercase; text-align: center; font-size: 18px;
    font-variant-numeric: tabular-nums; padding: 6px 8px; width: auto; }

/* Saisie par donne (report d'une feuille de marque complète, 11.6) */
.page__sous-titre { display: block; font-family: var(--police-texte); font-size: 15px; font-weight: 600;
    color: var(--encre-douce); margin-top: 4px; }
.navigation-donnes { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px;
    flex-wrap: wrap; margin: 0 0 16px; }
.navigation-donnes__aller { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.navigation-donnes__aller select { width: auto; }
.feuille-donne td { vertical-align: middle; }
.feuille-donne th.feuille-donne__code, .feuille-donne td.feuille-donne__code { padding-left: 3px; padding-right: 3px;
    text-align: center; }
.feuille-donne__code input { width: 3em; padding: 5px 4px; text-align: center; text-transform: uppercase;
    font-size: 16px; font-variant-numeric: tabular-nums; }
.feuille-donne__score input { width: 5em; }
.feuille-donne__code input[aria-invalid="true"] { border-color: var(--rouge); box-shadow: 0 0 0 2px #f3c6cd; }
.feuille-donne__enregistre { white-space: nowrap; }
.feuille-donne__ligne--erreur td { background: #fdf3f4; border-bottom: 0; }
.feuille-donne__erreur td { background: #fdf3f4; color: #7d1a28; font-size: 13px; padding-top: 0; }
.barre-actions { position: sticky; bottom: 0; z-index: 2; background: var(--creme); padding: 12px 0;
    margin-top: 12px; border-top: 1px solid var(--bordure); }
@media (max-width: 640px) {
    .barre-actions { position: static; border-top: 0; }
}

/* Boutons d'accès alignés sur une ligne (scores et classement d'un tournoi) */
.ligne-boutons { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }

/* Jeu d'une donne (règles de gestion, 11.5) : les 4 mains autour de la table, Nord en haut */
.donne__jeu { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--bordure); }
.donne__sous-titre { margin: 0 0 8px; font-size: 15px; font-weight: 700; }
.jeu {
    display: grid; grid-template-columns: auto auto auto; justify-content: start;
    grid-template-areas: ". n ." "o c e" ". s ."; gap: 6px 14px; align-items: center;
    max-width: 460px; font-variant-emoji: text;
}
.jeu__main[data-siege="N"] { grid-area: n; }
.jeu__main[data-siege="O"] { grid-area: o; }
.jeu__main[data-siege="E"] { grid-area: e; }
.jeu__main[data-siege="S"] { grid-area: s; }
.jeu__siege { margin: 0 0 2px; font-size: 13px; font-weight: 700; color: var(--encre-douce); }
.jeu__points { font-weight: 400; margin-left: 4px; }
.jeu__couleurs { list-style: none; margin: 0; padding: 0; font-size: 15px; line-height: 1.45; }
.jeu__couleurs li { display: flex; gap: 6px; white-space: nowrap; }
.jeu__symbole { width: 1em; text-align: center; }
.jeu__cartes { font-weight: 600; letter-spacing: .02em; }
.jeu__chicane { color: var(--encre-douce); font-weight: 400; }
.jeu__centre {
    grid-area: c; position: relative; width: 74px; height: 74px; border-radius: 10px;
    background: var(--vert); color: var(--creme); font-size: 13px; font-weight: 700;
}
.jeu__point-cardinal { position: absolute; width: 22px; height: 22px; line-height: 22px; text-align: center; border-radius: 6px; }
.jeu__point-cardinal[data-siege="N"] { top: 3px; left: 26px; }
.jeu__point-cardinal[data-siege="S"] { bottom: 3px; left: 26px; }
.jeu__point-cardinal[data-siege="O"] { left: 3px; top: 26px; }
.jeu__point-cardinal[data-siege="E"] { right: 3px; top: 26px; }
.jeu__point-cardinal.jeu-vulnerable { background: var(--rouge); }
.jeu__point-cardinal.jeu-donneur { text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 420px) {
    .jeu { gap: 4px 8px; }
    .jeu__couleurs { font-size: 14px; }
    .jeu__centre { width: 56px; height: 56px; }
    .jeu__point-cardinal[data-siege="N"], .jeu__point-cardinal[data-siege="S"] { left: 17px; }
    .jeu__point-cardinal[data-siege="O"], .jeu__point-cardinal[data-siege="E"] { top: 17px; }
}

/* Saisie d'un jeu : en touchant les cartes, ou en tapant chaque couleur */
.jeu-saisie { display: grid; gap: 12px; margin: 8px 0 12px; font-variant-emoji: text; }
.jeu-saisie__aide { margin: 0; font-size: 14px; color: var(--encre-douce); }
.jeu-saisie__onglets { display: flex; flex-wrap: wrap; gap: 6px; }
.jeu-saisie__onglet {
    display: flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--bordure);
    border-radius: 8px; background: #fff; cursor: pointer; font-weight: 600; min-height: 44px;
}
.jeu-saisie__onglet:has(input:checked) { border-color: var(--vert); box-shadow: 0 0 0 2px #cfe3d8; }
.jeu-saisie__compte { font-size: 13px; font-weight: 400; color: var(--encre-douce); }
.jeu-saisie__compte--complet { color: var(--ok); font-weight: 700; }
.jeu-saisie__compte--trop { color: var(--rouge); font-weight: 700; }
.jeu-saisie__grille { display: grid; gap: 6px; margin-top: 8px; }
.jeu-saisie__rangee { display: grid; grid-template-columns: 1.4em repeat(13, minmax(0, 1fr)); gap: 3px; align-items: center; }
.jeu-saisie__symbole { font-size: 18px; text-align: center; }
.jeu-carte {
    position: relative; font: inherit; font-size: 15px; font-weight: 600; min-height: 40px; padding: 0;
    border: 1px solid var(--bordure); border-radius: 6px; background: #fff; color: var(--encre); cursor: pointer;
}
.jeu-carte[aria-pressed="true"] { background: var(--vert); border-color: var(--vert); color: #fff; }
.jeu-carte--autre { background: #f1ede3; color: #a59f92; }
.jeu-carte__main { position: absolute; right: 2px; bottom: 0; font-size: 9px; font-weight: 700; }
.jeu-saisie__textes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.jeu-saisie__main { margin: 0; padding: 8px 10px 10px; border: 1px solid var(--bordure); border-radius: 8px; display: grid; gap: 6px; min-width: 0; }
.jeu-saisie__main legend { padding: 0 4px; font-weight: 700; font-size: 14px; }
.jeu-saisie__couleur { display: flex; align-items: center; gap: 6px; }
.jeu-saisie__couleur input {
    font: inherit; width: 100%; min-width: 0; padding: 6px 8px; border: 1px solid var(--bordure); border-radius: 6px;
    text-transform: uppercase; min-height: 38px;
}
.jeu-saisie__couleur input[aria-invalid="true"] { border-color: var(--rouge); box-shadow: 0 0 0 2px #f3c6cd; }
.jeu-saisie__ouest { grid-column: 1 / -1; margin: 0; font-size: 14px; }
.jeu-saisie__erreur { margin: 0; color: #7d1a28; font-size: 14px; }
@media (max-width: 600px) {
    .jeu-saisie__textes { grid-template-columns: 1fr; }
    .jeu-carte { font-size: 13px; min-height: 36px; }
}
.import-pbn { margin: 0 0 16px; padding: 16px; gap: 12px; }
.historique-jeu { margin: 0; padding-left: 1.4em; display: grid; gap: 4px; }
.jeu-saisie__couleur .jeu-saisie__symbole { width: 1.2em; flex: none; }
.reouverture { margin-top: 16px; padding: 16px; gap: 12px; }
.reouverture__titre { margin: 0; font-size: 16px; }

/* Propositions de date (règles de gestion, 10.9) */
.navigation__badge--propositions { background: #b7791f; }
.propositions__liste { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.proposition { padding: 12px 14px; background: var(--papier); border: 1px solid var(--bordure); border-radius: var(--rayon); }
.proposition p { margin: 4px 0; }
.proposition__entete { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.proposition__entete .pastille { margin-left: 0; }
.proposition .actions-statut { margin-top: 8px; }
.proposition__avis { margin: 8px 0 0; padding-left: 18px; font-size: 14px; }
.propositions__formulaire { margin-top: 12px; gap: 12px; }
.propositions__sous-titre { margin: 18px 0 6px; font-size: 15px; }
.propositions__closes { margin: 0; padding-left: 18px; font-size: 14px; color: var(--encre-douce); }

/* v0.18 : vues de pilotage du super-administrateur (ventes, consommation des tables) */
.periodes { margin: 4px 0 20px; }
.periodes__affichee { margin: 0 0 8px; color: var(--encre-douce); }
.periodes__affichee strong { color: var(--encre); margin-left: 4px; }
.periodes .filtres-liens { margin-bottom: 10px; }
.periodes__libres { margin: 0; padding: 0; background: none; border: 0; box-shadow: none; }
.periodes__libres .champ:first-child { flex: 0 1 180px; }
.periodes__libres .champ { flex: 0 1 180px; }
.bouton--actif { border-color: var(--vert); color: var(--vert); font-weight: 700; }
.indicateurs {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 12px;
    margin: 0 0 12px;
}
.indicateur {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
}
.indicateur dt { font-size: 13px; color: var(--encre-douce); font-weight: 600; }
.indicateur dd {
    margin: 0;
    font-family: var(--police-titre);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}
.indicateur dd small { display: block; font-family: var(--police-texte); font-size: 13px; font-weight: 400; color: var(--encre-douce); }
.indicateur--principal { border-color: #b9d8c5; background: #eaf4ee; }
.indicateur--principal dd { color: var(--vert); }
.texte-note { margin: 0; font-size: 13px; color: var(--encre-douce); }
.texte-bloc { display: block; margin-left: 0; }
.texte-code-court { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 12px; }

/* Graphique en barres empilées par mois */
.histogramme-cadre { margin: 0 0 12px; }
.legende { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 14px; }
.legende li { display: inline-flex; align-items: center; gap: 6px; }
.legende__pastille { display: inline-block; width: 12px; height: 12px; border-radius: 3px; flex: 0 0 auto; vertical-align: -1px; }
.histogramme {
    display: flex;
    align-items: stretch;
    gap: 8px;
    height: 240px;
    padding: 8px 10px 0;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    overflow-x: auto;
}
.histogramme__colonne { flex: 1 0 40px; max-width: 80px; display: flex; flex-direction: column; min-width: 0; }
.histogramme__total { font-size: 11px; text-align: center; color: var(--encre-douce); white-space: nowrap; font-variant-numeric: tabular-nums; }
.histogramme__barre { flex: 1; display: flex; flex-direction: column-reverse; border-bottom: 1px solid var(--encre-douce); }
.histogramme__segment { display: block; width: 100%; min-height: 2px; border-top: 1px solid var(--papier); }
.histogramme__segment:last-child { border-radius: 4px 4px 0 0; }
.histogramme__mois { padding: 4px 0 6px; font-size: 12px; text-align: center; color: var(--encre-douce); white-space: nowrap; }
.donnees-graphique summary { cursor: pointer; font-weight: 600; color: var(--vert); margin-bottom: 8px; }
.serie-0 { background: #1f5d45; }
.serie-1 { background: #c9a227; }
.serie-2 { background: #3b7ea1; }
.serie-3 { background: #b3263a; }
.serie-4 { background: #7a5c99; }
.serie-5 { background: #8aa05b; }
.serie-6 { background: #d9822b; }
.serie-7 { background: #5b6660; }
.serie-8 { background: #6fb59a; }
.serie-9 { background: #e2c96b; }
.serie-c0 { background: #1f5d45; }
.serie-c1 { background: #b3263a; }
.part { min-width: 160px; }
.part__barre { display: inline-block; width: 100px; height: 8px; border-radius: 4px; background: var(--creme); overflow: hidden; vertical-align: middle; }
.part__barre span { display: block; height: 100%; }
.part__valeur { margin-left: 8px; font-variant-numeric: tabular-nums; }
.tableau tfoot th { background: var(--creme); color: var(--encre); font-size: 14px; border-top: 1px solid var(--bordure); }
.tri { color: inherit; text-decoration: none; white-space: nowrap; }
.tri:hover { color: var(--vert); text-decoration: underline; }
.tri--actif { color: var(--vert); }
.tri__sens { font-size: 10px; margin-left: 2px; }
.ligne--alerte td { background: #fffaf0; }

/* v0.19 : journal du groupe */
.pastille--administration { background: #e8eef6; border-color: #c3d2e6; color: #23415f; margin-left: 0; white-space: nowrap; }
.journal__detail { overflow-wrap: anywhere; min-width: 220px; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 16px; flex-wrap: wrap; }
.pagination__position { color: var(--encre-douce); font-size: 14px; }

/* v0.20 : courbes de progression du championnat */
.progression { margin-top: 32px; }
.progression__dessin {
    overflow-x: auto;
    padding: 8px;
    background: var(--papier);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
}
.progression__dessin svg { display: block; width: 100%; min-width: 560px; height: auto; }
.progression__grille line { stroke: var(--bordure); stroke-width: 1; }
.progression__grille .progression__repere { stroke: var(--encre-douce); }
.progression__grille text { font-family: var(--police-texte); font-size: 12px; fill: var(--encre-douce); }
.progression__zero { stroke: var(--encre-douce); stroke-width: 1.2; stroke-dasharray: 5 4; }
.courbe { transition: opacity .15s; }
.courbe polyline { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.courbe circle { fill: currentColor; stroke: var(--papier); stroke-width: 1.5; }
.courbe circle.courbe__absent { fill: var(--papier); stroke: currentColor; }
.courbe--pointille polyline { stroke-dasharray: 7 4; }
.progression--focus .courbe { opacity: .12; }
.progression--focus .courbe.courbe--active { opacity: 1; }
.courbe--active polyline { stroke-width: 3.5; }
.courbe-0 { color: #1f5d45; }
.courbe-1 { color: #c9a227; }
.courbe-2 { color: #3b7ea1; }
.courbe-3 { color: #b3263a; }
.courbe-4 { color: #7a5c99; }
.courbe-5 { color: #8aa05b; }
.courbe-6 { color: #d9822b; }
.courbe-7 { color: #5b6660; }
.courbe-8 { color: #6fb59a; }
.courbe-9 { color: #a05a7a; }
.progression__legende { list-style: none; margin: 12px 0 6px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.progression__equipe {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 4px 10px; font: inherit; font-size: 14px;
    background: var(--papier); border: 1px solid var(--bordure); border-radius: 999px; cursor: pointer;
}
.progression__equipe[aria-pressed="true"] { border-color: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.progression__equipe:focus-visible { outline: 2px solid var(--vert); outline-offset: 2px; }
.progression__trait { display: inline-block; width: 18px; height: 0; border-top: 3px solid; color: inherit; }
.progression__equipe .progression__trait { border-top-color: currentColor; }
.progression__equipe.courbe--pointille .progression__trait { border-top-style: dashed; }
.progression__equipe span:not(.progression__trait) { color: var(--encre); }
.progression__valeur { font-variant-numeric: tabular-nums; color: var(--encre-douce) !important; font-size: 13px; }
.texte-attenue { color: var(--encre-douce); }

/* v0.21 : sélecteur du journal */
.selecteur-journal { margin-bottom: 12px; gap: 12px; }
.selecteur-journal__champs { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.selecteur-journal__champs .champ { margin-bottom: 0; }
.selecteur-journal__champs select, .selecteur-journal__champs input { width: 100%; }
.selecteur-journal__texte { grid-column: span 2; }
@media (max-width: 560px) { .selecteur-journal__texte { grid-column: auto; } }