/* Pages du direct (salon, multiplex, Écouter le match), après scoutarium.css : ces règles ne pèsent pas sur les autres pages. */
/* Salon (A3.2) */
.direct :is(.direct-suspendu, .etat-direct) { margin: 0 16px 12px; }
.fil-direct li { align-items: baseline; }
.direct .tete { padding-block: 0; align-items: center; }
.direct .tete a { display: inline-flex; align-items: center; min-height: 44px; }
.direct .tete .bouton-pause { margin-left: auto; }
.salon { margin-top: 18px; }
.salon .salon-regles, .salon > .alerte, #salon-etat { margin: 10px 16px 0; }
.salon-messages { list-style: none; margin: 0; padding: 8px 16px; max-height: 60vh; overflow-y: auto; display: grid; gap: 6px; overscroll-behavior: contain; }
.salon-messages li { position: relative; min-height: 44px; padding: 6px 0; border-bottom: 1px solid #1E2738; overflow-wrap: anywhere; }
.salon-messages li:has(> .signaler) { padding-right: 76px; }
.salon-messages .qui { font: 600 14px/1.3 var(--f-display); letter-spacing: .04em; color: var(--or-clair); }
.salon-messages li.animateur .qui::after { content: " ★"; color: var(--or); }
.salon-messages time { font: 14px/1 var(--f-texte); color: var(--pierre); }
.salon-messages .texte { display: block; font-size: 15px; }
.salon-messages .signaler, .salon-messages .masquer summary { display: inline-flex; align-items: center; min-height: 44px; font: 14px/1 var(--f-texte); color: var(--pierre); text-decoration: none; cursor: pointer; }
.salon-messages .signaler { position: absolute; top: 0; right: 0; }
.salon-messages .masquer { display: inline-block; }
.salon-messages .masquer form, .attente form { display: inline-flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 0; }
.salon-messages li.en-attente { opacity: .7; }
.salon-vide { padding: 0 16px; }
.salon-form { display: flex; gap: 8px; padding: 12px 16px 16px; margin: 0; }
.salon-form input[type=text] { flex: 1 1 auto; min-width: 0; min-height: 44px; }
.salon-form button { min-height: 44px; }
.animation { margin-top: 18px; display: grid; gap: 12px; }
.animation .couper { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.animation .couper label { flex: 1 1 100%; }
.animation .couper input { flex: 1 1 260px; }
.attente { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
/* Multiplex (A3.6) */
.multiplex-tete > .actions { margin-top: 2px; align-items: center; }
.multiplex-tete .etat-direct { margin: 0; }
[data-stade="1"] .multiplex .zone-pouce { margin-top: 12px; }
.multiplex-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 12px; }
.tuile-multiplex { display: grid; align-content: start; border-top: 3px solid var(--club-1); }
.tuile-multiplex .score { padding: 16px 12px 10px; gap: 8px; }
.tuile-multiplex .equipe { font-size: 15px; }
.tuile-multiplex .blason { width: 32px; height: 37px; font-size: 12px; }
.tuile-multiplex .logo-club { width: 32px; height: 32px; }
.tuile-multiplex .chiffres { font-size: 44px; }
.tuile-multiplex .direct-suspendu { margin: 0 12px 10px; }
.tuile-multiplex .buts { padding: 0 12px 10px; }
.tuile-multiplex .buts:empty { display: none; }
.tuile-multiplex .liens { display: flex; gap: 8px; flex-wrap: wrap; margin: auto 0 0; padding: 0 12px 12px; }
.tuile-multiplex .liens a { min-height: 44px; display: inline-flex; align-items: center; }
.tuile-multiplex.but-recent { border-color: var(--or-clair); }
.liens-ecoute { list-style: none; padding: 0; display: grid; gap: 16px; }
/* Mode stade (A3.6) : jetons de la charte seulement. */
.bouton-stade, .bouton-pause { justify-self: start; min-height: 44px; padding-block: 0; font-size: 14px; }
button.bouton-stade[aria-pressed="true"] { background: var(--or); color: var(--nuit); border-color: var(--or); }
.bouton-stade[hidden], .bouton-pause[hidden], .salon-form[hidden], .actions-pouce { display: none; }
.direct.but-recent { border-color: var(--or-clair); }
[data-stade="1"] body { background-image: none; --pierre: var(--brume); --cadre: var(--bronze); }
[data-stade="1"] main { --brume: var(--parchemin); padding-block: 12px 24px; }
[data-stade="1"] .contenu { max-width: 720px; margin-inline: auto; }
[data-stade="1"] .btn-ligne { color: var(--or-clair); border-color: var(--or); }
[data-stade="1"] :is(.direct, .tuile-multiplex) { border-top-width: 0; }
[data-stade="1"] :is(.direct, .tuile-multiplex)::before { content: ""; display: block; height: 6px;
  background: linear-gradient(90deg, var(--club-1), var(--club-2), var(--club-1)); background-size: 200% 100%; }
[data-stade="1"] .chiffres { font-variant-numeric: tabular-nums; }
[data-stade="1"] .direct .chiffres { font-size: clamp(64px, 20vw, 120px); }
[data-stade="1"] .tuile-multiplex .chiffres { font-size: clamp(56px, 16vw, 88px); }
[data-stade="1"] .chiffres small { margin-top: 10px; font-size: 15px; color: var(--parchemin); }
[data-stade="1"] .score { gap: 8px; padding-inline: 12px; }
[data-stade="1"] .match .tete { font-size: 15px; color: var(--parchemin); }
[data-stade="1"] .direct .equipe { font-size: 16px; }
[data-stade="1"] .buts { font-size: 15px; }
[data-stade="1"] .salon-messages { max-height: 50vh; }
[data-stade="1"] .salon-messages .texte { font-size: 17px; }
[data-stade="1"] .multiplex-grille { grid-template-columns: 1fr; }
[data-stade="1"] :is(button, .salon-form input, .nav .nav-cta, .compte > summary) { min-height: 48px; }
[data-stade="1"] :is(main a.btn, .tete a, .lien-stade, .salon-form a, .marque, .nav li a, .nav-connexion, .nav-plus summary, .pied a, .salon-regles a, .salon-messages .signaler, .masquer summary) {
  display: inline-flex; align-items: center; min-height: 48px; }
[data-stade="1"] .compos summary { padding-block: 18px; }
[data-stade="1"] .pied nav { row-gap: 0; }
[data-stade="1"] .salon-messages li { min-height: 48px; }
[data-stade="1"] .zone-pouce { position: sticky; bottom: 0; z-index: 5; background: var(--ardoise); border-top: 1px solid var(--cadre); }
[data-stade="1"] .salon-form input { font-size: 16px; }  /* sinon iOS zoome sur le champ */
[data-stade="1"] .actions-pouce { display: flex; gap: 8px; margin: 0; padding: 0 16px 12px; }
[data-stade="1"] .actions-pouce .btn { flex: 1; justify-content: center; }
[data-stade="1"] .multiplex .actions-pouce { padding-top: 12px; }
[data-stade="1"] { --barre-basse-h: 0px; }  /* la barre du bas laisse la place au formulaire du salon */
[data-stade="1"] :is(.aujourdhui, .barre-basse, .tete .lien-multiplex, .tete .lien-ecouter, .multiplex-tete .lien-ecouter) { display: none; }
@media (prefers-reduced-motion: no-preference) {
  [data-stade="1"] :is(.direct, .tuile-multiplex)::before { animation: liseret 8s linear infinite; }
  [data-stade="1"] .but-recent { animation: pulsation 1.2s ease-out 3; }
  @keyframes liseret { to { background-position: 200% 0; } }
  @keyframes pulsation { from { box-shadow: 0 0 0 0 var(--or-clair); } to { box-shadow: 0 0 0 14px transparent; } }
}
@media (prefers-reduced-motion: reduce) {
  [data-stade="1"] :is(.direct, .tuile-multiplex)::before, [data-stade="1"] .but-recent { animation: none; }
}