/* IASHARK — page Combines (combines.html, lib/combines-page.js). Refaite le 28/10/2026, visuel refait le 06/11/2026
   (Clement : une page qui accroche, pas une liste de cartes).
   Monde IASHARK : fond nuit #060b12, surfaces bleu nuit, cyan #20d5ef, gris, filets fins ; titres et grands chiffres en
   Anton (comme la marque de l'accueil), interface en Inter. Telephone d'abord (375 px).
   Composants repris (assets/composants.css, lib/composants.js) : HyperUI Tabs (onglets Petit / Grand), Magic UI Number
   Ticker (la cote qui monte), Magic UI Animated Circular Progress Bar (chance), Magic UI Animated Subscribe Button
   (copier le ticket), bouton d'offre (21st.dev Gradient CTA, lib/offre-pro.js), Magic UI Shine Border (Selection en or,
   seul or du site), shadcn/ui Card (buteurs), HyperUI Badges (pastille Pro).
   Dessine ici : le ticket (perforation et encoches, tampon du resultat), la bande des derniers combines et la serie des
   paliers des montantes.
   Interdits respectes : aucun vert ni rouge (gagne / perdu en toutes lettres, cyan pour un ticket valide, gris pour
   un perdu), aucune police a chasse fixe, aucune bordure gauche coloree, aucun degrade violet.
   Mouvement : le ticket apparait, sa cote monte, le tampon tombe, les paliers s'allument ; rien sous
   prefers-reduced-motion. */

