/* ETAPE 4 / LOT 8 — T128Q : la home « Fan ».
   Complete les classes v4* existantes, ne les redefinit JAMAIS.

   REGLE DE CE FICHIER : PAS UNE SEULE COULEUR EN DUR.
   Le theme est PAR CLUB (--club-primary, --club-text, --kf-accent… voir
   assets/js/core/theme-colors.js). La version precedente de cet ecran ecrivait
   #12703a et #0b3d6e en dur : ca jurait chez URW, et ca aurait casse
   l affichage de tout autre club. Chaque valeur ci-dessous est donc une
   variable du theme, avec un repli neutre pris sur les classes v4*.

   Prefixe v128Q : il n apparait nulle part ailleurs dans le depot. Le §8 de
   PASSATION_T128 rappelle ce qu ont coute « quatre blocs CSS concurrents pour
   un meme libelle ». */

.v128QFanCard{ display:flex; flex-direction:column; gap:12px; }

.v128QLive{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap;
}

/* ------------------------------------------------------------- tableau */

/* Le tableau se pose SUR une carte deja sombre : un aplat --club-primary s y
   fondait. Une surface translucide le detache sans introduire de couleur. */
.v128QBoard{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.12);
  color:var(--club-text, #fff);
  border-radius:18px; padding:16px 18px;
}
.v128QSide{ display:flex; flex-direction:column; align-items:center; gap:4px; flex:1; min-width:0; }
.v128QSide span{
  font-size:13px; font-weight:700; opacity:.88; text-align:center;
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.v128QSide strong{ font-size:40px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; }
.v128QSep{ flex:0 0 auto; opacity:.55; font-size:20px; }

.v128QNote{
  margin:0; font-size:13px; line-height:1.35;
  color:var(--club-muted, #6b7684);
}
.v128QEmpty{ margin:0; font-size:15px; color:var(--club-text, #12243a); }

/* T333 — le refus VISIBLE. .v128QLive est reserve aux lecteurs d ecran ; un
   geste refuse (Prendre le Live, +1, chrono) s affiche ici, sinon l ecran
   restait muet. Couleurs uniquement en repli de var(), comme le reste. */
.v128QNoticeT333{
  margin:0; padding:10px 12px; border-radius:12px;
  font-size:14px; font-weight:700; line-height:1.35;
  background:var(--kf-live-notice-bg, rgba(179,38,30,.14));
  border:1px solid var(--kf-live-notice-border, rgba(179,38,30,.45));
  color:var(--club-text, #fff);
}

/* --------------------------------------------------------- les gestes */

.v128QMain{ display:grid; grid-template-columns:1fr; gap:10px; }

.v128QGoal, .v128QOpp{
  border:0; border-radius:14px; cursor:pointer; width:100%;
  font-weight:800; letter-spacing:.01em;
}
/* Le geste du match : le plus grand, le plus lisible. Il prend l accent du
   club, pas un vert invente. */
.v128QGoal{
  min-height:70px; font-size:20px;
  background:var(--kf-accent, var(--club-secondary, #0b3d6e));
  color:var(--kf-accent-contrast, var(--club-text-on-secondary, #fff));
}
/* Le but adverse existe mais ne doit pas se prendre pour le principal :
   plus bas, plus sobre, jamais sous le pouce par accident. */
.v128QOpp{
  min-height:52px; font-size:16px; font-weight:700;
  background:var(--club-muted, #4a5568);
  color:var(--club-text-on-primary, #fff);
}

/* ------------------------------------------------- buts sans buteur */

.v128QUnassigned{
  display:flex; flex-direction:column; gap:4px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px; padding:14px 16px;
}
.v128QUnassigned strong{ font-size:16px; color:var(--club-text, #fff); }
.v128QUnassigned p{ margin:0; font-size:13px; line-height:1.35; color:var(--club-muted, #b8c6d9); }

.v128QLink{
  align-self:flex-start; border:0; background:none; cursor:pointer;
  padding:12px 0 0; min-height:44px;
  color:var(--club-text, #fff);
  font-weight:700; font-size:15px; text-decoration:underline;
}

/* ------------------------------------------------------- les joueurs */

.v128QGrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:8px; }

/* MEME SURFACE QUE LES TUILES v4Quick DES AUTRES HOMES, et c est une
   correction, pas un gout. Premiere version : fond blanc (--club-surface)
   avec le texte var(--club-text). Or sur une home, le fond est SOMBRE et
   --club-text est donc CLAIR : les noms de joueurs sortaient en blanc sur
   blanc, illisibles. Vu sur capture, invisible pour les tests.
   Une surface translucide se marie avec le jeton de texte du theme, quel que
   soit le club et quel que soit le fond. */
.v128QChip{
  display:flex; align-items:stretch; gap:0; overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px; background:rgba(255,255,255,.10);
}
/* border-radius:0 et box-shadow:none NE SONT PAS DECORATIFS. style.css ligne
   7064 habille TOUT <button> du depot : border-radius:999px, padding:10px 16px
   et une ombre portee. Sans neutralisation, les elements internes de la tuile
   redeviennent des pastilles ovales flottantes — exactement le « vieux
   template a pastilles » que la capture a fait remonter. Vu a l ecran,
   invisible pour un test qui ne lit que le CSS de ce fichier. */
.v128QChipName{
  flex:1; min-width:0; border:0; background:none; cursor:pointer; text-align:left;
  /* 54 px : le format des tuiles v4Quick, pour rester dans le rythme visuel
     des autres homes. */
  min-height:54px; padding:0 10px;
  border-radius:0; box-shadow:none;
  font-weight:600; font-size:15px; color:var(--club-text, #12243a);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.v128QPick{
  min-height:54px; padding:0 12px; cursor:pointer; border-radius:12px;
  border:1px solid var(--club-primary, #0b3d6e);
  background:var(--club-primary, #0b3d6e);
  color:var(--club-text-on-primary, #fff);
  font-weight:700; font-size:15px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

.v128QMini{
  flex:0 0 auto; border:0; cursor:pointer;
  min-width:42px; min-height:54px; padding:0;
  border-radius:0; box-shadow:none;
  font-weight:800; font-size:14px;
}
/* Jaune et rouge sont des couleurs de REGLE DU JEU, pas des couleurs de
   marque : elles ne suivent pas le theme du club, et c est volontaire —
   un carton jaune vert serait illisible sur un terrain. */
.v128QYellow{ background:#e3b505; color:#2b2200; }
.v128QRed{ background:#b3261e; color:#fff; }

/* ---------------------------------------------------------- le fil */

.v128QFeed{ list-style:none; margin:0; padding:0; }
.v128QFeed li{
  display:flex; align-items:center; gap:10px;
  padding:10px 0 10px 10px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.v128QFeed li span{ flex:1; min-width:0; font-size:15px; color:var(--club-text, #12243a); }
/* Un geste encore sur l appareil se distingue a l oeil : il n a pas le meme
   statut qu un fait confirme, et l ecran ne doit pas laisser croire l inverse. */
.v128QQueued span{ opacity:.75; font-style:italic; }
.v128QFeed em{
  flex:0 0 auto; font-style:normal; font-size:12px; font-weight:700;
  border-radius:999px; padding:3px 9px;
  background:var(--kf-accent-soft, rgba(227,181,5,.18));
  color:var(--club-text, #6b4300);
}
.v128QDrop{
  background:none; color:var(--club-muted, #7a8699);
  font-size:20px; min-width:44px; min-height:44px; border-radius:10px;
}

/* ------------------------------------------------ T130B : qui pilote */

/* Meme surface translucide que le tableau : elle detache la bande sans
   introduire la moindre couleur. Le seul signal colore de cet ecran reste
   celui des cartons, qui sont une regle du jeu, pas une identite de club. */
.v128QOperator{
  display:flex; flex-direction:column; gap:10px; align-items:stretch;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  color:var(--club-text, #fff);
  border-radius:16px; padding:14px 16px;
}
.v128QOperator strong{ font-size:15px; font-weight:800; letter-spacing:.01em; }
.v128QOperator p{ margin:0; font-size:13px; line-height:1.45; opacity:.9; }
/* Le bouton herite de .v128QGoal (la plus grande cible de l ecran) quand il
   s agit de PRENDRE le live : c est le geste du §1 — une main, trois
   secondes, sous la pluie. */
.v128QOperator .v128QGoal{ width:100%; }

/* ------------------------------------------------ T130C : le chrono */

.v128QChrono{
  display:flex; flex-direction:column; gap:10px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  color:var(--club-text, #fff);
  border-radius:16px; padding:14px 16px;
}
.v128QChrono .v128QGoal{ width:100%; }
.v128QClock{ display:flex; flex-direction:column; align-items:center; gap:2px; }
/* Le temps est ce qu on lit d un coup d oeil depuis le bord du terrain :
   il est gros, et ses chiffres ne dansent pas (tabular-nums). */
.v128QClock strong{
  font-size:38px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums;
}
.v128QPeriod{ font-size:12px; font-weight:700; letter-spacing:.04em; opacity:.8; text-transform:uppercase; }
.v128QChronoRow{ display:flex; gap:10px; }
.v128QChronoRow > *{ flex:1; }

/* --------------------------------------- T130D : Hero, +1 et annulation */

/* Le logo se pose sur la surface deja sombre de la carte : un cercle clair
   translucide, jamais une couleur. Les classes v4LogoShell/v4LogoFallback
   viennent du Hero existant, on ne fait que les cadrer. */
.v128QLogo{
  display:grid; place-items:center;
  width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.14);
  overflow:hidden;
}
.v128QLogo img{ width:100%; height:100%; object-fit:contain; }
.v128QLogo .v4LogoFallback,
.v128QLogo .v4OpponentFallback{ font-size:14px; font-weight:800; letter-spacing:.02em; }

/* LE « +1 » EST SOUS LE SCORE QU IL FAIT MONTER (§14), et c est la plus
   grande cible de l ecran apres le score lui-meme : un doigt, sous la pluie,
   sans viser. 56px de haut, largeur pleine de sa colonne. */
.v128QPlus{
  width:100%; min-height:56px; margin-top:4px;
  border:0; border-radius:14px; box-shadow:none;
  background:var(--club-primary, #1f6f4a); color:#fff;
  font:inherit; font-size:20px; font-weight:800; cursor:pointer;
}
.v128QPlusOpp{ background:rgba(255,255,255,.16); }
.v128QPlus:active{ transform:translateY(1px); }

/* La bande d annulation se pose la ou le geste vient d avoir lieu. */
.v128QUndo{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  color:var(--club-text, #fff);
  border-radius:12px; padding:10px 14px; font-size:14px;
}
.v128QUndo .v128QLink{ flex:0 0 auto; min-height:44px; }

/* ------------------------------- T130E : feuilles de choix et cartons */

/* Le nom d un joueur est desormais SEUL dans la grille (les pastilles J et R
   ont cede la place aux deux grandes cibles ci-dessous). Il lui faut donc sa
   propre surface : sans elle, le bouton n a plus ni fond ni bord, puisque la
   regle de base le neutralise volontairement pour son usage en tuile. */
.v128QGrid > .v128QChipName{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.10);
  border-radius:12px; padding:0 12px;
}

/* LES DEUX CIBLES DU §19. Grandes, cote a cote, et de la couleur de la regle
   du jeu — jamais du theme du club : un carton jaune vert serait illisible.
   border-radius et box-shadow sont neutralises pour la meme raison qu ailleurs
   dans ce fichier : style.css habille TOUT bouton en pastille ovale. */
.v128QCards{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.v128QCardBtn{
  min-height:56px; border:0; cursor:pointer;
  border-radius:14px; box-shadow:none;
  font:inherit; font-size:15px; font-weight:800;
  display:flex; align-items:center; justify-content:center; gap:8px;
}

/* La ligne derivee du deuxieme jaune : elle porte la couleur du rouge, mais
   elle n est pas un fait — pas de croix, rien a retirer. */
.v128QExpulsion span{ font-weight:800; }

/* Le libelle d un fait est une CIBLE (§21) : toute la ligne se touche, sans
   viser une icone. Il neutralise l arrondi global pour ne pas redevenir une
   pastille au milieu du fil. */
.v128QFactBtn{
  flex:1; min-width:0; text-align:left;
  border:0; background:none; color:inherit; font:inherit;
  border-radius:0; box-shadow:none; padding:0; cursor:pointer;
  min-height:40px;
}

/* --------------------------------------- T130G : confier ce match */

.v128QInvite{
  display:flex; flex-direction:column; gap:8px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px; padding:10px 12px;
}
/* Le lien est long : il doit pouvoir etre lu et selectionne a la main quand le
   partage natif n est pas disponible, sans deborder de l ecran. */
.v128QInvite .v128QNote{ word-break:break-all; font-family:ui-monospace, monospace; font-size:12px; }

/* ------------------------------------------- T130H : l ecran vide guide
   La raison dit POURQUOI l ecran est vide ; cette seconde ligne dit quoi
   faire. Elle est volontairement plus discrete : elle ne doit pas peser
   autant que la raison. */
.v128QEmptyHint{ opacity:.75; font-size:14px; margin-top:6px; }


/* LOT 2 — lisibilite terrain + logos contenus.
   Les variables --club-text peuvent etre sombres selon le theme alors que cette
   home repose sur une surface sombre. Ici le texte interactif doit rester
   lisible independamment du theme. */
.v128QFanCard .v128QNote,
.v128QFanCard .v128QEmpty,
.v128QFanCard .v128QLink,
.v128QFanCard .v128QFeed li span,
.v128QFanCard .v128QFeed em,
.v128QFanCard .v128QChipName{
  color:var(--club-text-on-primary, #fff);
}
.v128QFanCard .v128QLink{ opacity:1; }
.v128QLogo{
  width:42px; height:42px;
  flex:0 0 42px;
}
.v128QLogo img,
.v128QLogo .v4LogoShell img,
.v128QLogo .v4OpponentLogo,
.v128QLogo .v4OpponentLogo img{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}

/* V262 — Live Hero: certains logos adverses arrivent enveloppes dans
   .v4LogoShell/.v4OpponentLogo avec leurs propres dimensions/marges.
   Le wrapper doit remplir le cadre et centrer son image, sinon le blason
   parait decale meme si l'image elle-meme est en object-fit:contain. */
.v128QLogo > .v4LogoShell,
.v128QLogo > .v4OpponentLogo{
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  position:static !important;
  inset:auto !important;
  transform:none !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
}
.v128QLogo > .v4LogoShell img,
.v128QLogo > .v4OpponentLogo img{
  margin:auto !important;
  object-position:center center !important;
  position:static !important;
  inset:auto !important;
  transform:none !important;
}

/* LOT 2b — le logo club local porte data-local-club-logo et herite ailleurs
   de regles globales de positionnement. Dans le Hero Live on neutralise ces
   regles uniquement dans son cadre, sans toucher aux logos adverses. */
.v128QLogo > [data-local-club-logo="1"],
.v128QLogo img[data-local-club-logo="1"]{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  margin:0 auto !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
}

/* LOT 2c — l image URW source contient elle-meme davantage de marge visuelle
   que les logos adverses. On ne peut pas recentrer des pixels transparents avec
   object-position : on compense uniquement le logo local dans le Hero Live. */
.v128QLogo img[data-local-club-logo="1"]{
  width:88% !important;
  height:88% !important;
  transform:translate(0,0) !important;
  transform-origin:center center !important;
}

/* LOT 3 — commandes score compactes autour du chiffre. */
.v128QScoreRow{
  display:flex; align-items:center; justify-content:center; gap:8px;
  min-height:48px; width:100%;
}
.v128QScoreRow strong{
  min-width:42px; text-align:center;
  font-size:40px; line-height:1; font-weight:800;
  font-variant-numeric:tabular-nums;
}
.v128QScoreBtn{
  display:grid; place-items:center;
  width:34px; height:34px; min-width:34px; min-height:34px;
  padding:0; border:1px solid rgba(255,255,255,.22);
  border-radius:50%; box-shadow:none;
  background:rgba(255,255,255,.16);
  color:var(--club-text-on-primary, #fff);
  font:inherit; font-size:24px; line-height:1; font-weight:700;
  cursor:pointer;
}
.v128QScoreBtn:active{ transform:scale(.94); }
.v128QMinus{ opacity:.82; }

/* LOT 4 UX — le terrain reste propre : les choix apparaissent en feuille
   contextuelle et les buts utilisent un flash visuel bref. */
.v128QFanCard{ position:relative; overflow:hidden; }
.v128QFlash{
  position:fixed; inset:0; z-index:9999;
  display:grid; place-items:center;
  min-height:100%;
  padding:24px;
  background:var(--club-primary, #1f6f4a);
  color:var(--club-text-on-primary, #fff);
  text-align:center; pointer-events:none;
  animation:v128QGoalFlash 1.6s ease both;
}
.v128QFlash strong{
  font-size:clamp(34px,10vw,72px);
  line-height:.95; font-weight:950;
  letter-spacing:-.04em; text-transform:uppercase;
}
.v128QFlash-opponent{ background:var(--kf-live-opponent-bg, #20252b); }
.v128QFlash-goal{ animation-duration:2.6s; }
.v128QFlash-player{ animation-duration:1.8s; }
@keyframes v128QGoalFlash{
  0%{ opacity:0; transform:translateX(35%); }
  18%{ opacity:1; transform:translateX(0); }
  78%{ opacity:1; transform:translateX(0); }
  100%{ opacity:0; transform:translateX(-35%); }
}
.v128QSheet{
  margin-top:14px; padding:16px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:16px;
  background:rgba(0,0,0,.16);
}
.v128QSheet .v128QGrid{
  max-height:260px; overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
@media (prefers-reduced-motion:reduce){
  .v128QFlash{ animation:none; }
}

.v128QSheet{
  position:fixed; z-index:9998;
  left:12px; right:12px; top:50%;
  transform:translateY(-50%);
  max-height:72dvh; overflow:auto;
  margin:0; padding:18px;
  background:var(--club-primary, #1f6f4a);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}
.v128QSheet::before{ display:none; }
.v128QFanCard:has(.v128QSheet)::after{
  content:''; position:fixed; inset:0; z-index:9997;
  background:rgba(0,0,0,.48);
}

/* LOT 4 UX4 — le choix du buteur doit flotter DEVANT le Hero/score.
   Le parent Live utilise overflow:hidden et peut créer un containing block sur
   certains WebViews iOS. On ancre donc la feuille au viewport avec priorité
   maximale et une largeur mobile explicite. */
html body .v128QFanCard .v128QSheet{
  position:fixed !important;
  z-index:2147483646 !important;
  top:50% !important;
  left:50% !important;
  right:auto !important;
  bottom:auto !important;
  width:min(92vw, 440px) !important;
  max-width:calc(100vw - 24px) !important;
  max-height:70vh !important;
  margin:0 !important;
  transform:translate(-50%,-50%) !important;
  overflow:auto !important;
}
html body .v128QFanCard:has(.v128QSheet)::after{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483645 !important;
}

/* LOT 4 UX5 — dialogue buteur compact et structurellement isolee. */
html body .v128QFanCard .v128QSheet{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
  max-height:min(70vh,560px) !important;
  padding:18px !important;
}
.v128QSheetHead{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:14px;
}
.v128QSheetX{
  width:42px; height:42px; min-width:42px;
  display:grid; place-items:center;
  border:0; border-radius:50%;
  background:rgba(255,255,255,.12);
  color:var(--club-text-on-primary,#fff);
  font-size:28px; line-height:1;
}
.v128QQuick{
  display:grid; grid-template-columns:1fr 1fr;
  gap:10px; margin-bottom:12px;
}
.v128QPlayerList{
  display:grid; grid-template-columns:1fr;
  gap:8px; max-height:300px; overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.v128QSheet .v128QPick{
  width:100%; min-height:48px;
}
.v128QSheetActions{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:12px;
}

/* LOT 4 UX10 — le portail est hors de la carte Live : positionnement viewport,
   au niveau visuel du score et non plus dans le flux de la page. */
.v128QSheetPortal{
  position:fixed !important; inset:0 !important;
  z-index:2147483647 !important;
  background:rgba(0,0,0,.48);
}
html body .v128QSheetPortal > .v128QSheet{
  position:absolute !important;
  top:34dvh !important; left:50% !important;
  right:auto !important; bottom:auto !important;
  width:min(92vw,440px) !important;
  max-width:calc(100vw - 24px) !important;
  max-height:56dvh !important;
  margin:0 !important;
  transform:translate(-50%,-50%) !important;
  overflow:hidden !important;
}
html body .v128QSheetPortal .v128QPlayerList{
  max-height:34dvh !important;
  overflow-y:auto !important;
}

/* LOT 4 UX11 — sélecteur buteur vertical, lisible d'un seul coup d'oeil. */
html body .v128QSheetPortal .v128QQuick{
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  margin:0 !important;
}
html body .v128QSheetPortal .v128QPick{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  min-height:50px !important;
  padding:12px 8px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  text-align:left !important;
}
html body .v128QSheetPortal .v128QSelectorDivider{
  height:1px !important;
  margin:5px 8px 7px !important;
  background:rgba(255,255,255,.28) !important;
}
html body .v128QSheetPortal .v128QPlayerList{
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
}
html body .v128QSheetPortal .v128QPlayerList .v128QPick + .v128QPick{
  border-top:1px solid rgba(255,255,255,.10) !important;
}

/* LOT 4 UX12 — un vrai select natif, adapté au choix rapide sur mobile. */
html body .v128QSheetPortal .v128QScorerSelect{
  display:block !important;
  width:100% !important;
  min-height:54px !important;
  margin:14px 0 4px !important;
  padding:0 48px 0 16px !important;
  border:1px solid rgba(255,255,255,.35) !important;
  border-radius:12px !important;
  background-color:rgba(0,0,0,.12) !important;
  color:var(--club-text-on-primary,#fff) !important;
  font:inherit !important;
  font-weight:700 !important;
  font-size:17px !important;
}

/* LOT 4 UX14 — picker buteur maison, identique iOS/Android/Desktop. */
.v128QScorerTrigger{
  width:100%; min-height:54px; margin:14px 0 4px; padding:0 16px;
  display:flex; align-items:center; justify-content:space-between;
  border:1px solid rgba(255,255,255,.35); border-radius:12px;
  background:rgba(0,0,0,.12); color:var(--club-text-on-primary,#fff);
  font:inherit; font-weight:700; font-size:17px; text-align:left;
}
.v128QScorerTrigger span{font-size:24px}
.v128QScorerPicker[hidden]{display:none !important}
.v128QScorerPicker{margin-top:12px}
.v128QScorerSearch{
  width:100%; min-height:48px; box-sizing:border-box; padding:0 14px;
  border:1px solid rgba(255,255,255,.35); border-radius:12px;
  background:rgba(255,255,255,.12); color:var(--club-text-on-primary,#fff);
  font:inherit; font-size:16px;
}
.v128QScorerSearch::placeholder{color:rgba(255,255,255,.7)}
.v128QScorerOptions{
  max-height:34dvh; margin-top:8px; overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.v128QScorerOption{
  display:block; width:100%; min-height:48px; padding:10px 8px;
  border:0; border-radius:0; background:transparent;
  color:var(--club-text-on-primary,#fff); font:inherit; font-weight:700;
  text-align:left;
}
.v128QScorerOption[hidden]{display:none !important}
.v128QScorerOption + .v128QScorerOption{border-top:1px solid rgba(255,255,255,.10)}

/* LOT 4 UX15 — loupe visible dans la recherche buteur. */
.v128QScorerSearchWrap{position:relative}
.v128QScorerSearchIcon{
  position:absolute; left:15px; top:50%; transform:translateY(-50%);
  z-index:1; pointer-events:none; color:var(--kf-live-search-icon, #66727e);
  font-size:25px; line-height:1;
}
html body .v128QSheetPortal .v128QScorerSearch{
  padding-left:48px !important;
  background:#fff !important;
  color:var(--kf-live-search-text, #17212b) !important;
}
html body .v128QSheetPortal .v128QScorerSearch::placeholder{
  color:var(--kf-live-search-placeholder, #7b8792) !important;
  opacity:1 !important;
}

/* LOT 4 UX19 — faits du match : contraste garanti sur la surface bleue.
   Ne pas dépendre de --club-text-on-primary : certains thèmes le redéfinissent sombre. */
html body .v128QFanCard .v128QFeed li,
html body .v128QFanCard .v128QFeed li span,
html body .v128QFanCard .v128QFeed li .v128QFactBtn,
html body .v128QFanCard .v128QFeed li em{
  color:#fff !important;
}
html body .v128QFanCard .v128QFeed li span,
html body .v128QFanCard .v128QFeed li .v128QFactBtn{
  opacity:1 !important;
}
html body .v128QFanCard .v128QFeed .v128QQueued span{
  color:rgba(255,255,255,.82) !important;
}
html body .v128QFanCard .v128QDrop{
  color:rgba(255,255,255,.88) !important;
}


/* V270 — retour au rendu natif des logos.
   Le wrapper V268 redimensionnait les IMG a 100% et cassait le rendu des
   sources asynchrones, d'ou les disques blancs/gris visibles au chargement.
   Le slot garde uniquement un centrage flex; l'image conserve ses propres
   proportions et son rendu precedent. */
.v128QLogo{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}
.v128QLogoInner{
  display:contents !important;
}
.v128QLogoInner > img,
.v128QLogoInner > .v4LogoShell,
.v128QLogoInner > .v4OpponentLogo{
  margin:auto !important;
}


/* T292 - invitation discrete a demander le role Live. */
.v128QLiveInvite{
  width:100%; margin:0 0 14px; padding:12px 14px;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px;
  border:1px solid rgba(255,255,255,.18); border-radius:14px; box-shadow:none;
  background:rgba(255,255,255,.10); color:var(--club-text-on-primary,#fff);
  font:inherit; text-align:left; cursor:pointer;
}
.v128QLiveInviteIcon{font-size:22px}
.v128QLiveInvite strong{display:block;font-size:14px;line-height:1.2}
.v128QLiveInvite small{display:block;margin-top:2px;font-size:12px;line-height:1.25;opacity:.78}
.v128QLiveInvite b{font-size:12px;white-space:nowrap}
@media(max-width:480px){
  .v128QLiveInvite{grid-template-columns:auto 1fr}
  .v128QLiveInvite b{grid-column:2;font-size:12px}
}


/* T295 - CTA Live compact : en haut a droite, sans augmenter la hauteur. */
.v128QLiveInvite{
  width:auto !important;
  max-width:310px;
  margin:-4px 0 6px auto !important;
  padding:8px 10px !important;
  grid-template-columns:auto 1fr !important;
  gap:7px !important;
  border-radius:12px !important;
}
.v128QLiveInviteIcon{font-size:17px !important}
.v128QLiveInvite strong{font-size:12px !important;line-height:1.15 !important}
.v128QLiveInvite small{display:none !important}
.v128QLiveInvite b{grid-column:2;font-size:11px !important;line-height:1.1}
@media(max-width:480px){
  .v128QLiveInvite{max-width:285px;margin-top:-6px !important}
}


/* T296 - date + invitation sur une seule ligne. */
.v128QMetaRowT296{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  margin:0 0 8px;
}
.v128QMetaRowT296 .v128QMatchDate{margin:0 !important;white-space:nowrap}
.v128QMetaRowT296 .v128QLiveInvite{
  margin:0 !important;
  padding:5px 8px !important;
  max-width:none !important;
  display:flex !important;
  align-items:center;
  gap:5px !important;
  border-radius:10px !important;
}
.v128QMetaRowT296 .v128QLiveInviteIcon{font-size:14px !important}
.v128QMetaRowT296 .v128QLiveInvite strong{font-size:10.5px !important;white-space:nowrap}
.v128QMetaRowT296 .v128QLiveInvite b{font-size:10px !important;white-space:nowrap}
@media(max-width:480px){
  .v128QMetaRowT296{gap:5px}
  .v128QMetaRowT296 .v128QLiveInvite{padding:5px 6px !important}
  .v128QMetaRowT296 .v128QLiveInvite strong{font-size:10px !important}
  .v128QMetaRowT296 .v128QLiveInvite b{font-size:9.5px !important}
}


/* T297 - CTA en 2 lignes dans sa colonne, sans chevaucher la date. */
.v128QMetaRowT296{
  grid-template-columns:minmax(150px,42%) minmax(0,58%) !important;
}
.v128QMetaRowT296 .v128QLiveInvite{
  width:100% !important;
  min-width:0 !important;
  justify-content:flex-start !important;
}
.v128QMetaRowT296 .v128QLiveInvite>span:not(.v128QLiveInviteIcon){
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}
.v128QMetaRowT296 .v128QLiveInvite strong,
.v128QMetaRowT296 .v128QLiveInvite b{
  display:block !important;
  white-space:normal !important;
  line-height:1.08 !important;
}
@media(max-width:480px){
  .v128QMetaRowT296{grid-template-columns:minmax(145px,43%) minmax(0,57%) !important}
}


/* T298 - confirmation de demande d'acces Live. */
.v128QLiveRequestOverlay{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:20px}
.v128QLiveRequestModal{position:relative;width:min(100%,390px);padding:22px;border-radius:20px;background:var(--club-primary,#123f69);color:var(--club-text-on-primary,#fff);border:1px solid rgba(255,255,255,.22);box-shadow:0 18px 50px rgba(0,0,0,.32);text-align:center}
.v128QLiveRequestClose{position:absolute;right:10px;top:8px;border:0;background:transparent;color:inherit;font-size:28px;line-height:1;cursor:pointer}
.v128QLiveRequestMic{font-size:30px;margin-bottom:6px}
.v128QLiveRequestModal h3{margin:0 22px 10px;font-size:20px}
.v128QLiveRequestModal p{margin:7px 0;font-size:14px;line-height:1.35}
.v128QLiveRequestHint{opacity:.78}
.v128QLiveRequestSend{width:100%;margin-top:16px;padding:12px 14px;border:0;border-radius:12px;font:inherit;font-weight:800;cursor:pointer}
.v128QLiveRequestSend:disabled{opacity:.7}


/* T299 - identite de la demande Live. */
.v128QLiveRequestField{display:block;text-align:left;margin-top:12px}
.v128QLiveRequestField span{display:block;margin:0 0 5px;font-size:12px;font-weight:800}
.v128QLiveRequestField input{box-sizing:border-box;width:100%;padding:11px 12px;border:1px solid rgba(255,255,255,.24);border-radius:10px;background:rgba(255,255,255,.12);color:inherit;font:inherit;outline:none}
.v128QLiveRequestField input::placeholder{color:rgba(255,255,255,.55)}
.v128QLiveRequestField input:focus{border-color:rgba(255,255,255,.65)}
.v128QLiveRequestError{min-height:17px;margin:7px 0 0 !important;font-size:12px !important;font-weight:700}

/* T305 - popup multi-demandes depuis le CTA Live */
.v305ManageModal{width:min(100%,480px)!important;text-align:left!important}
.v305ManageModal h3{color:#fff!important;text-align:center;margin:4px 30px 16px}
.v305ManageList{display:flex;flex-direction:column;gap:9px;max-height:60vh;overflow:auto}
.v305ManageList article{padding:12px;border:1px solid rgba(255,255,255,.18);border-radius:13px;background:rgba(255,255,255,.08);color:#fff}
.v305ManageList article>div:first-child{display:flex;flex-direction:column;gap:3px}.v305ManageList article strong,.v305ManageList article span,.v305ManageList article b{color:#fff!important}.v305ManageList article span{font-size:12px;opacity:.82}
.v305ManageList article>div:last-child{display:flex;gap:7px;margin-top:10px}.v305ManageList article button{flex:1;border:0;border-radius:10px;padding:10px;font:inherit;font-weight:800;cursor:pointer}

/* T335 — TERMINER LE MATCH doit se voir : une vraie cible pleine largeur,
   distincte des boutons de jeu, et toujours derriere une confirmation. */
.v128QEndBtnT335{
  width:100%; margin-top:10px; padding:14px 16px; border-radius:14px;
  font-size:15px; font-weight:800; letter-spacing:.02em; cursor:pointer;
  background:var(--kf-live-end-bg, rgba(179,38,30,.18));
  border:2px solid var(--kf-live-end-border, rgba(179,38,30,.7));
  color:var(--club-text, #fff);
}
/* T335 — match termine : lecture seule, et la porte vers la correction. */
.v128QDoneT335{
  display:flex; flex-direction:column; gap:8px; padding:12px; border-radius:12px;
  background:var(--kf-live-done-bg, rgba(255,255,255,.08));
  border:1px solid var(--kf-live-done-border, rgba(255,255,255,.18));
}
.v128QCorrectT335{
  align-self:flex-start; padding:10px 14px; border-radius:10px; font-weight:700;
  text-decoration:none;
  background:var(--kf-live-correct-bg, rgba(255,255,255,.14));
  color:var(--club-text, #fff);
}
/* T335 — la convocation, avant le coup d envoi. */
.v128QConvoT335{ display:flex; flex-direction:column; gap:6px; }
.v128QConvoListT335{
  margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:6px;
}
.v128QConvoListT335 li{
  padding:4px 10px; border-radius:999px; font-size:13px;
  background:var(--kf-live-chip-bg, rgba(255,255,255,.12));
  color:var(--club-text, #fff);
}

/* T335 — la carte d un match EN DIRECT, sur la Home, ouvre son Live. */
#homeCoachV400 [data-live-open]{ cursor:pointer; -webkit-tap-highlight-color:transparent; }