/* Le parcours d'animation (B2, spec docs/specs/2026-10-22-parcours-saisie-cv-design.md § 3) — js/experiences/* : les trois choix d'après l'inscription,
   le QCM (un écran par question, gros boutons), les cartes facultatives, les questions de sens et la dictée, l'import de CV et son écran de validation,
   la liste des expériences. Préfixe fxp- ; jetons --f-* seulement, aucune couleur littérale (tests/charte.test.mjs) ; cibles de 44 px au moins ;
   la page prend toute la largeur de la coque (1280 px au plus, comme toute .f-page). Mouvement : seulement sans « mouvement réduit ». */

/* ---------- La page ---------- */
[data-interface="fil"] .f-page.fxp-page { padding: 16px 16px 40px; }
@media (min-width: 900px) { [data-interface="fil"] .f-page.fxp-page { padding: 28px 32px 56px; } }
[data-app] .fb.fxp { padding: 0 0 24px; }
.fxp { min-width: 0; }
.fxp-ico { display: inline-grid; place-items: center; width: 22px; height: 22px; flex: none; }
.fxp-ico svg, .fxp-option-ico svg, .fxp-porte-ico svg, .fxp-porte-fleche svg, .fxp-enregistre-ico svg, .fxp-deposer-ico svg { width: 100%; height: 100%; }

/* ---------- Tête ---------- */
.fxp-tete { display: flex; flex-direction: column; gap: 6px; margin: 0 0 20px; max-width: 760px; }
.fxp-kicker { margin: 0; color: var(--f-encre-2); font: 600 13px/1.3 Inter, system-ui, sans-serif; letter-spacing: .02em; }
[data-interface="fil"] .f-titre.fxp-titre { margin: 0; font-size: 32px; line-height: 1.12; overflow-wrap: anywhere; }
.fxp-titre:focus { outline: none; }
.fxp-lead { margin: 2px 0 0; color: var(--f-encre-2); font: 400 16px/1.5 Inter, system-ui, sans-serif; }
@media (min-width: 900px) { [data-interface="fil"] .f-titre.fxp-titre { font-size: 40px; } .fxp-lead { font-size: 17px; } }
.fxp-tete--liste { flex-direction: column; max-width: none; gap: 16px; }
.fxp-tete-textes { display: flex; flex-direction: column; gap: 6px; max-width: 720px; }
.fxp-tete-actions { display: flex; flex-wrap: wrap; gap: 8px; }
@media (min-width: 900px) { .fxp-tete--liste { flex-direction: row; align-items: flex-end; justify-content: space-between; } .fxp-tete-actions { flex: none; } }

/* ---------- Progression du QCM ---------- */
.fxp-progres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; width: min(220px, 60%); margin: 0 0 10px; }
.fxp-progres-pas { height: 4px; border-radius: 4px; background: var(--f-filet); }
.fxp-progres-pas[data-fait] { background: var(--f-encre); }
@media (prefers-reduced-motion: no-preference) { .fxp-progres-pas { transition: background-color .3s var(--f-spring); } }

