/* ============================================================
   Turf360 Magazine — système de design ÉDITORIAL (partagé)
   ============================================================ */
/* 16/08/2026 : @import RETIRE (bloquant et serialise : il fallait telecharger + parser les 53 Ko
   de site.css avant meme de demander fonts.css). fonts.css est desormais charge en parallele par
   un <link> pose AVANT site.css dans chaque page. 🟥 Ne pas le remettre ici sans retirer les <link>. */
:root{
  --paper:#F4EFE3; --paper-2:#EDE7D8; --ink:#1B1712; --ink-soft:#4a4338; --muted:#6b614e;
  --green:#1B4332; --green-2:#2C6045; --red:#A6321F; --rule:#1B1712; --line:#D7CFBC;
  --maxw:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-y:scroll}
@view-transition{navigation:auto}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Newsreader",Georgia,serif;font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.disp{font-family:"Fraunces",Georgia,serif}
.mono{font-family:"Spline Sans Mono",monospace}
.kick{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.22em;font-size:11px;color:var(--muted);font-weight:600}

/* ---------- MASTHEAD ---------- */
header.site{border-bottom:2px solid var(--rule);view-transition-name:site-header}
footer.site{view-transition-name:site-footer}
.topline{border-bottom:1px solid var(--line)}
.topline .wrap{display:flex;justify-content:space-between;align-items:center;padding:7px 26px;
  font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.16em;font-size:10.5px;color:var(--muted)}
.tlb-left{display:flex;align-items:center;gap:16px}
.tlb-logout{color:var(--muted);cursor:pointer}
.tlb-logout:hover{color:var(--ink)}
.tlb-login-drop{position:relative}
.tlb-login-drop>a{color:var(--green);font-weight:600;cursor:pointer}
.tlb-login-drop>a:hover{color:var(--green-2)}
.tlb-login-pop{display:none;position:absolute;top:100%;right:0;margin-top:7px;background:var(--paper);border:1px solid var(--line);border-top:2px solid var(--ink);min-width:250px;padding:14px;z-index:30;text-align:left;text-transform:none;letter-spacing:normal}
.tlb-login-pop.open{display:block}
.tlb-login-pop p{margin:0 0 9px;font-family:"Newsreader",serif;font-style:italic;font-size:13px;color:var(--ink-soft)}
.tlb-login-pop form{display:flex;gap:6px}
.tlb-login-pop input{flex:1;min-width:0;padding:8px 9px;border:1.5px solid var(--ink);border-radius:3px;font-size:12.5px;font-family:"Newsreader",serif;background:#fff;text-transform:none;letter-spacing:normal}
.tlb-login-pop input.err{border-color:var(--red)}
.tlb-login-pop button{padding:8px 11px;border:0;border-radius:3px;background:var(--green);color:var(--paper);cursor:pointer;font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.08em;font-size:10.5px;font-weight:600;white-space:nowrap}
.tlb-login-pop button:hover{background:var(--green-2)}
.tlb-login-pop .ok{margin:0;font-family:"Fraunces",serif;font-weight:700;color:var(--green);font-size:13px;text-transform:none;letter-spacing:normal}
.masthead{text-align:center;padding:20px 26px 12px;position:relative}
.masthead .crest{display:inline-flex;align-items:center;justify-content:center;gap:14px}
.masthead .compass{width:54px;height:54px;flex:0 0 auto}
.masthead .name{font-family:"Fraunces",serif;font-weight:900;font-size:56px;line-height:.9;letter-spacing:-.01em;display:inline-block;color:var(--ink)}
.masthead .name b{color:var(--green)}
.masthead .sub{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.5em;font-weight:600;font-size:14px;color:var(--ink);margin-top:7px;padding-left:.5em}
.masthead .tag{font-family:"Newsreader",serif;font-style:italic;font-size:14px;color:var(--muted);margin-top:6px}
.masthead .flank{position:absolute;top:44%;height:1px;background:var(--rule);width:24%}
.masthead .flank.l{left:26px} .masthead .flank.r{right:26px}
nav.main{border-top:1px solid var(--line)}
nav.main .wrap{display:flex;justify-content:center;flex-wrap:wrap;gap:0;padding:0}
nav.main a{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:12px;
  padding:12px 16px;color:var(--ink-soft);border-left:1px solid var(--line)}
nav.main a:first-child{border-left:none}
nav.main a.live{color:var(--red);font-weight:600}
/* hover:hover exclut les écrans tactiles : sans ça, iOS/Android traitent le PREMIER tap sur un lien
   avec :hover comme un simple survol (pour les menus déroulants au survol desktop) et n'activent le
   lien qu'au 2ᵉ tap — un lien du menu ☰ (ex. "Le Direct du jour") semblait alors ne réagir à rien au
   premier tap. Signalé par Georges, reproduit (le lien restait vert/survolé sans naviguer). */
@media(hover:hover){
  nav.main a:hover{background:var(--green);color:var(--paper)}
  nav.main a.live:hover{color:var(--paper)}
}
.navdrop{position:relative;border-left:1px solid var(--line);display:flex;align-items:stretch}
.navdrop>a{display:block;border-left:none}
.navdrop>a::after{content:" ▾";font-size:8px;opacity:.6}
.navdrop-caret{display:none;border:0;background:transparent;color:var(--ink-soft);cursor:pointer;padding:0 14px;font-size:11px}
.navdrop-menu{display:none;position:absolute;top:100%;left:0;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-top:2px solid var(--rule);min-width:190px;z-index:20}
.navdrop:hover .navdrop-menu{display:flex}
.navdrop-menu a{border-left:none !important;border-bottom:1px solid var(--line);padding:11px 16px;white-space:nowrap}
.navdrop-menu a:last-child{border-bottom:none}
.nav-burger{display:none;width:100%;background:transparent;border:0;padding:13px 16px;font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:600;color:var(--ink-soft);cursor:pointer;text-align:center}
/* Menu principal du header : sous 700px, on remplace la rangée de 7 liens (qui s'enroulait sur 3
   lignes et poussait tout le contenu vers le bas) par un menu ☰ qui se déroule au tap — desktop
   inchangé. Le sous-menu "Stratégie du matin" bascule d'un survol (impossible au doigt) à un tap sur
   son propre bouton ▾ (le lien du dessus continue de naviguer normalement, cf. navToggleDrop). */
/* Seuil aligné sur 860px (celui déjà utilisé par masthead/hero/contact/inscription plus bas dans ce
   fichier) — pas 700px comme avant : à 700-859px la barre de 7 liens n'a jamais eu la place de tenir
   sur une ligne (mesuré : 2 lignes dès 701px, contre 1 seule à 1280px), donc le bug "nav qui s'enroule"
   revenait sur tout écran de tablette portrait (iPad 768/810/834px) alors que le ☰ était censé le régler. */
@media(max-width:860px){
  .nav-burger{display:block}
  nav.main .wrap{display:none;flex-direction:column;width:100%}
  nav.main.open .wrap{display:flex}
  nav.main a{border-left:0;border-top:1px solid var(--line);text-align:center;width:100%}
  .navdrop{border-left:0;flex-direction:column;width:100%}
  .navdrop>a{flex:1 1 auto;border-top:1px solid var(--line)}
  .navdrop>a::after{display:none}
  .navdrop-caret{display:block;width:100%;padding:10px 16px;font-size:14px;border-top:1px solid var(--line);border-left:0;background:var(--paper-2)}
  .navdrop:hover .navdrop-menu{display:none}
  .navdrop.open .navdrop-menu{display:flex}
  .navdrop-menu{position:static;border:0;min-width:0;width:100%;background:var(--paper-2)}
}

/* ---------- BANDEAU TITRE (pages internes) ---------- */
/* Même structure que le header des pages "Analyse Quinté" (kicker · H1 · sous-titre, centré). */
.pagehead{background:var(--paper);text-align:center;padding:0 26px}
.pagehead .wrap{padding:26px 0 20px;border-bottom:2px solid var(--rule)}
.pagehead .kick{margin-bottom:10px;letter-spacing:.1em;font-size:11.5px;font-weight:400}
.pagehead h1{font-family:"Fraunces",serif;font-weight:900;font-size:40px;line-height:1.02;letter-spacing:-.015em;margin:0;color:var(--ink)}
.pagehead p{margin:10px 0 0;color:var(--ink-soft);font-size:12px;font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.06em;font-style:normal}

/* ---------- CONTENU LÉGAL / DOC ---------- */
main{max-width:860px;margin:0 auto;padding:0 26px}
.doc{margin:34px 0}
.doc h2{font-family:"Fraunces",serif;font-weight:900;font-size:22px;color:var(--ink);margin:34px 0 8px;letter-spacing:-.01em;
  padding-bottom:8px;border-bottom:1px solid var(--line)}
.doc h2:first-child{margin-top:0}
.doc h3{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--green);margin:18px 0 4px;font-weight:600}
.doc p{margin:8px 0;font-size:16.5px;line-height:1.6;color:var(--ink-soft)}
.doc p b,.doc li b{color:var(--ink);font-weight:600}
.doc ul,.doc ol{margin:8px 0 14px;padding-left:22px}
.doc li{margin:4px 0;font-size:16.5px;line-height:1.55;color:var(--ink-soft)}
.doc .field{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.16em;font-size:10.5px;color:var(--muted);font-weight:600;margin-top:14px;margin-bottom:8px}
.doc a{color:var(--green);font-weight:600;border-bottom:1px solid var(--line)}
.doc a:hover{border-color:var(--green)}

