/* Piliers : Mercato (/mercato/) et L'AJA en chiffres (/aja-en-chiffres/) */
.mer {
  --mer-in: #0F7F70; --mer-out: #C2303D; --mer-loan: #F2B33D; --mer-ret: var(--sky);
  --mer-for: var(--aja); --mer-ag: #C2303D;
  padding-top: 12px;
}
.mer-small { font-size: 15px; }
.mer-p { margin: 0; line-height: 1.5; text-wrap: pretty; }
.mer-none { margin: 0; color: var(--mut); font-size: 15px; }

/* ---------- En-tête ---------- */
.mer-head { display: flex; flex-direction: column; gap: 8px; }
.mer-h1 { margin: 0; font-stretch: 62%; font-weight: 900; font-size: clamp(40px, 6cqi, 70px); line-height: .9; text-transform: uppercase; text-wrap: balance; overflow-wrap: anywhere; }
.mer-h1__sub { display: block; margin-top: 6px; font-size: .48em; line-height: 1; color: var(--blue); }
.mer-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 15px; color: var(--mut); }
.mer-auto { display: flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: var(--sf); border: 1px solid var(--line); color: var(--ink); font-weight: 700; }
.mer-auto > span { width: 8px; height: 8px; border-radius: 50%; background: var(--mer-in); }

