/* Plateforme Fanal (4.0.0) : pages de la connexion centrale (www), de la console d'administration (admin, accès de
   maintenance) et de l'accès de maintenance (maintenance.html). Jetons, boutons, champs, fiches et fenêtres viennent
   de fanal.css (même identité, même mode sombre) ; ici seulement la mise en page de ces pages. */
body{min-height:100dvh;display:flex;flex-direction:column}
.pf-pictos{position:absolute;width:0;height:0;overflow:hidden}
/* Bandeau (4.0.3) : le ciel et la mer du backoffice (fanal.css : .houle), immobiles ; la marque et le compte */
.pf-bandeau-haut{position:relative;background:linear-gradient(180deg,var(--ciel-haut),var(--marine) 58%,var(--ciel-bas));color:var(--creme)}
.pf-haut{display:flex;align-items:center;gap:12px;width:100%;max-width:1236px;margin:0 auto;
  padding:max(12px,env(safe-area-inset-top)) clamp(14px,3vw,28px) 6px}
.pf-marque{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none;margin-right:auto;min-width:0}
.pf-logo{width:var(--puce);height:var(--puce);border-radius:50%;background:var(--creme);display:grid;place-items:center;flex:none;
  box-shadow:0 0 0 3px var(--voile-2)}
.pf-logo img{width:82%;height:82%}
.pf-marque-txt{display:grid;min-width:0;line-height:1.1}
.pf-marque-txt > span{font:700 var(--txt-xl)/1.1 var(--serif);letter-spacing:.06em}
.pf-marque-txt small{color:var(--creme-doux);font-size:var(--txt-xs);letter-spacing:.02em;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.pf-mer{position:relative;height:30px;margin-top:-1px;overflow:hidden}
.pf-mer .houle{width:100%;animation:none}
/* Rubriques de la console : comme les onglets du backoffice (fanal.css : nav), collées en haut au défilement ; neuf
   rubriques ne tiennent pas en pastilles : sur toute la largeur, le nom court sous le picto (le nom complet est lu par
   les lecteurs d'écran) ; téléphone : barre en bas, le choisi montre son nom */
.pf-onglets{width:100%;max-width:1236px;margin:0 auto;padding:10px clamp(14px,3vw,28px) 6px;gap:2px}
.pf-onglets :is(a,button){display:flex;flex:1 1 0;min-width:0;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;padding:7px 2px 6px;background:transparent;border:1px solid transparent;border-radius:var(--rayon-m);
  color:var(--texte-2);white-space:nowrap;font-weight:700;font-size:clamp(11px,1.45vw,13.5px);text-decoration:none;cursor:pointer;
  transition:color var(--duree-2),background-color var(--duree-2),scale var(--duree-1) var(--courbe)}
.pf-onglets :is(a,button):hover{color:var(--texte);border-color:var(--trait)}
.pf-onglets :is(a,button):active{scale:.97}
.pf-onglets a[aria-current="page"]{background:var(--marine-plein);color:var(--creme);box-shadow:inset 0 0 0 1px var(--marine-plein-trait)}
.pf-onglets .ico{width:20px;height:20px;flex:none}
.pf-onglets .lib{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.pf-onglets .lib-court{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.pf-onglets .pf-onglet-plus{display:none}
@media (max-width:639px){
  .pf-onglets{max-width:none;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .pf-onglets a[data-surplus]{display:none}
  .pf-onglets :is(a,.pf-onglet-plus){display:flex;flex:1 1 0;min-width:0;min-height:48px;flex-direction:column;justify-content:center;
    gap:2px;padding:6px 2px;border:0;border-radius:var(--rayon-m);font:700 var(--txt-micro) var(--sans);overflow:hidden;
    transition:flex-grow var(--duree-3) var(--courbe),color var(--duree-2),background-color var(--duree-2)}
  .pf-onglets :is(a,button):hover{border-color:transparent}
  .pf-onglets .ico{width:22px;height:22px}
  .pf-onglets :is(a[aria-current="page"],.pf-onglet-plus.actif){flex-grow:2.4;color:var(--onglet-tel-actif);box-shadow:none;
    background:color-mix(in srgb,var(--onglet-tel-actif) 12%,transparent)}
  .pf-onglets .lib-court{max-height:1.6em;
    transition:max-height var(--duree-3) var(--courbe),opacity var(--duree-2)}
  .pf-onglets :is(a:not([aria-current="page"]),.pf-onglet-plus:not(.actif)) .lib-court{max-height:0;opacity:0}
  /* la barre ne cache rien : bas de page, bandeau d'annonce et barre d'enregistrement au-dessus d'elle */
  body:has(.pf-onglets:not(.cache)) .pf-pied{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  body:has(.pf-onglets:not(.cache)) .pf-bandeau{bottom:calc(84px + env(safe-area-inset-bottom))}
  body:has(.pf-onglets:not(.cache)) .pf-barre{bottom:calc(64px + env(safe-area-inset-bottom))}
}
/* « Plus » (téléphone) : les autres rubriques, avec ce qu'on y trouve */
.mc-rubrique svg{color:var(--texte-2)}
.mc-rubrique small{display:block;color:var(--texte-2);font-weight:400;font-size:var(--txt-s)}
.mc-rubrique[aria-current="page"]{background:color-mix(in srgb,var(--onglet-tel-actif) 10%,var(--fond))}
.mc-rubrique[aria-current="page"],.mc-rubrique[aria-current="page"] svg{color:var(--onglet-tel-actif)}
.pf-bandeau{position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom));translate:-50% 0;z-index:var(--plan-toast);
  max-width:min(92vw,560px);padding:10px 18px;border-radius:var(--rayon-l);background:var(--marine-plein);color:var(--creme);
  box-shadow:var(--ombre-l);font-weight:700}
.pf-bandeau[data-type="erreur"]{background:var(--corail-plein);color:var(--sur-couleur)}
.pf-corps{flex:1;width:100%;max-width:880px;margin:0 auto;padding:clamp(14px,3vw,26px) clamp(14px,3vw,28px) 48px;outline:none}
body[data-interface="admin"] .pf-corps,body[data-interface="maintenance"] .pf-corps{max-width:1236px}
.pf-charge{color:var(--texte-2);text-align:center;margin-top:20vh}
.pf-pied{text-align:center;color:var(--texte-2);padding:12px 0 max(12px,env(safe-area-inset-bottom))}
.pf-carte{margin:0 0 var(--esp-5);border-top:0}   /* comme les panneaux du backoffice : le liseré dit l'état d'un radiateur */
.pf-carte > h2{margin:0 0 var(--esp-3);font-size:var(--txt-2xl)}
.pf-titre{font:700 var(--txt-3xl)/1.2 var(--serif);margin:0}
.pf-corps > .pf-titre{margin-bottom:var(--esp-4)}
.pf-section{margin:var(--esp-8) 0 var(--esp-3);font-size:var(--txt-2xl)}
.pf-entete{display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:space-between;margin:0 0 var(--esp-4)}
.pf-entete .pf-titre{display:flex;align-items:center;gap:10px}
/* pages de connexion : une colonne étroite, centrée */
body[data-interface="www"] .pf-corps{max-width:560px}
body[data-interface="www"] .pf-corps:has(.pf-titre){max-width:760px}
.pf-form{display:grid;gap:var(--esp-3)}
.pf-form > *,.pf-pile > *,.pf-grille > *{min-width:0}   /* une fiche ou un champ se resserre à la largeur de l'écran */
.pf-champ{display:grid;gap:2px;min-width:0}
.pf-champ label{margin:0}
.pf-pile{display:grid;gap:var(--esp-3)}
.btn.large{width:100%;padding:12px 18px}
.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.pf-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;align-items:center;margin-top:var(--esp-2)}
.pf-actions-gauche{justify-content:flex-start}
.pf-corps > .pf-actions{margin:0 0 var(--esp-4)}   /* boutons d'une fiche (logement) au-dessus de ses cartes */
.pf-boutons{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end}
.pf-ou{display:flex;align-items:center;gap:12px;color:var(--texte-2);margin:var(--esp-2) 0;font-size:var(--txt-s)}
.pf-ou::before,.pf-ou::after{content:"";flex:1;border-top:1px solid var(--trait)}
.pf-note{color:var(--texte-2);font-size:var(--txt-s);margin:var(--esp-2) 0}
.pf-bloc{display:block;color:var(--texte-2);font-size:var(--txt-s);font-weight:400}
.pf-libelle{display:block;color:var(--texte-2);font-size:var(--txt-s)}
.pf-msg{margin:var(--esp-2) 0 0;padding:10px 14px;border-radius:var(--rayon-m);font-weight:700;font-size:var(--txt-m);
  background:color-mix(in srgb,var(--corail) 14%,var(--carte));color:var(--texte);border-left:4px solid var(--corail)}
.pf-msg[data-type="ok"]{background:color-mix(in srgb,var(--ok) 14%,var(--carte));border-left-color:var(--ok)}
.pf-msg[data-type="info"]{background:color-mix(in srgb,var(--mer) 12%,var(--carte));border-left-color:var(--mer)}
.pf-alerte{padding:10px 14px;border-radius:var(--rayon-m);background:color-mix(in srgb,var(--soleil) 18%,var(--carte));
  border-left:4px solid var(--soleil);margin:var(--esp-2) 0}
.pf-details summary{cursor:pointer;color:var(--lien);font-weight:700;padding:4px 0}
.pf-details[open] summary{margin-bottom:var(--esp-2)}
.pf-groupe{border:1px solid var(--trait);border-radius:var(--rayon-m);padding:var(--esp-3);margin:0;display:grid;gap:8px}
.pf-groupe legend{font-weight:700;padding:0 6px}
.pf-code{font:700 var(--txt-xl)/1.2 var(--mono);letter-spacing:.2em}
.pf-choix{border:1px solid var(--trait);border-radius:var(--rayon-l);padding:var(--esp-4);display:grid;gap:8px;justify-items:start}
.pf-choix p{margin:0;color:var(--texte-2)}
.pf-badge{white-space:nowrap}
.pf-badge-ok{--b:var(--vert-plein)}
.pf-badge-alerte{--b:var(--corail-plein)}
.pf-badge-brouillon{--b:var(--soleil);color:var(--sur-soleil)}
.pf-badge-actif{--b:var(--vert-plein)}
.pf-badge-suspendu{--b:var(--corail-plein)}
.pf-totp{display:grid;gap:var(--esp-3);justify-items:start}
.pf-qr{background:var(--papier);padding:8px;border-radius:var(--rayon-m);width:220px;height:220px}
.pf-secret{font:700 var(--txt-m)/1.4 var(--mono);overflow-wrap:anywhere}
.pf-etapes-liste{margin:0;padding-left:1.3em}
.pf-codes{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.pf-codes code{display:block;padding:8px 10px;border-radius:var(--rayon-s);background:var(--fond);border:1px solid var(--trait);
  font:700 var(--txt-m)/1.3 var(--mono);text-align:center}
.pf-codes-bloc{display:grid;gap:var(--esp-3);margin:var(--esp-3) 0}
.pf-liste{margin:var(--esp-2) 0;padding:0;list-style:none;display:grid;gap:8px}
.pf-liste li{padding:10px var(--esp-3);border-radius:var(--rayon-m);background:var(--fond)}
.pf-liste-actions li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.pf-liste-actions li > div:first-child{display:grid;min-width:0}
.pf-liste-actions small{color:var(--texte-2)}
.pf-ligne{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;justify-content:space-between;margin:var(--esp-2) 0}
.pf-ligne > .pf-champ,.pf-ligne > input{flex:1 1 220px}
.pf-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));gap:var(--esp-3);align-items:end}
.pf-logements{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.pf-logement{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:12px var(--esp-4);
  border-radius:var(--rayon-l);background:var(--fond);border-left:4px solid var(--galet)}
.pf-logement[data-etat="actif"]{border-left-color:var(--vert)}
.pf-logement[data-etat="brouillon"]{border-left-color:var(--soleil)}
.pf-logement[data-etat="suspendu"]{border-left-color:var(--corail)}
.pf-logement > div:first-child{display:grid;min-width:0}
.pf-logement small{color:var(--texte-2);overflow-wrap:anywhere}
.pf-logement a{text-decoration:none}
/* fenêtres */
.pf-dlg-corps{position:relative;padding:var(--esp-6) var(--esp-6) var(--esp-5);display:grid;gap:var(--esp-3)}
.pf-dlg-corps > h3{margin:0;padding-right:36px}
.pf-dlg-corps p{margin:0}
.pf-dlg-x{position:absolute;top:12px;right:12px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;
  font-size:24px;line-height:1;cursor:pointer;color:var(--texte-2)}
.pf-dlg-x:hover{background:var(--sable)}
.pf-dlg{max-height:92dvh}
.pf-dlg.pf-dlg-large{width:min(96vw,1040px)}
.pf-menu-compte .mc-maintenance{margin:0}
/* console */
.pf-tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:var(--esp-3);margin:0 0 var(--esp-5)}
.pf-tuile{display:flex;align-items:center;gap:14px;padding:14px var(--esp-4);border-radius:var(--rayon-xl);background:var(--carte);
  box-shadow:var(--ombre);color:inherit;text-decoration:none;border:1px solid transparent;
  transition:box-shadow var(--duree-2),border-color var(--duree-2),scale var(--duree-1) var(--courbe)}