/* ---------- CONTACT ---------- */
.contact{display:grid;grid-template-columns:1.3fr 1fr;gap:0;margin:34px 0}
.contact .col{padding:0 34px 0 0;border-right:1px solid var(--line)}
.contact .col.info{padding:0 0 0 34px;border-right:none}
.contact h2{font-family:"Fraunces",serif;font-weight:900;font-size:24px;margin:0 0 4px;letter-spacing:-.01em;color:var(--ink)}
.contact .sub{color:var(--muted);font-size:14.5px;margin:0 0 18px;font-style:italic}
form.cform{display:flex;flex-direction:column;gap:12px}
form.cform label{font-family:"Spline Sans Mono",monospace;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-soft);margin-bottom:-6px}
form.cform input,form.cform textarea{width:100%;padding:12px 14px;border:1.5px solid var(--ink);border-radius:3px;font-family:"Newsreader",serif;font-size:15px;background:#fff}
form.cform input:focus,form.cform textarea:focus{outline:2px solid var(--green);outline-offset:2px;border-color:var(--green)}
form.cform textarea{min-height:130px;resize:vertical}
form.cform button{font-family:"Spline Sans Mono",monospace;font-weight:600;font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  background:var(--green);color:var(--paper);border:none;border-radius:3px;padding:14px 22px;cursor:pointer;align-self:flex-start}
form.cform button:hover{background:var(--green-2)}
.cfine{color:var(--muted);font-size:12px;margin-top:2px}
.info .line{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--line)}
.info .line:first-of-type{border-top:none}
.info .ico{font-size:20px;line-height:1.2;flex:0 0 auto}
.info .k{font-family:"Spline Sans Mono",monospace;font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--green)}
.info .v{font-size:16px}
.info .v a{color:var(--ink);font-weight:600}
.info .v a:hover{color:var(--green-2)}
.info .hours{color:var(--muted);font-size:13.5px;font-style:italic}

/* ---------- PASSION TURF : profils + boussole ---------- */
.block-card{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;padding:32px 34px;margin:32px 0}
.block-card>*:first-child{margin-top:0}
.profiles{display:grid;grid-template-columns:1fr;gap:0;margin:28px 0 8px}
.profile{padding:0}
.profile:last-child{border-top:1px solid var(--line);margin-top:28px;padding-top:28px}
.profile .role{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--green);font-weight:600;margin-bottom:4px}
.profile h3{font-family:"Fraunces",serif;font-weight:600;font-size:24px;margin:0 0 8px;color:var(--green)}
.profile p{margin:0;color:var(--ink-soft);font-size:16.5px;line-height:1.55}
.profile-head{display:flex;align-items:flex-start;gap:20px;margin-bottom:10px}
.profile-photo{width:150px;height:auto;border-radius:4px;border:1px solid var(--line);flex-shrink:0;cursor:zoom-in}
.photo-lightbox{position:fixed;inset:0;background:rgba(20,22,18,.88);display:flex;align-items:center;justify-content:center;z-index:999;padding:24px;cursor:zoom-out}
.photo-lightbox img{max-width:92vw;max-height:92vh;border-radius:4px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.profile-head .role{margin-bottom:2px}
.profile-head h3{margin:0}
@media (max-width:560px){.profile-head{gap:14px}.profile-photo{width:110px}}
.compass-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0 10px}
.compass-card{border:1px solid var(--line);border-radius:3px;padding:18px 20px;background:var(--paper-2)}
.compass-card .pt{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:11px;color:var(--green);font-weight:600;margin-bottom:6px}
.compass-card h3{font-family:"Fraunces",serif;font-weight:600;font-size:19px;margin:0 0 6px;color:var(--ink)}
.compass-card p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.5}
@media(max-width:680px){.compass-grid{grid-template-columns:1fr}}

