html.es { --color-ink: var(--es-noir); --color-papier: var(--es-blanc); --color-bg: var(--es-blanc); --color-sep: var(--es-filet); --color-muted: var(--es-2);
--color-primary-dark: var(--es-noir); --color-focus: var(--es-noir); --color-danger: var(--es-rouge); }
.af-pastille { font-size: 11px; font-weight: 800; background: var(--es-bleu); color: var(--es-noir); border-radius: 999px; padding: 3px 9px; white-space: nowrap; }
.af-marque { flex: none; }
.af .es-tete { gap: 8px; }
.af .es-compte { min-width: 0; flex: 0 1 auto; }
.af .es-compte-t small { overflow: hidden; text-overflow: ellipsis; }
.af-cale { width: 40px; flex: none; }
.af [data-type="distributeur"] { --af-c: var(--es-vert); --af-ink: var(--es-noir); }
.af [data-type="socialShop"] { --af-c: var(--es-af-jaune); --af-ink: var(--es-encre); }
.af [data-type="utilisateur"] { --af-c: var(--es-bleu); --af-ink: var(--es-noir); }
.af-pion { width: 38px; height: 38px; border-radius: 12px; background: var(--af-c, var(--es-gris)); color: var(--af-ink, var(--es-noir)); display: flex; align-items: center;
justify-content: center; font-size: 15px; font-weight: 900; flex: none; }
.af-kicker { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: var(--es-2); }
.af-taux { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.af-type { display: flex; flex-direction: column; gap: 4px; padding: 10px 8px; border-radius: 14px; background: var(--es-gris); border-top: 4px solid var(--af-c); min-width: 0; }
.af-type b { font-size: 13px; font-weight: 800; overflow-wrap: anywhere; }
.af-type small { font-size: 11.5px; line-height: 1.3; color: var(--es-2); font-weight: 600; }
.af-champ-t { font-size: 13px; font-weight: 800; margin-bottom: -8px; }
.af-note { margin: 0; font-size: 13px; line-height: 1.45; color: var(--es-2); font-weight: 600; }
.af-client { margin: 0; font-size: 14px; line-height: 1.45; font-weight: 700; padding: 12px 14px; border-radius: 14px; background: var(--es-gris); }
.af-regles-lien { min-height: 44px; font-size: 15px; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; text-align: left; }
.af .es-err { margin: 0; }
.af-voile { align-items: flex-end; padding: 0; background: var(--es-af-voile); }
.af-feuille { width: 100%; max-width: 390px; max-height: 88dvh; overflow: auto; background: var(--es-blanc); border-radius: 24px 24px 0 0; padding: 18px 20px calc(24px + env(safe-area-inset-bottom));
display: flex; flex-direction: column; gap: 12px; }
.af-feuille-tete { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.af-feuille-tete h2 { margin: 0; font-size: 22px; font-weight: 900; letter-spacing: -0.03em; }
.af-regles { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.af-regles li { display: flex; gap: 12px; }
.af-regles li > span:first-child { width: 26px; height: 26px; border-radius: 50%; background: var(--es-bleu); color: var(--es-noir); font-size: 13px; font-weight: 900; display: flex; align-items: center; justify-content: center; flex: none; }
.af-regles li > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.af-regles b { font-size: 14.5px; font-weight: 800; }
.af-regles small { font-size: 13px; line-height: 1.45; color: var(--es-2); }
.af-av > i { background: var(--es-bleu); color: var(--es-noir); }
.af-solde { display: flex; flex-direction: column; gap: 6px; padding: 18px; border-radius: 22px; background: var(--es-noir); color: var(--es-blanc); }
.af-solde > small { font-size: 13px; font-weight: 700; color: var(--es-champ); }
.af-solde > b { font-size: 40px; font-weight: 900; letter-spacing: -0.04em; line-height: 1.05; font-variant-numeric: tabular-nums; }
.af-solde-l { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--es-champ); font-weight: 600; }
.af-solde-l b { color: var(--es-blanc); }
.af-solde .af-btn { margin-top: 8px; }
.af-solde--petit { background: var(--es-gain-doux); color: var(--es-gain); }
.af-solde--petit > small { color: var(--es-gain); }
.af-solde--petit > b { font-size: 30px; }
.af-btn { display: flex; align-items: center; justify-content: center; min-height: 48px; width: 100%; border-radius: 14px; background: var(--es-vert); color: var(--es-noir);
font-size: 15.5px; font-weight: 800; text-decoration: none; text-align: center; padding: 0 12px; }
.af-btn[aria-disabled="true"], .af-btn[data-retenu] { background: var(--es-champ); color: var(--es-noir); }
.af-btn[aria-disabled="true"] { cursor: not-allowed; }
.af-btn--gris { background: var(--es-gris); }
.af-btn--clair { background: var(--es-blanc); }
.af-deux { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.af-pourquoi { margin: 0; font-size: 13px; line-height: 1.4; font-weight: 600; }
.af-solde .af-pourquoi { color: var(--es-champ); }
.af-fait { margin: 8px 0 0; font-size: 14px; font-weight: 800; color: var(--es-vert); }
.af-alerte { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; border: 2px solid var(--es-noir); text-decoration: none; color: var(--es-noir); min-height: 56px; }
.af-alerte > i { width: 28px; height: 28px; border-radius: 50%; background: var(--es-noir); color: var(--es-blanc); display: flex; align-items: center; justify-content: center; font-style: normal; font-weight: 900; flex: none; }
.af-alerte[data-ton="attente"] { border-color: var(--es-filet); background: var(--es-gris); }
.af-alerte > span { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.af-alerte b { font-size: 14.5px; font-weight: 800; }
.af-alerte small { font-size: 12.5px; color: var(--es-2); line-height: 1.35; }
.af-alerte > em { font-style: normal; font-size: 18px; color: var(--es-2); }
.af-type-c { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; gap: 12px; align-items: stretch; padding: 12px 14px 12px 0; border-radius: 16px; border: 1px solid var(--es-filet);
text-decoration: none; color: var(--es-noir); overflow: hidden; }
.af-type-pas { background: var(--af-c); }
.af-type-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.af-type-t b { font-size: 15px; font-weight: 800; }
.af-type-t small { font-size: 12.5px; color: var(--es-2); font-weight: 600; }
.af-type-t em { font-style: normal; font-size: 12px; font-weight: 800; color: var(--es-gain); }
.af-type-g { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 2px; font-variant-numeric: tabular-nums; }
.af-type-g b { font-size: 16px; font-weight: 900; }
.af-type-g small { font-size: 12px; font-weight: 800; color: var(--es-gain); }
.af-sec { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
.af-sec b { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--es-2); }
.af-sec a { font-size: 13.5px; font-weight: 800; color: var(--es-noir); min-height: 44px; display: inline-flex; align-items: center; }
.af-liste { border: 1px solid var(--es-filet); border-radius: 16px; overflow: hidden; }
.af-liste > .es-ligne:first-child { border-top: 0; }
.af-ligne { min-height: 58px; background: var(--es-blanc); }
button.af-ligne { cursor: pointer; }
.af-plus { color: var(--es-gain); }
.af-zero { color: var(--es-2); }
.af-vide { margin: 0; padding: 16px; border-radius: 16px; background: var(--es-gris); font-size: 14px; font-weight: 600; color: var(--es-2); text-align: center; }
.af-info { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 16px; background: var(--es-gain-doux); color: var(--es-gain); }
.af-info b { font-size: 15px; font-weight: 900; }
.af-info small { font-size: 13px; line-height: 1.45; font-weight: 600; }
.af-lien, .af-kit, .af-support { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 18px; border: 1px solid var(--es-filet); }
.af-lien-t { display: flex; align-items: center; gap: 10px; min-width: 0; }
.af-lien-t > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.af-lien-t b { font-size: 15px; font-weight: 800; }
.af-lien-t small { font-size: 12.5px; color: var(--es-gain); font-weight: 800; }
.af-url { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.4; padding: 9px 10px; border-radius: 10px; background: var(--es-gris);
overflow-wrap: anywhere; word-break: break-all; }
.af-chiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0; }
.af-chiffres div { display: flex; flex-direction: column; gap: 2px; padding: 8px 6px; border-radius: 10px; background: var(--es-gris); min-width: 0; }
.af-chiffres dt { font-size: 10.5px; line-height: 1.2; font-weight: 700; color: var(--es-2); }
.af-chiffres dd { margin: 0; font-size: 14px; font-weight: 900; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.af-kit > span { display: flex; flex-direction: column; gap: 2px; padding-left: 10px; border-left: 4px solid var(--af-c); }
.af-kit b { font-size: 14.5px; font-weight: 800; }
.af-kit small { font-size: 12.5px; color: var(--es-2); }
.af-kit p { margin: 0; font-size: 13.5px; line-height: 1.5; overflow-wrap: anywhere; }
.af-puces button { min-height: 44px; padding: 0 14px; }
.af-support { align-items: stretch; }
.af-qr { align-self: center; width: 180px; height: 180px; padding: 10px; border-radius: 16px; background: var(--es-blanc); color: var(--es-noir); border: 6px solid var(--af-c); }
.af-qr svg { width: 100%; height: 100%; display: block; }
.af-support-t { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.af-support-t b { font-size: 15px; font-weight: 800; }
.af-support-t small { font-size: 13px; color: var(--es-2); }
.af-iban { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 18px; border: 1px solid var(--es-filet); }
.af-iban-t { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.af-iban-t > span:first-child { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.af-iban-t b { font-size: 14.5px; font-weight: 800; }
.af-iban-t small { font-size: 13px; color: var(--es-2); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
.af-lien-btn { min-height: 44px; padding: 0 6px; font-size: 14px; font-weight: 800; text-decoration: underline; }
.af-etat { font-style: normal; font-size: 12px; font-weight: 800; border-radius: 999px; padding: 4px 10px; background: var(--es-gris); color: var(--es-noir); white-space: nowrap; }
.af-etat[data-statut="verifie"], .af-etat[data-statut="verse"] { background: var(--es-gain-doux); color: var(--es-gain); }
.af-etat[data-statut="refuse"] { background: var(--es-rouge); color: var(--es-blanc); }
.af-champ { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 800; }
.af-champ input { height: 50px; border-radius: 12px; border: 2px solid var(--es-champ); padding: 0 12px; font: inherit; font-size: 16px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.af-champ input:focus { outline: 0; border-color: var(--es-noir); }
.af-modale { max-width: 390px; gap: 12px; }
.af-fiche { margin: 0; border: 1px solid var(--es-filet); border-radius: 14px; overflow: hidden; }
.af-fiche div { display: flex; justify-content: space-between; gap: 10px; padding: 12px 14px; border-top: 1px solid var(--es-filet); }
.af-fiche div:first-child { border-top: 0; }
.af-fiche dt { font-size: 13px; color: var(--es-2); font-weight: 700; }
.af-fiche dd { margin: 0; font-size: 14px; font-weight: 800; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.af-docs { display: flex; flex-direction: column; }
.af-docs a { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 14px; font-weight: 700; color: var(--es-noir); border-top: 1px solid var(--es-filet); }
.af-roles { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.af-role { font-size: 12.5px; font-weight: 800; border-radius: 999px; padding: 5px 11px; background: var(--es-gris); }
.af-role--affilie { background: var(--es-bleu); color: var(--es-noir); }
.af-roles a { margin-left: auto; min-height: 44px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 800; color: var(--es-noir); }
.af-sortir { min-height: 48px; font-size: 15px; font-weight: 800; color: var(--es-rouge); }
.af-table { width: 100%; border-collapse: collapse; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.af-table th { text-align: left; font-size: 11px; letter-spacing: .06em; color: var(--es-2); font-weight: 800; padding: 6px 4px; }
.af-table td { padding: 10px 4px; border-top: 1px solid var(--es-filet); font-weight: 700; }
.af-table th:not(:first-child), .af-table td:not(:first-child) { text-align: right; }
@media (max-width: 370px) {
.af-chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.af-taux { grid-template-columns: minmax(0, 1fr); }
.af-solde > b { font-size: 34px; }
}