/* reSCORE — Tournoi à poules + bracket (Coupe du Monde / Euro / Nations)
   Style « data-dense » éditorial : surfaces nettes, accent sobre, chiffres
   tabulaires, états clairs. Responsive mobile-first, focus-visible, reduced-motion. */

.rs-tournament {
  --tn-accent:#1d4ed8; --tn-accent-2:#2563eb; --tn-accent-weak:#eef3ff;
  --tn-ok:#15803d; --tn-ok-weak:#ecfdf3;
  --tn-third:#b45309; --tn-third-weak:#fff8ec;
  --tn-diff:#a87900;
  --tn-danger:#b91c1c;
  --tn-ink:#0f172a; --tn-mut:#64748b; --tn-faint:#94a3b8;
  --tn-line:#e6e8ee; --tn-line-soft:#f1f3f7; --tn-surface:#fff; --tn-raised:#f8fafc;
  --tn-r:12px; --tn-r-sm:9px;
  --tn-sh:0 1px 2px rgba(15,23,42,.04), 0 1px 3px rgba(15,23,42,.06);
  --tn-sh-lift:0 4px 14px rgba(15,23,42,.08);
  color:var(--tn-ink);
  -webkit-text-size-adjust:100%;
}
.rs-tournament *,
.rs-tournament *::before,
.rs-tournament *::after { box-sizing:border-box; }
.rs-tournament__loading { padding:34px; text-align:center; color:var(--tn-mut); font-style:italic; }

/* Icône SVG inline alignée au texte */
.rs-tn-ico { flex:0 0 auto; vertical-align:-2px; }

/* Focus clavier homogène sur tous les contrôles du composant */
.rs-tournament button:focus-visible,
.rs-tournament select:focus-visible,
.rs-tournament [tabindex]:focus-visible {
  outline:2px solid var(--tn-accent-2); outline-offset:2px; border-radius:8px;
}

