/* UI-01 réduit (Dev M365, 05/11/2026) — feuille ajoutée par une seule ligne <link> en fin de <head>.
   Choix : une <link> ne peut pas poser de classe sur <body> → on cible des conteneurs précis par sélecteur ENFANT (>)
   et des variables :root. Rien sur #pages, la jauge (#cia…), panier/paiement, bandeaux de mode, impression.
   Pas de sélecteur global, pas de !important. Couleurs : terre cuite / crème des pages existantes (branding.json n'a pas de couleurs). */
:root{--ui-acc:#a3401c;--ui-acc-h:#8a3416;--ui-txt:#2a1d14;--ui-mut:#5f5348;--ui-bg:#faf7f2;--ui-card:#ffffff;--ui-line:#e4dccf;
  --ui-font:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;--ui-r:10px;--ui-gap:14px;--ui-sh:0 1px 3px #2a1d1412,0 6px 18px #2a1d140d}
/* Mes albums (albums.html) : en-tête, cartes, boutons nommés */
body > header > button.pri,#g .c .a > button.pri{background:var(--ui-acc);border-color:var(--ui-acc);color:#fff;border-radius:var(--ui-r);font-weight:600}
body > header > button.pri:hover,#g .c .a > button.pri:hover{background:var(--ui-acc-h)}
body > header > #logout{border-radius:var(--ui-r);border-color:var(--ui-line);color:var(--ui-txt)}
#g{gap:var(--ui-gap)}
#g > .c{border-radius:14px;box-shadow:var(--ui-sh);border:1px solid var(--ui-line)}
#g > .c .n{font-family:var(--ui-font);color:var(--ui-txt)}
#g > .c .a > button{border-radius:8px}
/* Connexion (connexion.html) */
main.c{font-family:var(--ui-font);border:1px solid var(--ui-line);box-shadow:var(--ui-sh);border-radius:16px}
main.c > h1{color:var(--ui-txt);letter-spacing:-.01em}
main.c .m{color:var(--ui-mut)}
form#f > input{border-radius:var(--ui-r);border-color:var(--ui-line);padding:12px 14px}
form#f > input:focus{outline:2px solid var(--ui-acc);outline-offset:1px;border-color:var(--ui-acc)}
form#f > button#b{background:var(--ui-acc);border-color:var(--ui-acc);border-radius:var(--ui-r);font-weight:600;padding:12px 16px}
form#f > button#b:hover{background:var(--ui-acc-h)}
/* Accueil (landing.html) */
.w > header > .logo{font-family:var(--ui-font);letter-spacing:-.01em}
.hero h1{font-family:var(--ui-font);letter-spacing:-.02em;color:var(--ui-txt)}
.hero .lead{color:var(--ui-mut)}
/* Éditeur (index.html) : seulement la navigation des étapes */
nav#steps.gsteps{font-family:var(--ui-font)}
/* Mobile 375 px : on garde l'affichage existant, on resserre seulement */
@media (max-width:420px){
  #g{gap:10px}
  main.c{padding:20px 16px}
  .hero h1{font-size:30px}
  body > header > button.pri,body > header > #logout{padding:8px 10px}
}