.cb{
  --cb-ink:#f4f7fb;--cb-soft:#91a0b3;--cb-soft2:#b4c0cf;--cb-cyan:#20d5ef;--cb-deep:#06b6d4;--cb-page:#060b12;--cb-surface:#0a1420;--cb-panel:#0d1926;
  --cb-line:rgba(141,179,211,.14);--cb-line2:rgba(141,179,211,.3);
  --cb-ease:cubic-bezier(.16,1,.3,1);
  --cb-num:Anton,"Arial Narrow",system-ui,sans-serif;
  margin:0;background:var(--cb-page);color:var(--cb-ink);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip
}
:where(.cb) *,:where(.cb) *::before,:where(.cb) *::after{box-sizing:border-box}
html:has(.cb){background:#060b12;scrollbar-color:rgba(141,179,211,.32) #060b12}
.cb ::selection{background:rgba(32,213,239,.3);color:#fff}
@media (prefers-reduced-motion:no-preference){html:has(.cb){scroll-behavior:smooth}}
.cb [hidden]{display:none!important}
#cbTickets,#cbOr,#derniers,#montantes,#buteurs{scroll-margin-top:72px}
.cb :focus-visible{outline:2px solid var(--cb-cyan);outline-offset:3px}
/* En-tete du site (memes regles que assets/product-pages.css, que cette page ne charge pas). */
.cb .topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;height:64px;padding:0 max(28px,calc((100vw - 1400px) / 2));border-bottom:1px solid #132738;background:#040a11}
.cb .brand{display:inline-flex;align-items:center;min-height:44px}
.cb .brand img{display:block;width:auto;height:32px}
.cb .top-actions{display:flex;align-items:center;gap:18px;margin-left:auto}
.cb .topbar .btn-login,.cb .topbar .account-chip{display:inline-flex;align-items:center;min-height:44px;padding:9px 14px;border:1px solid #1a4960;border-radius:9px;
  background:transparent;color:var(--cb-cyan);font:700 13px/1.2 Inter,system-ui,sans-serif;letter-spacing:0;text-decoration:none;white-space:nowrap;cursor:pointer}
@media (max-width:850px){
  .cb .topbar{height:56px;padding:0 14px}
  .cb .brand img{height:28px}
  .cb .top-actions{gap:8px;min-width:0}
}
@media (max-width:430px){.cb .topbar .brand img{width:104px;height:auto}.cb .top-actions>.btn-login{max-width:150px;padding:6px 10px;line-height:1.2;white-space:normal}}
.cb-ico{display:inline-block;flex:none;width:16px;height:16px;vertical-align:-3px}

/* ---------- Mise en page ---------- */
.cb-page{width:min(1040px,calc(100% - 32px));margin:0 auto;padding:0 0 calc(104px + env(safe-area-inset-bottom))}
.cb-h2{margin:0;font:400 clamp(28px,7.6vw,40px)/1.02 var(--cb-num);letter-spacing:.005em;color:var(--cb-ink);text-wrap:balance}
.cb-texte{margin:0;max-width:60ch;font-size:15px;line-height:1.55;color:var(--cb-soft)}
.cb-petit{margin:14px 0 0;max-width:72ch;font-size:13px;line-height:1.55;color:var(--cb-soft)}
.cb-tete-s{display:grid;gap:8px}
.cb-msg{margin:18px 0 0;padding:14px 16px;border:1px solid var(--cb-line);border-radius:12px;color:var(--cb-soft2);font-size:14.5px;line-height:1.5}
.cb-verrou{display:inline-flex;align-items:center;gap:5px;justify-self:start;padding:4px 10px;border-radius:999px;background:rgba(148,163,184,.14);
  color:#dbe4ee;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap}
.cb-verrou .cb-ico{width:13px;height:13px;vertical-align:0}

/* ---------- Ouverture : photo du stade de nuit, titre, date, preuve d'hier, sommaire sur une ligne ---------- */
.cb-ouverture{position:relative;padding:22px 0 6px;isolation:isolate}
.cb-ouverture-fond{position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);overflow:hidden;pointer-events:none}
.cb-ouverture-fond picture{display:block;height:100%}
.cb-ouverture-fond img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 22%;opacity:.7}
.cb-ouverture-fond::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(6,11,18,.2) 0%,rgba(6,11,18,.66) 45%,var(--cb-page) 100%)}
/* Telephone : le titre tient sur une ligne, pour que le ticket et son bouton arrivent dans le premier ecran. */
.cb-h1{margin:0;font:400 clamp(36px,10.2vw,88px)/.98 var(--cb-num);letter-spacing:.005em;text-wrap:balance}
.cb-date{margin:6px 0 0;color:var(--cb-cyan);font-size:15px;font-weight:600}
.cb-date::first-letter{text-transform:uppercase}
.cb .preuve-hier--cb{margin:14px 0 0;max-width:560px;background:rgba(8,14,20,.8);border:1px solid rgba(32,213,239,.2)}
.cb-sommaire{display:flex;gap:8px;margin:16px -16px 0;padding:0 16px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cb-sommaire::-webkit-scrollbar{display:none}
.cb-sommaire a{display:inline-flex;align-items:center;flex:none;min-height:40px;padding:0 15px;border:1px solid var(--cb-line2);border-radius:999px;
  background:rgba(10,20,32,.86);color:var(--cb-ink);font-size:14px;font-weight:600;text-decoration:none;
  transition:border-color .2s ease,background-color .2s ease,transform .16s var(--cb-ease)}
.cb-sommaire a:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.cb-sommaire a:hover{border-color:rgba(32,213,239,.6);background:rgba(32,213,239,.08)}}
/* Telephone : le sommaire laisse la place au ticket (les onglets suffisent au premier ecran). */
@media (max-width:599px){
  .cb .cb-sommaire{display:none!important}
  /* La phrase reste visible : le matin, elle dit quels combines sont montres et si ceux d'hier sont en verification. */
  .tdj-tete .cb-texte{font-size:13px;margin:0 0 8px}
  /* Le titre de scene reste lu par les lecteurs d'ecran ; a l'oeil, les onglets font titre. */
  .tdj-tete .cb-h2{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
}

/* ---------- Le bloc (lib/aujourdhui.js, dessine par la page) ---------- */
.cb .aj--page{display:block;width:100%;margin:0;padding:0}
.cb .aj,.cb .aj *{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.cb .aj .cb-h2,.cb .aj .tq-v,.cb .aj .tq-tampon,.cb .aj .dc-c,.cb .aj .mt-v,.cb .aj .mt-soir-c,.cb .aj .mt-num,.cb .aj .mt-arrivee b,
.cb .aj .bt-c-rang,.cb .aj .bt-c-init,.cb .aj .bt-c-chiffres dd{font-family:var(--cb-num)}

/* ================= 1. LE TICKET DU SOIR ================= */
.tdj{margin-top:18px}
.tdj-tete{display:grid;gap:6px}
.tdj-tete .cb-texte{font-size:14px}
/* Onglets (HyperUI Tabs n° 2) : un par ticket, le nom et la cote. */
.cb .tdj-tabs{margin-top:12px}
.cb .tdj-tabs .hu-tablist{gap:0}
.cb .tdj-tabs .hu-tab{flex:1 1 0;flex-wrap:wrap;align-items:baseline;gap:2px 8px;padding:10px 4px;min-height:46px;color:var(--cb-soft2);font:600 15px/1.2 Inter,system-ui,sans-serif;white-space:normal;text-align:left}
.cb .tdj-tabs .hu-tab[aria-selected="true"]{color:var(--cb-ink);border-bottom-color:var(--cb-cyan)}
.tdj-tab-c{font-size:12.5px;font-weight:500;color:var(--cb-soft);font-variant-numeric:tabular-nums}
.hu-tab[aria-selected="true"] .tdj-tab-c{color:var(--cb-cyan)}
.tdj-pan{display:none}
.tdj-pan.is-actif{display:block}

/* Le ticket : surface bleu nuit eclairee du coin, filet cyan, perforation a encoches. */
.tq{position:relative;margin-top:14px;border:1px solid rgba(32,213,239,.2);border-radius:20px;overflow:hidden;
  background:radial-gradient(130% 70% at 100% 0%,rgba(32,213,239,.13),transparent 58%),linear-gradient(180deg,#0f1f30 0%,var(--cb-surface) 100%);
  box-shadow:0 22px 40px -26px rgba(0,0,0,.9)}
.tq-x5{border-color:rgba(141,179,211,.22);background:radial-gradient(130% 70% at 100% 0%,rgba(141,179,211,.1),transparent 58%),linear-gradient(180deg,#0e1b29 0%,var(--cb-surface) 100%)}
.tq-h{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;padding:14px 18px 0}
.tq-nom{display:inline-flex;align-items:center;gap:8px;font-size:15.5px;font-weight:700;letter-spacing:-.01em}
.tq-nom .cb-ico{color:var(--cb-cyan);width:18px;height:18px;vertical-align:0}
.tq-jour{font-size:12.5px;color:var(--cb-soft)}
.tq-jour::first-letter{text-transform:uppercase}
.tq-h .sc-lock{margin-left:auto;gap:.3rem;padding:.25rem .65rem;font-size:12.5px;background:rgba(32,213,239,.12);color:#cffafe}
.tq-h .sc-lock .lucide{width:13px;height:13px;margin:0}
/* La cote totale, en tres grand. */
.tq-corps{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:10px 18px 0}
.tq-fig{display:grid;gap:2px;min-width:0}
.tq-k{font-size:13px;color:var(--cb-soft)}
.cb .tq-v{font-weight:400;font-size:clamp(68px,21vw,104px);line-height:.92;letter-spacing:.01em;color:var(--cb-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.tq-x10 .tq-v{color:#e9fbff}
/* Chance calculee (Magic UI Animated Circular Progress Bar), ticket ouvert seulement. */
.tq-chance{display:grid;justify-items:center;gap:6px;flex:none;max-width:112px;text-align:center}
.tq-chance .mu-gauge{width:76px;height:76px;font-size:17px}
.tq-chance-k{display:grid;gap:2px;font-size:11.5px;line-height:1.3;color:var(--cb-soft2)}
.tq-chance-k small{font-size:11px;color:var(--cb-soft)}
.tq-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0;padding:10px 18px 0;font-size:13.5px;color:var(--cb-soft2)}
.tq-meta>span{display:inline-flex;align-items:center}
.tq-ligues{gap:6px}
.tq-ligue{display:block;width:24px;height:24px;padding:2px;border-radius:6px;background:#f4f7fb;object-fit:contain}
/* Perforation : pointilles et deux encoches de la couleur du fond. */
.tq-perfo{position:relative;height:0;margin:18px 0 0;border-top:2px dashed rgba(141,179,211,.26)}
.tq-perfo::before,.tq-perfo::after{content:"";position:absolute;top:-12px;width:22px;height:22px;border-radius:50%;background:var(--cb-page)}
.tq-perfo::before{left:-12px}
.tq-perfo::after{right:-12px}
/* Lignes du ticket. */
.tq-l{display:grid;gap:4px;margin:0;padding:12px 12px 6px;list-style:none}
.tq-leg{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 8px;border-radius:12px}
.tq-leg+.tq-leg{border-top:1px solid var(--cb-line);border-radius:0}
.tq-heure{font-size:12.5px;font-weight:600;color:var(--cb-soft2);font-variant-numeric:tabular-nums;white-space:nowrap}
.tq-m{display:grid;gap:3px;min-width:0}
.tq-eq{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:14px;line-height:1.3}
.tq-eq b{font-weight:650;overflow-wrap:anywhere}
.tq-vs{color:var(--cb-soft)}
.tq-eq-logo{display:block;width:18px;height:18px;object-fit:contain}
.tq-m small{font-size:13px;line-height:1.35;color:#8fe6f5}
.tq-o{display:grid;justify-items:end}
.cb .tq-o b{font:400 24px/1 var(--cb-num);font-variant-numeric:tabular-nums}
.tq-o small{font-size:11px;color:var(--cb-soft)}
.tq-leg.is-off{opacity:.55}
.tq-leg.is-off .tq-eq b{text-decoration:line-through;text-decoration-thickness:1px}
.tq .tk-rep{margin:4px 18px 0;padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.04);color:var(--cb-soft2);font-size:12.5px;line-height:1.45}
.tq-pied{padding:10px 18px 18px}
.tq-pied .mu-sub{width:100%;min-height:48px;border-radius:12px;font-size:15px}
/* Ticket verrouille : des barres vides, jamais un texte (ni vrai ni faux). */
.tq-cache{display:flex;align-items:center;gap:8px;margin:0;padding:14px 18px 0;font-size:13.5px;font-weight:600;color:var(--cb-soft2)}
.tq-cache .cb-ico{color:var(--cb-cyan);width:15px;height:15px;vertical-align:0}
.tq-l--cache{padding:6px 18px 16px;gap:0}
.tq-leg--cache{grid-template-columns:22px minmax(0,1fr) 16px;gap:12px;padding:6px 0;border-radius:0}
/* Telephone : trois lignes cachees, puis « +2 » (le nombre seul). */
.tq-plus{display:none}
@media (max-width:599px){
  .tq-leg--cache:nth-child(n+4){display:none}
  .tq-plus{display:block;padding:6px 0 0 34px;font-size:13px;font-weight:700;color:var(--cb-soft)}
}
.tq-leg--cache+.tq-leg--cache{border-top:1px solid var(--cb-line)}
.tq-n{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--cb-line2);color:var(--cb-soft);font-size:11px;font-weight:700}
.tq-barres{display:grid;gap:6px}
.tq-barres i{display:block;height:9px;border-radius:5px;background:linear-gradient(90deg,rgba(141,179,211,.13) 0%,rgba(141,179,211,.26) 50%,rgba(141,179,211,.13) 100%);background-size:200% 100%}
.tq-barres i:first-child{width:72%}
.tq-barres i:last-child{width:44%;height:7px;opacity:.7}
.tq-leg--cache:nth-child(2n) .tq-barres i:first-child{width:60%}
.tq-leg--cache:nth-child(3n) .tq-barres i:first-child{width:80%}
.tq-leg--cache .cb-ico{width:14px;height:14px;color:var(--cb-soft)}
/* Ticket d'un jour passe et ticket vide. */
.tq--passe{padding-bottom:18px}
.tq-msg{margin:0;padding:12px 18px 20px;font-size:14.5px;line-height:1.5;color:var(--cb-soft2)}
/* Le tampon du resultat : la revelation apres les matchs (cyan valide, gris perdu ; jamais vert ni rouge). */
.tq-tampon{display:inline-grid;place-items:center;flex:none;margin:0 0 8px;padding:6px 12px 5px;border:3px solid currentColor;border-radius:10px;
  transform:rotate(-8deg);font-weight:400;font-size:26px;line-height:1;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.tq-tampon--win{color:var(--cb-cyan);background:rgba(32,213,239,.08)}
.tq-tampon--loss{color:var(--cb-soft2);background:rgba(141,179,211,.06)}
.tq-tampon--void,.tq-tampon--verif{color:var(--cb-soft);font-size:20px}
/* Deblocage et essai Pro (lib/aujourdhui.js + lib/offre-pro.js), juste sous le ticket. */
.cb .tdj .aj-unlock{margin-top:12px;gap:12px;padding:16px;border:1px solid rgba(32,213,239,.3);border-radius:16px;background:rgba(32,213,239,.05)}
.cb .tdj .aj-unlock-t{font-size:15px;line-height:1.45}
.cb .tdj .aj-small{font-size:12.5px;color:var(--cb-soft)}
/* Mouvement : le ticket monte en place, le tampon tombe (une fois). */
@media (prefers-reduced-motion:no-preference){
  .tdj-pan.is-actif .tq{animation:tq-entree .7s var(--cb-ease) both}
  .tdj-pan.is-actif .tq-tampon{animation:tq-tampon .5s cubic-bezier(.16,1,.3,1) .55s both}
  .tq-barres i{animation:tq-reflet 2.6s ease-in-out infinite}
}
@keyframes tq-entree{from{transform:translateY(14px);clip-path:inset(0 0 22% 0 round 20px)}to{transform:none;clip-path:inset(0 0 0 0 round 20px)}}
@keyframes tq-tampon{from{opacity:0;transform:rotate(-8deg) scale(1.7)}to{opacity:1;transform:rotate(-8deg) scale(1)}}
@keyframes tq-reflet{from{background-position:100% 0}to{background-position:-100% 0}}

/* ================= 2. LES DERNIERS COMBINES (la preuve) ================= */
.dc{margin-top:44px}
.dc-bilan{margin:12px 0 0;font-size:14px;font-weight:600;color:var(--cb-soft2);font-variant-numeric:tabular-nums}
.dc-l{display:flex;gap:10px;margin:12px -16px 0;padding:2px 16px 8px;list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 16px;scrollbar-width:none}
.dc-l::-webkit-scrollbar{display:none}
.dc-t{flex:0 0 136px;scroll-snap-align:start;display:grid;align-content:start;gap:3px;padding:12px 12px 11px;border:1px solid var(--cb-line);border-radius:14px;background:var(--cb-panel)}
.dc-j{font-size:12px;font-weight:600;color:var(--cb-soft);font-variant-numeric:tabular-nums}
.dc-nom{font-size:13px;font-weight:600;color:var(--cb-soft2)}
.cb .dc-c{margin-top:4px;font-weight:400;font-size:32px;line-height:1;color:var(--cb-ink);font-variant-numeric:tabular-nums}
.dc-n{font-size:12px;color:var(--cb-soft)}
.dc-r{display:inline-flex;align-items:center;gap:4px;margin-top:6px;font-size:13px;font-weight:700;color:var(--cb-soft2)}
.dc-r .cb-ico{width:14px;height:14px;vertical-align:0}
.dc-t--win{border-color:rgba(32,213,239,.4);background:linear-gradient(180deg,rgba(32,213,239,.1),var(--cb-panel) 70%)}
.dc-t--win .dc-r{color:var(--cb-cyan)}
.dc-t--loss .dc-c{color:var(--cb-soft2)}

/* ================= 3. LA SELECTION EN OR (inchangee, lib/aujourdhui.js) ================= */
.cb-or{margin-top:44px}
.cb .aj--page .or{border-radius:16px}
.cb .aj--page .or-h{padding:14px 16px}
.cb .aj--page .or-l{padding:2px 16px 8px}
.cb .aj--page .or-l li{padding:10px 0}

/* ================= 4. LES MONTANTES ================= */
.mt,.bt{margin-top:44px}
.mt-course{margin-top:18px;padding:4px 16px 4px;border:1px solid var(--cb-line);border-radius:18px;background:var(--cb-surface)}
.mt-couloirs{margin:0;padding:0;list-style:none}
.mt-c{padding:18px 0 14px}
.mt-c+.mt-c{border-top:1px solid var(--cb-line)}
.mt-c-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 12px}
.cb .mt-nom{display:flex;align-items:center;gap:10px;margin:0;font-size:16px;font-weight:700;line-height:1.2}
.cb .mt-num{display:grid;place-items:center;flex:none;width:28px;height:28px;border:1.5px solid var(--cb-cyan);border-radius:50%;color:var(--cb-cyan);font-weight:400;font-size:16px;line-height:1}
.mt-g{min-width:0;margin-left:auto;font-size:13px;color:var(--cb-soft);font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}
/* La serie : depart, un rond allume par pari gagne (a la cote cumulee, echelle log), le palier du soir en anneau,
   le drapeau de la cote 10 au bout. */
.mt-piste{position:relative;height:44px;margin-top:10px}
.mt-rail{position:absolute;left:12px;right:42px;top:50%;height:4px;margin-top:-2px;border-radius:4px;background:rgba(141,179,211,.16)}
.mt-plein{position:absolute;left:0;top:0;bottom:0;width:calc(var(--x) * 100%);border-radius:4px;background:var(--cb-cyan);transform-origin:left center}
.mt-vise{position:absolute;top:1px;left:calc(var(--a) * 100%);width:calc((var(--b) - var(--a)) * 100%);height:0;border-top:2px dashed rgba(32,213,239,.8)}
.mt-depart{position:absolute;left:-6px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:var(--cb-surface);border:2px solid rgba(141,179,211,.45)}
.mt-pal{position:absolute;top:50%;left:calc(var(--x) * 100%);display:grid;place-items:center;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;
  font:700 11.5px/1 Inter,system-ui,sans-serif;font-variant-numeric:tabular-nums}
.mt-pal.is-gagne{background:var(--cb-cyan);color:#04222b;box-shadow:0 2px 6px rgba(0,0,0,.55)}
.mt-pal.is-soir{background:var(--cb-surface);color:var(--cb-cyan);border:2px solid var(--cb-cyan)}
.mt-arrivee{position:absolute;top:50%;right:-42px;display:inline-flex;align-items:center;gap:3px;transform:translateY(-50%);color:var(--cb-cyan)}
.mt-arrivee .cb-ico{width:15px;height:15px;vertical-align:0}
.cb .mt-arrivee b{font-weight:400;font-size:18px;line-height:1}
@media (prefers-reduced-motion:no-preference){.mt-pal.is-soir{animation:mt-respire 2.4s ease-in-out infinite}}
@keyframes mt-respire{50%{box-shadow:0 0 0 6px rgba(32,213,239,.16)}}
/* Les paliers s'allument un par un a l'entree a l'ecran (lib/combines-page.js pose l'etat d'attente, visible par
   defaut). */
.mt-attente .mt-plein{transform:scaleX(0)}
.mt-attente .mt-pal{transform:scale(0)}
.mt-vue .mt-plein{transition:transform .9s var(--cb-ease)}
.mt-vue .mt-pal{transition:transform .45s cubic-bezier(.16,1,.3,1) calc(var(--i) * 110ms + .15s)}
@media (prefers-reduced-motion:reduce){.mt-attente .mt-plein,.mt-attente .mt-pal{transform:none}}
/* Chiffres : cote cumulee, et « si ca passe ce soir » (Pro). */
.mt-figs{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 32px;margin-top:8px}
.mt-fig{display:grid;gap:3px}
.mt-k{font-size:12.5px;color:var(--cb-soft)}
.cb .mt-v{font-weight:400;font-size:38px;line-height:1;letter-spacing:.005em;color:var(--cb-ink);font-variant-numeric:tabular-nums}
.cb .mt-v--depart{font:600 17px/1.4 Inter,system-ui,sans-serif;color:var(--cb-soft2)}
.cb .mt-fig--soir .mt-v{color:var(--cb-cyan)}
.mt-fig--soir{grid-template-columns:auto auto;align-items:center;column-gap:10px}
.mt-fig--soir .mt-k{grid-column:1/-1}
.mt-arr{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid rgba(32,213,239,.45);border-radius:999px;color:var(--cb-cyan);font-size:12px;font-weight:700;white-space:nowrap}
.mt-arr .cb-ico{width:13px;height:13px;vertical-align:0}
.mt-soir{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 12px;margin:14px 0 0;padding:11px 12px;border-radius:12px;background:rgba(141,179,211,.06)}
.mt-soir-k{grid-column:1/-1;font-size:12.5px;font-weight:700;color:var(--cb-cyan)}
.mt-soir-p{display:grid;gap:2px;min-width:0}
.mt-soir-p b{font-size:14.5px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.mt-soir-p small{font-size:12.5px;line-height:1.4;color:var(--cb-soft)}
.cb .mt-soir-c{font-weight:400;font-size:26px;line-height:1;font-variant-numeric:tabular-nums}
.mt-soir--verrou .mt-soir-p b{font-size:13.5px;font-weight:500;color:var(--cb-soft2)}
.mt-soir--info{background:none;padding:2px 0 0}
.mt-soir--info .mt-soir-p small{font-size:13px;color:var(--cb-soft2)}
.mt-evt{display:flex;align-items:flex-start;gap:8px;margin:10px 0 0;font-size:13px;line-height:1.5;color:var(--cb-soft2)}
.mt-evt .cb-ico{margin-top:2px;color:var(--cb-soft);vertical-align:0}
.mt-evt--but{color:var(--cb-ink);font-weight:600}
.mt-evt--but .cb-ico{color:var(--cb-cyan)}
.mt-bilan{margin:12px 0 0;font-size:13px;font-weight:600;line-height:1.5;color:var(--cb-soft2);font-variant-numeric:tabular-nums}
.mt-det{margin-top:4px}
.mt-det summary{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--cb-cyan);font-size:13.5px;font-weight:600;cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent}
.mt-det summary::-webkit-details-marker{display:none}
.mt-chev{transition:transform .2s var(--cb-ease)}
.mt-det[open] .mt-chev{transform:rotate(180deg)}
.mt-ls{display:grid;margin:0 0 8px;padding:0;list-style:none}
.mt-l{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--cb-line);font-size:13px}
.mt-l-j{color:var(--cb-soft);font-variant-numeric:tabular-nums}
.mt-l-m,.mt-l-d{display:grid;gap:2px;min-width:0}
.mt-l-m b{font-weight:600;overflow-wrap:anywhere}
.mt-l-m small,.mt-l-d small{color:var(--cb-soft);font-size:12px}
.mt-l-d{justify-items:end}
.mt-l-d b{font-weight:700;font-variant-numeric:tabular-nums}
.mt-l-d small{display:inline-flex;align-items:center;gap:3px}
.mt-l-d .cb-ico{width:13px;height:13px;vertical-align:0}
.mt-l--gagne .mt-l-d small,.mt-l--perdu .mt-l-d small{color:var(--cb-ink)}
.mt-l--gagne .mt-l-d .cb-ico{color:var(--cb-cyan)}
.mt-l-m small.mt-l-cc{color:var(--cb-soft2)}
.mt-l--but .mt-l-m small.mt-l-cc{color:var(--cb-cyan);font-weight:700}
.mt-l--perdu .mt-l-m b,.mt-l--non_regle .mt-l-m b{color:var(--cb-soft2)}

/* ================= 5. LES BUTEURS DU JOUR (shadcn/ui Card) ================= */
.bt-grille{display:grid;gap:12px;margin-top:18px}
.bt-n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.bt-n1{grid-template-columns:minmax(0,1fr)}
@media (min-width:720px){.bt-n1{grid-template-columns:minmax(0,440px)}}
.bt-c{position:relative;min-width:0;border:1px solid var(--cb-line);border-radius:18px;background:var(--cb-panel);overflow:hidden;container:btc / inline-size}
.bt-c-in{display:flex;flex-direction:column;height:100%}
.bt-c-haut{position:relative;display:grid;place-items:center;padding:20px 12px 16px;
  background:linear-gradient(180deg,rgba(13,25,38,.15) 0%,rgba(13,25,38,.7) 62%,var(--cb-panel) 100%),url(/assets/hero/stade-nuit-portrait.webp?v=6bec6d294e) 50% 30%/cover no-repeat}
.cb .bt-c-rang{position:absolute;top:10px;left:12px;font-weight:400;font-size:26px;line-height:1;color:var(--cb-ink)}
.bt-c-photo{position:relative;display:block;width:92px;height:92px;border:2px solid var(--cb-cyan);border-radius:50%;background:#132233}
.bt-c-photo img[data-bt-photo]{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.cb .bt-c-init{position:absolute;inset:0;display:grid;place-items:center;font-weight:400;font-size:30px;line-height:1;color:var(--cb-soft2)}
.bt-c-logo{position:absolute;right:-8px;bottom:-4px;width:34px;height:34px;padding:4px;border-radius:50%;background:#f4f7fb;object-fit:contain;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.bt-c-corps{display:flex;flex-direction:column;gap:4px;flex:1;padding:12px 14px 14px}
.bt-c-nom{margin:0;font-size:17px;font-weight:700;line-height:1.2;letter-spacing:-.01em;text-wrap:balance;overflow-wrap:anywhere}
.bt-c-club,.bt-c-match{margin:0;font-size:12.5px;line-height:1.4;color:var(--cb-soft)}
.bt-c-match{margin-bottom:10px;color:var(--cb-soft2)}
.bt-c-chiffres{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:auto 0 0;padding-top:10px;border-top:1px solid var(--cb-line)}
.bt-c-chiffres div{display:flex;flex-direction:column}
.bt-c-chiffres dt{flex:1;font-size:11.5px;line-height:1.3;color:var(--cb-soft)}
.cb .bt-c-chiffres dd{margin:3px 0 0;font-weight:400;font-size:40px;line-height:1;font-variant-numeric:tabular-nums;color:var(--cb-cyan)}
.bt-c-type{margin:10px 0 0;font-size:12px;line-height:1.45;color:var(--cb-soft)}
.bt-c-type b{color:var(--cb-ink);font-weight:600}
.bt-c-out{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.04);color:var(--cb-soft2);font-size:12.5px;line-height:1.45}
.bt-c.is-off .bt-c-haut,.bt-c.is-off .bt-c-chiffres{opacity:.55}
.bt-c.is-off .bt-c-nom{text-decoration:line-through;text-decoration-thickness:1px}
.bt-c--faux .bt-c-photo{border-color:var(--cb-line2)}
.cb .bt-c--faux .bt-c-init{color:var(--cb-soft)}
.bt-c--faux .bt-c-init .cb-ico{width:40px;height:40px}
@container btc (min-width:400px){
  .bt-c-in{flex-direction:row}
  .bt-c-haut{flex:0 0 156px;padding:24px 12px}
  .bt-c-corps{padding:18px 18px 16px}
  .bt-c-nom{font-size:19px}
}

/* ---------- Mentions du bloc, regles, mentions legales ---------- */
.cb-vide{margin:26px 0 0;padding:18px;border:1px solid var(--cb-line2);border-radius:16px;color:var(--cb-soft2);font-size:15px;line-height:1.5}
.cb-registre{display:grid;grid-template-columns:minmax(0,1fr);margin:16px 0 0}
.cb-registre dt{padding:14px 0 0;border-top:1px solid var(--cb-line);font-size:15.5px;font-weight:700;line-height:1.4;color:var(--cb-ink)}
.cb-registre dd{margin:4px 0 0;padding:0 0 14px;font-size:14.5px;line-height:1.55;color:var(--cb-soft)}
.cb-registre dt:first-of-type{border-top:0;padding-top:4px}
@media (min-width:600px){
  .cb-registre{grid-template-columns:minmax(0,170px) minmax(0,1fr);column-gap:24px}
  .cb-registre dt,.cb-registre dd{margin:0;padding:15px 0;border-top:1px solid var(--cb-line)}
  .cb-registre dt:first-of-type,.cb-registre dd:first-of-type{border-top:0;padding-top:4px}
}
.cb .legal-note{margin:28px auto 0;color:var(--cb-soft);font-size:12px;line-height:1.7;text-align:center;text-wrap:balance}
.cb .legal-note--aide{margin-top:6px}
.cb .legal-note a{display:inline-flex;align-items:center;min-height:44px;padding:0 2px;color:var(--cb-soft);text-decoration:none}
.cb .legal-links{display:flex;flex-wrap:wrap;justify-content:center;margin-top:10px;font-size:0}
.cb .legal-links a{font-size:12px}
.cb .legal-links a:not(:last-child)::after{content:"\00B7";margin:0 3px 0 6px;color:var(--cb-soft)}

/* ---------- Ordinateur ---------- */
@media (min-width:768px){
  .cb-ouverture{padding:52px 0 8px}
  .cb-sommaire{flex-wrap:wrap;margin:22px 0 0;padding:0;overflow:visible}
  .tdj{margin-top:28px}
  .tdj-tete .cb-texte{font-size:15px}
  .mt-course{padding:6px 24px}
  .mt-c{padding:22px 0 18px}
  .cb .mt-v:not(.mt-v--depart){font-size:42px}
  .dc-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));margin:14px 0 0;padding:0;overflow:visible}
}
/* Deux tickets cote a cote : plus d'onglets. */
@media (min-width:900px){
  .cb .tdj-tabs{display:none}
  .tdj-scene.tdj-n2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
  .tdj-pan{display:block}
  .tdj-pan .tq{animation:tq-entree .7s var(--cb-ease) both}
  .tdj-pan:nth-child(2) .tq{animation-delay:.08s}
  .tdj-pan .tq-tampon{animation:tq-tampon .5s cubic-bezier(.16,1,.3,1) .55s both}
  .cb .tdj .aj-unlock{grid-template-columns:1fr auto;align-items:center;padding:18px 22px}
  .cb .tdj .aj-unlock .aj-cta{width:auto;min-width:300px}
  .cb .tdj .aj-small{grid-column:1/-1}
}
@media (min-width:900px) and (prefers-reduced-motion:reduce){.tdj-pan .tq,.tdj-pan .tq-tampon{animation:none}}
/* Telephone : tout le ticket et son bouton tiennent dans le premier ecran (375 x 812). */
@media (max-width:599px){
  .cb-ouverture{padding-top:16px}
  .tdj{margin-top:8px}
  .tq-nom{order:1}
  .tq-h .sc-lock{order:2}
  .tq-jour{order:3;flex-basis:100%;font-size:12px}
  .tq-corps{padding-top:2px}
  .tq-perfo{margin-top:14px}
  .tq-cache{padding-top:10px}
  .cb .tdj .aj-unlock{margin-top:10px;padding:14px}
}
/* Relecture ChatGPT (06/11) : legendes plus lisibles, moins de vide avant les onglets au telephone. */
.tq-chance-k{font-size:12.5px}
.tq-chance-k small{font-size:12px;color:var(--cb-soft2)}
@media (min-width:768px){.tq-chance{max-width:130px}.tq-jour{font-size:13.5px}.tq-chance-k{font-size:13px}}
@media (max-width:599px){.tdj-tete{gap:0}.tdj{margin-top:2px}}

/* Score en direct d'une jambe (lib/scores-direct.js, 06/11/2026) : etat provisoire, l'archive regle le resultat. */
.tq-direct{grid-column:2/-1;justify-self:start;display:inline-flex;align-items:center;gap:6px;margin-top:-4px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--cb-soft2);background:rgba(141,179,211,.08)}
.tq-direct[hidden]{display:none}
.tq-leg.sd-cours .tq-direct{color:#20d5ef;background:rgba(32,213,239,.1)}
.tq-leg.sd-cours .tq-direct::before{content:"";width:6px;height:6px;border-radius:50%;background:#20d5ef;animation:tqPouls 1.6s ease-in-out infinite}
.tq-leg.sd-passe .tq-direct{color:#060b12;background:#20d5ef}
.tq-leg.sd-passe .tq-direct::before{content:"\2713"}
.tq-leg.sd-perdu{opacity:.6}
.tq-leg.sd-perdu .tq-direct{color:#ff8a8a;background:rgba(255,107,107,.12)}
@keyframes tqPouls{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.tq-leg.sd-cours .tq-direct::before{animation:none}}

/* ============ LE NUL DU JOUR ET LA GRILLE LOTO FOOT (06/11/2026) : en haut de la page, Pro ============ */
.xn,.xl{display:grid;gap:14px;margin:8px 0 40px}
.xn .cb-tete-s,.xl .cb-tete-s{grid-template-columns:1fr auto;align-items:center}
.xn .cb-tete-s .cb-texte,.xl .cb-tete-s .cb-texte{grid-column:1/-1}
.xn-carte{position:relative;display:grid;gap:14px;padding:18px;border:1px solid var(--cb-line2);border-radius:20px;
  background:radial-gradient(120% 90% at 100% 0,rgba(32,213,239,.12),transparent 60%),var(--cb-panel)}
.xn-haut{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:600;color:var(--cb-soft2)}
.xn-heure{font-variant-numeric:tabular-nums;color:var(--cb-cyan)}
.xn-ligue{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.xn-match{display:grid;gap:6px}
.xn-eq{display:flex;align-items:center;gap:9px;min-width:0;font-size:17px}
.xn-eq b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:700;color:var(--cb-ink)}
.xn-logo{width:22px;height:22px;object-fit:contain;flex:none}
.xn-duel{display:grid;gap:9px}
.xn-ligne{display:grid;grid-template-columns:74px minmax(0,1fr) auto;align-items:center;gap:10px}
.xn-k{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--cb-ink)}
.xn-ligne--m .xn-k{color:var(--cb-soft)}
.xn-barre{position:relative;display:block;height:10px;border-radius:999px;background:rgba(141,179,211,.12);overflow:hidden}
.xn-barre>span{position:absolute;inset:0 auto 0 0;width:calc(var(--v,0)*100%);border-radius:inherit;background:linear-gradient(90deg,#06b6d4,#20d5ef)}
.xn-ligne--m .xn-barre>span,.xn-barre--m>span{background:rgba(180,192,207,.45)}
.xn-v{font:400 22px/1 var(--cb-num);color:var(--cb-ink);font-variant-numeric:tabular-nums;min-width:52px;text-align:right}
.xn-ligne--m .xn-v{color:var(--cb-soft2)}
.xn-bas{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.xn-pari{font-size:15px;font-weight:700;color:var(--cb-ink)}
.xn-cote{margin-left:auto;font:400 30px/1 var(--cb-num);color:var(--cb-ink)}
.xn-direct{margin:0}
.xn-direct [data-sd-jambe]{display:inline-flex;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;color:var(--cb-cyan);background:rgba(32,213,239,.1)}
.xn-direct [data-sd-jambe][hidden]{display:none}
.xn-carte.sd-passe .xn-direct [data-sd-jambe]{color:#060b12;background:var(--cb-cyan)}
.xn-carte.sd-perdu{opacity:.6}
.xn-carte--verrou{min-height:150px}
.xn-offre{justify-self:start;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid rgba(32,213,239,.45);border-radius:12px;background:rgba(32,213,239,.08);color:var(--cb-cyan);font:700 14px Inter,system-ui,sans-serif;cursor:pointer}
.xn-offre svg{width:16px;height:16px}
.xn-offre[hidden]{display:none}
.xn-offre:hover{background:rgba(32,213,239,.16)}

.xl-chiffres{display:grid;grid-template-columns:1.3fr 1fr;gap:10px}
.xl-fig{display:grid;gap:4px;align-content:start;padding:14px;border:1px solid var(--cb-line);border-radius:16px;background:var(--cb-panel)}
.xl-fig--fort{border-color:rgba(32,213,239,.45);background:radial-gradient(120% 100% at 0 0,rgba(32,213,239,.14),transparent 70%),var(--cb-panel)}
.xl-k{font-size:12px;font-weight:600;color:var(--cb-soft2)}
.xl-v{font:400 34px/1 var(--cb-num);color:var(--cb-ink);font-variant-numeric:tabular-nums}
.xl-v small{font:600 14px Inter,system-ui,sans-serif;color:var(--cb-soft)}
.xl-fig small{font-size:12px;color:var(--cb-soft)}
.xl-grille{border:1px solid var(--cb-line2);border-radius:18px;background:var(--cb-panel);overflow:hidden}
.xl-ls{list-style:none;margin:0;padding:6px 10px}
.xl-l{display:grid;grid-template-columns:40px minmax(0,1fr) repeat(3,40px);align-items:center;gap:6px;padding:9px 0}
.xl-l+.xl-l{border-top:1px solid var(--cb-line)}
.xl-l--tete{padding:4px 0}
.xl-l--tete .xl-c{background:none;border:0;color:var(--cb-soft);font-weight:800;font-size:12px}
.xl-h{font-size:12px;font-weight:600;color:var(--cb-soft2);font-variant-numeric:tabular-nums}
.xl-m{display:grid;gap:2px;min-width:0;font-size:13.5px}
.xl-m b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600;color:var(--cb-ink)}
.xl-c{display:grid;place-items:center;height:36px;border-radius:10px;border:1px solid var(--cb-line);font-size:13px;font-weight:700;color:var(--cb-soft2);font-variant-numeric:tabular-nums}
.xl-c.is-choix{border-color:transparent;background:var(--cb-cyan);color:#060b12}
.xl-l.is-double .xl-c.is-choix{background:linear-gradient(135deg,#20d5ef,#06b6d4)}
.xl-direct{justify-self:start;margin-top:3px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;color:var(--cb-cyan);background:rgba(32,213,239,.1)}
.xl-direct[hidden]{display:none}
.xl-l.sd-passe .xl-direct{color:#060b12;background:var(--cb-cyan)}
.xl-l.sd-perdu{opacity:.55}
@media (min-width:600px){.xl-l{grid-template-columns:56px minmax(0,1fr) repeat(3,52px)}.xl-m{grid-template-columns:1fr 1fr;column-gap:10px}.xl-direct{grid-column:1/-1}}

/* ============ ONGLETS DES RUBRIQUES (06/11/2026) : une barre en haut, un panneau par rubrique ============ */
.cb-onglets{position:sticky;top:var(--cb-haut,56px);z-index:6;display:flex;gap:6px;margin:4px -16px 22px;padding:10px 16px;overflow-x:auto;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;background:rgba(6,11,18,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--cb-line)}
.cb-onglets::-webkit-scrollbar{display:none}
.cb-onglet{display:inline-flex;align-items:center;gap:6px;flex:none;min-height:40px;padding:0 16px;border:1px solid var(--cb-line2);border-radius:999px;
  background:rgba(10,20,32,.86);color:var(--cb-soft2);font:600 14px Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer;
  transition:color .2s ease,border-color .2s ease,background-color .2s ease,transform .16s var(--cb-ease)}
.cb-onglet:active{transform:scale(.97)}
.cb-onglet[aria-selected="true"]{border-color:transparent;background:var(--cb-cyan);color:#060b12;font-weight:800}
.cb-onglet--lien{border-style:dashed;color:var(--cb-cyan)}
.cb-onglet--lien svg{width:15px;height:15px}
.cb-onglet:focus-visible{outline:2px solid var(--cb-cyan);outline-offset:2px}
@media (hover:hover) and (pointer:fine){.cb-onglet:not([aria-selected="true"]):hover{border-color:rgba(32,213,239,.6);color:var(--cb-ink)}}
@media (min-width:600px){.cb-onglets{margin-left:0;margin-right:0;padding-left:0;padding-right:0}}
.cb-panneau[hidden]{display:none}
.cb-panneau--entre{animation:cbEntre .32s var(--cb-ease) both}
@keyframes cbEntre{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.cb-panneau--entre{animation:none}}
/* Le championnat a penalties (06/11/2026) : les matchs du jour du championnat. */
.xp-liste{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.xp-m{display:grid;gap:6px;padding-bottom:12px;border-bottom:1px solid rgba(141,179,211,.14)}
/* Aujourd'hui avec l'acces Pro (06/11/2026) : ce que Pro debloque ce jour, en haut, pour les non-Pro. */
.cb-pro-soir{margin:4px 0 22px;padding:16px 18px;border:1px solid rgba(32,213,239,.35);border-radius:14px;background:linear-gradient(180deg,rgba(32,213,239,.08),rgba(32,213,239,.02))}
.cb-pro-soir .cb-h3{margin:0 0 10px;font-size:17px;font-weight:800;color:#f4f7fb}
.cb-pro-liste{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:7px}
.cb-pro-liste li{display:flex;gap:9px;align-items:center;font-size:14.5px;color:#f4f7fb}
.cb-pro-liste svg{width:16px;height:16px;flex:none;stroke:#20d5ef}