/* ---------- PASSION TURF : tableau stratégies (preuve) ---------- */
.strat-table{width:100%;border-collapse:collapse;margin:18px 0 8px;font-size:14.5px}
.strat-table th{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:var(--muted);font-weight:600;text-align:left;padding:8px 10px;border-bottom:2px solid var(--rule)}
.strat-table th.num,.strat-table td.num{text-align:center}
.strat-table td{padding:11px 10px;border-bottom:1px solid var(--line);color:var(--ink-soft)}
.strat-table td.nom{color:var(--ink);font-weight:600}
.strat-table td.roi{font-family:"Spline Sans Mono",monospace;font-weight:600;color:var(--green)}
/* padding+margin négative égale : agrandit la zone tactile réelle (mesuré : ~14×19px avant, cible
   WCAG 44×44px) sans déplacer le glyphe ni le texte autour (le padding est exactement compensé). */
.ico{display:inline-block;margin:-5px -5px -5px -2px;padding:5px;color:#b3ae96;font-size:12px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ico:hover,.ico:active{color:var(--green)}
/* Registre d'icônes GIC (repris à l'identique du Direct) : trait fin monochrome, hérite la couleur via
   currentColor. Définition unique — .gic était redéfini une 2e fois plus bas (doublon avec des valeurs
   différentes, 1.2em/.5em au lieu de 1.15em/.4em) ; comme les 2 règles avaient la même spécificité, la
   2e écrasait silencieusement la 1re partout sur le site sans que ça se voie. Fusionné en une seule
   déclaration (celle qui gagnait déjà, donc aucun changement visuel) pour ne plus avoir 2 sources de
   vérité qui peuvent diverger au prochain edit. */
#tip{position:fixed;z-index:200;max-width:min(280px,86vw);background:var(--ink);color:var(--paper);font-family:"Newsreader",serif;font-weight:500;font-size:12.5px;line-height:1.45;padding:9px 11px;border-radius:3px;display:none;text-align:left;white-space:normal}

/* ---------- NOS BOTS : porte d'accès + cartes ---------- */
.qgate{border:1px solid var(--line);border-radius:3px;background:var(--paper-2);padding:28px 30px;max-width:520px}
.qgate .qgk{font-family:"Fraunces",serif;font-weight:900;font-size:22px;color:var(--ink);margin-bottom:10px}
.qgate p{margin:0 0 16px;color:var(--ink-soft)}
.bots-list{display:flex;flex-direction:column;gap:16px;margin:20px 0}
.bot-card{border:1px solid var(--line);border-radius:3px;background:var(--paper-2);padding:18px 20px}
/* Échelle typo disciplinée à 5 tailles, chacune avec un rôle unique : 18 titre / 14.5 donnée principale
   (même taille que .strat-table) / 12.5 donnée secondaire + corps de tableau / 11 badge / 10.5 en-tête
   de tableau (même taille que .strat-table th). Rien d'autre. */
.bot-name{font-family:"Fraunces",serif;font-weight:600;font-size:18px;color:var(--ink);margin-bottom:8px}
.bot-stat{font-size:14.5px;color:var(--ink-soft);margin-bottom:10px}
.bot-bilan{font-size:12.5px;font-family:"Spline Sans Mono",monospace;font-weight:600;margin-bottom:2px}
.bot-bilan.pos{color:var(--green)}
.bot-bilan.neg{color:var(--red)}
.bot-caution{font-size:12.5px;font-style:italic;color:var(--muted);margin-bottom:10px}
/* Mention historique du Bilan (16/08/2026) : rappelle que les jours d'avant le 10/08 sont recalculés,
   pas diffusés à l'époque. Doit se voir sans crier — filet à gauche, juste sous la ligne ROI/tickets. */
.bot-histnote{font-size:12px;font-style:italic;color:var(--ink-soft);border-left:2px solid var(--line);padding-left:10px;margin:0 0 10px}
/* Bloc « Nos propositions Placé — deux façons de suivre » (16/08/2026). */
.sp-intro{font-size:14px;line-height:1.5;color:var(--ink-soft);margin:0 0 12px}
.sp-tab{width:100%;border-collapse:collapse;font-size:13.5px;margin-bottom:12px}
.sp-tab th{text-align:left;font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.06em;font-size:10.5px;color:var(--muted);padding:0 10px 7px 0;border-bottom:1px solid var(--line)}
.sp-tab td{padding:10px 10px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.sp-tab tr:last-child td{border-bottom:none}
.sp-quoi{font-size:12px;color:var(--muted)}
.sp-note{font-size:13px;line-height:1.5;color:var(--ink-soft);margin:0 0 12px}
.sp-ordre{font-size:13.5px;line-height:1.5;color:var(--ink-soft);background:var(--paper-2);border-left:3px solid var(--green);padding:12px 14px}
.bot-stakes{font-family:"Spline Sans Mono",monospace;font-size:11.5px;color:var(--muted);line-height:1.5;margin:0 0 12px}
.bot-risk{border:1px solid var(--line);border-radius:3px;background:var(--paper);padding:14px 16px;margin-bottom:12px}
.bot-risk-title{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.08em;font-size:10.5px;color:var(--muted);font-weight:600;margin-bottom:8px}
.bot-risk-title.live{display:flex;align-items:center;gap:7px;color:var(--red)}
.bot-risk-title.live .dot{width:7px;height:7px;border-radius:50%;background:var(--red);animation:pulse 1.8s infinite;flex:0 0 auto}
.risk-chart{width:100%;height:64px;display:block}
.risk-line{fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.risk-zero{stroke:var(--muted);stroke-width:1;stroke-dasharray:3 3}
.risk-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-top:12px}
.risk-item{display:flex;flex-direction:column;gap:2px}
.risk-item b{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.06em;font-size:10.5px;color:var(--muted);font-weight:600}
.risk-item span{font-size:12.5px;color:var(--ink);font-weight:600}
.bot-status{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:600;padding:6px 12px;border-radius:999px;display:inline-block}
.bf-toolbar{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;padding:10px 14px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin:12px 0}
.bf-grp{display:flex;align-items:center;gap:6px}
.bf-grp label{font-family:"Spline Sans Mono",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-weight:600}
.bf-seg{display:inline-flex;border:1px solid var(--ink);border-radius:3px;overflow:hidden;background:transparent}
.bf-seg button{border:0;border-left:1px solid var(--line);background:transparent;padding:5px 10px;font-family:"Spline Sans Mono",monospace;font-size:11.5px;font-weight:500;color:var(--ink);cursor:pointer}
.bf-seg button:first-child{border-left:0}
.bf-seg button.ic{font-size:15px;padding:5px 10px;display:inline-flex;align-items:center;gap:5px}
.bf-seg button.ic .gic{margin-right:0}
.bf-ic-lbl{font-family:"Spline Sans Mono",monospace;font-size:11.5px;font-weight:500}
.bf-seg button.on{background:var(--ink);color:var(--paper)}
/* Sous 700px : le filtre "Type" (Tous/Solide/Opposants/Trublion/Difficile, avec icônes) est trop large
   pour tenir sur une ligne — débordait hors écran comme .bf-seg-lg (même cause, même correctif :
   boutons individuels qui s'enroulent). Discipline/Partants (peu de boutons courts) ne sont pas
   affectés, ils tiennent déjà — flex-wrap ne change rien quand il n'y a rien à enrouler. */
@media(max-width:700px){
  .bf-grp{flex-direction:column;align-items:flex-start;width:100%;gap:6px}
  .bf-seg{display:flex;flex-wrap:wrap;gap:6px;border:0;border-radius:0;overflow:visible;width:100%}
  .bf-seg button{border:1px solid var(--ink)!important;border-radius:3px;flex:1 1 auto;text-align:center}
}
.bf-seg-lg{border-width:1.5px;border-color:var(--green)}
.bf-seg-lg button{padding:6px 13px;font-size:12.5px;font-weight:600}
.bf-seg-lg button.on{background:var(--green);color:var(--paper)}
/* Sous 700px (seul usage de .bf-seg-lg : le sélecteur "5 styles de mise" de bilan-direct.html), même
   correctif que .seg-lg dans direct-actuel.html — "Gestion Minimale des Mises" ne tient jamais à côté
   de 4 autres boutons sur un écran de téléphone, la barre segmentée unique débordait hors champ. */
@media(max-width:700px){
  .bf-seg-lg{display:flex;flex-wrap:wrap;gap:6px;border:0;border-radius:0;overflow:visible}
  .bf-seg-lg button{border:1.5px solid var(--green)!important;border-radius:3px;flex:1 1 auto;text-align:center}
  .bf-seg-lg button.on{background:var(--green);color:var(--paper)}
}
.bf-reset{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;font-size:11px;color:var(--green);font-weight:600;cursor:pointer;text-decoration:underline}
/* .peda-methods/.peda-mbtn : bloc dupliqué plus bas dans ce fichier (2e version avec .peda-mbtn en
   background:var(--paper-2) au lieu de var(--paper) ici — la 2e gagnait déjà silencieusement, même
   piège que .gic plus haut). Retiré d'ici, une seule définition subsiste (celle qui gagnait), aucun
   changement visuel. */
.bilan-hub{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:28px 0 8px}
@media(max-width:820px){.bilan-hub{grid-template-columns:1fr}}
.bilan-hub-card{display:flex;flex-direction:column;padding:28px 26px;border:1px solid var(--line);border-top:3px solid var(--green);border-radius:3px;background:var(--paper);color:inherit;text-decoration:none}
.bilan-hub-card:hover{border-color:var(--ink)}
.bilan-hub-card h2{font-family:"Fraunces",serif;font-weight:700;font-size:23px;margin:10px 0 10px;color:var(--ink)}
.bilan-hub-card p{color:var(--ink-soft);font-size:14.5px;line-height:1.5;margin:0 0 16px;flex:1}
.bilan-hub-card .go{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--ink);border-bottom:1.5px solid var(--green);align-self:flex-start;padding-bottom:1px}
.bot-status.st-search{background:var(--paper);color:var(--muted);border:1px solid var(--line)}
.bot-status.st-pending{background:#FBEECA;color:#7a5a10}
.bot-status.st-won{background:var(--paper);color:var(--green);border:1px solid var(--green)}
.bot-status.st-done{background:var(--paper);color:var(--muted);border:1px solid var(--line)}
.bot-journal-wrap{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);overflow-x:auto}
.bot-journal-table{width:100%;border-collapse:collapse;font-size:12.5px;white-space:nowrap}
.bot-journal-table th{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:var(--muted);font-weight:600;text-align:left;padding:8px 8px;border-bottom:2px solid var(--rule)}
.bot-journal-table td{padding:8px;border-bottom:1px solid var(--line);color:var(--ink-soft)}
.bot-journal-table td.num{text-align:right;font-family:"Spline Sans Mono",monospace}
.bot-journal-table tr.jr-win td.num{color:var(--green);font-weight:600}
.bot-journal-table tr.jr-los td.num{color:var(--red)}
.bot-journal-table tr.jr-pend td.num{color:#7a5a10;font-style:italic}

/* ---------- PLACEHOLDER « En cours d'arrivée » ---------- */
.soon{max-width:720px;margin:0 auto;padding:70px 26px 90px;text-align:center}
.flag{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.28em;font-size:11px;color:var(--red);font-weight:600;
  display:inline-block;border:1px solid var(--red);border-radius:999px;padding:6px 16px}
.soon .flag{margin-bottom:22px}
/* Variante compacte pour une carte .rub-mini (home, timeline 08h15) — même badge, taille réduite, pas de
   centrage/marge de page puisqu'elle vit DANS une carte plutôt que seule sur une page. */
.rub-mini .flag{font-size:9.5px;letter-spacing:.18em;padding:4px 10px;align-self:flex-start;margin-top:auto}
.soon h1{font-family:"Fraunces",serif;font-weight:900;font-size:52px;line-height:1.02;letter-spacing:-.02em;margin:0 0 8px;color:var(--ink)}
.soon h1 em{font-style:italic;color:var(--green)}
.soon p{font-size:18px;color:var(--ink-soft);line-height:1.6;max-width:46ch;margin:14px auto 0}
.soon .rule{width:80px;height:2px;background:var(--ink);margin:26px auto}
.soon .back{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--ink);
  border-bottom:1.5px solid var(--green);padding-bottom:2px;display:inline-block;margin-top:8px}

/* ---------- FOOTER ---------- */
footer.site{margin-top:52px;border-top:2px solid var(--rule);background:var(--paper-2)}
footer.site .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:26px}
footer.site .fn{font-family:"Fraunces",serif;font-weight:900;font-size:26px;color:var(--ink)}
footer.site .fn b{color:var(--green)}
footer.site nav{display:flex;gap:18px;flex-wrap:wrap;align-items:center;
  font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:11.5px;color:var(--ink-soft)}
