/* L'ESPACE CLIENT — la feuille du client (décisions 382 à 386, doc/ESPACE-CLIENT.md). Elle prend ses couleurs, sa
   police, ses tailles, ses arrondis et ses espacements dans la charte commune (`/charte/charte.css`) ; elle n'en
   redéfinit aucun. Lisible à 360 px, des cibles de 44 px. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; font-family:var(--police-texte); font-size:var(--taille-terrain); line-height:1.45; background:var(--fond);
     color:var(--encre); min-height:100vh; display:flex; flex-direction:column;}
.bandeau{background:var(--charte-nuit); color:var(--sur-nuit); display:flex; align-items:center; gap:var(--espace-3);
         padding:var(--espace-3) var(--espace-4); min-height:56px;}
.bandeau img{display:block; height:28px; width:auto;}
.bandeau .outil{font-family:var(--police-titre); font-weight:600; color:var(--sur-nuit-doux);
                border-left:1px solid var(--sur-nuit-trait); padding-left:var(--espace-3);}
main{flex:1; width:100%; max-width:720px; margin:0 auto; padding:var(--espace-5) var(--espace-4) var(--espace-6);}
h1,h2,h3{font-family:var(--police-titre); color:var(--navy); line-height:1.25;}
h1{font-size:var(--taille-titre); margin:0 0 var(--espace-3);}
h2{font-size:var(--taille-forte); margin:var(--espace-6) 0 var(--espace-2);}
p{margin:0 0 var(--espace-3);}
a{color:var(--bleu);}
a:focus-visible,button:focus-visible,input:focus-visible{outline:var(--focus); outline-offset:2px;}
label{display:block; font-weight:600; margin:var(--espace-3) 0 var(--espace-1);}
input{width:100%; min-height:var(--tactile); font:inherit; padding:var(--espace-2) var(--espace-3);
      border:1px solid var(--trait-fort); border-radius:var(--arrondi); background:var(--blanc); color:var(--encre);}
button,.bouton{display:inline-flex; align-items:center; justify-content:center; min-height:var(--tactile);
               padding:0 var(--espace-4); font:inherit; font-weight:600; border-radius:var(--arrondi);
               border:1px solid var(--bleu); background:var(--blanc); color:var(--bleu); cursor:pointer;
               text-decoration:none;}
button.principal,.bouton.principal{background:var(--bleu); color:var(--blanc);}
button:disabled{opacity:.6; cursor:default;}
.pile{display:grid; gap:var(--espace-3); margin-top:var(--espace-4);}
.message{min-height:1.5em;}
.message.ok{color:var(--vert);}
.message.refus{color:var(--rouge);}
.avis{background:var(--ambre-pale); color:var(--encre); border-left:4px solid var(--ambre);
      border-radius:var(--arrondi); padding:var(--espace-3);}
.attente,.vide{color:var(--gris);}
.qui{color:var(--gris); margin-bottom:var(--espace-4);}
nav.onglets{display:flex; flex-wrap:wrap; gap:var(--espace-2); margin:0 0 var(--espace-4);}
nav.onglets a{display:inline-flex; align-items:center; min-height:var(--tactile); padding:0 var(--espace-3);
              border-radius:var(--arrondi-pilule); background:var(--blanc); color:var(--bleu); text-decoration:none;
              border:1px solid var(--trait);}
nav.onglets a[aria-current="page"]{background:var(--bleu); color:var(--blanc); border-color:var(--bleu);}
.cartes{list-style:none; padding:0; margin:0; display:grid; gap:var(--espace-3);}
.carte{background:var(--blanc); border-radius:var(--arrondi-grand); box-shadow:var(--ombre); padding:var(--espace-4);
       display:grid; gap:var(--espace-1);}
.carte a.titre{font-weight:600; text-decoration:none; min-height:var(--tactile); display:flex; align-items:center;}
.carte .ref{font-family:var(--police-code); font-size:var(--taille-courante); color:var(--gris);}
.carte .phase{font-weight:600; color:var(--navy);}
.carte .ensuite,.carte .detail{color:var(--gris); font-size:var(--taille-courante);}
.empreinte{font-family:var(--police-code); font-size:var(--taille-petite); overflow-wrap:anywhere; color:var(--gris);}
.pied{text-align:center; padding:var(--espace-4); font-size:var(--taille-courante);}
.pied a{display:inline-flex; align-items:center; min-height:var(--tactile);}
.deconnexion{margin-top:var(--espace-6);}