.pf-tuile:hover{box-shadow:var(--ombre-l)}
.pf-tuile:active{scale:.98}
.pf-tuile-ico{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:color-mix(in srgb,var(--mer) 14%,var(--carte));color:color-mix(in srgb,var(--mer) var(--mix-texte),var(--texte))}
.pf-tuile-ico svg{width:22px;height:22px}
.pf-tuile-txt{display:grid;gap:1px;min-width:0}
.pf-tuile small{color:var(--texte-2);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:var(--txt-micro)}
.pf-tuile strong{font:700 var(--txt-xl)/1.2 var(--serif)}
.pf-tuile-txt > span{color:var(--texte-2);font-size:var(--txt-s)}
/* à voir : le picto passe au soleil, la tuile prend un filet */
.pf-tuile-alerte{border-color:color-mix(in srgb,var(--soleil) 60%,transparent)}
.pf-tuile-alerte .pf-tuile-ico{background:color-mix(in srgb,var(--soleil) 24%,var(--carte));
  color:color-mix(in srgb,var(--soleil) var(--mix-texte),var(--texte))}
.pf-table-zone{overflow-x:auto;margin:var(--esp-2) 0}
.pf-table{width:100%;border-collapse:collapse;font-size:var(--txt-m)}
.pf-table th,.pf-table td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--trait);vertical-align:top}
.pf-table thead th{font-size:var(--txt-s);color:var(--texte-2);white-space:nowrap}
.pf-table td:last-child:has(.btn){text-align:right}
.pf-table strong + .badge{margin-left:6px}
.pf-matrice td,.pf-matrice thead th{text-align:center}
.pf-matrice tbody th{font-weight:700;min-width:220px}
.pf-matrice td.pf-sensible{box-shadow:inset 0 -3px 0 var(--soleil)}
.pf-matrice input{width:20px;height:20px;accent-color:var(--marine)}
.pf-dl{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:6px 16px;margin:var(--esp-2) 0}
.pf-dl dt{color:var(--texte-2)}
.pf-dl dd{margin:0;overflow-wrap:anywhere}
.pf-stepper{list-style:none;margin:0 0 var(--esp-4);padding:0;display:flex;flex-wrap:wrap;gap:6px;counter-reset:etape}
.pf-stepper li{counter-increment:etape}
.pf-stepper li > *{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--rayon-rond);border:1px solid var(--trait);
  background:var(--carte);font:inherit;font-size:var(--txt-s);font-weight:700;color:var(--texte-2);cursor:pointer}