footer.site nav a:hover{color:var(--ink)}
.legal{border-top:1px solid var(--line);padding:14px 26px 26px;max-width:var(--maxw);margin:0 auto;display:flex;flex-direction:column;gap:6px}
.legal p{display:flex;align-items:flex-start;gap:7px;font-style:italic;color:var(--muted);font-size:12.5px;line-height:1.5;margin:0}
.legal-ic{flex:0 0 auto;width:1.05em;height:1.05em;margin-top:2px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ---------- HOME : hero + bulletin ---------- */
.hero{border-bottom:2px solid var(--rule)}
.hero .grid{display:grid;grid-template-columns:1.55fr 1fr;gap:0;align-items:start}
.hero .lead{padding:40px 40px 42px 0;border-right:1px solid var(--line)}
/* grid-fill (08/08/2026, demande Georges) : "Chaque moment de votre journée" glissé dans le vide laissé
   sous le formulaire (colonne gauche plus courte que le bulletin) au lieu d'être une section séparée en
   dessous — le bulletin ("bull") s'étend sur les 2 lignes, lead+daypart se partagent la colonne de gauche.
   Rend le vide utile plutôt que de le combler artificiellement ou de raccourcir le bulletin. */
.grid-fill{grid-template-areas:"lead bull" "day bull"}
.grid-fill .lead{grid-area:lead}
.grid-fill .bulletin{grid-area:bull}
.grid-fill .daypart{grid-area:day;padding:0 40px 40px 0;border-right:1px solid var(--line)}
.grid-fill .daypart .sec-head{padding-top:0}
.hero .kick-row{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.hero .kick-row::after{content:"";flex:1;height:1px;background:var(--line)}
.hero h1{font-family:"Fraunces",serif;font-weight:900;font-size:56px;line-height:1.02;letter-spacing:-.015em;margin:0 0 20px;color:var(--ink)}
.hero h1 em{font-style:italic;font-weight:600;color:var(--green)}
.hero .deck{font-size:20px;line-height:1.5;color:var(--ink-soft);max-width:42ch;margin:0 0 26px}
/* GIF/vidéo hero (08/08/2026, demande Georges) : joue UNE fois puis se fige sur la dernière image (pas de
   loop). Source mp4 (419Ko) au lieu du gif d'origine (5,6Mo, même rendu) — 13x plus léger, gif gardé en
   repli à l'intérieur de <video> pour les rares navigateurs qui ne le liraient pas.
   Déplacée du bloc "lead" (poussait le formulaire d'inscription hors écran) vers le bulletin "En ce
   moment", au-dessus du bandeau — largeur pleine colonne plutôt que la contrainte 240px d'avant.
   margin-top:8px : compense l'écart de padding-top entre .lead (40px) et .bulletin (32px) pour que la
   vidéo démarre exactement à la même hauteur que "À la une" dans la colonne de gauche. */
.hero-gif{display:block;width:100%;border-radius:3px;border:1px solid var(--line);margin:8px 0 14px}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.btn{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:12.5px;padding:13px 22px;border:1.5px solid var(--ink)}
.btn.solid{background:var(--green);border-color:var(--green);color:var(--paper)}
.btn.solid:hover{background:var(--green-2);border-color:var(--green-2)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.bulletin{padding:32px 26px 32px 34px}
.bulletin:hover{background:var(--paper-2)}
.bulletin:hover .hd .t{color:var(--green)}
.bulletin .hd{display:flex;align-items:center;gap:9px;border-bottom:2px solid var(--rule);padding-bottom:8px;margin-bottom:4px}
.bulletin .hd .dot{width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:none;animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:none}70%{box-shadow:none}100%{box-shadow:none}}
.bulletin .hd .t{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.2em;font-size:12px;font-weight:600}
.item{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.item .rc{font-family:"Spline Sans Mono",monospace;font-weight:600;font-size:13px;color:var(--green)}
.item .tx{font-size:16.5px;line-height:1.35}
.item .rcd{font-size:12.5px;color:var(--muted);margin-top:2px}
.item.hot .tx{color:var(--red);font-weight:500}
.item.pending{opacity:.55;font-style:italic}
.item.pending .rc{color:var(--muted)}

/* ---------- HOME : bulletin "Frissons dans le Direct du jour" (08/08/2026) ---------- */
.blt-title{font-family:"Fraunces",serif;font-weight:800;font-size:21px;line-height:1.15;margin:10px 0 14px;color:var(--ink)}
.blt-now{border:1px solid var(--line);background:var(--paper-2);border-radius:3px;padding:12px 14px;margin-bottom:14px}
.blt-now-lbl{display:block;font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:10.5px;color:var(--muted);margin-bottom:4px}
.blt-now-txt{margin:0;font-size:16px;line-height:1.4;color:var(--ink);font-weight:600}
.blt-list{display:flex;flex-direction:column}
.blt-row{padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.blt-row:last-child{border-bottom:none}
.blt-row-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.blt-time{font-family:"Spline Sans Mono",monospace;font-size:11.5px;color:var(--muted)}
.blt-role{font-weight:700;color:var(--ink)}
.blt-detail{color:var(--ink-soft);font-size:12.5px;margin-top:2px}
.blt-cta{display:block;text-align:center;margin-top:18px}
.blt-top{margin-top:20px;padding-top:16px;border-top:1px solid var(--rule)}
.blt-top .hd{border-bottom:2px solid var(--rule);padding-bottom:8px;margin-bottom:8px}
.blt-top-sub{margin:0 0 6px;font-size:12.5px;color:var(--ink-soft);line-height:1.4}
.blt-countdown{margin:14px 0 0;padding:12px 14px;border:1px solid var(--green);border-radius:3px;
  background:var(--paper-2);color:var(--green);text-align:center;font-family:"Spline Sans Mono",monospace;
  font-weight:600;font-size:14px;letter-spacing:.03em}

/* "Nos correspondants" — dépêches style SMS (10/08/2026, demande Georges 2e passe : le premier essai
   "télégramme" recopiait le texte PMU juste redécoupé, jugé trop proche du texte source ; désormais
   réécrit par IA côté serveur, cf. server/correspondant.js — visuel de bulle de message, pas de ticket). */
.propo-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}
@media(max-width:760px){.propo-list{grid-template-columns:1fr}}
.propo-card{background:var(--paper-2);border:1px solid var(--line);border-radius:16px 16px 16px 4px;padding:14px 16px}
.propo-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:8px;
  font-family:"Spline Sans Mono",monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.propo-head .rc{font-family:"Fraunces",serif;font-style:italic;font-weight:800;font-size:14px;
  text-transform:none;color:var(--ink-soft)}
.propo-role{color:var(--green);font-weight:700}
.propo-txt{margin:0;font-family:"Newsreader",serif;font-size:15.5px;line-height:1.5;color:var(--ink)}
.propo-sign{display:inline-block;margin-top:6px;font-family:"Spline Sans Mono",monospace;font-size:11px;color:var(--muted)}

/* ---------- HOME : rubriques ---------- */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:34px 0 6px;border-bottom:2px solid var(--rule)}
.sec-head h2{font-family:"Fraunces",serif;font-weight:900;font-size:32px;letter-spacing:-.01em;margin:0;color:var(--ink)}
.sec-head .note{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--muted)}
/* Mobile : sans wrap, ".note" (petite légende, ex. "Ça se passe quand ?") se retrouvait écrasé dans
   une colonne étroite à côté d'un h2 de 32px sur 4 lignes, texte éclaté en un mot par ligne. */
@media(max-width:700px){
  .sec-head{flex-wrap:wrap}
  .sec-head .note{flex:1 1 100%}
}
.rubriques{display:grid;grid-template-columns:1fr 1fr;gap:0}
.rub{padding:26px 34px 30px 0;border-bottom:1px solid var(--line)}
.rub:nth-child(odd){padding-right:40px;border-right:1px solid var(--line)}
.rub:nth-child(even){padding-left:40px}
.rub .no{font-family:"Fraunces",serif;font-weight:900;font-size:22px;color:var(--green);line-height:1}
.rub h3{font-family:"Fraunces",serif;font-weight:600;font-size:26px;margin:8px 0 8px;line-height:1.1;color:var(--ink)}
.rub .hook{margin:0 0 8px;color:var(--green);font-weight:600;font-size:18px;font-style:italic}
.rub p{margin:0 0 14px;color:var(--ink-soft);font-size:16.5px;line-height:1.5}
.rub .go{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:11.5px;color:var(--ink);border-bottom:1.5px solid var(--green);padding-bottom:2px}

/* ---------- HOME (variante) : chronologie de la journée ---------- */
/* Trait UNIQUE (pas une bordure par étape) : plusieurs bordures indépendantes s'arrondissent chacune à leur
   pixel physique et créent une micro-marche à la jonction, visible sur plusieurs navigateurs (signalé par
   Georges 08/08/2026). Un seul élément ne peut pas se désaligner avec lui-même. */
.timeline{position:relative;padding:10px 0 0}
.timeline::before{content:"";position:absolute;left:19px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl-step{position:relative;padding:0 0 36px 34px}
.tl-step:last-child{padding-bottom:0}
.tl-step::before{content:"";position:absolute;left:-7px;top:2px;width:12px;height:12px;border-radius:50%;background:var(--green);border:3px solid var(--paper);z-index:1}
.tl-time{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.16em;font-size:12px;color:var(--green);font-weight:600;margin-bottom:8px}
.tl-body h3{font-family:"Fraunces",serif;font-weight:600;font-size:25px;margin:0 0 6px;line-height:1.1;color:var(--ink)}
.tl-body .hook{color:var(--green);font-weight:600;font-style:italic;font-size:16px;margin:0 0 16px}
.tl-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;max-width:900px}
.rub-mini{display:flex;flex-direction:column;gap:5px;padding:16px 18px;border:1px solid var(--line);border-radius:3px;background:var(--paper-2)}
.rub-mini.wide{max-width:520px}
.rub-mini > b{font-family:"Fraunces",serif;font-weight:600;font-size:18px;color:var(--ink)}
.rub-mini span{color:var(--ink-soft);font-size:14.5px;line-height:1.4}
.rub-mini .go{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--ink);border-bottom:1.5px solid var(--green);align-self:flex-start;margin-top:4px;padding-bottom:1px}
@media(max-width:680px){.tl-links{grid-template-columns:1fr}}
/* 🔒 EN RÉSERVE — "Option C" testée le 08/08/2026 ("Le Direct" mis en avant seul + bandeau compact pour
   les 4 rubriques "en cours d'arrivée", plutôt que de les noyer avec le même poids visuel que "Le Direct").
   Georges a demandé de revenir à la version d'avant (frise à 3 étapes ci-dessus) — CSS gardée au chaud,
   pas supprimée, au cas où l'idée revienne. Plus utilisée par aucun HTML actuellement.
.rub-mini.featured{max-width:none;padding:26px 30px;border:2px solid var(--green)}
.rub-mini.featured > b{font-size:26px}
.rub-mini.featured > span:not(.go){font-size:16px;max-width:60ch}
.soon-banner{margin-top:22px;padding:18px 22px;border:1px dashed var(--line);border-radius:3px;background:var(--paper-2)}
.soon-banner-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.soon-banner-head > span:last-child{font-size:14px;color:var(--ink-soft);line-height:1.4}
.soon-banner-list{display:flex;gap:10px;flex-wrap:wrap}
.soon-banner-list a{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;font-size:11.5px;color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:7px 14px;background:var(--paper)}
.soon-banner-list a:hover{border-color:var(--green);color:var(--green)}
*/

