/* 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-haut{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:max(10px,env(safe-area-inset-top)) clamp(14px,3vw,28px) 10px;
  background:linear-gradient(180deg,var(--ciel-haut),var(--ciel-bas));color:var(--creme)}
.pf-marque{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;margin-right:auto;min-width:0}
.pf-marque img{border-radius:50%;background:var(--creme);padding:3px;flex:none}
.pf-marque span{font:700 var(--txt-xl)/1 var(--serif)}
.pf-marque small{color:var(--creme-doux);font-size:var(--txt-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-nav{display:flex;flex-wrap:wrap;gap:4px;order:3;flex:1 1 100%;position:static;padding:0;background:none;overflow:visible}
.pf-nav a{color:var(--creme-fort);text-decoration:none;font-weight:700;font-size:var(--txt-s);padding:6px 12px;border-radius:var(--rayon-rond);
  border:1px solid transparent}
.pf-nav a:hover{background:var(--voile-1)}
.pf-nav a[aria-current="true"]{background:var(--voile-2);border-color:var(--voile-trait);color:var(--creme)}
@media (min-width:1000px){ .pf-nav{order:0;flex:0 1 auto} }
.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(16px,4vw,32px) clamp(14px,3vw,28px) 48px;outline:none}
body[data-interface="admin"] .pf-corps,body[data-interface="maintenance"] .pf-corps{max-width:1180px}
.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)}
.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-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-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(170px,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-qui{padding:var(--esp-6) var(--esp-6) 0}
.pf-menu-compte .mc-maintenance,.pf-menu-compte .mc-liens{padding:0 var(--esp-6)}
.pf-menu-compte .mc-maintenance{color:var(--texte-2);font-size:var(--txt-s)}
.pf-menu-compte .mc-liens{margin-top:var(--esp-4)}
.pf-menu-compte > .btn{margin:var(--esp-4) var(--esp-6) var(--esp-5)}
/* console */
.pf-tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--esp-3);margin:0 0 var(--esp-5)}
.pf-tuile{display:grid;gap:2px;padding:var(--esp-4);border-radius:var(--rayon-xl);background:var(--carte);box-shadow:var(--ombre);
  color:inherit;text-decoration:none;border-top:var(--lisere) solid var(--galet)}
.pf-tuile:hover{box-shadow:var(--ombre-l)}
.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-2xl)/1.2 var(--serif)}
.pf-tuile span{color:var(--texte-2);font-size:var(--txt-s)}
.pf-tuile-alerte{border-top-color:var(--soleil)}
.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-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-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}
  .pf-dl dd{margin-bottom:6px}
  .pf-dlg-corps{padding:var(--esp-5) var(--esp-4) var(--esp-4)}
  .pf-table td:last-child:has(.btn){text-align:left}
}
@media print{
  .pf-haut,.pf-pied,.pf-actions,.pf-bandeau,.case,.pf-note{display:none !important}
  .pf-codes code{border-color:#999}
}