/* ── Mods-bar : sélection / création de scénarios ───────────────────────── */
.rs-tn-modsbar {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  background:var(--tn-raised); border:1px solid var(--tn-line);
  border-radius:var(--tn-r); padding:9px 12px; margin-bottom:14px;
}
.rs-tn-modsbar__lbl { font-weight:800; font-size:.68rem; text-transform:uppercase; letter-spacing:.07em; color:var(--tn-mut); }
.rs-tn-scenario {
  flex:1 1 200px; max-width:380px; min-width:0; padding:8px 30px 8px 11px;
  border:1px solid var(--tn-line); border-radius:var(--tn-r-sm); background:var(--tn-surface);
  font-weight:600; font-size:.85rem; color:var(--tn-ink); cursor:pointer;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 9px center;
}
.rs-tn-newscenario {
  flex:0 0 auto; cursor:pointer; border:1px dashed var(--tn-accent); background:var(--tn-surface);
  color:var(--tn-accent); font-weight:800; font-size:.8rem; padding:8px 13px; border-radius:var(--tn-r-sm);
  transition:background .18s, color .18s, border-style .18s;
}
.rs-tn-newscenario:hover { background:var(--tn-accent); color:#fff; border-style:solid; }

/* ── Jauge fine (style Duels) : % à gauche, xx/yyy matchs à droite ──────── */
.rs-tn-gauge { display:flex; align-items:center; gap:12px; margin:2px 0 14px; }
.rs-tn-gauge__pct { flex:0 0 auto; font-weight:800; font-size:.82rem; color:var(--tn-accent); min-width:40px; font-variant-numeric:tabular-nums; }
.rs-tn-gauge__track { flex:1 1 auto; height:7px; border-radius:99px; background:#e9ecf3; overflow:hidden; }
.rs-tn-gauge__fill { display:block; height:100%; border-radius:99px;
  background:linear-gradient(90deg, var(--tn-accent), var(--tn-accent-2)); transition:width .4s ease; }
.rs-tn-gauge.is-full .rs-tn-gauge__pct { color:var(--tn-ok); }
.rs-tn-gauge.is-full .rs-tn-gauge__fill { background:linear-gradient(90deg,#16a34a,var(--tn-ok)); }
.rs-tn-gauge__count { flex:0 0 auto; font-weight:700; font-size:.78rem; color:var(--tn-mut); white-space:nowrap; font-variant-numeric:tabular-nums; }

/* ── Barre d'actions (points + partage) ──────────────────────────────────── */
.rs-tn-actions { display:flex; align-items:center; gap:10px; margin-bottom:18px; flex-wrap:wrap; }
.rs-tn-points {
  flex:0 0 auto; margin-left:auto; display:inline-flex; align-items:center; gap:7px;
  background:var(--tn-third-weak); border:1px solid #f3dca0; color:#92600f; font-weight:700;
  font-size:.85rem; padding:8px 13px; border-radius:var(--tn-r-sm); white-space:nowrap;
}
.rs-tn-points b { font-variant-numeric:tabular-nums; }
/* Barre Scénario version invité (déconnecté) : juste les points, alignés à droite. */
.rs-tn-modsbar--guest { justify-content:flex-end; }
/* Score FIGÉ d'un match terminé (résultat officiel, pas de boutons +/−). */
.rs-tn-score--locked {
  padding:3px 11px; border-radius:8px; gap:6px;
  background:var(--tn-accent-weak); border:1px solid #cdd9f7;
}
.rs-tn-score--locked .rs-tn-score__n { color:var(--tn-ink); }
/* Badge « terminé » : le vrai match est joué (état officiel). */
.rs-tn-term {
  display:inline-flex; align-items:center; flex:0 0 auto;
  font-size:.72rem; font-weight:800; letter-spacing:.02em;
  color:var(--tn-accent); background:var(--tn-accent-weak); border:1px solid #cdd9f7;
  border-radius:7px; padding:5px 10px; white-space:nowrap;
}
/* Valeur du PRONO entre parenthèses (plus petite), à côté de la valeur
   officielle dans les colonnes J / Pts / Diff du tableau de groupe. */
.rs-tn-prono-val {
  margin-left:3px; font-size:.72em; font-weight:700;
  color:var(--tn-faint); font-variant-numeric:tabular-nums;
}
.rs-tn-pts .rs-tn-prono-val { color:var(--tn-faint); }

/* « Ton prono : X–Y » + gagné/perdu, CENTRÉ sous un match terminé — les deux
   blocs (libellé + résultat) côte à côte. */
.rs-tn-prono {
  display:flex; flex-direction:row; align-items:center; justify-content:center;
  gap:10px; flex-wrap:wrap; text-align:center;
  margin:-4px 0 10px; padding:7px 12px;
  background:var(--tn-line-soft); border:1px solid var(--tn-line); border-top:0;
  border-radius:0 0 var(--tn-r-sm) var(--tn-r-sm);
}
.rs-tn-prono__lbl { font-size:.82rem; color:var(--tn-mut); }
.rs-tn-prono__lbl b { color:var(--tn-ink); font-variant-numeric:tabular-nums; }
.rs-tn-prono__win {
  display:inline-flex; align-items:center; flex:0 0 auto; font-size:.8rem; font-weight:800;
  color:#0f6e56; background:#ecfdf3; border:1px solid #b7e9cd; border-radius:8px; padding:4px 11px; white-space:nowrap;
}
.rs-tn-prono__lose {
  display:inline-flex; align-items:center; flex:0 0 auto; font-size:.8rem; font-weight:700;
  color:var(--tn-mut); background:var(--tn-surface); border:1px solid var(--tn-line); border-radius:8px; padding:4px 11px; white-space:nowrap;
}
.rs-tn-prono__none { font-size:.78rem; color:var(--tn-faint); font-style:italic; }
/* Score KO officiel (vrai match) : lecture seule, pas de steppers. */
.rs-tn-ko-score--official { display:inline-flex; align-items:center; justify-content:center; min-width:34px; }
.rs-tn-ko-score--official b { font-variant-numeric:tabular-nums; }
/* Score des tirs au but, à droite du score de jeu sur la ligne de l'équipe. */
.rs-tn-pso { margin-left:4px; font-size:.72rem; font-weight:700; color:var(--tn-accent);
  font-variant-numeric:tabular-nums; }
/* Ton prono KO, entre parenthèses à côté du vrai score une fois le match joué. */
.rs-tn-ko-pred { margin-left:3px; font-size:.72rem; font-weight:600; opacity:.6;
  font-variant-numeric:tabular-nums; }
.rs-tn-ko-score--official { gap:2px; }

/* Buteurs / cartons d'un match terminé (CDM & tournois) — esprit Ligue 1.
   Attaché sous le match : domicile à droite, extérieur à gauche. */
.rs-tn-evrow {
  display:grid; grid-template-columns:1fr 1fr; gap:5px 14px;
  margin:-4px 0 0; padding:8px 12px;
  background:var(--tn-line-soft); border:1px solid var(--tn-line); border-top:0;
}
.rs-tn-match.is-terminated + .rs-tn-evrow { /* dernier bloc si pas de prono après */ }
.rs-tn-evcol { display:flex; flex-direction:column; gap:4px; min-width:0; }
.rs-tn-evcol--home { align-items:flex-end;   text-align:right; }
.rs-tn-evcol--away { align-items:flex-start; text-align:left; }
.rs-tn-cap {
  display:inline-flex; align-items:baseline; gap:5px; max-width:100%;
  font-size:.78rem; color:var(--tn-ink); line-height:1.25;
}
.rs-tn-evcol--home .rs-tn-cap { flex-direction:row-reverse; } /* icône vers le score */
.rs-tn-cap__ic { flex:0 0 auto; font-size:.82em; }
.rs-tn-cap__nm { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.rs-tn-cap__min { flex:0 0 auto; color:var(--tn-mut); font-size:.72rem; font-variant-numeric:tabular-nums; }
.rs-tn-cap--og .rs-tn-cap__nm,
.rs-tn-cap--red .rs-tn-cap__nm { color:var(--tn-mut); }
.rs-tn-share {
  display:inline-flex; align-items:center; gap:7px; flex:0 0 auto; cursor:pointer; border:0;
  border-radius:var(--tn-r-sm); padding:9px 16px;
  background:var(--tn-accent); color:#fff; font-weight:800; font-size:.85rem;
  transition:filter .15s, transform .05s; white-space:nowrap; box-shadow:var(--tn-sh);
}
.rs-tn-share:hover { filter:brightness(1.07); }
.rs-tn-share:active { transform:translateY(1px); }
.rs-tn-actions .rs-tn-share--main { margin-left:auto; }
/* Bouton « Partager le groupe » : n'apparaît qu'une fois la poule validée →
   on le rend remarquable (vert validation, halo pulsé) pour inviter au partage. */
.rs-tn-share-group {
  padding:9px 15px; font-size:.84rem;
  background:linear-gradient(135deg,#16a34a,#15803d);
  box-shadow:0 2px 8px rgba(21,128,61,.32);
  animation:rs-tn-share-pulse 2.4s ease-out infinite;
}
.rs-tn-share-group:hover { filter:brightness(1.06); }
.rs-tn-share-group .rs-tn-ico { width:15px; height:15px; }
@keyframes rs-tn-share-pulse {
  0%   { box-shadow:0 0 0 0 rgba(22,163,74,.5), 0 2px 8px rgba(21,128,61,.32); }
  70%  { box-shadow:0 0 0 12px rgba(22,163,74,0), 0 2px 8px rgba(21,128,61,.32); }
  100% { box-shadow:0 0 0 0 rgba(22,163,74,0), 0 2px 8px rgba(21,128,61,.32); }
}
@media (prefers-reduced-motion: reduce) {
  .rs-tn-share-group { animation:none; }
}

/* ── Onglets de poules (scroll horizontal + snap) ───────────────────────── */
.rs-tn-pooltabs {
  display:flex; align-items:center; gap:6px; overflow-x:auto; padding:4px 2px 12px;
  scrollbar-width:thin; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity;
}
.rs-tn-pooltabs::-webkit-scrollbar { height:6px; }
.rs-tn-pooltabs::-webkit-scrollbar-thumb { background:#d6dae3; border-radius:99px; }
.rs-tn-pooltabs__lbl {
  flex:0 0 auto; font-weight:800; font-size:1.05rem; letter-spacing:-.01em;
  color:var(--tn-ink); margin-right:8px; position:sticky; left:0;
}
.rs-tn-pooltab {
  flex:0 0 auto; scroll-snap-align:start; cursor:pointer; border:1px solid var(--tn-line); background:var(--tn-surface);
  border-radius:var(--tn-r-sm); padding:8px 0; min-width:42px; text-align:center;
  font-weight:800; font-size:.85rem; color:#475569;
  white-space:nowrap; transition:background .15s, color .15s, border-color .15s, box-shadow .15s;
}
.rs-tn-pooltab:hover { background:var(--tn-accent-weak); border-color:#cdd9f7; }
.rs-tn-pooltab.is-active { background:var(--tn-accent); border-color:var(--tn-accent); color:#fff; box-shadow:var(--tn-sh); }
.rs-tn-pooltab.is-done { border-color:#bbe3c8; color:var(--tn-ok); }
.rs-tn-pooltab.is-done.is-active { background:var(--tn-ok); border-color:var(--tn-ok); color:#fff; }

/* ── Accordéons (Groupes / 3es) : en-tête cliquable + chevron ─────────────── */
.rs-tn-groups-toggle, .rs-tn-thirds-toggle {
  appearance:none; -webkit-appearance:none; background:none; border:0; cursor:pointer;
  font:inherit; text-align:left; color:inherit;
}
/* En-tête « Groupes » (bouton) : reste sticky comme l'ancien label. */
.rs-tn-groups-toggle { display:inline-flex; align-items:center; gap:6px; }
.rs-tn-groups-toggle:hover .rs-tn-caret,
.rs-tn-thirds-toggle:hover .rs-tn-caret { border-color:var(--tn-accent); }
/* Chevron : ▸ replié / ▾ déplié (rotation). */
.rs-tn-caret {
  display:inline-block; width:8px; height:8px; flex:0 0 auto; margin-left:2px;
  border-right:2px solid var(--tn-faint); border-bottom:2px solid var(--tn-faint);
  transform:rotate(-45deg); transition:transform .18s;
}
.rs-tn-pooltabs:not(.is-collapsed) .rs-tn-caret,
.rs-tn-thirds:not(.is-collapsed) .rs-tn-caret { transform:rotate(45deg); }
/* Replié : l'en-tête « Groupes » se pose au-dessus des lettres restées visibles. */
.rs-tn-pooltabs.is-collapsed { padding-bottom:8px; }

/* ── Poule ───────────────────────────────────────────────────────────────── */
.rs-tn-pool { border:1px solid var(--tn-line); border-radius:var(--tn-r); padding:14px 16px 10px; margin-bottom:18px; background:var(--tn-surface); box-shadow:var(--tn-sh); }
.rs-tn-pool.rs-pool--done { border-color:#bbe3c8; box-shadow:inset 0 0 0 1px rgba(21,128,61,.18), var(--tn-sh); background:linear-gradient(180deg,#f6fdf9,#fff 90px); }
.rs-tn-pool__head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.rs-tn-pool__title { margin:0; font-size:1.06rem; font-weight:800; letter-spacing:-.01em; }
.rs-tn-badge {
  display:inline-flex; align-items:center; gap:4px; font-size:.64rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  color:#fff; background:var(--tn-ok); border-radius:6px; padding:3px 8px; vertical-align:middle; margin-left:6px;
}

.rs-tn-table { width:100%; border-collapse:collapse; font-size:.9rem; }
.rs-tn-table th { text-align:left; font-size:.66rem; text-transform:uppercase; letter-spacing:.05em; color:var(--tn-faint); font-weight:800; padding:4px 8px 8px; border-bottom:1px solid var(--tn-line); }
.rs-tn-table td { padding:9px 8px; border-bottom:1px solid var(--tn-line-soft); }
.rs-tn-table th:first-child, .rs-tn-table td:first-child { width:30px; text-align:center; color:var(--tn-faint); font-weight:800; }
.rs-tn-table th:nth-child(n+3), .rs-tn-table td:nth-child(n+3) { text-align:right; font-variant-numeric:tabular-nums; }
.rs-tn-pts { font-weight:800; color:var(--tn-accent); }
.rs-tn-row { cursor:pointer; transition:background .14s; }
.rs-tn-row:hover { background:var(--tn-accent-weak); }
.rs-tn-row.is-expanded { background:var(--tn-accent-weak); }
.rs-tn-row.is-expanded td { border-bottom-color:transparent; }
.rs-tn-row--qual td:first-child { box-shadow:inset 3px 0 0 var(--tn-ok); background:var(--tn-ok-weak); }
.rs-tn-row--third td:first-child { box-shadow:inset 3px 0 0 var(--tn-third); background:var(--tn-third-weak); }

/* ── Classement des 3es (repêchage), entre les poules et le bracket ───────── */
.rs-tn-thirds { margin:18px 0 6px; }
.rs-tn-thirds__head { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; width:100%; margin-bottom:8px; }
.rs-tn-thirds__title { margin:0; font-size:1.02rem; font-weight:800; }
.rs-tn-thirds__sub { font-size:.74rem; color:var(--tn-mut); }
.rs-tn-thirds__head .rs-tn-caret { margin-left:auto; align-self:center; }
.rs-tn-thirds.is-collapsed .rs-tn-thirds__head { margin-bottom:0; }
.rs-tn-thirds__table { max-width:560px; }
.rs-tn-thirds__table th:nth-child(3), .rs-tn-thirds__table td:nth-child(3) { text-align:center; }
.rs-tn-thirds__grp { font-weight:800; color:var(--tn-faint); font-size:.8rem; }
.rs-tn-thirds__row.is-q td:first-child { box-shadow:inset 3px 0 0 var(--tn-ok); background:var(--tn-ok-weak); }
.rs-tn-thirds__row:not(.is-q) { opacity:.55; }
.rs-tn-thirds__row.is-prono .rs-tn-team__name { font-style:italic; color:var(--tn-mut); }
.rs-tn-thirds__tag { margin-left:6px; font-size:.6rem; font-weight:800; text-transform:uppercase; letter-spacing:.03em; color:var(--tn-faint); border:1px solid var(--tn-line); border-radius:5px; padding:1px 5px; vertical-align:1px; }
.rs-tn-thirds__bar td { padding:0; border:0; }
.rs-tn-thirds__bar span { display:flex; align-items:center; gap:8px; margin:4px 0; font-size:.6rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--tn-third); }
.rs-tn-thirds__bar span::before, .rs-tn-thirds__bar span::after { content:""; flex:1; height:1px; background:var(--tn-third); opacity:.4; }

.rs-tn-team { display:inline-flex; align-items:center; gap:9px; min-width:0; }
.rs-tn-team__flag { width:24px; height:17px; object-fit:cover; border-radius:3px; flex:0 0 auto; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.rs-tn-team__dot { width:13px; height:13px; border-radius:50%; flex:0 0 auto; box-shadow:0 0 0 1px rgba(0,0,0,.06); }
.rs-tn-team__name { font-weight:600; overflow:hidden; text-overflow:ellipsis; }
/* Qualifié RÉEL ≠ celui imaginé (prono) → nom en jaune + affordance tooltip
   (« Tu avais imaginé : … » au survol / focus). */
.rs-tn-team__name--diff {
  color:var(--tn-diff); font-weight:800;
  text-decoration:underline dotted var(--tn-diff); text-underline-offset:2px;
  cursor:help;
}
.rs-tn-team--tbd { color:var(--tn-faint); font-style:italic; font-weight:600; }
/* Prono qui tombe juste (bien placé) → nom en vert + ✓. */
.rs-tn-team__name--ok { color:var(--tn-ok); font-weight:800; }
.rs-tn-team__ok { color:var(--tn-ok); font-weight:800; flex:0 0 auto; margin-left:1px; }
.rs-tn-row--ok td:first-child { box-shadow:inset 3px 0 0 var(--tn-ok); }

/* Légende des zones */
.rs-tn-legend { display:flex; flex-wrap:wrap; gap:6px 16px; padding:10px 8px 2px; }
.rs-tn-legend__i { display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:600; color:var(--tn-mut); }
.rs-tn-legend__dot { width:10px; height:10px; border-radius:3px; flex:0 0 auto; }
.rs-tn-legend__dot--qual { background:var(--tn-ok); }
.rs-tn-legend__dot--third { background:var(--tn-third); }

.rs-tn-hint { color:var(--tn-faint); font-size:.82rem; font-style:italic; margin:4px 2px 6px; }

/* Matchs dépliés sous la ligne du pays (inline dans le tableau) */
.rs-tn-expandrow > td { padding:0 4px 10px; background:var(--tn-accent-weak); }
.rs-tn-expandrow .rs-tn-matches { border-top:none; margin-top:0; padding-top:8px; }
.rs-tn-expandrow .rs-tn-matches h4 { margin-top:0; }

/* ── Matchs d'une équipe ─────────────────────────────────────────────────── */
.rs-tn-matches { margin-top:12px; border-top:1px dashed var(--tn-line); padding-top:10px; }
.rs-tn-matches h4 { margin:0 0 8px; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--tn-mut); font-weight:800; }
.rs-tn-match {
  display:grid; grid-template-columns:62px 1fr auto 1fr auto; align-items:center; gap:10px;
  padding:9px 10px; border-radius:var(--tn-r-sm); background:var(--tn-surface); border:1px solid var(--tn-line);
}
.rs-tn-match + .rs-tn-match { margin-top:6px; }
.rs-tn-match.is-done { background:var(--tn-ok-weak); border-color:#cdeed8; }
.rs-tn-match__date { font-size:.7rem; font-weight:700; color:var(--tn-mut); white-space:nowrap; text-align:left; font-variant-numeric:tabular-nums; }
.rs-tn-match__team--away { justify-self:start; }
.rs-tn-match__team--home { justify-self:end; }
.rs-tn-match__team--home .rs-tn-team { flex-direction:row-reverse; }
.rs-tn-score { display:inline-flex; align-items:center; gap:5px; }
.rs-tn-score__n { min-width:18px; text-align:center; font-size:1.08rem; font-weight:800; font-variant-numeric:tabular-nums; }
.rs-tn-score__sep { color:var(--tn-faint); margin:0 1px; }
/* Côté équipe = nom + son score, groupés. Permet le reflow mobile « nom du
   pays AU-DESSUS de son score » (cf. media 560px) sans toucher au desktop. */
.rs-tn-side { display:inline-flex; align-items:center; gap:9px; min-width:0; }
.rs-tn-side--home { justify-self:end; }
.rs-tn-side--away { justify-self:start; }
.rs-tn-sc { display:inline-flex; align-items:center; gap:5px; flex:0 0 auto; }
.rs-tn-sc--locked { min-width:20px; justify-content:center; }
.rs-tn-vs { color:var(--tn-faint); margin:0 1px; align-self:center; }
.rs-tn-step, .rs-tn-kostep {
  width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--tn-line); background:var(--tn-surface); border-radius:7px;
  cursor:pointer; font-weight:800; line-height:1; color:#475569; font-size:1rem;
  transition:background .14s, color .14s, border-color .14s;
}
.rs-tn-step:hover, .rs-tn-kostep:hover { background:var(--tn-accent); color:#fff; border-color:var(--tn-accent); }
.rs-tn-done { border:1px solid var(--tn-line); background:var(--tn-surface); border-radius:7px; padding:6px 11px; font-size:.74rem; font-weight:700; cursor:pointer; color:var(--tn-mut); white-space:nowrap; transition:background .14s, color .14s, border-color .14s; }
.rs-tn-done:hover { border-color:var(--tn-ok); color:var(--tn-ok); }
.rs-tn-done.is-on { background:var(--tn-ok); border-color:var(--tn-ok); color:#fff; }

/* Actions de match (joué + partager) */
.rs-tn-match__actions { display:inline-flex; align-items:center; gap:6px; }
.rs-tn-share-match {
  width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--tn-line); background:var(--tn-surface); border-radius:7px;
  cursor:pointer; color:var(--tn-accent); transition:background .14s, color .14s, border-color .14s;
}
.rs-tn-share-match:hover { background:var(--tn-accent); color:#fff; border-color:var(--tn-accent); }
.rs-tn-help {
  width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--tn-line); background:var(--tn-surface); border-radius:7px;
  cursor:pointer; color:var(--tn-mut); transition:background .14s, color .14s, border-color .14s;
}
.rs-tn-help:hover { background:var(--tn-accent-weak); color:var(--tn-accent); border-color:var(--tn-accent); }

/* ── Bracket ─────────────────────────────────────────────────────────────── */
.rs-tn-bracket { margin-top:26px; }
.rs-tn-bracket__topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 12px; }
.rs-tn-bracket__title { font-size:1.06rem; font-weight:800; letter-spacing:-.01em; margin:0; }
/* Bascule segmentée « Ma prédiction / Réalité » */
/* Mode d'affichage GLOBAL de la page (Réalité / Ma prédiction), avant les groupes. */
.rs-tn-pageview { display:flex; align-items:center; gap:10px; margin:0 0 14px; }
.rs-tn-pageview__lbl { font-weight:800; font-size:.68rem; text-transform:uppercase; letter-spacing:.07em; color:var(--tn-mut); }
.rs-tn-viewtoggle { display:inline-flex; gap:2px; padding:3px; background:var(--tn-raised); border:1px solid var(--tn-line); border-radius:999px; }
.rs-tn-vbtn {
  appearance:none; -webkit-appearance:none; cursor:pointer; border:0; background:none;
  padding:5px 13px; border-radius:999px; font-weight:800; font-size:.76rem; color:var(--tn-mut);
  transition:background .15s, color .15s, box-shadow .15s;
}
.rs-tn-vbtn:hover { color:var(--tn-accent); }
.rs-tn-vbtn.is-active { background:var(--tn-surface); color:var(--tn-accent); box-shadow:var(--tn-sh); }
.rs-tn-bracket__cols {
  position:relative; display:flex; gap:18px; overflow-x:auto; padding-bottom:14px; align-items:stretch;
  scroll-snap-type:x proximity; scrollbar-width:thin;
}
.rs-tn-bracket__cols::-webkit-scrollbar { height:7px; }
.rs-tn-bracket__cols::-webkit-scrollbar-thumb { background:#d6dae3; border-radius:99px; }
/* Connecteurs SVG : derrière les colonnes, dimensionné en JS. */
.rs-tn-bracket__svg { position:absolute; top:0; left:0; pointer-events:none; z-index:0; overflow:visible; }
.rs-tn-bracket__svg path { fill:none; stroke:#cdd5e1; stroke-width:2; }
.rs-tn-bracket__col { position:relative; z-index:1; flex:0 0 212px; display:flex; flex-direction:column; scroll-snap-align:start; }
.rs-tn-bracket__round { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--tn-faint); margin-bottom:10px; }
/* Chaque tie centré entre les 2 du tour précédent (finale centrée vs 16es). */
.rs-tn-bracket__ties { flex:1 1 auto; display:flex; flex-direction:column; justify-content:space-around; min-height:0; }
.rs-tn-tie { border:1px solid var(--tn-line); border-radius:var(--tn-r-sm); overflow:hidden; background:var(--tn-surface); box-shadow:var(--tn-sh); transition:box-shadow .15s, border-color .15s, opacity .15s; margin-bottom:10px; }
.rs-tn-tie.is-locked { opacity:.55; box-shadow:none; }
.rs-tn-tie.is-done { border-color:var(--tn-accent); box-shadow:var(--tn-sh-lift); }
.rs-tn-tie__line { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 10px; }
.rs-tn-tie__line + .rs-tn-tie__line { border-top:1px solid var(--tn-line-soft); }
.rs-tn-tie__line.is-winner { background:var(--tn-accent-weak); font-weight:700; box-shadow:inset 3px 0 0 var(--tn-accent); }
.rs-tn-ko-score { display:inline-flex; align-items:center; gap:4px; }
.rs-tn-ko-score b { min-width:15px; text-align:center; font-variant-numeric:tabular-nums; }

/* Créneau pas encore officiel : « ? (prono) ». Le « ? » = place inconnue, le
   nom entre parenthèses = ton pronostic ; barré s'il est devenu impossible. */
.rs-tn-team--guess { color:var(--tn-mut); }
.rs-tn-q { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; flex:0 0 auto; border-radius:50%; border:1.5px solid var(--tn-faint); color:var(--tn-faint); font-size:.66rem; font-weight:800; }
.rs-tn-team--guess .rs-tn-team__flag { opacity:.7; }
.rs-tn-guess { font-size:.84em; color:var(--tn-mut); font-style:italic; }
.rs-tn-guess__name { font-style:italic; }
.rs-tn-guess__name.is-out { text-decoration:line-through; color:var(--tn-faint); opacity:.8; }

/* En-tête d'un tie KO : date (gauche) + bouton activer/désactiver (droite) */
.rs-tn-tie__head { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:5px 10px 3px; border-bottom:1px solid var(--tn-line-soft); min-height:20px; }
.rs-tn-tie__date { font-size:.62rem; font-weight:800; color:var(--tn-faint); letter-spacing:.02em; font-variant-numeric:tabular-nums; }
.rs-tn-tie__toggle {
  flex:0 0 auto; width:19px; height:19px; display:inline-flex; align-items:center; justify-content:center; line-height:1; padding:0;
  border:1px solid var(--tn-line); background:var(--tn-surface); color:var(--tn-danger);
  border-radius:6px; cursor:pointer; font-size:.7rem; font-weight:800; transition:background .14s, color .14s, border-color .14s;
}
.rs-tn-tie__toggle:hover { background:var(--tn-danger); border-color:var(--tn-danger); color:#fff; }
.rs-tn-tie__toggle.is-off { color:var(--tn-ok); }
.rs-tn-tie__toggle.is-off:hover { background:var(--tn-ok); border-color:var(--tn-ok); color:#fff; }

/* Match KO désactivé : grisé (lui + ses incidences en aval) ; bouton cliquable */
.rs-tn-tie.is-disabled { opacity:.42; filter:grayscale(1); box-shadow:none; }
.rs-tn-tie.is-disabled .rs-tn-tie__toggle { cursor:pointer; }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width:768px) {
  /* Coupe du Monde / Euro / Nations : gutter latéral en mobile, aligné sur le
     reste des pages football (#fbs-app = 14px). Sans ça, les poules/tableaux
     collent aux bords car .rs-front passe pleine largeur sous 760px. */
  .rs-tournament { padding-inline:14px; }
  /* Onglets de poule : « Groupe » AU-DESSUS des boutons (et non à gauche) en
     mobile — le label prend toute la ligne, les boutons passent dessous. */
  .rs-tn-pooltabs { flex-wrap:wrap; }
  .rs-tn-pooltabs__lbl { flex-basis:100%; position:static; margin:0 0 6px; }
  .rs-tn-pool { padding:12px 12px 8px; }
  .rs-tn-table { font-size:.86rem; }
  .rs-tn-table th, .rs-tn-table td { padding:8px 6px; }
  .rs-tn-team__name { max-width:42vw; white-space:nowrap; }
  .rs-tn-bracket__col { flex-basis:184px; }
  .rs-tn-actions .rs-tn-share--main { margin-left:0; }
  .rs-tn-share, .rs-tn-points { flex:1 1 auto; justify-content:center; }
}
@media (max-width:560px) {
  .rs-tn-match { grid-template-columns:1fr auto 1fr; padding:9px 8px; column-gap:6px; }
  .rs-tn-match__date { grid-column:1 / -1; text-align:center; order:-1; margin-bottom:2px; }
  .rs-tn-match__actions { grid-column:1 / -1; justify-content:center; margin-top:6px; }
  /* Match déplié : chaque sélection passe en COLONNE → drapeau · pays · score.
     Évite la ligne unique trop large (2 noms + 6 boutons côte à côte). */
  .rs-tn-side, .rs-tn-side--home, .rs-tn-side--away { flex-direction:column; align-items:center; gap:5px; justify-self:center; min-width:0; }
  /* Côté droit : le markup place le score AVANT l'équipe → on inverse pour
     obtenir le MÊME ordre que la gauche (drapeau · pays · score). */
  .rs-tn-side--away { flex-direction:column-reverse; }
  .rs-tn-side--home .rs-tn-team { flex-direction:column; }
  .rs-tn-side--away .rs-tn-team { flex-direction:column; }
  .rs-tn-team { text-align:center; }
  .rs-tn-team__name { max-width:40vw; white-space:normal; line-height:1.15; }
  .rs-tn-modsbar { padding:9px 10px; }
  .rs-tn-scenario { flex-basis:100%; max-width:none; }
}

/* Respect du réglage système « réduire les animations » */
@media (prefers-reduced-motion:reduce) {
  .rs-tournament *,
  .rs-tournament *::before,
  .rs-tournament *::after { transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

/* ── Aide au choix : modale H2H d'un match (montée sur <body>) ───────────────
   Tokens propres (la modale est hors .rs-tournament) + override thème sombre. */
.rs-h2h-overlay {
  --h2h-surface:#fff; --h2h-ink:#0f172a; --h2h-mut:#64748b;
  --h2h-line:#e6e8ee; --h2h-raised:#f6f8fc;
  --h2h-a:#15803d; --h2h-n:#94a3b8; --h2h-b:#b91c1c;
  position:fixed; inset:0; z-index:100000;
  display:flex; align-items:center; justify-content:center;
  padding:18px; background:rgba(8,12,20,.62);
  opacity:0; transition:opacity .2s ease;
  -webkit-font-smoothing:antialiased;
}
.rs-h2h-overlay.is-visible { opacity:1; }
html[data-theme="dark"] .rs-h2h-overlay {
  --h2h-surface:#161b22; --h2h-ink:#e8edf3; --h2h-mut:#9aa6b2;
  --h2h-line:#2a323c; --h2h-raised:#1d242c;
  --h2h-a:#3fb96b; --h2h-n:#8a97a4; --h2h-b:#e15b5b;
}
body.rs-h2h-open { overflow:hidden; }

.rs-h2h-modal {
  position:relative; width:100%; max-width:460px; max-height:88vh; overflow:auto;
  background:var(--h2h-surface); color:var(--h2h-ink);
  border:1px solid var(--h2h-line); border-radius:16px;
  box-shadow:0 18px 50px rgba(8,12,20,.4);
  padding:22px 20px 18px;
  transform:translateY(10px) scale(.98); transition:transform .2s ease;
}
.rs-h2h-overlay.is-visible .rs-h2h-modal { transform:none; }
.rs-h2h-close {
  position:absolute; top:10px; right:10px; width:34px; height:34px;
  display:inline-flex; align-items:center; justify-content:center;
  border:0; background:transparent; color:var(--h2h-mut); cursor:pointer;
  border-radius:9px; transition:background .14s, color .14s;
}
.rs-h2h-close:hover { background:var(--h2h-raised); color:var(--h2h-ink); }
.rs-h2h__loading { padding:30px; text-align:center; color:var(--h2h-mut); font-style:italic; }
.rs-h2h__empty   { padding:24px 6px; text-align:center; color:var(--h2h-mut); }

.rs-h2h__head {
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px;
  margin:2px 0 16px;
}
.rs-h2h__team { display:flex; flex-direction:column; align-items:center; gap:7px; min-width:0; }
.rs-h2h__logo {
  width:48px; height:48px; object-fit:contain; border-radius:8px;
}
.rs-h2h__logo--ph {
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--h2h-raised); color:var(--h2h-mut);
  font-weight:800; font-size:1.1rem; border:1px solid var(--h2h-line);
}
.rs-h2h__name { font-weight:800; font-size:.92rem; text-align:center; line-height:1.2; }
/* Rang FIFA (sélections) : petite ligne sous le nom de pays (team en colonne). */
.rs-h2h__fifa { font-size:.64rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--tn-faint,#8a8a8a); }
.rs-h2h__mid  { display:flex; flex-direction:column; align-items:center; gap:2px; }
.rs-h2h__vs   { font-weight:900; font-size:.78rem; letter-spacing:.08em; color:var(--h2h-mut); }
.rs-h2h__count{ font-size:.7rem; color:var(--h2h-mut); white-space:nowrap; }

.rs-h2h__gauge {
  display:flex; height:12px; border-radius:99px; overflow:hidden;
  background:var(--h2h-raised); border:1px solid var(--h2h-line);
}
.rs-h2h__bar { height:100%; min-width:2px; }
.rs-h2h__bar--a { background:var(--h2h-a); }
.rs-h2h__bar--n { background:var(--h2h-n); }
.rs-h2h__bar--b { background:var(--h2h-b); }
.rs-h2h__legend { display:flex; justify-content:space-between; gap:8px; margin:7px 1px 16px; font-size:.74rem; color:var(--h2h-mut); }
.rs-h2h__leg b { color:var(--h2h-ink); }
.rs-h2h__leg--a b { color:var(--h2h-a); }
.rs-h2h__leg--b b { color:var(--h2h-b); }
.rs-h2h__leg--b { text-align:right; }
.rs-h2h__leg--n { text-align:center; }

.rs-h2h__matches { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; }
.rs-h2h__m {
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px;
  padding:8px 10px; border:1px solid var(--h2h-line); border-left-width:3px;
  border-radius:9px; background:var(--h2h-raised);
}
.rs-h2h__m--a { border-left-color:var(--h2h-a); }
.rs-h2h__m--b { border-left-color:var(--h2h-b); }
.rs-h2h__m--n { border-left-color:var(--h2h-n); }
.rs-h2h__m-year { font-variant-numeric:tabular-nums; font-weight:700; font-size:.8rem; color:var(--h2h-mut); }
.rs-h2h__m-comp {
  font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  color:var(--h2h-mut); line-height:1.3; overflow:hidden;
}
/* Phase du match (Coupe du Monde · 8e de finale) : sous-libellé non capitalisé,
   légèrement atténué, peut passer à la ligne sur mobile sans tronquer. */
.rs-h2h__m-phase { font-weight:600; text-transform:none; letter-spacing:0; opacity:.85; }
.rs-h2h__m-score { display:inline-flex; align-items:center; gap:4px; font-variant-numeric:tabular-nums; }
.rs-h2h__m-score b { font-size:.96rem; font-weight:800; color:var(--h2h-mut); min-width:14px; text-align:center; }
.rs-h2h__m-score b.is-win { color:var(--h2h-ink); }
.rs-h2h__m-score i { color:var(--h2h-mut); font-style:normal; }
.rs-h2h__src { margin:14px 2px 0; font-size:.68rem; color:var(--h2h-mut); text-align:center; }

@media (prefers-reduced-motion:reduce) {
  .rs-h2h-overlay, .rs-h2h-modal { transition-duration:.01ms !important; }
}

/* ── Chooser de style au partage d'un groupe (classique / moderne) ───────── */
.rs-tn-chooser {
  --ch-surface:#fff; --ch-ink:#0f172a; --ch-mut:#64748b; --ch-line:#e6e8ee; --ch-btn:#f1f3f7;
  position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center;
  padding:20px; background:rgba(8,12,20,.55); opacity:0; transition:opacity .2s ease;
  -webkit-font-smoothing:antialiased;
}
.rs-tn-chooser.is-visible { opacity:1; }
html[data-theme="dark"] .rs-tn-chooser {
  --ch-surface:#161b22; --ch-ink:#e8edf3; --ch-mut:#9aa6b2; --ch-line:#2a323c; --ch-btn:#1d242c;
}
.rs-tn-chooser__panel {
  position:relative; width:min(520px,100%); background:var(--ch-surface); color:var(--ch-ink);
  border-radius:18px; box-shadow:0 24px 60px -18px rgba(8,12,20,.5); padding:22px 22px 24px;
  transform:translateY(8px) scale(.98); transition:transform .2s ease;
}
.rs-tn-chooser.is-visible .rs-tn-chooser__panel { transform:none; }
.rs-tn-chooser__close {
  position:absolute; top:14px; right:14px; border:0; background:var(--ch-btn); cursor:pointer;
  width:32px; height:32px; border-radius:9px; color:var(--ch-mut);
  display:flex; align-items:center; justify-content:center;
}
.rs-tn-chooser__close:hover { filter:brightness(.96); }
.rs-tn-chooser__title { margin:2px 0 2px; font-size:1.18rem; font-weight:800; letter-spacing:-.01em; }
.rs-tn-chooser__sub { margin:0 0 18px; font-size:.9rem; color:var(--ch-mut); font-weight:600; }

.rs-tn-styles { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.rs-tn-style {
  cursor:pointer; border:2px solid var(--ch-line); border-radius:14px; overflow:hidden;
  background:var(--ch-surface); padding:0; display:flex; flex-direction:column; text-align:left;
  transition:border-color .15s, box-shadow .15s, transform .05s; color:inherit;
}
.rs-tn-style:hover { border-color:var(--tn-accent); box-shadow:0 8px 22px -10px rgba(29,78,216,.4); }
.rs-tn-style:active { transform:translateY(1px); }
.rs-tn-style__label { display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 13px; font-weight:800; font-size:.92rem; color:var(--ch-ink); }
.rs-tn-style__go { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  color:var(--tn-accent); display:inline-flex; align-items:center; gap:5px; }

/* Miniatures (ratio carte 1200×630) — apparence FIXE des cartes (pas de thème) */
.rs-tn-thumb { aspect-ratio:1200/630; width:100%; padding:13px 14px; display:flex; flex-direction:column; gap:7px; }
.rs-tn-thumb__kick { font-size:8px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; text-align:center; }
.rs-tn-thumb__grp { font-size:13px; font-weight:800; text-align:center; letter-spacing:.02em; margin-bottom:2px; }
.rs-tn-trow { display:flex; align-items:center; gap:6px; height:15px; border-radius:4px; padding:0 7px; position:relative; font-size:8px; }
.rs-tn-trow::before { content:''; position:absolute; left:0; top:3px; bottom:3px; width:3px; border-radius:0 2px 2px 0; }
.rs-tn-trow.q::before { background:#1F9D57; }
.rs-tn-trow.t::before { background:#E0A106; }
.rs-tn-trow .fl { width:14px; height:9px; border-radius:1.5px; flex:0 0 auto; object-fit:cover; }
.rs-tn-trow .nm { flex:1; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rs-tn-trow .pt { font-weight:800; }

.rs-tn-thumb--cla { background:#F2EDE3; color:#181513; }
.rs-tn-thumb--cla .rs-tn-thumb__kick { color:#003F87; }
.rs-tn-thumb--cla .rs-tn-thumb__grp { color:#181513; font-family:'Fraunces',Georgia,serif; font-style:italic; }
.rs-tn-thumb--cla .rs-tn-trow { background:#ECE5D8; }
.rs-tn-thumb--cla .rs-tn-trow .pt { color:#003F87; }

.rs-tn-thumb--mod { background:linear-gradient(150deg,#10171B,#05080A); color:#fff; }
.rs-tn-thumb--mod .rs-tn-thumb__kick { color:#7FA8E8; }
.rs-tn-thumb--mod .rs-tn-thumb__grp { color:#fff; text-transform:uppercase; letter-spacing:.06em; }
.rs-tn-thumb--mod .rs-tn-trow { background:rgba(255,255,255,.06); }
.rs-tn-thumb--mod .rs-tn-trow.q { background:rgba(31,157,87,.16); }
.rs-tn-thumb--mod .rs-tn-trow.t { background:rgba(224,161,6,.16); }
.rs-tn-thumb--mod .rs-tn-trow .pt { color:#7FA8E8; }

@media (max-width:480px) { .rs-tn-styles { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { .rs-tn-chooser, .rs-tn-chooser__panel { transition-duration:.01ms !important; } }