/* ---------- HOME : résultats (preuve) — bande de jours qui coulisse, distincte du bulletin En Direct ---------- */
.scroll-hint{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:10.5px;color:var(--green);font-weight:600;margin:16px 0 0}
.daystrip-wrap{position:relative}
.daystrip-wrap::after{content:"";position:absolute;top:0;right:0;bottom:8px;width:56px;background:linear-gradient(to right, transparent, var(--paper) 70%);pointer-events:none}
.daystrip{display:flex;gap:16px;overflow-x:auto;padding:22px 2px 8px;margin:0;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.daycard{flex:0 0 auto;width:280px;scroll-snap-align:start;border:1px solid var(--line);border-radius:3px;background:var(--paper-2);padding:18px 20px}
.daycard-dd{font-family:"Fraunces",serif;font-weight:900;font-size:21px;color:var(--ink);border-bottom:2px solid var(--rule);padding-bottom:9px;margin-bottom:12px}
.daystrip .grp{margin-top:14px}
.daystrip .grp:first-of-type{margin-top:0}
.daystrip .lbl{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.14em;font-size:10.5px;color:var(--green);font-weight:600;display:block;margin-bottom:5px}
.daystrip .item{display:block;padding:0 0 10px}
.daystrip .item .tx{font-size:15px;line-height:1.35}
.demo-note{color:var(--muted);font-size:12.5px;font-style:italic;margin:14px 0 4px}
.wall-sub{color:var(--ink-soft);font-size:15px;margin:14px 0 0;max-width:640px}
.wall-sub b{color:var(--ink)}
.wall-src{display:inline-block;margin-top:6px;color:var(--muted);font-size:12.5px}
.wall-src a{color:var(--green);font-weight:600}
.propo-cta{color:var(--green);font-weight:700;white-space:nowrap}
.propo-note{margin:8px 0 0;max-width:640px;font-style:italic;font-size:12.5px;color:var(--muted)}
/* 💥 Le Mur des exploits (port fidèle de direct-actuel.html, sans le bandeau KPI) */
.gic{display:inline-block;width:1.2em;height:1.2em;vertical-align:-0.22em;margin-right:.5em;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pmu{font-family:"Spline Sans Mono",monospace;font-size:10px;font-weight:600;color:#fff;background:var(--green);display:inline-flex;align-items:center;line-height:1;border-radius:3px;padding:3px 5px;letter-spacing:.04em;vertical-align:middle}
.ex-feat{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0 16px}
@media(max-width:640px){.ex-feat{grid-template-columns:1fr}}
/* Bordure or (08/08/2026, demande Georges) : plusieurs essais (dégradé feu, dégradé rouge/or/vert, dégradé
   or seul) avant de retomber sur de l'or uni — la bordure d'origine et le liseré intérieur testé ont fini
   dans EXACTEMENT la même couleur, donc simplifié en une seule bordure épaisse plutôt que le montage à 2
   calques (bordure 1px + anneau masqué en ::after) qui donnait un résultat visuel identique. */
/* flex column + .ex-fres en margin-top:auto (10/08/2026, demande Georges) : les 3 cartes (vedette/record
   gagnant/record placé) s'étirent déjà à la même hauteur (grid stretch), mais sans ça le nom du cheval
   pousse "Gagne X,XX €" à une hauteur différente selon sa longueur (retour à la ligne ou pas) -> plus
   aligné horizontalement d'une carte à l'autre. En épinglant la ligne de résultat en bas, elle reste au
   même niveau sur les 3 cartes quelle que soit la longueur du nom/lieu au-dessus. */
.ex-fcard{display:flex;flex-direction:column;background:var(--paper-2);border:4px solid #C9973B;border-radius:3px;padding:15px 17px;color:var(--ink)}
.ex-ftag{display:flex;align-items:center;font-family:"Spline Sans Mono",monospace;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin-bottom:8px}
.ex-ftag .gic{width:1em;height:1em;margin-right:.35em;stroke-width:1.8}
.ex-fnom{font-family:"Fraunces",serif;font-style:italic;font-weight:800;font-size:24px;color:var(--ink);line-height:1.02}
.ex-floc{font-family:"Spline Sans Mono",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:4px}
.ex-fres{margin-top:auto;padding-top:12px;font-family:"Fraunces",serif;font-size:22px;font-weight:600;color:var(--green)}
.ex-fres .gic{width:.85em;height:.85em;margin-right:.3em;vertical-align:-.08em}
.ex-fres .ex-mise{display:block;margin-top:2px;font-family:"Spline Sans Mono",monospace;font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:500}
.ex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.ex-card{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;overflow:hidden;display:flex;flex-direction:column}
.ex-c-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:8px 11px 4px;font-size:12px}
.ex-rc{font-family:"Fraunces",serif;font-style:italic;font-weight:800;color:var(--ink-soft)}
.ex-hip{font-weight:700}
.ex-de{font-size:14px}
/* flex-basis:100% (10/08/2026, demande Georges) : force la date sur sa propre ligne, sous "R1C3
   Galop · DEAUVILLE", au lieu de rester collée à droite sur la même ligne. */
.ex-date{flex-basis:100%;margin-left:0;margin-top:1px;color:var(--muted);font-size:11.5px}
.ex-c-h{display:flex;align-items:baseline;gap:7px;padding:2px 11px 6px}
.ex-num{font-family:"Spline Sans Mono",monospace;font-weight:600;background:var(--green);color:#fff;border-radius:2px;padding:0 6px;font-size:12px}
.ex-nom{font-weight:700;color:var(--ink)}
.ex-cote{margin-left:auto;font-size:11.5px;color:var(--muted)}
.ex-res{font-weight:700;font-size:14px;padding:8px 11px;border-top:1px solid var(--line);margin-top:auto}
.ex-res.ex-win{color:var(--green)}
.ex-res.ex-place{color:var(--ink-soft)}
.ex-res .ex-mise{font-weight:600;font-size:10.5px;color:var(--muted)}
/* 💶 Bilans (page bilans.html, port fidèle du sélecteur multi-bilans de direct-actuel.html) */
.ex-head{border-bottom:2px solid var(--ink);padding-bottom:8px;margin:20px 4px 14px}
.ex-title{font-family:"Fraunces",serif;font-style:italic;font-weight:800;font-size:24px;color:var(--ink)}
.ex-sub{font-size:12.5px;color:var(--muted);margin-top:4px}
.ex-sub b{color:var(--ink)}
.topnote{font-family:"Newsreader",serif;font-style:italic;font-size:14px;color:var(--ink-soft);border-left:2px solid var(--green);padding:2px 0 2px 13px;margin:2px 4px 14px;font-weight:400}
.ed-type-lbl{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.06em;font-size:10px;color:var(--muted);margin-top:10px}
.peda-section{margin:0 0 22px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.peda-section:last-of-type{border-bottom:none}
.peda-eyebrow{display:block;font-family:"Fraunces",serif;font-style:italic;font-weight:700;font-size:22px;color:var(--ink);margin:0 4px 16px;border-bottom:2px solid var(--green);padding-bottom:8px}
.peda-methods{display:flex;gap:8px;flex-wrap:wrap;margin:0 4px 6px}
.peda-mbtn{border:1px solid var(--line);background:var(--paper-2);border-radius:3px;padding:9px 14px;cursor:pointer;text-align:left;min-width:140px}
.peda-mbtn:hover{border-color:var(--ink)}
.peda-mbtn.on{border:2px solid var(--green);background:#EAF0E4}
.peda-mbtn .peda-mlabel{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:700;color:var(--ink)}
.peda-mbtn .peda-mdesc{display:block;font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35}
.peda-lead{font-family:"Newsreader",serif;font-style:italic;font-size:16px;color:var(--ink-soft);margin:0 4px 18px;max-width:680px;line-height:1.5}
.peda-lead b{font-style:normal;font-weight:700;color:var(--ink)}
.peda-flow{display:flex;align-items:stretch;gap:11px;flex-wrap:wrap;margin:6px 4px 22px;max-width:780px}
.peda-flow-step{flex:1 1 200px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--green);border-radius:3px;padding:16px 17px 18px;min-width:180px}
.peda-flow-num{display:flex;align-items:center;justify-content:center;width:29px;height:29px;border-radius:50%;background:var(--green);color:#fff;font-family:"Fraunces",Georgia,serif;font-weight:700;font-size:14px;margin-bottom:9px}
.peda-flow-step p{font-family:"Newsreader",serif;font-size:13.5px;color:var(--ink-soft);margin:0;line-height:1.5}
.peda-flow-step p.peda-flow-bet{font-family:"Spline Sans Mono",monospace;font-size:12.5px;color:var(--ink);margin-top:5px;line-height:1.4}
.peda-flow-bet b{color:var(--green)}
.peda-flow-title{display:block;font-family:"Fraunces",Georgia,serif;font-style:italic;font-weight:700;font-size:16px;color:var(--ink);margin-bottom:6px}
.peda-flow-arrow{display:flex;align-items:center;justify-content:center;padding:0 2px;color:var(--green);font-size:20px;font-weight:300;flex:0 0 auto}
@media (max-width:760px){ .peda-flow-arrow{display:none} }
.peda-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:10px 4px 0}
@media (max-width:760px){ .peda-stats-grid{grid-template-columns:repeat(2,1fr)} }
.peda-stat-card{background:var(--paper);border:1px solid var(--line);border-radius:3px;padding:12px 14px;display:flex;flex-direction:column;justify-content:space-between;gap:8px;min-height:66px}
.peda-stat-label{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;font-weight:700;color:var(--muted);line-height:1.3}
.peda-stat-value{font-family:"Spline Sans Mono",monospace;font-size:17px;font-weight:700;color:var(--ink)}
.peda-stat-value.pos{color:var(--green)}
.peda-stat-value.neg{color:var(--red)}
.cal-nav{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.cal-mbtn{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.06em;font-size:10.5px;font-weight:600;padding:6px 11px;border:1px solid var(--line);border-radius:3px;background:var(--paper-2);color:var(--muted);cursor:pointer}
.cal-mbtn:hover{border-color:var(--ink);color:var(--ink)}
.cal-mbtn.on{background:var(--green);border-color:var(--green);color:#fff}
/* width:100%/max-width (pas une largeur fixe 280/256px) : à 375px, une largeur fixe laissait les cases
   du calendrier à ~35×40px, sous le minimum de cible tactile recommandé (44×44px) — fluide + padding
   réduit, les cases montent à ~43px sur mobile et ~45px sur desktop (plafonnées par max-width). */
.cal-month-block{width:100%;max-width:340px;border:1px solid var(--line);border-radius:3px;background:var(--paper);padding:8px;margin-top:12px}
.cal-month{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700;color:var(--ink);margin:0 0 6px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;width:100%}
.cal-dow{font-size:10px;text-align:center;color:var(--muted);font-weight:600;text-transform:uppercase;padding:1px 0}
.cal-cell{border:1px solid var(--line);border-radius:3px;padding:4px 1px;text-align:center;font-family:"Spline Sans Mono",monospace;background:var(--paper-2);min-width:0;overflow:hidden}
.cal-cell.empty{border-color:transparent;background:none}
.cal-cell.has-data{cursor:pointer}
.cal-cell.has-data:hover{border-color:var(--ink)}
.cal-cell.pos{background:#EAF0E4}
.cal-cell.neg{background:#fdecec}
.cal-cell.sel{border:2px solid var(--ink)}
.cal-daynum{display:block;font-weight:700;font-size:12px;color:var(--ink)}
.cal-daynet{display:block;font-size:9px;margin-top:2px;color:var(--muted);white-space:nowrap}
.cal-daynet.pos{color:var(--green)}
.cal-daynet.neg{color:var(--red)}
/* overflow-x:auto : le tableau (cal-detail-tab) refuse de rétrécir sous la largeur minimale de son
   contenu (colonnes Heure/Course/Cheval/Mise/N° Mise/Résultat/Net) — sans conteneur de défilement
   dédié, il débordait de .cal-detail SANS être contenu, ce qui rendait TOUTE LA PAGE plus large que
   l'écran (le calendrier au-dessus se retrouvait entraîné/décalé au moindre geste de défilement
   horizontal). Signalé par Georges (capture d'écran mobile) ; contenu désormais dans cette seule boîte. */
.cal-detail{margin-top:16px;border:1px solid var(--line);border-radius:3px;background:var(--paper-2);padding:14px 16px;overflow-x:auto}
.cal-detail-head{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:8px}
.cal-detail-tab{width:100%;border-collapse:collapse;font-size:12px}
.cal-detail-tab th{text-align:left;font-family:"Spline Sans Mono",monospace;text-transform:uppercase;font-size:10px;letter-spacing:.05em;color:var(--muted);padding:4px 8px;border-bottom:1px solid var(--line)}
.cal-detail-tab td{padding:6px 8px;border-bottom:1px solid var(--line)}
.cal-detail-tab td.win{color:var(--green);font-weight:600}
.cal-detail-tab td.lose{color:var(--red)}
.cal-detail-tab td.none{color:var(--muted)}
.cal-detail-tab td.roll{color:var(--muted);font-weight:600;font-style:italic}
.mini-flow-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 4px 16px}
@media(max-width:520px){.mini-flow-grid{grid-template-columns:1fr}}
.mini-flow{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;padding:10px 12px}
.mini-flow-h{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:6px}
.mini-flow-tab{width:100%;border-collapse:collapse;font-size:12.5px;font-family:"Spline Sans Mono",monospace}
.mini-flow-tab th{text-align:left;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:3px 6px;border-bottom:1px solid var(--line)}
.mini-flow-tab td{padding:4px 6px;border-bottom:1px solid var(--line)}
.mini-flow-tab td.win{color:var(--green);font-weight:700}
.mini-flow-tab td.lose{color:var(--red)}
.rub:hover h3{color:var(--green)}
.bilan-related{margin:24px 4px 32px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.bilan-related .ed-type-lbl{flex:1 1 100%;margin:0 0 2px}

/* ---------- INSCRIPTION (home) ---------- */
.signup{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--paper-2);margin:30px 0 0}
.signup .wrap{padding:30px 26px}
.signup .su-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:30px;align-items:center}
.signup h2{font-family:"Fraunces",serif;font-weight:900;font-size:30px;letter-spacing:-.01em;margin:6px 0 8px;line-height:1.05;color:var(--ink)}
.signup p{margin:0;color:var(--ink-soft);font-size:16.5px;max-width:40ch}
.su-form{display:flex;gap:10px;flex-wrap:wrap}
.su-form input{flex:1 1 200px;padding:13px 15px;border:1.5px solid var(--ink);border-radius:3px;font-family:"Newsreader",serif;font-size:15px;background:#fff}
.su-form input:focus{outline:2px solid var(--green);outline-offset:2px;border-color:var(--green)}
.su-form button{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:12.5px;font-weight:600;background:var(--green);color:var(--paper);border:none;border-radius:3px;padding:13px 22px;cursor:pointer}
.su-form button:hover{background:var(--green-2)}
.su-form input.err{border-color:var(--red)}
.su-fine{font-family:"Spline Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;font-size:10.5px;color:var(--muted);margin-top:11px}
.su-ok{display:flex;align-items:center;gap:10px;padding:13px 16px;border:1.5px solid var(--green);border-radius:3px;background:var(--paper-2);font-family:"Newsreader",serif;font-size:15.5px;color:var(--ink)}
.su-ok b{color:var(--green);font-family:"Fraunces",serif}

@media(max-width:860px){
  .masthead .name{font-size:42px} .masthead .flank{display:none}
  .pagehead h1{font-size:32px}
  .contact{grid-template-columns:1fr}
  .contact .col{padding:0 0 20px;border-right:none;border-bottom:1px solid var(--line)}
  .contact .col.info{padding:20px 0 0}
  .soon h1{font-size:38px}
  .hero .grid,.rubriques,.signup .su-grid{grid-template-columns:1fr}
  .grid-fill{grid-template-areas:"lead" "bull" "day"}
  .hero .lead{border-right:none;border-bottom:1px solid var(--line);padding:32px 0}
  .grid-fill .daypart{border-right:none;padding:28px 0 32px}
  .hero h1{font-size:40px}
  .bulletin{padding:28px 18px 28px 0}
  .rub{padding:24px 0 !important;border-right:none !important}
}