/* ---------- Héros + tuiles ---------- */
.mer-hero { padding: 18px clamp(16px, 4cqi, 40px) 20px; }
.mer-hero__k { position: relative; color: #C7D6EE; padding-right: 110px; }
.mer-hero__t { margin: 4px 0 14px; font-stretch: 62%; font-weight: 900; font-size: clamp(30px, 4cqi, 42px); line-height: .95; text-transform: uppercase; }
.mer-hero__empty { margin: 0; color: #C7D6EE; }
.mer-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); gap: 8px; }
.mer-tiles--8 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
@media (min-width: 700px) { .mer-tiles--8 { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 480px) { .mer-tiles, .mer-tiles--8 { grid-template-columns: 1fr 1fr; } }
.mer-tile { padding: 12px; border-radius: 14px; background: rgba(255,255,255,.08); min-width: 0; }
.mer-tile__l { display: flex; align-items: center; gap: 6px; font-size: 15px; }
.mer-tile__l i { width: 10px; height: 10px; border-radius: 3px; display: block; flex: none; }
.mer-tile__v { font-stretch: 62%; font-weight: 900; font-size: 46px; line-height: 1; }
.mer-tile__v--win { color: #7FE0C9; }
.mer-tile__v--loss { color: #FF9AA3; }
.mer-tile__s { font-size: 14px; color: #C7D6EE; line-height: 1.3; }
.mer-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 14px; }
.mer-form__l { font-size: 15px; color: #C7D6EE; }
.mer-form .form { flex-wrap: wrap; }
.mer-form .form__it { width: 30px; height: 30px; font-size: 16px; }

.mer-dot, .mer-dot--in, .mer-dot--out, .mer-dot--loan, .mer-dot--ret { display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex: none; }
.mer-dot--in { background: var(--mer-in); }
.mer-dot--out { background: var(--mer-out); }
.mer-dot--loan { background: var(--mer-loan); }
.mer-dot--ret { background: var(--mer-ret); }

/* ---------- Mise en page principale + colonne ---------- */
.mer-split { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
.mer-split__main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.mer-split__side { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.mer-split__main:empty { display: none; }

/* ---------- Mouvements ---------- */
.mer-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 8px 24px; }
.mer-col { min-width: 0; }
.mer-col__t { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-stretch: 62%; font-weight: 900; font-size: 22px; text-transform: uppercase; }
.mer-col__t .mut { font-size: 18px; }
.mer-list { list-style: none; margin: 0; padding: 0; }
.mer-mv { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 56px; padding: 6px 0; border-top: 1px solid var(--line); }
.mer-mv__txt { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.mer-mv__name { font-weight: 700; color: var(--ink); overflow-wrap: anywhere; }
a.mer-mv__name { color: var(--blue); text-decoration: none; display: inline-flex; align-items: center; min-height: 24px; }
a.mer-mv__name:hover { text-decoration: underline; }
.mer-mv__sub { font-size: 14px; color: var(--mut); overflow-wrap: anywhere; }
.mer-type { justify-self: end; padding: 3px 9px; border-radius: 999px; background: var(--sf2); color: var(--ink); font-size: 13px; font-weight: 800; font-stretch: 112%; text-transform: uppercase; white-space: nowrap; }
.mer-type--loan { background: color-mix(in srgb, var(--mer-loan) 28%, var(--sf)); }
.mer-type--ret { background: var(--hl); }
.mer-type--fee { background: var(--hero); color: #fff; text-transform: none; }

/* Historique repliable */
.mer-hist { gap: 0; }
.mer-hist .card__head { margin-bottom: 10px; }
.mer-season { border-top: 1px solid var(--line); }
.mer-season summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; min-height: 52px; padding: 12px 0; cursor: pointer; list-style: none; }
.mer-season summary::-webkit-details-marker { display: none; }
.mer-season summary::after { content: "▾"; margin-left: auto; font-weight: 800; color: var(--blue); }
.mer-season[open] summary::after { content: "▴"; }
.mer-season__t { font-stretch: 62%; font-weight: 900; font-size: 24px; line-height: 1; }
.mer-season__n { font-size: 15px; }
.mer-season__body { padding: 0 0 16px; display: flex; flex-direction: column; gap: 8px; }
.mer-win { margin: 8px 0 0; font-size: 15px; font-stretch: 112%; font-weight: 700; text-transform: uppercase; color: var(--mut); }

/* Colonne */
.mer-method { background: var(--sf2); border-radius: 20px; padding: 18px; }
.mer-method .h3 { font-size: 26px; margin-bottom: 8px; }
.mer-method p { margin: 0 0 10px; line-height: 1.55; text-wrap: pretty; }
.mer-method p:last-child { margin-bottom: 0; }
.mer-links { padding: 8px 18px; gap: 0; }
.mer-links h2 { margin: 10px 0 2px; }
.mer-links a { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 56px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.mer-links a:last-child { border-bottom: 0; }
.mer-links a:hover { color: var(--ink); }
.mer-links strong, .mer-links a > span:last-child { font-weight: 800; }
.mer-src { margin: 0; }

/* ---------- Graphique buts par quart d'heure ---------- */
.mer-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 15px; }
.mer-legend span { display: flex; align-items: center; gap: 6px; }
.mer-sw { width: 12px; height: 12px; border-radius: 3px; display: block; }
.mer-sw--for { background: var(--mer-for); }
.mer-sw--ag { background: var(--mer-ag); }
.mer-bars { margin: 0; display: flex; gap: clamp(4px, 1.6cqi, 14px); align-items: stretch; }
.mer-bars__col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.mer-bars__pair { height: 180px; display: flex; align-items: flex-end; justify-content: center; gap: 3px; border-bottom: 2px solid var(--ink); padding-top: 22px; }
.mer-bars__bar { position: relative; flex: 1 1 0; max-width: 28px; min-height: 0; border-radius: 6px 6px 0 0; }
.mer-bars__bar span { position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); padding-bottom: 2px; font-stretch: 62%; font-weight: 900; font-size: 18px; line-height: 1; color: var(--ink); }
.mer-bars__x { text-align: center; font-size: 14px; color: var(--mut); white-space: nowrap; }
@media (max-width: 420px) { .mer-bars__x { font-size: 12px; } .mer-bars__bar span { font-size: 16px; } }

/* ---------- Tableaux ---------- */
.mer-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mer-ha th[scope="row"], .mer-cmp th[scope="row"] { text-align: left; font-weight: 600; color: var(--ink); font-size: 15px; border-top: 1px solid var(--line); padding: 8px 6px; width: auto; }
.mer-ha th:first-child, .mer-cmp th:first-child { width: auto; min-width: 150px; text-align: left; }
.mer-ha td, .mer-cmp td, .mer-ha thead th, .mer-cmp thead th { width: 1%; padding-left: 14px; }
.mer-ha td, .mer-cmp td { font-stretch: 62%; font-weight: 800; font-size: 20px; white-space: nowrap; }
.mer-cmp__cur { font-weight: 900 !important; }
.mer-trend { font-size: 13px; vertical-align: 2px; }
.mer-trend--up { color: var(--winT); }
.mer-trend--down { color: var(--lossT); }

/* ---------- Cartons ---------- */
.mer-cards { display: flex; flex-direction: column; }
.mer-cards__row { display: grid; grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1fr); gap: 10px; align-items: center; min-height: 40px; border-top: 1px solid var(--line); }
.mer-cards__row--head { border-top: 0; min-height: 28px; font-size: 14px; color: var(--mut); font-weight: 700; }
.mer-cards__k { font-size: 15px; color: var(--mut); white-space: nowrap; }
.mer-cards__v { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mer-cards__v b { font-stretch: 62%; font-weight: 900; font-size: 20px; min-width: 14px; text-align: right; }
.mer-hbar { flex: 1 1 auto; min-width: 0; height: 10px; border-radius: 999px; background: var(--sf2); overflow: hidden; display: block; }
.mer-hbar i { display: block; height: 100%; border-radius: 999px; background: var(--aja); }
.mer-hbar .mer-hbar__y { background: var(--warn); }
.mer-hbar .mer-hbar__r { background: var(--loss); }

/* ---------- Schémas tactiques ---------- */
.mer-forms { list-style: none; margin: 0; padding: 0; }
.mer-forms li { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 48px; border-top: 1px solid var(--line); }
.mer-forms li:first-child { border-top: 0; }
.mer-forms__f { font-stretch: 62%; font-weight: 900; font-size: 24px; }
.mer-forms__n { font-size: 15px; color: var(--mut); white-space: nowrap; }

/* ---------- Entraîneur ---------- */
.mer-coach { gap: 10px; }
.mer-coach__name { font-stretch: 62%; font-weight: 900; font-size: 36px; line-height: .95; text-transform: uppercase; }
.mer-coach__dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 8px; }
.mer-coach__dl div { padding: 10px; border-radius: 12px; background: var(--sf2); min-width: 0; }
.mer-coach__dl dt { font-size: 14px; color: var(--mut); }
.mer-coach__dl dd { margin: 0; font-weight: 800; }