/* ---------- Gros boutons du QCM ---------- */
.fxp-options { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
.fxp-options--roles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fxp-options--annees { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 560px) { .fxp-options--types { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fxp-options--annees { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1000px) {
  .fxp-options { gap: 14px; }
  .fxp-options--types { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fxp-options--roles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fxp-options--annees { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.fxp-option { position: relative; display: flex; align-items: center; gap: 14px; min-width: 0; min-height: 68px; padding: 14px 16px; border: 1px solid var(--f-filet); border-radius: 20px;
  background: var(--f-surface); color: var(--f-encre); text-align: left; font: 500 16px/1.3 Inter, system-ui, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.fxp-option:hover { background: var(--f-surface-2); border-color: color-mix(in srgb, var(--f-encre) 22%, transparent); }
.fxp-option:focus-visible { outline: 2px solid var(--f-encre); outline-offset: 2px; }
.fxp-option:disabled { cursor: default; opacity: .55; }
.fxp-option[data-envoi] { opacity: 1; border-color: var(--f-encre); box-shadow: inset 0 0 0 1px var(--f-encre); }
.fxp-option-ico { display: grid; place-items: center; width: 40px; height: 40px; flex: none; padding: 8px; border-radius: 14px; background: var(--f-surface-2); color: var(--f-encre); }
.fxp-option-texte { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fxp-option-lib { font: 600 16px/1.25 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-option-aide { color: var(--f-encre-2); font: 400 14px/1.35 Inter, system-ui, sans-serif; }
.fxp-options--types .fxp-option { min-height: 84px; }
@media (min-width: 1000px) {
  .fxp-options--types .fxp-option { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 18px; min-height: 196px; padding: 20px; border-radius: 24px; }
  .fxp-options--types .fxp-option-ico { width: 52px; height: 52px; padding: 11px; border-radius: 16px; }
  .fxp-options--types .fxp-option-lib { font-size: 19px; }
  .fxp-options--roles .fxp-option { min-height: 88px; }
}
.fxp-options--annees .fxp-option { justify-content: center; text-align: center; min-height: 72px; }
@media (min-width: 560px) { .fxp-options--annees .fxp-option { min-height: 96px; } }
.fxp-options--annees .fxp-option-texte { align-items: center; }
.fxp-options--annees .fxp-option-lib { font: 600 22px/1.1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fxp-options--annees .fxp-option[data-valeur="en_cours"] .fxp-option-lib { font-size: 17px; }
.fxp-option--liste { flex-direction: column; align-items: stretch; justify-content: center; gap: 6px; cursor: default; }
.fxp-option--liste .fxp-option-lib { text-align: center; font-size: 15px; color: var(--f-encre-2); }
.fxp-option--liste .fxp-select { min-height: 44px; padding: 6px 10px; border-radius: 12px; font-size: 15px; }
@media (prefers-reduced-motion: no-preference) {
  .fxp-option { transition: background-color .18s ease, border-color .18s ease, transform .18s var(--f-spring); }
  .fxp-option:active:not(:disabled) { transform: scale(.98); }
}

/* ---------- Pied, bandeaux, messages ---------- */
/* Les barres collées en bas se posent AU-DESSUS de la barre basse du Fil (téléphone : 62 px d'entrées + 12 px de marge + filet, plus la zone de sécurité ;
   paysage court : 44 + 4) ; au bureau (≥ 900 px) il n'y a pas de barre basse. */
:root { --fxp-bas: calc(76px + env(safe-area-inset-bottom, 0px)); }
@media (orientation: landscape) and (max-height: 500px) and (max-width: 899px) { :root { --fxp-bas: calc(50px + env(safe-area-inset-bottom, 0px)); } }
@media (min-width: 900px) { :root { --fxp-bas: 0px; } }
.fxp-pied { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 20px; }
.fxp-pied--barre { position: sticky; bottom: var(--fxp-bas); z-index: 5; margin: 20px -16px 0; padding: 12px 16px; background: color-mix(in srgb, var(--f-fond) 92%, transparent);
  border-top: 1px solid var(--f-filet); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.fxp-pied--barre > .fb-bouton { flex: 1 1 140px; }
@media (min-width: 900px) { .fxp-pied--barre { position: static; margin: 24px 0 0; padding: 0; background: none; border: 0; -webkit-backdrop-filter: none; backdrop-filter: none; } .fxp-pied--barre > .fb-bouton { flex: 0 0 auto; min-width: 160px; } }
.fxp-pied--fin { margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--f-filet); justify-content: space-between; }
.fxp-bandeau { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 16px; padding: 12px 14px; border-radius: 16px; background: var(--f-surface-2); color: var(--f-encre);
  font: 500 15px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-bandeau > span { flex: 1 1 220px; min-width: 0; }
.fxp-bandeau--action { border: 1px solid color-mix(in srgb, var(--f-encre) 18%, transparent); }
.fxp-bandeaux:empty { display: none; }
.fxp-lien { color: var(--f-encre); font-weight: 600; text-underline-offset: 3px; display: inline-flex; align-items: center; min-height: 44px; }
.fxp-message { margin: 12px 0 0; color: var(--f-encre-2); font: 500 14px/1.45 Inter, system-ui, sans-serif; }
.fxp-message[data-ton="erreur"] { color: var(--f-urgent); }
.fxp-message[data-ton="fait"] { color: var(--f-fait); }
.fxp-statut { min-height: 20px; margin: 8px 0 0; color: var(--f-encre-3); font: 500 13px/1.4 Inter, system-ui, sans-serif; }
.fxp-statut[data-ton="erreur"] { color: var(--f-urgent); }
.fxp-statut[data-ton="fait"] { color: var(--f-fait); }
.fxp-aide { margin: 2px 0 0; color: var(--f-encre-2); font: 400 14px/1.45 Inter, system-ui, sans-serif; }

/* ---------- Les trois choix ---------- */
.fxp-portes { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .fxp-portes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 8px; } }
.fxp-porte { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 92px; padding: 16px; border: 1px solid var(--f-filet); border-radius: 22px;
  background: var(--f-surface); color: var(--f-encre); text-decoration: none; -webkit-tap-highlight-color: transparent; }
.fxp-porte:hover { background: var(--f-surface-2); }
.fxp-porte:focus-visible { outline: 2px solid var(--f-encre); outline-offset: 2px; }
.fxp-porte-ico { display: grid; place-items: center; width: 48px; height: 48px; padding: 11px; border-radius: 16px; background: var(--f-surface-2); color: var(--f-encre); }
.fxp-porte-texte { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.fxp-porte-titre { font: 600 17px/1.25 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-porte-aide { color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fxp-porte-fleche { width: 20px; height: 20px; color: var(--f-encre-3); }
.fxp-porte--cv, .fxp-porte--qcm { border-color: color-mix(in srgb, var(--f-encre) 16%, transparent); }
.fxp-porte--cv .fxp-porte-ico { background: var(--f-encre); color: var(--f-fond); }
.fxp-porte--plus-tard { background: transparent; }
.fxp-porte--plus-tard .fxp-porte-ico { background: transparent; color: var(--f-encre-2); }
@media (min-width: 900px) {
  .fxp-porte { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr auto; align-items: start; gap: 22px; min-height: 260px; padding: 24px; border-radius: 28px; }
  .fxp-porte-ico { width: 60px; height: 60px; padding: 14px; border-radius: 18px; }
  .fxp-porte-titre { font-size: 21px; }
  .fxp-porte-aide { font-size: 15px; }
  .fxp-porte-fleche { justify-self: end; width: 24px; height: 24px; }
}
@media (prefers-reduced-motion: no-preference) { .fxp-porte { transition: background-color .18s ease, transform .18s var(--f-spring); } .fxp-porte:active { transform: scale(.985); } }

/* ---------- Cartes (détails, sens, validation) ---------- */
.fxp-cartes { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .fxp-cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1200px) { .fxp-cartes--cv { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fxp-carte { display: flex; flex-direction: column; min-width: 0; padding: 16px; background: var(--f-surface); border: 1px solid var(--f-filet); border-radius: 22px; }
@media (min-width: 900px) { .fxp-carte { padding: 20px; } }
.fxp-carte-titre { margin: 0 0 4px; color: var(--f-encre); font: 600 17px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
label.fxp-carte-titre { display: block; }
.fxp-section { margin-top: 24px; }
.fxp-section-titre { margin: 28px 0 10px; font: 600 19px/1.3 Inter, system-ui, sans-serif; color: var(--f-encre); }
.fxp-section > .fxp-section-titre:first-child { margin-top: 0; }
.fxp-carte.fxp-section { margin-top: 16px; }
.fxp-duo { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
.fxp-duo > .fxp-carte.fxp-section { margin-top: 16px; }
@media (min-width: 900px) { .fxp-duo { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .fxp-duo > .fxp-carte:only-child { grid-column: 1 / -1; } }

/* Puces à un geste */
.fxp-puces { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.fxp-puce { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--f-filet); border-radius: 999px; background: var(--f-surface); color: var(--f-encre);
  font: 500 15px/1.2 Inter, system-ui, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.fxp-puce:hover { background: var(--f-surface-2); }
.fxp-puce:focus-visible { outline: 2px solid var(--f-encre); outline-offset: 2px; }
.fxp-puce[aria-pressed="true"] { background: var(--f-encre); border-color: var(--f-encre); color: var(--f-fond); }
@media (prefers-reduced-motion: no-preference) { .fxp-puce { transition: background-color .15s ease, color .15s ease, transform .15s var(--f-spring); } .fxp-puce:active { transform: scale(.96); } }

/* Récapitulatif de l'expérience enregistrée */
.fxp-enregistre { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 8px 14px 8px 8px; border-radius: 999px; background: color-mix(in srgb, var(--f-fait) 12%, var(--f-surface)); color: var(--f-fait); }
.fxp-enregistre-ico { display: grid; place-items: center; width: 28px; height: 28px; padding: 5px; border-radius: 50%; background: var(--f-fait); color: var(--f-surface); }
.fxp-enregistre-texte { margin: 0; font: 600 15px/1.3 Inter, system-ui, sans-serif; }
.fxp-resume { margin: 0 0 16px; padding: 14px 16px; border-left: 3px solid var(--f-encre); border-radius: 4px 16px 16px 4px; background: var(--f-surface-2); }
.fxp-resume-titre { margin: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; }
.fxp-resume-ligne { margin: 2px 0 0; color: var(--f-encre-2); font: 400 14px/1.45 Inter, system-ui, sans-serif; }

/* Organisme */
.fxp-organisme { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.fxp-organisme-actuel { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; min-height: 48px; padding: 4px 4px 4px 14px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface-2); }
.fxp-organisme-nom { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 8px; min-width: 0; font: 600 15px/1.35 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-organisme-annuaire { color: var(--f-encre-3); font: 500 12px/1.2 Inter, system-ui, sans-serif; }
.fxp-resultats { display: flex; flex-direction: column; }
.fxp-resultats:empty { display: none; }
.fxp-resultat { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; min-height: 48px; padding: 8px 12px; border: 0; border-top: 1px solid var(--f-filet); background: none; color: var(--f-encre); text-align: left; cursor: pointer; border-radius: 10px; }
.fxp-resultat:first-child { border-top: 0; }
.fxp-resultat:hover, .fxp-resultat:focus-visible { background: var(--f-surface-2); }
.fxp-resultat-nom { font: 500 15px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-resultat-sous { color: var(--f-encre-3); font: 400 12px/1.3 Inter, system-ui, sans-serif; }
.fxp-proposes { margin-top: 8px; }
.fxp-dep { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 8px; }
.fb-saisie.fxp-departement { width: 96px; text-align: center; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.fb-saisie[aria-invalid="true"] { border-color: var(--f-urgent); }

/* Période complète (édition) */
.fxp-periode { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.fxp-periode-ligne { display: grid; grid-template-columns: 52px minmax(0, 1fr) minmax(0, 1.3fr); align-items: center; gap: 8px; }
.fxp-periode-ligne[hidden] { display: none; }
.fxp-periode-lib { color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; }
.fxp-case, .fxp-ligne-case { display: flex; align-items: center; gap: 12px; min-height: 44px; cursor: pointer; }
.fxp-case input, .fxp-ligne-case input { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--f-encre); }

/* Questions de sens et dictée */
.fxp-question .fxp-zone { margin-top: 10px; min-height: 120px; resize: vertical; }
.fxp-question-pied { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; min-height: 44px; }
.fxp-compte { margin-left: auto; color: var(--f-encre-3); font: 500 12px/1.2 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fb-bouton.fxp-micro { gap: 8px; min-height: 44px; padding: 0 14px 0 10px; border-radius: 999px; }
.fxp-micro .fxp-ico { width: 22px; height: 22px; }
.fxp-micro-temps { font-variant-numeric: tabular-nums; color: var(--f-encre-2); }
.fxp-micro-temps:empty { display: none; }
.fb-bouton.fxp-micro[data-etat="enregistre"] { background: var(--f-urgent); border-color: var(--f-urgent); color: var(--f-surface); }
.fb-bouton.fxp-micro[data-etat="enregistre"] .fxp-micro-temps { color: var(--f-surface); }
.fb-bouton.fxp-micro[data-etat="envoi"] { opacity: .8; }
@media (prefers-reduced-motion: no-preference) {
  .fb-bouton.fxp-micro[data-etat="enregistre"] .fxp-ico { animation: fxp-pouls 1.2s ease-in-out infinite; }
  @keyframes fxp-pouls { 50% { opacity: .45; } }
}
.fxp-note-dictee { min-height: 0; }
.fxp-cartes--sens .fxp-question { min-height: 100%; }

/* ---------- Import de CV : dépôt ---------- */
.fxp-depot { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .fxp-depot { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
.fxp-deposer { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 180px; margin-top: 8px; padding: 20px; border: 1.5px dashed color-mix(in srgb, var(--f-encre) 30%, transparent);
  border-radius: 18px; background: var(--f-surface-2); color: var(--f-encre); text-align: center; cursor: pointer; }
.fxp-deposer:hover, .fxp-deposer[data-survol] { border-color: var(--f-encre); background: color-mix(in srgb, var(--f-encre) 5%, var(--f-surface-2)); }
.fxp-deposer:focus-within { outline: 2px solid var(--f-encre); outline-offset: 2px; }
@media (min-width: 900px) { .fxp-deposer { min-height: 240px; } }
.fxp-deposer-ico { display: grid; place-items: center; width: 48px; height: 48px; padding: 11px; border-radius: 16px; background: var(--f-encre); color: var(--f-fond); }
.fxp-deposer-lib { font: 600 17px/1.3 Inter, system-ui, sans-serif; }
.fxp-fichier { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.fb-bouton.fxp-photo { position: relative; margin-top: 10px; overflow: hidden; }
.fxp-depot-texte .fxp-zone { flex: 1 1 auto; margin-top: 8px; min-height: 180px; resize: vertical; }
.fxp-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.fxp-lecture { margin-top: 8px; }

/* ---------- Import de CV : validation ---------- */
.fxp-carte-cv { gap: 2px; }
.fxp-carte-cv-haut { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 10px; }
.fxp-carte-cv[data-garder="false"] { background: var(--f-surface-2); border-style: dashed; }
.fxp-carte-cv[data-garder="false"] .fxp-carte-titre, .fxp-carte-cv[data-garder="false"] .fxp-faits, .fxp-carte-cv[data-garder="false"] .fxp-carte-fait { color: var(--f-encre-3); }
.fxp-carte-cv[data-erreur] { border-color: var(--f-urgent); box-shadow: inset 0 0 0 1px var(--f-urgent); }
.fxp-etiquette { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 10px; border-radius: 999px; background: var(--f-surface-2); color: var(--f-encre); font: 600 12px/1.2 Inter, system-ui, sans-serif; white-space: nowrap; }
.fxp-carte-cv[data-doublon] .fxp-etiquette { background: color-mix(in srgb, var(--f-attention) 14%, var(--f-surface)); color: var(--f-attention); }
.fxp-etiquette--retiree { color: var(--f-encre-2); }
.fxp-etiquette--anima { background: color-mix(in srgb, var(--f-preparer) 12%, var(--f-surface)); color: var(--f-preparer); }
.fxp-etiquette--discrete { background: transparent; border: 1px solid var(--f-filet); color: var(--f-encre-2); font-weight: 500; }
.fxp-faits { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; margin: 8px 0 0; font: 400 14px/1.45 Inter, system-ui, sans-serif; }
.fxp-faits dt { color: var(--f-encre-3); }
.fxp-faits dd { margin: 0; color: var(--f-encre); overflow-wrap: anywhere; }
.fxp-carte-fait { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin: 10px 0 0; color: var(--f-encre-2); font: 400 14px/1.5 Inter, system-ui, sans-serif; }
.fxp-carte-cv .fxp-actions { margin-top: auto; padding-top: 12px; }
.fxp-carte-cv .fxp-actions .fb-bouton { flex: 1 1 0; }
.fxp-garder { border-color: var(--f-encre); }
.fxp-lignes { display: flex; flex-direction: column; margin-top: 8px; }
.fxp-ligne-case { padding: 8px 0; border-top: 1px solid var(--f-filet); }
.fxp-ligne-case:first-child { border-top: 0; }
.fxp-ligne-case-texte { display: flex; flex-direction: column; min-width: 0; }
.fxp-ligne-case-lib { font: 600 15px/1.35 Inter, system-ui, sans-serif; }
.fxp-ligne-case .fxp-aide { margin: 0; }
.fxp-forts-grille { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); margin-top: 6px; }
@media (min-width: 900px) { .fxp-forts-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; } }
.fxp-forts-titre { margin: 0; color: var(--f-encre-2); font: 600 13px/1.3 Inter, system-ui, sans-serif; }
.fxp-forts-cat .fxp-puces { margin-top: 6px; }
.fxp-barre { position: sticky; bottom: var(--fxp-bas); z-index: 6; display: flex; align-items: center; gap: 12px; margin: 24px -16px 0; padding: 12px 16px;
  background: color-mix(in srgb, var(--f-fond) 92%, transparent); border-top: 1px solid var(--f-filet); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.fxp-barre-resume { flex: 1 1 auto; min-width: 0; margin: 0; color: var(--f-encre-2); font: 500 14px/1.35 Inter, system-ui, sans-serif; }
.fxp-barre .fxp-valider { flex: none; min-width: 148px; }
@media (min-width: 900px) { .fxp-barre { margin: 28px 0 0; padding: 14px 18px; border: 1px solid var(--f-filet); border-radius: 20px; bottom: 16px; } .fxp-barre .fxp-valider { min-width: 200px; } }
.fxp-ligne-justif { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; padding: 10px 0; border-top: 1px solid var(--f-filet); }
.fxp-ligne-justif:first-child { border-top: 0; }

/* Feuille « Corriger » */
.fxp-feuille { display: flex; flex-direction: column; gap: 14px; }
.fxp-feuille-champ .fxp-puces { margin-top: 6px; }
.fxp-feuille-lib { margin: 0; color: var(--f-encre-2); font: 600 13px/1.3 Inter, system-ui, sans-serif; }

/* ---------- La liste ---------- */
.fxp-compte-liste { margin: 0 0 10px; color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; }
.fxp-exps { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .fxp-exps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 1240px) { .fxp-exps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fxp-exp { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 16px; background: var(--f-surface); border: 1px solid var(--f-filet); border-radius: 22px; }
.fxp-exp[data-masquee] { background: var(--f-surface-2); border-style: dashed; }
.fxp-exp-haut { display: flex; flex-direction: column; gap: 2px; }
.fxp-exp-titre { margin: 0; font: 600 17px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-exp-periode { color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fxp-exp-org { margin: 6px 0 0; font: 500 15px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fxp-exp-details { margin: 0; color: var(--f-encre-2); font: 400 14px/1.45 Inter, system-ui, sans-serif; }
.fxp-exp-etiquettes { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fxp-exp-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 12px; }
.fxp-vide { padding: 28px 20px; border: 1.5px dashed var(--f-filet); border-radius: 22px; text-align: center; }
.fxp-vide-titre { margin: 0; font: 600 17px/1.3 Inter, system-ui, sans-serif; }