.pf-stepper li > span{cursor:default}
.pf-stepper li > *::before{content:counter(etape);display:grid;place-items:center;width:20px;height:20px;border-radius:50%;
  background:var(--sable);color:var(--texte);font-size:var(--txt-micro)}
.pf-stepper li[data-fait="true"] > *::before{content:"✓";background:var(--vert-plein);color:var(--sur-couleur)}
.pf-stepper li[aria-current="step"] > *{border-color:var(--contour-btn);color:var(--texte)}
.pf-cases{display:grid;gap:10px}
.pf-ligne-invitation,.pf-ligne-acces{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pf-ligne-invitation > input{flex:1 1 180px}
.pf-ligne-invitation > select,.pf-ligne-acces > select{flex:1 1 160px;width:auto}
.pf-domaine{padding:10px 0;border-bottom:1px solid var(--trait)}
.pf-domaine:last-child{border-bottom:0}
.pf-domaine .pf-ligne{margin:0;align-items:center}
.pf-procedure{margin-top:6px}
.pf-procedure code,.pf-table code{font:var(--txt-s)/1.4 var(--mono);overflow-wrap:anywhere}
.pf-corps code{overflow-wrap:anywhere}   /* adresses longues (retour de Google, Caddy) : coupées plutôt que de déborder */
.pf-pre{max-height:60dvh;overflow:auto;padding:var(--esp-3);border-radius:var(--rayon-m);background:var(--fond);
  font:var(--txt-s)/1.45 var(--mono);white-space:pre}
.pf-citation{margin:var(--esp-2) 0;padding:8px 14px;border-left:3px solid var(--trait);color:var(--texte);white-space:pre-wrap}
.pf-barre{position:sticky;bottom:0;display:flex;justify-content:flex-end;gap:10px;padding:12px 0;background:var(--fond);
  border-top:1px solid var(--trait);z-index:var(--plan-barre)}
input.pf-moyen{width:9em}
@media (max-width:560px){
  .pf-dl{grid-template-columns:1fr;gap:0}
  .pf-dl dt{font-size:var(--txt-s);margin-top:10px}
  .pf-dl dt:first-child{margin-top:0}
  .pf-dlg-corps{padding:var(--esp-5) var(--esp-4) var(--esp-4)}
  .pf-matrice tbody th{min-width:150px}
}
/* téléphone : chaque ligne d'un tableau devient une fiche (la première colonne en titre, les autres « nom : valeur »,
   les boutons en bas) ; la matrice des permissions garde ses colonnes et défile dans sa zone */
@media (max-width:639px){
  .pf-table:not(.pf-matrice) :is(tbody,tr,td){display:block;width:100%}
  .pf-table:not(.pf-matrice) thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .pf-table:not(.pf-matrice) tr{padding:12px 0;border-bottom:1px solid var(--trait)}
  .pf-table:not(.pf-matrice) tr:first-child{padding-top:4px}
  .pf-table:not(.pf-matrice) tr:last-child{border-bottom:0;padding-bottom:0}
  .pf-table:not(.pf-matrice) td{border:0;padding:2px 0}
  .pf-table:not(.pf-matrice) td[data-label]:not(:first-child){display:grid;grid-template-columns:minmax(110px,36%) minmax(0,1fr);gap:10px;
    justify-items:start;align-items:baseline}
  .pf-table:not(.pf-matrice) td[data-label]:not(:first-child)::before{content:attr(data-label);color:var(--texte-2);font-size:var(--txt-s)}
  /* après la grille (même spécificité) : une valeur vide ne laisse pas son nom seul */
  .pf-table:not(.pf-matrice) :is(td:empty,td:has(> :only-child:empty)){display:none}
  .pf-table:not(.pf-matrice) td:has(.btn){display:flex;flex-wrap:wrap;gap:6px;padding-top:8px;text-align:left}
  .pf-table:not(.pf-matrice) td:has(.btn)::before{display:none}
  .pf-table-zone:has(> .pf-table:not(.pf-matrice)){overflow:visible}
}
@media print{
  .pf-bandeau-haut,.pf-onglets,.pf-pied,.pf-actions,.pf-bandeau,.case,.pf-note{display:none !important}
  .pf-codes code{border-color:#999}
}

/* Vente (4.4.0) : offres, abonnement, textes légaux, blocs repliés des réglages, fiches clients */
.pf-kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:var(--esp-2) 0}
.pf-kv dt{color:var(--texte-2);font-size:var(--txt-s)}
.pf-kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.pf-offres{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:var(--esp-3);margin:var(--esp-2) 0}
.pf-offre{display:grid;gap:4px;justify-items:start;text-align:left;padding:var(--esp-4);border:2px solid var(--trait);
  border-radius:var(--rayon-l);background:var(--fond);color:var(--texte);cursor:pointer;font:inherit;
  transition:border-color var(--duree-2),box-shadow var(--duree-2)}
.pf-offre:hover{border-color:var(--mer)}
.pf-offre.choisie{border-color:var(--marine-plein);box-shadow:0 0 0 3px color-mix(in srgb,var(--marine-plein) 18%,transparent)}
.pf-offre strong{font-size:var(--txt-xl)}
.pf-offre p{margin:0;color:var(--texte-2)}
.pf-offre small{color:var(--texte-2)}
.pf-prix{font:700 var(--txt-2xl)/1.1 var(--serif)}
.pf-prix small{font:400 var(--txt-s) var(--sans);color:var(--texte-2)}
.pf-texte h2{margin:var(--esp-6) 0 var(--esp-2);font-size:var(--txt-xl)}
.pf-texte h3{margin:var(--esp-4) 0 var(--esp-2);font-size:var(--txt-l)}
.pf-texte p{line-height:1.55}
.pf-liste-texte{margin:var(--esp-2) 0;padding-left:1.3em;display:grid;gap:6px;line-height:1.5}
.pf-liens-legaux{text-align:center;margin-top:var(--esp-6)}
.pf-bloc-reglage{border:1px solid var(--trait);border-radius:var(--rayon-m);padding:var(--esp-3)}
.pf-bloc-reglage summary{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;color:var(--texte)}
.pf-bloc-reglage summary small{color:var(--texte-2);font-weight:400}
.pf-bloc-reglage[open] summary{margin-bottom:var(--esp-3)}
.pf-note[data-etat="ok"]{color:var(--vert-plein)}
.pf-note[data-etat="non"]{color:var(--corail-plein)}

/* --- page de statut et centre d'aide (4.4.0) --- */
.pf-page-simple .pf-corps{max-width:1100px;margin:0 auto;padding:var(--esp-4)}
.pf-statut-hero{display:grid;justify-items:center;text-align:center;gap:6px;padding:var(--esp-6) var(--esp-4);border-radius:18px;
  background:color-mix(in srgb,var(--ok,#2E7D4F) 12%,var(--fond-2));margin-bottom:var(--esp-4)}
.pf-statut-hero[data-etat="degrade"]{background:color-mix(in srgb,#C58A1A 16%,var(--fond-2))}
.pf-statut-hero[data-etat="panne"]{background:color-mix(in srgb,#B3261E 14%,var(--fond-2))}
.pf-statut-hero h1{margin:0;font:700 var(--txt-xxl,1.8rem)/1.15 var(--serif)}
.pf-statut-hero p{margin:0;color:var(--texte-2)}
.pf-statut-pastille{display:inline-block;width:14px;height:14px;border-radius:50%;background:#2E7D4F;box-shadow:0 0 0 4px color-mix(in srgb,#2E7D4F 25%,transparent)}
[data-etat="degrade"] > .pf-statut-pastille{background:#C58A1A;box-shadow:0 0 0 4px color-mix(in srgb,#C58A1A 25%,transparent)}
[data-etat="panne"] > .pf-statut-pastille{background:#B3261E;box-shadow:0 0 0 4px color-mix(in srgb,#B3261E 25%,transparent)}
.pf-statut-liste{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.pf-statut-liste li{display:flex;align-items:center;gap:12px;padding:10px 4px;border-top:1px solid var(--trait)}
.pf-statut-liste li:first-child{border-top:0}
.pf-statut-liste .pf-statut-pastille{width:10px;height:10px;box-shadow:none}
.pf-statut-nom{flex:1}
.pf-statut-etat{color:var(--texte-2);font-size:var(--txt-s)}
.pf-aide{display:grid;grid-template-columns:260px minmax(0,1fr);gap:var(--esp-4);align-items:start}
.pf-aide-sommaire{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;padding:4px}
.pf-aide-sommaire ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.pf-aide-sommaire a{display:block;padding:7px 10px;border-radius:10px;color:inherit;text-decoration:none}
.pf-aide-sommaire a:hover{background:var(--fond-2)}
.pf-aide-sommaire a.actif{background:var(--marine);color:var(--creme)}
.pf-aide-recherche input{border:1px solid var(--trait);border-radius:999px;padding:7px 14px;background:var(--fond);color:inherit;min-width:220px}
.pf-aide-fiche h1{font:700 var(--txt-xxl,1.7rem)/1.15 var(--serif);margin:0 0 var(--esp-3)}
.pf-aide-fiche h2{scroll-margin-top:12px}
.pf-texte pre{overflow:auto;padding:12px;border-radius:10px;background:var(--fond-2);font-size:var(--txt-s);line-height:1.45}
.pf-texte code{font-size:.93em;background:var(--fond-2);padding:1px 5px;border-radius:5px}
.pf-tableau-defilant{overflow:auto;margin:var(--esp-2) 0}
.pf-table{border-collapse:collapse;width:100%;font-size:var(--txt-s)}
.pf-table th,.pf-table td{text-align:left;vertical-align:top;padding:7px 10px;border-top:1px solid var(--trait)}
.pf-table th{border-top:0;color:var(--texte-2);font-weight:600}
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:820px){.pf-aide{grid-template-columns:1fr}.pf-aide-sommaire{position:static;max-height:none}
  .pf-aide-recherche input{min-width:0;width:140px}}
